/* Instrument-first acoustic half: Screens 1–4. */
.screen--sound,.screen--system,.screen--resonator,.screen--game{border-top:5px solid var(--acoustic)}
.screen--rule{border-top:5px solid var(--quantum)}
.source-choice [hidden]{display:none!important}

.source-workbench{
  display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr);gap:1rem;align-items:stretch;margin:1.2rem 0;
}
.source-workbench__instrument .echo-box-instrument{margin:0;height:100%}
.source-workbench__instrument .echo-box-instrument__visual{height:100%;min-height:420px}
.source-workbench__instrument .echo-box-instrument__visual img{height:100%;object-fit:cover}
.source-dock{
  align-self:stretch;display:flex;flex-direction:column;justify-content:center;
  padding:1rem;border:1px solid #8d7b69;border-left:5px solid var(--acoustic);border-radius:6px;background:#fbf8f1;
}
.source-dock h3{font-size:1.45rem}
.source-evidence{max-width:860px;margin-left:auto;margin-right:auto}
.source-evidence .visual-frame{min-height:120px}
.source-evidence .signal-svg{min-height:120px}

.process-bench{
  margin:1.2rem 0;padding:1rem;border:1px solid #7c6655;border-radius:6px;
  background:linear-gradient(180deg,#4d372a,#3a2a21);color:#f5eee6;
}
.process-bench__loop{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.5rem;padding:.7rem;
  border:1px solid rgba(255,255,255,.25);font-weight:900;letter-spacing:.04em;font-size:.78rem;
}
.process-bench__loop span{padding:.45rem .55rem;background:rgba(255,255,255,.08);border-radius:3px}
.process-bench .prediction-box{color:var(--ink);background:#f8f3ea}
.process-bench .generation-button{background:#f7f3ea}
.process-bench .generation-button.is-current{background:#cfe2ea}
.process-bench .playback-row{color:#fff}
.evidence-drawer{margin:1rem 0;padding:.8rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}

.instrument-bridge{
  display:grid;grid-template-columns:1fr minmax(250px,.7fr);gap:1rem;align-items:center;
  margin:1.2rem 0 0;padding:1rem;background:#e5ddd1;border:1px solid #8d7b69;border-radius:6px;
}
.instrument-bridge img{display:block;width:100%;height:190px;object-fit:cover;border-radius:4px;border:1px solid #806956}
.instrument-bridge h3{font-size:1.35rem}

.code-reveal{
  margin:1rem 0;padding:1rem;border-left:5px solid var(--acoustic);background:#eaf3f5;border-radius:0 6px 6px 0;
}
.code-reveal h3{font-size:1.35rem}
.coupling-rule{
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin:1rem 0 0;padding:.8rem 1rem;
  border:1px solid #6a5545;background:#3d2d23;color:#fff;border-radius:5px;
}
.coupling-rule span{max-width:760px}

.game-rhythm{
  display:flex;flex-wrap:wrap;gap:.38rem;align-items:center;margin:1.1rem 0;padding:.65rem .75rem;
  border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);font-weight:900;font-size:.78rem;
}
.game-rhythm span:nth-child(odd){padding:.35rem .45rem;background:#e7e0d7}
.game-rhythm .current{background:#cfe4ec;box-shadow:inset 0 -3px var(--acoustic)}
.game-controls{display:flex;flex-wrap:wrap;gap:.7rem;align-items:end;margin-bottom:1rem}
.prediction-key-deck{
  flex:1 1 100%;border:1px solid #8d7b69;border-radius:6px;padding:.8rem;background:#e8ded1;
}
.prediction-key-deck legend{font-weight:950;letter-spacing:.04em;padding:0 .35rem}
.prediction-key-deck>div{display:grid;grid-template-columns:repeat(4,1fr);gap:.55rem}
.predict-key{
  min-height:96px;border:1px solid #5e5045;border-radius:5px;padding:.55rem;background:#f8f4ec;color:var(--ink);
  display:grid;place-items:center;gap:.25rem;font-weight:800;cursor:pointer;
}
.predict-key .steel-paddle{width:70px}
.predict-key small{font-size:.65rem;color:#6b625a}
.predict-key.is-picked{background:#d8eaf1;box-shadow:inset 0 0 0 3px var(--acoustic)}
.game-instrument-bench{display:grid;grid-template-columns:2fr minmax(240px,.75fr);gap:1rem;margin-top:1rem}
.current-fingering,.score-panel{
  border:1px solid #897664;border-radius:6px;background:#efe6da;padding:.8rem;
}
.bench-label{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;margin-bottom:.45rem}
.bench-label span{font-size:.7rem;letter-spacing:.1em;font-weight:900}
.bench-label strong{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.1rem}
.key-state-line{margin:.55rem 0 0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem}
.score-panel{
  background:#fbf4dc;border:2px solid #55483e;display:flex;flex-wrap:wrap;align-content:start;align-items:baseline;gap:.2rem;
}
.score-panel .label,.score-panel p{width:100%}
.score-panel output{font-size:clamp(3rem,8vw,6rem);font-weight:950;line-height:.9;font-variant-numeric:tabular-nums}
.score-panel span{font-weight:900}
.trail-panel{margin:1rem 0;padding:1rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.fingering-trail{
  list-style:none;margin:.8rem 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem;
}
.fingering-trail li{
  display:grid;grid-template-columns:auto 1fr;gap:.25rem .55rem;align-items:center;padding:.55rem;
  border:1px solid #a49382;background:#fbf8f1;border-radius:4px;
}
.fingering-trail .fingering-glyph{grid-column:1/-1;justify-self:stretch}
.trail-index{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.65rem;color:#72675e}
.fingering-trail li>strong{justify-self:end;font-size:1.2rem}
.fingering-trail li>small{grid-column:1/-1;font-size:.58rem;letter-spacing:.09em;text-align:right}
.atlas-game-preview{margin-top:1rem}

.attempt-history{columns:2;padding-left:1.4rem}
.attempt-history li{margin:.3rem 0;break-inside:avoid}
.screen--system .analogy-break{margin-top:1.2rem}
.screen--rule .analogy-break{background:#4e4b86}

@media(max-width:920px){
  .source-workbench,.instrument-bridge,.game-instrument-bench{grid-template-columns:1fr}
  .source-workbench__instrument .echo-box-instrument__visual{min-height:300px}
  .fingering-trail{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:720px){
  .prediction-key-deck>div{grid-template-columns:repeat(2,1fr)}
  .fingering-trail{grid-template-columns:1fr}
}
@media(max-width:520px){
  .game-controls>*{flex:1 1 100%}
  .game-rhythm{font-size:.7rem}
  .fingerprint{gap:1px;padding:.65rem}
  .prediction-key-deck>div{grid-template-columns:1fr 1fr}
  .source-workbench__instrument .echo-box-instrument__visual{min-height:220px}
}
