:root{--paper:#e8e2d4;--paper-dark:#d4ccb8;--ink:#1a1714;--ink-soft:#43392f;--blood:#8b1a1a;--blood-bright:#b52424;--tape:#d9b310;--tape-dark:#b8950c;--card:#f2ede0;--shadow:rgba(20,15,10,.4);--green:#3a6b35}*{box-sizing:border-box;margin:0;padding:0}html,body{background:#15120e;color:var(--ink);font-family:Crimson Pro,Georgia,serif}body{min-height:100vh;background:radial-gradient(circle at 20% 10%,rgba(139,26,26,.06),transparent 40%),radial-gradient(circle at 80% 90%,rgba(217,179,16,.05),transparent 40%),#15120e;display:flex;justify-content:center;padding:0}.app{width:100%;max-width:560px;min-height:100vh;background:var(--paper);background-image:repeating-linear-gradient(0deg,transparent,transparent 26px,rgba(67,57,47,.05) 27px),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E");position:relative;box-shadow:0 0 60px #0009;overflow:hidden}.tape{background:repeating-linear-gradient(45deg,var(--tape),var(--tape) 18px,var(--tape-dark) 18px,var(--tape-dark) 36px);color:var(--ink);font-family:JetBrains Mono,monospace;font-weight:700;text-align:center;letter-spacing:.35em;font-size:13px;padding:7px 0;text-transform:uppercase;border-top:2px solid rgba(0,0,0,.25);border-bottom:2px solid rgba(0,0,0,.25);text-shadow:0 1px 0 rgba(255,255,255,.25);box-shadow:0 3px 10px #00000047;position:relative;z-index:2}@media(max-width:480px){.tape{font-size:10px;letter-spacing:.18em}}header.brand{text-align:center;padding:26px 24px 10px}header.brand h1{font-family:Special Elite,monospace;font-size:34px;letter-spacing:.06em;color:var(--ink);line-height:1;text-shadow:0 1px 0 rgba(255,255,255,.35),0 -1px 0 rgba(0,0,0,.12)}header.brand h1 .det{color:var(--blood)}header.brand .meta{font-family:JetBrains Mono,monospace;font-size:11px;letter-spacing:.2em;color:var(--ink-soft);margin-top:8px;text-transform:uppercase}.divider{height:1px;background:linear-gradient(90deg,transparent,var(--ink-soft),transparent);margin:14px 24px;opacity:.4}.stage{padding:6px 24px 40px}.filecard{background:var(--card);border:1px solid rgba(67,57,47,.25);box-shadow:4px 6px 0 var(--shadow);padding:22px 22px 24px;margin-bottom:22px;position:relative}.stamp{position:absolute;top:14px;right:14px;font-family:JetBrains Mono,monospace;font-weight:700;font-size:11px;color:var(--blood);border:2px solid var(--blood);border-radius:4px;padding:4px 8px;transform:rotate(8deg);opacity:.7;letter-spacing:.1em}.casenum{font-family:JetBrains Mono,monospace;font-size:12px;color:var(--blood);letter-spacing:.2em;font-weight:700}.filecard h2{font-family:Special Elite,monospace;font-size:23px;margin:6px 0 4px;line-height:1.15}.filecard .cat{font-family:JetBrains Mono,monospace;font-size:11px;color:var(--ink-soft);letter-spacing:.15em;text-transform:uppercase;margin-bottom:14px}.filecard p{font-size:18px;line-height:1.55;color:var(--ink-soft)}.filecard p+p{margin-top:10px}.section-label{font-family:JetBrains Mono,monospace;font-size:12px;letter-spacing:.25em;text-transform:uppercase;color:var(--ink);font-weight:700;margin:8px 0 14px;display:flex;align-items:center;gap:10px}.section-label:after{content:"";flex:1;height:2px;background:var(--ink);opacity:.2}.suspects{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:24px}.suspect{background:var(--card);border:1px solid rgba(67,57,47,.25);padding:14px;cursor:pointer;transition:.18s;position:relative;box-shadow:2px 3px 0 var(--shadow)}.suspects .suspect:nth-child(odd){rotate:-.5deg}.suspects .suspect:nth-child(2n){rotate:.5deg}.suspect:hover{transform:translate(-1px,-2px);rotate:0deg;box-shadow:3px 5px 0 var(--shadow)}.suspect.sel{rotate:0deg}.suspect.sel{border-color:var(--blood);background:#f6e9e3;box-shadow:2px 3px 0 var(--blood)}.suspect .ava{width:46px;height:46px;border-radius:50%;background:var(--ink);color:var(--paper);display:flex;align-items:center;justify-content:center;font-family:Special Elite,monospace;font-size:20px;margin-bottom:8px}.suspect h3{font-family:Crimson Pro;font-size:17px;font-weight:700;line-height:1.1}.suspect .role{font-family:JetBrains Mono,monospace;font-size:10px;color:var(--ink-soft);letter-spacing:.08em;text-transform:uppercase;margin-top:2px}.suspect .check{position:absolute;top:8px;right:10px;color:var(--blood);font-weight:700;font-size:18px;opacity:0;transition:.15s}.suspect.sel .check{opacity:1}.evidence{margin-bottom:8px;counter-reset:exhibit}.clue{counter-increment:exhibit}.clue .ctitle span:before{content:"Beweis " counter(exhibit,upper-alpha) " · ";color:var(--blood);font-weight:700}.clue{background:var(--card);border:1px solid rgba(67,57,47,.25);margin-bottom:12px;box-shadow:2px 3px 0 var(--shadow);overflow:hidden}.clue .clue-head{display:flex;align-items:center;gap:12px;padding:14px 16px;cursor:pointer;transition:.15s;user-select:none}.clue .clue-head:hover{background:#43392f0a}.clue .ico{width:34px;height:34px;flex:none;border-radius:5px;background:var(--ink);color:var(--tape);display:flex;align-items:center;justify-content:center;font-size:17px}.clue .ctitle{flex:1}.clue .ctitle strong{font-family:Crimson Pro;font-size:17px;font-weight:700;display:block}.clue .ctitle span{font-family:JetBrains Mono,monospace;font-size:10px;color:var(--ink-soft);letter-spacing:.1em;text-transform:uppercase}.clue .lock{font-family:JetBrains Mono,monospace;font-size:11px;color:var(--blood);font-weight:700;letter-spacing:.1em}.clue.open .lock{color:var(--green)}.clue-body{display:grid;grid-template-rows:0fr;overflow:hidden;transition:grid-template-rows .38s ease,border-color .38s ease;border-top:1px solid transparent}.clue.open .clue-body{grid-template-rows:1fr;border-top:1px dashed rgba(67,57,47,.3)}.clue-body .inner{min-height:0;overflow:hidden;padding:0 16px;transition:padding .38s ease;font-size:17px;line-height:1.55;color:var(--ink-soft)}.clue.open .clue-body .inner{padding:16px}.clue-body .inner em{color:var(--ink);font-style:italic}.transcript{font-family:JetBrains Mono,monospace;font-size:13px;line-height:1.7;background:#1a17140a;padding:12px;border-left:3px solid var(--ink)}.transcript .q{color:var(--ink);font-weight:700}.btn{width:100%;background:var(--blood);color:var(--paper);border:none;font-family:JetBrains Mono,monospace;font-weight:700;font-size:14px;letter-spacing:.15em;text-transform:uppercase;padding:18px;cursor:pointer;transition:.15s;box-shadow:3px 4px 0 var(--shadow)}.btn:hover:not(:disabled){background:var(--blood-bright);transform:translate(-1px,-1px);box-shadow:4px 5px 0 var(--shadow)}.btn:active:not(:disabled){transform:translate(1px,1px);box-shadow:1px 2px 0 var(--shadow)}.btn:disabled{background:var(--paper-dark);color:var(--ink-soft);cursor:not-allowed;box-shadow:none}.btn.ghost{background:transparent;color:var(--ink);border:2px solid var(--ink);box-shadow:none;margin-top:12px}.btn.ghost:hover{background:var(--ink);color:var(--paper);transform:none}.hint{font-family:JetBrains Mono,monospace;font-size:11px;color:var(--ink-soft);text-align:center;margin-top:12px;letter-spacing:.05em}.verdict{display:none}.verdict.show{display:block;animation:fade .5s ease}@keyframes fade{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.result-banner{text-align:center;padding:30px 20px;margin-bottom:20px;border:2px solid var(--ink);position:relative}.result-banner.win{background:#e7efe2;border-color:var(--green)}.result-banner.lose{background:#f6e3e3;border-color:var(--blood)}.result-banner .big{font-family:Special Elite,monospace;font-size:30px;line-height:1;display:inline-block;transform:rotate(-1.2deg);letter-spacing:.04em}.result-banner.win .big{color:var(--green)}.result-banner.lose .big{color:var(--blood)}.result-banner .sub{font-family:JetBrains Mono,monospace;font-size:12px;letter-spacing:.15em;margin-top:8px;text-transform:uppercase}.solution{background:var(--card);border:1px solid rgba(67,57,47,.25);padding:20px;box-shadow:2px 3px 0 var(--shadow);margin-bottom:20px}.solution h3{font-family:Special Elite,monospace;font-size:19px;margin-bottom:10px;color:var(--blood)}.solution p{font-size:17px;line-height:1.55;color:var(--ink-soft)}.share{background:var(--ink);color:var(--paper);padding:22px;text-align:center;font-family:JetBrains Mono,monospace;box-shadow:3px 4px 0 var(--shadow);outline:1px dashed rgba(232,226,212,.35);outline-offset:-7px}.share .title{font-size:13px;letter-spacing:.2em;color:var(--tape)}.share .grid{font-size:26px;letter-spacing:.15em;margin:14px 0}.share .line{font-size:12px;color:#e8e2d4b3;letter-spacing:.05em}.countdown{text-align:center;font-family:JetBrains Mono,monospace;font-size:12px;color:var(--ink-soft);margin-top:18px;letter-spacing:.1em}.countdown b{color:var(--blood);font-size:15px;font-variant-numeric:tabular-nums}::selection{background:var(--blood);color:var(--paper)}.adslot{border:1px dashed rgba(67,57,47,.4);background:#43392f0a;text-align:center;padding:18px;font-family:JetBrains Mono,monospace;font-size:10px;letter-spacing:.2em;color:var(--ink-soft);text-transform:uppercase;margin-bottom:22px}footer{text-align:center;padding:22px;font-family:JetBrains Mono,monospace;font-size:10px;color:var(--ink-soft);letter-spacing:.1em;opacity:.6}@media(min-width:900px){.app{max-width:none}header.brand{padding-top:34px}header.brand h1{font-size:42px}.stage{max-width:1280px;margin:0 auto;padding:12px 44px 64px}#game{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1fr);grid-template-areas:"file     evidence" "suspects evidence" "verdict  evidence" "ad       ad";column-gap:30px;align-items:start}.sec-file{grid-area:file}.sec-suspects{grid-area:suspects}.sec-verdict{grid-area:verdict}.sec-evidence{grid-area:evidence}.sec-ad{grid-area:ad}.sec-evidence{padding-left:30px;padding-right:8px;padding-bottom:8px;border-left:1px dashed rgba(67,57,47,.3);position:sticky;top:14px;max-height:calc(100vh - 28px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(67,57,47,.35) transparent}.sec-evidence .evidence{margin-bottom:0}.verdict{max-width:780px;margin:0 auto}}@media(min-width:1500px){.stage{max-width:1380px}}header.brand{position:relative}.theme-toggle{position:absolute;top:4px;right:4px;z-index:6;display:inline-flex;align-items:center;cursor:pointer}.theme-toggle input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.tt-track{position:relative;width:50px;height:24px;border-radius:13px;background:var(--card);border:1.5px solid var(--ink-soft);transition:background-color .25s,border-color .25s}.tt-track:before{content:"☀";position:absolute;left:5px;top:50%;transform:translateY(-50%);font-size:11px;line-height:1;opacity:.75}.tt-track:after{content:"🌙";position:absolute;right:5px;top:50%;transform:translateY(-50%);font-size:10px;line-height:1;opacity:.6}.tt-knob{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:var(--blood);box-shadow:0 1px 2px #00000073;transition:transform .25s;z-index:1}#themeSwitch:checked~.tt-track .tt-knob{transform:translate(26px)}.theme-toggle:focus-within .tt-track{outline:2px solid var(--blood);outline-offset:2px}body,.app,.filecard,.clue,.solution,.adslot,.share,.result-banner,.section-label,.ava,.clue .ico{transition:background-color .25s ease,border-color .25s ease,color .25s ease}html[data-theme=dark]{--paper:#1f1c16;--paper-dark:#2a261e;--ink:#ece6d8;--ink-soft:#b0a690;--blood:#d24b4b;--blood-bright:#e85f5f;--tape:#d9b310;--tape-dark:#b8950c;--card:#272118;--shadow:rgba(0,0,0,.55);--green:#5fa455}html[data-theme=dark] .ava{background:#0e0c08;color:var(--ink)}html[data-theme=dark] .clue .ico{background:#0e0c08}html[data-theme=dark] .share{background:#15120d;color:#ece6d8}html[data-theme=dark] .suspect.sel{background:#3a2420}html[data-theme=dark] .result-banner.win{background:#1d2a1c}html[data-theme=dark] .result-banner.lose{background:#2f1a1a}html[data-theme=dark] .clue-head:hover{background:#ffffff0a}html[data-theme=dark] .transcript{background:#ffffff0d}html[data-theme=dark] .adslot{border-color:#d8ce9e38;background:#ffffff08}html[data-theme=dark] .sec-evidence{border-left-color:#d8ce9e33;scrollbar-color:rgba(216,206,158,.3) transparent}html[data-theme=dark] header.brand h1{text-shadow:0 1px 0 rgba(0,0,0,.6),0 -1px 0 rgba(255,255,255,.06)}html[data-theme=dark] .share{outline-color:#e8e2d440}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
