/* ASIP Pilot Dashboard — ห้องปฏิบัติการตำรวจ: กรมท่า + ทอง (สีประจำเอกสาร ASIP) บนพื้นเทาอมฟ้า
   Layout: แถบบนติดหน้าจอ (โลโก้ · เลือกพื้นที่ · สถานะสด) + รางเมนูซ้าย (มือถือเป็นแท็บเลื่อนแนวนอน) + เนื้อหาเป็นแผงข้อมูล */
:root{
  --bg:#f2f4f8; --surface:#ffffff; --surface-2:#eaeef4; --ink:#121c2e; --ink-2:#44506a; --muted:#737e94; --line:#dbe0e8; --grid:#e5e9f0; --axis:#c3c9d4;
  --accent:#123255; --accent-2:#1d4a7c; --accent-ink:#ffffff; --gold:#9c7420; --gold-soft:#f6eedc;
  --good:#0ca30c; --good-t:#0b6b0b; --good-bg:#e4f4e4; --warn:#e9a20f; --warn-t:#8a5a00; --warn-bg:#fcf1d9; --bad:#d03b3b; --bad-t:#a32525; --bad-bg:#fbe6e6; --idle-bg:#eceff4;
  --c1:#2a78d6; --c2:#eb6834; --c3:#1baf7a; --c4:#eda100; --c5:#e87ba4; --c6:#4a3aa7; --seq-lo:#e3edfb; --seq-hi:#104281;
  --f-display:"Chakra Petch","IBM Plex Sans Thai","Leelawadee UI",sans-serif;
  --f-body:"IBM Plex Sans Thai","Leelawadee UI","Tahoma",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,"Consolas",monospace;
  --r:10px; --shadow:0 1px 2px rgba(18,28,46,.06),0 4px 14px rgba(18,28,46,.05);
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0a111d; --surface:#111a2a; --surface-2:#172238; --ink:#e7ecf5; --ink-2:#b2bdd1; --muted:#8290a8; --line:#243049; --grid:#1d2840; --axis:#34415e;
  --accent:#8db3ee; --accent-2:#a9c6f3; --accent-ink:#0a111d; --gold:#d8ae55; --gold-soft:#2a2414;
  --good:#22b422; --good-t:#5fd35f; --good-bg:#12301a; --warn:#f0b43a; --warn-t:#f3c66b; --warn-bg:#33270f; --bad:#e25b5b; --bad-t:#f08a8a; --bad-bg:#3a1717; --idle-bg:#1b2639;
  --c1:#3987e5; --c2:#d95926; --c3:#199e70; --c4:#c98500; --c5:#d55181; --c6:#9085e9; --seq-lo:#16233d; --seq-hi:#6da7ec;
  --shadow:0 1px 2px rgba(0,0,0,.4); color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0a111d; --surface:#111a2a; --surface-2:#172238; --ink:#e7ecf5; --ink-2:#b2bdd1; --muted:#8290a8; --line:#243049; --grid:#1d2840; --axis:#34415e;
  --accent:#8db3ee; --accent-2:#a9c6f3; --accent-ink:#0a111d; --gold:#d8ae55; --gold-soft:#2a2414;
  --good:#22b422; --good-t:#5fd35f; --good-bg:#12301a; --warn:#f0b43a; --warn-t:#f3c66b; --warn-bg:#33270f; --bad:#e25b5b; --bad-t:#f08a8a; --bad-bg:#3a1717; --idle-bg:#1b2639;
  --c1:#3987e5; --c2:#d95926; --c3:#199e70; --c4:#c98500; --c5:#d55181; --c6:#9085e9; --seq-lo:#16233d; --seq-hi:#6da7ec;
  --shadow:0 1px 2px rgba(0,0,0,.4); color-scheme:dark}
