:root{
  --navy:#1e3a5f; --accent:#2e7d32; --bg:#f5f6f8; --card:#fff; --line:#dde2e8;
  --text:#1c2430; --muted:#68727e; --danger:#c62828;
  --tabbar-h: calc(56px + env(safe-area-inset-bottom));
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent}
html,body{margin:0; height:100%; font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans JP",sans-serif; background:var(--bg); color:var(--text); overscroll-behavior:none}
.hidden{display:none !important}
.muted{color:var(--muted); font-size:13px; line-height:1.6}
.err{color:var(--danger); font-size:13px; min-height:1em}

.topbar{position:fixed; top:0; left:0; right:0; height:calc(48px + env(safe-area-inset-top)); padding-top:env(safe-area-inset-top);
  background:var(--navy); color:#fff; display:flex; align-items:center; justify-content:space-between; padding-left:16px; padding-right:12px; z-index:20; font-weight:600}
.view{position:fixed; top:calc(48px + env(safe-area-inset-top)); bottom:var(--tabbar-h); left:0; right:0; overflow-y:auto}
#view-map{overflow:hidden}
#map{width:100%; height:100%}

.tabbar{position:fixed; bottom:0; left:0; right:0; height:var(--tabbar-h); padding-bottom:env(safe-area-inset-bottom);
  background:#fff; border-top:1px solid var(--line); display:flex; z-index:20}
.tab{flex:1; border:0; background:none; font-size:20px; color:var(--muted); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; cursor:pointer}
.tab span{font-size:10px}
.tab.active{color:var(--navy); font-weight:700}

.map-fabs{position:absolute; bottom:20px; left:0; right:0; display:flex; justify-content:center; gap:10px; z-index:10; pointer-events:none}
.fab{pointer-events:auto; border:0; border-radius:24px; height:48px; padding:0 14px; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.25); font-size:18px; cursor:pointer}
.fab.big{background:var(--navy); color:#fff; font-size:15px; font-weight:700; padding:0 20px}

.toolbar{display:flex; gap:8px; padding:10px 12px; position:sticky; top:0; background:var(--bg); z-index:5}
.toolbar input[type=search]{flex:1; border:1px solid var(--line); border-radius:8px; padding:9px 12px; font-size:15px}
.toolbar select{border:1px solid var(--line); border-radius:8px; padding:9px 8px; font-size:14px; background:#fff; max-width:40%}

.list{list-style:none; margin:0; padding:0 12px 24px}
.list li{background:var(--card); border:1px solid var(--line); border-radius:10px; padding:12px 14px; margin-bottom:8px; cursor:pointer}
.list li .row1{display:flex; justify-content:space-between; gap:8px; font-weight:600; font-size:15px}
.list li .row2{color:var(--muted); font-size:13px; margin-top:4px; line-height:1.5; word-break:break-all}
.list.sub li{cursor:default}
.badge{font-size:11px; font-weight:700; padding:2px 8px; border-radius:10px; color:#fff; white-space:nowrap; align-self:flex-start}
.empty{text-align:center; color:var(--muted); padding:48px 24px; font-size:14px}

.settings{padding:16px; max-width:560px; margin:0 auto}
.settings h2{font-size:15px; margin:22px 0 8px; border-bottom:1px solid var(--line); padding-bottom:6px}
.settings .btn{margin:4px 6px 4px 0}

.btn{border:1px solid var(--line); background:#fff; border-radius:8px; padding:10px 16px; font-size:15px; cursor:pointer; color:var(--text)}
.btn.primary{background:var(--navy); border-color:var(--navy); color:#fff; font-weight:700}
.btn.danger{background:none; border:0; color:var(--danger); margin-top:10px; width:100%}
.btn.small{padding:6px 12px; font-size:13px; background:rgba(255,255,255,.15); border-color:rgba(255,255,255,.4); color:#fff}

dialog{border:0; border-radius:14px; padding:0; width:min(92vw,480px); max-height:86vh; overflow-y:auto}
dialog::backdrop{background:rgba(0,0,0,.45)}
dialog form, dialog .detail{padding:20px}
dialog h2{margin:0 0 14px; font-size:17px}
dialog h3{font-size:14px; margin:18px 0 8px}
dialog label{display:block; font-size:13px; font-weight:600; color:var(--muted); margin-bottom:12px}
dialog label input, dialog label select, dialog label textarea{display:block; width:100%; margin-top:4px; border:1px solid var(--line); border-radius:8px; padding:10px; font-size:16px; font-family:inherit; background:#fff; color:var(--text)}
dialog label.check{display:flex; align-items:center; gap:8px; font-weight:400; font-size:14px; color:var(--text)}
dialog label.check input{width:auto; margin:0}
.dlg-btns{display:flex; gap:10px; justify-content:flex-end; margin-top:8px}
.dlg-btns .btn{min-width:96px}

.lock{position:fixed; inset:0; background:var(--navy); z-index:100; display:flex; align-items:center; justify-content:center}
.lock-box{text-align:center; color:#fff; padding:24px}
.lock-box h1{font-size:22px}
.lock-box input{font-size:24px; text-align:center; letter-spacing:8px; border:0; border-radius:10px; padding:12px; width:200px; margin:12px 0}
.lock-box .btn{display:block; margin:8px auto; width:200px}

.pin-marker{width:22px; height:22px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); border:2px solid #fff; box-shadow:0 1px 4px rgba(0,0,0,.4); cursor:pointer}

#csv-map-fields label{display:flex; align-items:center; gap:10px; font-size:14px; margin-bottom:10px; font-weight:600}
#csv-map-fields select{flex:1; margin-top:0}

.sheet-btns{display:flex; flex-direction:column; gap:10px; margin-top:12px}
.sheet-btns .btn{width:100%; padding:13px}
.row2col{display:flex; gap:10px}
.row2col label{flex:1}
.rank-badge{display:inline-block; min-width:22px; text-align:center; font-size:12px; font-weight:800; padding:2px 6px; border-radius:6px; color:#fff; margin-right:6px}
.person-marker{width:16px; height:16px; border-radius:50%; border:2.5px solid #fff; box-shadow:0 1px 4px rgba(0,0,0,.45); cursor:pointer}

.fab.rec{background:#2e7d32; color:#fff; font-weight:700}

.relocate{position:absolute; top:10px; left:50%; transform:translateX(-50%); z-index:15; background:#1e3a5f; color:#fff; padding:10px 14px; border-radius:24px; font-size:13px; font-weight:700; box-shadow:0 2px 8px rgba(0,0,0,.3); display:flex; align-items:center; gap:10px; white-space:nowrap}
.btn.small2{padding:4px 10px; font-size:12px; background:rgba(255,255,255,.2); border:1px solid rgba(255,255,255,.5); color:#fff; border-radius:14px}
