/* Landscape runner: screen text stays native HTML, the scene remains pixel art. */
.arrow-icon{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.arrow-icon.up{transform:rotate(-90deg)}.arrow-icon.down{transform:rotate(90deg)}
.site-header{max-width:1360px}.inline-button{border:0;background:none;text-decoration:underline;font-size:inherit;color:var(--green);padding:4px 8px;font-weight:700}.speed-picker{border:0;padding:9px 0 0;margin:0;display:flex;gap:16px;align-items:center;color:var(--green);font-size:14px}.speed-picker legend{float:left;font-weight:800;margin-right:14px}.speed-picker label{display:flex;align-items:center;gap:5px;cursor:pointer;white-space:nowrap}.speed-picker input{accent-color:var(--green);width:19px;height:19px;margin:0}
.is-selecting{overflow:hidden}.is-selecting .shell{max-width:1320px;height:calc(100dvh - 66px);padding:12px 24px 18px}.selection-screen{height:100%;display:flex;flex-direction:column;gap:16px}.selection-heading h1{font-size:clamp(25px,3.4vw,48px);line-height:1.25;letter-spacing:-1.4px;margin:0;color:var(--green)}.selection-heading p{font-size:clamp(14px,1.5vw,21px);margin:5px 0 0;color:var(--muted);font-weight:600}.selection-deck{display:grid;grid-template-columns:1.8fr 1fr;gap:24px;flex:1;min-height:0;max-height:530px}.story-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;min-height:0}.story-card{min-width:0;min-height:0;display:flex;flex-direction:column;padding:8px 8px 14px;gap:3px;border:2px solid var(--line);border-radius:20px;background:var(--page);position:relative;overflow:hidden;text-align:center}.story-card:hover{border-color:#93b5a5}.story-card[aria-pressed=true]{border:3px solid var(--green);padding:7px 7px 13px;background:#e1efe6}.student-image{position:relative;flex:1;min-height:0;width:100%;overflow:hidden;border-radius:12px;margin-bottom:8px}.student-image canvas{width:100%;height:100%;display:block}.story-card strong{font-size:clamp(20px,2.2vw,32px);line-height:1.3;letter-spacing:-.8px}.student-needs{font-size:clamp(13px,1.45vw,20px);color:var(--green);line-height:1.5}.selection-check{display:none;position:absolute;right:6px;top:6px;border:3px solid white;background:var(--green);color:white;width:37px;height:37px;border-radius:50%;font-size:23px;line-height:30px}.story-card[aria-pressed=true] .selection-check{display:block}
.story-detail{border:1.5px solid #bcd7ca;border-radius:22px;padding:22px;display:flex;flex-direction:column;justify-content:center;min-height:0;background:#f6faf7}.story-detail-heading{display:flex;align-items:center;gap:12px}.story-detail-heading canvas{width:55px;height:55px;flex-shrink:0}.story-detail h2{margin:0;font-size:clamp(21px,2.1vw,31px);letter-spacing:-.7px;line-height:1.35}.story-detail blockquote{font-size:clamp(16px,1.65vw,24px);line-height:1.65;word-break:keep-all;margin:18px 0;padding:0}.needs-copy{font-size:13px;border-top:1px solid var(--line);padding-top:14px;margin:0 0 18px;color:var(--muted)}.needs-copy strong{display:block;font-size:clamp(17px,1.7vw,25px);color:var(--green);margin-top:3px}.story-detail .button{font-size:clamp(15px,1.5vw,22px);padding:12px 8px;min-height:52px}.story-detail .speed-picker{justify-content:center;padding-top:16px;gap:12px}.selection-instructions{display:flex;align-items:center;gap:12px;margin:0;color:var(--muted);font-size:13px;line-height:1.5}.selection-instructions canvas{width:48px;height:55px}.selection-instructions strong{font-size:15px;color:var(--green)}.selection-definition{border-top:1px solid var(--line);padding-top:9px;font-size:13px;margin:0;text-align:center;color:var(--muted);word-break:keep-all}
.is-playing{height:100dvh;width:100%;overflow:hidden;overscroll-behavior:none;touch-action:none}.is-playing .site-header{display:none}.is-playing .shell{position:fixed;inset:0;max-width:none;margin:0;padding:0}.game-screen{position:absolute;inset:0;background:#102c25}.game-stage{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);container-type:inline-size;overflow:hidden;isolation:isolate;background:#dbeeea}.game-stage.is-rotated{transform:translate(-50%,-50%) rotate(90deg)}.game-stage .running-scene{position:absolute;inset:0;width:100%;height:100%;border-radius:0;display:block}.top-hud{position:absolute;top:2%;left:1.5%;right:1.5%;display:flex;gap:1.3%;align-items:stretch;pointer-events:none}.student-hud,.game-tools{background:rgba(248,250,247,.94);border:1px solid #c0dacc;border-radius:1.4cqw;display:flex;align-items:center}.student-hud{width:66%;gap:1cqw;padding:.55cqw .9cqw}.student-hud canvas{width:4.5cqw;height:4.5cqw;flex-shrink:0}.student-hud>div{display:flex;align-items:center;gap:1.3cqw;min-width:0}.student-hud strong{font-size:2cqw;white-space:nowrap;line-height:1.2;color:var(--green)}.student-hud p{font-size:1.35cqw;line-height:1.4;margin:0;word-break:keep-all;font-weight:700}.game-tools{flex:1;justify-content:space-evenly;padding:.4cqw;gap:.5cqw;pointer-events:auto}.light-counter{display:flex;align-items:center;gap:.1cqw;font-size:2cqw}.light-counter canvas{width:2.9cqw;height:2.9cqw}.hud-button{display:flex;align-items:center;gap:.4cqw;border:0;background:transparent;padding:.4cqw;font-size:1.3cqw;font-weight:800;color:var(--green);white-space:nowrap;min-height:4cqw}.hud-button svg{width:2cqw;height:2cqw;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.is-playing .path-rail{position:absolute;top:14%;left:2.5%;width:40%;margin:0;pointer-events:none;filter:drop-shadow(0 1px 1px white)}.is-playing .path-rail li{font-size:1.1cqw;padding-top:1.6cqw;color:#1a4d3c}.is-playing .path-rail li::before{width:1cqw;height:1cqw;left:calc(50% - .5cqw);top:0;box-shadow:0 0 0 1px white}.is-playing .path-rail li::after{top:.4cqw;height:.22cqw}.is-playing .path-rail li.active{font-weight:900}
.is-playing .choice-panel{position:absolute;right:2%;top:29%;width:37%;margin:0;padding:1.2cqw;background:rgba(248,250,247,.96);border:1px solid #91b6a3;border-radius:1.5cqw;box-shadow:0 3px 0 rgba(28,65,44,.09)}.is-playing .choice-panel.is-running{top:19%;width:auto;max-width:38%;padding:.7cqw 1.1cqw;border:0;box-shadow:none;background:rgba(248,250,247,.84)}.is-playing .movement-copy{margin:0;font-size:1.25cqw;line-height:1.5;text-align:left;color:var(--green);font-weight:700}.is-playing .choice-heading{font-size:1.8cqw;line-height:1.35;margin:0 0 .8cqw;text-align:left;letter-spacing:-.05cqw}.is-playing .choice-buttons{gap:.7cqw;display:grid}.is-playing .choice-button{min-height:0;padding:.65cqw;gap:.8cqw;border-radius:1cqw;background:#fcfefb;border:1px solid var(--line)}.is-playing .item-picture{border-radius:.8cqw;padding:.3cqw}.is-playing .item-picture canvas{width:4cqw;height:4cqw}.is-playing .choice-copy strong{font-size:1.65cqw;line-height:1.3;letter-spacing:-.04cqw}.is-playing .choice-copy span{font-size:1.15cqw;line-height:1.45;margin-top:.2cqw}.is-playing .choice-arrow .arrow-icon{width:1.9cqw;height:1.9cqw}.is-playing .choice-description{font-size:1cqw;margin:.65cqw 0 0;line-height:1.5;text-align:left}.is-playing .feedback{border:0;padding:0}.is-playing .feedback-heading{gap:.7cqw}.is-playing .feedback-heading canvas{width:4.5cqw;height:4.5cqw;flex-shrink:0}.is-playing .feedback h2{font-size:1.9cqw;line-height:1.35;word-break:keep-all}.is-playing .feedback p{font-size:1.25cqw;line-height:1.65;margin:.7cqw 0;word-break:keep-all}.is-playing .feedback .effect{font-size:1.15cqw;color:var(--green)}.is-playing .feedback .button{font-size:1.5cqw;min-height:4.5cqw;padding:.8cqw;margin-top:1cqw;border-radius:1cqw}.is-playing .feedback .arrow-icon{width:1.8cqw;height:1.8cqw}
.is-playing .controls{position:absolute;left:2%;right:2%;bottom:4%;display:flex;justify-content:space-between;gap:0;margin:0;padding:0;background:none;pointer-events:none}.is-playing .control{pointer-events:auto;width:18.5%;min-height:0;height:6.5cqw;border-radius:1.7cqw;font-size:2.4cqw;gap:.8cqw;border:2px solid #f7fff7;box-shadow:0 0 0 .3cqw #55957b}.is-playing .control.secondary{background:#f6faf4;color:var(--green)}.is-playing .control .arrow-icon{width:2.8cqw;height:2.8cqw}.is-playing .control:disabled{opacity:.55;cursor:default}.is-playing .team-strip{position:absolute;bottom:4.6%;left:24%;right:24%;padding:.6cqw 1cqw;min-height:0;height:5cqw;margin:0;border-radius:3cqw;justify-content:center;background:rgba(248,250,247,.94);gap:.7cqw}.is-playing .team-pictures canvas{width:3.1cqw;height:3.8cqw;margin:0}.is-playing .team-copy{line-height:1.3;text-align:center}.is-playing .team-copy strong{font-size:1cqw}.is-playing .team-copy span,.is-playing .team-empty{font-size:1.15cqw;line-height:1.3;white-space:nowrap}.is-playing .scene-hint{position:absolute;left:25%;right:25%;bottom:16%;margin:0;font-size:1.1cqw;max-width:none;text-align:center;line-height:1.5;padding:.5cqw .8cqw;border-radius:.7cqw}
.rotate-screen{position:fixed;inset:0;background:#f8faf7;display:grid;place-items:center;z-index:20;padding:28px;text-align:center}.rotate-screen>div{max-width:410px}.rotate-screen h2{font-size:27px;line-height:1.4;color:var(--green);word-break:keep-all}.rotate-screen p{font-size:15px;color:var(--muted);word-break:keep-all;margin-bottom:24px}.rotate-screen .inline-button{margin-top:15px}
dialog .speed-picker{margin-bottom:18px;padding-top:0}dialog .speed-picker legend{font-size:14px}.result-actions .arrow-icon{width:23px;height:23px}
/* Minimum readable sizes on a phone while retaining the same scene geometry. */
.student-hud p{font-size:clamp(11px,1.35cqw,23px)}.student-hud strong{font-size:clamp(15px,2cqw,34px)}.hud-button{font-size:clamp(11px,1.3cqw,22px)}
.is-playing .path-rail{background:rgba(248,250,247,.87);padding:.5cqw .5cqw .35cqw;border-radius:.7cqw;filter:none}.is-playing .team-empty{color:#335749}.is-playing .control{min-height:44px}.is-playing .choice-button{min-height:48px}
.is-playing .path-rail li{font-size:clamp(10px,1.1cqw,19px)}.is-playing .choice-heading{font-size:clamp(15px,1.8cqw,31px)}.is-playing .choice-copy strong{font-size:clamp(14px,1.65cqw,28px)}.is-playing .choice-copy span{font-size:clamp(11px,1.15cqw,20px)}.is-playing .choice-description{font-size:clamp(10px,1cqw,17px)}
.is-playing .feedback h2{font-size:clamp(15px,1.9cqw,32px)}.is-playing .feedback p{font-size:clamp(11px,1.25cqw,21px)}.is-playing .feedback .effect{font-size:clamp(10px,1.15cqw,20px)}.is-playing .feedback .button{font-size:clamp(12px,1.5cqw,25px)}.is-playing .movement-copy{font-size:clamp(11px,1.25cqw,21px)}.is-playing .team-copy span,.is-playing .team-empty{font-size:clamp(10px,1.15cqw,20px)}.is-playing .team-copy strong{font-size:clamp(9px,1cqw,17px)}
@media(orientation:landscape) and (max-height:580px){.is-selecting .site-header{padding-top:7px;padding-bottom:5px;min-height:38px}.is-selecting .wordmark{font-size:16px}.is-selecting .wordmark img{width:22px;height:22px}.is-selecting .shell{height:calc(100dvh - 39px);padding:5px 18px 8px}.selection-screen{gap:8px}.selection-heading h1{font-size:25px;line-height:1.2}.selection-heading p{font-size:13px;margin-top:2px}.selection-deck{gap:14px}.story-cards{gap:8px}.story-card{border-radius:14px;padding:5px 5px 6px}.story-card[aria-pressed=true]{padding:4px 4px 5px}.student-image{border-radius:8px;margin-bottom:1px}.story-card strong{font-size:20px}.student-needs{font-size:12px}.selection-check{width:28px;height:28px;font-size:18px;line-height:22px;border-width:2px}.story-detail{padding:10px 14px;border-radius:15px}.story-detail-heading canvas{width:32px;height:32px}.story-detail-heading{gap:8px}.story-detail h2{font-size:20px}.story-detail blockquote{font-size:14px;line-height:1.5;margin:8px 0}.needs-copy{padding-top:6px;margin-bottom:8px;font-size:11px}.needs-copy strong{font-size:15px;display:inline;margin-left:9px}.story-detail .button{font-size:14px;min-height:40px;padding:6px}.story-detail .speed-picker{font-size:12px;padding-top:8px;gap:8px}.speed-picker legend{margin-right:5px}.speed-picker input{width:16px;height:16px}.selection-instructions{font-size:11px;gap:7px}.selection-instructions strong{font-size:12px}.selection-instructions canvas{display:none}.selection-instructions br{display:none}.selection-definition{padding-top:4px;font-size:11px}.selection-definition .inline-button{padding:0 5px}}
@media(orientation:portrait){.is-selecting .site-header{padding-top:12px;padding-bottom:7px}.is-selecting .wordmark{font-size:18px}.is-selecting .shell{height:calc(100dvh - 58px);padding:8px 14px 12px}.selection-screen{gap:12px}.selection-heading h1{font-size:26px;letter-spacing:-1px}.selection-heading p{font-size:13px;margin-top:4px}.selection-deck{display:flex;flex-direction:column;gap:12px;max-height:none}.story-cards{flex:1;min-height:130px;max-height:250px;gap:8px}.story-card{padding:5px 5px 7px;border-radius:13px}.story-card[aria-pressed=true]{padding:4px 4px 6px}.student-image{margin-bottom:3px;border-radius:8px}.selection-check{width:24px;height:24px;font-size:16px;line-height:20px;border-width:2px;right:3px;top:3px}.story-card strong{font-size:19px}.student-needs{font-size:11px}.story-detail{flex:1;padding:13px 15px;border-radius:16px}.story-detail-heading canvas{width:35px;height:35px}.story-detail h2{font-size:23px}.story-detail blockquote{font-size:16px;line-height:1.6;margin:10px 0}.needs-copy{padding-top:8px;margin-bottom:12px;font-size:12px}.needs-copy strong{display:inline;font-size:16px;margin-left:8px}.story-detail .button{min-height:48px;font-size:16px}.story-detail .speed-picker{padding-top:10px;font-size:13px}.selection-instructions{font-size:11px;gap:8px}.selection-instructions canvas{width:35px;height:40px}.selection-instructions strong{font-size:12px}.selection-definition{font-size:11px;padding-top:6px}}
@media(orientation:portrait) and (max-height:700px){.selection-screen{gap:8px}.selection-heading h1{font-size:23px}.selection-deck{gap:8px}.story-detail{padding:10px 12px}.story-detail blockquote{font-size:14px;margin:7px 0}.story-detail h2{font-size:21px}.needs-copy{margin-bottom:8px;padding-top:6px}.story-detail .button{min-height:44px;font-size:15px}.story-detail .speed-picker{padding-top:6px}.selection-instructions canvas{display:none}.selection-definition{font-size:10px}}
.start-countdown{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);z-index:5;display:grid;justify-items:center;gap:.3cqw;min-width:18cqw;padding:1.5cqw 3cqw 2cqw;border:3px solid #fff7d4;border-radius:2.5cqw;background:rgba(248,250,239,.96);box-shadow:0 .7cqw 0 rgba(28,65,44,.18);color:#23694d;pointer-events:none;text-align:center}.countdown-caption{font-size:1.7cqw;font-weight:800;letter-spacing:.1cqw}.start-countdown strong{font-size:12cqw;line-height:1;font-weight:950;font-variant-numeric:tabular-nums;letter-spacing:-.5cqw}.start-countdown.is-go{background:#23694d;color:#fff5cb;min-width:27cqw}.start-countdown.is-go strong{font-size:7cqw;letter-spacing:-.3cqw}.start-countdown.is-go .countdown-caption{display:none}
.is-playing .choice-panel.is-arrival{top:21%;left:25%;right:25%;width:auto;text-align:center;background:rgba(255,252,232,.95);border:2px solid #6c9b68;padding:1cqw 1.5cqw;border-radius:1.4cqw}.is-arrival strong{font-size:clamp(17px,2.6cqw,40px);color:var(--green)}.is-arrival p{font-size:clamp(11px,1.3cqw,22px);margin:.35cqw 0 0;line-height:1.5}.is-arriving .controls{visibility:hidden}
.is-playing .student-hud{width:58%}.is-playing .music-toggle{font-size:1.15cqw;min-width:6cqw}.music-toggle[aria-pressed=false]{opacity:.7}.site-header>.music-toggle{white-space:nowrap;margin-left:auto}
.wordmark{min-width:0;white-space:normal;text-align:left}.wordmark img{flex-shrink:0}.brand-name{display:flex;flex-wrap:wrap;column-gap:.35em;line-height:1.25}.brand-name>span{white-space:nowrap}@media(max-width:480px){.is-selecting .wordmark,.wordmark{font-size:16px}.site-header{gap:8px}}