*{box-sizing:border-box}
.plan-workspace,.plan-workspace>*{min-width:0;overflow-wrap:anywhere}
.plan-workspace code,.plan-workspace pre{white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}
.plan-fields{border:0;padding:0;margin:0;min-width:0;display:grid;gap:16px}
.plan-fields label,.plan-action label{display:flex;flex-direction:column;gap:6px;min-width:0}
.plan-fields input,.plan-fields textarea,.plan-fields select{width:100%;min-width:0;max-width:100%}
.plan-action{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.plan-action label:first-child,.plan-action label:has(textarea){grid-column:1/-1}
.plan-dates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.plan-list{display:grid;gap:12px;margin-top:16px}
.plan-list-item{display:flex;flex-direction:column;align-items:flex-start;white-space:normal;text-align:left;gap:6px}
.plan-workspace .btn{white-space:normal;max-width:100%;overflow-wrap:anywhere}
.plan-workspace .savebar{flex-wrap:wrap}
.plan-workspace fieldset:disabled{opacity:.85}
@media(max-width:600px){.plan-dates,.plan-action{grid-template-columns:minmax(0,1fr)}.plan-workspace .toolbar{flex-wrap:wrap}}
.evidence-panel{min-width:0;overflow-wrap:anywhere}
.evidence-selection{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.evidence-selection label{display:flex;flex-direction:column;gap:6px;min-width:0}
.evidence-selection input,.evidence-selection select{min-width:0;width:100%;max-width:100%}
.evidence-selection #ev-message{grid-column:1/-1;margin:0}
.evidence-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.evidence-metrics>div{padding:12px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r)}
.evidence-metrics dt{color:var(--ink-2);font-size:13px}
.evidence-metrics dd{margin:5px 0 0;font-size:19px;font-weight:600}
.evidence-days{display:grid;grid-template-columns:repeat(auto-fit,minmax(115px,1fr));list-style:none;padding:0;gap:8px}
.evidence-days li{display:flex;flex-direction:column;padding:10px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface-2)}
.evidence-days [data-day-status="covered"]{border-color:var(--accent);background:var(--surface)}
.evidence-days small{color:var(--muted)}
.evidence-meta{display:grid;grid-template-columns:minmax(120px,1fr) minmax(0,3fr);gap:10px}
.evidence-meta dt{color:var(--ink-2)}
.evidence-meta dd{margin:0;min-width:0;overflow-wrap:anywhere}
.evidence-meta code{white-space:normal;overflow-wrap:anywhere;word-break:break-word}
@media(max-width:500px){.evidence-selection,.evidence-metrics,.evidence-meta{grid-template-columns:minmax(0,1fr)}.evidence-meta{gap:4px}.evidence-meta dd{margin-bottom:12px}}
.record-conflict[hidden]{display:none}
.record-conflict,.compare-field{min-width:0;overflow-wrap:anywhere}
.conflict-actions{display:flex;flex-wrap:wrap;gap:8px}
.conflict-actions .btn{white-space:normal;text-align:left;max-width:100%}
.compare-field{padding:12px;margin-top:8px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);color:var(--ink)}
.compare-field dl{display:grid;grid-template-columns:minmax(75px,1fr) minmax(0,3fr);gap:6px;margin:8px 0 0}
.compare-field dt{color:var(--muted)}
.compare-field dd{margin:0;white-space:pre-wrap}
body{background:var(--bg);color:var(--ink);font:15px/1.6 var(--f-body);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5{font-family:var(--f-display);margin:0;line-height:1.25;text-wrap:balance;color:var(--ink)}
h1{font-size:clamp(1.55rem,1.2rem + 1.4vw,2.1rem);font-weight:700;letter-spacing:.005em}
h2{font-size:1.4rem;font-weight:700}
h3{font-size:1.02rem;font-weight:600}
h4{font-size:.95rem;font-weight:600}
h5{font-size:.88rem;font-weight:600;margin:.6rem 0 .3rem;color:var(--ink-2)}
p{margin:0 0 .6rem}
code{font-family:var(--f-mono);font-size:.82em;letter-spacing:-.01em}
small{font-size:.8em}
a{color:var(--accent-2)}
.muted{color:var(--muted)}
.eyebrow{font-family:var(--f-display);font-size:.74rem;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--gold)}
.lede{color:var(--ink-2);max-width:68ch;margin:.35rem 0 0}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- โครง ---------- */
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;display:flex;align-items:center;gap:14px;padding:10px 16px;background:var(--accent);color:var(--accent-ink);box-shadow:0 1px 0 rgba(0,0,0,.08)}
:root .topbar{background:#123255;color:#fff}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--f-display);font-weight:700;white-space:nowrap}
.brand b{font-size:1.15rem;letter-spacing:.06em}
.brand span{font-size:.78rem;font-weight:500;opacity:.8;letter-spacing:.04em}
.sites{display:flex;gap:4px;background:rgba(255,255,255,.1);padding:3px;border-radius:9px;overflow-x:auto;scrollbar-width:none;min-width:0}
.sites button{border:0;background:transparent;color:#fff;opacity:.82;padding:5px 12px;border-radius:7px;cursor:pointer;white-space:nowrap;font-weight:500}
.sites button.on{background:#fff;color:#123255;opacity:1;font-weight:600}
.sites button small{font-size:.7em;background:#d8ae55;color:#123255;border-radius:4px;padding:0 4px}
.tb-right{margin-left:auto;display:flex;align-items:center;gap:12px;font-size:.82rem;white-space:nowrap}
#sync{display:flex;align-items:center;gap:6px;opacity:.92}
#who{opacity:.8;max-width:16ch;overflow:hidden;text-overflow:ellipsis}
.shell{display:grid;grid-template-columns:208px minmax(0,1fr);min-height:calc(100% - 56px)}
.nav{position:sticky;top:calc(env(safe-area-inset-top,0px) + 56px);align-self:start;display:flex;flex-direction:column;gap:2px;padding:16px 10px;height:calc(100vh - 56px)}
.nav button{display:flex;align-items:center;gap:10px;border:0;background:transparent;padding:9px 12px;border-radius:8px;cursor:pointer;color:var(--ink-2);text-align:left;font-weight:500}
.nav button:hover{background:var(--surface-2);color:var(--ink)}
.nav button.on{background:var(--surface);color:var(--accent);box-shadow:var(--shadow);font-weight:600}
.nav button.on svg{color:var(--gold)}
main#view{padding-block:22px 80px;padding-inline:24px;min-width:0;max-width:1320px;width:100%}
@media (max-width:980px){
  .shell{grid-template-columns:minmax(0,1fr)}
  .nav{position:sticky;top:calc(env(safe-area-inset-top,0px) + 52px);z-index:20;flex-direction:row;height:auto;padding:6px 10px;overflow-x:auto;background:var(--bg);border-bottom:1px solid var(--line);scrollbar-width:none}
  .nav button{flex:0 0 auto;padding:7px 10px;font-size:.88rem}
  .nav button svg{width:17px;height:17px}
  main#view{padding-inline:16px}
  .brand span,#who{display:none}
}
@media (max-width:560px){.topbar{gap:8px;padding:8px 12px}.tb-right #sync span{display:none}}

/* ---------- องค์ประกอบ ---------- */
.intro{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.intro > div{min-width:0}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;margin-bottom:16px;min-width:0}
.ph{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.ph h3{margin-right:auto}
.ph .muted{font-size:.82rem}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:0}
.grid2 > .panel{margin-bottom:16px}
@media (max-width:860px){.grid2{grid-template-columns:minmax(0,1fr)}}
.tscroll{overflow-x:auto;max-width:100%}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:8px 14px;border-radius:8px;cursor:pointer;font-weight:500;line-height:1.3;text-decoration:none;white-space:nowrap}
.btn:hover{border-color:var(--axis);background:var(--surface-2)}
.btn:disabled{opacity:.55;cursor:progress}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.primary:hover{background:var(--accent-2)}
.btn.ghost{background:transparent}
.btn.danger{color:var(--bad-t)}
.btn.sm{padding:5px 10px;font-size:.84rem}
.btn.big{padding:12px 20px;font-size:1.05rem;font-weight:600}
.pill{display:inline-flex;align-items:center;gap:5px;padding:1px 9px;border-radius:999px;font-size:.78rem;font-weight:600;white-space:nowrap;background:var(--idle-bg);color:var(--ink-2)}
.pill.good{background:var(--good-bg);color:var(--good-t)}.pill.warn{background:var(--warn-bg);color:var(--warn-t)}.pill.bad{background:var(--bad-bg);color:var(--bad-t)}.pill.gold{background:var(--gold-soft);color:var(--gold)}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--axis);flex:0 0 auto}
.dot.good{background:var(--good)}.dot.warn{background:var(--warn)}.dot.bad{background:var(--bad)}.dot.none{background:var(--axis)}
.pill .dot{width:6px;height:6px;background:currentColor}
.pulse{animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(12,163,12,.5)}70%{box-shadow:0 0 0 7px rgba(12,163,12,0)}100%{box-shadow:0 0 0 0 rgba(12,163,12,0)}}
.notice{background:var(--surface-2);border-left:3px solid var(--accent);padding:9px 14px;border-radius:6px;margin-bottom:14px;color:var(--ink-2)}
.notice.gold{border-left-color:var(--gold);background:var(--gold-soft)}
.notice.sticky{position:sticky;top:110px;z-index:10}
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:14px}
.seg{display:flex;flex-wrap:wrap;gap:2px;background:var(--surface-2);padding:3px;border-radius:9px}
.seg button{border:0;background:transparent;padding:5px 11px;border-radius:7px;cursor:pointer;color:var(--ink-2);font-size:.86rem;white-space:nowrap}
.seg button.on{background:var(--surface);color:var(--accent);font-weight:600;box-shadow:var(--shadow)}
.seg button small{color:var(--muted);font-variant-numeric:tabular-nums}
.switch{display:inline-flex;align-items:center;gap:7px;cursor:pointer;font-size:.88rem;color:var(--ink-2)}
.switch input{width:18px;height:18px;accent-color:var(--accent)}
.live{display:inline-flex;align-items:center;gap:6px;font-size:.82rem}
.legend{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:.8rem;color:var(--ink-2);margin:2px 0 6px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.legend i.diamond{transform:rotate(45deg);border:2px solid var(--gold);background:var(--surface);width:9px;height:9px;border-radius:1px}
.empty{text-align:center;padding:56px 16px;color:var(--ink-2)}
.empty h3{margin:12px 0 6px}
.empty p{max-width:52ch;margin:0 auto 14px}
.tbl{width:100%;border-collapse:collapse;font-size:.88rem;font-variant-numeric:tabular-nums}
.tbl th{text-align:left;font-weight:600;color:var(--muted);font-size:.78rem;letter-spacing:.02em;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:8px 10px;border-bottom:1px solid var(--grid);vertical-align:top}
.tbl input,.tbl select{width:100%;min-width:7em;padding:5px 7px;border:1px solid var(--line);border-radius:6px;background:var(--surface)}
.tbl.list tbody tr{cursor:pointer}
.tbl.list tbody tr:hover td{background:var(--surface-2)}
.tbl.cmp td .cell{display:flex;align-items:center;gap:7px;font-weight:600}
.pad{padding:12px}

/* ---------- ภาพรวม ---------- */
.site-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:16px;margin-bottom:16px}
.site-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;display:flex;flex-direction:column;gap:12px}
.site-card header{display:flex;gap:14px;align-items:center}
.site-card h3{font-size:1.25rem}
.site-card h3 small{font-family:var(--f-body);font-weight:500;color:var(--muted);font-size:.8rem}
.ring-wrap{position:relative;flex:0 0 auto}
.ring-wrap span{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--f-display);font-weight:700;font-size:.82rem}
.kvs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px}
.kv{display:flex;align-items:baseline;gap:6px;border-bottom:1px dashed var(--grid);padding:3px 0;font-size:.88rem}
.kv span{color:var(--ink-2);margin-right:auto}
.kv b{font-variant-numeric:tabular-nums}
.site-card footer{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:auto;font-size:.84rem}

