/* Docket console — paper & ink, verdict stamps as the one signature element. */
:root{
  --paper:#F5F6F4; --card:#FCFCFA; --ink:#1C2733; --muted:#5A6672;
  --steel:#3D5A80; --verdict:#2E6B4F; --rust:#9C3B2E; --rule:#D8DCD9;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);
  font:400 15px/1.55 Inter,system-ui,sans-serif}
header{padding:28px 20px 0;max-width:880px;margin:0 auto}
h1{font:700 40px/1 Newsreader,serif;margin:0;letter-spacing:-.01em}
.sub{color:var(--muted);margin:.4em 0 1.2em}
#lanes{display:flex;gap:6px;border-bottom:2px solid var(--ink);flex-wrap:wrap}
.lane{background:none;border:none;font:600 13px Inter;color:var(--muted);
  padding:10px 12px;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-2px}
.lane.active{color:var(--ink);border-bottom-color:var(--steel)}
.lane:focus-visible{outline:2px solid var(--steel);outline-offset:2px}
main{max-width:880px;margin:0 auto;padding:16px 20px 80px}
.empty{color:var(--muted);text-align:center;padding:40px 0}
.docket{background:var(--card);border:1px solid var(--rule);border-left:4px solid var(--steel);
  border-radius:2px;padding:16px 18px;margin:14px 0;position:relative}
.docket.stretch{border-left-color:var(--verdict)}
.stamp{position:absolute;top:12px;right:14px;transform:rotate(-6deg);
  font:500 12px/1.1 "IBM Plex Mono",monospace;color:var(--steel);
  border:2px solid var(--steel);border-radius:3px;padding:4px 8px;text-align:center}
.stamp b{display:block;font-size:22px}
.stamp.hot{color:var(--verdict);border-color:var(--verdict)}
.co{font:700 20px Newsreader,serif;margin:0 90px 2px 0}
.role{font:600 15px Inter;margin:0 90px 6px 0}
.meta{font:400 12px "IBM Plex Mono",monospace;color:var(--muted);margin-bottom:8px}
.meta .est{color:var(--rust)}
.why{margin:8px 0;padding:10px 12px;background:var(--paper);border-radius:2px}
.gaps{font-size:13px;color:var(--muted)}
.gaps b{color:var(--ink)}
.acts{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
button.act{font:600 13px Inter;border-radius:2px;padding:9px 16px;cursor:pointer;
  border:1px solid var(--ink);background:var(--card);color:var(--ink)}
button.approve{background:var(--verdict);border-color:var(--verdict);color:#fff}
button.rust{background:var(--rust);border-color:var(--rust);color:#fff}
button.act:focus-visible{outline:2px solid var(--steel);outline-offset:2px}
a.apply{font:500 13px Inter;color:var(--steel);align-self:center}
dialog{border:1px solid var(--rule);border-radius:3px;max-width:360px;width:92%;
  background:var(--card);color:var(--ink)}
dialog h2{font:700 22px Newsreader,serif;margin:.2em 0}
.hint{color:var(--muted);font-size:13px}
#reasons label{display:block;padding:6px 4px;font-size:14px;cursor:pointer}
#denyNote{width:100%;padding:8px;border:1px solid var(--rule);border-radius:2px;
  font:400 14px Inter;margin-top:8px}
menu{display:flex;gap:8px;justify-content:flex-end;padding:0;margin-top:14px}
menu button{font:600 13px Inter;padding:8px 14px;border-radius:2px;
  border:1px solid var(--ink);background:var(--card);cursor:pointer}
.ops table{width:100%;border-collapse:collapse;font:400 12px "IBM Plex Mono",monospace}
.ops td,.ops th{border-bottom:1px solid var(--rule);padding:6px 8px;text-align:left}
.badge{font:500 11px "IBM Plex Mono";border:1px solid var(--rule);
  border-radius:2px;padding:2px 6px;color:var(--muted)}
@media (max-width:560px){h1{font-size:30px}.stamp{position:static;display:inline-block;
  transform:rotate(-3deg);margin-bottom:8px}.co,.role{margin-right:0}}
@media (prefers-reduced-motion:no-preference){
  .docket{animation:rise .25s ease both}
  @keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1}}
}