/* Rob HUD. One stylesheet for every app; <html data-app="business|life|team|launcher"> picks the palette.
   Swap the --c* tokens below for exact brand colours when Filip sends them. */
:root{
  --ink:#03070f; --panel:#07101d; --panel-2:#0a1628;
  --c1:#3cefb4; --c2:#8d7dff; --c3:#39d0ff;   /* aurora green, violet, ice */
  --c1-rgb:60,239,180; --c2-rgb:141,125,255;
  --fg:#e6eef8; --muted:#8a9ab4; --warn:#ffb547; --bad:#ff5d73; --good:#3cefb4; --on:#02140d;
  --line:rgba(var(--c1-rgb),.18); --line-strong:rgba(var(--c1-rgb),.45);
  --f-display:"Orbitron","Chakra Petch","Segoe UI",system-ui,sans-serif;
  --f-ui:"Chakra Petch","Segoe UI",system-ui,sans-serif;
  --f-body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --cut:14px;
  color-scheme:dark;
}
html[data-app="life"]{
  --ink:#0c0408; --panel:#16070f; --panel-2:#1f0a16;
  --c1:#ff8a3d; --c2:#ff3d8b; --c3:#ffc15e;   /* orange, hot pink, gold */
  --c1-rgb:255,138,61; --c2-rgb:255,61,139;
  --fg:#fbeef3; --muted:#c09aab; --warn:#ffc15e; --bad:#ff4d6d; --good:#7cf5c4; --on:#1c0500;
}
html[data-app="team"]{   /* Rob Team: the business HUD in ice blue and magenta, so it never looks like Filip's own app */
  --c1:#3cb8f4; --c2:#e07dff; --c3:#7cf5ff;
  --c1-rgb:60,184,244; --c2-rgb:224,125,255;
  --good:#3cefb4; --on:#021018;
}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0}
body{background:var(--ink);color:var(--fg);font:15px/1.5 var(--f-body);overflow-x:hidden;
  background-image:radial-gradient(900px 520px at 85% -10%,rgba(var(--c2-rgb),.20),transparent 60%),radial-gradient(800px 480px at -10% 10%,rgba(var(--c1-rgb),.14),transparent 60%),radial-gradient(700px 500px at 50% 120%,rgba(var(--c2-rgb),.12),transparent 60%);
  background-attachment:fixed}
