/* Driftroom shared styles for inner pages (app, reserve, docs, journal) */
:root{
  --paper:#E4EAE7; --paper-2:#F2F5F3; --ink:#121418; --ink-2:#1C1F25;
  --accent:#FF5B2E; --lilac:#B9A8F2; --teal:#0E3B43; --muted:#5B616B;
  --up:#1F8A5B; --down:#D8452A;
  --fx:16px; --fy:70px;
  --mono:"Geist Mono", ui-monospace, monospace; --sans:"Geist", system-ui, sans-serif; --pixel:"Silkscreen", monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--paper)}
body{color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;min-height:100vh}
a{color:inherit}
button,input,select{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.skip{position:fixed;left:-999px;top:8px;z-index:100;background:var(--ink);color:var(--paper);padding:8px 12px;font-family:var(--mono);font-size:12px}
.skip:focus{left:8px}

/* header (same as home) */
.hdr{position:fixed;top:12px;left:var(--fx);right:var(--fx);height:46px;z-index:40;display:flex;align-items:stretch;background:var(--paper);box-shadow:inset 0 0 0 1px var(--ink)}
.logo{display:flex;align-items:center;gap:14px;text-decoration:none;padding-right:20px}
.logo-mark{width:46px;height:46px;background:var(--ink);display:grid;place-items:center}
.logo-mark svg{width:26px;height:26px}
.logo-word{font-weight:500;font-size:19px;letter-spacing:-.02em}
.nav{flex:1;display:flex;justify-content:center;align-items:center;gap:30px}
.chip{display:inline-flex;align-items:center;gap:12px;font-family:var(--mono);font-size:11.5px;text-decoration:none;letter-spacing:.02em}
.chip i,.ki{font-style:normal;width:16px;height:16px;display:inline-grid;place-items:center;font-size:9.5px;font-weight:500;flex:none}
.chip[aria-current="page"] span{text-decoration:underline;text-underline-offset:3px}
.chip:hover span{text-decoration:underline;text-underline-offset:3px}
.c-acc{background:var(--accent);color:var(--ink)} .c-lil{background:var(--lilac);color:var(--ink)}
.c-teal{background:var(--teal);color:var(--paper)} .c-ink{background:var(--ink);color:var(--paper)}
.c-pap{background:var(--paper-2);color:var(--ink);box-shadow:inset 0 0 0 1px rgba(18,20,24,.2)}
.launch{display:flex;align-items:center;padding:0 14px 0 20px}

/* frame */
.frame{margin:var(--fy) var(--fx) var(--fx);box-shadow:inset 0 0 0 1px var(--ink);min-height:calc(100vh - var(--fy) - var(--fx));position:relative}
.box{box-shadow:inset 0 0 0 1px var(--ink);background:var(--paper)}
.box.soft{background:var(--paper-2)}
.dark{background:var(--ink);color:var(--paper)}
.pad{padding:18px 20px}
.tag{display:flex;align-items:flex-start;gap:12px;font-family:var(--mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.03em;line-height:1.45}
.tag b{font-weight:400;background:var(--paper-2);color:var(--ink);min-width:24px;height:22px;display:grid;place-items:center;font-size:10.5px;flex:none;box-shadow:inset 0 0 0 1px rgba(18,20,24,.12)}
.pixel{font-family:var(--pixel);letter-spacing:-.04em}
.mono{font-family:var(--mono)}
.muted{color:var(--muted)}
.up{color:var(--up)} .down{color:var(--down)}
.h1{font-family:var(--pixel);font-weight:400;font-size:clamp(40px,6vw,96px);line-height:1;letter-spacing:-.06em}
.h2{font-weight:400;font-size:clamp(26px,2.6vw,40px);letter-spacing:-.025em;line-height:1.1}
.btn{display:inline-flex;align-items:center;gap:14px;background:var(--paper-2);color:var(--ink);font-family:var(--mono);font-size:11.5px;padding:5px 5px 5px 10px;text-decoration:none;box-shadow:inset 0 0 0 1px var(--ink);transition:background .2s,color .2s}
.btn i{font-style:normal;width:16px;height:16px;display:grid;place-items:center;font-size:9.5px}
.btn:hover{background:var(--ink);color:var(--paper)}
.btn.solid{background:var(--ink);color:var(--paper)}
.btn.solid:hover{background:var(--accent);color:var(--ink)}
.notice{font-family:var(--mono);font-size:11px;background:var(--lilac);color:var(--ink);padding:7px 12px;display:flex;gap:10px;align-items:center}
.notice b{font-weight:500}
.badge{font-family:var(--mono);font-size:10px;padding:2px 6px;display:inline-flex;align-items:center;gap:6px;box-shadow:inset 0 0 0 1px currentColor;text-transform:uppercase;letter-spacing:.04em}
.badge.ok{color:var(--up)}
.live-dot{width:7px;height:7px;background:var(--accent);display:inline-block;animation:pulse 1.4s steps(2) infinite}
@keyframes pulse{50%{opacity:.2}}

/* tables */
.tbl{width:100%;border-collapse:collapse;font-size:13.5px}
.tbl th{font-family:var(--mono);font-weight:400;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;text-align:left;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--ink)}
.tbl td{padding:11px 12px;border-bottom:1px solid rgba(18,20,24,.15);vertical-align:middle}
.tbl td.num,.tbl th.num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
.tbl tr:hover td{background:rgba(18,20,24,.035)}
.tick{font-family:var(--mono);font-weight:500;font-size:12px}
.spark{width:96px;height:26px;display:block;margin-left:auto}

/* reveal */
.rv{opacity:0;transform:translateY(16px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
.skel{background:linear-gradient(90deg,rgba(18,20,24,.06) 25%,rgba(18,20,24,.12) 50%,rgba(18,20,24,.06) 75%);background-size:200% 100%;animation:sk 1.2s linear infinite;color:transparent!important}
@keyframes sk{to{background-position:-200% 0}}

/* footer */
.foot{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:16px 20px;font-family:var(--mono);font-size:11px}
.foot a{text-decoration:none}.foot a:hover{color:var(--accent)}
.foot nav{display:flex;gap:18px;flex-wrap:wrap}

@media (max-width:1000px){ .nav{gap:18px} .nav .chip span{display:none} }
@media (max-width:760px){
  :root{--fx:8px;--fy:62px}
  .hdr{top:8px;height:44px}.logo-mark{width:44px;height:44px}
  .nav{display:none}.launch{margin-left:auto}
  .tbl .hide-sm{display:none}
}

/* mobile menu */
.menu-btn{display:none;align-items:center;gap:10px;margin-left:auto;padding:0 14px;font-family:var(--mono);font-size:11.5px;box-shadow:inset 1px 0 0 var(--ink)}
.menu-btn .bars{width:16px;height:12px;display:grid;align-content:space-between}
.menu-btn .bars i{display:block;height:2px;background:var(--ink);transition:transform .25s,opacity .25s}
.menu-btn[aria-expanded="true"] .bars i:nth-child(1){transform:translateY(5px) rotate(45deg)}
.menu-btn[aria-expanded="true"] .bars i:nth-child(2){opacity:0}
.menu-btn[aria-expanded="true"] .bars i:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
.mnav{position:fixed;top:52px;left:var(--fx);right:var(--fx);z-index:45;background:var(--paper);box-shadow:inset 0 0 0 1px var(--ink),6px 6px 0 rgba(18,20,24,.18);display:flex;flex-direction:column}
.mnav[hidden]{display:none}
.mnav a{display:flex;align-items:center;gap:12px;padding:15px 16px;border-bottom:1px solid rgba(18,20,24,.15);font-family:var(--mono);font-size:13px;text-decoration:none;color:var(--ink)}
.mnav a:last-child{border-bottom:0}
.mnav a i{font-style:normal;width:18px;height:18px;display:grid;place-items:center;font-size:10px}
.mnav a[aria-current="page"]{background:var(--ink);color:var(--paper)}
@media (max-width:760px){.menu-btn{display:flex}.hdr .launch{display:none}}
@media (prefers-reduced-motion:reduce){ .rv{opacity:1;transform:none;transition:none} .live-dot,.skel{animation:none} }