
/* Layout: two modes. The public site is an editorial magazine (wide headlines, topo-line hero, content rows).
   "My Hub" is a working app shell with a dark side rail. Safety orange marks emergency and alerts only. */
:root{
  --bg:#f4f5f2; --surface:#ffffff; --sunk:#e9ebe6; --line:#d6dad2;
  --ink:#17201c; --muted:#5b665f; --spruce:#1f4a3f; --spruce-2:#2f6b5a; --spruce-soft:#dce9e3;
  --sky:#3d6e8f; --alert:#e2601a; --alert-soft:#fce6d9;
  --good:#2f7a4a; --warn:#b07416; --crit:#c2412d;
  --hero:#1f4a3f; --rail:#15201c; --rail-ink:#d7e2dc; --rail-muted:#8ea198; --rail-hi:#22332c;
  --display:"Archivo","Arial Narrow",system-ui,sans-serif;
  --body:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#111614; --surface:#18201c; --sunk:#202a25; --line:#30403a;
  --ink:#e8ede9; --muted:#9caaa2; --spruce:#8fd0b8; --spruce-2:#7cc2a8; --spruce-soft:#1f3530;
  --sky:#8fb9d6; --alert:#f27b37; --alert-soft:#3b2417;
  --good:#5fbf7f; --warn:#e2a94b; --crit:#ef6f5a;
  --hero:#173a31; --rail:#0c110f; --rail-ink:#d7e2dc; --rail-muted:#7f9289; --rail-hi:#1b2823; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#111614; --surface:#18201c; --sunk:#202a25; --line:#30403a;
  --ink:#e8ede9; --muted:#9caaa2; --spruce:#8fd0b8; --spruce-2:#7cc2a8; --spruce-soft:#1f3530;
  --sky:#8fb9d6; --alert:#f27b37; --alert-soft:#3b2417;
  --good:#5fbf7f; --warn:#e2a94b; --crit:#ef6f5a;
  --hero:#173a31; --rail:#0c110f; --rail-ink:#d7e2dc; --rail-muted:#7f9289; --rail-hi:#1b2823; color-scheme:dark}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{min-height:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--surface)}
h1,h2,h3,h4{font-family:var(--display);margin:0;text-wrap:balance;line-height:1.08}
.wide{font-stretch:125%;font-weight:800;letter-spacing:-.01em;text-transform:uppercase}
h1.wide{font-size:clamp(2.1rem,6vw,4.2rem)}
h2{font-size:clamp(1.45rem,3vw,2rem);font-weight:750;font-stretch:112%}
h3{font-size:1.15rem;font-weight:700;font-stretch:100%}
p{margin:0}
a{color:inherit}
button,select,input{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--alert);outline-offset:2px}
.gut{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.wrap{max-width:1180px;margin:0 auto;width:100%}
.mock{background:var(--sunk);color:var(--muted);font-size:12px;text-align:center;padding-block:4px}
.eyebrow{font-family:var(--mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted)}
.muted{color:var(--muted)} .mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.small{font-size:13.5px}
.btn{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--line);background:var(--surface);border-radius:999px;padding:8px 16px;cursor:pointer;font-weight:650;font-size:14.5px;text-decoration:none;white-space:nowrap}
.btn:hover{border-color:var(--ink)}
.btn.dark{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.btn.spruce{background:var(--spruce);color:var(--surface);border-color:var(--spruce)}
.btn.emerg{background:var(--alert);border-color:var(--alert);color:#fff;font-family:var(--display);font-stretch:112%;text-transform:uppercase;letter-spacing:.04em;font-weight:800}
.tag{display:inline-block;font-size:11.5px;font-weight:650;padding:2px 9px;border-radius:999px;background:var(--sunk);color:var(--muted);white-space:nowrap}
.tag.alert{background:var(--alert-soft);color:var(--alert)}
.tag.sp{background:var(--spruce-soft);color:var(--spruce)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{border:1.5px solid var(--line);background:var(--surface);border-radius:999px;padding:5px 13px;font-size:13.5px;cursor:pointer;font-weight:550;white-space:nowrap}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:10px;min-width:0}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}
.g4{grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr))}
.bar{height:6px;border-radius:3px;background:var(--sunk);overflow:hidden}
.bar i{display:block;height:100%;background:var(--good)}
.bar i.w{background:var(--warn)} .bar i.c{background:var(--crit)}
ul.list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
ul.list li{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line)}
ul.list li:first-child{border-top:0}
.grow{flex:1;min-width:0}
input[type=checkbox]{accent-color:var(--spruce);width:18px;height:18px;margin-top:3px;flex:none}
.done{text-decoration:line-through;color:var(--muted)}
.tw{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:500;padding:8px;border-bottom:1px solid var(--line)}
td{padding:9px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
input.cell{width:78px;border:1px solid var(--line);background:var(--surface);border-radius:6px;padding:4px 6px;font-size:13px;font-family:var(--mono)}
label.f{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}
label.f input,label.f select{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:8px;font-size:15px;color:var(--ink);width:100%}
.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px}
.result{background:var(--sunk);border-radius:10px;padding:12px 14px;display:flex;gap:20px;flex-wrap:wrap}
.result div{display:flex;flex-direction:column}
.result b{font-family:var(--display);font-stretch:112%;font-size:1.8rem;line-height:1.05}

