/* Shared UI tokens. Gameplay geometry stays in wide.css. */
.story-clues{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0 0 8px}.story-clues li{padding:5px 8px;border:1px solid #d5e1d9;border-radius:6px;font-size:12px;line-height:1.5;color:#355a49;background:#fff}.follow-up-plan{padding:20px 0;border-bottom:1px solid #dde5df;margin-bottom:22px}.follow-up-plan h2{font-size:21px;margin:0 0 12px}.follow-up-plan h3{font-size:16px;margin:20px 0 8px}.follow-up-plan p{font-size:14px;line-height:1.8;word-break:keep-all}
.inventory-hud{position:absolute;top:14%;right:2%;width:37%;height:6.7cqw;min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:.8cqw;padding:.5cqw 1cqw;border:1px solid #d5e0d8;border-radius:1cqw;background:#ffffffed;text-align:left;color:var(--green);z-index:2}.inventory-label{display:grid;gap:.25cqw;flex-shrink:0}.inventory-label strong{font-size:clamp(11px,1.3cqw,21px);line-height:1.2}.inventory-label>span{display:flex;align-items:center;gap:.4cqw;font-size:clamp(9px,.95cqw,16px);line-height:1.2;color:var(--muted)}.inventory-label .arrow-icon{width:1.1cqw;height:1.1cqw;stroke-width:2}.inventory-slots{display:flex;align-items:center;justify-content:flex-end;gap:1.2cqw;min-width:0}.inventory-slot{display:flex;align-items:center;gap:.25cqw;font-size:clamp(10px,1.1cqw,18px);font-weight:700;white-space:nowrap}.inventory-slot canvas{display:block;width:3.6cqw;height:3.6cqw;min-width:22px;min-height:22px}.inventory-empty{font-size:clamp(10px,1cqw,17px);line-height:1.4;color:var(--muted);word-break:keep-all}.inventory-hud:hover{background:#f3f8f2}.inventory-hud:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
#inventory-dialog{max-width:min(480px,calc(100vw - 32px))}#inventory-dialog>p{margin-bottom:16px}.inventory-detail{padding:15px 0;border-top:1px solid var(--line)}.inventory-detail>div{display:flex;align-items:center;gap:12px}.inventory-detail canvas{width:48px;height:48px;flex-shrink:0;background:var(--surface);border-radius:10px}.inventory-detail h3{margin:0;font-size:18px;line-height:1.4;color:var(--green)}.inventory-detail span{font-size:12px;color:var(--muted)}.inventory-detail p{font-size:14px;line-height:1.6;margin:10px 0 0;color:var(--ink)}.inventory-detail .inventory-first{font-size:12px;color:var(--muted)}#inventory-close{margin-top:10px}.inventory-empty-state{padding:24px 0;text-align:center}
:root{--page:#fff;--ink:#193e32;--green:#174c3c;--muted:#6e7f77;--line:#dde5df;--surface:#f2f6f3;--gold:#c89e45;--radius:14px}
body{background:var(--page);font-weight:400}
.button{border-radius:10px;min-height:50px;font-size:16px;font-weight:700;border-width:1px;transition:background .16s,transform .16s}
.button:active{transform:translateY(1px)}.button.secondary{border-color:var(--line);background:white}
.button:focus-visible,.story-card:focus-visible{outline:3px solid #6b9e88;outline-offset:4px}
.site-header,.is-selecting .site-header{max-width:1200px;min-height:88px;padding:20px 24px;margin:auto}
.wordmark,.is-selecting .wordmark{gap:12px;font-size:16px;letter-spacing:-.5px}.wordmark img,.is-selecting .wordmark img{width:32px;height:32px}
.brand-name{display:flex;flex-direction:column;gap:2px;line-height:1.25}.brand-name>span:last-child{font-size:23px;font-weight:900}
.header-tools{display:flex;align-items:center;gap:15px}.header-tools .text-button{font-size:13px;font-weight:600;min-height:44px;padding:8px 4px}.header-tools .text-button+button{border-left:1px solid var(--line);padding-left:18px}
.shell{max-width:840px;padding:20px 24px 40px}.is-selecting{overflow:auto}.is-selecting .shell{height:auto;min-height:0;max-width:1168px;padding:24px 24px 30px}
.selection-screen{height:auto;gap:0}.selection-heading{text-align:center;margin:0 0 22px}.selection-heading h1{font-size:clamp(28px,3.2vw,42px);font-weight:900;letter-spacing:-1.6px;line-height:1.35}.selection-heading p{font-size:16px;line-height:1.6;font-weight:400;margin-top:9px;word-break:keep-all}
.completion-progress{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 24px;background:none;border:0;border-radius:0;padding:0;margin:0 0 26px;color:var(--green)}
.completion-progress>div.progress-summary{display:flex;align-items:center;gap:20px}.completion-progress strong{font-size:14px;white-space:nowrap}.completion-progress b{color:var(--green);margin-left:6px;font-size:17px;font-variant-numeric:tabular-nums}.completion-progress .progress-message{color:var(--muted);font-size:13px;padding-left:24px;border-left:1px solid var(--line);line-height:1.5}.completion-progress small{flex-basis:100%;text-align:center}.completion-progress .button{width:auto;font-size:13px;min-height:40px;padding:8px 14px}
.progress-marks{display:flex;gap:10px;align-items:center}.progress-marks i{display:block;width:11px;height:11px;border-radius:50%;background:#d9e1dc}.progress-marks i.done{background:var(--gold)}
.selection-deck{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:20px;flex:none;min-height:340px;max-height:none}.story-cards{gap:14px;height:auto;max-height:none;min-height:0;flex:none}
.story-card,.story-card[aria-pressed=true],.story-card.is-complete,.story-card.is-complete[aria-pressed=true]{border:2px solid var(--line);padding:24px 0 0;border-radius:12px;background:#fafcfb;box-shadow:none;gap:3px;outline:none;overflow:hidden;justify-content:flex-start;transition:border-color .16s,background .16s}
.story-card:hover{border-color:#9bb7a8}.story-card[aria-pressed=true]{border-color:var(--green);background:#f4f8f5}.story-card.is-complete{border-color:var(--gold)}.story-card.is-complete[aria-pressed=true]{border-color:var(--gold);outline:2px solid var(--green);outline-offset:3px}
.story-card strong{font-size:27px;line-height:1.3;letter-spacing:-.8px}.student-needs{font-size:14px;color:var(--muted);line-height:1.5}.student-image{display:grid;place-items:center;flex:1;min-height:120px;border-radius:0;margin:5px 0 0;padding:0 8px;overflow:visible}.student-image canvas{display:block;width:100%;height:auto;max-height:225px;object-fit:contain}
.card-status{display:flex;justify-content:center;align-items:center;gap:10px;width:100%;min-height:40px;font-size:13px;font-weight:700}.story-card[aria-pressed=true] .card-status{background:#e5eee8}.story-card.is-complete .card-status{background:#f7f1df}.completion-badge{position:static;padding:0;border:0;background:none;border-radius:0;font-size:13px;line-height:1.4;color:#8b651a}.selection-check{position:static;display:none;width:auto;height:auto;border:0;border-radius:0;background:none;color:var(--green);font-size:13px;line-height:1.4}.story-card[aria-pressed=true] .selection-check{display:inline}.story-card.is-complete[aria-pressed=true] .selection-check{border-left:1px solid #d9cdac;padding-left:10px}
.story-detail{padding:28px 30px;background:var(--surface);border:0;border-radius:14px;justify-content:center;flex:none;gap:0}.story-detail-heading{gap:0}.story-detail h2{font-size:27px;line-height:1.35;letter-spacing:-.8px}.story-detail blockquote{font-size:18px;line-height:1.7;margin:15px 0 20px;font-weight:500;word-break:keep-all}.needs-copy{padding-top:17px;margin:0 0 20px;font-size:12px;line-height:1.5}.needs-copy strong{display:block;font-size:16px;font-weight:700;margin:6px 0 0}.story-detail .button{min-height:52px;font-size:17px;padding:12px;gap:14px}
.story-detail .speed-picker{border-top:1px solid var(--line);padding:16px 0 0;margin:18px 0 0;justify-content:flex-start;gap:20px;font-size:13px}.speed-picker legend{font-weight:500;color:var(--muted);margin-right:10px}.speed-picker label{min-height:28px}.speed-picker input{width:18px;height:18px;accent-color:var(--green)}
.selection-instructions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 16px;padding:17px 20px;margin:22px 0;background:var(--surface);border-radius:10px;font-size:12px;line-height:1.6}.selection-instructions strong{font-size:13px;font-weight:600}.instruction-keys{display:flex;gap:5px}.instruction-keys .arrow-icon{width:25px;height:27px;border:1px solid #c7d6cc;border-radius:5px;padding:5px;background:#fff;stroke-width:2}
.selection-definition{display:flex;align-items:center;gap:16px;padding-top:18px;text-align:left;font-size:11px;line-height:1.7;color:var(--muted)}.selection-definition>strong{white-space:nowrap;color:#4b6559;font-size:11px}.selection-definition>span{flex:1}.selection-definition .inline-button{display:flex;align-items:center;gap:6px;text-decoration:none;white-space:nowrap;padding:8px 0;font-size:12px}.selection-definition .arrow-icon{width:16px;height:16px;stroke-width:2}
/* Results and booth certificate use the same quiet hierarchy. */
.screen-title{font-size:clamp(25px,3vw,34px);font-weight:800;letter-spacing:-1px}.screen-subtitle{font-size:16px;font-weight:400;margin-bottom:28px}.result-screen .completion-progress{justify-content:space-between;border-block:1px solid var(--line);padding:16px 0;margin:0 0 22px;gap:10px 16px}.result-screen .progress-message{border:0;padding:0;flex:1}.result-scene{border-radius:12px;margin-bottom:22px}.support-result{padding:22px 0}.support-result h2{font-size:21px}.support-detail{font-size:16px}.support-people,.support-first{font-size:13px}.support-result canvas{width:56px;height:60px}.support-result details{margin-left:73px}.flow-list strong{font-size:16px}.flow-list p{font-size:13px}.learning-summary{border-radius:12px;padding:22px}.learning-summary h2{font-size:19px}.result-actions{grid-template-columns:1fr 1fr}.result-small,.fine-print{font-size:12px}
.certificate{max-width:650px;margin:6px auto 32px;padding:28px 30px;border:1px solid #dbcb9c;border-radius:18px;background:#fff;box-shadow:none}.certificate-kicker{font-size:12px;margin-bottom:18px;color:var(--muted);font-weight:500}.certificate-seal{height:50px;width:50px;font-size:29px;border-width:2px;margin-bottom:14px;background:var(--green)}.certificate h1{font-size:30px;line-height:1.35}.certificate-lead{font-size:14px;margin:10px 0 20px}.certificate-friends{gap:10px;margin-bottom:20px}.certificate-friends>div{border:0;border-bottom:2px solid var(--gold);border-radius:8px 8px 0 0;background:#f7f9f6;padding:8px 4px}.certificate-friends canvas{max-width:110px}.certificate-friends strong{font-size:18px}.certificate-friends span{font-size:11px;margin:3px 0 7px}.reward-ticket{border:1px dashed #c5a351;border-radius:12px;background:#fcf7e8;padding:18px 12px}.reward-ticket h2{font-size:25px}.reward-ticket p{font-size:14px}.certificate-details{gap:8px 20px;font-size:12px;margin:18px 0}.certificate-actions{gap:8px}.certificate-actions .button{min-height:46px;font-size:14px}.certificate-actions .inline-button{font-size:12px;min-height:38px;font-weight:500}.certificate-note{font-size:11px;margin-top:14px}
dialog{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;max-height:calc(100dvh - 32px);overflow:auto}dialog::backdrop{background:#142e2466;backdrop-filter:blur(3px)}dialog h2,#receipt-dialog h2{font-size:23px;letter-spacing:-.7px}dialog p{font-size:14px;line-height:1.75}dialog .speed-picker{margin:8px 0 24px}.rotate-screen{background:#fff}
/* Same controls and scene positions; fewer heavy outlines. */
.student-hud,.game-tools{background:#ffffffed;border-color:#d6e1d9;border-radius:1.1cqw}.is-playing .student-hud p{font-weight:500}.is-playing .hud-button{font-weight:600}.is-playing .path-rail{background:#fffffff0;border-radius:.8cqw}.is-playing .choice-panel{background:#fffffff5;border-color:#d5e0d8;box-shadow:0 4px 18px #193e3212;border-radius:1.3cqw}.is-playing .choice-button{background:#f5f8f5;border-color:#e0e8e1}.is-playing .item-picture{background:#eaf1eb}.is-playing .choice-panel.is-running{background:#ffffffdf;box-shadow:none}.is-playing .control{border:1px solid #ffffff;box-shadow:0 3px 10px #183b3220;border-radius:1.2cqw;font-weight:700}.is-playing .team-strip{background:#ffffffed;border-radius:1cqw}.start-countdown{border-width:2px;box-shadow:0 8px 24px #183b3220}
@media(max-width:900px){.site-header,.is-selecting .site-header{padding:16px 22px;min-height:76px}.is-selecting .shell{padding:18px 22px 28px}.selection-heading h1{font-size:32px}.selection-deck{gap:16px;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);min-height:310px}.story-cards{gap:9px}.story-card strong{font-size:23px}.student-needs{font-size:12px}.story-detail{padding:23px}.story-detail h2{font-size:24px}.story-detail blockquote{font-size:16px}.story-detail .speed-picker{gap:12px}.selection-definition{gap:10px;flex-wrap:wrap}.selection-definition>strong{flex-basis:100%}.selection-instructions{gap:6px 10px}.selection-instructions>span:last-child{font-size:12px}}
@media(max-width:650px){.site-header,.is-selecting .site-header{min-height:70px;padding:14px 18px;gap:8px}.wordmark,.is-selecting .wordmark{font-size:11px;gap:8px}.wordmark img,.is-selecting .wordmark img{width:24px;height:24px}.brand-name>span:last-child{font-size:18px}.header-tools{gap:9px}.header-tools .text-button{font-size:11px;padding:4px 0;min-height:40px}.header-tools .text-button+button{padding-left:9px}.shell,.is-selecting .shell{padding:14px 18px 28px;min-height:0;height:auto}.selection-heading{text-align:left;margin-bottom:17px}.selection-heading h1{font-size:27px;letter-spacing:-1.2px}.selection-heading p{font-size:13px;margin-top:6px;max-width:310px}.completion-progress{justify-content:flex-start;gap:7px 12px;margin-bottom:18px}.completion-progress>div.progress-summary{gap:14px}.completion-progress strong{font-size:12px}.completion-progress b{font-size:15px}.completion-progress .progress-message{border:0;padding:0;font-size:12px;flex-basis:100%}.completion-progress .button{width:auto;min-height:38px;font-size:12px;margin:3px 0}.completion-progress small{text-align:left}.progress-marks{gap:7px}.progress-marks i{width:9px;height:9px}.selection-deck{display:flex;flex-direction:column;gap:18px;min-height:0}.story-cards{height:205px;gap:9px;min-height:0;max-height:none;flex:none}.story-card,.story-card[aria-pressed=true],.story-card.is-complete,.story-card.is-complete[aria-pressed=true]{padding:14px 0 0;border-radius:10px;gap:2px}.story-card strong{font-size:21px}.student-needs{font-size:10px}.student-image{padding:0 3px;margin:0;min-height:0}.student-image canvas{max-height:110px}.card-status{min-height:29px;gap:5px}.completion-badge,.selection-check{font-size:10px}.story-card.is-complete[aria-pressed=true] .selection-check{padding-left:5px}.story-detail{padding:22px;border-radius:12px;flex:none}.story-detail h2{font-size:23px}.story-detail blockquote{font-size:16px;margin:12px 0 16px;line-height:1.65}.needs-copy{font-size:11px;padding-top:13px;margin-bottom:17px}.needs-copy strong{font-size:15px;display:block;margin:5px 0 0}.story-detail .button{min-height:48px;font-size:16px}.story-detail .speed-picker{margin-top:15px;padding-top:12px;gap:20px;font-size:12px}.selection-instructions{margin:18px 0;padding:14px;justify-content:flex-start;gap:7px;font-size:11px}.instruction-keys{display:none}.selection-instructions strong{font-size:12px}.selection-instructions>span:last-child{font-size:11px}.selection-definition{padding-top:14px;gap:5px;font-size:11px;align-items:flex-start}.selection-definition>span{flex-basis:100%}.selection-definition .inline-button{font-size:11px;padding:7px 0}.screen-title{font-size:26px}.screen-subtitle{font-size:14px}.result-screen .completion-progress .button{width:100%}.result-actions{gap:8px}.result-actions .button{font-size:13px}.support-result-head{gap:12px}.support-result h2{font-size:20px}.support-detail{font-size:15px}.support-result details{margin-left:0}.certificate{padding:22px 16px;margin-top:0;border-radius:14px}.certificate h1{font-size:25px}.certificate-kicker{font-size:10px}.certificate-lead{font-size:12px}.certificate-friends{gap:7px;margin-bottom:16px}.certificate-friends canvas{max-width:92px}.certificate-friends strong{font-size:16px}.certificate-friends span{font-size:10px}.reward-ticket{padding:15px 10px}.reward-ticket h2{font-size:23px}.reward-ticket p{font-size:12px}.certificate-details{font-size:11px;gap:5px 12px}.certificate-actions .button{font-size:13px}.certificate-note{font-size:10px}}
@media(max-width:350px){.header-tools{gap:7px}.wordmark,.is-selecting .wordmark{gap:5px;font-size:10px}.brand-name>span:last-child{font-size:16px}.wordmark img,.is-selecting .wordmark img{width:20px;height:20px}.header-tools .text-button{font-size:10px}.shell,.is-selecting .shell{padding-inline:14px}.site-header,.is-selecting .site-header{padding-inline:14px}.selection-heading h1{font-size:24px}.story-cards{height:182px;gap:7px}.story-card strong{font-size:19px}.student-needs{font-size:9px}.story-detail{padding:19px}.completion-badge,.selection-check{font-size:9px}}
@media(orientation:landscape) and (max-height:580px) and (min-width:651px){.site-header,.is-selecting .site-header{padding:10px 20px;min-height:64px}.is-selecting .shell{padding-top:10px}.selection-heading h1{font-size:29px}.selection-heading p{font-size:13px}.selection-deck{min-height:280px}.story-detail{padding:20px}.story-detail h2{font-size:23px}.story-detail blockquote{font-size:15px}.selection-heading{margin-bottom:16px}.completion-progress{margin-bottom:18px}.selection-instructions{margin-top:18px}}
.is-playing .choice-panel.is-running{top:29%}
