/* Plat Book. Palette: surveyor's linen, steel ink, cedar green, and one bright color,
   flagging-tape pink, reserved for the stakes you drive: deal pins and stage markers. */
:root{
  --bg:#E8EBE6; --paper:#FBFCFA; --ink:#1D272C; --muted:#5C6A6E; --faint:#8E9A9C; --line:#CDD4CF; --wash:#F1F3EF;
  --accent:#2F5D50; --accent-ink:#FFFFFF; --accent-soft:#DDE8E2;
  --flag:#E0457B; --good:#2C7A4B; --warn:#9A6A12; --bad:#B0402C;
  --serif:"Newsreader", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --sans:"Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --r-sm:4px; --r-md:8px;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
  color-scheme:light dark;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#151B1E; --paper:#1C2428; --ink:#E3E9E6; --muted:#9AA7A8; --faint:#6E7B7D; --line:#2D383C; --wash:#20292D;
    --accent:#7FB8A4; --accent-ink:#0F1A16; --accent-soft:#233630;
    --flag:#F0679A; --good:#6CC08E; --warn:#D9A84A; --bad:#E67C66;
  }
}
:root[data-theme="dark"]{
  --bg:#151B1E; --paper:#1C2428; --ink:#E3E9E6; --muted:#9AA7A8; --faint:#6E7B7D; --line:#2D383C; --wash:#20292D;
  --accent:#7FB8A4; --accent-ink:#0F1A16; --accent-soft:#233630;
  --flag:#F0679A; --good:#6CC08E; --warn:#D9A84A; --bad:#E67C66;
}
*,*::before,*::after{box-sizing:inherit}
html{height:100%; scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0; min-height:100%; background:var(--bg); color:var(--ink); font:400 15px/1.5 var(--sans); font-variant-numeric:tabular-nums; -webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit; color:inherit}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
[hidden]{display:none !important}

/* ---------- top bar ---------- */
.bar{position:sticky; top:env(safe-area-inset-top,0px); z-index:1000; display:flex; align-items:center; gap:24px; padding:10px 20px; background:var(--bg); border-bottom:1px solid var(--line)}
.brand{display:flex; align-items:center; gap:10px; font:500 21px/1 var(--serif); letter-spacing:-.01em; white-space:nowrap}
.mark{width:20px; height:20px; border-radius:3px; background:
  linear-gradient(var(--ink),var(--ink)) 0 30%/100% 1.5px no-repeat,
  linear-gradient(var(--ink),var(--ink)) 0 70%/100% 1.5px no-repeat,
  linear-gradient(var(--ink),var(--ink)) 35% 0/1.5px 100% no-repeat,
  linear-gradient(var(--ink),var(--ink)) 72% 0/1.5px 100% no-repeat;
  border:1.5px solid var(--ink); position:relative}
.mark::after{content:""; position:absolute; width:6px; height:6px; border-radius:50%; background:var(--flag); left:calc(72% - 3.5px); top:calc(50% - 3px)}
.tabs{display:flex; gap:4px}
.tabs button{border:0; background:none; padding:7px 14px; border-radius:var(--r-sm); font-weight:600; color:var(--muted); cursor:pointer}
.tabs button[aria-selected="true"]{color:var(--ink); background:var(--paper); box-shadow:inset 0 0 0 1px var(--line)}
.who{margin-left:auto; display:flex; gap:14px; align-items:center; font-size:13px; color:var(--muted); white-space:nowrap}
.who .about{color:var(--muted)}
.link{border:0; background:none; padding:0; color:var(--accent); cursor:pointer; text-decoration:underline; text-underline-offset:2px}

.btn{border:1px solid var(--accent); background:var(--accent); color:var(--accent-ink); padding:7px 14px; border-radius:var(--r-sm); font-weight:600; cursor:pointer; white-space:nowrap}
.btn.quiet{background:transparent; color:var(--accent)}
.btn.danger{background:transparent; border-color:var(--bad); color:var(--bad)}
.btn:disabled{opacity:.5; cursor:default}

