/* Private office: Navy & Gold (default), Black & Gold, Ivory & Gold */
:root, .theme-navy{--bg:#07101f;--card:#0e192e;--card2:#15233f;--line:rgba(214,178,98,.3);--line2:rgba(214,178,98,.15);--text:#eef1f6;--muted:#a2aec1;--faint:#7a87a0;--gold:#d6b262;--gold-hi:#f4dd9c;--gold-lo:#96722b;--up:#7fd6a6;--down:#f2948a;--track:#22304d;--facade1:#1f2c47;--facade2:#111a2d;--pil:#26365a;--wallU1:#15213b;--wallU2:#203154;--wallL1:#0f1a30;--wallL2:#1a2a4e;--floorU1:#2a1d15;--floorU2:#43301f;--mar1:#cfcdc8;--mar2:#efede8;--ceil:#0a1222;--woodT:#5f3d26;--woodF:#3a2416;--leather:#5c1d21;--street:#060b16;--vault1:#17264a;--vault2:#0b1428}
.theme-black{--bg:#0a0a0b;--card:#131315;--card2:#1b1b1e;--line:rgba(212,175,95,.28);--line2:rgba(212,175,95,.14);--text:#f3eee5;--muted:#a8a197;--faint:#7f796f;--gold:#d4af5f;--gold-hi:#f3dc9a;--gold-lo:#94702a;--up:#7fd1a0;--down:#f09080;--track:#2a2a2e;--facade1:#26262a;--facade2:#141416;--pil:#2e2e33;--wallU1:#1f1a17;--wallU2:#2e2521;--wallL1:#141416;--wallL2:#202025;--floorU1:#2a1d15;--floorU2:#43301f;--mar1:#c9c2b6;--mar2:#ece6dc;--ceil:#0c0c0e;--woodT:#5f3d26;--woodF:#3a2416;--leather:#5c1d21;--street:#0d0d0e;--vault1:#1d1d20;--vault2:#0f0f11}
.theme-ivory{--bg:#f3eee5;--card:#fffbf4;--card2:#f4ecdd;--line:rgba(150,112,40,.32);--line2:rgba(150,112,40,.16);--text:#1e1913;--muted:#62594d;--faint:#857b6d;--gold:#8a6420;--gold-hi:#e8c77e;--gold-lo:#a07a2e;--up:#2a7650;--down:#b0423a;--track:#e6dccb;--facade1:#ebe3d4;--facade2:#d3c6af;--pil:#e1d6c3;--wallU1:#e3d6bf;--wallU2:#f1e8d6;--wallL1:#d9ddd0;--wallL2:#e8eae0;--floorU1:#7e5a3e;--floorU2:#a47b58;--mar1:#ddd8cf;--mar2:#f8f5ef;--ceil:#eee6d6;--woodT:#8a5c3a;--woodF:#6b4429;--leather:#7a2a2c;--street:#2a2622;--vault1:#fffbf4;--vault2:#efe5d2}
:root, .sky-day{--sky1:#7fb0d8;--sky2:#eadfca;--win1:#9cc6e6;--win2:#eef1ea;--orb:#fff1bf;--stars:0;--city:#6a7c92;--citylight:0;--glow:.28;--cone:.1;--spillc:#fff6df;--spill:.42}
.sky-sunset{--sky1:#2d2449;--sky2:#f0995f;--win1:#3b2c55;--win2:#f2a466;--orb:#ffb36b;--stars:.3;--city:#261e33;--citylight:.85;--glow:.75;--cone:.3;--spillc:#ffb27a;--spill:.3}
.sky-night{--sky1:#050913;--sky2:#1b1a2b;--win1:#0a1124;--win2:#232542;--orb:#ece6d6;--stars:1;--city:#0b1120;--citylight:1;--glow:1;--cone:.45;--spillc:#c7d4ff;--spill:.1}

*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text)}
body{font-family:'Jost',system-ui,sans-serif;font-size:15px;line-height:1.4;-webkit-font-smoothing:antialiased}
a{color:var(--gold)}a:hover{color:var(--gold-hi)}
.num{font-family:'Cormorant Garamond',Georgia,serif;font-variant-numeric:lining-nums tabular-nums}
.serif{font-family:'Cormorant Garamond',Georgia,serif}
.muted{color:var(--muted)}.faint{color:var(--faint)}.goldc{color:var(--gold)}
.up{color:var(--up)}.down{color:var(--down)}

.page{min-height:100vh;padding:28px 32px 48px}
.wrap{max-width:1376px;margin:0 auto;display:flex;flex-direction:column;gap:24px}

header.top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:16px}
.seal{width:52px;height:52px;border-radius:50%;border:1.5px solid var(--gold);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--gold)}
.brand h1{margin:0;font-family:'Cormorant Garamond',serif;font-size:30px;font-weight:600;line-height:1}
.eyebrow{font-size:12px;letter-spacing:.24em;color:var(--muted);text-transform:uppercase}
.headright{display:flex;flex-wrap:wrap;align-items:center;gap:20px;font-size:14px;color:var(--muted)}
.status{display:flex;align-items:center;gap:10px;color:var(--text)}
.dot{width:8px;height:8px;border-radius:50%;background:#7fd1a0;display:inline-block;animation:live 1.8s ease-out infinite}
.dot.warn{background:#e0b450;animation:none}.dot.bad{background:#f2948a;animation:none}
@keyframes live{0%{box-shadow:0 0 0 0 rgba(127,209,160,.6)}100%{box-shadow:0 0 0 10px rgba(127,209,160,0)}}
.clock{font-size:19px;color:var(--text)}
.themes{display:flex;gap:6px}
.themes button{min-height:40px;display:flex;align-items:center;gap:8px;padding:0 12px;border-radius:999px;background:var(--card);border:1px solid var(--line);color:var(--text);font:inherit;font-size:13px;cursor:pointer}
.themes button[aria-pressed="true"]{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
.sw{width:16px;height:16px;border-radius:50%;border:3px solid;display:inline-block}
.sw.navy{background:#0e192e;border-color:#d6b262}.sw.black{background:#0a0a0b;border-color:#d4af5f}.sw.ivory{background:#f3eee5;border-color:#a07a2e}
.signout{color:var(--muted);font-size:13px;text-decoration:none;border-bottom:1px solid var(--line)}

.banner{display:none;border:1px solid var(--down);color:var(--text);background:var(--card);border-radius:6px;padding:12px 16px;font-size:14px}
.banner.show{display:block}

.hero{display:flex;flex-wrap:wrap;gap:24px;align-items:stretch}
.scene{flex:999 1 680px;min-width:0;border-radius:6px;overflow:hidden;border:1px solid var(--line);background:var(--card)}
.scene svg{display:block;width:100%;height:auto}
.vaultwrap{flex:1 1 360px;min-width:0;display:flex}
.vault{flex-grow:1;border-radius:6px;padding:28px;background:linear-gradient(160deg,var(--vault1),var(--vault2));border:1px solid var(--line);display:flex;flex-direction:column;gap:18px}
.vault .row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.label{font-size:12px;letter-spacing:.28em;color:var(--gold);text-transform:uppercase}
.big{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.big .num{font-size:92px;font-weight:600;line-height:.9}
.since{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:16px}
.since .num{font-size:24px;font-weight:600}
.rule{height:1px;background:var(--line)}
.pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.pair .k{font-size:12px;letter-spacing:.16em;color:var(--muted);text-transform:uppercase}
.pair .v{font-size:32px;font-weight:600}
.track{height:3px;background:var(--track);position:relative}
.track > i{position:absolute;left:0;top:0;height:3px;background:var(--gold)}
.small{font-size:12px;color:var(--muted)}

.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:24px}
.card{border-radius:6px;padding:26px;background:var(--card);border:1px solid var(--line);display:flex;flex-direction:column;gap:16px;min-width:0}
.card.file{background:linear-gradient(160deg,var(--card2),var(--card))}
.card .head{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.card h2{margin:0;font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:600}
.empty{color:var(--muted);font-size:14px;padding:6px 0}

.trade{display:flex;flex-direction:column;gap:8px;padding-bottom:16px;border-bottom:1px solid var(--line2)}
.trade:last-child{border-bottom:0;padding-bottom:0}
.trade .t1{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.trade .name{font-size:16px;font-weight:500}
.trade .pnl{font-size:23px;font-weight:600}
.bar{position:relative;height:4px;background:var(--track)}
.bar .fill{position:absolute;top:0;height:4px;transition:left .8s ease,width .8s ease}
.bar .entry{position:absolute;left:33.3%;top:-4px;width:1.5px;height:12px;background:var(--muted)}
.bar .be{position:absolute;left:66.6%;top:-4px;width:1.5px;height:12px;background:var(--gold)}

.gauge{display:flex;align-items:center;gap:22px}
.gauge svg{flex:none}
.nowrap{white-space:nowrap}
@media (min-width:1240px){.card.wide{grid-column:span 2}}
.card.full{grid-column:1/-1}
.parts{display:grid;grid-template-columns:110px 1fr 50px;gap:10px 12px;align-items:center;font-size:14px}
.parts .num{font-size:18px;text-align:right}

.badge{font-size:11px;letter-spacing:.24em;color:var(--gold);border:1px solid var(--gold);padding:4px 8px}
.avatar{width:64px;height:64px;border-radius:50%;background:#1c2a44;border:2px solid var(--gold);display:flex;align-items:center;justify-content:center;flex:none}
.who{display:flex;align-items:center;gap:16px}
.needs{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--muted)}
.needs li::before{content:"☐ ";color:var(--gold)}

.table{width:100%;border-collapse:collapse;font-size:14px}
.table th{font-weight:400;font-size:11px;letter-spacing:.18em;color:var(--gold);text-align:left;padding:0 6px 10px 0;border-bottom:1px solid var(--line);text-transform:uppercase}
.table td{padding:9px 6px 9px 0;border-bottom:1px solid var(--line2);vertical-align:baseline}
.table tr:last-child td{border-bottom:0}
.table .num{font-size:19px}
.r{text-align:right}
.tablebox{overflow-x:auto}

footer.foot{display:flex;justify-content:center;align-items:center;gap:10px;padding-top:8px;font-size:12px;letter-spacing:.2em;color:var(--faint);text-align:center}
footer.foot span.l{width:40px;height:1px;background:var(--line);display:inline-block}

/* executive floor (v3.31): an office is dimmed with a NOW HIRING sign until its employee goes live */
.office .led{fill:#7fd1a0}
.office.hiring .led{fill:#5a5a60}
.office.hiring .lit{display:none}
.office:not(.hiring) .vacant{display:none}

/* staff directory */
.staff td{vertical-align:top}
.staff .st{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.staff .st i{width:8px;height:8px;border-radius:50%;display:inline-block;background:var(--faint)}
.staff .st.live i{background:var(--up)}
.staff .st.ceo i{background:var(--gold)}
.staff .role{font-family:'Cormorant Garamond',Georgia,serif;font-size:19px;font-weight:600;color:var(--text)}
.staff .job{color:var(--muted);font-size:13px;line-height:1.5}

/* tabs (v3.31.1) */
.tabs{display:flex;gap:8px;flex-wrap:wrap}
.tabs button{min-height:44px;padding:0 18px;border-radius:999px;background:var(--card);border:1px solid var(--line);color:var(--muted);font:inherit;font-size:14px;letter-spacing:.04em;cursor:pointer}
.tabs button[aria-selected="true"]{color:var(--text);border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
.tabs button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.tabpanel{display:flex;flex-direction:column;gap:24px}
.tabpanel[hidden]{display:none}

/* HR file */
.hrsum{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}
.tile{border-radius:6px;padding:20px;background:linear-gradient(160deg,var(--vault1),var(--vault2));border:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.tile .k{font-size:12px;letter-spacing:.16em;color:var(--gold);text-transform:uppercase}
.tile .v{font-size:34px;font-weight:600;line-height:1}
.hrgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px}
.pfile{border-radius:6px;padding:24px;background:var(--card);border:1px solid var(--line);display:flex;flex-direction:column;gap:14px;min-width:0}
.pfile.off{border-style:dashed}
.pfile .top{display:flex;align-items:center;gap:14px}
.pfile .ini{width:52px;height:52px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;border:2px solid var(--gold);background:var(--card2);font-family:'Cormorant Garamond',Georgia,serif;font-size:24px;font-weight:600;color:var(--gold)}
.pfile .nm{font-family:'Cormorant Garamond',Georgia,serif;font-size:26px;font-weight:600;line-height:1.05}
.pfile .tag{margin-left:auto;font-size:10px;letter-spacing:.2em;padding:4px 8px;border:1px solid var(--faint);color:var(--muted);text-transform:uppercase;white-space:nowrap}
.pfile .tag.live{border-color:var(--up);color:var(--up)}
.pfile dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:8px 16px;font-size:14px}
.pfile dt{color:var(--muted);font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding-top:2px}
.pfile dd{margin:0;text-align:right;min-width:0}
.pfile dd .num{font-size:19px}
.pfile .sub{display:block;font-size:12px;color:var(--faint)}
.pfile .job{font-size:13px;color:var(--muted);line-height:1.5;border-top:1px solid var(--line2);padding-top:12px}
.hrnote{margin:0;line-height:1.6}

/* scene animation */
.pulse{animation:pulse 4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:calc(var(--glow)*.8)}50%{opacity:var(--glow)}}
.head-anim{animation:look 10s ease-in-out infinite}
@keyframes look{0%,38%{transform:translateX(0)}46%,64%{transform:translateX(-3px)}72%,88%{transform:translateX(3px)}100%{transform:translateX(0)}}
.steam{animation:steam 3.2s ease-out infinite}
@keyframes steam{0%{opacity:0;transform:translateY(0)}30%{opacity:.7}100%{opacity:0;transform:translateY(-14px)}}
.tw{animation:twinkle 5s ease-in-out infinite}
@keyframes twinkle{0%,100%{opacity:var(--citylight)}50%{opacity:calc(var(--citylight)*.25)}}
.scr{animation:flick 7s infinite}
@keyframes flick{0%,95%,100%{opacity:1}97%{opacity:.55}}
.sway{transform-box:fill-box;transform-origin:50% 0;animation:sway 6s ease-in-out infinite}
@keyframes sway{0%,100%{transform:rotate(-1.2deg)}50%{transform:rotate(1.2deg)}}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(calc(-1px * var(--tickw,620)))}}
.ticker{animation:tick 24s linear infinite}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* sign-in pages */
.gate{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.gate .box{max-width:460px;text-align:center;display:flex;flex-direction:column;gap:16px;align-items:center}
.gate h1{margin:0;font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:600}
.gate p{margin:0;color:var(--muted);line-height:1.6}

@media (max-width:640px){
  .page{padding:16px 16px 32px}
  .big .num{font-size:64px}
  .grid{grid-template-columns:minmax(0,1fr)}
  .card{padding:20px}
  .vault{padding:20px}
}

/* typed sign-in code */
.codeform{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;max-width:300px;margin-top:8px}
.codeform input{width:100%;min-height:56px;text-align:center;font-family:'Cormorant Garamond',Georgia,serif;font-size:34px;letter-spacing:.18em;font-variant-numeric:lining-nums tabular-nums;color:var(--text);background:var(--card);border:1px solid var(--line);border-radius:6px;padding:4px 12px}
.codeform input:focus{outline:2px solid var(--gold);outline-offset:2px}
.codeform button{width:100%;min-height:48px;border-radius:6px;border:1px solid var(--gold);background:var(--gold);color:#0e192e;font:inherit;font-weight:600;font-size:15px;cursor:pointer}
.codeform button:disabled{opacity:.6;cursor:wait}
