:root{font-family:Nunito,system-ui,"Noto Sans",sans-serif;color:#24424a;background:#edf1db;font-size:16px;--ink:#24424a;--paper:#fff9e9;--green:#b9d5b0;--coral:#d36a53;--line:#b7c9ad;--soft:#dce8d6;color-scheme:light}*{box-sizing:border-box}body{margin:0;min-height:100svh}button,select{font:inherit;font-weight:800;color:var(--ink);border:1.5px solid #718f83;background:var(--paper);border-radius:12px;min-width:44px;min-height:44px;padding:10px 15px;cursor:pointer;max-width:100%;white-space:normal;overflow-wrap:anywhere;touch-action:manipulation}button:hover{background:#f5eacb}button:disabled{opacity:.55;cursor:default}button:focus-visible,select:focus-visible,summary:focus-visible,#stage:focus-visible{outline:3px solid #cb7159;outline-offset:3px}.primary{background:#b8d8b5;border-color:#5c846c}.primary:hover{background:#a5c9a2}.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}p,li{line-height:1.55;overflow-wrap:anywhere}h1,h2{font-family:"Baloo 2",Nunito,system-ui,sans-serif;line-height:1.08}#home{max-width:1240px;margin:auto;padding:20px clamp(14px,4vw,56px) 40px}.homeHeader{display:flex;gap:18px;align-items:center;margin-bottom:22px}.homeHeader img{flex:none;object-fit:contain}.homeHeader nav{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto;justify-content:flex-end}.homeHeader button{font-size:.85rem;padding:8px 12px}.hero{display:grid;grid-template-columns:.9fr 1.15fr;gap:32px;align-items:center}.heroCopy>small{color:#66836e;letter-spacing:.09em;text-transform:uppercase;font-weight:900}.hero h1{font-size:clamp(2.6rem,5.4vw,4.8rem);margin:12px 0;color:#31564e;max-width:11ch}.hero p{margin:16px 0;color:#526c63}.hero strong{display:block;font-size:1.16rem}.hero .cover{width:100%;height:auto;min-height:270px;object-fit:cover;border-radius:34px 34px 70px 34px;border:2px solid #bacba9}.hero .actions{margin-top:22px}#nextCrew,#saved,#boot,#notice{font-size:.9rem}#notice:empty,#boot:empty{display:none}#notice{color:#8e593d;background:#fff0d1;border-radius:14px;padding:13px 16px}.practice{border-top:1px solid var(--line);margin-top:26px;padding-top:18px}summary{font-weight:900;cursor:pointer;min-height:44px;display:list-item;align-content:center}.practiceRow{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}.practiceRow label{display:grid;gap:6px;max-width:100%;font-weight:800;font-size:.9rem}.practiceRow select{max-width:min(330px,100%)}dialog{border:2px solid #6a8c7d;border-radius:24px;background:var(--paper);color:var(--ink);padding:clamp(18px,4vw,30px);width:min(600px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:calc(100svh - 28px);overflow:auto;overscroll-behavior:contain;box-shadow:0 18px 60px #24424a24}dialog::backdrop{background:#203f46a8}dialog h2{font-size:2rem;margin:0 0 16px}dialog .actions{margin-top:22px}dialog label{display:flex;gap:12px;align-items:center;margin:16px 0;flex-wrap:wrap}dialog input[type=checkbox]{appearance:none;width:28px;height:28px;flex:none;border:2px solid #6a8c7d;border-radius:8px;cursor:pointer}dialog input:checked{background:#679a75;box-shadow:inset 0 0 0 5px var(--paper)}dialog li{padding-left:5px;margin:12px 0}dialog ol{padding-left:22px}#crew{width:min(820px,calc(100vw - 24px))}#crewGrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:20px 0}.crewCard{display:flex;flex-direction:column;align-items:center;text-align:center;border:1px solid var(--line);border-radius:18px;padding:10px;gap:6px;background:#f5f4dd}.crewCard img{width:92px;height:92px;max-width:100%;object-fit:contain}.crewCard strong{font-size:1rem}.crewCard small{font-size:.78rem;line-height:1.3;overflow-wrap:anywhere}.crewCard button{width:100%;padding:7px;font-size:.8rem}.crewCard.selected{outline:2px solid #6c9a77}.crewCard.locked img{opacity:.65}#audioNotice{color:#8e593d}body.playing{overflow:hidden}#game{height:100svh;min-height:260px;position:relative;background:#d9e9c6;overflow:hidden}#stage{position:absolute;inset:68px 0 154px;overflow:hidden;touch-action:none;outline-offset:-4px}#stage canvas,#stage svg{position:absolute;inset:0;width:100%;height:100%}.hud{position:absolute;left:max(14px,env(safe-area-inset-left));top:max(10px,env(safe-area-inset-top));max-width:calc(100% - 140px);display:grid;gap:2px;color:var(--ink)}.hud>div{display:flex;gap:8px;align-items:baseline}.hud strong{font:900 2rem/1 "Baloo 2",Nunito,system-ui,sans-serif}.hud>div span{font-size:.8rem;font-weight:900}.hud small{font-size:.75rem}.hud #gameNotice{font-size:.73rem;font-weight:900;color:#8b503a;max-width:100%;overflow-wrap:anywhere}.pause{position:absolute;right:max(14px,env(safe-area-inset-right));top:max(10px,env(safe-area-inset-top));max-width:120px}.pad{position:absolute;left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;gap:7px;align-items:center;touch-action:none}.pad>div{display:grid;gap:5px}.pad button{font-size:1.5rem;line-height:1;min-width:56px;min-height:48px;padding:8px 14px;touch-action:none;background:#fff8e1;border:2px solid #718f83;box-shadow:0 3px 0 #718f83}.pad button:active{transform:translateY(2px);box-shadow:0 1px 0 #718f83}.crossingHint{position:absolute;left:12px;right:12px;bottom:126px;display:grid;gap:4px;text-align:center;pointer-events:none}.crossingHint small{font-size:.73rem;color:#587668}.crossingHint strong{color:#9b4f34;font-size:.9rem}#game:not([hidden])~dialog{z-index:5}[hidden]{display:none!important}@media(max-width:650px){#home{padding-top:14px}.homeHeader{gap:8px;margin-bottom:18px}.homeHeader img{width:38px;height:38px}.homeHeader button{font-size:.75rem;padding:7px 9px}.homeHeader nav{gap:5px}.hero{display:flex;flex-direction:column-reverse;gap:24px;align-items:stretch}.hero .cover{min-height:0;max-height:290px;border-radius:22px 22px 48px 22px}.hero h1{font-size:clamp(2.8rem,12vw,4.2rem);max-width:none}.heroCopy>small{font-size:.75rem}.hero .actions button{flex:1 1 145px}.hero p{margin:12px 0}#crewGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.crewCard img{width:90px;height:90px}.hud{max-width:calc(100% - 130px)}}@media(max-height:500px) and (min-width:550px){#stage{inset:60px 158px 6px 0}.pad{left:auto;right:10px;top:85px;bottom:auto;transform:none;gap:4px}.pad button{min-width:44px;padding:6px;min-height:46px}.crossingHint{left:auto;right:10px;width:138px;bottom:14px}.crossingHint small{font-size:.67rem}.crossingHint strong{font-size:.8rem}.hud{max-width:calc(100% - 170px)}.hero{grid-template-columns:1fr 1fr}.hero h1{font-size:2.8rem}.hero .cover{min-height:220px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}}

/* Content-sized HUD/hint/pad rows keep text scaling outside the playfield. */
#game{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto minmax(80px,1fr) auto auto;grid-template-areas:"hud pause" "stage stage" "hint hint" "pad pad";gap:8px;padding:max(10px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}#stage{grid-area:stage;position:relative;inset:auto;min-width:0;min-height:0}.hud{grid-area:hud;position:static;inset:auto;max-width:100%;align-self:start;padding-left:6px}.pause{grid-area:pause;position:static;inset:auto;justify-self:end;align-self:start}.crossingHint{grid-area:hint;position:static;inset:auto;width:auto;max-width:100%;align-self:center;padding:0 4px}.pad{grid-area:pad;position:relative;inset:auto;transform:none;justify-self:center;margin:0;align-self:center}@media(max-height:500px) and (min-width:550px){#game{grid-template-columns:minmax(0,1fr) 160px;grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:"hud pause" "stage pad" "stage hint"}#stage{inset:auto}.hud{max-width:100%}.pad{inset:auto}.crossingHint{inset:auto;width:auto}.pause{max-width:160px}}

/* Long localized headings must wrap inside scrollable dialogs. */
dialog h1,dialog h2{overflow-wrap:anywhere;hyphens:auto;max-width:100%}

/* Late audio failure status must not move settings controls under the pointer. */
#settings{margin:14px auto;scrollbar-gutter:stable}

/* Give the live warning room beside wide text at short landscape heights. */
@media(max-height:500px) and (min-width:550px){#game{grid-template-areas:"hud pause" "stage pad" "hint hint"}}