:root{
  --ink:#13293d; --soft:#4a6076; --film:#e3ebf2; --paper:#fff; --line:#c3d0dc; --wash:#f3f7fa;
  --action:#1c5d99; --action-dark:#144672;
  --emergency:#a4161a; --emergency-bg:#fbe9e9; --urgent:#9a4d00; --urgent-bg:#fdf1df; --clear:#1f6f54; --clear-bg:#e6f3ee;
  --font:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:var(--font);color:var(--ink);background:var(--film);font-size:16px;line-height:1.45}
h1,h2,h3{margin:0;font-weight:600;line-height:1.2}
h1{font-size:1.5rem} h2{font-size:1.2rem} h3{font-size:1rem}
p{margin:0 0 .6rem}
button,input,select,textarea{font:inherit;color:inherit}
.boot{padding:3rem 1.25rem;text-align:center;color:var(--soft)}
a{color:var(--action)}
:focus-visible{outline:3px solid #f0a202;outline-offset:2px}

.btn{border:1px solid var(--action);background:var(--action);color:#fff;padding:.6rem 1rem;border-radius:6px;cursor:pointer;font-weight:500}
.btn:hover{background:var(--action-dark)}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.btn.quiet{background:var(--paper);color:var(--action)}
.btn.quiet:hover{background:var(--wash)}
.btn.small{padding:.35rem .7rem;font-size:.9rem}
.btn.danger{background:var(--emergency);border-color:var(--emergency)}

label{display:block;font-weight:500;margin:.9rem 0 .25rem}
label .hint{font-weight:400;color:var(--soft)}
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=date],select,textarea{
  width:100%;padding:.55rem .65rem;border:1px solid var(--line);border-radius:6px;background:var(--paper)}
textarea{min-height:5.5rem;resize:vertical}
.check{display:flex;gap:.6rem;align-items:flex-start;font-weight:400;margin:.45rem 0}
.check input{margin-top:.25rem;width:1.1rem;height:1.1rem;flex:none}
.row{display:grid;gap:0 1rem;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr))}
.muted{color:var(--soft)} .small{font-size:.875rem}

/* sign in */
.gate{max-width:27rem;margin:0 auto;padding:12vh 1.25rem 2rem}
.gate .mark{font-size:2.4rem;font-weight:600;letter-spacing:-.02em}
.gate .mark span{color:var(--action)}
.gate .card{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:1.4rem;margin-top:1.4rem}

