:root{--sd-bg:#05090f;--sd-bg2:#08111c;--sd-panel:#0c1723;--sd-elevated:#10202e;--sd-border:#1c3040;--sd-cyan:#27c7e8;--sd-teal:#20c9b0;--sd-highlight:#5ce1f2;--sd-text:#f3f7fa;--sd-secondary:#91a5b5;--sd-muted:#5f7485}
.viewer-page{background:linear-gradient(rgba(5,9,15,.78),rgba(5,9,15,.88)),url('../images/Scan Desk.png') center top/cover fixed no-repeat,radial-gradient(circle at 82% 12%,rgba(39,199,232,.12),transparent 30%),radial-gradient(circle at 12% 88%,rgba(32,201,176,.08),transparent 30%),linear-gradient(#05090f,#08111c 55%,#05090f);color:var(--sd-text)}
.viewer-page:after{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.22;background:linear-gradient(rgba(92,225,242,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(92,225,242,.035) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse at center,transparent 15%,#000 82%)}
.viewer-header,.viewer-footer{background:rgba(5,9,15,.78);border-color:rgba(92,225,242,.12);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.viewer-header{position:sticky;top:0}.viewer-brand{color:var(--sd-text)}.viewer-brand i{color:var(--sd-cyan)}.viewer-header-title .eyebrow{color:var(--sd-cyan)}.viewer-header-title strong{color:var(--sd-secondary)}
.viewer-brand i,.viewer-header-title .eyebrow,.viewer-footer span:first-child{color:#6de1c2}
.viewer-shell{max-width:1180px;padding-top:64px}.viewer-intro{align-items:center}.viewer-intro h1{font-size:clamp(32px,4vw,46px);letter-spacing:-.045em}.viewer-intro p{max-width:560px;color:var(--sd-secondary)}.privacy-pill{color:var(--sd-teal);border-color:rgba(32,201,176,.28);background:rgba(32,201,176,.07)}
.viewer-card{background:rgba(12,23,35,.72);border:1px solid rgba(120,210,230,.1);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.25);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.viewer-card:hover{border-color:rgba(39,199,232,.22)}.viewer-card h2{color:var(--sd-text)}.viewer-card p{color:var(--sd-secondary)}.step-number{background:var(--sd-cyan);box-shadow:none}.input-row input{background:rgba(5,9,15,.78);border-color:var(--sd-border);color:var(--sd-text)}.input-row input::placeholder{color:var(--sd-muted)}.input-row button{background:var(--sd-cyan);box-shadow:none}.input-row button:hover{background:var(--sd-highlight)}.form-note{color:var(--sd-muted)}
.how-grid div{background:rgba(8,17,28,.65);border-color:rgba(120,210,230,.1)}.how-grid b{color:var(--sd-text)}.how-grid span{color:var(--sd-secondary)}
.workspace{max-width:1280px;margin-left:auto;margin-right:auto}.workspace-top{margin-bottom:12px}.workspace-grid{min-height:620px;background:var(--sd-panel);border:1px solid var(--sd-border);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.3);backdrop-filter:none}.series-panel{background:var(--sd-bg2);border-right:1px solid var(--sd-border)}.series-item{border-left:2px solid transparent}.series-item.active{background:rgba(39,199,232,.08);border:1px solid rgba(39,199,232,.25);border-left:2px solid var(--sd-cyan)}.series-thumb{background:var(--sd-elevated);color:var(--sd-cyan)}.image-stage{background:#000}.stage-toolbar,.stage-footer{color:var(--sd-muted);border-color:var(--sd-border)}.ghost-button{color:var(--sd-secondary);border-color:var(--sd-border);background:rgba(12,23,35,.7)}.ghost-button:hover{color:var(--sd-text);border-color:rgba(39,199,232,.35)}
.scan-placeholder{background:#000}.scan-empty{color:var(--sd-secondary)}.scan-empty small{color:var(--sd-muted)}.scan-ring{border-color:rgba(39,199,232,.55);box-shadow:0 0 0 16px rgba(39,199,232,.025),0 0 45px rgba(39,199,232,.12)}.scan-ring:after{background:linear-gradient(transparent,var(--sd-cyan),transparent)}
.viewer-footer{color:var(--sd-muted)}.viewer-footer span:first-child{color:var(--sd-cyan)}
@media(max-width:700px){.viewer-shell{padding-top:38px}.viewer-intro h1{font-size:32px}.viewer-card{border-radius:14px}.workspace-grid{min-height:440px}.scan-placeholder canvas{min-height:320px}}
.scan-placeholder{position:relative}
.slice-nav{position:absolute;right:16px;bottom:16px;z-index:8;display:flex;gap:8px;pointer-events:none}
.slice-nav button{pointer-events:auto;width:44px;height:44px;border:1px solid rgba(180,235,235,.34);border-radius:50%;background:linear-gradient(145deg,rgba(191,231,242,.2),rgba(15,29,43,.72));color:#6de1c2;font:32px/1 Arial,sans-serif;display:grid;place-items:center;padding:0 0 4px;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 10px 24px rgba(0,0,0,.32);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:transform .18s ease,background .18s ease,opacity .18s ease}
.slice-nav button:hover:not(:disabled){background:linear-gradient(145deg,rgba(109,225,194,.32),rgba(15,29,43,.78));transform:translateY(-2px)}
.slice-nav button:active:not(:disabled){transform:scale(.94)}
.slice-nav button:disabled{opacity:.28;cursor:not-allowed}
@media(max-width:700px){.slice-nav{left:0;right:0;bottom:12px;justify-content:space-between;padding:0 10px}.slice-nav button{width:42px;height:42px;font-size:30px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}
@media(min-width:701px){
  body.viewer-page{display:grid!important;grid-template-rows:88px minmax(0,1fr)!important;height:100dvh!important;min-height:0!important;overflow:hidden!important}
  body.viewer-page>.viewer-header{grid-row:1;position:relative!important;top:auto!important;height:88px!important;min-height:0!important;flex:none!important}
  body.viewer-page>.viewer-shell{grid-row:2;position:relative!important;inset:auto!important;width:min(calc(100% - 40px),1180px)!important;height:auto!important;min-height:0!important;margin:0 auto!important;padding:16px 0 20px!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}
  body.viewer-page>.viewer-shell>.workspace:not([hidden]){position:fixed!important;z-index:10!important;top:88px!important;bottom:24px!important;left:max(20px,calc((100vw - 1180px)/2))!important;right:max(20px,calc((100vw - 1180px)/2))!important;width:auto!important;height:auto!important;min-height:0!important;max-height:none!important;display:flex!important;flex-direction:column!important;margin:0!important}
  body.viewer-page .workspace-grid{height:auto!important;min-height:0!important;flex:1 1 auto!important}
  body.viewer-page .image-stage{height:auto!important;min-height:0!important;flex:1 1 auto!important}
  body.viewer-page .scan-placeholder{height:auto!important;min-height:0!important;flex:1 1 auto!important}
  body.viewer-page #dicom-viewport{height:100%!important;min-height:0!important}
}