:root{--bg:#172238;--panel:#1f304f;--panel2:#2b446d;--text:#f8fbff;--muted:#afbbce;--gold:#ffd166;--pink:#7fd5ff;--mint:#89f0b7;--line:rgba(255,255,255,.12)}
.hero-icons span{font-size:38px}
.status-row{margin:0 0 12px;display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:14px;font-weight:800}
.status-row strong{color:var(--gold)}
.scene-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.scene-card{padding:10px;border:1px solid var(--line);border-radius:20px;background:rgba(31,48,79,.86);box-shadow:0 18px 50px rgba(0,0,0,.16)}
.scene-card>span{display:block;margin:0 0 8px;color:var(--muted);font-size:13px;font-weight:800}
.scene-wrap{position:relative;overflow:hidden;border-radius:15px;background:#d9f2ff;aspect-ratio:4/3}
.scene-wrap svg{display:block;width:100%;height:100%}
.diff-hit{position:absolute;border:2px solid transparent;border-radius:50%;transform:translate(-50%,-50%);background:transparent;cursor:pointer}
.diff-hit:hover{border-color:transparent;background:transparent}
.diff-hit.found{border-color:var(--mint);background:rgba(137,240,183,.25);box-shadow:0 0 0 4px rgba(137,240,183,.12);pointer-events:none}
.mark{position:absolute;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;color:#172238;background:var(--mint);font-size:16px;font-weight:800;transform:translate(-50%,-50%);pointer-events:none}
.target-scene.miss{animation:shake .28s ease}
@keyframes shake{25%{transform:translateX(-4px)}50%{transform:translateX(4px)}75%{transform:translateX(-2px)}}
@media(max-width:720px){.scene-pair{grid-template-columns:1fr}.scene-card{padding:9px}.scene-wrap{aspect-ratio:16/11}}