/* Layout: one-screen tool — map left, working panel right (stacks under the map on phones). Team Fitz look: dark graphite + lime. */
:root{
  --bg:#141619; --panel:#1b1e22; --raise:#23272c; --line:#30353c;
  --fg:#e7eae4; --muted:#8d948b; --lime:#c8f43a; --lime-dim:#c8f43a33;
  --cyan:#5ccbff; --amber:#ffb84d; --red:#ff6b5e; --pink:#ff8bd1;
  --f-display:"Barlow Condensed","Arial Narrow",sans-serif;
  --f-body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
[hidden]{display:none!important}
body{background:var(--bg);color:var(--fg);font-family:var(--f-body);font-size:14px;padding-top:env(safe-area-inset-top,0px)}
button,input,select,textarea{font:inherit;color:inherit}
.app{height:100%;display:grid;grid-template-rows:auto 1fr;min-height:0}
header{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;padding:10px 16px;border-bottom:1px solid var(--line);background:var(--panel)}
.brand{display:flex;align-items:baseline;gap:12px;min-width:0}
.brand h1{font-family:var(--f-display);font-weight:700;font-size:24px;letter-spacing:.02em;margin:0;text-transform:uppercase;white-space:nowrap}
.brand h1 b{color:var(--lime)}
.sync{color:var(--muted);font-size:12px}
.sync.warn{color:var(--amber)}
.tools{display:flex;flex-wrap:wrap;gap:6px;margin-left:auto}
.tool{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border:1px solid var(--line);border-radius:6px;background:var(--raise);cursor:pointer;font-size:13px;white-space:nowrap}
.tool:hover{border-color:#4a515a}
.tool[aria-pressed="true"]{background:var(--lime);color:#121410;border-color:var(--lime);font-weight:600}
.tool kbd{font-family:var(--f-mono);font-size:10px;opacity:.6}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:6px;overflow:hidden;margin-right:6px}
.seg button{padding:7px 12px;background:var(--raise);border:0;cursor:pointer;font-family:var(--f-display);font-weight:700;font-size:14px;letter-spacing:.06em}
.seg button[aria-pressed="true"]{background:var(--fg);color:#121410}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
main{display:grid;grid-template-columns:minmax(0,1fr) 390px;min-height:0}
.mapwrap{position:relative;min-height:0;overflow:hidden;background:#0e1012}
#map{position:absolute;inset:0;background:#0e1012}
#view3d{position:absolute;inset:0;background:#0e1012;z-index:1100}
#c3d{width:100%;height:100%;display:block;touch-action:none}
.cam{position:absolute;left:12px;top:12px;display:flex;gap:4px;flex-wrap:wrap}
.cam button{padding:6px 10px;border-radius:6px;border:1px solid var(--line);background:#1b1e22ee;cursor:pointer;font-size:12px}
.note3d{position:absolute;left:12px;bottom:12px;right:12px;max-width:540px;font-size:11.5px;color:var(--muted);background:#141619d9;border:1px solid var(--line);border-radius:6px;padding:6px 9px}
.hud{position:absolute;left:12px;bottom:24px;z-index:600;pointer-events:none}
.readout{background:#141619e6;border:1px solid var(--line);border-radius:6px;padding:8px 10px;font-family:var(--f-mono);font-size:12px;line-height:1.5;min-width:220px}
.readout .big{font-family:var(--f-display);font-size:22px;font-weight:600;color:var(--lime);letter-spacing:.02em}
.readout .k{color:var(--muted)}
.layers{position:absolute;right:12px;bottom:24px;z-index:600;background:#141619ea;border:1px solid var(--line);border-radius:6px;padding:9px 10px;display:flex;flex-direction:column;gap:6px;font-size:12px;max-width:220px}
.layers label{color:var(--muted);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase}
.layers label.chk{display:flex;align-items:center;gap:7px;cursor:pointer;color:var(--fg);font-size:12px;letter-spacing:0;text-transform:none}
.layers input[type=range]{accent-color:var(--lime);width:100%}
.layers select{background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:5px 6px;font-size:12px}
.hint{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:700;background:var(--lime);color:#121410;font-weight:600;font-size:12px;padding:6px 12px;border-radius:999px;pointer-events:none;white-space:nowrap;max-width:calc(100% - 40px);overflow:hidden;text-overflow:ellipsis}
aside{border-left:1px solid var(--line);background:var(--panel);display:flex;flex-direction:column;min-height:0;min-width:0}
.tabs{display:flex;border-bottom:1px solid var(--line)}
.tabs button{flex:1;padding:11px 8px;background:none;border:0;border-bottom:2px solid transparent;cursor:pointer;font-family:var(--f-display);font-size:16px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tabs button[aria-selected="true"]{color:var(--fg);border-bottom-color:var(--lime)}
.pane{overflow:auto;padding:14px 16px 24px;display:flex;flex-direction:column;gap:14px;min-height:0;flex:1}
h2{font-family:var(--f-display);font-size:19px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;margin:0;text-wrap:balance}
h3{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0;font-weight:600}
p{margin:0;line-height:1.5}
.muted{color:var(--muted)}
.small{font-size:12px}
.sec{display:flex;flex-direction:column;gap:8px}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.between{justify-content:space-between}
.field{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.field label{font-size:11px;color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
input[type=text],input[type=number],input[type=password],select,textarea{background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:7px 9px;width:100%;min-width:0}
textarea{resize:vertical;min-height:64px;line-height:1.45}
.btn{padding:7px 12px;border-radius:6px;border:1px solid var(--line);background:var(--raise);cursor:pointer;font-size:13px}
.btn.small{padding:5px 9px;font-size:12px}
.btn.primary{background:var(--lime);border-color:var(--lime);color:#121410;font-weight:600}
.btn.danger{color:var(--red)}
.btn:disabled{opacity:.45;cursor:default}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:6px;overflow:hidden}
.stats div{background:var(--bg);padding:8px 10px}
.stats .n{font-family:var(--f-display);font-size:24px;font-weight:600;font-variant-numeric:tabular-nums}
.stats .l{font-size:10px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:12.5px}
th{text-align:right;font-weight:500;color:var(--muted);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;padding:5px 4px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--panel)}
th:first-child,td:first-child{text-align:left}
td{text-align:right;padding:5px 4px;border-bottom:1px solid #262a30;font-family:var(--f-mono)}
td:first-child{font-family:var(--f-body)}
tr.click{cursor:pointer}
tr.click:hover td{background:var(--raise)}
tr.sel td{background:var(--lime-dim)}
.list{display:flex;flex-direction:column;gap:6px}
.card{border:1px solid var(--line);border-radius:6px;padding:9px 11px;background:var(--bg);cursor:pointer;display:flex;flex-direction:column;gap:3px}
.card:hover{border-color:#4a515a}
.card.on{border-color:var(--lime)}
.card .t{font-weight:600}
.el{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;padding:7px 9px;border:1px solid var(--line);border-radius:6px;background:var(--bg);cursor:pointer}
.el.on{border-color:var(--lime)}
.el .ic{width:10px;height:10px;border-radius:50%}
.el .d{font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.box{border:1px solid var(--line);border-radius:6px;padding:10px;display:flex;flex-direction:column;gap:8px}
.status{font-size:12px;color:var(--muted)}
.status.warn{color:var(--amber)}
.empty{border:1px dashed var(--line);border-radius:6px;padding:14px;color:var(--muted);line-height:1.5}
.confirm{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:12px}
.gate{position:fixed;inset:0;z-index:2000;background:#0e1012f2;display:grid;place-items:center;padding:16px}
.gatebox{width:min(360px,100%);background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:20px;display:flex;flex-direction:column;gap:12px}
/* map labels */
.leaflet-container{font-family:var(--f-body);background:#0e1012}
.lbl{background:#141619d9;border:0;border-radius:4px;color:#fff;font-family:var(--f-mono);font-size:11px;font-weight:600;padding:2px 6px;box-shadow:none;white-space:nowrap}
.lbl::before{display:none}
.lbl b{color:var(--lime);font-weight:600;margin-left:5px}
.lbl.sel{color:var(--lime)}
.gridlbl{background:transparent;border:0;box-shadow:none;color:#fff;font-family:var(--f-mono);font-size:11px;font-weight:600;text-shadow:0 0 3px #000,0 0 3px #000}
.gridlbl::before{display:none}
.mlbl{background:#141619e6;border:0;color:var(--cyan);font-family:var(--f-mono);font-size:12px;font-weight:600;box-shadow:none}
.mlbl::before{display:none}
.spot-ic{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle,#fff 0 5px,#c8f43a55 6px);border:2px solid var(--lime);cursor:grab}
.aim-ic{width:16px;height:16px;border-radius:50%;border:2px solid var(--lime);background:#141619;cursor:grab}
.h-ic{width:12px;height:12px;border-radius:50%;border:2px solid currentColor;background:#141619;cursor:grab}
.mk-ic{width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-top:14px solid var(--pink);cursor:grab}
.me-ic{width:16px;height:16px;border-radius:50%;background:#3d9bff;border:3px solid #fff;box-shadow:0 0 0 4px #3d9bff55}
@media (max-width:860px){
  .app{height:auto;min-height:100%}
  main{grid-template-columns:1fr;grid-template-rows:62vh auto}
  aside{border-left:0;border-top:1px solid var(--line)}
  .pane{overflow:visible}
  .layers{bottom:28px;top:auto;right:8px;padding:7px 8px;gap:5px;max-width:170px}
  .layers label:first-child,.layers label.chk:nth-of-type(4){display:none}
  .hud{display:none}
  .readout{min-width:0}
  .tool kbd{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
