:root { --navy:#14202E; --navy2:#1E2E40; --blaze:#B84D1C; --ink:#1B1F24; --muted:#5B6570; --bg:#F4F1EA; --card:#fff;
  --good:#2E7D32; --marginal:#B26A00; --bad:#B3261E; --r-card:8px; --r-ctl:6px; --r-chip:3px; }
* { box-sizing:border-box; }
html,body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
body { min-height:100vh; } html:has(body.low) { background:#000; }
#app { max-width:560px; margin:0 auto; padding:12px 14px calc(96px + env(safe-area-inset-bottom)); }
h1 { font-size:22px; margin:6px 0 2px; }
h2 { font-size:15px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin:18px 0 8px; }
.top { display:flex; align-items:center; gap:10px; } .top .grow { flex:1; }
.logo { width:32px; height:32px; border-radius:7px; }
.muted { color:var(--muted); font-size:14px; }
.card { background:var(--card); border-radius:var(--r-card); padding:12px 14px; margin:8px 0; box-shadow:0 1px 2px rgba(0,0,0,.08); }
.hero { background:var(--navy); color:#fff; border-radius:var(--r-card); padding:14px; margin:10px 0; }
.hero .big { font-size:30px; font-weight:700; color:#F08A5D; }
.hero .sub { color:#c9d3dc; font-size:14px; margin-top:6px; }
.hero .best { border-top:1px solid rgba(255,255,255,.15); margin-top:10px; padding-top:10px; }
button { font:inherit; border:0; border-radius:var(--r-ctl); padding:12px 14px; cursor:pointer; min-height:48px; }
.primary { background:var(--blaze); color:#fff; font-weight:600; width:100%; }
.secondary { background:var(--navy2); color:#fff; }
.ghost { background:transparent; color:var(--blaze); padding:8px; min-height:40px; }
.sticky { position:fixed; left:0; right:0; bottom:0; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:linear-gradient(transparent,var(--bg) 30%); }
.sticky > * { max-width:532px; margin:0 auto; display:block; }
.chip { display:inline-block; font-size:12px; font-weight:600; padding:2px 6px; border-radius:var(--r-chip); color:#fff; }
.chip.good { background:var(--good); } .chip.marginal { background:var(--marginal); } .chip.bad { background:var(--bad); }
.list .item { display:flex; gap:10px; align-items:center; padding:10px 0; border-bottom:1px solid #e6e1d6; }
.list .item:last-child { border:0; } .list .item .grow { flex:1; }
.dot { width:10px; height:10px; border-radius:50%; background:#9aa3ab; display:inline-block; } .dot.on { background:var(--good); }
.tag { font:700 34px/1 ui-monospace,Menlo,monospace; letter-spacing:.08em; text-align:center; padding:18px 0; }
.banner { background:#FFF4D6; border-radius:var(--r-ctl); padding:8px 12px; font-size:14px; margin:8px 0; }
.err { background:#FDE7E5; color:#7A1A12; }
.timer { font:700 52px/1 ui-monospace,Menlo,monospace; text-align:center; margin:12px 0; }
.tiles { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.tile { background:var(--card); border-radius:var(--r-card); padding:10px; text-align:center; font-size:13px; }
.tile b { display:block; font-size:20px; margin:4px 0; }
.bigbtns { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:14px 0; }
.bigbtns button { min-height:84px; font-size:20px; font-weight:700; }
.small2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.sheet { position:fixed; inset:0; background:rgba(0,0,0,.45); display:flex; align-items:flex-end; z-index:10; }
.sheet[hidden] { display:none; }
.sheet .panel { background:var(--bg); width:100%; max-width:560px; margin:0 auto; border-radius:12px 12px 0 0;
  padding:16px 14px calc(16px + env(safe-area-inset-bottom)); max-height:88vh; overflow:auto; }
.grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; } .grid3 button { background:var(--card); }
.grid3 button.sel, .seg button.sel { outline:3px solid var(--blaze); outline-offset:-3px; }
.seg { display:flex; gap:6px; flex-wrap:wrap; } .seg button { background:var(--card); flex:1; min-width:70px; }
label { display:block; font-size:14px; color:var(--muted); margin:12px 0 4px; }
input,textarea { font:inherit; width:100%; padding:10px; border:1px solid #cfc8b9; border-radius:var(--r-ctl); background:#fff; }
/* Low light: dim red on black, like the app, so the screen doesn't light up the stand */
body.low, body.low .card, body.low .tile, body.low .sheet .panel, body.low .grid3 button, body.low .seg button,
body.low input, body.low textarea { background:#000 !important; color:#A31515 !important; border-color:#3a0a0a !important; box-shadow:none !important; }
body.low .hero, body.low .secondary, body.low .primary { background:#120000 !important; color:#C21A1A !important; }
body.low .muted, body.low h2, body.low .hero .big, body.low .hero .sub { color:#7A1010 !important; }
body.low .sticky { background:none; } body.low .logo { opacity:.35; }
body.low .chip { background:#3a0a0a !important; color:#C21A1A !important; }
body.low .banner { background:#1a0000; color:#A31515; }
/* Camp · Map · Buck Pole (DEER-153) */
.tabs { display:flex; gap:6px; margin:10px 0 4px; }
.tabs button { flex:1; background:var(--card); color:var(--ink); min-height:44px; font-weight:600; }
.tabs button.sel { background:var(--navy); color:#fff; }
.mapbox { width:100%; height:62vh; min-height:320px; border-radius:var(--r-card); overflow:hidden; margin:8px 0; background:#2a3440; }
.mapbox .card { margin:12px; }
.pin { border:0; cursor:pointer; padding:0; min-height:0; }
.pin.stand { background:var(--blaze); color:#fff; font:600 12px/1 system-ui,sans-serif; padding:5px 7px; border-radius:var(--r-chip);
  border:2px solid #fff; box-shadow:0 1px 3px rgba(0,0,0,.5); white-space:nowrap; min-width:24px; min-height:24px; }
.pin.stand.busy { background:var(--good); }
.pin.poi { width:24px; height:24px; border-radius:50%; background:#F2C14E; border:2px solid #fff; box-shadow:0 1px 3px rgba(0,0,0,.5); }
.pin.poi.off { background:var(--bad); }
.polegrid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.pole { display:block; text-align:left; background:var(--card); color:var(--ink); padding:0; overflow:hidden; border-radius:var(--r-card);
  box-shadow:0 1px 2px rgba(0,0,0,.08); font-size:14px; }
.pole img, .pole .nophoto { width:100%; aspect-ratio:4/3; object-fit:cover; display:block; background:#d9d3c5; }
.pole .nophoto { display:flex; }
.seg.two { display:grid; grid-template-columns:1fr 1fr; }
.seg button { padding:12px 8px; overflow-wrap:anywhere; }
.nophoto { display:flex; align-items:center; justify-content:center; color:var(--muted); font-size:13px; min-height:80px; }
.polebody { padding:8px 10px 10px; }
img.full { width:100%; border-radius:var(--r-card); margin:8px 0 2px; display:block; background:#d9d3c5; min-height:120px; }
body.low .tabs button { background:#000 !important; color:#7A1010 !important; } body.low .tabs button.sel { background:#120000 !important; color:#C21A1A !important; }
body.low .pole { background:#000 !important; color:#A31515 !important; } body.low .pole img, body.low img.full { opacity:.25; }
body.low .mapbox { filter:brightness(.35) sepia(1) hue-rotate(-50deg) saturate(4); }
