#chapter-picker{width:min(960px,calc(100vw - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:clamp(20px,3vw,34px);border:1px solid #a3bb8c;border-radius:22px;background:#142c24;color:#fff5df;box-shadow:0 24px 90px #000a;overflow:auto;touch-action:pan-y}
#chapter-picker::backdrop,.touch-controls__menu::backdrop{background:#06130dd9;backdrop-filter:blur(5px)}
.chapter-heading{display:flex;align-items:start;justify-content:space-between;gap:16px}.chapter-heading h2{margin:8px 0 0;font-size:clamp(1.8rem,4vw,2.8rem);line-height:1.05}.chapter-heading button{min-height:44px}.chapter-heading button[hidden]{display:none}
.chapter-intro{margin:16px 0 24px;color:#cadac8;font:400 1rem/1.5 system-ui,sans-serif}.chapter-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}.chapter-cards li{display:flex;min-width:0}
.chapter-card{display:flex;flex-direction:column;width:100%;overflow:hidden;border:1px solid #668578;border-radius:14px;text-decoration:none;color:#fff5df;background:#1d3a2f;transition:border-color .15s,transform .15s}.chapter-card:hover{border-color:#f0d68c;transform:translateY(-3px)}.chapter-card:focus-visible{outline:3px solid #ffe29b;outline-offset:4px}.chapter-card[aria-current]{border-color:#d8eaa8}
.chapter-art{position:relative;display:grid;place-items:center;height:140px;overflow:hidden;background:linear-gradient(165deg,#587d81,#264a5c)}.chapter-art>span{position:absolute;top:14px;left:17px;color:#fff6ce99;font:500 2rem/1 Georgia,serif}.chapter-art svg{width:140px;height:100px;fill:#112e3555;stroke:#eee5c6;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.chapter-card--shore .chapter-art{background:linear-gradient(165deg,#b39b72,#3e6656)}.chapter-card--forest .chapter-art{background:linear-gradient(165deg,#708150,#244534)}
.chapter-copy{display:flex;flex-direction:column;flex:1;padding:18px}.chapter-number{margin:0 0 9px;color:#d4dda9;font:700 .7rem/1.4 system-ui,sans-serif;letter-spacing:.05em;text-transform:uppercase}.chapter-copy h3{margin:0;font-size:1.5rem;line-height:1.15}.chapter-copy>p:not(.chapter-number){color:#d1dece;font:400 .88rem/1.5 system-ui,sans-serif;margin:12px 0 20px}.chapter-play{display:flex;justify-content:space-between;gap:10px;margin-top:auto;padding-top:14px;border-top:1px solid #71867566;color:#f5daa1;font:700 .9rem/1.3 system-ui,sans-serif}.chapter-order{margin:22px 0 0;color:#adc0aa;text-align:center;font:500 .78rem/1.6 system-ui,sans-serif}.chapter-order span{margin:0 7px}
#finish{gap:10px}#finish button{min-height:44px}#finish[hidden]{display:none}#view:has(#finish:not([hidden])) .touch-controls__play{visibility:hidden}
#view #finish{position:fixed;inset:50% auto auto 50%;transform:translate(-50%,-50%);margin:0;width:min(600px,88vw);height:auto;max-height:calc(100dvh - 48px);overflow:auto;border-radius:16px;color:#fff5df}#finish::backdrop{background:#06130d66}
/* The same pause menu is available to keyboard and touch players. */
html[data-mobile-ui="false"] #touch-controls{position:absolute;inset:0;display:block;pointer-events:none;z-index:12}html[data-mobile-ui="false"] .touch-controls__play{display:none}html[data-mobile-ui="false"] .touch-control--menu-toggle{position:absolute;right:12px;top:12px;pointer-events:auto;min-width:44px;min-height:44px}html[data-mobile-ui="false"] #touch-controls.is-menu-open .touch-control--menu-toggle{visibility:hidden}
.touch-controls__menu{width:min(390px,calc(100vw - 24px));max-height:calc(100dvh - 32px);margin:auto;padding:22px;border:1px solid #a3bb8c;border-radius:18px;background:#142c24;color:#fff5df;overflow:auto;pointer-events:auto;touch-action:pan-y}.touch-controls__menu[hidden]{display:none}.touch-controls__menu h2{margin:0 80px 20px 0}.touch-controls__menu h2 small{display:block;font:500 .8rem/1.4 system-ui,sans-serif;color:#c4d4aa}.touch-control--menu-close{position:absolute;right:12px;top:12px;min-height:44px}.touch-controls__utilities{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.touch-controls__menu [data-command="chapters"]{display:block;width:100%;min-height:48px;margin-top:16px;background:#cdddab;color:#142c24}.touch-controls__menu::backdrop{touch-action:none}
html[data-mobile-ui="true"] dialog.touch-controls__menu{position:fixed;inset:0;margin:auto;touch-action:pan-y}html[data-mobile-ui="false"] .touch-controls__menu [role="radiogroup"],html[data-mobile-ui="false"] .touch-controls__sprint{display:none}
@media(max-width:780px){.chapter-cards{grid-template-columns:1fr;gap:12px}.chapter-card{flex-direction:row}.chapter-art{width:128px;min-width:128px;height:auto;min-height:152px}.chapter-art svg{width:110px;margin-top:20px}.chapter-art>span{font-size:1.4rem;top:12px;left:12px}.chapter-copy{padding:14px 16px}.chapter-copy h3{font-size:1.4rem}.chapter-copy>p:not(.chapter-number){margin:8px 0 12px}.chapter-play{padding-top:10px}.chapter-intro{margin:14px 0 18px}.chapter-order{margin-top:16px}}
@media(max-width:420px){#chapter-picker{padding:18px;width:calc(100vw - 20px);max-height:calc(100dvh - 20px)}.chapter-art{width:74px;min-width:74px}.chapter-art svg{width:72px}.chapter-copy{padding:12px}.chapter-copy h3{font-size:1.2rem}.chapter-copy>p:not(.chapter-number){font-size:.82rem}.chapter-order{display:none}}
@media(prefers-reduced-motion:reduce){.chapter-card{transition:none}.chapter-card:hover{transform:none}}