:root{color-scheme:dark;--bg:#181420;--panel:#241e31;--line:#4e405e;--ink:#f6eddf;--muted:#bcaec8;--gold:#edc77f;--purple:#b9a1e8}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 75% 0,#3a2947,transparent 55%),var(--bg);color:var(--ink);font:15px/1.55 system-ui,sans-serif}button,select{font:inherit}button{border:1px solid var(--line);background:#30273d;color:var(--ink);border-radius:10px;padding:10px 15px;cursor:pointer;transition:background .15s,transform .15s}button:hover:not(:disabled){background:#4b3c5b;transform:translateY(-1px)}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:3px}button:disabled{opacity:.5;cursor:default}header{max-width:1280px;margin:auto;padding:24px 30px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}a{color:var(--gold)}.wordmark{font-size:18px;letter-spacing:3px;text-decoration:none;color:var(--ink)}.wordmark span{display:block;font-size:9px;letter-spacing:4px;margin-left:27px}main{max-width:1240px;margin:auto;padding:25px 24px}.intro{margin:12px 0 26px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--gold);margin:0 0 8px}h1{font:48px/1.04 Georgia,serif;margin:10px 0 14px;letter-spacing:-1px}h1 em{font-weight:normal;color:var(--gold)}h2{font:25px/1.15 Georgia,serif;margin:0 0 12px}p{margin:8px 0 16px}.intro>p:last-child{color:var(--muted)}#cases{display:flex;gap:8px;margin-bottom:20px}#cases button{flex:1;text-align:left}#cases button.active{border-color:var(--gold);background:#423445}#cases small{display:block;color:var(--muted);font-size:11px}.layout{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(290px,1fr);gap:20px}.workbench,.notebook,.accuse{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:22px}.casehead{display:flex;justify-content:space-between;gap:15px;align-items:center}#turns{color:var(--gold);font-size:12px;white-space:nowrap}#story{font-size:13px;color:var(--muted)}.stage{height:310px;position:relative;overflow:hidden;border-radius:12px;background:#30243f}.stage>img{width:100%;height:100%;object-fit:cover}.stage:after{content:'';position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#110d1ae6);pointer-events:none}.pan{position:absolute;z-index:2;top:49%;width:34%;min-height:58px;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:4px;border-bottom:3px solid #f3cd84;background:#201726bf;border-radius:50%;padding:9px;transition:transform .6s}.pan.left{left:12%}.pan.right{right:12%}.pan span{font-size:12px;display:grid;place-items:center;background:#b7a0dc;border:1px solid #f8e1ff;color:#201529;border-radius:50%;width:23px;height:23px;font-weight:bold}.pan .empty{background:transparent;border:0;color:#edd6ba;width:auto}.result{position:absolute;bottom:12px;left:12px;right:12px;z-index:3;text-align:center;font-size:13px;font-weight:650;text-shadow:0 1px 3px #000}.tools{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0}.primary{background:var(--gold);color:#271d30;border-color:var(--gold);font-weight:700}.primary:hover:not(:disabled){background:#ffe1a5}kbd{font:10px system-ui;border:1px solid #907344;border-radius:3px;padding:1px 4px;margin-left:5px}.micro{font-size:11px;color:var(--muted)}.destinations{display:flex;gap:6px;margin:10px 0 15px}.destinations button{flex:1;padding:8px;font-size:12px}.destinations [aria-pressed=true]{border-color:var(--purple);background:#534268}.sweets{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.sweet{min-width:0;display:flex;flex-direction:column;align-items:center;padding:8px 4px;background:#2e2639;position:relative}.sweet .bonbon{width:40px;height:32px;margin:8px 0 5px;background:radial-gradient(ellipse at 30% 25%,#f5e3ff,#b490cf 35%,#6b497e 85%);border:1px solid #d5b4ed;border-radius:45%;box-shadow:0 4px 7px #0005;position:relative}.bonbon:before,.bonbon:after{content:'';position:absolute;top:6px;width:12px;height:18px;background:#b695ce;border-radius:2px}.bonbon:before{left:-10px;clip-path:polygon(0 0,100% 35%,100% 65%,0 100%,25% 50%)}.bonbon:after{right:-10px;clip-path:polygon(100% 0,0 35%,0 65%,100% 100%,75% 50%)}.sweet small{font-size:10px;color:var(--muted)}.sweet[data-pan="-1"]{border-color:var(--gold)}.sweet[data-pan="1"]{border-color:var(--purple)}.sweet.proven{opacity:.42}.notebook{margin-bottom:16px}.check{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);margin-bottom:14px}.check input{accent-color:var(--gold)}#suspects{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:15px}.chip{border:1px solid var(--line);border-radius:6px;font-size:11px;padding:3px 6px;color:var(--purple)}.entry{font-size:12px;padding:12px 0;border-top:1px solid var(--line)}.entry b{color:var(--gold)}.entry small{display:block;color:var(--muted)}.fields{display:flex;gap:10px;margin:15px 0}.fields label{flex:1;font-size:11px;color:var(--muted)}select{width:100%;padding:9px;border:1px solid var(--line);border-radius:8px;background:#181420;color:var(--ink);display:block;margin-top:4px}.accuse>.primary{width:100%}.accuse>button:not(.primary){font-size:11px;padding:8px}#verdict{font-size:13px;color:var(--gold)}footer{text-align:center;color:var(--muted);font-size:11px;padding:28px 0}dialog{max-width:570px;width:calc(100% - 30px);max-height:85vh;overflow:auto;background:var(--panel);color:var(--ink);border:1px solid var(--gold);border-radius:18px;padding:30px;box-shadow:0 20px 100px #0009}dialog::backdrop{background:#100b1acb;backdrop-filter:blur(5px)}dialog li{margin:10px 0}.close{float:right;padding:2px 9px;font-size:23px}@media(max-width:760px){header{padding:18px}.wordmark{font-size:14px;letter-spacing:2px}main{padding:20px 14px}.intro{margin-top:0}h1{font-size:39px}.layout{grid-template-columns:1fr}.workbench,.notebook,.accuse{padding:16px}#cases button{padding:10px 8px;font-size:12px}.stage{height:265px}.sweets{gap:8px}.sweet .bonbon{width:32px;height:27px}.tools button{font-size:12px;padding:10px}.casehead h2{font-size:23px}.casehead{align-items:flex-start}#turns{font-size:11px}.destinations button{font-size:11px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
#levels{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:0 0 20px}#levels button{text-align:left;font-size:12px;padding:10px}#levels button.active{border-color:var(--gold);background:#493647}#levels small{display:block;font-size:10px;color:var(--muted)}.stage{height:370px}.stage>img{opacity:.65}.stage:after{display:none}.strips{position:absolute;inset:18px 14%;display:flex;gap:22px}.strip{position:relative;flex:1;background:repeating-linear-gradient(to top,#f8ebcded 0,#f8ebcded calc(3.125% - 1px),#a6937620 calc(3.125% - 1px),#a6937650 3.125%);border:1px solid #ffe9b8;border-radius:5px;box-shadow:0 2px 20px #0008}.band,.target{position:absolute;left:7%;width:86%;height:21px;border-radius:10px;transform:translateY(50%)}.band{background:var(--color);box-shadow:0 0 12px var(--color);transition:bottom .45s;color:#161022;text-align:center;line-height:21px;font-weight:bold;font-size:12px}.target{border:2px dashed #45324e;z-index:3;height:29px;pointer-events:none}.target span{position:absolute;right:-19px;top:2px;color:#fff;background:#382b45;padding:0 3px;border-radius:3px;font-size:10px}.strip-label{position:absolute;top:5px;left:0;right:0;text-align:center;color:#4c3554;font-size:11px;font-weight:bold}.coating{position:absolute;left:0;right:0;border-top:2px dotted #68516b;opacity:.55;pointer-events:none}.coating span{font-size:8px;color:#39253a;position:absolute;top:-12px;left:2px}.washes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.washes button{padding:13px 6px}.washes b{display:block;color:var(--gold)}.washes small{display:block;font-size:10px;margin-top:7px;color:var(--muted)}#message{font-size:13px;margin:18px 0;color:var(--gold);min-height:42px}.target-row{display:flex;align-items:center;gap:9px;padding:12px 0;border-bottom:1px solid var(--line)}.dot{width:12px;height:12px;border-radius:50%;background:var(--color)}.target-row strong{margin-left:auto}.legend{font-size:12px;color:var(--muted);margin-top:20px}.recipe{display:inline-block;border:1px solid var(--line);padding:5px 8px;margin:3px;border-radius:6px;font-size:12px}#advice{min-height:32px}#next{width:100%}@media(max-width:760px){#levels{grid-template-columns:repeat(3,1fr)}.stage{height:330px}.strips{inset:18px 13%;gap:17px}.washes small{font-size:9px}.washes button{font-size:12px}.strip-label{font-size:10px}}