/* ---------- deals layout ---------- */
.deals{display:grid; grid-template-columns:270px 1fr; min-height:calc(100vh - 57px)}
.ledger{border-right:1px solid var(--line); padding:18px 0; position:sticky; top:57px; align-self:start; max-height:calc(100vh - 57px); overflow:auto}
.ledger-head{display:flex; align-items:center; justify-content:space-between; padding:0 18px 12px}
.ledger h2{margin:0; font:600 15px/1 var(--sans)}
.deal-list{list-style:none; margin:0; padding:0}
.deal-list button{display:grid; grid-template-columns:10px 1fr auto; gap:4px 10px; align-items:baseline; width:100%; text-align:left; border:0; border-top:1px solid var(--line); background:none; padding:11px 18px; cursor:pointer}
.deal-list li:last-child button{border-bottom:1px solid var(--line)}
.deal-list button[aria-current="true"]{background:var(--paper)}
.deal-list .stake{width:8px; height:8px; border-radius:50%; background:var(--flag); align-self:center}
.deal-list .stake[data-stage="passed"]{background:var(--faint)}
.deal-list .stake[data-stage="owned"]{background:var(--accent)}
.deal-list .nm{font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.deal-list .cf{font-size:13px}
.deal-list .meta{grid-column:2 / 4; font-size:12.5px; color:var(--muted)}
.ledger-foot{padding:16px 18px 0}
.ledger-foot .fine{margin:0 0 10px}
.filebtns{display:flex; flex-wrap:wrap; gap:8px}
.filebtns .btn{padding:6px 11px; font-size:13.5px}
.ledger-empty{padding:0 18px; color:var(--muted); font-size:14px}
.pos{color:var(--good)} .neg{color:var(--bad)} .thin{color:var(--warn)}

.analyzer{padding:22px 28px 60px; min-width:0}
.sheet{max-width:1180px}
.sheet-head{display:flex; flex-wrap:wrap; gap:12px 16px; align-items:flex-end; margin-bottom:18px}
.sheet-head .title{flex:1 1 320px}
.sheet-head input.name{width:100%; border:0; border-bottom:1px solid var(--line); background:transparent; font:500 28px/1.2 var(--serif); padding:2px 0 6px; letter-spacing:-.01em}
.sheet-head input.name:focus{outline:none; border-bottom-color:var(--accent)}
.sheet-head .addr{width:100%; border:0; background:transparent; color:var(--muted); padding:6px 0 0; font-size:14px}
.sheet-head .addr:focus{outline:none; color:var(--ink)}
.mode{display:inline-flex; border:1px solid var(--line); border-radius:var(--r-sm); overflow:hidden; background:var(--paper)}
.mode button{border:0; background:none; padding:7px 12px; cursor:pointer; color:var(--muted); font-weight:600; font-size:14px}
.mode button[aria-pressed="true"]{background:var(--accent); color:var(--accent-ink)}
.stage{padding:7px 10px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--paper)}
.example{margin:0 0 18px; padding:10px 14px; background:var(--accent-soft); border-radius:var(--r-sm); font-size:14px}

.cols{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:28px; align-items:start}
.inputs fieldset{border:0; margin:0 0 22px; padding:0}
.inputs legend{font-weight:700; font-size:14px; padding:0 0 8px; width:100%; border-bottom:1px solid var(--line); margin-bottom:10px}
.row{display:grid; grid-template-columns:1fr 150px; gap:12px; align-items:center; padding:5px 0}
.row label{font-size:14px}
.row .hint{display:block; font-size:12.5px; color:var(--muted); line-height:1.35}
.field{display:flex; align-items:center; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--paper); padding:0 9px}
.field:focus-within{border-color:var(--accent); box-shadow:0 0 0 1px var(--accent)}
.field span{color:var(--muted); font-size:14px}
.field input{width:100%; min-width:0; border:0; background:none; padding:7px 4px; text-align:right}
.field input:focus{outline:none}
.units{display:flex; gap:6px; align-items:center}
.units button{width:30px; height:30px; border:1px solid var(--line); background:var(--paper); border-radius:var(--r-sm); cursor:pointer; font-weight:700}
.units output{min-width:20px; text-align:center; font-weight:600}
.unit-tag{font-size:12px; color:var(--accent); font-weight:600}