/* Hex grid (business) or comic halftone (life), then scanlines and a slow sweep. */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:var(--c1);opacity:.07;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cpath d='M28 0l28 16v32L28 64 0 48V16zM28 64v33M0 16L-28 0M56 16l28-16' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") 0 0/56px 97px;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cpath d='M28 0l28 16v32L28 64 0 48V16zM28 64v33M0 16L-28 0M56 16l28-16' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") 0 0/56px 97px}
html[data-app="life"] body::before{opacity:.10;background:linear-gradient(160deg,var(--c1),var(--c2));
  -webkit-mask:radial-gradient(circle,#000 1.3px,transparent 1.8px) 0 0/11px 11px;mask:radial-gradient(circle,#000 1.3px,transparent 1.8px) 0 0/11px 11px}
body::after{content:"";position:fixed;inset:0;z-index:50;pointer-events:none;
  background:repeating-linear-gradient(180deg,transparent 0 2px,rgba(0,0,0,.18) 2px 3px),linear-gradient(180deg,transparent 0,rgba(var(--c1-rgb),.06) 50%,transparent 100%) 0 -30vh/100% 30vh no-repeat;
  animation:sweep 7s linear infinite}
@keyframes sweep{to{background-position:0 0,0 130vh}}

.wrap{max-width:1180px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3{font-family:var(--f-display);letter-spacing:.06em;margin:0;text-wrap:balance}
.lbl{font:600 10.5px/1.2 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
.glow{color:var(--c1);text-shadow:0 0 12px rgba(var(--c1-rgb),.6)}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--c1);outline-offset:2px}
[hidden]{display:none!important}

/* ---------- Boot sequence ---------- */
#boot{position:fixed;inset:0;z-index:60;background:var(--ink);display:grid;place-items:center;padding:24px;transition:opacity .45s ease}
#boot.out{opacity:0;pointer-events:none}
.boot-box{width:min(420px,100%);display:grid;gap:18px;justify-items:center}
.boot-ring{width:132px;height:132px;border-radius:50%;position:relative;border:2px solid rgba(var(--c1-rgb),.25);box-shadow:0 0 40px rgba(var(--c1-rgb),.35),inset 0 0 30px rgba(var(--c2-rgb),.3)}
.boot-ring::before,.boot-ring::after{content:"";position:absolute;border-radius:50%;border:3px solid transparent}
.boot-ring::before{inset:10px;border-top-color:var(--c1);border-bottom-color:var(--c1);animation:spin 1.1s linear infinite}
.boot-ring::after{inset:26px;border-left-color:var(--c2);border-right-color:var(--c2);animation:spin .8s linear infinite reverse}
.boot-ring b{position:absolute;inset:0;display:grid;place-items:center;font:800 22px var(--f-display);letter-spacing:.2em;color:var(--fg);text-shadow:0 0 14px var(--c1)}
@keyframes spin{to{transform:rotate(360deg)}}
.boot-lines{width:100%;font:500 12px/1.9 var(--f-mono);color:var(--c1);min-height:12em;letter-spacing:.06em}
.boot-lines div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.boot-lines div::before{content:"> ";color:var(--c2)}
.boot-lines .ok::after{content:" [OK]";color:var(--fg)}
.boot-bar{width:100%;height:4px;background:rgba(var(--c1-rgb),.12);position:relative;overflow:hidden}
.boot-bar i{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,var(--c1),var(--c2));box-shadow:0 0 12px var(--c1);transition:width .25s ease}

/* ---------- Gate ---------- */
.gate{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:24px 16px}
.gate-box{width:min(400px,100%);display:grid;gap:12px;justify-items:center;text-align:center;padding:28px 22px}
.gate-box h1{font-size:22px;letter-spacing:.22em}
.gate-box form,.gate-box .f{width:100%;display:grid;gap:10px;text-align:left}
.gate-box .boot-ring{width:116px;height:116px}
.gate-box .boot-ring b{font-size:18px}

/* ---------- Top bar ---------- */
.top{position:sticky;top:0;z-index:20;padding-top:env(safe-area-inset-top,0px);background:linear-gradient(180deg,rgba(3,7,15,.95),rgba(3,7,15,.75));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
html[data-app="life"] .top{background:linear-gradient(180deg,rgba(12,4,8,.95),rgba(12,4,8,.75))}
.top::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--c1),var(--c2),transparent);opacity:.8}
.top .wrap{display:flex;align-items:center;gap:12px;padding-block:10px}
.mark{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--fg);min-width:0}
.emblem{width:38px;height:38px;flex:0 0 auto;border-radius:50%;position:relative;border:1.5px solid var(--c1);box-shadow:0 0 16px rgba(var(--c1-rgb),.55),inset 0 0 10px rgba(var(--c2-rgb),.5)}
.emblem::before{content:"";position:absolute;inset:5px;border-radius:50%;border:2px dashed var(--c2);animation:spin 9s linear infinite}
.emblem::after{content:"";position:absolute;inset:13px;border-radius:50%;background:radial-gradient(circle,#fff,var(--c1) 45%,transparent 75%);box-shadow:0 0 12px var(--c1)}
.mark b{display:block;font:800 clamp(12.5px,3.6vw,16px)/1.1 var(--f-display);letter-spacing:.16em;white-space:nowrap}
.mark b em{font-style:normal;color:var(--c1);text-shadow:0 0 10px rgba(var(--c1-rgb),.7)}
.mark small{display:block;font:500 9.5px/1.4 var(--f-mono);letter-spacing:.14em;color:var(--muted);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clock{margin-left:auto;text-align:right;flex:0 0 auto}
.clock .lbl{white-space:nowrap}
.mark>span:last-child{min-width:0}
.clock .t{font:600 18px/1 var(--f-mono);color:var(--fg);text-shadow:0 0 10px rgba(var(--c1-rgb),.5)}
.clock .lbl{margin-top:3px}
.iconbtn{width:38px;height:38px;flex:0 0 auto;display:grid;place-items:center;background:rgba(var(--c1-rgb),.06);border:1px solid var(--line);color:var(--c1);clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.iconbtn svg{width:18px;height:18px}
.ticker{display:flex;gap:16px;overflow:hidden;padding-block:0 8px;font:600 9.5px/1 var(--f-mono);letter-spacing:.16em;color:var(--muted);text-transform:uppercase;white-space:nowrap}
.ticker span{display:inline-flex;align-items:center;gap:6px}
.dot{width:7px;height:7px;border-radius:50%;background:var(--muted);box-shadow:none;display:inline-block}
.dot.on{background:var(--good);box-shadow:0 0 8px var(--good)}
.dot.off{background:var(--bad);box-shadow:0 0 8px var(--bad)}
html[data-app="life"] .dot.on{background:var(--c1);box-shadow:0 0 8px var(--c1)}

/* ---------- Bottom dock ---------- */
main{padding-block:18px calc(96px + env(safe-area-inset-bottom,0px))}
.dock{position:fixed;left:0;right:0;bottom:0;z-index:20;padding:8px max(10px,env(safe-area-inset-left,0px)) calc(8px + env(safe-area-inset-bottom,0px));background:linear-gradient(0deg,rgba(3,7,15,.97),rgba(3,7,15,.82));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line)}
html[data-app="life"] .dock{background:linear-gradient(0deg,rgba(12,4,8,.97),rgba(12,4,8,.82))}
.dock nav{max-width:600px;margin:0 auto;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:6px}
.dock a{display:grid;justify-items:center;gap:4px;padding:7px 4px 6px;text-decoration:none;color:var(--muted);font:600 9.5px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;border:1px solid transparent;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.dock a svg{width:22px;height:22px}
.dock a[aria-current="page"]{color:var(--c1);border-color:var(--line-strong);background:linear-gradient(180deg,rgba(var(--c1-rgb),.16),rgba(var(--c2-rgb),.08));text-shadow:0 0 10px rgba(var(--c1-rgb),.7)}
.dock a[aria-current="page"] svg{filter:drop-shadow(0 0 6px var(--c1))}

/* ---------- Views ---------- */
section.view{display:grid;gap:16px;animation:rise .35s ease both}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.vhead{display:flex;align-items:end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.vhead h1{font-size:clamp(22px,5vw,32px);letter-spacing:.14em;text-transform:uppercase;background:linear-gradient(90deg,var(--fg),var(--c1) 60%,var(--c2));-webkit-background-clip:text;background-clip:text;color:transparent}
.vhead p{margin:4px 0 0;color:var(--muted);font-size:14px}
.vhead .lbl{color:var(--c1)}

/* ---------- Panels ---------- */
.panel{position:relative;min-width:0;padding:16px;border:1px solid transparent;
  background:linear-gradient(180deg,var(--panel-2),var(--panel)) padding-box,linear-gradient(135deg,rgba(var(--c1-rgb),.75),rgba(var(--c1-rgb),.12) 35%,rgba(var(--c2-rgb),.12) 65%,rgba(var(--c2-rgb),.75)) border-box;
  clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut));
  box-shadow:inset 0 0 40px rgba(var(--c1-rgb),.04)}
.panel::before{content:"";position:absolute;top:6px;right:8px;width:34px;height:3px;background:repeating-linear-gradient(90deg,var(--c1) 0 6px,transparent 6px 9px);opacity:.7}
.phead{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;padding-bottom:10px;position:relative}
.phead::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,var(--c1),rgba(var(--c2-rgb),.35) 60%,transparent)}
.phead::before{content:"";position:absolute;left:0;bottom:-1px;width:28px;height:3px;background:var(--c1);box-shadow:0 0 10px var(--c1);animation:scan 4.5s ease-in-out infinite alternate}
@keyframes scan{to{left:calc(100% - 28px)}}
.phead h2{font:700 13.5px/1.2 var(--f-display);letter-spacing:.16em;text-transform:uppercase;display:flex;gap:8px;align-items:center}
.phead h2 i{font:600 10px var(--f-mono);font-style:normal;color:var(--on);background:var(--c1);padding:2px 5px;letter-spacing:.06em}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr))}

