:root{--ink:#1d2d2d;--deep:#0d3031;--teal:#315f5c;--paper:#f3ead7;--cream:#e8dcc2;--gold:#c49747;--red:#9c4137;--muted:#6a716b}*{box-sizing:border-box}body{margin:0;background:#102e2f;color:var(--ink);font-family:Georgia,serif}button{font:inherit}.top{height:68px;background:var(--paper);border-bottom:4px solid var(--gold);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(16px,4vw,60px)}.brand{font:bold 19px Arial;letter-spacing:.18em}.case{font:11px Arial;letter-spacing:.16em;color:var(--red)}.screen{min-height:calc(100vh - 68px)}.intro{display:grid;grid-template-columns:1.1fr 1fr;background:#102e2f}.hero{position:relative;overflow:hidden;background:#183c3d}.hero>img{width:100%;height:calc(100vh - 68px);object-fit:contain;object-position:center bottom}.intro-copy{background:var(--paper);padding:clamp(35px,6vw,85px);display:flex;flex-direction:column;justify-content:center}.eyebrow{font:bold 11px Arial;letter-spacing:.22em;color:var(--red)}h1{font-size:clamp(42px,6vw,78px);line-height:.95;margin:12px 0 24px}.lead{font-size:18px;line-height:1.7}.primary{border:0;background:var(--red);color:#fff;padding:17px 22px;font:bold 12px Arial;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;box-shadow:4px 4px 0 #642d29}.suspect-preview{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:25px 0}.suspect-preview img{width:100%;aspect-ratio:1;object-fit:cover;border:2px solid #c5b796}.investigate{display:grid;grid-template-columns:285px 1fr}.rail{background:var(--cream);padding:20px}.sage-guide{background:var(--deep);color:#fff;margin:-20px -20px 20px;padding:14px;display:flex;gap:12px;align-items:center}.sage-guide img{width:72px;height:88px;object-fit:contain}.sage-guide b{font:10px Arial;letter-spacing:.18em;color:#e1bb6b}.sage-guide p{font-size:12px;line-height:1.45;margin:6px 0}.rail h2{font:11px Arial;letter-spacing:.17em;text-transform:uppercase}.tray{display:grid;gap:10px}.tray-card{border:1px dashed #998a71;background:#f7efdf;min-height:68px;padding:7px;display:flex;gap:9px;align-items:center;text-align:left}.tray-card img{width:55px;height:52px;object-fit:contain;background:#d9ceb8}.tray-card b,.tray-card small{display:block}.tray-card b{font-size:12px}.tray-card small{font:9px Arial;color:#777;text-transform:uppercase;margin-top:4px}.tray-card.found{border:2px solid var(--gold);cursor:pointer}.main-investigation{padding:25px clamp(16px,4vw,55px)}.progress{display:flex;justify-content:space-between;color:#dce6df;font:10px Arial;letter-spacing:.18em;margin-bottom:15px}.round{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(410px,1.1fr);gap:24px}.search-panel{height:590px;background:#1a4444;position:relative;overflow:hidden}.search-panel>img{width:100%;height:100%;object-fit:cover}.search-info{position:absolute;left:16px;bottom:16px;right:auto;max-width:min(68%, 360px);background:#0d3031e8;color:#fff;padding:14px;border-left:4px solid var(--gold);z-index:2;pointer-events:none;box-shadow:4px 4px 0 #0006}.search-info b,.search-info small{display:block}.search-info small{font:11px Arial;line-height:1.45;margin-top:5px}.fade{display:none}.puzzle{background:var(--paper);padding:clamp(22px,3vw,38px);box-shadow:8px 8px 0 #071b1c}.puzzle>small{font:bold 10px Arial;letter-spacing:.18em;color:var(--red)}.puzzle h2{font-size:clamp(22px,2.2vw,32px);line-height:1.25}.word{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin:30px 0}.word i{width:30px;height:42px;border-bottom:3px solid var(--ink);font:bold 24px Arial;text-align:center;line-height:40px;font-style:normal}.word i.space{border:0;width:12px}.meter-head{display:flex;justify-content:space-between;font:11px Arial;text-transform:uppercase}.meter{height:11px;background:#c9bda5;margin:8px 0}.meter span{display:block;height:100%;background:linear-gradient(90deg,var(--red),var(--gold),#56876f)}.remaining{font:10px Arial;color:#666}.keyboard{display:grid;grid-template-columns:repeat(9,1fr);gap:5px;margin-top:24px}.keyboard button{height:36px;border:1px solid #b5a68d;background:#fff9ec;font:bold 12px Arial;cursor:pointer}.keyboard button.hit{background:#56876f;color:#fff}.keyboard button.miss{text-decoration:line-through;color:#777;background:#bbb3a5}.overlay{position:fixed;inset:0;background:#071c1dcc;display:grid;place-items:center;z-index:10;padding:20px}.pop{background:var(--paper);max-width:500px;width:100%;padding:36px;text-align:center;box-shadow:10px 10px 0 #0006}.pop-img{width:190px;height:155px;object-fit:contain}.stamp{display:inline-block;border:4px double var(--red);color:var(--red);padding:7px 12px;font:bold 15px Arial;letter-spacing:.15em;transform:rotate(-2deg)}.pop p{line-height:1.55}.board{background:var(--cream);padding:35px clamp(15px,5vw,60px)}.board-head{text-align:center;max-width:800px;margin:auto}.board-head h1{font-size:52px}.evidence-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;max-width:1100px;margin:20px auto}.evidence-strip article{background:#f7efdf;border:1px solid #b6a78e;padding:8px;text-align:center}.evidence-strip img{width:100%;height:90px;object-fit:contain}.evidence-strip b{display:block;font-size:11px}.slots{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:900px;margin:25px auto}.slot{min-height:160px;border:2px dashed #8f8068;background:#f7efdf;padding:12px;text-align:center}.slot img{height:95px;max-width:100%;object-fit:contain}.slot b,.slot small{display:block}.slot small{font:9px Arial;letter-spacing:.18em;color:var(--red)}.candidates{max-width:1150px;margin:auto}.candidates h2{font:11px Arial;letter-spacing:.18em;text-transform:uppercase;border-bottom:1px solid #a99a82;padding-bottom:7px}.cards{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.cards.methods{grid-template-columns:repeat(5,1fr)}.cards button{border:1px solid #ab9c83;background:#f8f1e3;padding:7px;cursor:pointer}.cards button.selected{border:3px solid var(--red)}.cards img{width:100%;height:105px;object-fit:contain}.cards.suspects img{object-fit:cover}.cards b,.cards small{display:block}.cards b{font-size:11px}.cards small{font:9px Arial;color:#777;margin-top:3px}.solve{display:block;margin:28px auto}.resolution{background:#123637;display:grid;place-items:center;padding:35px 15px}.report{background:var(--paper);max-width:920px;width:100%;padding:35px;text-align:center}.final-sage{height:220px;max-width:100%;object-fit:contain}.solution{font-size:21px}.score{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid #ae9e84;margin:25px 0}.score div{padding:15px}.score b,.score small{display:block}.score small{font:9px Arial;letter-spacing:.15em}.close{float:right;border:0;background:none;font-size:28px;cursor:pointer}@media(max-width:900px){.intro{grid-template-columns:1fr}.hero{height:48vh}.hero>img{height:100%}.investigate{display:block}.rail{padding:10px}.sage-guide{margin:-10px -10px 10px}.tray{display:flex}.tray-card{flex:1;justify-content:center}.tray-card div{display:none}.main-investigation{padding:15px}.round{grid-template-columns:1fr}.search-panel{height:300px}.cards{grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.search-info{max-width:min(78%,320px);left:12px;bottom:12px}}@media(max-width:600px){.suspect-preview{grid-template-columns:repeat(3,1fr)}.round{display:block}.search-panel{height:220px;margin-bottom:12px}.puzzle{padding:18px}.keyboard{grid-template-columns:repeat(7,1fr)}.word i{width:24px;height:35px;font-size:19px;line-height:33px}.evidence-strip{grid-template-columns:repeat(5,1fr)}.evidence-strip b{display:none}.slots{grid-template-columns:1fr}.cards,.cards.methods{grid-template-columns:repeat(2,1fr)}.board-head h1{font-size:40px}.score{grid-template-columns:1fr}}

.primary.alt{background:#315f5c;box-shadow:4px 4px 0 #173838}
.suspect-preview{grid-template-columns:repeat(6,1fr)}
.suspect-preview img,.cards.suspects img{aspect-ratio:3/4;object-fit:contain;background:#173838;padding:6px}
.search-panel.portrait>img{object-fit:contain;background:#173838}
.cards img{background:#173838;padding:6px;object-fit:contain}
.tray-card img,.evidence-strip img,.slot img,.pop-img{background:#173838;padding:4px}
.five-slots{grid-template-columns:repeat(5,1fr);max-width:1200px}
.five-score{grid-template-columns:repeat(3,1fr)}
.cards.methods{grid-template-columns:repeat(5,1fr)}
.slot{min-height:190px}
.slot div{font-size:11px;color:#555;margin-top:4px}
@media(max-width:1100px){.five-slots{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.five-slots{grid-template-columns:1fr}.suspect-preview{grid-template-columns:repeat(3,1fr)}.cards.methods,.cards,.cards.suspects{grid-template-columns:repeat(2,1fr)}}

.audio-controls{display:flex;align-items:center;gap:10px;margin-left:auto;margin-right:18px;font-family:Arial,sans-serif}.audio-controls button{border:1px solid #b99b63;background:#24332e;color:#fff3d0;border-radius:999px;padding:8px 12px;cursor:pointer}.audio-controls label{display:flex;align-items:center;gap:7px;font-size:.75rem;color:#1d2d2d}.audio-controls input{width:90px;accent-color:#9c4137}@media(max-width:760px){.top{height:auto;min-height:68px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px}.audio-controls{order:3;width:100%;justify-content:center;margin:6px 0}.case{margin-left:auto}}

/* 2026-08-12 layout corrections */
@media (min-width:901px){
  .intro{
    height:calc(100vh - 68px);
    min-height:0;
    overflow:hidden;
    grid-template-columns:minmax(420px,1.05fr) minmax(520px,.95fr);
  }
  .intro .hero,.intro .hero>img{height:100%;min-height:0}
  .intro-copy{
    height:100%;
    min-height:0;
    overflow:hidden;
    padding:clamp(18px,2.4vw,36px) clamp(24px,3.2vw,48px);
  }
  .intro-copy h1{
    font-size:clamp(34px,4vw,56px);
    margin:8px 0 12px;
  }
  .intro-copy .lead{
    font-size:clamp(13px,1.1vw,16px);
    line-height:1.38;
    margin:5px 0;
  }
  .intro-copy .suspect-preview{
    grid-template-columns:repeat(6,1fr);
    gap:8px;
    margin:10px 0 12px;
  }
  .intro-copy .suspect-preview img{
    width:100%;
    height:clamp(92px,12vh,132px);
    aspect-ratio:auto;
    object-fit:contain;
    padding:2px;
  }
  .intro-copy .primary{
    padding:12px 18px;
  }
}

/* Final solving board: deliberate large visual choices; scrolling is allowed here. */
.board{
  padding:38px clamp(18px,4vw,64px) 70px;
}
.board-head{max-width:1050px}
.evidence-strip{
  grid-template-columns:repeat(5,minmax(170px,1fr));
  gap:16px;
  max-width:1400px;
  margin:28px auto 34px;
}
.evidence-strip article{padding:12px}
.evidence-strip img{
  height:180px;
  width:100%;
  object-fit:contain;
}
.evidence-strip b{font-size:14px;margin-top:8px}
.five-slots{
  max-width:1450px;
  gap:16px;
}
.five-slots .slot{
  min-height:260px;
  padding:14px;
}
.five-slots .slot img{
  width:100%;
  height:185px;
  object-fit:contain;
}
.candidates{max-width:1500px}
.candidates h2{font-size:13px;margin-top:34px}
.cards{
  grid-template-columns:repeat(4,minmax(190px,1fr));
  gap:18px;
}
.cards.methods{
  grid-template-columns:repeat(3,minmax(230px,1fr));
  gap:18px;
}
.cards button{
  padding:12px;
}
.cards img{
  height:230px;
  width:100%;
  object-fit:contain;
}
.cards.suspects img{
  height:300px;
  aspect-ratio:auto;
  object-fit:contain;
}
.cards b{font-size:15px;margin-top:8px}
.cards small{font-size:11px;line-height:1.3}

@media(max-width:1100px){
  .evidence-strip{grid-template-columns:repeat(3,1fr)}
  .cards{grid-template-columns:repeat(3,1fr)}
  .cards.methods{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:700px){
  .evidence-strip{grid-template-columns:repeat(2,1fr)}
  .cards,.cards.methods,.cards.suspects{grid-template-columns:1fr}
  .cards img,.cards.suspects img{height:auto;max-height:420px}
}

/* Opening case presentation: victim portrait + story only. Suspects are intentionally not shown here. */
.intro-copy{overflow:hidden}
.victim-story{display:grid;grid-template-columns:minmax(170px,230px) 1fr;gap:22px;align-items:center;min-height:0;margin:10px 0 14px}
.victim-card{margin:0;background:#173838;border:2px solid #c49747;padding:7px;box-shadow:5px 5px 0 #0b2728;align-self:center}
.victim-card img{display:block;width:100%;height:min(43vh,390px);object-fit:contain;background:#173838}
.victim-card figcaption{background:#f3ead7;padding:9px 8px 7px;text-align:center}
.victim-card figcaption b,.victim-card figcaption small{display:block}
.victim-card figcaption b{font-size:16px}
.victim-card figcaption small{font:9px Arial;letter-spacing:.10em;color:#9c4137;margin-top:4px;text-transform:uppercase}
.victim-copy h1{font-size:clamp(34px,4vw,58px);margin:8px 0 14px}
.victim-copy .lead{font-size:clamp(14px,1.15vw,17px);line-height:1.48;margin:0 0 10px}
.investigation-note{font-size:14px!important;color:#4d5852}
@media(min-width:901px){.intro{height:calc(100vh - 68px);min-height:0}.intro-copy{height:calc(100vh - 68px);padding:clamp(22px,3vw,48px);justify-content:center}.hero>img{height:calc(100vh - 68px)}.intro-copy>.primary{flex:0 0 auto}.victim-story{max-height:calc(100vh - 210px)}}
@media(max-width:900px){.victim-story{grid-template-columns:minmax(140px,210px) 1fr}.victim-card img{height:300px}}
@media(max-width:650px){.victim-story{grid-template-columns:1fr}.victim-card{width:min(70vw,260px);margin:0 auto}.victim-card img{height:270px}.intro-copy{overflow:visible}}


/* v8 audited corrections */
.search-panel>img{object-fit:contain;background:#173838}
.search-panel.portrait>img{object-fit:contain}
.missing-evidence .empty-evidence{height:180px;background:#ded3bf;border:2px dashed #aa9a81}
.five-slots .slot{display:flex;flex-direction:column;align-items:center;justify-content:center}
.five-slots .slot small{margin-top:6px}
.boot-error pre{display:none}