/* results */
.results-col{position:sticky; top:80px}
.verdict{background:var(--paper); border:1px solid var(--line); border-radius:var(--r-md); padding:22px 24px 20px}
.verdict p.say{margin:0; font:400 26px/1.28 var(--serif); letter-spacing:-.005em; max-width:30ch}
.verdict p.sub{margin:10px 0 0; color:var(--muted); font-size:14.5px; max-width:60ch}
.metrics{margin:16px 0 0; border-top:1px solid var(--line)}
.metric{border-bottom:1px solid var(--line)}
.metric summary{display:grid; grid-template-columns:1fr auto 18px; gap:10px; padding:9px 0; cursor:pointer; list-style:none; align-items:baseline}
.metric summary::-webkit-details-marker{display:none}
.metric summary::after{content:"?"; font-size:11px; font-weight:700; width:16px; height:16px; border-radius:50%; border:1px solid var(--faint); color:var(--muted); display:grid; place-items:center; align-self:center}
.metric[open] summary::after{content:"×"}
.metric .v{font-weight:600}
.metric .why{margin:0 0 10px; font-size:13.5px; color:var(--muted); max-width:62ch}
.block{margin-top:18px}
.block h3{font:600 14px/1.3 var(--sans); margin:0 0 6px}
.block p.fine{margin:0 0 8px}
.tbl-wrap{overflow-x:auto}
table{border-collapse:collapse; width:100%; font-size:14px}
th,td{padding:6px 0; border-bottom:1px solid var(--line); text-align:right}
th:first-child,td:first-child{text-align:left}
th{font-weight:600; color:var(--muted); font-size:13px}
.bars{display:flex; height:10px; border-radius:2px; overflow:hidden; margin:8px 0 6px; background:var(--wash)}
.bars i{display:block; height:100%}
.legend{display:flex; flex-wrap:wrap; gap:4px 14px; font-size:12.5px; color:var(--muted)}
.legend b{display:inline-block; width:9px; height:9px; border-radius:2px; margin-right:5px; vertical-align:-1px}
.notes textarea{width:100%; min-height:90px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--paper); padding:9px 11px; resize:vertical}
.foot{display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; align-items:center}
.fine{font-size:12.5px; color:var(--muted)}

/* ---------- map ---------- */
.mapview{position:relative; height:calc(100vh - 57px)}
@supports (height:100dvh){ .mapview{height:calc(100dvh - 57px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))} }
#map{position:absolute; inset:0; background:var(--wash)}
.mappanel{position:absolute; z-index:500; top:14px; left:14px; width:320px; max-height:calc(100% - 28px); overflow:auto; background:var(--paper); border:1px solid var(--line); border-radius:var(--r-md); padding:12px 14px; box-shadow:0 6px 24px rgba(20,30,34,.14)}
.search{display:flex; gap:6px}
.search input{flex:1; min-width:0; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--bg); padding:7px 10px}
.results{list-style:none; margin:8px 0 0; padding:0; border-top:1px solid var(--line)}
.results button{width:100%; text-align:left; border:0; border-bottom:1px solid var(--line); background:none; padding:8px 2px; cursor:pointer; font-size:13.5px}
.layers{margin-top:12px; border-top:1px solid var(--line); padding-top:10px}
.layers summary{font-weight:700; font-size:14px; cursor:pointer}
.basepick{display:flex; border:1px solid var(--line); border-radius:var(--r-sm); overflow:hidden; margin:8px 0 6px}
.basepick label{flex:1; position:relative; cursor:pointer}
.basepick input{position:absolute; opacity:0; inset:0; cursor:pointer}
.basepick span{display:block; text-align:center; padding:6px 4px; font-size:13.5px; font-weight:600; color:var(--muted)}
.basepick input:checked + span{background:var(--accent); color:var(--accent-ink)}
.basepick input:focus-visible + span{outline:2px solid var(--accent); outline-offset:-2px}
.zoomhint{margin:6px 0 0; padding:7px 9px; background:var(--accent-soft); border-radius:var(--r-sm); color:var(--ink)}
.layer{display:flex; align-items:center; gap:9px; padding:6px 0; font-size:14px; cursor:pointer}
.layer input{accent-color:var(--accent); width:16px; height:16px}
.layer i{width:14px; height:10px; border-radius:2px; flex:none}
.sources{padding-left:18px; margin:8px 0; font-size:13.5px}
.sources li{margin:3px 0}