/* ===== PUBLIC SITE ===== */
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:6;background:var(--surface);border-bottom:1px solid var(--line)}
header.site .row{display:flex;align-items:center;gap:18px;padding-block:12px}
.logo{display:flex;align-items:center;gap:8px;text-decoration:none;font-family:var(--display);font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:1.1rem;letter-spacing:.02em}
.logo svg{width:28px;height:28px;flex:none}
.logo .lw{display:flex;flex-direction:column;line-height:1}
.logo .lw small{font-family:var(--mono);font-stretch:100%;font-weight:500;font-size:.62em;letter-spacing:.14em;margin-bottom:3px;opacity:.8}
nav.pub{display:flex;gap:4px;overflow-x:auto;flex:1;min-width:0;scrollbar-width:none}
nav.pub a{text-decoration:none;padding:6px 11px;border-radius:999px;font-weight:600;font-size:14.5px;white-space:nowrap;color:var(--muted)}
nav.pub a:hover{color:var(--ink)}
nav.pub a[aria-current="page"]{color:var(--ink);background:var(--sunk)}
@media (max-width:820px){header.site .row{flex-wrap:wrap;gap:10px}nav.pub{order:3;flex-basis:100%}}
.page{padding-block:28px 72px;display:flex;flex-direction:column;gap:56px}
.section-head{display:flex;align-items:end;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.section-head p{flex-basis:100%;color:var(--muted);max-width:62ch}
.section-head .more{margin-left:auto;font-weight:650;font-size:14.5px;text-decoration:none;color:var(--spruce)}

.hero{position:relative;border-radius:22px;overflow:hidden;background:var(--hero);color:#f1f6f3;min-height:420px;display:flex}
.hero canvas{position:absolute;inset:0;width:100%;height:100%}
.hero .in{position:relative;padding:clamp(24px,5vw,56px);display:flex;flex-direction:column;gap:18px;max-width:760px;justify-content:center}
.hero .eyebrow{color:#b9d8ca}
.hero p.lede{font-size:1.15rem;max-width:52ch;color:#d7e9e0}
.hero .ctas{display:flex;gap:10px;flex-wrap:wrap}
.hero .btn{border-color:#f1f6f3}
.hero .btn.light{background:#f1f6f3;color:#173a31}
.hero .btn.ghost{background:transparent;color:#f1f6f3}
.hero .stats{display:flex;gap:28px;flex-wrap:wrap;margin-top:8px}
.hero .stats b{display:block;font-family:var(--display);font-stretch:125%;font-size:1.6rem;font-weight:800}
.hero .stats span{font-size:13px;color:#b9d8ca}

.pillar-tile{border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:4px;text-decoration:none;cursor:pointer;text-align:left}
.pillar-tile:hover{border-color:var(--spruce)}
.pillar-tile b{font-family:var(--display);font-stretch:112%;font-size:1.15rem;font-weight:750}
.pillar-tile span{font-size:13.5px;color:var(--muted)}

.course{gap:10px}
.thumb{aspect-ratio:16/9;max-width:100%;border-radius:10px;position:relative;overflow:hidden;display:flex;align-items:flex-end;padding:12px;color:#fff;font-family:var(--display);font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:1.25rem;line-height:1}
.thumb small{position:absolute;top:10px;left:10px;font-family:var(--mono);font-size:11px;font-weight:400;letter-spacing:.08em;background:rgba(0,0,0,.35);padding:2px 7px;border-radius:999px;font-stretch:100%}
.meta{display:flex;gap:10px;flex-wrap:wrap;font-size:13.5px;color:var(--muted)}

.path{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));gap:10px;counter-reset:s}
.step{border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:6px}
.step .n{font-family:var(--mono);font-size:12px;color:var(--spruce)}
.step.now{border-color:var(--spruce);box-shadow:inset 0 0 0 1px var(--spruce)}
.step.done{opacity:.7}

.strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(150px,180px);gap:12px;overflow-x:auto;padding-bottom:6px}
.vthumb{aspect-ratio:9/16;border-radius:14px;color:#fff;padding:12px;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;text-decoration:none;position:relative;overflow:hidden}
.vthumb b{font-size:14px;line-height:1.25}
.vthumb span{font-size:12px;opacity:.85}

.qrow{display:grid;grid-template-columns:56px minmax(0,1fr);gap:14px;align-items:start}
.score{display:flex;flex-direction:column;align-items:center;border:1px solid var(--line);border-radius:10px;padding:6px 0;font-family:var(--mono)}
.score b{font-size:1.1rem}
.score span{font-size:10px;color:var(--muted)}
.vote{display:flex;flex-direction:column;align-items:center;gap:2px}
.vote button{border:1.5px solid var(--line);background:var(--surface);border-radius:8px;width:40px;height:30px;cursor:pointer}
.vote button[aria-pressed="true"]{background:var(--spruce);color:var(--surface);border-color:var(--spruce)}
.answer{border-left:3px solid var(--line);padding-left:12px;display:flex;flex-direction:column;gap:4px}
.answer.top{border-left-color:var(--good)}
.kbflag{font-size:12.5px;color:var(--good);font-weight:650}

.band{border-radius:22px;background:var(--sunk);padding:clamp(20px,4vw,40px);display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));align-items:center}
.signup{display:flex;gap:8px;flex-wrap:wrap}
.signup input{flex:1;min-width:200px;border:1.5px solid var(--line);background:var(--surface);border-radius:999px;padding:9px 16px}
footer.site{border-top:1px solid var(--line);padding-block:28px;color:var(--muted);font-size:13.5px}
footer.site .wrap{display:flex;gap:16px;flex-wrap:wrap;justify-content:space-between}

/* hero layout + explainer */
.hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
.hero h1.wide{font-size:clamp(2rem,4.4vw,3.5rem)}
.hero .art{position:relative;display:flex;align-items:center;justify-content:center;padding:clamp(8px,3vw,36px)}
.hero .art svg{width:100%;max-width:440px;height:auto}
.art .t{font-family:var(--mono);font-size:12px;fill:#d7e9e0}
.art .t.s{font-size:10.5px;fill:#9fc4b4}
.art .t.h{font-family:var(--display);font-stretch:125%;font-weight:800;font-size:15px;fill:#f1f6f3;letter-spacing:.02em}
.how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:4px}
.how div{border-top:1.5px solid rgba(214,236,224,.35);padding-top:10px;display:flex;flex-direction:column;gap:3px}
.how .n{font-family:var(--mono);font-size:11px;color:#f3a46f;letter-spacing:.1em}
.how b{font-family:var(--display);font-stretch:112%;font-size:1.05rem;color:#f1f6f3}
.how span{font-size:13.5px;color:#c4ddd2;line-height:1.4}
@media (max-width:900px){.hero{grid-template-columns:minmax(0,1fr)}.hero .art{padding-top:0}}
@media (max-width:560px){.how{grid-template-columns:minmax(0,1fr)}}
.pillar-tile.mine{border-color:var(--spruce);background:var(--spruce-soft)}
.pillar-tile .mark{font-family:var(--mono);font-size:10.5px;color:var(--spruce);letter-spacing:.08em;text-transform:uppercase}

/* hero slider + compact strip */
:root{--heroimg:url(assets/img/81c5461943.webp)}
.hero{display:block;min-height:0;background:#1f4a3f}
.slides{display:grid}
.sl{grid-area:1/1;position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);min-height:500px;opacity:0;visibility:hidden;transition:opacity .5s ease,visibility .5s}
.sl.on{opacity:1;visibility:visible}
.sl .in{padding-bottom:84px;position:relative;z-index:1}
.sl .vis{display:flex;align-items:center;justify-content:center;padding:clamp(16px,3vw,40px);padding-bottom:70px}
.sl h2.wide{font-size:clamp(1.9rem,4vw,3.1rem);color:#f1f6f3}
.s1{background:#1f4a3f var(--heroimg) right center/auto 100% no-repeat}
.s2{background:linear-gradient(135deg,#24384a,#16232e)}
.s3{background:linear-gradient(135deg,#141b18,#0b0f0d)}
.s4{background:linear-gradient(135deg,#3b3122,#211b13)}
.hctl{position:absolute;left:clamp(24px,5vw,56px);bottom:20px;z-index:3;display:flex;gap:10px;align-items:center}
.hctl .arr{width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.45);background:rgba(0,0,0,.25);color:#fff;cursor:pointer;font-size:16px}
.hctl .dots{display:flex;gap:6px}
.hctl .dots button{width:9px;height:9px;border-radius:5px;border:0;background:rgba(255,255,255,.4);cursor:pointer;padding:0;transition:width .3s}
.hctl .dots button[aria-current="true"]{width:26px;background:#f3a46f}
.hctl .lbl{font-family:var(--mono);font-size:11px;color:#c4ddd2;letter-spacing:.08em}
.hidehl{position:absolute;top:14px;right:14px;z-index:3;background:rgba(0,0,0,.3);color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:5px 12px;font-size:13px;cursor:pointer}
.minis{display:flex;flex-direction:column;gap:10px;width:100%;max-width:360px}
.mini{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:14px;padding:10px;display:flex;gap:12px;align-items:center;color:#f1f6f3}
.mini .th{width:92px;aspect-ratio:16/9;border-radius:8px;flex:none}
.mini b{font-size:14px;display:block;line-height:1.3}.mini small{font-size:12px;color:#c4ddd2}
.mini .pb{height:4px;background:rgba(255,255,255,.2);border-radius:2px;margin-top:6px}.mini .pb i{display:block;height:100%;background:#f3a46f}
.fan{position:relative;width:100%;max-width:340px;height:330px}
.fan .ph{position:absolute;top:30px;width:148px;aspect-ratio:9/16;border-radius:20px;border:3px solid rgba(255,255,255,.85);padding:12px;display:flex;flex-direction:column;justify-content:flex-end;gap:2px;color:#fff;font-size:13px;font-weight:650;line-height:1.25;box-shadow:0 16px 40px rgba(0,0,0,.4)}
.fan .ph span{font-family:var(--mono);font-size:10.5px;font-weight:400;opacity:.8}
.fan .a{left:0;transform:rotate(-8deg)}.fan .b{left:calc(50% - 74px);top:0;z-index:2}.fan .c{right:0;transform:rotate(8deg)}
.mdash{background:#f4f5f2;color:#17201c;border-radius:16px;padding:16px;width:100%;max-width:340px;display:flex;flex-direction:column;gap:9px;box-shadow:0 18px 44px rgba(0,0,0,.35)}
.mdash .r{display:grid;grid-template-columns:78px minmax(0,1fr) 34px;gap:8px;align-items:center;font-size:12.5px}
.mdash .b{height:7px;border-radius:4px;background:#e2e5df;overflow:hidden}.mdash .b i{display:block;height:100%}
.mdash .alertp{background:#fce6d9;color:#c2541a;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:650;align-self:flex-start}
@media (max-width:900px){
  .sl{grid-template-columns:minmax(0,1fr)}
  .sl .in{padding-bottom:16px}
  .sl .vis{padding-top:0;padding-bottom:80px}
  .s1{background-position:right bottom;background-size:auto 62%;padding-bottom:300px}
  .s1 .in{padding-bottom:0}
  .s1::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(31,74,63,.96) 55%,rgba(31,74,63,0) 80%)}
  .s1 .vis{display:none}
}
.compact{border-radius:18px;background:var(--hero);color:#f1f6f3;padding:18px clamp(18px,3vw,28px);display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.compact h2{font-size:1.35rem;color:#f1f6f3}
.compact p{color:#c4ddd2;font-size:14.5px;margin-top:2px}
.compact .nexts{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.compact .nexts a{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:5px 12px;font-size:13.5px;text-decoration:none;color:#f1f6f3}
.compact .nexts a.al{border-color:#f3a46f}
.compact .acts{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.compact .btn.light{background:#f1f6f3;color:#173a31;border-color:#f1f6f3}
.compact .linkbtn{color:#c4ddd2;background:none;border:0;text-decoration:underline;cursor:pointer;font-size:13px}
@media (max-width:620px){.compact .acts{align-items:flex-start;flex-direction:row;flex-wrap:wrap}}
.mock button{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:1px 10px;font-size:12px;cursor:pointer;margin-left:4px}
.mock button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}

/* Command Center page */
.th-intro{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:28px;align-items:center}
.th-intro .pic{border-radius:22px;min-height:340px;background:#1f4a3f var(--heroimg) right center/cover no-repeat}
.flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--surface)}
.flow div{padding:16px;display:flex;flex-direction:column;gap:4px;position:relative;border-left:1px solid var(--line)}
.flow div:first-child{border-left:0}
.flow div:not(:last-child)::after{content:"→";position:absolute;right:-11px;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:50%;background:var(--alert);color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center;z-index:1}
.flow .k{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--muted);text-transform:uppercase}
.flow b{font-family:var(--display);font-stretch:112%;font-size:1.1rem}
.flow span.d{font-size:13.5px;color:var(--muted)}
@media (max-width:760px){.flow{grid-template-columns:minmax(0,1fr)}.flow div{border-left:0;border-top:1px solid var(--line)}.flow div:first-child{border-top:0}.flow div:not(:last-child)::after{content:"↓";right:auto;left:16px;top:auto;bottom:-11px;transform:none}}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:14px;counter-reset:st}
.steps li{counter-increment:st;display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px}
.steps li::before{content:counter(st,decimal-leading-zero);font-family:var(--display);font-stretch:125%;font-weight:800;font-size:1.6rem;color:var(--spruce);line-height:1}
.steps h3{margin-bottom:4px}
.steps p{font-size:14.5px;color:var(--muted)}
.feat{display:flex;flex-direction:column;gap:6px}
.feat .ic{width:34px;height:34px;border-radius:10px;background:var(--spruce-soft);color:var(--spruce);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:13px;font-weight:600}
.cmp td,.cmp th{white-space:normal;min-width:110px;vertical-align:top}
.cmp th:first-child,.cmp td:first-child{min-width:150px;font-weight:600}
.cmp .y{color:var(--good);font-weight:700}.cmp .n{color:var(--muted)}
.prices{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px;align-items:stretch}
.price{background:var(--surface);border:1.5px solid var(--line);border-radius:18px;padding:22px;display:flex;flex-direction:column;gap:12px}
.price.feat2{border-color:var(--spruce);box-shadow:0 0 0 1px var(--spruce)}
.price .amt{font-family:var(--display);font-stretch:125%;font-weight:800;font-size:2.4rem;line-height:1}
.price .amt small{font-size:.9rem;font-weight:600;font-stretch:100%;color:var(--muted)}
.price ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:7px;font-size:14.5px;flex:1}
.price li::before{content:"✓ ";color:var(--good);font-weight:700}
.faq details{border-top:1px solid var(--line);padding:14px 0}
.faq details:first-child{border-top:0}
.faq summary{cursor:pointer;font-weight:650;font-size:1.02rem}
.faq details p{color:var(--muted);margin-top:8px;max-width:70ch}

/* Hub page: setup, catalog, products */
.setup3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:14px}
.setup3 div{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:8px}
.setup3 .ico{width:52px;height:52px;border-radius:50%;background:var(--hero);color:#f1f6f3;display:flex;align-items:center;justify-content:center;font-size:22px}
.setup3 .k{font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--alert)}
.cat{display:flex;flex-direction:column;gap:12px}
.cat h3{display:flex;align-items:center;gap:10px;font-size:1.25rem}
.cat h3 .tag{font-family:var(--body)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:10px}
.cards div{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:4px}
.cards b{font-size:15px}
.cards span{font-size:13px;color:var(--muted)}
.cards .new{align-self:flex-start;font-size:10.5px;font-family:var(--mono);background:var(--alert-soft);color:var(--alert);padding:1px 7px;border-radius:999px;letter-spacing:.06em}
.prods{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:16px;align-items:stretch}
.prod{background:var(--surface);border:1.5px solid var(--line);border-radius:18px;overflow:hidden;display:flex;flex-direction:column}
.prod.star{border-color:var(--spruce);box-shadow:0 0 0 1px var(--spruce)}
.prod .img{aspect-ratio:4/3;max-width:100%;background:repeating-linear-gradient(135deg,var(--sunk) 0 12px,var(--bg) 12px 24px);display:flex;align-items:center;justify-content:center;text-align:center;padding:16px;font-family:var(--mono);font-size:11.5px;color:var(--muted);border-bottom:1px solid var(--line)}
.prod .b{padding:18px;display:flex;flex-direction:column;gap:10px;flex:1}
.prod .amt{font-family:var(--display);font-stretch:125%;font-weight:800;font-size:2rem;line-height:1}
.prod .amt small{font-size:.85rem;font-weight:600;font-stretch:100%;color:var(--muted)}
.prod ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px;font-size:14px;flex:1}
.prod li::before{content:"✓ ";color:var(--good);font-weight:700}
.prod .btns{display:flex;gap:8px;flex-wrap:wrap}
.specs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:16px}
.specs dl{margin:0;display:grid;grid-template-columns:minmax(0,130px) minmax(0,1fr);gap:8px 14px;font-size:14.5px}
.specs dt{color:var(--muted);font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.06em;padding-top:2px}
.specs dd{margin:0}
.promise{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:14px}
.promise div{display:flex;flex-direction:column;gap:6px}
.promise .ic{width:40px;height:40px;border-radius:12px;background:var(--spruce-soft);color:var(--spruce);display:flex;align-items:center;justify-content:center;font-size:18px}
.reserved{border:2px dashed var(--line);border-radius:18px;padding:22px;display:flex;flex-direction:column;gap:6px;color:var(--muted)}

/* garden planner */
.gp{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:980px){.gp{grid-template-columns:minmax(0,1fr)}}
.palette{display:flex;gap:6px;flex-wrap:wrap}
.palette button{display:flex;align-items:center;gap:6px;border:1.5px solid var(--line);background:var(--surface);border-radius:999px;padding:5px 11px 5px 7px;font-size:13px;cursor:pointer}
.palette button i{width:14px;height:14px;border-radius:50%;flex:none}
.palette button small{color:var(--muted);font-family:var(--mono);font-size:10.5px}
.palette button[aria-pressed="true"]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.bedwrap{overflow-x:auto;padding:12px;background:#6b4f36;border-radius:12px}
.bed{display:grid;gap:3px;touch-action:none;user-select:none;min-width:min-content}
.bed button{width:44px;height:44px;border:0;border-radius:4px;background:#8a6a4a;color:#fff;font-size:10px;line-height:1.1;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2px;font-family:var(--mono)}
.bed button b{font-size:10.5px;font-family:var(--body);font-weight:700}
.bed button:hover{outline:2px solid #f3e7c9}
.ruler{display:flex;justify-content:space-between;font-family:var(--mono);font-size:11px;color:var(--muted);margin-top:6px}
.sched td{white-space:nowrap}

.freebar{background:var(--spruce-soft);color:var(--spruce);font-size:13.5px;text-align:center;padding-block:7px}
.freebar a{color:inherit;font-weight:650}
.freenote{font-size:13px;color:#c4ddd2}

/* watch: phone layout + full screen */
body.watching .obpill{display:none!important}
.feed.full{position:fixed;inset:0;z-index:40;height:100dvh!important;height:100vh;border-radius:0}
@supports (height:100dvh){.feed.full{height:100dvh!important}}
.feed.full .slide{padding:0}
.feed.full .vid{border-radius:0;max-height:100%}
body.fs{overflow:hidden}
body.fs .chbtn{display:none}
#fsExit{position:fixed;z-index:41;top:calc(12px + env(safe-area-inset-top,0px));right:calc(12px + env(safe-area-inset-right,0px));background:rgba(0,0,0,.55);color:#fff;border-color:rgba(255,255,255,.5)}
@media (max-width:820px){
  body.watching .freebar,body.watching .mock,body.watching .feednote{display:none}
  body.watching header.site .btn.dark{display:none}
  body.watching header.site .row{padding-block:6px;gap:4px}
  body.watching .logo{font-size:.9rem}
  body.watching .logo .lw small{display:none}
  body.watching .logo svg{width:22px;height:22px}
  body.watching #p-watch.page{padding-block:8px 76px;gap:10px}
  body.watching .feed{height:calc(100vh - 150px);border-radius:14px}
  @supports (height:100dvh){body.watching .feed{height:calc(100dvh - 150px)}}
  body.watching .feed .slide{padding:6px}
  body.watching #fsBtn{padding:6px 12px;font-size:13px}
}

/* product + learn links */
.adbox{border:1px solid var(--line);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px;margin:0}
.adbox legend{font-weight:650;font-size:14px;padding:0 6px}
.slide.haslinks .col{height:100%;aspect-ratio:9/16;max-width:100%;display:flex;flex-direction:column;gap:8px}
.slide.haslinks .col .vid{flex:1;min-height:0;height:auto;width:100%;aspect-ratio:auto}
.vbar{display:flex;gap:6px;flex-wrap:nowrap;overflow-x:auto;flex:none;scrollbar-width:none}
.vbar a,.vbar button{flex:none;display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:650;text-decoration:none;border:0;cursor:pointer;font-family:var(--body);white-space:nowrap}
.vbar .shop{background:#f3a46f;color:#2a1608}
.vbar .learn{background:#2a3a33;color:#e8ede9}
.vbar small{font-weight:500;opacity:.75;font-size:10.5px}
.vad{position:absolute;left:12px;right:62px;bottom:96px;z-index:5;background:#fff;color:#17201c;border-radius:14px;padding:12px 14px 12px;box-shadow:0 12px 30px rgba(0,0,0,.45);display:flex;flex-direction:column;gap:4px;animation:adin .35s ease}
@keyframes adin{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.vad{animation:none}}
.vad .lbl{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#7a857f}
.vad b{font-family:var(--display);font-stretch:112%;font-size:1.05rem}
.vad p{font-size:13px;color:#4b5650}
.vad a{align-self:flex-start;margin-top:4px;background:#e2601a;color:#fff;border-radius:999px;padding:7px 14px;font-weight:700;font-size:13px;text-decoration:none}
.vad .x{position:absolute;top:6px;right:6px;width:30px;height:30px;border-radius:50%;border:0;background:#eef0ec;color:#17201c;font-size:16px;cursor:pointer}
.vad .disc{font-size:10.5px;color:#7a857f}

.relp{display:flex;flex-direction:column;gap:6px;padding-bottom:12px;margin-bottom:4px;border-bottom:1px solid var(--line)}
.relp li button{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.relp li button:hover b{text-decoration:underline}
.relp li button:focus-visible{outline:2px solid var(--alert);outline-offset:2px;border-radius:6px}
.relp .m{font-family:var(--mono);font-size:11px;color:var(--spruce)}
@media (max-width:860px){.relp{display:none}}

.sidesec{border-top:1px solid var(--line);padding-top:10px}
.sidesec summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:8px}
.sidesec summary::-webkit-details-marker{display:none}
.sidesec summary::after{content:"▾";margin-left:auto;color:var(--muted);transition:transform .2s}
.sidesec[open] summary::after{transform:rotate(180deg)}
.sidesec[open] summary{margin-bottom:8px}

/* morse */
.morseout{font-family:var(--mono);font-size:1.25rem;letter-spacing:.06em;line-height:1.6;background:var(--sunk);border-radius:10px;padding:12px;min-height:3.4em;word-break:break-word}
.morseout .on{background:var(--alert);color:#fff;border-radius:4px}
.mkey{width:100%;height:120px;border-radius:18px;border:2px solid var(--line);background:var(--sunk);font-family:var(--display);font-stretch:125%;font-weight:800;font-size:1.6rem;letter-spacing:.2em;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none;color:var(--ink)}
.mkey.down{background:var(--alert);border-color:var(--alert);color:#fff}
.mref{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:6px}
.mref button{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:6px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px}
.mref b{font-family:var(--display);font-size:1.1rem}
.mref span{font-family:var(--mono);font-size:12px;color:var(--muted)}
.mflash{position:fixed;inset:0;z-index:60;background:#000;display:flex;align-items:flex-end;justify-content:center;padding-bottom:calc(24px + env(safe-area-inset-bottom,0px));cursor:pointer}
.mflash.lit{background:#fff}
.mflash span{font-family:var(--mono);font-size:12px;color:#777;background:rgba(0,0,0,.4);padding:4px 10px;border-radius:999px}

/* maps */
.mpgrid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:980px){.mpgrid{grid-template-columns:minmax(0,1fr)}}
.mapbox{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--line);aspect-ratio:4/3;max-width:100%;background:var(--sunk);touch-action:none}
.mapbox canvas{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair}
.mphint{position:absolute;top:8px;left:8px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:3px 10px;font-size:12px}
.osm{position:absolute;right:6px;bottom:4px;font-size:10px;color:var(--muted);background:var(--surface);padding:0 5px;border-radius:4px;opacity:.9}
.mpstates{max-height:300px;overflow:auto}
.mpstates li{align-items:center}
.mpitem .bar{margin-top:6px}

/* hub upsell */
.hub main>.hubtop .btn[href="#home"]{order:-1}
.upsell{position:relative;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);border-radius:18px;overflow:hidden;background:var(--hero);color:#f1f6f3}
.upsell .in{padding:clamp(18px,3vw,28px);display:flex;flex-direction:column;gap:10px}
.upsell .eyebrow{color:#f3a46f}
.upsell h2{color:#f1f6f3;font-size:clamp(1.3rem,2.6vw,1.75rem)}
.upsell p{color:#c4ddd2;max-width:60ch}
.upsell .ups{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:14.5px;color:#d7e9e0}
.upsell .ups li::before{content:"✓ ";color:#f3a46f;font-weight:700}
.upsell .ups b{color:#f1f6f3}
.upsell .ctas{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.upsell .btn.light{background:#f1f6f3;color:#173a31;border-color:#f1f6f3}
.upsell .btn.ghost{background:transparent;color:#f1f6f3;border-color:rgba(241,246,243,.6)}
.upsell .pic{background:#1f4a3f var(--heroimg) 60% center/cover no-repeat;min-height:200px}
.upsell .x{position:absolute;top:10px;right:10px;z-index:2;width:32px;height:32px;border-radius:50%;border:0;background:rgba(0,0,0,.35);color:#fff;cursor:pointer;font-size:15px}
@media (max-width:760px){.upsell{grid-template-columns:minmax(0,1fr)}.upsell .pic{display:none}}

/* academy + lessons */
.featc{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:16px;align-items:center;text-decoration:none;border:1.5px solid var(--line);border-radius:16px;overflow:hidden;background:var(--surface);margin-bottom:18px}
.featc:hover{border-color:var(--sky)}
.featc img{width:100%;height:100%;object-fit:cover;aspect-ratio:6/5;display:block}
.featc .in{display:flex;flex-direction:column;gap:6px;padding:14px 16px 14px 0}
.featc b{font-family:var(--display);font-stretch:112%;font-size:1.3rem}
.featc .go{font-weight:650;color:var(--sky)}
@media (max-width:560px){.featc{grid-template-columns:minmax(0,1fr)}.featc .in{padding:0 16px 16px}.featc img{aspect-ratio:16/9}}
.acad-hero{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:24px;align-items:center}
.acad-hero img{width:100%;border-radius:16px;display:block}
.acad-hero .in{display:flex;flex-direction:column;gap:12px}
@media (max-width:700px){.acad-hero{grid-template-columns:minmax(0,1fr)}}
.acad-prog{display:flex;align-items:center;gap:10px;max-width:420px}.acad-prog .bar{flex:1}
.lvl{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px}
.lvl .hd{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.lvl .hd h3{font-size:1.2rem}
.lvl ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:8px}
.lvl li a,.lvl li span.l{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:10px;border:1px solid var(--line);text-decoration:none;min-height:100%}
.lvl li a{border-color:var(--sky);background:color-mix(in srgb,var(--sky) 8%,var(--surface))}
.lvl li span.l{color:var(--muted)}
.lvl .n{font-family:var(--mono);font-size:12px;padding-top:2px;flex:none}
.lvl li small{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
.ednotes summary{cursor:pointer;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.lesson{max-width:860px}
.lhead{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap}
.lt{font-size:clamp(1.7rem,4vw,2.5rem)}
.lprog{display:flex;flex-direction:column;gap:8px}
.lprog .bar i{background:var(--sky)}
.lsteps{list-style:none;margin:0;padding:0;display:flex;gap:6px;flex-wrap:wrap}
.lsteps button{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:3px 10px;font-size:12.5px;cursor:pointer;color:var(--muted)}
.lsteps button[aria-current="step"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.lsteps button.done{color:var(--good);border-color:var(--good)}
.lstep{display:flex;flex-direction:column;gap:16px}
.lstep p{max-width:66ch}
.hook{background:var(--hero);color:#f1f6f3;border-radius:18px;padding:clamp(20px,4vw,32px);display:flex;flex-direction:column;gap:10px}
.hook .eyebrow{color:#f3a46f}
.hook .big{font-family:var(--display);font-stretch:112%;font-size:clamp(1.3rem,3vw,1.8rem);font-weight:700;line-height:1.2;color:#f1f6f3}
.obj{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.lsplit{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px;align-items:start}
@media (max-width:700px){.lsplit{grid-template-columns:minmax(0,1fr)}}
.lstep figure,.lnext figure{margin:0;display:flex;flex-direction:column;gap:6px}
.lstep figure img,.lnext img{width:100%;max-width:360px;border-radius:12px;display:block}
.lstep figcaption{font-size:13px;color:var(--muted)}
.imp{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:8px}
.callout{border-left:4px solid var(--sky);background:var(--sunk);border-radius:0 12px 12px 0;padding:12px 14px}
.advt td{white-space:normal;vertical-align:top;min-width:120px}
.scen{background:var(--sunk);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:6px}
.sortl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.sortl li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--surface)}
.sortl li.ok{border-color:var(--good)}.sortl li.no{border-color:var(--crit)}
.sortl .why{grid-column:1/-1;font-size:13px}
.sortl .ok .why{color:var(--good)}.sortl .no .why{color:var(--crit)}
.qq{border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:8px;background:var(--surface)}
.qq label{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border-radius:10px;border:1px solid var(--line);cursor:pointer}
.qq label:has(input:checked){border-color:var(--ink)}
.qq label.right{border-color:var(--good);background:color-mix(in srgb,var(--good) 10%,var(--surface))}
.qq label.wrong{border-color:var(--crit)}
.qq input{accent-color:var(--ink);margin-top:3px}
.qq .exp{font-size:13.5px;border-left:3px solid var(--line);padding-left:10px}
.lnext{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:16px;align-items:center;border:1px solid var(--line);border-radius:16px;padding:14px;background:var(--surface)}
.lnext div{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
@media (max-width:560px){.lnext{grid-template-columns:minmax(0,1fr)}}
.lnav{display:flex;gap:10px;align-items:center;border-top:1px solid var(--line);padding-top:14px}

.lesson .hook{color:#f1f6f3}

.thumb.tile{background-color:#ecebe4;background-size:cover;background-position:right bottom;color:#1d2a24;aspect-ratio:10/11;align-items:flex-start;justify-content:flex-start;padding:14px 14px 0;font-size:1.15rem;text-shadow:0 1px 0 rgba(255,255,255,.6)}
.thumb.tile{display:flex;flex-direction:column;gap:6px}
.thumb.tile small{position:static;align-self:flex-start;background:#1f4a3f;color:#f1f6f3;order:-1}
.thumb.tile{max-width:100%}

/* offline library */
.vid.yt .side{bottom:150px}
.olgrid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
@media (max-width:980px){.olgrid{grid-template-columns:minmax(0,1fr)}}
.olhub{position:sticky;top:16px}
.olcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:12px}
.olc{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:8px}
.olc.in{border-color:var(--spruce);box-shadow:inset 0 0 0 1px var(--spruce)}
.olc .src{font-size:12.5px;color:var(--muted)}
.olc select{border:1px solid var(--line);border-radius:8px;padding:6px;background:var(--surface);font-size:13px}
.olc .row{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto}
.olc .warn{font-size:12px;color:var(--warn)}
.reader{padding:0;overflow:hidden}
.rbar{display:flex;align-items:center;gap:10px;padding:8px 10px;background:var(--sunk);border-bottom:1px solid var(--line)}
.rbar .dots{display:flex;gap:4px}.rbar .dots i{width:9px;height:9px;border-radius:50%;background:var(--line)}
.rbar .addr{flex:1;min-width:0;background:var(--surface);border-radius:999px;padding:4px 12px;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rbody{padding:18px;display:flex;flex-direction:column;gap:10px;max-width:70ch}
.rbody h2{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-stretch:100%;font-size:1.7rem;border-bottom:1px solid var(--line);padding-bottom:6px}

/* center the Command Center */
.hubview{margin-inline:auto;width:100%}
.hub main>.hubtop{max-width:1100px;margin-inline:auto}

/* kit builder v2 */
.krow{display:grid;grid-template-columns:64px minmax(0,1fr) 80px 70px 84px auto;gap:10px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.krow.khead{border-top:0;padding:0;font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.kph{width:64px;height:64px;border-radius:10px;background:var(--sunk);overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:10.5px;color:var(--muted);text-align:center;position:relative}
.kph img{width:100%;height:100%;object-fit:cover}
.kup{cursor:pointer;border:1.5px dashed var(--line)}
.kup input{position:absolute;inset:0;opacity:0;cursor:pointer}
.kn{display:flex;flex-direction:column;gap:2px;min-width:0}
.kedit input:not([type=file]):not([type=checkbox]){border:1px solid var(--line);border-radius:8px;padding:6px 8px;background:var(--surface);width:100%}
.kp{display:flex;gap:6px;align-items:center}
.ka{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
@media (max-width:700px){.krow{grid-template-columns:56px minmax(0,1fr) auto}.krow.khead{display:none}.kph{width:56px;height:56px}.krow .kc,.krow .kw{grid-column:2}.krow .kp{grid-column:3;grid-row:1}.krow .ka{grid-column:2/-1}}
/* kit feed */
.kfeed{display:flex;flex-direction:column;gap:22px;max-width:520px;margin:0 auto;width:100%}
.kpost{position:relative}
.kwrap{position:relative;border-radius:20px;overflow:hidden;background:#0d1210;aspect-ratio:4/5;max-height:76vh;margin:0 auto}
.ktrack{display:flex;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.ktrack::-webkit-scrollbar{display:none}
.ks{flex:0 0 100%;height:100%;scroll-snap-align:start;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;padding:22px 64px 46px 20px;color:#fff;position:relative}
.ks.cover{color:#1d2a24;justify-content:flex-start}
.ks.cover.hasimg{justify-content:flex-end;color:#fff}
.ks.cover.hasimg::before{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(0,0,0,.75))}
.ks.cover>*{position:relative}
.ks.cover h2{font-family:var(--display);font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:1.7rem;color:inherit}
.ks.text b{font-family:var(--display);font-stretch:112%;font-size:1.7rem;line-height:1.1}
.ks.photo{padding:0;background:#fff}
.ks.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:12px 12px 90px}
.ks.photo .cap{position:relative;margin-top:auto;background:linear-gradient(transparent,rgba(0,0,0,.82) 30%);padding:28px 64px 40px 18px;display:flex;flex-direction:column;gap:2px}
.ks.photo .cap b{font-size:1.15rem}
.ks.list{background:var(--surface);color:var(--ink);justify-content:flex-start;overflow:auto}
.ks.list ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.ks.list li{display:flex;justify-content:space-between;gap:8px;padding:6px 0;border-top:1px solid var(--line);font-size:14px}
.karr{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;border:0;background:rgba(0,0,0,.45);color:#fff;font-size:20px;cursor:pointer;z-index:3}
.karr.l{left:8px}.karr.r{right:62px}
@media (hover:none){.karr{display:none}}
.kdots{position:absolute;bottom:14px;left:0;right:56px;display:flex;justify-content:center;gap:4px;z-index:3;flex-wrap:wrap;padding:0 20px}
.kdots i{width:6px;height:6px;border-radius:3px;background:rgba(255,255,255,.5)}
.kdots i.on{background:#f3a46f;width:14px}
.kside{position:absolute;right:8px;bottom:50px;z-index:4;display:flex;flex-direction:column;align-items:center;gap:6px}
.kside button{width:42px;height:42px;border-radius:50%;border:0;background:rgba(0,0,0,.5);color:#fff;cursor:pointer;font-size:16px}
.kside button[aria-pressed="true"]{background:var(--alert)}
.kside small{color:#fff;font-size:11px;text-shadow:0 1px 3px #000;margin-top:-4px}
.kcpanel{position:fixed;top:0;right:0;bottom:0;width:min(400px,100%);z-index:45;background:var(--surface);border-left:1px solid var(--line);padding:18px;padding-top:calc(18px + env(safe-area-inset-top,0px));display:flex;flex-direction:column;gap:12px;overflow:auto;transform:translateX(105%);transition:transform .3s ease;box-shadow:-10px 0 40px rgba(0,0,0,.25)}
.kcpanel.open{transform:none}
.kcback{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:44;display:none}
.kcback.open{display:block}
@media (max-width:700px){.kcpanel{top:auto;left:0;width:100%;max-height:75vh;border-left:0;border-radius:20px 20px 0 0;transform:translateY(105%);padding-bottom:calc(18px + env(safe-area-inset-bottom,0px))}}

.kslide .kpost{height:100%;display:flex;justify-content:center}
.kslide .kwrap{height:100%;max-height:none;aspect-ratio:4/5;max-width:100%}

.lvid{width:100%;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#000;max-width:100%}
.lvid iframe{width:100%;height:100%;border:0}

/* onboarding */
.ob-back{position:fixed;inset:0;z-index:25;background:rgba(8,14,11,.6);display:flex;align-items:center;justify-content:center;padding-block:max(16px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-bottom,0px));padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.ob{background:var(--surface);border-radius:22px;width:100%;max-width:580px;max-height:100%;overflow:auto;padding:26px;display:flex;flex-direction:column;gap:16px;position:relative;box-shadow:0 24px 60px rgba(0,0,0,.3)}
.ob .x{position:absolute;top:12px;right:12px;width:36px;height:36px;border-radius:50%;border:0;background:var(--sunk);cursor:pointer;font-size:18px}
.ob .prog{display:flex;gap:6px}.ob .prog i{flex:1;height:4px;border-radius:2px;background:var(--sunk)}.ob .prog i.on{background:var(--spruce-2)}
.ob .foot{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:4px}
.ob .foot .sp{flex:1}
.ob .linkbtn{background:none;border:0;color:var(--muted);font-weight:600;cursor:pointer;padding:8px 4px;text-decoration:underline}
.choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:8px}
.choice{border:2px solid var(--line);border-radius:12px;padding:12px;text-align:left;cursor:pointer;background:var(--surface);display:flex;flex-direction:column;gap:2px}
.choice b{font-family:var(--display);font-stretch:112%}
.choice span{font-size:12.5px;color:var(--muted)}
.choice[aria-pressed="true"]{border-color:var(--spruce);background:var(--spruce-soft)}
.obpill{position:fixed;z-index:15;left:calc(16px + env(safe-area-inset-left,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);border:0;border-radius:999px;padding:10px 16px;font-weight:650;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.25)}

/* Watch feed */
.watch{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:24px;align-items:start}
.feedtop{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px;font-size:14px}
.feedtop .tag{font-size:13px}
.chbtn,.sheet .close,.chback{display:none}
@media (max-width:860px){
  .watch{grid-template-columns:minmax(0,1fr)}
  .sheet{position:fixed;left:0;right:0;bottom:0;z-index:19;max-height:72vh;overflow:auto;border-radius:20px 20px 0 0;transform:translateY(105%);transition:transform .3s ease;padding-bottom:calc(18px + env(safe-area-inset-bottom,0px));padding-left:max(18px,env(safe-area-inset-left,0px));padding-right:max(18px,env(safe-area-inset-right,0px));box-shadow:0 -10px 40px rgba(0,0,0,.3)}
  .sheet.open{transform:none}
  .sheet .close{display:block;align-self:center;width:44px;height:5px;border-radius:3px;background:var(--line);border:0;margin-bottom:4px;cursor:pointer}
  .chbtn{display:inline-flex;position:fixed;z-index:17;left:50%;transform:translateX(-50%);bottom:calc(16px + env(safe-area-inset-bottom,0px));box-shadow:0 8px 24px rgba(0,0,0,.3)}
  .chback{position:fixed;inset:0;z-index:18;background:rgba(0,0,0,.4)}
  .chback.open{display:block}
}
button.vthumb{border:0;text-align:left;cursor:pointer;font:inherit}
.vthumb .len{position:absolute;top:10px;left:10px;font-family:var(--mono);font-size:10.5px;background:rgba(0,0,0,.45);padding:1px 7px;border-radius:999px}
.vid .len{position:absolute;top:14px;left:16px;font-family:var(--mono);font-size:11px;background:rgba(0,0,0,.45);padding:2px 9px;border-radius:999px}
.vid .tags{font-family:var(--mono);font-size:12px;opacity:.8;margin-top:4px}
.vid .media{position:absolute;inset:0;background:#000}
.vid .media video,.vid .media iframe{width:100%;height:100%;object-fit:cover;border:0;display:block}
.vid.real{background:#000!important}
.vid.real .cap{position:relative;z-index:2;text-shadow:0 1px 3px rgba(0,0,0,.8);pointer-events:none}
.vid.real .side,.vid.real .len{z-index:3}
.vid.real .play{z-index:2;opacity:0;transition:opacity .2s}
.vid.real.paused .play{opacity:1}
.vid.yt .play{display:none}
.vid.real .prog{z-index:3}
.vid.real .cap,.vid.real .side,.vid.real .len,.vid.real .ytnote{transition:opacity .45s ease}
.vid.real.idle .cap,.vid.real.idle .side,.vid.real.idle .len,.vid.real.idle .ytnote{opacity:0;pointer-events:none}
.vid.real .cap{background:linear-gradient(transparent,rgba(0,0,0,.55));margin:0 -70px -18px -16px;padding:28px 70px 18px 16px}
.vid .ytnote{position:absolute;left:12px;right:12px;top:48px;z-index:1;font-size:12px;background:rgba(0,0,0,.6);padding:8px 10px;border-radius:8px;color:#fff}
.vid.divider{justify-content:center;align-items:flex-start;padding:24px;gap:10px}
.vid.divider .big{position:static}
.vempty{border:2px dashed var(--line);border-radius:14px;padding:18px;color:var(--muted);font-size:14px}
.relhead{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.relhead h3{font-size:1.1rem}
.drop{position:relative;border:2px dashed var(--line);border-radius:14px;padding:22px;text-align:center;color:var(--muted);font-size:14px;cursor:pointer}
.drop input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.drop.has{border-color:var(--spruce);color:var(--spruce);background:var(--spruce-soft)}
.tagbox{display:flex;flex-wrap:wrap;gap:6px;align-items:center;border:1px solid var(--line);border-radius:8px;padding:6px;background:var(--surface)}
.tagbox input{border:0!important;flex:1;min-width:120px;padding:4px!important;outline:none}
.tagx{display:inline-flex;gap:4px;align-items:center;background:var(--spruce-soft);color:var(--spruce);border-radius:999px;padding:2px 4px 2px 10px;font-size:13px;font-weight:600}
.tagx button{border:0;background:none;color:inherit;cursor:pointer;font-size:14px;padding:0 4px}
#vPrev{width:100%;border-radius:10px;background:#000;max-height:260px}
#ytPrev{aspect-ratio:16/9;max-width:100%;border-radius:10px;overflow:hidden;background:#000}
#ytPrev iframe{width:100%;height:100%;border:0}
input[type=range]{accent-color:var(--spruce);width:100%}
.adm td{white-space:normal;vertical-align:top}
.adm td .chips{gap:4px}
.feed{height:min(78vh,760px);overflow-y:auto;scroll-snap-type:y mandatory;border-radius:20px;background:#0d1210;scrollbar-width:none}
.feed::-webkit-scrollbar{display:none}
.slide{height:100%;scroll-snap-align:start;scroll-snap-stop:always;display:flex;justify-content:center;align-items:center;padding:14px;position:relative}
.vid{height:100%;aspect-ratio:9/16;max-width:100%;border-radius:16px;position:relative;overflow:hidden;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:16px 70px 18px 16px}
.vid .big{position:absolute;top:22%;left:16px;right:16px;font-family:var(--display);font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:clamp(1.4rem,4vw,2rem);line-height:1;opacity:.95}
.vid .play{position:absolute;inset:0;margin:auto;width:68px;height:68px;border-radius:50%;border:0;background:rgba(0,0,0,.45);color:#fff;font-size:24px;cursor:pointer}
.vid .prog{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.25)}
.vid .prog i{display:block;height:100%;width:0;background:var(--alert)}
.vid .cap b{display:block;font-size:15px}
.vid .cap p{font-size:14px;opacity:.9;margin-top:2px}
.vid .side{position:absolute;right:10px;bottom:70px;display:flex;flex-direction:column;gap:14px;align-items:center}
.vid .side button{background:rgba(0,0,0,.4);border:0;color:#fff;width:46px;height:46px;border-radius:50%;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center}
.vid .side button[aria-pressed="true"]{background:var(--alert)}
.vid .side small{font-size:11px;font-family:var(--mono);margin-top:-10px}
.feednote{font-size:12.5px;color:var(--muted);margin-top:8px}

/* Digital prep */
.dp-hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:24px;align-items:center}
.stack{border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow:hidden}
.stack div{display:flex;justify-content:space-between;gap:10px;padding:12px 16px;border-top:1px solid var(--line);font-size:14.5px}
.stack div:first-child{border-top:0;background:var(--spruce-soft);color:var(--spruce);font-weight:700}

/* ===== HUB APP ===== */
.hub{display:grid;grid-template-columns:230px minmax(0,1fr);min-height:100vh}
.hub .rail{background:var(--rail);color:var(--rail-ink);padding:16px 12px;display:flex;flex-direction:column;gap:2px;position:sticky;top:0;height:100vh;overflow-y:auto}
.hub .rail .logo{color:var(--rail-ink);padding:4px 8px 14px;font-size:1rem}
.hub .rail a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;color:var(--rail-ink);text-decoration:none;font-weight:550;font-size:14.5px}
.hub .rail a:hover{background:var(--rail-hi)}
.hub .rail a[aria-current="page"]{background:var(--rail-hi);box-shadow:inset 3px 0 0 var(--alert)}
.hub .rail .lbl{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--rail-muted);padding:14px 10px 4px}
.hub .rail .count{margin-left:auto;font-family:var(--mono);font-size:11px;background:var(--alert);color:#fff;border-radius:10px;padding:0 6px}
.hub .rail .back{margin-top:auto;color:var(--rail-muted)}
.hub main{padding-block:22px 72px;min-width:0}
.hubtop{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:20px}
.hubtop .sp{flex:1}
.hubview{max-width:1100px;display:flex;flex-direction:column;gap:18px}
.banner{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border:1.5px solid var(--spruce);background:var(--spruce-soft);border-radius:12px;padding:12px 14px}
.banner p{flex:1;min-width:200px}
.level{display:flex;gap:4px}.level span{flex:1;height:10px;border-radius:2px;background:var(--sunk)}.level span.on{background:var(--spruce-2)}
.levels-lbl{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);font-family:var(--mono)}
.pills{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr));gap:10px}
.pill{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);cursor:pointer;text-align:left}
.pill:hover{border-color:var(--spruce)}
.pill .r{display:flex;justify-content:space-between;align-items:baseline}
.pill b{font-family:var(--display);font-stretch:112%;font-weight:700}
.risk{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(2,minmax(0,1fr)) 70px;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.risk:first-of-type{border-top:0}
.risk input[type=range]{width:100%;accent-color:var(--spruce)}
.risk .sc{font-family:var(--mono);text-align:right;font-weight:600}
@media (max-width:620px){.risk{grid-template-columns:1fr 1fr}.risk .nm{grid-column:1/-1}.risk .sc{text-align:left}}
.kitbar{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.mapwrap{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--sunk)}
.mapwrap svg{display:block;width:100%;height:auto}
input.pin{width:110px;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:7px 8px;font-family:var(--mono);letter-spacing:.3em}
.dot{width:10px;height:10px;border-radius:50%;background:var(--good);flex:none;margin-top:7px}.dot.w{background:var(--warn)}
@media (max-width:820px){
  .hub{grid-template-columns:minmax(0,1fr)}
  .hub .rail{position:sticky;top:env(safe-area-inset-top,0px);z-index:6;height:auto;flex-direction:row;overflow-x:auto;padding:8px 12px;gap:4px;padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px))}
  .hub .rail .lbl{display:none}
  .hub .rail a{white-space:nowrap;padding:6px 10px}
  .hub .rail .logo{padding:4px 8px}
  .hub .rail .back{margin-top:0}
}

/* Emergency */
.emode{position:fixed;inset:0;z-index:20;background:var(--bg);overflow:auto;padding-top:env(safe-area-inset-top,0px)}
.emode .top{background:var(--alert);color:#fff;display:flex;align-items:center;gap:12px;padding-block:12px}
.emode .top h2{flex:1;color:#fff;text-transform:uppercase;font-stretch:125%}
.emode .top .btn{background:transparent;color:#fff;border-color:#fff}
.emode .body{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:16px;padding-block:20px 60px}
.scen{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.scen button{border:2px solid var(--line);background:var(--surface);border-radius:12px;padding:16px;font-family:var(--display);font-stretch:112%;font-size:1.1rem;font-weight:750;cursor:pointer;text-align:left}
.scen button[aria-pressed="true"]{border-color:var(--alert);background:var(--alert-soft)}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:999px;font-size:14px;z-index:30}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

body{margin:0;font-size:14px}img{max-width:100%}
[hidden]{display:none!important}