/* shell */
.top{background:var(--ink);color:#fff;display:flex;align-items:center;gap:1rem;padding:.6rem 1rem;flex-wrap:wrap}
.top .mark{font-weight:600;font-size:1.15rem;letter-spacing:-.01em}
.top nav{display:flex;gap:.25rem;flex:1;flex-wrap:wrap}
.top nav button{background:none;border:0;color:#c9d8e6;padding:.45rem .75rem;border-radius:6px;cursor:pointer}
.top nav button[aria-current=page]{background:#274a69;color:#fff}
.top .who{font-size:.875rem;color:#c9d8e6;text-align:right}
.top .who button{background:none;border:0;color:#fff;text-decoration:underline;cursor:pointer;padding:0;margin-left:.5rem}
.draft{background:#fff7d6;border-bottom:1px solid #e3cf7a;padding:.4rem 1rem;font-size:.875rem}
.main{display:grid;grid-template-columns:22rem 1fr;min-height:calc(100vh - 6rem)}
.list{background:var(--paper);border-right:1px solid var(--line);overflow:auto}
.detail{padding:1.25rem 1.5rem 4rem;overflow:auto;min-width:0}
.page{max-width:50rem;margin:0 auto;padding:1.25rem 1.25rem 4rem}
.filters{display:flex;gap:.4rem;padding:.75rem;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.filters button{border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:.3rem .8rem;cursor:pointer;font-size:.875rem}
.filters button[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.case-row{display:block;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line);padding:.75rem .9rem;cursor:pointer}
.case-row:hover{background:var(--wash)}
.case-row[aria-current=true]{background:var(--film)}
.case-row .name{font-weight:600}
.case-row .meta{font-size:.85rem;color:var(--soft);display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.15rem}
.tag{display:inline-block;font-size:.78rem;font-weight:600;padding:.1rem .5rem;border-radius:4px;background:var(--film)}
.tag.emergency{background:var(--emergency);color:#fff} .tag.urgent{background:var(--urgent-bg);color:var(--urgent)}
.empty{padding:2rem 1rem;color:var(--soft)}
.back{display:none}

/* pathway track: where the case is now */
.track{display:flex;margin:1rem 0 1.25rem;list-style:none;padding:0}
.track li{flex:1;position:relative;padding-top:1.1rem;font-size:.85rem;color:var(--soft)}
.track li::before{content:"";position:absolute;top:.3rem;left:0;right:0;height:4px;background:var(--line)}
.track li::after{content:"";position:absolute;top:0;left:0;width:.8rem;height:.8rem;border-radius:50%;background:var(--paper);border:3px solid var(--line)}
.track li.done::before,.track li.now::before{background:var(--action)}
.track li.done::after{background:var(--action);border-color:var(--action)}
.track li.now::after{border-color:var(--action)}
.track li.now{color:var(--ink);font-weight:600}
.track li:last-child::before{right:auto;width:0}
.track.stop li.now::after{border-color:var(--emergency);background:var(--emergency)}

.banner{border-radius:8px;padding:.8rem 1rem;margin:.75rem 0;border:1px solid}
.banner.emergency{background:var(--emergency-bg);border-color:var(--emergency);color:#5e0c0f}
.banner.urgent{background:var(--urgent-bg);border-color:#d9a25b;color:#5c2f00}
.banner.clear{background:var(--clear-bg);border-color:#9ccbb9;color:#12412f}
.banner strong{display:block}
section.block{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:1rem 1.15rem;margin:0 0 1rem}
section.block>h3{margin-bottom:.6rem}
dl.facts{display:grid;grid-template-columns:9.5rem 1fr;gap:.3rem .9rem;margin:0}
dl.facts dt{color:var(--soft)} dl.facts dd{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.study{display:flex;gap:.75rem;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:.6rem 0;flex-wrap:wrap}
.study:first-of-type{border-top:0}
.progress{height:8px;background:var(--film);border-radius:4px;overflow:hidden;margin:.5rem 0}
.progress i{display:block;height:100%;background:var(--action);width:0}
.log{list-style:none;padding:0;margin:0;font-size:.875rem}
.log li{padding:.3rem 0;border-top:1px solid var(--line)} .log li:first-child{border-top:0}
.letter{white-space:pre-wrap;background:var(--wash);border:1px solid var(--line);border-radius:6px;padding:.9rem}
fieldset{border:1px solid var(--line);border-radius:8px;margin:1rem 0 0;padding:.4rem .9rem .8rem}
legend{font-weight:600;padding:0 .4rem}
fieldset.em legend{color:var(--emergency)} fieldset.ur legend{color:var(--urgent)}
table.people{width:100%;border-collapse:collapse} table.people th,table.people td{text-align:left;padding:.45rem .5rem;border-bottom:1px solid var(--line);font-size:.9rem}

#toast{position:fixed;left:50%;bottom:1.25rem;transform:translateX(-50%);background:var(--ink);color:#fff;padding:.6rem 1rem;border-radius:8px;max-width:90vw;display:none;z-index:60}
#toast.on{display:block}

/* imaging viewer: black reading surface, pale film-blue type */
#overlay{position:fixed;inset:0;background:#05090d;z-index:50;display:flex;flex-direction:column;color:#cfe0ee}
#overlay[hidden]{display:none}
.vnote{background:#1b2a38;font-size:.8rem;padding:.3rem .75rem;display:flex;gap:1rem;justify-content:space-between;flex-wrap:wrap}
.vbar{display:flex;gap:.3rem;padding:.4rem .5rem;flex-wrap:wrap;align-items:center;background:#0d151d;border-bottom:1px solid #223344}
.vbar button{background:#16222e;border:1px solid #2c4156;color:#cfe0ee;border-radius:5px;padding:.4rem .65rem;cursor:pointer;font-size:.875rem}
.vbar button[aria-pressed=true]{background:#cfe0ee;color:#05090d;border-color:#cfe0ee}
.vbar .sep{width:1px;height:1.5rem;background:#2c4156;margin:0 .3rem}
.vbar .close{margin-left:auto;background:#cfe0ee;color:#05090d;font-weight:600}
.vbody{flex:1;display:grid;grid-template-columns:13rem 1fr 24rem;min-height:0}
.vbody.noreport{grid-template-columns:13rem 1fr}
.vseries{overflow:auto;border-right:1px solid #223344;padding:.4rem}
.vseries button{display:block;width:100%;text-align:left;background:none;border:1px solid transparent;color:#cfe0ee;padding:.5rem;border-radius:5px;cursor:pointer;font-size:.875rem}
.vseries button[aria-current=true]{border-color:#cfe0ee;background:#16222e}
.vseries .n{color:#8aa4ba;display:block;font-size:.78rem}
.vstage{display:flex;flex-direction:column;min-width:0;min-height:0}
.vhost{flex:1;min-height:0;position:relative;touch-action:none}
.vhost canvas{display:block;touch-action:none;outline-offset:-3px}
.vslide{padding:.35rem .75rem;background:#0d151d}
.vslide input{width:100%}
.vwarn{background:#5c2f00;color:#ffe2b8;padding:.35rem .75rem;font-size:.85rem}
.vreport{background:#f6f8fa;color:var(--ink);overflow:auto;border-left:1px solid #223344;display:flex;flex-direction:column}
.vreport .tabs{display:flex;gap:.3rem;padding:.5rem;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.vreport .tabs button{border:1px solid var(--line);background:#fff;border-radius:5px;padding:.25rem .6rem;cursor:pointer;font-size:.85rem}
.vreport .tabs button[aria-pressed=true]{background:var(--ink);color:#fff}
.vreport .body{padding:.9rem;white-space:pre-wrap;flex:1;overflow:auto}
.vreport iframe{width:100%;flex:1;min-height:60vh;border:0}

@media (max-width:860px){
  .main{grid-template-columns:1fr}
  .main.has-case .list{display:none}
  .main:not(.has-case) .detail{display:none}
  .back{display:inline-block;margin-bottom:.75rem}
  .detail{padding:1rem 1rem 4rem}
  dl.facts{grid-template-columns:1fr} dl.facts dt{margin-top:.4rem}
  .vbody,.vbody.noreport{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}
  .vseries{display:flex;gap:.3rem;border-right:0;border-bottom:1px solid #223344;overflow-x:auto}
  .vseries button{width:auto;white-space:nowrap}
  .vreport{max-height:38vh;border-left:0;border-top:1px solid #223344}
  .vreport.shut{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media print{.top,.list,.draft,.btn{display:none!important}.main{display:block}}