.leaflet-container{font:inherit; background:var(--wash)}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:var(--paper); color:var(--ink); border-radius:var(--r-md)}
.leaflet-popup-content{margin:12px 14px; min-width:220px; font-size:14px; line-height:1.45}
.pop h4{margin:0 0 2px; font:500 17px/1.25 var(--serif)}
.pop .addr{color:var(--muted); font-size:13px; margin-bottom:8px}
.pop dl{display:grid; grid-template-columns:auto 1fr; gap:3px 10px; margin:0 0 10px; font-size:13.5px}
.pop dt{color:var(--muted)} .pop dd{margin:0; font-weight:600}
.pop dd small{display:block; font-weight:400; color:var(--muted)}
.pop .acts{display:flex; flex-wrap:wrap; gap:6px 12px; align-items:center}
.pop .acts .btn{padding:5px 10px; font-size:13.5px}
.pin{width:16px; height:16px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); background:var(--flag); border:2px solid var(--paper); box-shadow:0 1px 3px rgba(0,0,0,.35)}
.pin.passed{background:var(--faint)} .pin.owned{background:var(--accent)}
.okc-layer{pointer-events:none}

/* ---------- sign-in + toast ---------- */
.veil{position:fixed; inset:0; z-index:2000; background:var(--bg); display:grid; place-items:center; padding:24px}
.signin{width:100%; max-width:360px}
.signin h1{font:500 34px/1.1 var(--serif); margin:0 0 6px; letter-spacing:-.015em}
.signin p{color:var(--muted); margin:0 0 20px}
.signin label{display:block; font-size:13.5px; font-weight:600; margin:12px 0 5px}
.signin input{width:100%; border:1px solid var(--line); background:var(--paper); border-radius:var(--r-sm); padding:10px 12px}
.signin .btn{width:100%; margin-top:18px; padding:10px}
.signin .err{color:var(--bad); font-size:14px; margin:12px 0 0; min-height:1.4em}
.signin .alt{display:flex; justify-content:space-between; margin-top:14px; font-size:14px}
.toast{position:fixed; z-index:2100; left:50%; bottom:calc(20px + env(safe-area-inset-bottom,0px)); transform:translate(-50%,20px); opacity:0; background:var(--ink); color:var(--bg); padding:9px 16px; border-radius:var(--r-sm); font-size:14px; width:max-content; max-width:min(92vw,520px); text-align:center; transition:opacity .2s, transform .2s; pointer-events:none}
.toast.show{opacity:1; transform:translate(-50%,0)}

/* ---------- small screens ---------- */
@media (max-width:1080px){
  .cols{grid-template-columns:1fr}
  .results-col{position:static; order:-1}
}
@media (max-width:760px){
  .bar{gap:12px; padding:10px 14px; flex-wrap:wrap}
  .who{width:100%; order:3; margin-left:0; justify-content:space-between}
  .deals{display:block}
  .ledger{position:static; max-height:none; border-right:0; border-bottom:1px solid var(--line); padding:14px 0}
  .deal-list{max-height:220px; overflow:auto}
  .analyzer{padding:18px 16px 50px}
  .row{grid-template-columns:1fr 128px}
  .verdict{padding:18px}
  .verdict p.say{font-size:22px}
  .mapview{height:calc(100vh - 92px)}
  .mappanel{top:auto; bottom:10px; left:10px; right:10px; width:auto; max-height:46%}
}
@media (prefers-reduced-motion:reduce){ .toast{transition:none} }
