@font-face{font-family:Manrope;src:url('public/fonts/source-sans-400.ttf')}@font-face{font-family:Manrope;src:url('public/fonts/source-sans-600.ttf');font-weight:700 800}
:root{--ink:#eef8f6;--muted:#9ab0ad;--bg:#071012;--panel:#0d191b;--line:#213336;--cyan:#60e6d1;--cyan-dark:#0e413c;--amber:#ffc55e;--coral:#ff8277;--success:#62e2b7;--radius:14px;--shadow:0 22px 54px rgba(0,0,0,.34)}
*{box-sizing:border-box}html{background:var(--bg);color:var(--ink);font-family:Manrope,system-ui,sans-serif}body{margin:0;min-height:100vh;background:radial-gradient(circle at 18% 10%,rgba(53,126,117,.13),transparent 28%),var(--bg)}button,select{font:inherit}.hidden{display:none!important}.signal{color:var(--cyan);font-size:.72rem;font-weight:800;letter-spacing:.16em;margin:0 0 18px}.brand{font-size:1.05rem;font-weight:800;letter-spacing:-.02em;display:flex;align-items:center;gap:10px}.brand-mark{width:26px;height:26px;border:2px solid var(--cyan);border-radius:50% 50% 46% 46%;position:relative}.brand-mark:after{content:"";position:absolute;left:11px;top:3px;width:2px;height:16px;background:var(--cyan)}h1{font-size:clamp(3rem,7vw,6rem);line-height:.94;letter-spacing:-.04em;margin:0;max-width:12ch}h2{font-size:clamp(1.65rem,3vw,2.6rem);line-height:1.05;letter-spacing:-.035em;margin:0}.lead{color:#bfd0cd;font-size:1.05rem;line-height:1.7;max-width:62ch}.start-shell{min-height:100vh;padding:34px clamp(24px,5vw,76px);display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.75fr);grid-template-rows:auto 1fr auto auto;gap:28px 7vw}.brand{grid-column:1/-1}.start-copy{align-self:center}.session-selector{align-self:center;background:#0b1719;padding:26px;border-radius:var(--radius);box-shadow:var(--shadow);display:grid;gap:14px}.session-selector label{color:var(--muted);font-size:.75rem;font-weight:800;letter-spacing:.1em}.session-selector select{appearance:none;background:#122326;color:var(--ink);border:1px solid #294044;border-radius:10px;padding:15px;outline:none}.primary{border:0;border-radius:12px;background:var(--cyan);color:#06211e;padding:16px 20px;font-weight:800;cursor:pointer;transition:transform .2s ease-out,box-shadow .2s ease-out}.primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 25px rgba(96,230,209,.2)}.primary:focus-visible,.quiet:focus-visible,.icon-button:focus-visible,.option:focus-visible,.xray-stage:focus-visible,select:focus-visible{outline:3px solid var(--amber);outline-offset:3px}.primary span{display:block;font-weight:600;font-size:.72rem;opacity:.7;margin-top:3px}.primary:disabled{opacity:.35;cursor:not-allowed}.quiet{background:transparent;color:var(--muted);border:0;padding:8px;cursor:pointer}.learning-promise{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.learning-promise div{padding:24px 26px}.learning-promise div+div{border-left:1px solid var(--line)}.learning-promise strong,.learning-promise span{display:block}.learning-promise span{color:var(--muted);font-size:.85rem;margin-top:5px}.disclaimer{color:#718986;font-size:.72rem;grid-column:1/-1;margin:0}.game-shell{min-height:100vh;padding:20px clamp(16px,3vw,44px)}.game-header{height:52px;display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:20px;max-width:1500px;margin:auto}.icon-button{border:0;background:transparent;color:var(--muted);font-size:2rem;cursor:pointer}.progress-track{height:8px;border-radius:8px;background:#152527;overflow:hidden}.progress-track span{display:block;height:100%;width:0;background:var(--cyan);transition:width .45s cubic-bezier(.16,1,.3,1)}.score{display:flex;gap:14px;align-items:center;font-size:.78rem}.score span{color:var(--amber);font-weight:800}.case-grid{max-width:1500px;margin:18px auto 0;display:grid;grid-template-columns:minmax(420px,1.35fr) minmax(340px,.65fr);min-height:calc(100vh - 110px);border-top:1px solid var(--line)}.viewer-wrap{padding:24px 4vw 28px 0;border-right:1px solid var(--line);display:flex;flex-direction:column}.case-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:.7rem;font-weight:800;letter-spacing:.1em;margin-bottom:14px}.xray-stage{position:relative;flex:1;min-height:420px;border:0;border-radius:var(--radius);background:#020405;overflow:hidden;cursor:zoom-in;box-shadow:var(--shadow);padding:0}.xray-stage img{display:block;width:100%;height:100%;max-height:72vh;object-fit:contain;filter:contrast(1.04);transition:transform .5s cubic-bezier(.16,1,.3,1)}.xray-stage:hover img{transform:scale(1.02)}.inspect-hint{position:absolute;right:14px;bottom:14px;padding:8px 11px;background:rgba(4,12,13,.82);color:#c6d7d4;border-radius:8px;font-size:.68rem;font-weight:700}.viewer-tools{display:flex;justify-content:center;gap:24px;margin-top:14px;color:var(--muted);font-size:.7rem;letter-spacing:.12em}.answer-panel{padding:clamp(28px,5vw,72px) 0 28px clamp(28px,4vw,58px);display:flex;align-items:center}.answer-panel>div{width:100%}.instruction{color:var(--muted);line-height:1.5;margin:14px 0 22px}.options{display:grid;gap:10px;margin-bottom:18px}.option{position:relative;width:100%;padding:15px 15px 15px 54px;text-align:left;border:1px solid var(--line);border-radius:12px;background:#0b1719;color:var(--ink);cursor:pointer;transition:border-color .18s,background .18s,transform .18s}.option:hover{border-color:#446467;transform:translateX(3px)}.option[aria-checked=true]{border-color:var(--cyan);background:#102927}.option kbd{position:absolute;left:15px;top:13px;display:grid;place-items:center;width:27px;height:27px;border:1px solid #395154;border-radius:7px;color:var(--muted);font-family:inherit}.answer-panel .primary{width:100%}.feedback-icon{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-size:1.8rem;font-weight:800;margin-bottom:24px}.feedback.correct .feedback-icon{background:rgba(98,226,183,.14);color:var(--success)}.feedback.wrong .feedback-icon{background:rgba(255,130,119,.14);color:var(--coral)}.feedback.correct .signal{color:var(--success)}.feedback.wrong .signal{color:var(--coral)}.clue{font-size:1.05rem;line-height:1.65;color:#c8d8d5}.compare{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;margin:24px 0}.compare span{color:var(--muted);font-size:.68rem;font-weight:800;letter-spacing:.13em}.compare p{margin:7px 0 0;line-height:1.5;color:#b5c7c4}dialog{width:min(96vw,1200px);height:min(94vh,900px);padding:0;border:1px solid var(--line);border-radius:var(--radius);background:#020405;box-shadow:var(--shadow)}dialog::backdrop{background:rgba(0,0,0,.86)}dialog img{width:100%;height:100%;object-fit:contain}dialog button{position:absolute;right:14px;top:14px;width:42px;height:42px;border:0;border-radius:50%;background:#152527;color:white;font-size:1.5rem;cursor:pointer}.result-shell{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:32px}.result-shell h1{max-width:11ch}.result-mark{width:82px;height:82px;border-radius:50%;display:grid;place-items:center;background:rgba(96,230,209,.12);color:var(--cyan);font-size:2.5rem;margin-bottom:26px}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:36px 0;width:min(680px,100%);border-block:1px solid var(--line)}.result-stats div{padding:22px}.result-stats div+div{border-left:1px solid var(--line)}.result-stats strong,.result-stats span{display:block}.result-stats strong{font-size:2rem;color:var(--cyan)}.result-stats span{color:var(--muted);font-size:.75rem}.next-focus{margin-bottom:28px;max-width:520px}.next-focus span,.next-focus strong{display:block}.next-focus span{color:var(--amber);font-size:.68rem;font-weight:800;letter-spacing:.13em;margin-bottom:8px}.result-shell .primary{min-width:260px}#celebration{pointer-events:none;position:fixed;inset:0;z-index:20}.spark{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--cyan);animation:spark .9s cubic-bezier(.16,1,.3,1) forwards}@keyframes spark{from{transform:translate(50vw,55vh) scale(1);opacity:1}to{transform:translate(var(--x),var(--y)) scale(0);opacity:0}}
@media(max-width:850px){.start-shell{grid-template-columns:1fr;grid-template-rows:auto auto auto auto auto;padding:24px}.brand{grid-column:auto}.learning-promise{grid-column:auto;grid-template-columns:1fr}.learning-promise div+div{border-left:0;border-top:1px solid var(--line)}.disclaimer{grid-column:auto}.case-grid{grid-template-columns:1fr}.viewer-wrap{border-right:0;padding:16px 0;border-bottom:1px solid var(--line)}.xray-stage{min-height:42vh}.answer-panel{padding:28px 0}.score span{display:none}}
@media(max-width:520px){h1{font-size:3.1rem}.game-header{gap:10px}.xray-stage{min-height:38vh}.result-stats strong{font-size:1.35rem}.result-stats div{padding:16px 6px}.viewer-tools{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.spark{display:none}}
.credits{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.78rem}.credits strong{color:var(--cyan);letter-spacing:.18em}.credits span{border-left:1px solid var(--line);padding-left:12px}.timer-toggle{display:flex;align-items:center;gap:10px!important;color:#bfd0cd!important;font-size:.85rem!important;letter-spacing:0!important;cursor:pointer}.timer-toggle input{accent-color:var(--cyan);width:18px;height:18px}.confidence{display:flex;align-items:center;gap:7px;margin:-6px 0 18px}.confidence span{color:var(--muted);font-size:.72rem;margin-right:4px}.confidence button{border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);padding:6px 10px;font-size:.7rem;cursor:pointer}.confidence button.active{border-color:var(--cyan);background:var(--cyan-dark);color:var(--ink)}#fireworks{position:fixed;inset:0;width:100vw;height:100vh;z-index:50;pointer-events:none;opacity:0;transition:opacity .15s ease-out}#fireworks.active{opacity:1}.score #timer{color:var(--cyan);font-variant-numeric:tabular-nums}.start-shell>.credits{grid-column:1/-1;justify-self:start}.result-shell>.credits{margin:25px 0 12px}@media(max-width:850px){.start-shell>.credits{grid-column:auto}.confidence{flex-wrap:wrap}}
.sound-button{border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);padding:6px 10px;font-size:.68rem;cursor:pointer}.sound-button[aria-pressed=true]{color:var(--coral)}.sound-button:focus-visible{outline:3px solid var(--amber);outline-offset:2px}@media(max-width:520px){.sound-button{padding:5px 8px}.score{gap:8px}}
.clinical-stage{flex:1;min-height:420px;border:1px solid var(--line);border-radius:var(--radius);background:radial-gradient(circle at 12% 8%,rgba(96,230,209,.12),transparent 30%),#0b1719;padding:clamp(28px,5vw,68px);display:flex;flex-direction:column;justify-content:center;box-shadow:var(--shadow)}.clinical-stage h2{font-size:clamp(1.7rem,3.2vw,3rem);line-height:1.2;max-width:22ch}.clinical-stage a{color:var(--cyan);margin-top:28px;font-size:.85rem;text-underline-offset:4px}@media(max-width:850px){.clinical-stage{min-height:42vh}}