/* ---------- Hub ---------- */
.hub{display:grid;gap:14px;grid-template-columns:minmax(0,1fr)}
@media (min-width:900px){.hub{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}}
.core{display:grid;justify-items:center;gap:6px;text-align:center;padding-block:20px}
.core canvas{width:min(330px,82vw);height:min(330px,82vw)}
.hello{font:700 clamp(18px,4.6vw,24px)/1.2 var(--f-display);letter-spacing:.1em;text-transform:uppercase}
.sub{color:var(--muted);font-size:14px;max-width:46ch}
.console{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;gap:10px;min-height:420px}
.log{overflow-y:auto;max-height:46vh;min-height:180px;display:grid;align-content:start;gap:10px;padding-right:4px}
.msg{padding:10px 12px;font-size:14.5px;max-width:92%;white-space:pre-wrap;word-wrap:break-word}
.msg.you{justify-self:end;background:rgba(var(--c2-rgb),.14);border:1px solid rgba(var(--c2-rgb),.4);clip-path:polygon(10px 0,100% 0,100% 100%,0 100%,0 10px)}
.msg.rob{background:rgba(var(--c1-rgb),.06);border-left:2px solid var(--c1)}
.msg .who{display:block;font:700 10px var(--f-mono);letter-spacing:.2em;color:var(--c1);margin-bottom:3px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{background:rgba(var(--c1-rgb),.05);border:1px solid var(--line);color:var(--fg);font:600 11.5px var(--f-ui);letter-spacing:.06em;padding:7px 11px;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.chip:hover{border-color:var(--c1);color:var(--c1)}
.ask{display:flex;gap:8px}
.ask input{flex:1;min-width:0}
.mic{width:46px;padding:0;display:grid;place-items:center}
.mic svg{width:20px;height:20px}
.mic[aria-pressed="true"]{background:var(--c2);color:var(--on);box-shadow:0 0 18px var(--c2);animation:pulse 1s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 4px var(--c2)}}
.toggle{display:flex;gap:6px;align-items:center;cursor:pointer}
.toggle input{accent-color:var(--c1)}

/* Readout tiles */
.tiles{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:760px){.tiles{grid-template-columns:repeat(4,minmax(0,1fr))}}
.tile{--cut:12px;display:grid;gap:4px;align-content:start;text-decoration:none;color:var(--fg);padding:14px 14px 12px}
.tile .lbl{display:flex;justify-content:space-between;gap:6px}
.tile .lbl b{color:var(--c1);font-weight:700}
.tile .v{font:600 clamp(20px,5.4vw,28px)/1.15 var(--f-mono);font-variant-numeric:tabular-nums;color:var(--fg);text-shadow:0 0 14px rgba(var(--c1-rgb),.45);overflow-wrap:anywhere}
.tile .s{color:var(--muted);font-size:12.5px;line-height:1.35;overflow-wrap:anywhere}
.tile .go{margin-top:6px;font:700 9.5px var(--f-mono);letter-spacing:.18em;color:var(--c1)}
.tile:hover{filter:brightness(1.12)}

/* KPIs */
.kpis{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:760px){.kpis{grid-template-columns:repeat(4,minmax(0,1fr))}}
.kpi{--cut:10px;padding:13px}
.kpi .v{font:600 clamp(19px,5vw,27px)/1.1 var(--f-mono);font-variant-numeric:tabular-nums;margin-top:6px;text-shadow:0 0 14px rgba(var(--c1-rgb),.45);overflow-wrap:anywhere}
.kpi .v.pos{color:var(--good)} .kpi .v.neg{color:var(--bad)}
.kpi .s{color:var(--muted);font-size:12.5px;margin-top:3px}

/* Lists and rows */
.list{display:grid;gap:8px}
.state{font-size:13px;color:var(--muted);padding:11px 12px;border:1px dashed var(--line);background:rgba(var(--c1-rgb),.025)}
.state.err{color:var(--warn);border-color:rgba(255,181,71,.45)}
.row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 12px;background:rgba(var(--c1-rgb),.035);border:1px solid rgba(var(--c1-rgb),.1);border-left:2px solid var(--c1)}
.when{font:600 13px/1.15 var(--f-mono);min-width:54px;color:var(--c1)}
.when em{display:block;font-style:normal;font-size:10.5px;color:var(--muted);letter-spacing:.08em}
.row .t{min-width:0}
.row .t b{display:block;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row .t span{display:block;color:var(--muted);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row .t span.wrap{white-space:normal;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.row.lead{grid-template-columns:auto minmax(0,1fr)}
.row.lead .acts{grid-column:2;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.pill{display:inline-block;font:700 9.5px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;padding:5px 7px;border:1px solid currentColor;white-space:nowrap}
.pill.ok{color:var(--good)} .pill.info{color:var(--c3)} .pill.warn{color:var(--warn)} .pill.bad{color:var(--bad)}
.check{display:flex;gap:10px;align-items:center;padding:9px 10px;background:rgba(var(--c1-rgb),.03);border:1px solid rgba(var(--c1-rgb),.08)}
.check>span{flex:1;min-width:0;overflow-wrap:anywhere}
.check input[type=checkbox]{appearance:none;-webkit-appearance:none;width:18px;height:18px;flex:0 0 auto;margin:0;border:1.5px solid var(--c1);transform:rotate(45deg) scale(.82);display:grid;place-items:center;cursor:pointer}
.check input[type=checkbox]:checked{background:var(--c1);box-shadow:0 0 10px var(--c1)}
.check.done>span{text-decoration:line-through;color:var(--muted)}
.x{background:none;border:0;color:var(--muted);font-size:20px;line-height:1;padding:2px 6px}
.x:hover{color:var(--bad)}
.day h3{font:700 11px var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--c1);margin:12px 0 6px}
.day:first-child h3{margin-top:0}
.day{display:grid;gap:6px}
.bar{height:6px;background:rgba(var(--c1-rgb),.1);overflow:hidden}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--c1),var(--c2));box-shadow:0 0 10px var(--c1)}
.cats{display:grid;gap:9px}
.cat{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;font-size:13.5px}
.cat .bar{grid-column:1/-1}
.pipe{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}
.pipe div{padding:10px;border:1px solid var(--line);background:rgba(var(--c1-rgb),.04)}
.pipe b{display:block;font:600 22px var(--f-mono);margin-top:4px;text-shadow:0 0 12px rgba(var(--c1-rgb),.5)}
.listtabs{display:flex;gap:6px;flex-wrap:wrap}
.listtabs button{background:none;border:1px solid var(--line);padding:6px 10px;font:600 11px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.listtabs button[aria-pressed="true"]{background:var(--c1);color:var(--on);border-color:var(--c1);box-shadow:0 0 12px rgba(var(--c1-rgb),.5)}
.chart{width:100%;height:auto;display:block}
.chart text{font:500 10px var(--f-mono);fill:var(--muted)}
.chart text.val{fill:var(--fg);font-weight:600}

/* Forms and buttons */
.add{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.add input,.add select{flex:1 1 140px;min-width:0}
input,select{background:rgba(0,0,0,.35);border:1px solid var(--line);padding:10px 11px;color:var(--fg);border-radius:0;min-height:42px}
input:focus,select:focus{border-color:var(--c1);box-shadow:0 0 0 1px var(--c1),0 0 14px rgba(var(--c1-rgb),.3);outline:none}
input::placeholder{color:rgba(138,154,180,.75)}
.btn{background:rgba(var(--c1-rgb),.06);border:1px solid var(--line-strong);color:var(--fg);font:700 12px var(--f-ui);letter-spacing:.14em;text-transform:uppercase;padding:10px 16px;min-height:42px;clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px)}
.btn:hover{border-color:var(--c1);color:var(--c1)}
.btn.pri{background:linear-gradient(110deg,var(--c1),var(--c2));color:var(--on);border-color:transparent;box-shadow:0 0 18px rgba(var(--c1-rgb),.35)}
.btn.pri:hover{color:var(--on);filter:brightness(1.1)}
.btn.sm{padding:5px 10px;min-height:32px;font-size:11px}
.btn.wide{width:100%}
.toast{position:fixed;left:50%;bottom:calc(92px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:70;background:var(--panel-2);border:1px solid var(--c1);color:var(--fg);padding:10px 16px;font:600 13px var(--f-ui);letter-spacing:.04em;box-shadow:0 0 22px rgba(var(--c1-rgb),.35);max-width:calc(100vw - 32px)}

/* ---------- Launcher ---------- */
html[data-app="launcher"] body{background-image:radial-gradient(700px 500px at 0% 0%,rgba(60,239,180,.18),transparent 60%),radial-gradient(700px 500px at 100% 100%,rgba(255,61,139,.2),transparent 60%)}
.launch{min-height:100vh;min-height:100dvh;display:grid;align-content:center;gap:22px;padding-block:calc(28px + env(safe-area-inset-top,0px)) 28px}
.launch h1{text-align:center;font-size:clamp(26px,7vw,40px);letter-spacing:.3em}
.launch>p{text-align:center;color:var(--muted);margin:0}
.portals{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.portal{display:grid;gap:10px;justify-items:center;text-align:center;text-decoration:none;color:var(--fg);padding:28px 18px}
.portal h2{font-size:20px;letter-spacing:.2em}
.portal p{margin:0;color:var(--muted);font-size:14px}
.portal .go{font:700 11px var(--f-mono);letter-spacing:.2em;color:var(--c1)}
.portal.biz{--c1:#3cefb4;--c2:#8d7dff;--c1-rgb:60,239,180;--c2-rgb:141,125,255;--on:#02140d}
.portal.life{--c1:#ff8a3d;--c2:#ff3d8b;--c1-rgb:255,138,61;--c2-rgb:255,61,139;--on:#1c0500}

/* ---------- Brain (knowledge base) ---------- */
.kb{display:grid;gap:14px}
.kb-in .kb-home{display:none}
.kb-p{margin:0 0 12px;font-size:14px}
.kb-cards{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr))}
.kb-card{--cut:12px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 12px;align-items:center;text-decoration:none;color:var(--fg);padding:14px}
.kb-card .bar{grid-column:1/-1}
.kb-ico{width:40px;height:40px;display:grid;place-items:center;font-size:20px;color:var(--c1);border:1px solid var(--line-strong);background:rgba(var(--c1-rgb),.08);text-shadow:0 0 10px var(--c1)}
.kb-ct{min-width:0;display:grid}
.kb-ct b{font:700 15px var(--f-display);letter-spacing:.12em;text-transform:uppercase}
.kb-ct span{color:var(--muted);font-size:12.5px}
.kb-ct em{font-style:normal;color:var(--c1);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kb-n{font-size:15px;color:var(--c1)}
.kb-top{position:sticky;top:calc(env(safe-area-inset-top,0px) + 86px);z-index:5;display:flex;gap:12px;align-items:center;padding:8px 0;background:var(--ink);box-shadow:0 8px 12px -6px var(--ink)}
.kb-prog{flex:1;display:flex;gap:10px;align-items:center;min-width:0}
.kb-prog .bar{flex:1;height:8px}
.kb-prog .mono{color:var(--c1);font-weight:600}
.kb-set summary{list-style:none;cursor:pointer}
.kb-set summary::-webkit-details-marker{display:none}
.kb-set summary .phead{margin-bottom:0}
.kb-set[open] summary .phead{margin-bottom:12px}
.kb-set:not([open]) summary .lbl::after{content:" / show"}
.kb-set[open] summary .lbl::after{content:""}
.kb-set dl{margin:0;display:grid;gap:8px}
.kb-set dl div{display:grid;grid-template-columns:minmax(92px,30%) minmax(0,1fr);gap:10px;font-size:13.5px;padding-bottom:8px;border-bottom:1px solid rgba(var(--c1-rgb),.08)}
.kb-set dt{font:600 10.5px/1.5 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--c1)}
.kb-set dd{margin:0}
.kb-group{display:grid;gap:8px}
.kb-group h3{font:700 11.5px var(--f-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--c2);margin:6px 0 2px}
.kb-shot{background:rgba(var(--c1-rgb),.035);border:1px solid rgba(var(--c1-rgb),.12);border-left:2px solid var(--c1)}
.kb-shot.done{border-left-color:var(--muted);background:rgba(var(--c1-rgb),.015)}
.kb-shot.done .kb-name b{text-decoration:line-through;color:var(--muted)}
.kb-row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:stretch}
.kb-tick{display:grid;place-items:center;padding:0 6px 0 12px;cursor:pointer;min-width:52px}
.kb-tick input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.kb-tick{position:relative}
.kb-box{width:26px;height:26px;display:grid;place-items:center;border:2px solid var(--c1);background:rgba(0,0,0,.3);clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.kb-tick input:checked+.kb-box{background:var(--c1);box-shadow:0 0 14px var(--c1)}
.kb-tick input:checked+.kb-box::after{content:"";width:8px;height:13px;border:solid var(--on);border-width:0 3px 3px 0;transform:translateY(-2px) rotate(45deg)}
.kb-tick input:focus-visible+.kb-box{outline:2px solid var(--fg);outline-offset:2px}
.kb-name{all:unset;box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:11px 12px 11px 4px;cursor:pointer;min-width:0}
.kb-name:disabled{cursor:default}
.kb-name:focus-visible{outline:2px solid var(--c1);outline-offset:-2px}
.kb-name b{font-weight:600;font-size:15px}
.kb-name span{grid-column:1;color:var(--muted);font-size:13px;line-height:1.4}
.kb-name i{grid-column:2;grid-row:1/3;align-self:center;font:700 18px var(--f-mono);font-style:normal;color:var(--c1);width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--line)}
.kb-shot.open .kb-name span{color:var(--fg)}
.kb-body{padding:0 12px 14px;display:grid;gap:10px}
.kb-chips{display:flex;gap:6px;flex-wrap:wrap}
.kb-chip{font-size:12.5px;padding:5px 9px;border:1px solid var(--line-strong);background:rgba(var(--c1-rgb),.07)}
.kb-chip b{font:600 10px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--c1);margin-right:4px}
.kb-tip{margin:0;font-size:13.5px;padding:8px 10px;border-left:2px solid var(--c2);background:rgba(var(--c2-rgb),.08)}
.kb-tip::before{content:"TIP  ";font:700 10px var(--f-mono);letter-spacing:.14em;color:var(--c2)}
.kb-exs{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr))}
.kb-exs.tall{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:700px){.kb-exs.tall{grid-template-columns:repeat(2,minmax(0,220px))}}
.kb-ex{margin:0;display:grid;gap:6px;align-content:start}
.kb-art{position:relative;border:2px solid var(--good);box-shadow:0 0 14px rgba(var(--c1-rgb),.25);line-height:0;background:#000}
.kb-ex.bad .kb-art{border-color:var(--bad);box-shadow:0 0 14px rgba(255,93,115,.25)}
.kb-art svg{width:100%;height:auto;display:block}
.kb-badge{position:absolute;top:6px;left:6px;font:700 10px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;padding:5px 7px;background:var(--good);color:var(--on)}
.kb-ex.bad .kb-badge{background:var(--bad);color:#fff}
.kb-ex figcaption{font-size:13px;line-height:1.4}
.kb-ex.good figcaption{color:var(--fg)}
.kb-ex.bad figcaption{color:#ffc2cb}
.kb-note summary{cursor:pointer;font-weight:600;padding:8px 0}
.kb-note{border-top:1px solid var(--line);padding:2px 0}
.kb-note p{margin:6px 0 10px}
.kb-ul{margin:4px 0 12px;padding-left:20px}
.kb-ul li{margin:3px 0}
.kb-todo{border-left:3px solid var(--warn);padding:6px 10px;background:rgba(255,181,71,.08);font-size:13.5px}
.kb-todo b{color:var(--warn);font:600 11px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;margin-right:6px}
.kb-todo-key{font-size:12px}
.kb-foot{font-size:12.5px;margin:4px 0 0}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* Client care */
.row.care .t span+span{margin-top:1px}
.draft{margin-top:6px}
.draft summary{cursor:pointer;font:600 11px/1.4 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--c1);list-style:none}
.draft summary::-webkit-details-marker{display:none}
.draft summary::before{content:"▸ "}
.draft[open] summary::before{content:"▾ "}
.draft p{margin:6px 0 0;padding:8px 10px;white-space:pre-wrap;font-size:13px;line-height:1.45;color:var(--fg);background:rgba(var(--c1-rgb),.06);border-left:2px solid rgba(var(--c2-rgb),.6)}
.dock nav:has(a:nth-child(7)){gap:3px}
.dock nav:has(a:nth-child(7)) a{letter-spacing:.04em;font-size:9px;padding-inline:1px}
.crew-note{color:var(--muted);font-size:14px;margin:4px 0 12px}
.crew-btns{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:10px}