/* The Journey shell (journey.js). Puzzle components bring their own css; this is the story frame around them. */
.shell{padding-bottom:110px}header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}header a{color:#26384c;font-weight:800;text-decoration:none}.tag{color:#6b3fc4}
.story-text{font-size:1.1rem;line-height:1.6;color:#26384c;font-family:Georgia,serif}.panel .story-text{color:#26384c}
.hook{font-style:italic;color:#6b3fc4;font-weight:700;font-family:Georgia,serif}
.acts{display:grid;gap:14px;margin-top:10px}.act h2{margin:0 0 6px}.lvlist{display:grid;gap:7px}
.row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:8px 11px;border:2px solid #26384c;border-radius:8px;background:#fffdf5;box-shadow:2px 3px 0 #43515e;cursor:pointer;text-align:left;color:#26384c;width:100%;font:inherit}
.row .n{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#274e76;color:#fff;font-weight:900}.row small{display:block;color:#5d6a76}.row .st{font-size:.85rem;font-weight:800;color:#2f6a1f}
.row:disabled{opacity:.5;cursor:default;box-shadow:none}.row.done .n{background:#65bd4c}.row.case .n{border-radius:6px}
.bar-top{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
.evi{display:grid;gap:8px;margin:10px 0}.evi div{padding:9px 11px;border:2px solid #26384c;border-radius:8px;background:#fff8d8;color:#26384c}.evi b{display:block}.evi.new div{animation:j-pop .5s}
@keyframes j-pop{from{transform:scale(.95);opacity:0}}
.plaza-feedback{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin:10px 0;padding:8px;border:2px dashed #cbbd9c;border-radius:8px;background:#fffdf5}.plaza-feedback .pf-prompt{font-weight:800;color:#274e76}.plaza-feedback button{border:2px solid #26384c;border-radius:999px;background:#f4ecd9;color:#26384c;padding:6px 14px;font-weight:800;cursor:pointer}.plaza-feedback button.on{background:#ffdd52}
.pick{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}.pick button{border:2px solid #26384c;border-radius:999px;background:#fffdf5;color:#26384c;padding:7px 14px;font-weight:800;cursor:pointer}.pick button.on{background:#ffdd52;box-shadow:0 0 0 2px #07549a inset}
.proofs{display:grid;gap:6px;margin:8px 0}.proofs label{display:flex;gap:8px;align-items:flex-start;padding:8px 10px;border:2px solid #cbbd9c;border-radius:8px;background:#fffdf5;color:#26384c;cursor:pointer}.proofs label.on{border-color:#26384c;background:#fff3b0}
.verdict{font-weight:700;color:#8a3d3d;margin:8px 0}.verdict.good{color:#2f6a1f}
.cast{display:grid;gap:10px}.cast .who{padding:10px 12px;border:2px solid #26384c;border-radius:8px;background:#fffdf5;color:#26384c}.cast .who ul{margin:6px 0 0 18px;padding:0}.cast .who li{margin:3px 0}.cast .who small{color:#5d6a76}
.page{margin:12px 0}
@media(prefers-reduced-motion:reduce){.evi.new div{animation:none}}
.art{border:3px solid #26384c;border-radius:8px;overflow:hidden;aspect-ratio:320/150;margin:0 0 12px;background:#8f8a7c}.art svg{display:block;width:100%;height:100%}
.ep{color:#6b3fc4;font-weight:900;letter-spacing:.08em}
.art img{display:block;width:100%;height:100%;object-fit:cover}
.suspect-bar{position:sticky;top:0;z-index:15;display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 -4px 12px;padding:7px 10px;border:2px solid #26384c;border-radius:8px;background:#f4ecd9;box-shadow:0 3px 0 #43515e}
.suspect-bar b{font-size:.7rem;letter-spacing:.1em;color:#6b3fc4;margin-right:2px}.suspect-bar span{padding:2px 9px;border:2px solid #26384c;border-radius:999px;background:#fffdf5;color:#26384c;font-weight:800;font-size:.85rem}

.journey-intro .intro-art{margin:-2px -2px 14px;box-shadow:3px 4px 0 #43515e}
.journey-intro .intro-art img{object-position:center 55%}
@media(max-width:520px){.journey-intro .intro-art{aspect-ratio:16/8.2;margin-bottom:10px}.journey-intro h1{margin-top:3px}}

.quiz-options{display:grid;gap:8px;margin:12px 0}.quiz-opt{text-align:left;padding:10px 12px;border:2px solid #26384c;border-radius:8px;background:#fffdf5;color:#26384c;font:inherit;font-weight:700;cursor:pointer;box-shadow:2px 3px 0 #43515e}.quiz-opt.right{background:#d7ecc8}.quiz-opt.wrong{background:#f1d4d0}.quiz-opt:disabled{cursor:default}
.quiz-feedback{min-height:1.5em;color:#26384c;line-height:1.5}.quiz-feedback .ok{color:#2f6a1f;font-weight:800;margin:4px 0}.quiz-feedback .no{margin:4px 0;color:#26384c}.panel h2{margin-bottom:6px}
.my-notes{width:100%;box-sizing:border-box;padding:10px 12px;border:2px solid #26384c;border-radius:8px;background:#fffdf5;color:#26384c;font:inherit;line-height:1.5;resize:vertical}

/* a darker room: the panels stay paper-coloured on a dark desk */
html[data-theme="sketch"] body.journey,body.journey{background-color:#1b1c21!important;background-image:radial-gradient(ellipse at 50% -10%,#31343d 0,#1b1c21 65%)!important;color:#e8e2d2!important}
.journey header a{color:#e8e2d2}.journey header .tag{color:#b9a2ff}.journey .tester .ghost,.journey header .ghost{background:#2a2c33;color:#e8e2d2;border-color:#8d8a80;box-shadow:2px 3px 0 #0e0f12}
.journey .suspect-bar{box-shadow:0 3px 0 #0e0f12}.journey .shell>.small,.journey .tester{color:#c9c3b3}
