/* TongaAI Project Command – one small stylesheet, no frameworks (low bandwidth). */
:root{--ink:#14212b;--ink2:#4a5a66;--mute:#7b8a95;--bg:#f3f5f7;--card:#fff;--line:#dfe5ea;--pri:#0b344c;--pri2:#0b6e8a;--acc:#d9552f;--gold:#e9b44c;
--ok:#1f8a5b;--okb:#e3f4ec;--warn:#a86b00;--warnb:#fdf2d9;--bad:#c0392b;--badb:#fbe5e2;--info:#0b6e8a;--infob:#e1f1f6;--ai:#6b3fa0;--aib:#efe7f8;--side:#0b2533;--sideink:#c9d6de;
--r:10px;--sh:0 1px 2px rgba(10,30,45,.06),0 4px 14px rgba(10,30,45,.05)}
@media (prefers-color-scheme:dark){:root{--ink:#e6edf2;--ink2:#b5c3cc;--mute:#8797a2;--bg:#0e171d;--card:#152229;--line:#24353f;--pri:#7cc7e3;--pri2:#58b4d4;--okb:#123326;--warnb:#33290f;--badb:#3a1b18;--infob:#0f2c37;--aib:#2a1d3a;--side:#081218;--sideink:#a9bcc7}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;font:14px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--pri2);text-decoration:none}a:hover{text-decoration:underline}
h1{font-size:1.45rem;margin:0 0 .2rem;line-height:1.25}h2{font-size:1.02rem;margin:0}h3{font-size:.95rem;margin:.6rem 0 .3rem}
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:.6rem;padding:.45rem .9rem;background:var(--pri);color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.15)}
@media (prefers-color-scheme:dark){.top{background:#0b344c}}
.brand{display:flex;align-items:center;gap:.45rem;color:#fff;font-size:1.05rem;white-space:nowrap}.brand:hover{text-decoration:none}.brand b{color:var(--gold)}
.demo-tag{font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;background:rgba(255,255,255,.14);padding:.12rem .5rem;border-radius:20px;white-space:nowrap}
.search{flex:1;max-width:340px}.search input{width:100%;padding:.38rem .7rem;border-radius:20px;border:0;background:rgba(255,255,255,.15);color:#fff}.search input::placeholder{color:#cfe0e8}
.top-right{margin-left:auto;display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;justify-content:flex-end}
.pill{display:inline-flex;align-items:center;gap:.25rem;padding:.25rem .6rem;border-radius:20px;background:rgba(255,255,255,.14);color:#fff;border:0;font:inherit;font-size:.82rem;cursor:pointer}.pill:hover{background:rgba(255,255,255,.25);text-decoration:none}
.who{display:flex;align-items:center;gap:.4rem;color:#fff;font-size:.82rem;line-height:1.15}.who small{display:block;color:#cfe0e8;font-size:.72rem}.who-icon{font-size:1.2rem}
.inline{display:inline}.navtoggle{display:none;background:none;border:0;color:#fff;font-size:1.3rem;cursor:pointer}
.shell{display:flex;min-height:calc(100vh - 50px)}
.side{width:226px;flex:none;background:var(--side);color:var(--sideink);padding:.6rem 0 1.2rem;position:sticky;top:50px;height:calc(100vh - 50px);overflow-y:auto}
.nav-g{margin-bottom:.35rem}.nav-h{font-size:.66rem;text-transform:uppercase;letter-spacing:.08em;color:#7f97a4;padding:.55rem 1rem .2rem}
.side a{display:flex;gap:.55rem;align-items:center;padding:.3rem 1rem;color:var(--sideink);font-size:.86rem;border-left:3px solid transparent}
.side a i{font-style:normal;width:1.1rem;text-align:center;opacity:.8}.side a:hover{background:rgba(255,255,255,.06);text-decoration:none;color:#fff}
.side a.on{background:rgba(233,180,76,.12);border-left-color:var(--gold);color:#fff}
.nav-foot{font-size:.72rem;color:#7f97a4;padding:.8rem 1rem}.nav-foot a{color:#9fc3d3;padding:0;display:inline;border:0}
main{flex:1;min-width:0;padding:1.1rem 1.4rem 2rem}
.foot{font-size:.74rem;color:var(--mute);text-align:center;padding:1rem}
@media (max-width:900px){.navtoggle{display:block}.side{position:fixed;left:-240px;top:50px;z-index:30;transition:left .2s}body.navopen .side{left:0}main{padding:.9rem}.search{display:none}.who small,.demo-tag{display:none}}
.ph{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:.9rem;flex-wrap:wrap}.sub{color:var(--ink2);margin:.1rem 0 0;max-width:900px}
.trace{margin:.35rem 0 0}.req{display:inline-block;font-size:.68rem;font-family:ui-monospace,Consolas,monospace;background:var(--infob);color:var(--info);padding:.05rem .4rem;border-radius:4px;margin-right:.2rem}
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:.65rem;margin-bottom:1rem}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:.65rem .8rem;box-shadow:var(--sh);display:flex;flex-direction:column;color:inherit;border-left:4px solid var(--pri2)}
a.kpi:hover{text-decoration:none;border-color:var(--pri2)}.kl{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--mute)}.kv{font-size:1.32rem;font-weight:700;line-height:1.3}.ks{font-size:.76rem;color:var(--ink2)}
.kpi.t-ok{border-left-color:var(--ok)}.kpi.t-warn{border-left-color:var(--gold)}.kpi.t-bad{border-left-color:var(--bad)}.kpi.t-info{border-left-color:var(--info)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);margin-bottom:1rem;overflow:hidden}
.card-h{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.6rem .9rem;border-bottom:1px solid var(--line);flex-wrap:wrap}.card-b{padding:.8rem .9rem}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:1rem}.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem}
@media (max-width:520px){.grid2,.grid3{grid-template-columns:1fr}}
.tw{overflow-x:auto}.t{width:100%;border-collapse:collapse;font-size:.85rem}.t th{text-align:left;font-weight:600;color:var(--ink2);font-size:.74rem;text-transform:uppercase;letter-spacing:.03em;padding:.4rem .5rem;border-bottom:2px solid var(--line);white-space:nowrap}
.t td{padding:.38rem .5rem;border-bottom:1px solid var(--line);vertical-align:top}.t tr:hover td{background:rgba(11,110,138,.04)}.n{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.t tr.hl td{background:var(--warnb)}.t tr.bad td{background:var(--badb)}.t tr.tot td{font-weight:700;border-top:2px solid var(--line)}
.tfilter{margin:0 0 .5rem;padding:.35rem .6rem;border:1px solid var(--line);border-radius:6px;width:min(320px,100%);background:var(--card);color:var(--ink)}
.b{display:inline-block;font-size:.72rem;font-weight:600;padding:.08rem .45rem;border-radius:20px;white-space:nowrap;line-height:1.5}
.b-ok{background:var(--okb);color:var(--ok)}.b-warn{background:var(--warnb);color:var(--warn)}.b-bad{background:var(--badb);color:var(--bad)}.b-info{background:var(--infob);color:var(--info)}.b-mute{background:var(--line);color:var(--ink2)}.b-ai{background:var(--aib);color:var(--ai)}
.flash{padding:.6rem .9rem;border-radius:8px;margin-bottom:.8rem;font-weight:500}.flash-ok{background:var(--okb);color:var(--ok)}.flash-bad{background:var(--badb);color:var(--bad)}
.empty{color:var(--mute);font-style:italic;margin:.3rem 0}.muted{color:var(--mute)}.small{font-size:.8rem}
.tabs{display:flex;gap:.2rem;border-bottom:2px solid var(--line);margin:0 0 .9rem;overflow-x:auto}.tabs a{padding:.45rem .8rem;color:var(--ink2);border-bottom:2px solid transparent;margin-bottom:-2px;white-space:nowrap;font-size:.88rem}
.tabs a.on{color:var(--pri);border-bottom-color:var(--acc);font-weight:600}.tabs a:hover{text-decoration:none;color:var(--pri)}
.f label{display:inline-flex;flex-direction:column;gap:.15rem;font-size:.78rem;color:var(--ink2);margin:0 .6rem .55rem 0;vertical-align:top}.f label.full{display:flex;width:100%}
.f input,.f select,.f textarea{font:inherit;font-size:.86rem;padding:.38rem .5rem;border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--ink);min-width:150px}.f textarea{width:100%}
.row{display:flex;flex-wrap:wrap;gap:0 .2rem;align-items:flex-start}
.btn{font:inherit;font-size:.84rem;font-weight:600;padding:.42rem .9rem;border-radius:7px;border:1px solid transparent;cursor:pointer;display:inline-flex;align-items:center;gap:.3rem}
.btn-pri{background:var(--pri);color:#fff}.btn-pri:hover{filter:brightness(1.15)}.btn-acc{background:var(--acc);color:#fff}.btn-ghost{background:transparent;border-color:var(--line);color:var(--ink)}.btn-bad{background:var(--bad);color:#fff}
@media (prefers-color-scheme:dark){.btn-pri{background:#1a6f93}}
.detw{border:1px solid var(--line);border-left:4px solid var(--pri);border-radius:8px;padding:.7rem .85rem;margin:.6rem 0;background:linear-gradient(0deg,var(--card),var(--card))}
.detw-h{font-weight:700;font-size:.85rem;margin-bottom:.45rem;color:var(--pri)}
.aiprop{border:1px dashed var(--ai);background:var(--aib);border-radius:8px;padding:.6rem .8rem;margin:.5rem 0}.reasons{margin:.35rem 0 .2rem 1.1rem;padding:0;font-size:.8rem}
.draft{white-space:pre-wrap;background:var(--card);border:1px solid var(--line);border-radius:6px;padding:.6rem;font:12.5px/1.45 ui-monospace,Consolas,monospace;max-height:340px;overflow:auto}
.detref{font-size:.75rem;font-family:ui-monospace,Consolas,monospace;white-space:nowrap}
.chart{width:100%;height:auto;max-height:290px;display:block}.chart .grid{stroke:var(--line);stroke-width:1}.ax{font-size:10.5px;fill:var(--mute)}.today{stroke:var(--acc);stroke-width:1.5;stroke-dasharray:4 3}
.gantt-wrap{overflow-x:auto}.gantt{min-width:900px;width:100%;height:auto}.gantt .grid{stroke:var(--line)}.gl{font-size:11px;fill:var(--ink)}.gl.crit{fill:var(--acc);font-weight:600}
.gc{fill:var(--acc)}.gn{fill:#5aa6c2}.gd{fill:#9fb3bf}.gp{fill:rgba(20,33,43,.35)}.gb{fill:#3d4a54;opacity:.55}
.legend{font-size:.78rem;color:var(--ink2)}.lg{display:inline-block;width:14px;height:8px;margin:0 .3rem 0 .8rem;border-radius:2px;vertical-align:middle}.lg.gc{background:var(--acc)}.lg.gn{background:#5aa6c2}.lg.gd{background:#9fb3bf}.lg.gb{background:#3d4a54;opacity:.6}
.spark polyline{stroke:var(--pri2)}.spth{stroke:var(--acc);stroke-dasharray:3 2}
.heat{text-align:center;font-weight:600;font-size:.8rem}.h0{color:var(--mute)}.h1{background:#e3f4ec}.h2{background:#eef6d9}.h3{background:#fdf2d9}.h4{background:#fbe2cf}.h5{background:#f7cdc6}
@media (prefers-color-scheme:dark){.h1{background:#143326}.h2{background:#26331a}.h3{background:#3a2e12}.h4{background:#40261a}.h5{background:#45201c}}
.bar{height:8px;background:var(--line);border-radius:5px;overflow:hidden;min-width:70px}.bar>span{display:block;height:100%;background:var(--pri2)}.bar.warn>span{background:var(--gold)}.bar.bad>span{background:var(--bad)}
.clock{font-family:ui-monospace,Consolas,monospace;font-weight:700}
.persona-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:.6rem}
.persona{display:flex;gap:.6rem;align-items:flex-start;text-align:left;padding:.65rem .75rem;border:1px solid var(--line);border-radius:9px;background:var(--card);cursor:pointer;font:inherit;color:inherit;width:100%}
.persona:hover{border-color:var(--pri2);box-shadow:var(--sh)}.persona .pi{font-size:1.4rem}.persona b{display:block;font-size:.88rem}.persona small{color:var(--ink2);font-size:.74rem;display:block;line-height:1.3}
.login-hero{background:linear-gradient(135deg,#0b2533,#0b344c 55%,#0b6e8a);color:#fff;padding:2.2rem 1.4rem 1.6rem}.login-hero h1{font-size:2rem}.login-hero p{max-width:820px;color:#d6e6ee}
.login-wrap{max-width:1180px;margin:0 auto;padding:1.2rem 1rem 2rem}.stat-row{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem}.stat{background:rgba(255,255,255,.1);border-radius:9px;padding:.5rem .8rem;min-width:140px}.stat b{display:block;font-size:1.25rem;color:var(--gold)}.stat span{font-size:.75rem;color:#cfe0e8}
.steps{counter-reset:s;list-style:none;padding:0}.steps li{position:relative;padding:.6rem .8rem .6rem 3rem;border:1px solid var(--line);border-radius:9px;margin-bottom:.5rem;background:var(--card)}
.steps li::before{counter-increment:s;content:counter(s);position:absolute;left:.8rem;top:.6rem;width:1.6rem;height:1.6rem;border-radius:50%;background:var(--pri);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:.8rem}
.map{width:100%;height:auto;max-height:330px;background:var(--infob);border-radius:8px}.map .dot{stroke:#fff;stroke-width:1.5}.map text{font-size:10px;fill:var(--ink)}
.toc{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}.toc .node{border:1px solid var(--line);border-radius:8px;padding:.4rem .6rem;background:var(--card);max-width:200px;font-size:.8rem}.toc .node b{display:block;font-size:.66rem;text-transform:uppercase;color:var(--mute)}.toc .arr{color:var(--mute)}
.kv-list{display:grid;grid-template-columns:max-content 1fr;gap:.25rem .9rem;font-size:.86rem}.kv-list dt{color:var(--mute)}.kv-list dd{margin:0}
.offline-banner{display:none;background:var(--warnb);color:var(--warn);padding:.4rem .8rem;border-radius:7px;margin-bottom:.6rem;font-weight:600}body.is-offline .offline-banner{display:block}
@media print{.top,.side,.foot,.tabs,form,.btn{display:none!important}main{padding:0}.card{box-shadow:none;break-inside:avoid}body{background:#fff}}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.contact{display:inline-block;margin-top:.25rem;color:var(--ink2)}.contact a{color:var(--pri2)}
/* ---------- navigation aids: back trail, dropdowns, drawer (v1.1) ---------- */
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--gold);color:#000;padding:.5rem .8rem;border-radius:0 0 8px 0}.skip:focus{left:0}
.backbtn{background:var(--gold);color:#14212b;font-weight:700;max-width:240px}.backbtn:hover{background:#f0c766}.backlbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:190px;display:inline-block;vertical-align:bottom}
.fab-back{position:fixed;left:14px;bottom:16px;z-index:40;display:none;align-items:center;gap:.3rem;border:0;border-radius:24px;padding:.65rem 1rem;background:var(--gold);color:#14212b;font:inherit;font-weight:700;box-shadow:0 6px 18px rgba(0,0,0,.25);cursor:pointer;max-width:70vw}
.fab-back[hidden],.backbtn[hidden]{display:none!important}
.pc-flash{animation:pcflash 2.2s ease-out}@keyframes pcflash{0%,35%{box-shadow:0 0 0 3px var(--gold);background:rgba(233,180,76,.18)}100%{box-shadow:0 0 0 0 transparent}}
tr.pc-flash td{background:rgba(233,180,76,.22)}
.dd{position:relative}.dd-toggle .cnt{display:inline-block;min-width:1.3em;text-align:center;background:var(--acc);color:#fff;border-radius:10px;padding:0 .3em;font-size:.75rem}.dd-toggle .cnt.zero{background:rgba(255,255,255,.2)}
.who-txt{display:inline-flex;flex-direction:column;line-height:1.1;text-align:left;margin-left:.2rem}.who-txt small{font-size:.68rem;color:#cfe0e8;font-weight:400}
.dd-panel{position:absolute;right:0;top:calc(100% + 8px);width:360px;max-width:calc(100vw - 20px);max-height:70vh;overflow:auto;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 40px rgba(0,0,0,.28);z-index:60;padding:.3rem 0}
.dd-h{padding:.55rem .9rem;font-weight:700;border-bottom:1px solid var(--line);font-size:.85rem}.dd-h small{font-weight:400;color:var(--ink2)}
.dd-item{display:flex;gap:.6rem;align-items:flex-start;padding:.55rem .9rem;color:var(--ink);border-bottom:1px solid var(--line);font-size:.84rem;line-height:1.35}.dd-item:hover,.dd-item:focus{background:rgba(11,110,138,.08);text-decoration:none}
.dd-item small{display:block;color:var(--mute);font-size:.72rem}.dd-item.read{opacity:.6}.dd-t{display:block}
.dot{flex:none;width:9px;height:9px;border-radius:50%;margin-top:.35rem;background:var(--info)}.dot.k-bad{background:var(--bad)}.dot.k-warn{background:var(--gold)}.dot.k-ok{background:var(--ok)}
.dd-empty{padding:.8rem .9rem;color:var(--mute);margin:0}.dd-f{display:flex;justify-content:space-between;align-items:center;padding:.5rem .9rem;font-size:.82rem}
.dd-panel > a:not(.dd-item){display:block;padding:.55rem .9rem;color:var(--ink)}.dd-btn{background:none;border:0;color:var(--pri2);font:inherit;cursor:pointer;padding:.55rem .9rem;text-align:left;width:100%}.dd-btn.small{width:auto;padding:0;font-size:.82rem}
.scrim{position:fixed;inset:50px 0 0 0;background:rgba(0,0,0,.45);z-index:25}
.side-search{display:none;padding:.5rem .8rem}.side-search input{width:100%;padding:.45rem .7rem;border-radius:18px;border:0;background:rgba(255,255,255,.12);color:#fff}
/* ---------- responsive: tablet ---------- */
@media (max-width:1100px){.who-txt small{display:none}.demo-tag{display:none}.grid2{grid-template-columns:1fr}}
@media (max-width:900px){
  .top{padding:.4rem .6rem;gap:.4rem}.brand span{display:none}.search{display:none}.side-search{display:block}.who-txt{display:none}
  .side{position:fixed;left:-270px;width:260px;top:50px;height:calc(100vh - 50px);z-index:30;transition:left .2s;box-shadow:4px 0 18px rgba(0,0,0,.3)}body.navopen .side{left:0}
  main{padding:.8rem}.ph{flex-direction:column;gap:.4rem}.ph-r{width:100%}
  .backbtn{display:none!important}.fab-back{display:inline-flex}
  .kpis{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
}
/* ---------- responsive: phone ---------- */
@media (max-width:600px){
  body{font-size:15px}.hide-sm{display:none}.pill{padding:.3rem .5rem}.top-right{gap:.3rem}
  h1{font-size:1.2rem}.kpis{grid-template-columns:1fr 1fr;gap:.5rem}.kv{font-size:1.1rem}.kpi{padding:.55rem .6rem}
  .card-b{padding:.65rem .6rem}.card-h{padding:.55rem .6rem}.grid3{grid-template-columns:1fr}
  .dd-panel{position:fixed;left:8px;right:8px;top:54px;width:auto;max-width:none;max-height:75vh}
  .f label{display:flex;width:100%;margin-right:0}.f input,.f select,.f textarea{width:100%;min-width:0;font-size:16px}.btn{padding:.6rem 1rem;font-size:.95rem}
  .t thead{display:none}.t,.t tbody,.t tr,.t td{display:block;width:100%}
  .t tr{border:1px solid var(--line);border-radius:9px;margin-bottom:.55rem;padding:.35rem .5rem;background:var(--card)}
  .t td{display:flex;justify-content:space-between;align-items:flex-start;gap:.8rem;border:0;padding:.22rem 0;text-align:right}.t td.n{text-align:right}
  .t td[data-l]::before{content:attr(data-l);flex:none;max-width:42%;text-align:left;color:var(--mute);font-size:.7rem;text-transform:uppercase;letter-spacing:.03em;padding-top:.12rem}
  .t td:not([data-l]){justify-content:flex-start;text-align:left}.t tr.tot{background:var(--infob)}.t tr:hover td{background:none}
  .kv-list{grid-template-columns:1fr;gap:.1rem}.kv-list dt{margin-top:.4rem}.tabs a{padding:.5rem .6rem}
  .persona-grid{grid-template-columns:1fr}.login-hero h1{font-size:1.5rem}.stat{min-width:calc(50% - .3rem)}
  .chart{max-height:220px}.fab-back{left:10px;bottom:12px}
}
@media (pointer:coarse){.side a{padding:.55rem 1rem}.dd-item{padding:.7rem .9rem}.tabs a{padding:.6rem .8rem}}
@media print{.fab-back,.backbtn,.dd-panel{display:none!important}}
.show-sm{display:none}@media (max-width:600px){.show-sm{display:inline}}
.card.hl{border-color:var(--gold);box-shadow:0 0 0 2px rgba(233,180,76,.45)}