:root{--ink:#11110f;--paper:#d8cfb5;--cream:#f4e4c1;--rust:#ad5f3b;--gold:#d4a574;--fog:#8b8b80;--line:#4b493f;--green:#617167;--shadow:0 24px 80px #0008}
*{box-sizing:border-box}html{background:var(--ink);scroll-behavior:smooth}body{margin:0;min-height:100vh;color:var(--cream);font-family:Montserrat,sans-serif;background:radial-gradient(circle at 18% 8%,#39352b 0,transparent 32%),linear-gradient(135deg,#11110f,#1d1c18 60%,#090908)}button,a{font:inherit}.grain{position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.16;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}.topbar{position:sticky;top:0;z-index:15;height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,4vw,64px);background:#11110fdd;border-bottom:1px solid #ffffff17;backdrop-filter:blur(14px)}.brand{color:var(--cream);text-decoration:none;font-family:"Cormorant Garamond",serif;font-size:24px;letter-spacing:.14em}.brand span{color:var(--rust)}.case-meta{font-size:11px;letter-spacing:.18em;color:var(--fog)}.case-meta span{color:var(--gold)}.sound-toggle,.text-button{border:0;background:none;color:var(--paper);cursor:pointer;font-size:12px;text-decoration:underline;text-underline-offset:4px}.screen{min-height:calc(100vh - 68px);padding:clamp(34px,7vw,92px) clamp(18px,6vw,96px) 130px;display:flex;flex-direction:column;justify-content:center}.hero{max-width:1180px;margin:auto;width:100%}.eyebrow{font-size:11px;letter-spacing:.22em;color:var(--gold);font-weight:600}.hero h1,.chapter-title,.final-title{font:600 clamp(50px,8vw,112px)/.85 "Cormorant Garamond",serif;margin:.2em 0;color:var(--cream);max-width:1000px}.hero h1 em{font-weight:500;color:var(--rust)}.lede{max-width:720px;font:500 clamp(20px,2.2vw,30px)/1.4 "Cormorant Garamond",serif;color:var(--paper)}.brief{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#ffffff18;margin:48px 0;max-width:800px}.brief div{padding:20px;background:#181713}.brief strong{display:block;font:600 28px "Cormorant Garamond",serif;color:var(--gold)}.brief span{font-size:11px;color:var(--fog);letter-spacing:.08em}.primary,.secondary,.choice{border:1px solid var(--gold);padding:15px 24px;background:var(--gold);color:#171611;cursor:pointer;font-weight:600;transition:.2s}.primary:hover,.primary:focus{background:var(--cream);transform:translateY(-2px)}.secondary{background:transparent;color:var(--cream);border-color:#ffffff55}.chapter-head{max-width:900px;margin-bottom:30px}.chapter-title{font-size:clamp(45px,6vw,84px)}.chapter-copy{max-width:720px;color:var(--paper);line-height:1.7}.progress{height:2px;background:#ffffff20;margin:20px 0 36px}.progress span{display:block;height:100%;background:var(--rust);transition:width .4s}.photo-stage{position:relative;max-width:1150px;box-shadow:var(--shadow);border:1px solid #b6a87955}.photo-stage img{width:100%;display:block;filter:sepia(.15) contrast(1.04)}.hotspot{position:absolute;width:34px;height:34px;border-radius:50%;border:1px solid var(--cream);background:#1118;color:transparent;cursor:pointer;box-shadow:0 0 0 7px #1118,0 0 0 8px #f1ead855;animation:pulse 2s infinite}.hotspot::after{content:"+";color:var(--cream);font-size:22px;position:absolute;inset:3px}.hotspot.found{background:var(--rust);animation:none}@keyframes pulse{50%{box-shadow:0 0 0 14px #d4a57408,0 0 0 1px #f1ead8aa}}.task-note{margin-top:18px;color:var(--fog);font-size:13px}.task-note strong{color:var(--gold)}.continue-row{margin-top:28px}.columns{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(260px,.6fr);gap:28px;align-items:start}.document{background:#d8cfb5;color:#29261f;padding:clamp(24px,4vw,54px);box-shadow:var(--shadow);transform:rotate(-.3deg);font-family:"Cormorant Garamond",serif;font-size:21px;line-height:1.5;position:relative}.document::before{content:"КОПИЯ";position:absolute;right:25px;top:22px;border:2px solid #873f31;color:#873f31;padding:4px 12px;transform:rotate(8deg);opacity:.7;font:600 12px Montserrat}.redacted{background:#1d1c18;color:#1d1c18;padding:0 5px;cursor:pointer;transition:.3s}.redacted.revealed{background:transparent;color:#873f31}.timeline{display:grid;gap:10px}.timeline-card{border:1px solid #ffffff2c;background:#1d1c18;padding:18px;text-align:left;color:var(--cream);cursor:pointer}.timeline-card.selected{border-color:var(--gold);background:#2c291f}.timeline-card strong{display:block;color:var(--gold);margin-bottom:6px}.sequence{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:28px}.frame{min-height:150px;border:1px solid #ffffff28;background:#191814;color:var(--paper);padding:16px;cursor:pointer;text-align:left;position:relative}.frame .num{position:absolute;right:10px;top:8px;font:600 30px "Cormorant Garamond";color:#ffffff1f}.frame.active{outline:2px solid var(--gold)}.frame.placed{background:#293028}.frame small{display:block;margin-top:22px;color:var(--fog)}.audio-console{max-width:980px;border:1px solid #ffffff22;background:#151512;padding:clamp(22px,4vw,46px)}.wave{height:90px;display:flex;align-items:center;gap:3px;margin:28px 0}.wave i{display:block;width:5px;background:var(--rust);height:var(--h);opacity:.75}.motifs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.motif{padding:22px 14px;background:#22211c;border:1px solid #ffffff25;color:var(--cream);cursor:pointer}.motif.playing{border-color:var(--gold);box-shadow:0 0 25px #d4a57422}.motif strong{display:block;color:var(--gold);font:600 24px "Cormorant Garamond"}.interpretations{display:grid;gap:12px;margin-top:24px}.choice{background:transparent;color:var(--cream);text-align:left;border-color:#ffffff28}.choice:hover,.choice.selected{border-color:var(--gold);background:#d4a57414}.case-board{display:grid;grid-template-columns:1fr 1fr;gap:32px}.board-panel{border:1px solid #ffffff24;padding:24px;background:#191814}.board-panel h3{font:600 30px "Cormorant Garamond";margin:0 0 18px}.hypotheses{display:grid;gap:14px}.hypothesis{background:#23221d;border:1px solid #ffffff24;padding:20px;color:var(--cream);cursor:pointer;text-align:left}.hypothesis strong{display:block;color:var(--gold);font:600 22px "Cormorant Garamond"}.hypothesis.chosen{border-color:var(--rust);background:#3a241b}.confidence{display:flex;gap:10px;margin:20px 0}.confidence button{flex:1;padding:12px;background:transparent;color:var(--paper);border:1px solid #ffffff2e;cursor:pointer}.confidence button.selected{border-color:var(--gold);color:var(--gold)}.evidence-drawer{position:fixed;z-index:16;right:20px;bottom:0;width:min(380px,calc(100vw - 40px));transform:translateY(calc(100% - 54px));transition:.35s;background:#1d1c18;border:1px solid #ffffff25;box-shadow:var(--shadow)}.evidence-drawer.open{transform:none}.drawer-handle{width:100%;height:54px;display:flex;justify-content:space-between;align-items:center;background:#25231e;color:var(--cream);border:0;padding:0 18px;cursor:pointer}.drawer-handle strong{color:var(--gold)}.drawer-body{max-height:55vh;overflow:auto;padding:14px}.evidence-list{display:grid;gap:8px;margin-bottom:12px}.evidence-item{padding:11px;border-left:2px solid var(--rust);background:#11110f}.evidence-item strong{font:600 16px "Cormorant Garamond";color:var(--gold)}.evidence-item p{font-size:11px;color:var(--fog);margin:4px 0}.toast{position:fixed;z-index:30;bottom:86px;left:50%;transform:translate(-50%,20px);background:var(--cream);color:#171611;padding:12px 20px;opacity:0;pointer-events:none;transition:.3s}.toast.show{opacity:1;transform:translate(-50%,0)}.modal{position:fixed;z-index:40;inset:0;background:#050505cc;display:grid;place-items:center;padding:20px}.modal[hidden]{display:none}.modal-card{width:min(520px,100%);background:var(--paper);color:#242119;padding:42px;position:relative;box-shadow:var(--shadow)}.modal-card h2{font:600 42px "Cormorant Garamond";margin:.2em 0}.modal-card p{line-height:1.6}.modal-close{position:absolute;right:14px;top:8px;background:none;border:0;font-size:32px;cursor:pointer}.result{max-width:960px}.final-title{font-size:clamp(52px,8vw,104px)}.verdict{border-left:3px solid var(--rust);padding:2px 0 2px 24px;margin:32px 0;font:500 23px/1.5 "Cormorant Garamond";color:var(--paper)}.score{font:600 82px "Cormorant Garamond";color:var(--gold)}.score small{font:500 18px Montserrat;color:var(--fog)}.ending-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#ffffff17;margin:28px 0}.ending-grid div{background:#191814;padding:20px}.ending-grid strong{display:block;color:var(--gold);font-size:24px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
@media(max-width:760px){.case-meta{display:none}.screen{padding-top:38px}.brief,.motifs,.case-board,.columns{grid-template-columns:1fr}.sequence{grid-template-columns:1fr 1fr}.photo-stage{margin-inline:-18px}.hotspot{width:40px;height:40px}.ending-grid{grid-template-columns:1fr}.sound-toggle{font-size:0}.sound-toggle::after{content:"◉";font-size:16px}.document{font-size:18px}.evidence-drawer{right:10px;width:calc(100vw - 20px)}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important;transition:none!important}}
.modal-hint{margin:14px 0 0!important;font:500 11px/1.4 Montserrat,sans-serif;color:#625d50;opacity:.85}.hotspot{z-index:2;touch-action:manipulation}.modal-card{max-height:calc(100vh - 40px);overflow:auto}

.hotspot[data-id="clock"]{left:11%;top:18%}.hotspot[data-id="door"]{left:61%;top:22%}.hotspot[data-id="film"]{left:29%;top:82%}.hotspot[data-id="mirror"]{left:84%;top:48%}.modal{z-index:100}.toast{z-index:110}.evidence-drawer{z-index:30}.frame:disabled{cursor:default;opacity:.82}
.audio-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:24px}.audio-steps span{border-top:2px solid #ffffff24;padding-top:9px;color:var(--fog);font-size:11px}.audio-steps span.active{border-color:var(--gold);color:var(--cream)}.audio-steps span.done{border-color:var(--green);color:var(--green)}.wave i.gap{background:var(--cream);opacity:.25}.wave-marked{background:repeating-linear-gradient(90deg,transparent 0,transparent 24px,#ffffff0d 25px);padding:0 8px}.measure-options{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.tape-compare{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:28px 0}.tape-compare div{border:1px solid #ffffff25;background:#211f1a;padding:22px}.tape-compare strong,.tape-compare span{display:block}.tape-compare strong{color:var(--gold);margin-bottom:16px}.tape-compare span{color:var(--paper);font-size:13px;margin-top:8px}.archive-box{position:relative;background:#b8ac8e;color:#252119;padding:32px;margin:28px 0;box-shadow:inset 0 0 0 8px #8f8368;font-family:"Courier New",monospace}.archive-box .stamp{display:inline-block;border:3px solid #7e3027;color:#7e3027;padding:8px 18px;transform:rotate(-5deg);font-weight:700;letter-spacing:.18em}.archive-box p{border-bottom:1px solid #70664f;padding-bottom:9px}@media(max-width:620px){.audio-steps{grid-template-columns:1fr 1fr}.measure-options,.tape-compare{grid-template-columns:1fr}}
.modal-card:focus{outline:none}.splice-labels{display:flex;justify-content:space-between;margin:0 12.5% 6px;color:var(--rust);font-size:10px;letter-spacing:.12em}.frame-strip{display:grid;grid-template-columns:repeat(24,1fr);gap:2px;margin:0 0 24px}.frame-strip i{height:36px;border:1px solid #ffffff20;background:#282720;position:relative;font-style:normal}.frame-strip i.cut{background:#ad5f3b88;border-color:var(--rust)}.frame-strip i:nth-child(4){border-left:3px solid var(--cream)}.frame-strip i:nth-child(20){border-right:3px solid var(--cream)}.frame-strip span{position:absolute;bottom:3px;left:0;right:0;text-align:center;color:#ffffff80;font-size:8px}@media(max-width:620px){.frame-strip{gap:1px}.frame-strip i{height:30px}.frame-strip span{font-size:6px}.splice-labels{margin-inline:10%}}


/* Логотип теперь ведёт назад — к мероприятию, откуда пришли. */
.brand{display:inline-flex;align-items:center;gap:.4em;transition:color .25s}
.brand:hover{color:var(--gold)}
.brand .back-arrow{font-size:.72em;color:var(--fog);transition:transform .25s}
.brand:hover .back-arrow{transform:translateX(-3px);color:var(--gold)}
.drawer-body .text-button{margin-top:4px}
@media(max-width:420px){.brand{font-size:20px}}

/* Кнопка-ссылка на экране результата: увести человека обратно к мероприятиям. */
.actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:28px}
a.primary{text-decoration:none;display:inline-flex;align-items:center;gap:8px}