/* ---------- Dashboard ---------- */
.dash-head{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:flex-end;margin-bottom:14px}
.dh-state{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.dh-state .big{font-family:var(--f-display);font-size:1.9rem;font-weight:700;line-height:1.1;color:var(--accent)}
.dh-state .big small{font-size:.9rem;color:var(--muted);font-weight:500}
.phasebar{position:relative;height:30px;background:var(--surface-2);border-radius:8px;margin:0 0 16px;overflow:hidden}
.seg-p{position:absolute;top:3px;bottom:3px;border-radius:6px;display:flex;align-items:center;padding:0 8px;font-size:.74rem;color:var(--ink-2);overflow:hidden;white-space:nowrap;background:var(--surface);border:1px solid var(--line)}
.seg-p.trial{background:var(--gold-soft);border-color:transparent;color:var(--gold)}
.seg-p.cur{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:600}
.seg-p span{overflow:hidden;text-overflow:ellipsis}
.phasebar .today{position:absolute;top:0;bottom:0;width:2px;background:var(--bad);box-shadow:0 0 0 2px var(--surface-2)}
.ai-brief{border-left:3px solid var(--gold)}
.ai-text{font-size:.92rem;color:var(--ink)}
.ai-text h5{color:var(--accent);margin-top:.7rem}
.ai-text ul{margin:.2rem 0 .5rem;padding-left:1.2rem}
.ai-text li{margin:.15rem 0}
.thinking{animation:fade 1.4s ease-in-out infinite alternate}
@keyframes fade{from{opacity:.45}to{opacity:1}}
.err-t{color:var(--bad-t)}.good-t{color:var(--good-t)}.bad-t{color:var(--bad-t)}.warn-t{color:var(--warn-t)}
.groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr));gap:16px;margin-bottom:16px}
.group{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;min-width:0}
.group h4{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.group h4 i{width:10px;height:10px;border-radius:3px}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.tile{border:1px solid var(--grid);border-radius:8px;padding:10px 12px;background:var(--bg);position:relative;min-width:0}
.tile::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--axis)}
.tile.good::before{background:var(--good)}.tile.warn::before{background:var(--warn)}.tile.bad::before{background:var(--bad)}
.t-top{display:flex;justify-content:space-between;align-items:center;gap:6px}
.t-top code{color:var(--muted)}
.t-top .pill{font-size:.7rem;padding:0 7px}
.t-val{font-family:var(--f-display);font-size:1.6rem;font-weight:700;line-height:1.2;margin-top:4px;font-variant-numeric:tabular-nums}
.t-val small{font-family:var(--f-body);font-size:.78rem;font-weight:500;color:var(--muted)}
.t-lbl{font-size:.84rem;font-weight:500;color:var(--ink-2);line-height:1.35}
.t-sub{font-size:.76rem;color:var(--muted);margin-top:3px;line-height:1.35}
.hbars{display:grid;gap:6px}
.hb{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto;gap:10px;align-items:center;font-size:.84rem}
.hb-l{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink-2)}
.hb-t{height:10px;background:var(--surface-2);border-radius:3px;overflow:hidden}
.hb-f{height:100%;border-radius:0 3px 3px 0}
.hb-v{font-variant-numeric:tabular-nums;font-weight:600;min-width:2.5em;text-align:right}
.radius{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:12px;align-items:center}
@media (max-width:520px){.radius{grid-template-columns:minmax(0,1fr)}}
.feed,.gaps{list-style:none;margin:0;padding:0}
.feed li{display:flex;gap:12px;padding:9px 6px;border-bottom:1px solid var(--grid);cursor:pointer;border-radius:6px}
.feed li:hover,.gaps li:hover{background:var(--surface-2)}
.f-time{font-family:var(--f-mono);font-size:.9rem;font-weight:600;min-width:3.6em;display:flex;flex-direction:column;line-height:1.25}
.f-time small{font-family:var(--f-body);font-weight:400;color:var(--muted)}
.f-body{min-width:0}
.f-meta{display:flex;flex-wrap:wrap;gap:5px;margin-top:3px;align-items:center;font-size:.8rem}
.gaps li{display:flex;gap:10px;align-items:baseline;padding:7px 6px;border-bottom:1px solid var(--grid);cursor:pointer;font-size:.86rem;border-radius:6px;flex-wrap:wrap}
.gaps li span{color:var(--ink-2);min-width:0}
.ok-line{display:flex;gap:8px;align-items:center}
.step{font-size:.72rem;padding:0 6px;border-radius:4px;background:var(--surface-2);color:var(--muted)}
.step.done{background:var(--good-bg);color:var(--good-t)}

/* ---------- บันทึก ---------- */
.rec-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:12px;margin-bottom:18px}
.rec-tile{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:var(--r);padding:14px 16px;cursor:pointer;color:var(--ink)}
.rec-tile:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.rec-tile b{font-family:var(--f-display);font-size:1.08rem}
.rec-tile small{color:var(--muted);line-height:1.4}
.rt-code{font-family:var(--f-mono);font-size:.74rem;color:var(--gold);font-weight:600}
.rec-tile.dfr{background:#123255;border-color:#123255;color:#fff;grid-row:span 2;justify-content:flex-end;min-height:150px;position:relative;overflow:hidden}
.rec-tile.dfr::after{content:"";position:absolute;right:-30px;top:-30px;width:130px;height:130px;border-radius:50%;border:2px dashed rgba(216,174,85,.55);box-shadow:0 0 0 22px rgba(255,255,255,.04)}
.rec-tile.dfr b{color:#fff;font-size:1.3rem}.rec-tile.dfr small{color:rgba(255,255,255,.75)}.rec-tile.dfr .rt-code{color:#d8ae55}
.editor{max-width:980px}
.ed-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:6px}
.ed-head > div{min-width:0}
.ed-head h2{font-family:var(--f-mono);font-size:1.25rem;word-break:break-all}
fieldset{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);padding:12px 16px 16px;margin:14px 0}
legend{font-family:var(--f-display);font-weight:600;padding:0 6px;color:var(--accent)}
.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:12px 16px}
.field{display:flex;flex-direction:column;gap:4px;min-width:0}
.field.wide{grid-column:1/-1}
.field label,.sara label,.triangle label{font-size:.84rem;font-weight:500;color:var(--ink-2);display:flex;gap:6px;align-items:baseline;flex-wrap:wrap}
.field label code{color:var(--gold);font-weight:600}
.req{color:var(--bad);font-weight:700}
.field.miss input,.field.miss select,.field.miss textarea,.field.miss .chips{border-color:var(--warn);box-shadow:0 0 0 2px var(--warn-bg)}
input[type=text],input[type=number],input[type=search],input[type=date],input[type=datetime-local],input:not([type]),select,textarea{border:1px solid var(--line);background:var(--surface);border-radius:7px;padding:8px 10px;width:100%;min-width:0}
textarea{resize:vertical}
textarea.mono{font-family:var(--f-mono);font-size:.82rem;line-height:1.5}
.dt{display:flex;gap:6px}
.dt input{flex:1}
select.na{margin-top:4px;font-size:.84rem;color:var(--ink-2)}
.ll{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.hint{color:var(--muted);font-size:.76rem}
.chips{display:flex;flex-wrap:wrap;gap:6px;border:1px solid transparent;border-radius:8px}
.chip{display:inline-flex;align-items:center;cursor:pointer}
.chip input{position:absolute;opacity:0;pointer-events:none}
.chip span{border:1px solid var(--line);border-radius:999px;padding:4px 11px;font-size:.84rem;background:var(--surface);color:var(--ink-2)}
.chip input:checked + span{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.chip input:focus-visible + span{outline:2px solid var(--gold);outline-offset:2px}
.savebar{position:sticky;bottom:calc(env(safe-area-inset-bottom,0px) + 10px);display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 14px;box-shadow:0 6px 24px rgba(18,28,46,.12);margin-top:14px;z-index:5}
.savebar > span{margin-right:auto;font-size:.84rem}
.savebar.inline{position:static;box-shadow:none;border:0;padding:8px 0 0;background:transparent}
.log{margin-top:10px;font-size:.84rem;color:var(--ink-2)}
.log ol{margin:.4rem 0;padding-left:1.4rem}
label.inline{display:inline-flex;align-items:center;gap:6px;font-size:.88rem;color:var(--ink-2)}
label.inline input,label.inline select{width:auto}

/* DFR */
.dfr-screen .clock{margin-left:auto;text-align:right;background:#123255;color:#fff;border-radius:10px;padding:6px 14px;display:flex;flex-direction:column}
.dfr-screen .clock small{opacity:.75;font-size:.72rem}
.dfr-screen .clock b{font-family:var(--f-mono);font-size:1.8rem;line-height:1.1;color:#d8ae55;font-variant-numeric:tabular-nums}
.dfr-screen .clock.closed b{color:#fff}
.dsteps{display:flex;flex-direction:column;gap:0;margin:14px 0;position:relative}
.dstep{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;padding:12px 0;border-bottom:1px solid var(--grid);align-items:start}
.ds-c{font-family:var(--f-mono);font-weight:700;font-size:.82rem;text-align:center;padding:6px 0;border-radius:8px;background:var(--surface-2);color:var(--muted)}
.dstep.done .ds-c{background:var(--good-bg);color:var(--good-t)}
.ds-b b{font-family:var(--f-display);font-size:1.02rem}
.ds-t{font-family:var(--f-mono);font-size:1rem;margin-top:3px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ds-a{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:6px}
.ds-a select{width:auto}

/* ---------- SARA ---------- */
.sara-dates{display:flex;gap:5px;flex-wrap:wrap;align-items:center}
.pt-board{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr));gap:14px}
.pt-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;cursor:pointer;display:flex;flex-direction:column;gap:6px}
.pt-card:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.pt-card header{display:flex;justify-content:space-between;align-items:center}
.pt-card header code{font-size:.95rem;font-weight:700;color:var(--gold)}
.pt-card h3{font-size:1rem}
.pt-n{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.pt-n b{font-family:var(--f-display);font-size:1.7rem;line-height:1}
.trend{font-size:.84rem;margin-left:auto;font-weight:600}
.trend.up{color:var(--bad-t)}.trend.down{color:var(--good-t)}
.trend small{display:block;font-weight:400;color:var(--muted);font-size:.7rem;text-align:right}
.steps4{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.steps4 span{text-align:center;font-family:var(--f-display);font-weight:700;font-size:.8rem;padding:3px 0;border-radius:5px;background:var(--surface-2);color:var(--muted)}
.steps4 span.done{background:var(--accent);color:var(--accent-ink)}
.steps4 span.cur{background:var(--gold-soft);color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold)}
.pt-card footer{font-size:.8rem}
.rank{margin:0;padding-left:1.4rem;display:grid;gap:8px}
.rk-bar{height:6px;background:var(--surface-2);border-radius:3px;overflow:hidden;margin-bottom:3px;max-width:340px}
.rk-bar span{display:block;height:100%;background:var(--gold)}
.sstep > .btn,#ms-add .btn{align-self:flex-start}
.sstep{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;margin:14px 0;display:flex;flex-direction:column;gap:8px}
.ss-h{display:flex;gap:12px;align-items:flex-start}
.ss-k{flex:0 0 auto;width:38px;height:38px;border-radius:9px;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-family:var(--f-display);font-weight:700;font-size:1.2rem}
.triangle{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (max-width:640px){.triangle{grid-template-columns:minmax(0,1fr)}}
.ba{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.ba > div{background:var(--surface-2);border-radius:8px;padding:8px 14px;display:flex;flex-direction:column}
.ba > div span{font-size:.76rem;color:var(--muted)}
.ba > div b{font-family:var(--f-display);font-size:1.5rem;line-height:1.2}
.ba .arrow{background:transparent;font-size:1.4rem;color:var(--muted)}
.ai-adds{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
ul.plain{list-style:none;padding:0;margin:6px 0 0;font-size:.84rem}
ul.plain li{display:flex;justify-content:space-between;gap:10px;border-bottom:1px dashed var(--grid);padding:2px 0}

/* ---------- AI ---------- */
.chat #chat-log{display:flex;flex-direction:column;gap:10px;min-height:120px;margin-bottom:12px}
.msg{max-width:min(760px,92%);padding:10px 14px;border-radius:12px;font-size:.93rem}
.msg.user{align-self:flex-end;background:var(--accent);color:var(--accent-ink);border-bottom-right-radius:4px}
.msg.assistant{align-self:flex-start;background:var(--surface-2);border-bottom-left-radius:4px}
.suggest{display:flex;flex-wrap:wrap;gap:8px}
.chat-form{display:flex;gap:8px;flex-wrap:wrap}
.chat-form input{flex:1 1 240px}
.saved details{border-bottom:1px solid var(--grid);padding:8px 0}
.saved summary{cursor:pointer;font-size:.9rem}

/* ---------- รายงาน ---------- */
.rpt-preview{background:var(--surface-2);border-radius:var(--r);padding:16px 8px;overflow-x:auto}
.rpt-preview .rpt{width:max-content;margin:0 auto}
.pdf-host{position:fixed;left:-12000px;top:0;width:210mm;background:#fff}
.pdf-host .page{box-shadow:none!important;margin:0!important}

/* ---------- ลอย ---------- */
#tip{position:fixed;left:0;top:0;z-index:100;max-width:280px;background:#0d1626;color:#eef2f8;font-size:.8rem;line-height:1.45;padding:7px 10px;border-radius:7px;pointer-events:none;box-shadow:0 6px 20px rgba(0,0,0,.25)}
#toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 22px);transform:translateX(-50%);z-index:110;background:#123255;color:#fff;padding:10px 18px;border-radius:9px;font-size:.9rem;box-shadow:0 10px 30px rgba(0,0,0,.25);max-width:min(560px,calc(100% - 32px))}
#toast[data-kind="err"]{background:#8f1f1f}

/* ---------- เข้าสู่ระบบ / บัญชี (รุ่นเซิร์ฟเวอร์) ---------- */
body.auth .nav,body.auth #sites,body.auth .tb-right{display:none}
body.auth .shell{grid-template-columns:minmax(0,1fr)}
body.auth main#view{max-width:none}
.auth-wrap{min-height:calc(100vh - 140px);display:grid;place-items:center;padding-block:24px}
.auth-card{width:min(420px,100%);background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:28px 26px;display:flex;flex-direction:column;gap:14px;box-shadow:0 10px 40px rgba(18,28,46,.08)}
.auth-card h1{font-size:1.5rem}
.auth-brand{display:flex;gap:12px;align-items:center;color:var(--accent)}
.auth-brand b{display:block;font-family:var(--f-display);font-size:1.1rem;color:var(--ink)}
.auth-brand span{font-size:.82rem;color:var(--muted)}
.auth-card .small{font-size:.78rem;line-height:1.5;margin:0}
.auth-card .err-t{min-height:1.2em;margin:0;font-size:.88rem}
.auth-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
#who{position:relative;overflow:visible;max-width:none}
.acct{display:flex;flex-direction:column;align-items:flex-end;border:0;background:rgba(255,255,255,.08);color:#fff;border-radius:8px;padding:3px 10px;cursor:pointer;line-height:1.25;max-width:22ch}
.acct .acct-n{font-weight:600;font-size:.84rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.acct small{opacity:.75;font-size:.7rem}
.acct-menu{position:absolute;right:0;top:calc(100% + 6px);background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 30px rgba(0,0,0,.18);padding:8px;min-width:220px;display:flex;flex-direction:column;gap:2px;z-index:40}
.acct-menu .muted{font-size:.78rem;padding:4px 8px 6px;border-bottom:1px solid var(--grid);margin-bottom:4px;white-space:normal}
.acct-menu button{border:0;background:transparent;text-align:left;padding:8px;border-radius:6px;cursor:pointer;color:var(--ink)}
.acct-menu button:hover{background:var(--surface-2)}
.secret{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.secret code{font-size:1.05rem;background:var(--surface);padding:4px 10px;border-radius:6px;border:1px solid var(--line);user-select:all}
.secret span{flex-basis:100%;font-size:.84rem}
.row-act{white-space:nowrap}
.row-act .btn + .btn{margin-left:4px}
.tbl.matrix td.c{text-align:center}
.tbl.matrix th{white-space:normal;min-width:5.5em;font-size:.72rem;vertical-align:bottom}
.yes{color:var(--good-t);font-weight:700}.no{color:var(--axis)}
.warn-row td{background:var(--warn-bg)}
@media (max-width:980px){.tb-right #who{display:block}.acct small{display:none}}

/* SARA Advisor: runtime draft, with evidence references readable on mobile. */
.advisor-result{display:grid;gap:18px;min-width:0}
.advisor-result:empty{display:none}
.advisor-result h4{margin:18px 0 8px}
.advisor-result p{line-height:1.7}
.advisor-result ul{padding-inline-start:22px;line-height:1.7}
.advisor-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start}
.advisor-option{min-width:0;border-top:3px solid var(--accent)}
.advisor-option h3{margin-top:14px}
.advisor-refs{min-width:0;overflow-wrap:anywhere}
.advisor-refs code{display:block;font-size:.75rem;color:var(--muted);white-space:normal;margin:6px 0}
.advisor-result details summary{cursor:pointer;color:var(--accent)}
.advisor-controls .btn{white-space:normal;max-width:100%}
@media(max-width:1100px){.advisor-options{grid-template-columns:minmax(0,1fr)}}
@media(max-width:500px){.advisor-result .panel{padding:16px}.advisor-controls .btn{width:100%}}

/* WP5 has its own print surface; the official report engine is unchanged. */
@font-face{font-family:"ASIP Sarabun";src:url('/fonts/sarabun-v1/Sarabun-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:"ASIP Sarabun";src:url('/fonts/sarabun-v1/Sarabun-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:block}
.brief-controls{display:grid;gap:16px}.brief-controls label{display:block;line-height:1.7}.brief-controls .btn{white-space:normal}
#brief-host{min-width:0}
#brief-document{--brief-paper:#fff;--brief-ink:#172b42;--brief-line:#b8c2ce;background:var(--brief-paper);color:var(--brief-ink);font-family:"ASIP Sarabun",sans-serif;font-size:16px;line-height:1.7;max-width:210mm;margin:20px auto;padding:32px;box-sizing:border-box;overflow-wrap:anywhere;word-break:normal;position:relative;isolation:isolate}
#brief-document *{box-sizing:border-box;max-width:100%}
#brief-document h1,#brief-document h2,#brief-document h3,#brief-document h4{font-family:inherit;color:inherit;line-height:1.5;font-weight:700;break-after:avoid}
#brief-document h1{font-size:26px}#brief-document h2{font-size:22px;border-bottom:1px solid var(--brief-line);padding-bottom:6px;margin:26px 0 12px}#brief-document h3{font-size:18px;margin:20px 0 8px}#brief-document h4{font-size:16px;margin:12px 0 5px}
#brief-document p{margin:7px 0}.brief-text{white-space:pre-wrap}.brief-brand{font-weight:700;font-size:20px}.brief-label{font-weight:700;border-block:2px solid var(--brief-ink);padding:12px 0}
#brief-document ul{padding-inline-start:22px;margin:10px 0}#brief-document li{margin:5px 0}
.brief-facts{margin:10px 0;display:block}.brief-facts>div{margin:5px 0}.brief-facts dt{font-weight:700;display:inline}.brief-facts dd{display:inline;margin:0;white-space:pre-wrap;orphans:3;widows:3}
#brief-document table{border-collapse:collapse;width:100%;table-layout:fixed;margin:14px 0;font-size:inherit}
#brief-document th,#brief-document td{color:inherit;background:transparent;border:1px solid var(--brief-line);padding:6px;white-space:pre-wrap;vertical-align:top}
#brief-document thead{display:table-header-group}#brief-document tr{break-inside:avoid}#brief-document p,#brief-document li{orphans:3;widows:3}
.brief-watermark{display:none}.brief-action{border-top:1px solid var(--brief-line);padding-top:8px}
@media(max-width:500px){#brief-document{padding:16px;font-size:15px}#brief-document h1{font-size:23px}#brief-document h2{font-size:20px}#brief-document table{font-size:13px}}
@page asipbrief {
  size:A4 portrait!important;margin:23mm 17mm 24mm!important;
  @top-center{content:"ASIPThailand.com · SYNTHETIC DEMO — NOT OFFICIAL\A Reviewed Draft — Not Operationally Approved";white-space:pre;font-family:"ASIP Sarabun";font-size:9pt;font-weight:700;color:#172b42;vertical-align:middle}
  @bottom-center{content:"synthetic:true · officialResultEligible:false · operationalOrderEligible:false\A causalConclusion:false · internal_demo · หน้า " counter(page) " / " counter(pages);white-space:pre;font-family:"ASIP Sarabun";font-size:8pt;color:#172b42;vertical-align:middle}
}
@media print {
  /* Screen navigation must not paint over the repeated A4 report content. */
  .skip-link{display:none!important}
  body.brief-preview-active{background:#fff!important;color:#172b42!important}
  body.brief-preview-active>header,body.brief-preview-active .nav,body.brief-preview-active #view>section,body.brief-preview-active .brief-controls,body.brief-preview-active #toast,body.brief-preview-active #tip{display:none!important}
  body.brief-preview-active .shell,body.brief-preview-active #view,body.brief-preview-active #brief-host{display:block!important;margin:0!important;padding:0!important;max-width:none!important;width:auto!important;min-height:0!important}
  #brief-document{page:asipbrief;max-width:none;margin:0;padding:0;background:#fff!important;color:#172b42!important;box-shadow:none;font-size:11pt;line-height:1.6}
  #brief-document h1{font-size:20pt}#brief-document h2{font-size:15pt}#brief-document h3{font-size:12pt}#brief-document h4{font-size:11pt}#brief-document table{font-size:10pt}
  #brief-document h1,#brief-document h2,#brief-document h3,#brief-document h4{page-break-inside:avoid;break-inside:avoid-page;page-break-after:avoid;break-after:avoid-page}
  #brief-document .brief-heading-intro{display:flow-root;page-break-inside:avoid;break-inside:avoid-page}
  /* Reserve ink space at every paragraph fragment, including continuation pages. */
  #brief-document p{padding-block:2px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
  #brief-document .brief-new-section{break-before:page}
  #brief-document .brief-option+ .brief-option{break-before:page}
  #brief-document .brief-watermark{display:block;position:fixed;top:110mm;left:12mm;width:152mm;text-align:center;transform:rotate(-28deg);font-size:36pt;font-weight:700;opacity:.10;z-index:-1;pointer-events:none}
}

/* Premium executive presentation. Screen-only: A4/brief print contracts stay intact. */
.skip-link{position:fixed;top:-100px;left:12px;z-index:1000;padding:12px;background:var(--surface);color:var(--ink)}
.skip-link:focus{top:12px}
@media screen{
  :root{--navy:#061525;--navy-raised:#0c233b;--champagne:#ebc787;--champagne-edge:#9c7b46;--on-navy:#f6f1e8;--on-navy-muted:#bcc9d8;--premium-glow:rgba(235,199,135,.14);--premium-rule:rgba(235,199,135,.32);--f-body:"ASIP Sarabun","Leelawadee UI",sans-serif;--f-display:"ASIP Sarabun","Leelawadee UI",sans-serif;--muted:#59677a;--r:12px}
  :root[data-theme="dark"]{--muted:#acb9cb}
  body{background:var(--navy)}
  :root .topbar{background:linear-gradient(110deg,var(--navy),var(--navy-raised));color:var(--on-navy);border-bottom:1px solid var(--premium-rule);min-height:76px;padding:12px 24px;gap:24px}
  .brand{min-width:194px;gap:8px;flex-wrap:wrap;position:relative}
  .brand b{color:var(--champagne);font-family:Georgia,serif;font-size:1.8rem;letter-spacing:.04em}
  .brand span{color:var(--on-navy-muted);opacity:1;font-size:.68rem}
  .brand svg{display:none}
  .sites{border:1px solid var(--premium-rule);background:transparent}
  .sites button{min-height:38px;opacity:1}
  .sites button.on{background:var(--champagne);color:var(--navy)}
  .tb-right{min-width:0;gap:16px;white-space:normal}
  #sync{max-width:230px;color:var(--on-navy-muted);font-size:.72rem;line-height:1.5}
  #who{opacity:1}
  .acct{color:var(--on-navy)}
  .shell{grid-template-columns:224px minmax(0,1fr);min-height:calc(100vh - 76px)}
  .nav{top:76px;height:calc(100vh - 76px);background:linear-gradient(175deg,var(--navy-raised),var(--navy));padding:24px 12px;gap:6px;border-right:1px solid var(--premium-rule);overflow-y:auto}
  .nav::before{content:"ASIP WORKSPACE";color:var(--champagne);font-size:.65rem;letter-spacing:.18em;padding:0 14px 14px}
  .nav button{color:var(--on-navy-muted);min-height:46px;border:1px solid transparent;border-radius:8px;padding:10px 14px}
  .nav button:hover{background:var(--navy-raised);color:var(--on-navy)}
  .nav button.on{color:var(--on-navy);border-color:var(--champagne-edge);background:linear-gradient(110deg,var(--premium-glow),transparent);box-shadow:inset 3px 0 var(--champagne)}
  .nav button.on svg{color:var(--champagne)}
  main#view{background:var(--bg);max-width:none;padding:24px 28px 72px}
  main#view:has(.executive){background:var(--navy);color:var(--on-navy)}
  .executive{max-width:1660px;margin:auto}
  .exec-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}
  .exec-heading h1{font-family:Georgia,"ASIP Sarabun",serif;font-weight:400;font-size:clamp(1.8rem,2.4vw,2.8rem);color:var(--on-navy);margin:7px 0 9px}
  .exec-heading .eyebrow{color:var(--champagne)}
  .exec-heading p,.exec-date{color:var(--on-navy-muted);font-size:.8rem;margin:0}
  .exec-date{text-align:right;flex-shrink:0}.exec-date span{display:block;color:var(--champagne);margin-top:5px}
  .exec-context{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:18px;padding:10px 14px;border:1px solid var(--premium-rule);border-radius:8px;font-size:.8rem;color:var(--on-navy-muted)}
  .exec-context input{accent-color:var(--champagne)}.exec-context .switch{color:var(--on-navy-muted)}
  .exec-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}
  .exec-metric{display:flex;align-items:flex-start;gap:14px;border:1px solid var(--champagne-edge);border-radius:var(--r);background:var(--surface);color:var(--ink);padding:22px 18px;box-shadow:0 0 22px var(--premium-glow);min-width:0}
  .exec-metric>div{min-width:0}.exec-metric h2{font-size:.9rem;line-height:1.6;font-weight:700}.exec-metric strong{display:block;font-family:Georgia,"ASIP Sarabun",serif;font-size:2.3rem;font-weight:400;line-height:1.35;letter-spacing:-.03em}.exec-metric strong.exec-na{font-size:1.25rem;line-height:2.4}
  .exec-metric p{color:var(--muted);font-size:.72rem;margin:5px 0 0}.exec-metric-icon{display:grid;place-items:center;width:42px;height:52px;flex-shrink:0;background:var(--gold-soft);color:var(--gold);border-radius:10px;font-size:1.6rem;font-family:Georgia,serif}
  .exec-primary{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:18px}
  .executive .panel{color:var(--ink);border-color:var(--champagne-edge);padding:20px}
  .executive .panel h2{font-size:1.1rem}.executive .panel .ph{align-items:center}
  .exec-map.panel{background:radial-gradient(ellipse at 35% 50%,var(--navy-raised),var(--navy));color:var(--on-navy)}
  .exec-map h2{color:var(--on-navy)}.exec-map .eyebrow{color:var(--champagne)}.exec-map .pill{background:var(--navy-raised);color:var(--on-navy-muted);border:1px solid var(--premium-rule)}
  .exec-coordinate-board{margin:12px 0;min-height:230px}.exec-coordinate-board svg{display:block;width:100%;height:auto;max-height:310px}
  .coordinate-grid{stroke:var(--premium-rule);stroke-width:.6;stroke-dasharray:2 5;fill:none}.coordinate-label{fill:var(--on-navy-muted);font-size:11px}.coordinate-title{fill:var(--champagne);font:18px Georgia,serif;letter-spacing:6px}.coordinate-site{fill:var(--on-navy);font-size:14px;font-weight:bold}.coordinate-halo{fill:var(--premium-glow);stroke:var(--champagne-edge)}.coordinate-point{fill:var(--champagne);stroke:var(--on-navy);stroke-width:2}
  .exec-map-sites{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}.exec-site-link{background:var(--navy-raised);color:var(--on-navy);border:1px solid var(--premium-rule);border-radius:8px;padding:12px;text-align:left;cursor:pointer}.exec-site-link b,.exec-site-link span{display:block}.exec-site-link b{font-size:.85rem}.exec-site-link span{color:var(--on-navy-muted);font-size:.7rem;margin-top:5px}.exec-site-link:hover{border-color:var(--champagne)}
  .exec-map-note{color:var(--on-navy-muted);font-size:.72rem;margin:12px 0 0}
  .exec-alerts{padding:0;margin:14px 0;list-style:none}.exec-alerts li{display:flex;gap:12px;padding:18px 0;border-bottom:1px solid var(--line);align-items:flex-start}.exec-alerts li>div{min-width:0;flex:1}.exec-alerts h3{font-size:.95rem}.exec-alerts p{font-size:.8rem;color:var(--ink-2);margin:6px 0}.exec-alerts small{color:var(--muted);font-size:.7rem}.exec-alert-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;background:var(--axis);margin-top:7px}.exec-alert-dot.warn{background:var(--warn)}
  .exec-definition{border-left:2px solid var(--gold);background:var(--gold-soft);padding:12px 14px;margin:18px 0;color:var(--ink)}.exec-definition b{font-size:.85rem}.exec-definition p{font-size:.78rem;margin:5px 0 0}.exec-attention>.muted{font-size:.76rem}
  .exec-secondary{display:grid;grid-template-columns:1.2fr 1.2fr 1fr;gap:18px}.exec-secondary .panel{min-width:0}.exec-secondary .tbl{font-size:.78rem}.exec-secondary .muted{font-size:.72rem}.exec-status dl{margin:0}.exec-status dl>div{padding:10px 0;border-bottom:1px solid var(--line);font-size:.78rem}.exec-status dt{color:var(--ink);font-weight:700}.exec-status dd{margin:4px 0 0;color:var(--muted)}
  .exec-empty-chart{display:grid;place-content:center;text-align:center;min-height:190px;color:var(--muted);border-bottom:1px solid var(--line)}.exec-empty-chart span{font:2rem Georgia,serif;color:var(--gold)}.exec-empty-chart p{font-size:.8rem;margin:8px 0}
  .executive .site-card{color:var(--ink);border-color:var(--champagne-edge)}
  body.auth{--ink:var(--on-navy);--ink-2:var(--on-navy-muted);--muted:var(--on-navy-muted);--surface:var(--navy-raised);--surface-2:var(--navy);--line:var(--premium-rule);--gold:var(--champagne);--accent:var(--champagne);--accent-ink:var(--navy);--bad-t:#ffb4aa;color-scheme:dark}
  body.auth .topbar{display:none}body.auth main#view{padding:0;background:var(--navy)}
  .premium-login{min-height:100vh;max-width:1660px;margin:auto;padding:48px 6%;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(340px,.85fr);gap:6%;align-items:center;background:radial-gradient(ellipse at 0% 30%,var(--navy-raised),transparent 70%)}
  .login-story{min-width:0;width:100%;align-self:stretch;display:flex;flex-direction:column;justify-content:center}.login-wordmark{font:3rem Georgia,serif;color:var(--champagne);letter-spacing:.08em;margin-bottom:30px}.login-wordmark span{display:block;font:10px var(--f-body);letter-spacing:.6em;color:var(--on-navy);margin-top:6px}
  .login-story .eyebrow{font-size:.7rem;letter-spacing:.12em;margin-bottom:14px}.login-story h2{font-size:clamp(1.6rem,2.7vw,3rem);line-height:1.5;font-weight:400;color:var(--on-navy)}.login-story h2 em{font-style:normal;color:var(--champagne)}.login-lede{color:var(--on-navy-muted);font-size:.95rem;margin:16px 0 24px;line-height:1.8}
  .login-principles{display:flex;gap:16px;font-size:.77rem;color:var(--champagne);flex-wrap:wrap}.login-principles span{border-left:1px solid var(--champagne-edge);padding-left:12px}
  .login-equipment{margin:18px 0 0}.equipment-photo{display:block;width:100%;height:auto;object-fit:cover;aspect-ratio:1.9;border-radius:12px;border:1px solid var(--premium-rule)}.login-equipment figcaption{font-size:.68rem;color:var(--champagne);margin-top:10px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}.login-equipment figcaption span{color:var(--on-navy-muted)}
  .premium-login .auth-card{width:100%;padding:40px 32px;background:linear-gradient(145deg,var(--navy-raised),var(--navy));border:1px solid var(--champagne-edge);box-shadow:0 0 45px var(--premium-glow),inset 0 1px var(--champagne);border-radius:18px;gap:20px}
  .premium-login .auth-brand{justify-content:center;text-align:center;padding:8px 0 20px;border-bottom:1px solid var(--premium-rule)}.premium-login .auth-brand b{font:2.2rem Georgia,serif;color:var(--champagne)}.premium-login .auth-brand .auth-thailand{display:inline;font:1rem Georgia,serif;color:var(--champagne)}.premium-login .auth-brand span{color:var(--on-navy-muted)}
  .login-heading{text-align:center}.login-heading h1{font-size:1.8rem;margin:7px 0 12px}.login-heading p:last-child{color:var(--on-navy-muted);font-size:.85rem;line-height:1.6}.premium-login .field{margin:0}.premium-login label{color:var(--on-navy);font-size:.85rem}.premium-login input{background:var(--navy);border-color:var(--premium-rule);min-height:48px;color:var(--on-navy);border-radius:8px}.premium-login .btn.primary{background:linear-gradient(110deg,var(--champagne),#c49a58);border:1px solid var(--champagne);color:var(--navy);min-height:50px;font-weight:700}.premium-login .btn.ghost{color:var(--champagne);white-space:normal}.premium-login .login-security{border-top:1px solid var(--premium-rule);padding-top:20px;text-align:center;line-height:1.9}.premium-login .err-t:empty{display:none}
  :root[data-theme="light"]{--gold:#876319}
  :focus-visible{outline:3px solid var(--gold);outline-offset:3px}
}
@media screen and (prefers-color-scheme:dark){:root:not([data-theme="light"]){--muted:#acb9cb}}
@media screen and (prefers-color-scheme:light){:root:not([data-theme="dark"]){--gold:#876319}}
@media screen and (max-width:1200px){.exec-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.exec-secondary{grid-template-columns:repeat(2,minmax(0,1fr))}.exec-secondary .exec-status{grid-column:1/-1}.tb-right #sync{display:none}.premium-login{gap:4%;padding:36px 4%}.premium-login .auth-card{padding:30px 24px}}
@media screen and (max-width:980px){.shell{grid-template-columns:minmax(0,1fr)}.nav{position:static;height:auto;flex-direction:row;overflow-x:auto;padding:8px 12px;border-right:0;border-bottom:1px solid var(--premium-rule);gap:4px}.nav::before{display:none}.nav button{min-height:44px;padding:8px 12px}.topbar{position:relative}.brand{min-width:0}.brand span{display:none}:root .topbar{padding:12px 18px;gap:16px}.tb-right #who{display:block;max-width:150px}.tb-right{margin-left:auto}.exec-primary{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}main#view{padding:20px 18px 60px}.exec-heading h1{font-size:2rem}}
@media screen and (max-width:760px){.premium-login{grid-template-columns:minmax(0,1fr);padding:28px 22px;gap:28px}.login-story{max-width:560px;margin:auto}.login-wordmark{margin-bottom:14px;font-size:2.3rem}.login-story h2{font-size:1.6rem}.login-lede{margin:10px 0 16px;font-size:.85rem}.login-equipment{margin-top:18px}.equipment-photo{aspect-ratio:2.2}.premium-login .auth-card{max-width:560px;margin:auto}.premium-login .login-heading h1{font-size:1.6rem}.exec-primary,.exec-secondary{grid-template-columns:minmax(0,1fr)}.exec-secondary .exec-status{grid-column:auto}.exec-heading{align-items:flex-start}.exec-date{font-size:.7rem;max-width:140px;flex-shrink:1}.exec-heading h1{font-size:1.7rem}.exec-heading p{font-size:.72rem}.exec-metric{padding:16px 12px;gap:10px}.exec-metric-icon{width:32px;height:40px}.exec-metric strong{font-size:1.9rem}.exec-metric strong.exec-na{font-size:1.1rem}.exec-metric h2{font-size:.8rem}.exec-metric p{font-size:.7rem}:root .topbar{flex-wrap:wrap;min-height:70px;gap:10px}.brand b{font-size:1.4rem}.sites{order:3;width:100%;justify-content:flex-start}.acct{max-width:160px}.acct-n{max-width:100%;overflow:hidden;text-overflow:ellipsis}.exec-context{font-size:.75rem}.executive .panel{padding:16px}.exec-heading .eyebrow{font-size:.65rem}}
@media screen and (max-width:400px){.exec-metric-icon{display:none}.exec-metrics{gap:10px}.exec-heading{display:block}.exec-date{text-align:left;max-width:none;margin-top:10px}.exec-date span{display:inline;margin-left:10px}.premium-login{padding:22px 16px}.premium-login .auth-card{padding:28px 20px}main#view{padding-inline:12px}}
@media screen and (max-width:760px){.premium-login .auth-card{grid-row:1}.premium-login .login-story{grid-row:2}}
@media screen{
  .asip-logo{background:var(--on-navy) url('/branding/asip-thailand.png') center/contain no-repeat;border:1px solid var(--champagne-edge);border-radius:10px;width:56px;height:56px;flex-shrink:0}
  .brand>div:last-child>span{display:block;font-size:.6rem;letter-spacing:.22em}
  .premium-login .login-logo{width:170px;height:170px;margin-bottom:24px}
  .premium-login .auth-brand .asip-logo{width:145px;height:145px}
  .premium-login .auth-brand{padding-bottom:18px}
  .exec-coordinate-board{height:300px;min-height:0}
  .exec-coordinate-board svg{height:100%;max-height:none}
  .exec-heading{margin-bottom:12px}.exec-heading h1{font-size:clamp(1.7rem,2.2vw,2.3rem);margin:5px 0 7px}
  .exec-context{padding-block:8px;margin-bottom:14px}.exec-metric{padding-block:16px}.exec-metrics{margin-bottom:16px}
}
@media screen and (max-width:760px){.brand .asip-logo{width:40px;height:40px}.premium-login .auth-brand .asip-logo{width:120px;height:120px}.premium-login .login-logo{width:135px;height:135px}}

/* Final visual revision. Decorative geography never represents live coverage.
   The photographic city remains an unchanged CC BY-SA asset; CSS framing and
   color overlays of that photograph are offered under the same license. */
@media screen{
  .premium-login{position:relative;isolation:isolate;overflow:hidden;max-width:none;min-height:100svh;padding:32px 4.5% 52px;grid-template-columns:minmax(0,1.65fr) minmax(340px,.9fr);gap:4%;background:var(--navy)}
  .login-scene{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 34% 10%,#16344b 0,transparent 55%),var(--navy)}
  .login-skyline{position:absolute;bottom:0;left:0;width:100%;height:62%;object-fit:cover;object-position:center;opacity:.85;mask-image:linear-gradient(transparent,#000 22%,#000 80%,transparent)}
  .login-scene::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,15,29,.18),transparent 56%,rgba(3,15,29,.55)),linear-gradient(rgba(3,15,29,.15),transparent 60%,rgba(3,15,29,.7))}
  .login-coverage{position:absolute;top:-7%;left:22%;width:50%;height:68%;opacity:.65;transform:rotate(-7deg)}
  .login-coverage svg{width:100%;height:100%;background:url('/maps/thailand-ne50m.svg') center/contain no-repeat;filter:drop-shadow(0 0 12px #d5a24d55);mask-image:radial-gradient(ellipse,#000 44%,transparent 72%)}
  .hero-network{fill:var(--champagne);stroke:var(--champagne);stroke-width:.8;filter:drop-shadow(0 0 4px var(--champagne))}.hero-network path{fill:none;opacity:.8}
  .login-story{position:relative;justify-content:flex-start;padding-top:0}
  .premium-login .login-logo{width:170px;height:170px;margin:0 0 14px}
  .premium-login .asip-logo{background-image:url('/branding/asip-thailand.png'),radial-gradient(ellipse,#f6f1e8 38%,#f6f1e8bb 53%,transparent 72%);background-color:transparent;background-size:contain;background-repeat:no-repeat;border:0;border-radius:0;position:relative;filter:drop-shadow(0 3px 14px #020a14)}
  .login-story .eyebrow{font-size:.7rem;letter-spacing:.18em;color:var(--champagne);margin:0 0 12px;text-shadow:0 2px 5px var(--navy)}
  .login-story h2{font-family:Georgia,serif;font-size:clamp(2rem,3.45vw,3.8rem);line-height:1.13;letter-spacing:-.025em;font-weight:400;text-shadow:0 2px 18px var(--navy);margin:0}
  .login-lede{color:var(--on-navy);font-size:.95rem;margin:18px 0;text-shadow:0 2px 5px var(--navy)}
  .login-principles{gap:20px;color:var(--on-navy);font-size:.8rem;margin:4px 0 0;text-shadow:0 2px 5px var(--navy)}
  .login-principles span{padding:8px 0 8px 12px;border-color:var(--champagne)}
  .login-equipment{position:relative;margin:0;isolation:isolate;max-width:800px}
  .equipment-photo{position:relative;display:block;width:100%;height:auto;aspect-ratio:2;object-fit:cover;border:0;border-radius:0;mix-blend-mode:lighten;mask-image:radial-gradient(ellipse at 50% 52%,#000 43%,#000b 62%,transparent 76%)}
  .launch-platform{position:absolute;bottom:14%;left:5%;width:90%;height:16%;border:1px solid var(--champagne);border-radius:50%;background:radial-gradient(ellipse,#091827cc 50%,#d8ae5555 69%,transparent 71%);box-shadow:0 0 20px #d8ae5544,inset 0 0 18px #d8ae5544;transform:perspective(500px) rotateX(30deg);z-index:-1}
  .login-equipment figcaption{margin-top:-12px;position:relative;font-size:.72rem;line-height:1.6;background:rgba(3,15,29,.85);padding:6px 10px;border-left:2px solid var(--champagne-edge)}
  .premium-login .auth-card{align-self:center;position:relative;padding:28px;gap:16px;max-width:510px;justify-self:end;background:linear-gradient(135deg,#143652eF,#061525ed 55%);backdrop-filter:blur(12px);border-radius:18px;box-shadow:0 15px 65px #0009,0 0 25px #d8ae5522,inset 0 1px 0 var(--champagne)}
  .premium-login .auth-brand{padding:0;border:0}.premium-login .auth-brand .asip-logo{width:160px;height:160px}
  .login-heading .login-welcome{font:2.5rem Georgia,serif;color:var(--on-navy);margin:0 0 6px}
  .login-heading h1{font-size:1.1rem;margin:4px 0 8px}.login-heading p:last-child{font-size:.85rem;margin:0}
  .premium-login .login-security{padding-top:16px;font-size:.75rem;margin-bottom:0}
  .premium-login .field input{box-shadow:inset 0 1px 8px #0003}
  .premium-login .btn.primary{background:linear-gradient(#ebc787,#c79a58 50%,#a57737);color:#071828;box-shadow:inset 0 1px #fff7,0 4px 16px #0004}
  .login-credits{position:absolute;bottom:14px;left:4.5%;right:4.5%;font-size:.68rem;line-height:1.7;color:var(--on-navy-muted)}.login-credits a{color:var(--champagne);text-underline-offset:3px}
  .premium-login :focus-visible{outline:3px solid var(--champagne);outline-offset:4px}
  main#view:has(.executive){padding:16px 18px 48px}
  .shell{grid-template-columns:208px minmax(0,1fr)}.nav{padding:18px 10px}.nav button{padding:9px 12px}
  .exec-heading{position:relative;overflow:hidden;isolation:isolate;padding:8px 14px 14px;border-bottom:1px solid var(--champagne-edge);background:radial-gradient(ellipse at 75% 40%,var(--navy-raised),var(--navy));border-radius:10px 10px 0 0}
  .exec-heading::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.2;background:url('/maps/thailand-ne50m.svg') 75% 40%/460px auto no-repeat;pointer-events:none}
  .exec-heading h1{margin:2px 0 3px;font-size:1.9rem}.exec-heading p{font-size:.78rem}
  .exec-context{margin-bottom:12px;font-size:.78rem;padding:7px 12px}
  .exec-metrics{gap:10px;margin-bottom:12px}.exec-metric{padding:12px;gap:10px}.exec-metric strong{font-size:2.1rem}.exec-metric-icon{width:36px;height:46px}.exec-metric h2{font-size:.85rem}.exec-metric p{font-size:.75rem}
  .exec-primary{grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:12px}.executive .panel{padding:14px;margin-bottom:12px}.executive .panel h2{font-size:1rem}.executive .ph{margin-bottom:8px}
  .exec-coordinate-board{height:230px;margin:6px 0}.exec-map-sites{gap:8px}.exec-site-link{padding:8px 10px}.exec-site-link span{font-size:.75rem}.exec-map-note{font-size:.75rem;margin:8px 0 0}
  .exec-alerts{margin:8px 0}.exec-alerts li{padding:10px 0;gap:8px}.exec-alerts p{margin:4px 0}.exec-alerts small{font-size:.75rem}
  .exec-definition{padding:8px 10px;margin:10px 0}.exec-secondary{gap:12px;grid-template-columns:1.2fr 1.2fr 1fr}.exec-secondary .tbl{font-size:.8rem}.exec-secondary .muted{font-size:.75rem}.exec-status dl>div{padding:6px 0}.exec-status dd{margin:2px 0 0}
}
@media screen and (min-width:1201px){.exec-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media screen and (max-width:1200px){.premium-login{padding-inline:3%;gap:3%;grid-template-columns:minmax(0,1.2fr) minmax(330px,.9fr)}.premium-login .auth-card{padding:24px}.login-story h2{font-size:2.6rem}.exec-secondary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media screen and (max-width:980px){.shell{grid-template-columns:minmax(0,1fr)}.exec-heading h1{font-size:1.8rem}.premium-login{padding-top:28px}.premium-login .login-logo{width:140px;height:140px}.login-story h2{font-size:2.15rem}.login-principles{gap:8px}.equipment-photo{aspect-ratio:1.65}.exec-coordinate-board{height:250px}}
@media screen and (max-width:760px){
  .premium-login{grid-template-columns:minmax(0,1fr);padding:22px 18px 24px;gap:24px}
  .premium-login .login-story{grid-row:1;display:grid;grid-template-columns:80px minmax(0,1fr);gap:8px 14px;align-items:center;max-width:560px}
  .premium-login .login-logo{width:80px;height:80px;margin:0;grid-column:1;grid-row:1/3}.login-story .eyebrow{font-size:.58rem;margin:0;align-self:end;letter-spacing:.08em}.login-story h2{font-size:clamp(1.35rem,5vw,2rem);grid-column:2;align-self:start}.login-story h2 br{display:none}.login-lede{grid-column:1/-1;margin:3px 0;font-size:.85rem;text-align:center}.login-principles{display:none}
  .login-equipment{grid-column:1/-1;max-width:560px;width:100%;margin:auto}.equipment-photo{height:220px;aspect-ratio:auto;object-fit:contain;mask-image:radial-gradient(ellipse,#000 43%,transparent 77%)}.login-equipment figcaption{font-size:.7rem;margin:-4px 0 0;gap:0}.launch-platform{bottom:24%;height:12%;width:75%;left:12.5%}
  .premium-login .auth-card{grid-row:2;justify-self:center;padding:24px;gap:16px}.premium-login .auth-brand{display:none}.login-heading .login-welcome{font-size:2rem}.login-heading h1{font-size:1.05rem}
  .login-coverage{top:-6%;left:26%;width:80%;height:50%;opacity:.55}.login-skyline{top:80px;bottom:auto;height:430px;object-position:center}.login-credits{position:static;grid-column:1;font-size:.7rem;text-align:center;max-width:560px;margin:auto}
  .exec-primary,.exec-secondary{grid-template-columns:minmax(0,1fr)}.exec-secondary .exec-status{grid-column:auto}.exec-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.exec-heading{padding:10px}.exec-heading h1{font-size:1.65rem}.exec-heading .exec-date{font-size:.75rem}.exec-heading p{font-size:.8rem}.exec-context{font-size:.8rem}
  main#view:has(.executive){padding:12px 12px 36px}.exec-coordinate-board{height:auto;aspect-ratio:600/340}.exec-coordinate-board svg{min-height:180px}.exec-map-sites{grid-template-columns:minmax(0,1fr)}.exec-site-link{min-height:54px}.exec-site-link b{font-size:.9rem}.exec-map-note,.exec-attention>.muted,.exec-secondary .muted{font-size:.8rem}.exec-metric p{font-size:.75rem}.exec-metric strong.exec-na{font-size:1.05rem}.exec-metric-icon{display:none}.exec-secondary .tbl{font-size:.85rem}.exec-secondary .tbl td,.exec-secondary .tbl th{padding:8px 6px;white-space:normal}.exec-status dl>div{font-size:.85rem;padding:8px 0}
}
@media screen and (prefers-reduced-motion:reduce){.premium-login *, .executive *{scroll-behavior:auto;transition:none}}
@media screen and (min-width:1201px){
  .exec-heading{padding:6px 14px 10px;margin-bottom:8px}.exec-heading .eyebrow{display:none}
  .exec-map{position:relative}.exec-coordinate-board{height:300px}
  .exec-map-sites{position:absolute;bottom:68px;left:14px;width:180px;grid-template-columns:minmax(0,1fr);z-index:1}
  .exec-map-sites .exec-site-link{background:#0c233bf2}
}
@media screen and (max-width:760px){.coordinate-label{font-size:13px}.coordinate-site{font-size:16px}}
