:root{font-family:'DM Sans',system-ui,sans-serif;color:#f8f5e9;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#9bb7c0}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid #edc77d;outline-offset:3px}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}#world{position:fixed;inset:0;width:100%;height:100%;outline:0;touch-action:none}#loading{position:fixed;inset:0;display:grid;place-content:center;text-align:center;background:#344b39;font-size:14px;letter-spacing:.06em}.sprout{font-size:70px;color:#d6dda6;animation:breathe 2s ease-in-out infinite}@keyframes breathe{50%{transform:scale(1.12)}}#title{position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(22,39,28,.58),rgba(27,40,29,.16) 45%,transparent 70%)}.title-copy{position:absolute;left:6.5%;top:8%;width:390px;max-width:42%;pointer-events:auto}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.2em}.title-copy h1{font-family:Fraunces,Georgia,serif;font-size:clamp(65px,7.2vw,110px);letter-spacing:-.065em;font-weight:500;line-height:.9;margin:27px 0 23px;text-shadow:0 2px 20px #27352226}.title-copy h1 em{font-style:normal}.title-copy p{font-size:15px;line-height:1.7;opacity:.9}.start-buttons{display:grid;gap:9px;margin-top:28px;max-width:280px}button{border:1px solid #f4f0db42;background:#263a2ccd;color:#f8f4e4;border-radius:4px;padding:12px 17px;transition:background .15s}button:hover{background:#466446}.primary{background:#ece7cc;color:#283e2c;font-weight:700;border:0;display:flex;justify-content:space-between}.primary:hover{background:#fff9e5}.join{display:flex;max-width:280px;border-bottom:1px solid #ecf1da70;margin-top:22px}.join input{min-width:0;width:100%;background:transparent;color:white;border:0;padding:10px 0;font-size:10px;letter-spacing:.12em;outline:none}.join input::placeholder{color:#f7f1daba}.join button{border:0;background:transparent;white-space:nowrap;padding:9px;font-size:12px}.text-button{border:0;background:none;padding:19px 0;font-size:12px}.text-button span{margin-left:30px}.title-footer{position:absolute;bottom:25px;left:6.5%;right:4%;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.08em;opacity:.8}#error{font-size:12px!important;color:#ffdeb8;line-height:1.4;max-width:300px}#hud{position:fixed;inset:0;pointer-events:none;background:linear-gradient(180deg,#15281d36,transparent 150px)}#hud button{pointer-events:auto}header{display:flex;justify-content:space-between;align-items:start;padding:28px 34px}header .eyebrow{text-shadow:0 1px 6px #213422}#objective{margin-top:8px;font-family:Fraunces,Georgia,serif;font-size:24px;text-shadow:0 1px 8px #21342277}nav{display:flex;gap:9px}nav button{background:#243a2d9c;font-size:12px;padding:10px 13px}#room-badge{position:absolute;right:34px;top:83px;font-size:10px;letter-spacing:.08em;text-shadow:0 1px 6px #213422}#toast{position:absolute;left:50%;bottom:134px;transform:translateX(-50%);max-width:520px;width:max-content;max-height:30vh;background:#20372ae8;backdrop-filter:blur(8px);border:1px solid #efead72c;border-radius:5px;padding:17px 23px;font-size:13px;line-height:1.6;box-shadow:0 8px 35px #172a1b25;text-align:center}#prompt{position:absolute;left:50%;bottom:65px;transform:translateX(-50%);display:flex;gap:8px;align-items:center}#interact{border:1px solid #f8f5d54a;background:#20372ae8;font-size:13px;padding:10px 18px;white-space:nowrap}kbd{font:600 11px system-ui;background:#f3edda;color:#304232;border-radius:3px;display:inline-block;padding:4px 7px;margin-right:12px}#unload,#unstuck{font-size:11px}#unload kbd,#unstuck kbd{margin:0 0 0 7px}#help{position:absolute;bottom:22px;left:0;right:0;text-align:center;font-size:10px;letter-spacing:.05em;text-shadow:0 1px 5px #243823}#joystick,#touch-action,#recenter{display:none}dialog{position:fixed;inset:0;margin:auto;width:480px;max-width:94vw;max-height:88dvh;overflow:auto;background:#f0eddb;color:#2d4231;border:1px solid #bcc5a8;border-radius:9px;padding:34px 30px;box-shadow:0 30px 100px #18251d55}dialog::backdrop{background:#18302044;backdrop-filter:blur(5px)}dialog h2{font:500 38px Fraunces,Georgia,serif;margin:6px 0 13px;letter-spacing:-.03em}dialog p{font-size:13px;line-height:1.7;color:#5d7059}dialog button{background:#3f6045;border:0;color:#f9f5e5}#close{position:absolute;right:12px;top:9px;background:transparent;color:#53684f;font-size:24px;padding:2px 7px}.row{display:flex;justify-content:space-between;align-items:center;margin:14px 0;border-bottom:1px solid #4d654326;padding-bottom:12px}.row small{font-size:11px;color:#79836a}.swatches{display:flex;gap:7px;flex-wrap:wrap}.swatch{width:27px;height:27px;padding:0;border:2px solid transparent;border-radius:50%;outline:1px solid #798667}.swatch.selected{border:3px solid #fff8df;outline:2px solid #385239}.section-label{font-size:10px;letter-spacing:.13em;text-transform:uppercase;margin:19px 0 10px}.stack{display:grid;gap:9px}.notes{padding:0;list-style:none}.notes li{border-top:1px solid #b8c0a4;padding:16px 0}.notes strong{font-family:Fraunces,Georgia,serif;font-size:22px}.notes small{display:block;margin:5px 0;color:#6b795f}.notes button{padding:7px 10px;font-size:11px}.sr-only{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}.voice-panel{z-index:20!important;top:auto!important;bottom:18px!important;left:18px!important;transform:none!important;width:245px!important;font-size:10px!important;background:#20372ad9!important;border:1px solid #eef3d12c!important;border-radius:5px!important}.voice-panel button{font-size:11px!important;min-height:32px!important}.voice-panel:not(:hover) .voice-details{opacity:.75}.build-note{font-size:10px!important;opacity:.65}
@media(max-height:680px) and (min-width:761px){.title-copy{top:6%}.title-copy h1{font-size:78px;margin:19px 0}.title-copy p{font-size:13px}.start-buttons{margin-top:15px;gap:6px}.join{margin-top:12px}.text-button{padding:12px 0}.title-footer{bottom:12px}}
@media(pointer:coarse),(max-width:760px){.title-copy{left:7%;top:9%;max-width:78%;width:330px}.title-copy h1{font-size:82px}.title-copy p{font-size:13px}.title-footer span:last-child{display:none}.title-footer{bottom:16px}.eyebrow{font-size:9px}.start-buttons{max-width:265px}header{padding:20px}#objective{font-size:21px}header nav{gap:6px}header nav button{font-size:10px;padding:10px}#room-badge{right:20px;top:69px}#help{display:none}#prompt{bottom:160px;max-width:90vw}#prompt kbd{display:none}#toast{bottom:213px;max-width:86vw;font-size:12px;padding:13px 17px}#joystick{display:block;position:absolute;left:26px;bottom:33px;width:108px;height:108px;border-radius:50%;background:#f8f5dd1c;border:1px solid #f8f5dd45;pointer-events:auto;touch-action:none;backdrop-filter:blur(2px)}#joystick i{position:absolute;top:33px;left:33px;width:42px;height:42px;border-radius:50%;background:#f0edcd99;border:1px solid #fff8ddbb}#touch-action{display:block;position:absolute;right:28px;bottom:40px;border-radius:50%;width:88px;height:88px;font-size:12px;background:#294732bb;touch-action:none}#recenter{display:block;position:absolute;right:48px;bottom:139px;border-radius:50%;width:42px;height:42px;padding:8px;font-size:22px}.voice-panel{left:16px!important;bottom:auto!important;top:93px!important;width:210px!important;padding:6px!important;font-size:9px!important}.voice-panel button{font-size:10px!important}.voice-panel div[role=status]{display:block!important}dialog{padding:25px}.title-copy .eyebrow{letter-spacing:.15em}}
@media(pointer:coarse) and (max-height:540px){.title-copy{top:5%;left:5%;width:285px;max-width:48%}.title-copy h1{font-size:58px;margin:12px 0}.title-copy p{margin:8px 0;font-size:11px;line-height:1.4}.start-buttons{margin-top:10px;gap:5px}.start-buttons button{padding:9px;font-size:11px}.join{margin-top:5px}.text-button{padding:10px 0;font-size:11px}.title-footer{bottom:9px;font-size:8px}header{padding:13px 20px}#objective{font-size:18px}.voice-panel{top:76px!important}.title-copy .eyebrow{font-size:8px}#toast{bottom:125px}#prompt{bottom:40px}#joystick{width:92px;height:92px;bottom:20px}#joystick i{top:25px;left:25px}#touch-action{bottom:25px;width:78px;height:78px}#recenter{bottom:116px}.join input{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
#moves{display:none}#moves button.active{background:#e8d8a0;color:#243c2b}
.biome-dot{display:inline-block;width:15px;height:15px;margin-right:10px;border-radius:50%;border:2px solid #e9e7d4;vertical-align:middle}
@media(pointer:coarse),(max-width:760px){#moves{display:grid;grid-template-columns:repeat(3,auto);gap:5px;position:absolute;right:13px;bottom:145px;pointer-events:auto}#moves button{min-width:50px;padding:8px 5px;font-size:10px;background:#294732cc;touch-action:none;user-select:none}#recenter{bottom:233px;right:19px}#touch-action{bottom:35px;right:29px}#prompt{bottom:260px}#toast{bottom:306px}}
@media(pointer:coarse) and (max-height:540px){#moves{right:9px;bottom:110px;gap:3px}#moves button{font-size:9px;padding:5px 3px;min-width:46px}#recenter{bottom:181px;right:13px}#touch-action{bottom:15px;right:19px}#prompt{bottom:70px;left:50%}#toast{bottom:170px}}
/* Expedition edition: a single warm white, a typographic grid, restrained controls. */
:root{font-family:Helvetica,Arial,sans-serif;color:#243d32}body,#loading,#intro,#studio,#veil{background:#e9ecdf}#loading{color:#243d32}.sprout{color:#6b835c}button,input,dialog{border-radius:0}button{transition:background .18s}#title{background:linear-gradient(90deg,#e9ecdf 0%,#e9ecdfef 32%,#e9ecdf00 80%)}.title-copy{top:8%;left:5%;width:420px;max-width:48%}.title-copy h1{font:700 clamp(70px,8vw,120px)/.89 Helvetica,Arial,sans-serif;letter-spacing:-.075em;text-shadow:none;margin:30px 0}.title-copy p{font-size:16px}.title-copy button,.join button{color:#243d32;background:transparent;border:1px solid #243d3260}.title-copy .primary{background:#243d32;color:#e9ecdf}.join input{color:#243d32}.join input::placeholder{color:#56685b}.join{border-color:#243d3250}.title-copy .text-button{border:0}.title-footer{left:5%;border-top:1px solid #243d3230;padding-top:14px}#error{color:#9c4933}#hud{color:#fcfcec}#objective{font:500 22px Helvetica,Arial,sans-serif}dialog{background:#e9ecdf;border:0;padding:35px;box-shadow:0 25px 90px #20362b35}dialog h2{font:600 36px Helvetica,Arial,sans-serif;letter-spacing:-.055em}dialog p{line-height:1.55}dialog::backdrop{background:#e9ecdf66}.seed-map{width:100%;max-height:48vh;display:block;border:1px solid #243d3240}#disguise{display:none!important}#intro{position:fixed;inset:0;z-index:30;padding:5%;display:flex;flex-direction:column;justify-content:space-between}.intro-index,.intro-title span{font-size:11px;letter-spacing:.15em}.intro-title p{font-size:22px;margin:0 0 15px}.intro-title h2{font-size:clamp(64px,9vw,150px);line-height:.9;letter-spacing:-.075em;margin:0 0 28px}.intro-title{opacity:.7;transform:translateY(8px);transition:opacity 2s,transform 3s}.playing .intro-title{opacity:1;transform:translateY(0)}#intro-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}#intro-actions button{background:transparent;border:1px solid #243d3260;color:#243d32}#intro-actions button:first-child{background:#243d32;color:#e9ecdf}#intro-actions p{font-size:11px;width:100%;margin:0;opacity:.65}#studio{position:fixed;inset:0;width:100%;height:100%;border:0;z-index:35}#veil{position:fixed;inset:0;z-index:50;pointer-events:none;opacity:0;transition:opacity .65s}#veil.visible{opacity:1;pointer-events:auto}#balance{position:fixed;left:50%;bottom:110px;transform:translateX(-50%);padding:14px 25px;background:#e9ecdfeb;color:#243d32;text-align:center;font-size:10px;letter-spacing:.08em}.balance-track{width:150px;height:4px;background:linear-gradient(90deg,#c66740 15%,#94a775 40% 60%,#c66740 85%);margin:12px auto 0}.balance-track i{display:block;position:relative;left:72px;top:-4px;width:5px;height:12px;background:#243d32}#balance-label{min-width:160px}@media(max-width:760px){#title{background:linear-gradient(90deg,#e9ecdfed,#e9ecdfad)}.title-copy{max-width:88%;left:7%;top:7%}.title-copy h1{font-size:80px}.title-copy p{font-size:14px}#intro{padding:8%}.intro-title h2{font-size:76px}#balance{bottom:220px}#objective{font-size:17px;max-width:65vw}.title-footer{font-size:9px}}
#grow-vine{position:fixed;right:30px;top:125px;z-index:5;background:#e9ecdf;color:#243d32;border:1px solid #243d3240;box-shadow:0 8px 25px #20362b20}@media(max-width:760px){#grow-vine{top:105px;right:20px;font-size:12px}}
/* In-world language is carried by sound, silhouettes and carvings. */
#hud header>div,#room-badge,#help,#toast,#prompt kbd{display:none!important}#hud header{justify-content:flex-end}#hud svg,#grow-vine svg{width:25px;height:25px;display:block}#hud button{min-width:43px;min-height:43px;display:inline-grid;place-items:center}#interact span{display:block}#balance-label{display:flex;justify-content:center;gap:4px;max-width:220px;flex-wrap:wrap}#balance-label svg{width:16px;height:20px}#touch-action svg{width:32px;height:32px}#grow-vine{min-width:52px;min-height:52px;display:grid;place-items:center}.seed-map{max-height:70vh}#prompt #interact{padding:12px}#moves button{padding:8px}


#throw-impact{position:absolute;width:13px;height:13px;transform:translate(-50%,-50%);border-radius:50%;background:#fff;border:2px solid #243d32;box-shadow:0 0 0 2px #fff;pointer-events:none}
#throw-impact.offscreen{background:#243d32}
#throw-charge{position:absolute;left:50%;top:calc(50% + 28px);transform:translateX(-50%);width:148px;height:9px;background:#243d32d9;border:1px solid #fff;box-shadow:0 1px 8px #0006;pointer-events:none}
#throw-charge i{display:block;height:100%;width:100%;transform-origin:left;background:#e9ecdf;transform:scaleX(0)}
#throw-charge.full i{background:#f5d56b}

/* Full-screen end state: typography, alignment and space instead of a modal. */
.end-sequence{position:fixed;inset:0;z-index:100000;display:none;color:#f4f4ef;font-family:Arial,Helvetica,sans-serif}
.end-flash,.end-black{position:absolute;inset:0;pointer-events:none;opacity:0}
.end-flash{background:#fff4df}.end-black{background:#000}
.end-layout{position:relative;width:min(1120px,84vw);min-height:100dvh;margin:auto;padding:clamp(32px,7vh,80px) 0 max(40px,env(safe-area-inset-bottom));display:none;grid-template-rows:1fr 1px auto;gap:clamp(24px,5vh,60px)}
.end-brand{font-size:13px;letter-spacing:.16em;font-weight:700;align-self:start}
.end-rule{height:1px;background:#555}
.end-restart{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;width:100%;margin:0;padding:0 0 8px;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:#f4f4ef!important;text-align:left;font:600 clamp(48px,8.5vw,118px)/.96 Arial,Helvetica,sans-serif;letter-spacing:-.055em;cursor:pointer}
.end-restart>span:last-child{font-size:.75em;align-self:flex-start;font-weight:400}
.end-restart:hover{color:#bfc4b7!important}.end-restart:focus-visible{outline:2px solid #fff;outline-offset:12px}
@media(max-width:600px){.end-layout{width:86vw;padding-top:40px;gap:28px}.end-restart{font-size:clamp(48px,12vw,72px)}}


/* Live authoring panel keeps the world visible and playable. */
#build-panel{position:fixed;z-index:40;left:24px;top:100px;width:min(410px,calc(100vw - 48px));max-height:calc(100dvh - 140px);overflow:auto;padding:22px;background:#eef0e6;color:#273d2b;border:1px solid #273d2b;box-shadow:0 8px 35px #0003;pointer-events:auto}
#build-panel[hidden],#build-panel [hidden]{display:none!important}
.build-heading{display:flex;justify-content:space-between;align-items:start}.build-heading h2{font-size:28px;margin:6px 0 16px;font-weight:500;letter-spacing:-1px}#build-close{font-size:26px;line-height:1;padding:0 8px}
#build-panel button{background:transparent;color:inherit;border:1px solid #273d2b55;padding:8px 10px;cursor:pointer;border-radius:0;min-height:36px;font-size:12px}#build-panel button:disabled{opacity:.45;cursor:wait}#build-panel button:hover{background:#273d2b12}.build-tabs,.build-targets,.build-actions,.build-presets{display:flex;gap:6px;flex-wrap:wrap}.build-tabs button[aria-pressed=true]{background:#273d2b!important;color:#eef0e6!important}.build-tabs button{flex:1}#build-mode-help,#build-target,#build-status{font-size:12px;line-height:1.5;margin:12px 0}.build-presets{margin:14px 0}#build-form label{display:block;font-size:12px;margin:14px 0 8px}#build-prompt{box-sizing:border-box;width:100%;resize:vertical;border:1px solid #273d2b80;background:#fafbf5;color:#273d2b;font:14px/1.5 inherit;padding:10px;border-radius:0;min-height:80px}.build-actions{margin-top:10px}.build-actions #build-submit{margin-left:auto;background:#273d2b;color:#eef0e6}#build-code-preview{white-space:pre-wrap;overflow-wrap:anywhere;max-height:240px;overflow:auto;font:11px/1.5 monospace;background:#fafbf5;padding:10px}#build-code-tasks{display:grid;gap:5px;margin-top:12px}#build-code-tasks button{text-align:left}
@media(max-height:500px){#build-panel{top:62px;left:12px;max-height:calc(100dvh - 80px);padding:12px}.build-heading h2{font-size:22px;margin-bottom:8px}}
@media(max-width:500px){#build-panel{top:80px;left:12px;width:calc(100vw - 48px);max-height:calc(100dvh - 110px);padding:12px}}

.build-key-label{display:block;font-size:11px;margin:12px 0 5px}#build-key{box-sizing:border-box;width:100%;padding:8px;border:1px solid #273d2b55;background:#fafbf5;color:#273d2b;font-size:12px}

#hud #room-badge.reconnecting{display:block!important;position:fixed;top:84px;bottom:auto;left:50%;transform:translateX(-50%);max-width:90vw;padding:12px 18px;background:#243d32;color:#f8f5e9;text-align:center;font:600 12px Helvetica,Arial,sans-serif;z-index:25;pointer-events:none}

#build-placement{border-top:1px solid #273d2b55;padding-top:12px;margin:12px 0;font-size:12px}#build-placement label{display:block;margin:12px 0 6px}#build-height{width:90px;padding:8px}#build-place{background:#273d2b!important;color:#eef0e6!important;margin-left:auto}

#build-model{display:block;width:100%;margin:6px 0 14px;padding:10px;background:#fafbf5;color:#273d2b;border:1px solid #273d2b80;border-radius:0}label[for=build-model]{font-size:12px}

/* Compact control reference, available on demand. */
dialog:has(.controls-menu){width:min(560px,calc(100vw - 28px));max-height:88dvh;padding:30px 32px;overflow:auto;color:#18251d;background:#f0f0e9}
.controls-menu h2{text-align:center;text-transform:uppercase;text-decoration:underline;text-underline-offset:7px;font:700 25px Helvetica,Arial,sans-serif;letter-spacing:.14em;margin:4px 0 28px}
.controls-menu dl{margin:0}.control-row{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:20px;padding:7px 0}.control-row dt{text-align:right;font:15px/1.3 Helvetica,Arial,sans-serif;letter-spacing:.025em}.control-row dd{margin:0;display:flex;gap:5px;flex-wrap:wrap}.control-row kbd{display:inline-block;background:#18251d;color:#f8f8f1;border-radius:0;font:600 12px/1.3 Helvetica,Arial,sans-serif;padding:5px 8px;min-width:25px;text-align:center}.controls-menu p{font-size:11px;line-height:1.5;margin:24px 0 16px;color:#526054}.controls-menu>button{width:100%;background:#243d32;color:#f0f0e9}.controls-menu~#close{color:#243d32}
@media(max-width:500px){dialog:has(.controls-menu){padding:28px 18px}.control-row{gap:12px}.control-row dt{font-size:13px}.control-row kbd{font-size:11px;padding:5px 6px}#hud header{padding:18px 12px}#hud nav{gap:5px}#controls-toggle{font-size:11px;padding:8px}}

#playtest-banner{position:fixed;bottom:12px;left:50%;transform:translateX(-50%);z-index:120;background:#f7edcf;color:#263c29;padding:10px 18px;border-radius:12px;font-size:13px;max-width:80vw;pointer-events:auto}#playtest-banner a{color:inherit;font-weight:700}#build-enter{display:inline-block;padding:12px;background:#d9ebd2;color:#263c29;border-radius:8px}#build-enter[hidden]{display:none}

#prompt #unload,#prompt #unstuck{display:flex;align-items:center;gap:8px;white-space:nowrap}#prompt #unload svg,#prompt #unstuck svg{width:24px;height:24px}#prompt #unload kbd,#prompt #unstuck kbd{display:inline!important}

#creation-library textarea,#creation-library input,#build-selected{width:100%;padding:10px;background:#fafbf5;color:#273d2b;border:1px solid #273d2b80}#creation-library label{display:block;margin:12px 0 5px}#creation-json{font:12px/1.5 monospace;resize:vertical}#creation-library .build-actions{flex-wrap:wrap;margin:12px 0}#creation-saved span{flex:1;min-width:120px}#creation-library p{font-size:13px;line-height:1.6}

/* Peripheral streaks leave the road and controls unobscured. */
#speed-lines{position:fixed;inset:0;z-index:5;overflow:hidden;pointer-events:none;contain:strict}
#speed-lines[hidden]{display:none}.speed-ray{position:absolute;left:50%;top:50%;width:0;height:0}
#speed-lines svg{position:absolute;display:block;overflow:visible;fill:none;stroke:#fff;stroke-linecap:round;transform-origin:2px 50%}
@media(prefers-reduced-motion:reduce){#speed-lines{display:none!important}}

/* Builder: a compact tool panel with a dedicated placement state. */
#build-panel{top:88px;left:20px;width:min(370px,calc(100vw - 40px));max-height:calc(100dvh - 108px);padding:20px;background:#f5f5eddF;backdrop-filter:blur(16px);border:1px solid #243d3238;box-shadow:0 12px 40px #152b2926;scrollbar-width:thin}
.build-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.build-heading h2{font:700 27px/1.1 Helvetica,Arial,sans-serif;letter-spacing:-.06em;margin:10px 0 18px}.build-heading .eyebrow{font-size:9px;color:#627168}#build-close{font-size:22px!important;line-height:1;padding:4px 8px!important;border:0!important}
.build-tabs{gap:0;border-bottom:1px solid #243d3233;padding-bottom:12px}.build-tabs button{border:0!important;min-height:40px!important}.build-targets button{font-size:10px!important;padding:6px!important;flex:1}.build-presets{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.build-presets button{min-height:44px!important;background:#fff9!important;text-align:left}
#build-prompt{min-height:100px;border-color:#243d3240;padding:12px;font:14px/1.5 Helvetica,Arial,sans-serif}#build-submit{font-weight:700;min-height:40px!important}#build-status{padding:10px 12px;background:#e4eadd;border-left:3px solid #69806d;margin:14px 0;overflow-wrap:anywhere}#build-status:empty{display:none}
#build-settings,#build-manage{border-top:1px solid #243d3229;margin-top:16px;padding-top:12px}#build-panel summary{cursor:pointer;font-size:12px;font-weight:700;padding:4px 0}#build-settings p{font-size:11px;line-height:1.5;color:#607166}#build-settings label{display:block;font-size:11px;margin-top:14px}#build-settings input{width:100%;padding:10px;border:1px solid #243d3240;background:#fff9;color:#243d32}#build-manage label{display:none!important}#build-selected{margin:12px 0 8px;font-size:12px}#build-remove{color:#8c4431!important;border-color:#8c443144!important}
#build-panel[data-placing=true] #build-mode-help,#build-panel[data-placing=true] .build-tabs{display:none}#build-placement{margin:0;border:0;padding:0}#build-placement>p:first-child{font-size:14px;line-height:1.5;margin:0 0 18px}#build-snap-hint{padding:12px;background:#e4eadd;line-height:1.5;border-left:3px solid #829584}#build-panel[data-snapped=true] #build-snap-hint{background:#d5ece4;border-color:#25897e;color:#18584f}#build-snap[aria-pressed=true]{background:#d5ece4!important;border-color:#25897e!important}#build-placement>.build-actions:last-child{border-top:1px solid #243d3229;padding-top:14px;margin-top:18px}#build-place{min-height:42px!important;font-weight:700}#build-panel[aria-busy=true] #build-status{border-color:#25897e;background:#d5ece4}
#prompt #interact{display:flex;align-items:center;gap:10px;box-shadow:0 6px 24px #10271e25}#prompt #interact kbd{display:inline-block!important;margin:0}#interaction-label{font-size:12px;white-space:normal;max-width:230px;text-align:left}
#vehicle-hud{position:fixed;z-index:8;right:24px;bottom:26px;width:238px;padding:15px 17px;color:#f5f5ed;background:#20362cdd;backdrop-filter:blur(12px);border:1px solid #eef3df38;pointer-events:none;box-shadow:0 8px 30px #15271c24}.vehicle-heading{display:flex;justify-content:space-between;gap:8px;text-transform:uppercase;font:700 9px Helvetica,Arial,sans-serif;letter-spacing:.12em}.vehicle-mode{color:#c8d1b8}#vehicle-hud[data-boost=true] .vehicle-mode{color:#8de1c9}.vehicle-speed{display:flex;gap:8px;align-items:baseline;margin:8px 0}.vehicle-speed strong{font:600 44px/1 Helvetica,Arial,sans-serif;letter-spacing:-.06em;font-variant-numeric:tabular-nums}.vehicle-speed span{font-size:10px;opacity:.65}.vehicle-speed-track{height:3px;background:#ffffff20}.vehicle-speed-track i{display:block;width:100%;height:100%;background:#c9d1b6;transform-origin:0 50%;transform:scaleX(0)}#vehicle-hud[data-boost=true] i{background:#8de1c9}.vehicle-controls{font-size:10px;line-height:1.5;opacity:.75;margin:12px 0 0}.vehicle-abilities{display:grid;gap:5px;margin-top:12px;pointer-events:auto}.vehicle-abilities[hidden]{display:none}.vehicle-abilities button{position:relative;display:flex;align-items:center;gap:8px;overflow:hidden;padding:6px 8px;color:inherit;font:600 11px Helvetica,Arial,sans-serif;text-align:left;background:#ffffff14;border:1px solid #eef3df30;cursor:pointer}.vehicle-abilities button[data-ready=true]{border-color:#8de1c9aa}.vehicle-abilities kbd{min-width:16px;padding:1px 4px;color:#20362c;font:700 10px Helvetica,Arial,sans-serif;text-align:center;background:#eef3df}.vehicle-abilities button[data-ready=false]{opacity:.6}.vehicle-abilities span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vehicle-abilities i{position:absolute;left:0;bottom:0;width:100%;height:2px;background:#c9d1b6;transform-origin:0 50%;transform:scaleX(0)}
@media(max-width:600px){#build-panel{left:12px;top:auto;bottom:12px;width:calc(100vw - 24px);max-height:62dvh;padding:16px}.build-heading h2{font-size:24px;margin-bottom:12px}#build-panel[data-placing=true]{max-height:54dvh}#interaction-label{max-width:170px}#vehicle-hud{right:12px;top:84px;bottom:auto;width:158px;padding:12px}.vehicle-speed strong{font-size:34px}.vehicle-heading{font-size:8px}.vehicle-controls{font-size:9px}}
@media(max-height:500px){#build-panel{top:62px;bottom:auto;max-height:calc(100dvh - 76px);padding:12px}#vehicle-hud{bottom:12px;top:auto;right:160px;width:190px}.vehicle-controls{display:none}}
#tool-hint{position:fixed;right:24px;top:88px;z-index:8;background:#20362cdd;color:#f5f5ed;border:1px solid #eef3df38;padding:12px 15px;max-width:270px;pointer-events:none;backdrop-filter:blur(10px)}#tool-hint strong{display:block;font-size:12px;margin-bottom:5px}#tool-hint span{display:block;font-size:10px;line-height:1.5;opacity:.8}@media(max-width:600px){#tool-hint{top:215px;right:12px;max-width:170px;padding:10px}}

#flight-controls{position:fixed;bottom:110px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:20}#flight-controls button{background:#e9ead8;color:#233f34;border:1px solid #6b8e7e;border-radius:10px;padding:12px 18px;font:600 13px system-ui}#flight-status{position:fixed;bottom:170px;left:50%;transform:translateX(-50%);background:#203a32dd;color:#f5efd9;border-radius:8px;padding:8px 12px;font:12px system-ui;z-index:20;white-space:nowrap}

/* Touch layout: compact navigation, thumb controls, optional action drawers. */
#voice-toggle,.mobile-voice-heading,#touch-more{display:none!important}
#touch-primary,#touch-tools{display:contents}
@media(pointer:coarse),(max-width:760px){
 body{overscroll-behavior:none}#world,#hud{height:100dvh}#hud{--touch-bottom:calc(20px + env(safe-area-inset-bottom));--touch-top:calc(10px + env(safe-area-inset-top))}
 #hud header{padding:var(--touch-top) max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left));justify-content:flex-end}#hud nav{gap:6px}#hud nav button{width:48px;height:46px;min-width:46px;min-height:44px;padding:5px;font-size:11px;border-radius:10px;background:#203a32cc;backdrop-filter:blur(8px)}
 #hud nav #sound-toggle,#hud nav #controls-toggle,#hud kbd,#hud #prompt #interact kbd{display:none!important}#hud nav #voice-toggle{display:inline-grid!important;width:58px}#hud nav #voice-toggle[hidden]{display:none!important}#hud nav #voice-toggle.active{background:#dbe9ca;color:#233f34}#hud nav svg{width:23px;height:23px}
 #moves{display:contents!important}#touch-action{display:none!important}#hud button{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
 #touch-primary{display:grid;grid-template-columns:repeat(2,56px);gap:8px;position:absolute;right:max(14px,env(safe-area-inset-right));bottom:var(--touch-bottom);pointer-events:auto}
 #touch-tools{display:flex;gap:8px;position:absolute;right:max(14px,env(safe-area-inset-right));bottom:calc(var(--touch-bottom) + 130px);pointer-events:auto}
 #moves button{width:56px;height:56px;min-width:56px;padding:6px;border-radius:14px;display:flex;flex-direction:column;justify-content:center;gap:3px;background:#203a32c9;border:1px solid #eef3df50;backdrop-filter:blur(8px);font-size:17px}
 #moves button::after{content:attr(data-touch-label);font-size:9px;line-height:11px;font-weight:600;letter-spacing:.01em}#moves svg{width:23px;height:23px}#moves button.active,#moves button[aria-expanded=true]{background:#e8d8a0;color:#233f34}#moves #jump{background:#e6e9d4;color:#233f34}#moves #touch-more{display:flex!important}
 #joystick{left:max(18px,env(safe-area-inset-left));bottom:calc(var(--touch-bottom) + 4px);width:112px;height:112px;border:1px solid #ffffff70;background:#203a3240}#joystick i{left:34px;top:34px;width:44px;height:44px;background:#e9ecdcb8}
 #touch-extra{display:grid;grid-template-columns:repeat(3,56px);gap:8px;position:fixed;right:max(14px,env(safe-area-inset-right));bottom:calc(var(--touch-bottom) + 196px);padding:10px;border:1px solid #eef3df55;border-radius:18px;background:#203a32f0;backdrop-filter:blur(14px);pointer-events:auto;z-index:25}#touch-extra[hidden]{display:none!important}#touch-extra #recenter{position:static;display:flex;width:56px;height:56px;border-radius:14px}
 #prompt{bottom:calc(var(--touch-bottom) + 140px);left:12px;right:12px;transform:none;justify-content:center;max-width:none;gap:6px}#hud[data-has-tool=true] #prompt{bottom:calc(var(--touch-bottom) + 206px)}#prompt #interact{display:flex;flex-direction:row;gap:9px;min-height:44px;padding:9px 14px;border-radius:12px;max-width:calc(100vw - 120px);font-size:12px}#prompt #interaction-label{max-width:160px;white-space:normal;text-align:left}#prompt #unload,#prompt #unstuck{min-height:44px;padding:8px;border-radius:12px;font-size:10px}
 #tool-hint{left:12px;right:auto;top:calc(66px + env(safe-area-inset-top));max-width:calc(100vw - 24px);padding:6px 10px;border-radius:8px}#tool-hint strong{font-size:11px;margin:0}#tool-hint span{display:none}
 .voice-panel{display:none!important;top:calc(66px + env(safe-area-inset-top))!important;bottom:auto!important;left:auto!important;right:12px!important;width:min(340px,calc(100vw - 24px))!important;max-height:calc(100dvh - 260px);overflow:auto;padding:12px!important;font-size:12px!important;border-radius:16px!important;background:#203a32f5!important;z-index:40!important}.voice-panel.voice-open{display:block!important}.voice-panel button{min-height:44px!important;font-size:12px!important}.voice-panel select{font-size:16px!important}.mobile-voice-heading{display:flex!important;align-items:center;justify-content:space-between;margin-bottom:8px;text-align:left}.mobile-voice-heading button{width:44px;padding:0!important;background:transparent!important;color:white!important;font-size:24px!important}
 #vehicle-hud{left:12px;right:auto;top:calc(66px + env(safe-area-inset-top));bottom:auto;width:126px;padding:8px 10px;border-radius:10px}#vehicle-hud .vehicle-controls{display:none}.vehicle-speed{margin:5px 0}.vehicle-speed strong{font-size:25px}#flight-status{top:calc(66px + env(safe-area-inset-top));right:12px;left:auto;bottom:auto;transform:none;max-width:calc(100vw - 158px);white-space:normal;text-align:right;font-size:10px;padding:7px 9px}
 #flight-controls{bottom:calc(var(--touch-bottom) + 258px);max-width:calc(100vw - 24px)}#flight-controls button{min-height:44px;font-size:11px;padding:9px 12px}#balance{bottom:calc(var(--touch-bottom) + 208px);padding:8px 12px}#grow-vine{top:calc(106px + env(safe-area-inset-top));right:12px;min-height:44px;min-width:44px}
}
@media(pointer:coarse) and (max-height:500px){
 #hud{--touch-bottom:calc(10px + env(safe-area-inset-bottom));--touch-top:calc(8px + env(safe-area-inset-top))}#touch-primary{grid-template-columns:repeat(2,48px);gap:6px}#moves button,#touch-extra #recenter{width:48px;height:48px;min-width:48px}#touch-tools{bottom:calc(var(--touch-bottom) + 110px);gap:6px}#joystick{width:100px;height:100px}#joystick i{left:28px;top:28px}#touch-extra{grid-template-columns:repeat(3,48px);bottom:calc(var(--touch-bottom) + 164px);gap:6px;padding:8px}#prompt,#hud[data-has-tool=true] #prompt{left:145px;right:145px;bottom:var(--touch-bottom)}#flight-controls{bottom:calc(var(--touch-bottom) + 58px)}#flight-status{max-width:220px}#vehicle-hud{top:12px;left:max(12px,env(safe-area-inset-left));width:110px}#tool-hint{left:130px;top:14px}.voice-panel{max-height:calc(100dvh - 88px)!important;width:310px!important}
}

#throw-charge.aiming{top:auto;bottom:22%}
/* Starting world choice stays in the title flow and scrolls on short screens. */
.title-copy{max-height:calc(100dvh - 82px);overflow-y:auto;scrollbar-width:none;padding-right:6px}
.title-copy::-webkit-scrollbar{display:none}
.world-selector{border:0;margin:18px 0 0;padding:0;max-width:390px}
.world-selector legend{font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;margin-bottom:9px}
.world-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.world-card{position:relative;display:flex;align-items:center;gap:8px;min-height:55px;padding:7px 8px;border:1px solid #243d3247;background:#e9ecdfba;color:#243d32;cursor:pointer;font-size:11px;font-weight:600;line-height:1.2;transition:background .15s,border-color .15s,transform .15s}
.world-card:hover{transform:translateY(-2px);background:#f9f5e9}
.world-card:has(input:checked){border-color:#243d32;background:#d4dec7;box-shadow:inset 0 0 0 1px #243d32}
.world-card:has(input:focus-visible){outline:3px solid #edc77d;outline-offset:2px}
.world-card input{position:absolute;opacity:0;width:1px;height:1px}
.world-art{flex:none;width:28px;height:28px;border-radius:50%;background:#b9c5a4;box-shadow:inset 0 -5px 0 #577256}
.world-card[data-world="random"] .world-art{background:conic-gradient(#7096a0 0 20%,#d9c28d 20% 40%,#7d9b69 40% 60%,#929f92 60% 80%,#b8c8a0 80%)}
.world-card[data-world="maze"] .world-art{background:repeating-linear-gradient(90deg,#648263 0 4px,#c9c6a8 4px 8px)}
.world-card[data-world="mountain"] .world-art{background:linear-gradient(140deg,#d7e1db 45%,#8f9b98 46% 65%,#586d69 66%)}
.world-card[data-world="water"] .world-art{background:linear-gradient(160deg,#e0d5a9 0 28%,#69aab1 29% 65%,#397d8e 66%)}
.world-card[data-world="dunes"] .world-art{background:linear-gradient(145deg,#f0d998 35%,#d5a969 36% 70%,#b87f52 71%)}
.world-card[data-world="forest"] .world-art{background:radial-gradient(circle at 35% 35%,#a9c98a 0 16%,#557b57 17% 63%,#314f3e 64%)}
.world-selector+.start-buttons{margin-top:16px}
@media(max-width:760px){.title-copy{max-height:calc(100dvh - 38px)}.world-selector{margin-top:12px}.world-card{min-height:47px;padding:6px;font-size:10px}.world-art{width:22px;height:22px}}
@media(max-height:680px){.world-selector{margin-top:10px}.world-card{min-height:43px}.world-selector+.start-buttons{margin-top:10px}}
.lobby-privacy{display:flex;align-items:center;gap:12px;margin:12px 0 0;font-size:11px;font-weight:700;letter-spacing:.04em}
.lobby-privacy label{display:flex;align-items:center;gap:7px;cursor:pointer}.lobby-privacy input[type=checkbox]{accent-color:#243d32}.lobby-privacy input[type=password],#join-password{border:1px solid #243d3260;background:#f2f1e5;color:#243d32;padding:9px;font-size:11px;max-width:180px}
.lobby-list{max-width:390px;margin:20px 0 0;border-top:2px solid #243d32;border-bottom:1px solid #243d3260;color:#243d32}.lobby-head{display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:11px;text-transform:uppercase;letter-spacing:.13em}.lobby-head button{padding:2px 9px!important;border:0!important;font-size:20px!important}.lobby-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0;border-top:1px solid #243d3235;font:700 10px Helvetica,Arial,sans-serif;letter-spacing:.07em}.lobby-row button{padding:7px 9px!important;white-space:nowrap;font-size:10px!important}#lobby-rows{font-size:11px;max-height:126px;overflow-y:auto;padding-bottom:7px}
.join{display:grid;grid-template-columns:minmax(0,1fr) auto;max-width:390px;gap:4px;margin-top:12px}.join #join-password{grid-column:1/-1;width:100%;max-width:none}.join #code{grid-column:1;grid-row:2}.join #join{grid-column:2;grid-row:2}
#fish-hud{position:fixed;left:50%;bottom:max(104px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:9;display:flex;flex-direction:column;align-items:center;gap:8px;max-width:calc(100vw - 24px);pointer-events:none;color:#f5f5ed;font-family:Helvetica,Arial,sans-serif}#fish-hud .fish-row{display:flex;align-items:stretch;gap:4px}#fish-hint{margin:0;padding:8px 14px;background:#20362cd0;border:1px solid #eef3df38;font-size:10px;line-height:1.45;letter-spacing:.04em;text-align:center;backdrop-filter:blur(8px)}#fish-hint strong{display:block;font-size:13px;letter-spacing:.02em}#fish-hint span{opacity:.8}#fish-exit{pointer-events:auto;min-width:34px;border:1px solid #eef3df38;background:#20362cd0;color:#f5f5ed;font-size:18px;line-height:1;cursor:pointer}#fish-gauges{display:grid;grid-template-columns:auto 170px;align-items:center;gap:5px 9px;padding:8px 12px;background:#20362cb8;font-size:9px;font-weight:700;letter-spacing:.12em}#fish-gauges i{display:block;height:7px;background:#ffffff30}#fish-gauges i>b{display:block;height:100%;transform-origin:left;transform:scaleX(0);background:#e9ecdf;transition:transform .15s}#fish-progress{background:#7fc6a4!important}
#fish-tension-track{position:relative;overflow:visible}
#fish-sweet{position:absolute;top:-2px;bottom:-2px;background:#7fc6a455;border-left:1px solid #7fc6a4;border-right:1px solid #7fc6a4}
#fish-snap{position:absolute;top:-3px;bottom:-3px;width:2px;background:#ef6a4c}
#fish-tension{position:relative}
#fish-stamina{background:#e7b25c!important}
#fish-run{grid-column:1/-1;display:flex;align-items:center;gap:9px;padding-bottom:3px;letter-spacing:.06em}
#fish-run strong{display:block;font-size:11px;letter-spacing:.06em}
#fish-run small{display:block;font-size:9px;font-weight:400;opacity:.8;letter-spacing:.04em}
#fish-run div{flex:1}
#fish-arrow{display:block;width:26px;height:26px;flex:none;transition:transform .2s,opacity .2s}
#fish-arrow svg{display:block;width:100%;height:100%;fill:#f5f5ed}
#fish-gauges.resting #fish-arrow{opacity:.25}
#fish-rod{display:block;position:relative;width:30px;height:30px;flex:none;border:1px solid #eef3df38;border-radius:50%}
#fish-rod i{display:block;position:absolute;left:50%;bottom:50%;width:2px;height:13px;margin-left:-1px;background:#e9ecdf;transform-origin:50% 100%;transition:transform .12s}
#fish-crew{grid-column:1/-1;margin:2px 0 0;font-size:9px;letter-spacing:.08em;font-weight:700;color:#bfe3cf}
#fish-gauges.good #fish-run strong{color:#9fe0bd}
#fish-gauges.bad #fish-run strong{color:#ffb19f}#fish-gauges.danger #fish-tension{background:#ef6a4c;animation:fish-strain .3s ease-in-out infinite alternate}@keyframes fish-strain{to{opacity:.45}}@media(pointer:coarse),(max-width:760px){#fish-hud{top:calc(var(--touch-top,10px) + 58px);bottom:auto}#fish-gauges{grid-template-columns:auto 120px}}
/* Keep the title controls reachable above the fixed footer at every viewport height. */
#title{color:var(--title-ink,#243d32)}
.title-copy{top:clamp(22px,6vh,72px);bottom:68px;max-height:none;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#81998a80 transparent;padding-bottom:24px}
.title-copy::-webkit-scrollbar{display:block;width:5px}.title-copy::-webkit-scrollbar-thumb{background:#81998a80}
.title-footer{pointer-events:none;background:linear-gradient(0deg,#e9ecdf44,transparent);padding-top:12px}
.title-copy h1,.title-copy p,.title-copy .eyebrow,.title-footer{color:var(--title-ink,#243d32)}
@media(max-width:760px){.title-copy{top:calc(env(safe-area-inset-top) + 22px);bottom:calc(env(safe-area-inset-bottom) + 52px);max-height:none;width:min(420px,86vw);max-width:86vw}.title-footer{bottom:calc(env(safe-area-inset-bottom) + 10px)}}
#unstuck.nudge{animation:unstuck-nudge .8s ease-in-out infinite alternate;box-shadow:0 0 0 3px #f5d56b}@keyframes unstuck-nudge{to{transform:scale(1.07)}}@media(prefers-reduced-motion:reduce){#unstuck.nudge{animation:none}}
.vehicle-trick{margin-top:10px;font:700 13px Helvetica,Arial,sans-serif;letter-spacing:.02em}.vehicle-trick[hidden]{display:none}.vehicle-trick strong{display:block;font-size:17px;color:#8de1c9}.vehicle-trick[data-bail=true] strong{color:#f09a7f}.vehicle-trick span{font-size:11px;opacity:.8}.vehicle-balance{position:relative;height:8px;margin-top:10px;background:linear-gradient(90deg,#f09a7f,#8de1c9 35%,#8de1c9 65%,#f09a7f)}.vehicle-balance[hidden]{display:none}.vehicle-balance i{position:absolute;top:-3px;width:3px;height:14px;background:#fff;transform:translateX(-50%)}
#stunt-hud{position:fixed;inset:0;z-index:7;pointer-events:none;color:#fff;font-family:Helvetica,Arial,sans-serif;text-shadow:0 2px 6px #0008}#stunt-hud[hidden]{display:none}.stunt-run{position:absolute;top:18px;left:50%;transform:translateX(-50%);display:flex;align-items:baseline;gap:14px;padding:8px 16px;background:#20362ccc;border:1px solid #eef3df38}.stunt-clock{font:700 13px Helvetica,Arial,sans-serif;letter-spacing:.06em}.stunt-score{font:800 26px/1 Helvetica,Arial,sans-serif;letter-spacing:-.02em;font-variant-numeric:tabular-nums}.stunt-letters b{margin-left:3px;font:900 15px Helvetica,Arial,sans-serif;opacity:.3}.stunt-letters b[data-got=true]{opacity:1;color:#ffd64a}.stunt-center{position:absolute;left:50%;bottom:120px;transform:translateX(-50%);width:min(560px,86vw);text-align:center}.stunt-combo{font-weight:800}.stunt-names{display:block;font-size:15px;line-height:1.3;color:#e8f7ef}.stunt-total{display:block;margin-top:4px;font-size:30px;color:#ffd64a;letter-spacing:-.01em;font-variant-numeric:tabular-nums}.stunt-toast{margin-bottom:8px}.stunt-toast strong{display:block;font-size:30px;font-weight:900;font-style:italic;letter-spacing:-.01em;color:#8de1c9}.stunt-toast[data-kind=bail] strong{color:#f09a7f}.stunt-toast[data-kind=goal] strong{color:#ffd64a}.stunt-toast[data-kind=bank] strong{color:#fff}.stunt-toast span{font-size:15px;font-weight:700}.stunt-balance{position:relative;height:9px;margin:10px auto 0;width:220px;background:linear-gradient(90deg,#f09a7f,#8de1c9 35%,#8de1c9 65%,#f09a7f)}.stunt-balance[hidden]{display:none}.stunt-balance i{position:absolute;top:-4px;width:3px;height:17px;background:#fff;transform:translateX(-50%)}.stunt-special{height:6px;width:220px;margin:10px auto 0;background:#ffffff26}.stunt-special i{display:block;height:100%;width:0;background:#8de1c9}.stunt-special[data-full=true] i{background:#ffd64a;box-shadow:0 0 12px #ffd64a}.stunt-goals{position:absolute;left:18px;top:140px;max-width:240px;padding:10px 12px;background:#20362ccc;border:1px solid #eef3df38;font-size:11px;pointer-events:auto}.stunt-goals summary{cursor:pointer;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.stunt-goals ol{margin:8px 0 0;padding-left:18px;line-height:1.6}.stunt-goals li[data-done=true]{color:#8de1c9;text-decoration:line-through}.stunt-buttons{position:absolute;right:18px;bottom:200px;display:none;grid-template-columns:repeat(2,64px);gap:8px;pointer-events:auto}@media(pointer:coarse){.stunt-buttons{display:grid}}.stunt-buttons button{height:52px;color:#fff;font:800 12px Helvetica,Arial,sans-serif;background:#20362ccc;border:1px solid #eef3df50;border-radius:12px;touch-action:none}.stunt-buttons button[data-on=true]{background:#8de1c9;color:#20362c}@media(max-width:600px){.stunt-run{top:70px;gap:8px;padding:6px 10px}.stunt-score{font-size:20px}.stunt-goals{top:auto;bottom:12px;left:12px;max-width:180px}.stunt-center{bottom:150px}.stunt-total,.stunt-toast strong{font-size:22px}}
#chomp{position:fixed;inset:0;z-index:60;pointer-events:none;overflow:hidden}#chomp[hidden]{display:none}.chomp-shake{position:absolute;inset:-20px}.chomp-flash{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,#d1001f,#5c0010 75%);opacity:0}.chomp-jaw{position:absolute;z-index:1;left:-2%;right:-2%;height:44vh;background:linear-gradient(#3a0a0c,#6e1418);transform:translateY(-132%)}.chomp-jaw.top{top:0}.chomp-jaw.bottom{bottom:0;background:linear-gradient(#6e1418,#3a0a0c);transform:translateY(132%)}.chomp-jaw i{position:absolute;left:0;right:0;height:13vh;background:linear-gradient(#fffaf0,#e6dcbf)}.chomp-jaw.top i{top:100%}.chomp-jaw.bottom i{bottom:100%;left:3.5%;right:-3.5%}.chomp-blood{position:absolute;inset:0;z-index:2}.chomp-drip{position:absolute;top:47vh;transform-origin:50% 0;background:linear-gradient(90deg,#5a0008,#b0081c 45%,#e8233a 55%,#8a0614);border-radius:0 0 999px 999px;transform:scaleY(0);box-shadow:inset -2px 0 3px #0004}.chomp-drip b{position:absolute;left:50%;bottom:-10px;width:150%;aspect-ratio:1/1.25;margin-left:-75%;background:radial-gradient(circle at 35% 30%,#ff5a6a,#b0081c 45%,#5a0008);border-radius:50% 50% 50% 50%/60% 60% 40% 40%;opacity:0}.chomp-splat{position:absolute;background:radial-gradient(circle at 40% 40%,#d0102a,#7a0010 70%);border-radius:63% 37% 54% 46%/55% 48% 52% 45%;opacity:0;filter:drop-shadow(0 2px 2px #0006)}#chomp strong{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);font:900 clamp(48px,12vw,140px)/1 Helvetica,Arial,sans-serif;font-style:italic;color:#ffd64a;text-shadow:0 6px 0 #6e1418,0 0 40px #000;opacity:0;letter-spacing:-.03em}#chomp em{position:absolute;z-index:3;left:50%;top:64%;transform:translateX(-50%);font:800 italic clamp(22px,4vw,40px)/1 Helvetica,Arial,sans-serif;color:#d7f0c4;text-shadow:0 3px 8px #000c;opacity:0}

#shark-challenge{position:fixed;left:50%;top:22%;transform:translateX(-50%);z-index:45;padding:18px 26px 16px;background:#13242fe8;border:1px solid #9fc3d455;border-radius:8px;color:#f4f8f6;text-align:center;box-shadow:0 12px 40px #0a161d66;pointer-events:auto;user-select:none;animation:shark-in .18s ease-out}@keyframes shark-in{from{transform:translateX(-50%) scale(.85);opacity:0}}
#shark-challenge .shark-title{font:700 13px Helvetica,Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase}
#shark-challenge .shark-keys{display:flex;gap:12px;justify-content:center;margin:14px 0 12px}#shark-challenge .shark-keys b{width:58px;height:58px;display:grid;place-content:center;border-radius:6px;background:#f3f1e4;color:#13242f;font:700 34px system-ui}
#shark-challenge .shark-keys b.right{background:#8cc47a}#shark-challenge .shark-keys b.wrong{background:#d8664a;color:#fff}
#shark-challenge .shark-timer{height:5px;background:#ffffff26;border-radius:3px;overflow:hidden}#shark-challenge .shark-timer i{display:block;height:100%;background:#f0c35b;transform-origin:left}
#shark-challenge .shark-pad{display:none;gap:8px;justify-content:center;margin-top:12px}#shark-challenge .shark-pad button{width:56px;height:52px;font-size:26px;padding:0;background:#f3f1e4;color:#13242f;border:0}
#shark-challenge .shark-hint{margin-top:10px;font-size:10px;letter-spacing:.06em;opacity:.75}#shark-challenge.won{background:#1f4a2ee8}#shark-challenge.lost{background:#4a1f1fe8}
@media(pointer:coarse){#shark-challenge .shark-pad{display:flex}#shark-challenge .shark-hint{display:none}#shark-challenge{top:12%}}

.balance-wobble{width:150px;height:4px;background:#243d3220;margin:8px auto 0}.balance-wobble i{display:block;height:100%;transform-origin:left;transform:scaleX(0);transition:transform .1s}#balance-run{margin-top:8px;font-size:9px;letter-spacing:.06em}#balance-label b{font-size:11px;margin-left:4px}
/* Photo mode: everything but the world and the photo controls steps aside. */
body.photo-mode>:not(#world):not(#photo-ui):not(dialog){visibility:hidden!important}
#photo-ui{position:fixed;inset:0;z-index:60;pointer-events:none;font:500 14px/1.35 system-ui,sans-serif;color:#f4f1e6}
#photo-ui[hidden]{display:none}
#photo-ui .photo-help{position:absolute;top:16px;left:50%;transform:translateX(-50%);max-width:calc(100% - 32px);display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;justify-content:center;padding:8px 14px;border-radius:12px;background:rgba(18,24,22,.55);backdrop-filter:blur(6px);text-align:center}
#photo-ui .photo-help strong{letter-spacing:.08em;text-transform:uppercase;font-size:12px;color:#ffd76a}
#photo-ui kbd{color:#f4f1e6;border:0;box-shadow:none;display:inline-block;min-width:1.4em;padding:0 .3em;margin:0 1px;border-radius:4px;background:rgba(255,255,255,.16);font:600 11px/1.6 ui-monospace,monospace;text-align:center}
#photo-ui .photo-bar{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);display:flex;gap:10px;align-items:center;pointer-events:auto;padding:8px 12px;border-radius:999px;background:rgba(18,24,22,.55);backdrop-filter:blur(6px)}
#photo-ui .photo-bar button{min-height:40px;padding:0 14px;border:0;border-radius:999px;background:rgba(255,255,255,.14);color:inherit;font:inherit;cursor:pointer}
#photo-ui .photo-bar button:hover,#photo-ui .photo-bar button:focus-visible{background:rgba(255,255,255,.26);outline:none}
#photo-ui .photo-shutter{width:62px;height:62px;padding:0!important;display:grid;place-items:center;background:#f4f1e6!important;box-shadow:0 0 0 4px rgba(244,241,230,.35)}
#photo-ui .photo-shutter i{width:48px;height:48px;border-radius:50%;border:2px solid #1d2420;transition:transform .12s}
#photo-ui .photo-shutter:active i{transform:scale(.88)}
#photo-ui.bare .photo-help,#photo-ui.bare .photo-bar{opacity:0;pointer-events:none}
#photo-ui .photo-flash{position:absolute;inset:0;background:#fff;opacity:0}
#photo-ui .photo-flash.go{animation:photo-flash .45s ease-out}
@keyframes photo-flash{0%{opacity:.85}100%{opacity:0}}
#photo-ui .photo-saved{position:absolute;bottom:100px;left:50%;transform:translateX(-50%);padding:6px 14px;border-radius:999px;background:rgba(18,24,22,.7);font-size:13px}
@media (max-width:640px){#photo-ui .photo-help span{display:none}#photo-ui .photo-bar{gap:6px;padding:6px 8px;bottom:16px;max-width:calc(100% - 32px);flex-wrap:wrap;justify-content:center;border-radius:20px}#photo-ui .photo-bar button{padding:0 10px}}
@media (prefers-reduced-motion:reduce){#photo-ui .photo-flash.go{animation-duration:.01s}}

/* Controller in use: clear focus for menus, and touch-only stunt buttons step aside. */
body[data-input="pad"] :focus{outline:3px solid #ffd76a!important;outline-offset:3px}
body[data-input="pad"] #stunt-hud .stunt-buttons{display:none}
#photo-ui .photo-pad{display:none}
body[data-input="pad"] #photo-ui .photo-pad{display:inline}
body[data-input="pad"] #photo-ui .photo-keys{display:none}
#stunt-hud .stunt-landing{margin-top:6px;font:800 13px/1 system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;text-shadow:0 2px 0 rgba(0,0,0,.35)}
#stunt-hud .stunt-landing[data-grade="perfect"]{color:#7ef0b0}
#stunt-hud .stunt-landing[data-grade="sloppy"]{color:#ff9c6b}
#stunt-hud .stunt-landing.pop{animation:stunt-land .35s cubic-bezier(.2,1.6,.4,1)}
@keyframes stunt-land{0%{transform:scale(.6);opacity:0}100%{transform:scale(1);opacity:1}}
@media (prefers-reduced-motion:reduce){#stunt-hud .stunt-landing.pop{animation:none}}

/* Room announcements and the skewered banner. */
#room-feed{position:fixed;top:86px;left:50%;transform:translateX(-50%);z-index:30;display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none;max-width:calc(100% - 32px)}
#room-feed p{margin:0;padding:7px 14px;border-radius:999px;background:rgba(20,28,24,.72);backdrop-filter:blur(6px);font:600 13px/1.3 'DM Sans',system-ui,sans-serif;color:#f8f5e9;text-align:center;animation:feed-in .3s ease-out;transition:opacity .5s}
#room-feed p.loud{background:rgba(150,28,24,.82);letter-spacing:.02em}
#room-feed p.out{opacity:0}
@keyframes feed-in{from{transform:translateY(-8px);opacity:0}to{transform:none;opacity:1}}
#skewered{position:fixed;inset:0;z-index:55;display:grid;place-content:center;justify-items:center;gap:10px;pointer-events:none;background:radial-gradient(ellipse at center,rgba(170,20,16,.28),rgba(120,0,0,.0) 62%)}
#skewered[hidden]{display:none}
#skewered strong{font:900 clamp(40px,9vw,104px)/.95 'DM Sans',system-ui,sans-serif;letter-spacing:-.02em;color:#fff3e6;text-shadow:0 4px 0 #8f1410,0 10px 28px rgba(0,0,0,.45);text-align:center}
#skewered span{font:700 clamp(14px,2.4vw,20px)/1.2 'DM Sans',system-ui,sans-serif;color:#ffe2cf;text-shadow:0 2px 8px rgba(0,0,0,.6);text-align:center}
#skewered.go strong{animation:skewer-pop .55s cubic-bezier(.2,1.5,.4,1),skewer-shake .4s .1s}
#skewered.go{animation:skewer-fade 2.6s forwards}
@keyframes skewer-pop{0%{transform:scale(2.2) rotate(-6deg);opacity:0}60%{opacity:1}100%{transform:scale(1) rotate(-2deg)}}
@keyframes skewer-shake{0%,100%{translate:0}25%{translate:-8px 3px}50%{translate:7px -4px}75%{translate:-4px 2px}}
@keyframes skewer-fade{0%,75%{opacity:1}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){#skewered.go strong{animation:none}#room-feed p{animation:none}}

/* FISHTALITY: the billfish headshot finisher. */
#fishtality{position:fixed;inset:0;z-index:58;pointer-events:none;overflow:hidden}
#fishtality[hidden]{display:none}
#fishtality .fx-shake,#fishtality .fx-pool,#fishtality .fx-blood,#fishtality .fx-vignette{position:absolute;inset:0}
#fishtality .fx-pool{background:linear-gradient(#5a0000,#8f0606 45%,#b10f0f);opacity:0}
#fishtality .fx-vignette{background:radial-gradient(ellipse at center,rgba(0,0,0,0) 35%,rgba(25,0,0,.8) 100%);opacity:0}
#fishtality .fx-streak{position:absolute;top:-2vh;height:112vh;transform-origin:top center;transform:scaleY(0);background:linear-gradient(#4a0000,#8c0707 35%,#b31212 80%,#c81c1c);border-radius:0 0 46% 46%/0 0 5vw 5vw;box-shadow:inset 0 0 2vw rgba(0,0,0,.35)}
#fishtality .fx-streak b{position:absolute;left:50%;bottom:-1.6vw;width:115%;aspect-ratio:1;border-radius:50%;transform:translateX(-50%);background:radial-gradient(circle at 35% 30%,#e04040,#9e0b0b 60%);opacity:0}
#fishtality .fx-gout{position:absolute;top:0;border-radius:50%;background:radial-gradient(ellipse at 50% 30%,#a80d0d,#5c0000 70%,rgba(60,0,0,0) 72%)}
#fishtality .fx-title{position:absolute;left:50%;top:50%;opacity:0;transform:translate(-50%,-50%)}
#fishtality strong{display:block;white-space:nowrap;font:900 clamp(52px,13vw,180px)/1 Impact,Haettenschweiler,'Arial Narrow Bold','Arial Black',sans-serif;letter-spacing:.03em;color:transparent;background:linear-gradient(#fff3b0 0%,#ffc23d 38%,#ff5a1f 52%,#c3120a 70%,#5c0000 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:2px #1c0000;filter:drop-shadow(0 .06em 0 #000) drop-shadow(0 0 .25em rgba(255,70,20,.55))}
#fishtality[data-full="false"] strong{font-size:clamp(40px,9vw,128px)}

#whale-banner{position:fixed;left:50%;top:calc(var(--touch-top,10px) + 64px);transform:translateX(-50%);z-index:9;display:flex;align-items:center;gap:10px;padding:9px 14px;background:#20362cd8;border:1px solid #eef3df38;color:#f5f5ed;font:700 11px Helvetica,Arial,sans-serif;letter-spacing:.06em;pointer-events:none;backdrop-filter:blur(8px);max-width:calc(100vw - 32px)}
#whale-banner b{display:block;width:22px;height:22px;flex:none;transition:transform .2s}
#whale-banner svg{display:block;width:100%;height:100%;fill:#9fe0bd}

#blow-hud{position:fixed;left:50%;bottom:max(104px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:9;pointer-events:none;max-width:calc(100vw - 24px)}
#blow-hint{margin:0;padding:9px 16px;background:#20362cd8;border:1px solid #eef3df38;color:#f5f5ed;font:10px/1.45 Helvetica,Arial,sans-serif;letter-spacing:.04em;text-align:center;backdrop-filter:blur(8px)}
#blow-hint strong{display:block;font-size:14px;letter-spacing:.03em}
#blow-hint span{opacity:.8}
#whale-belly{position:fixed;inset:0;z-index:30;pointer-events:none;overflow:hidden;font-family:Helvetica,Arial,sans-serif}
#whale-belly .belly{position:absolute;inset:-10%;background:radial-gradient(ellipse at 50% 55%,#6b2a33 0%,#3d151d 38%,#16070b 72%),#16070b}
#whale-belly .ribs{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 7%,#f2dfd0 7% 8.2%,transparent 8.2% 14%);opacity:.18;mask:radial-gradient(ellipse at 50% 40%,#000 0 40%,transparent 70%);-webkit-mask:radial-gradient(ellipse at 50% 40%,#000 0 40%,transparent 70%)}
#whale-belly .slosh{position:absolute;left:-10%;right:-10%;bottom:-6%;height:34%;background:linear-gradient(#2d5b63cc,#123238ee);border-radius:45% 55% 0 0;animation:belly-slosh 2.4s ease-in-out infinite alternate}
#whale-belly strong{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);width:94vw;text-align:center;line-height:1;color:#fff3e6;font-size:clamp(38px,10vw,112px);font-weight:900;letter-spacing:.04em;text-shadow:0 6px 0 #5b1c22,0 0 40px #000}
#whale-belly em{position:absolute;left:50%;top:60%;transform:translateX(-50%);color:#f3dccb;font-style:normal;font-size:clamp(13px,2.6vw,18px);letter-spacing:.08em;text-align:center;width:min(90vw,520px)}
#whale-belly.blowing .belly,#whale-belly.blowing .ribs,#whale-belly.blowing .slosh{opacity:0;transition:opacity .5s .25s}
#whale-belly .gust{position:absolute;inset:0;background:radial-gradient(circle at 50% 100%,#ffffff 0 20%,#d9f2f6 35%,transparent 70%);opacity:0}
@keyframes belly-slosh{from{transform:translateY(6%) rotate(-3deg)}to{transform:translateY(0) rotate(3deg)}}

#ship-hud{position:fixed;right:max(12px,env(safe-area-inset-right));top:calc(var(--touch-top,10px) + 58px);z-index:8;display:grid;grid-template-columns:1fr;gap:4px;min-width:170px;max-width:min(260px,calc(100vw - 24px));padding:8px 12px;background:#20362cd0;border:1px solid #eef3df38;color:#f5f5ed;font:10px/1.35 Helvetica,Arial,sans-serif;letter-spacing:.05em;pointer-events:none;backdrop-filter:blur(8px)}
#ship-hud strong{font-size:12px;letter-spacing:.04em}
#ship-hud[data-ship="1"] strong{color:#ffb2a8}
#ship-hud i{display:block;height:7px;background:#ffffff30}
#ship-hud b{display:block;height:100%;transform-origin:left;background:#9fe0bd;transition:transform .2s}
#ship-hud[data-state="disabled"] b{background:#e7b25c}
#ship-hud[data-state="sinking"] b{background:#ef6a4c}
#ship-hud[data-state="disabled"] span,#ship-hud[data-state="sinking"] span{color:#ffd59a;font-weight:700}
#cannon-hud{position:fixed;left:50%;bottom:max(104px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:9;display:flex;flex-direction:column;gap:4px;max-width:calc(100vw - 24px);pointer-events:none}
#cannon-hint{margin:0;padding:8px 14px;background:#20362cd8;border:1px solid #eef3df38;color:#f5f5ed;font:10px/1.45 Helvetica,Arial,sans-serif;letter-spacing:.04em;text-align:center;backdrop-filter:blur(8px)}
#cannon-hint strong{display:block;font-size:13px}
#cannon-hint span{opacity:.8}
#cannon-hud i{display:block;height:5px;background:#ffffff30}
#cannon-hud b{display:block;height:100%;transform-origin:left;background:#ffcc66}
#tied-hud{position:fixed;left:50%;top:38%;transform:translate(-50%,-50%);z-index:12;display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 20px;background:#2b1a12e0;border:2px solid #c4a46b;color:#fff3e0;font-family:Helvetica,Arial,sans-serif;text-align:center;pointer-events:none;max-width:calc(100vw - 32px)}
#tied-hud strong{font-size:clamp(20px,5vw,30px);font-weight:900;letter-spacing:.08em;color:#f2d38a}
#tied-hud span{font-size:12px;letter-spacing:.04em}
#tied-hud i{display:block;width:min(260px,70vw);height:8px;background:#ffffff26}
#tied-hud b{display:block;height:100%;transform-origin:left;background:#f2d38a;transition:transform .15s}
#feed-fish{position:fixed;inset:0;z-index:31;pointer-events:none;overflow:hidden;font-family:Helvetica,Arial,sans-serif}
#feed-fish .deep{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 40%,#1d5b66 0%,#0e3340 45%,#04121a 90%)}
#feed-fish .blood{position:absolute;inset:0;background:radial-gradient(circle at 50% 55%,#a3141acc 0 18%,#7a0d12aa 30%,transparent 62%);opacity:0}
#feed-fish .fin{position:absolute;bottom:22%;width:clamp(60px,12vw,120px);height:clamp(60px,12vw,120px);background:#4e5d66;clip-path:polygon(0 100%,62% 0,100% 100%)}
#feed-fish .jaw{position:absolute;left:-5%;right:-5%;height:52%;background:#2d3a42}
#feed-fish .jaw.top{top:0;clip-path:polygon(0 0,100% 0,100% 72%,95% 100%,90% 72%,85% 100%,80% 72%,75% 100%,70% 72%,65% 100%,60% 72%,55% 100%,50% 72%,45% 100%,40% 72%,35% 100%,30% 72%,25% 100%,20% 72%,15% 100%,10% 72%,5% 100%,0 72%)}
#feed-fish .jaw.bottom{bottom:0;clip-path:polygon(0 100%,100% 100%,100% 28%,95% 0,90% 28%,85% 0,80% 28%,75% 0,70% 28%,65% 0,60% 28%,55% 0,50% 28%,45% 0,40% 28%,35% 0,30% 28%,25% 0,20% 28%,15% 0,10% 28%,5% 0,0 28%)}
#feed-fish strong{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);width:94vw;text-align:center;color:#fff3e6;font-size:clamp(40px,11vw,118px);font-weight:900;letter-spacing:.06em;line-height:1;text-shadow:0 6px 0 #5b1c22,0 0 40px #000}
#feed-fish em{position:absolute;left:50%;top:60%;transform:translateX(-50%);color:#d9eef0;font-style:normal;font-size:clamp(13px,2.6vw,18px);letter-spacing:.1em;text-align:center;width:min(90vw,520px)}
#feed-fish .bubble{position:absolute;bottom:-20px;width:14px;height:14px;border-radius:50%;border:2px solid #d9f2f6aa}
/* Desktop: the round touch action button is only for touch screens (#hud button would otherwise show it in the top-left
   corner, under the stunt goals), the ship card sits below the menu buttons, and on narrower windows the stunt run
   banner drops below them too instead of running under them. */
@media (pointer:fine) and (min-width:761px){#hud #touch-action,#hud #recenter{display:none}#ship-hud{top:96px}}
@media (pointer:fine) and (min-width:761px) and (max-width:1240px){#stunt-hud .stunt-run{top:96px}#stunt-hud .stunt-goals{top:150px}}
/* A short desktop window keeps the vehicle card in the corner, clear of the prompt buttons in the middle. */
@media (pointer:fine) and (min-width:761px) and (max-height:500px){#vehicle-hud{right:12px}}
/* Voice, once it is on and working, folds down to a slim strip: your mic going out, voices coming in, and how many
   gardeners are within range. The cog opens the full settings again. */
.voice-strip{display:none;align-items:center;gap:7px;font-size:11px;letter-spacing:.02em}
.voice-strip meter{width:54px;height:8px}
.voice-strip b{font-weight:600;white-space:nowrap}
.voice-strip .voice-range{flex:1;text-align:left;white-space:nowrap;opacity:.85}
.voice-strip button{min-height:26px!important;min-width:26px;padding:2px 7px!important;font-size:12px!important;border:0;border-radius:6px;background:#e2ecd3;color:#193624}
.voice-panel.compact{width:auto!important;padding:5px 7px!important}
.voice-panel.compact>*:not(.voice-strip){display:none!important}
.voice-panel.compact .voice-strip{display:flex}
.voice-panel:not(.voice-on) .voice-input,.voice-panel:not(.voice-on) .voice-levels,.voice-panel:not(.voice-on) .voice-hint{display:none!important}
/* The world wheel's sign, repeated in the HUD while you are up on the tower top. */
#wheel-hud{position:fixed;left:50%;top:96px;transform:translateX(-50%);z-index:8;display:grid;gap:3px;min-width:220px;max-width:min(320px,calc(100vw - 24px));padding:8px 14px;background:#20362cd0;border:1px solid #eef3df38;border-top:3px solid var(--wheel-tone,#d9b75a);color:#f5f5ed;text-align:center;pointer-events:none;backdrop-filter:blur(8px)}
#wheel-hud strong{font:500 17px Fraunces,Georgia,serif}
#wheel-hud span{font:11px/1.35 Helvetica,Arial,sans-serif;letter-spacing:.03em;opacity:.88}
#wheel-hud i{display:block;height:4px;background:#ffffff26;margin-top:3px}#wheel-hud i b{display:block;height:100%;background:var(--wheel-tone,#d9b75a);transform-origin:left;transform:scaleX(0)}
@media(pointer:coarse),(max-width:760px){#wheel-hud{top:calc(var(--touch-top,8px) + 58px);min-width:190px;padding:6px 10px}#wheel-hud strong{font-size:15px}}

/* The title and intro: few words, and every colour follows the sky: the ink and wash turn with the day and night of the
   world behind (set on the page each frame the menu is up). */
:root{--ink:var(--title-ink,#243d32);--wash:var(--title-wash,#e9ecdf);--rule:color-mix(in srgb,var(--ink) 26%,transparent);--line:color-mix(in srgb,var(--ink) 40%,transparent)}
#intro{background:var(--wash);color:var(--ink);transition:background 1.2s,color 1.2s}
#intro-actions button{background:transparent;border:1px solid var(--line);color:var(--ink)}
#intro-actions button:first-child{background:var(--ink);border-color:var(--ink);color:var(--wash)}
.title-copy button,.join button,#title .lobby-list button{color:var(--ink);background:transparent;border:1px solid var(--line)}
.title-copy .primary{background:var(--ink);border-color:var(--ink);color:var(--wash)}
.title-copy .text-button{border:0}
.title-footer{border-top-color:var(--rule)}
.world-card{background:color-mix(in srgb,var(--wash) 72%,transparent);border-color:var(--rule);color:var(--ink)}
.world-card:hover{background:var(--wash)}
.world-card:has(input:checked){border-color:var(--ink);background:color-mix(in srgb,var(--ink) 12%,var(--wash));box-shadow:inset 0 0 0 1px var(--ink)}
.join{border-color:var(--rule)}
.join input{color:var(--ink)}
.join input::placeholder{color:color-mix(in srgb,var(--ink) 60%,transparent)}
.lobby-privacy input[type=password],#join-password{border-color:var(--line);background:color-mix(in srgb,var(--wash) 80%,transparent);color:var(--ink)}
.lobby-list{border-top-color:var(--ink);border-bottom-color:var(--rule);color:var(--ink)}
.lobby-row{border-top-color:var(--rule)}

/* Under the waves: a blue-green wash with light from above, drawn over the world and under the HUD by page order. */
#underwater{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse 120% 70% at 50% -10%,rgba(150,225,215,.32),rgba(22,96,112,.5) 55%,rgba(6,40,58,.72));mix-blend-mode:normal}#underwater[hidden]{display:none}

/* The surf break's scoreboard: the ride, the best wave and a call-out for each move. */
#surf-hud{position:fixed;inset:0;z-index:7;pointer-events:none;color:#fff;font-family:Helvetica,Arial,sans-serif;text-shadow:0 2px 6px #0008}#surf-hud[hidden]{display:none}
.surf-panel{position:absolute;top:18px;left:50%;transform:translateX(-50%);display:flex;align-items:baseline;gap:14px;padding:8px 16px;background:#1d3d4acc;border:1px solid #eef3df38;white-space:nowrap}
.surf-panel strong{font:700 11px Helvetica,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#bfe6ec}.surf-ride{font:700 17px Helvetica,Arial,sans-serif}.surf-best{font:12px Helvetica,Arial,sans-serif;opacity:.82}
.surf-toast{position:absolute;top:30%;left:50%;transform:translateX(-50%);text-align:center}.surf-toast[hidden]{display:none}.surf-toast b{display:block;font:800 34px Helvetica,Arial,sans-serif;letter-spacing:.02em}.surf-toast span{font:700 16px Helvetica,Arial,sans-serif;color:#d8f4c6}
.surf-toast[data-kind=bail] b{color:#ffb19f}.surf-toast[data-kind=banked] b{color:#bfe6ec}.surf-toast[data-kind=tow] b{color:#ffd46b;font-size:42px;letter-spacing:.04em;text-shadow:0 0 18px #ff9d2a99,0 3px 8px #000a}
#surf-hud[data-tow=line] .surf-panel{background:#4a3313cc;border-color:#ffd46b55}#surf-hud[data-tow=line] .surf-panel strong,#surf-hud[data-tow=ride] .surf-panel strong{color:#ffd46b}
#surf-hud[data-tow=free] .surf-panel{background:#7a4a10dd;border-color:#ffd46b}#surf-hud[data-tow=free] .surf-ride{color:#ffe7a6;animation:surf-drop .5s ease-in-out infinite alternate}
@keyframes surf-drop{to{opacity:.55}}@media(prefers-reduced-motion:reduce){#surf-hud[data-tow=free] .surf-ride{animation:none}}.surf-toast.pop{animation:surf-pop .45s ease-out}
@keyframes surf-pop{from{transform:translateX(-50%) scale(1.35);opacity:0}to{transform:translateX(-50%) scale(1);opacity:1}}
.surf-combo{position:absolute;top:64px;left:50%;transform:translateX(-50%);display:flex;align-items:baseline;gap:10px;max-width:min(720px,92vw);font:700 13px Helvetica,Arial,sans-serif;color:#e8f6f2;white-space:nowrap;overflow:hidden}.surf-combo[hidden]{display:none}
.surf-chain{overflow:hidden;text-overflow:ellipsis;opacity:.9}.surf-mult{font:900 22px Helvetica,Arial,sans-serif;color:#ffd46b;text-shadow:0 0 12px #ff9d2a88,0 2px 6px #000a}#surf-hud[data-lava='1'] .surf-mult{color:#ffb347}
.surf-toast[data-kind=move] b{font-size:28px;color:#e8fbff}.surf-toast[data-kind=air] b{font-size:36px;color:#fff3c4;text-shadow:0 0 16px #8fd9ff99,0 3px 8px #000a}#surf-hud[data-lava='1'] .surf-toast[data-kind=move] b,#surf-hud[data-lava='1'] .surf-toast[data-kind=air] b{color:#ffd9a8;text-shadow:0 0 16px #ff5a1a99,0 3px 8px #000a}
.surf-keys{margin:0;text-align:center;font:600 12px Helvetica,Arial,sans-serif;opacity:.78}.surf-keys:empty{display:none}
.surf-foot{position:absolute;bottom:126px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;width:max(300px,min(600px,calc(100vw - 540px)))}.surf-tip{margin:0;text-align:center;font:13px Helvetica,Arial,sans-serif;opacity:.85}
@media(pointer:coarse),(max-width:760px){.surf-panel{top:calc(var(--touch-top,8px) + 58px);padding:6px 10px;gap:9px}.surf-ride{font-size:14px}.surf-toast b{font-size:26px}.surf-foot{bottom:150px}.surf-tip{font-size:12px}.surf-keys{display:none}.surf-combo{top:calc(var(--touch-top,8px) + 96px);font-size:12px}.surf-mult{font-size:18px}}

/* Balthazor's verdict on a lava ride. */
#balthazor-verdict{position:fixed;left:50%;top:26%;transform:translate(-50%,-50%);z-index:54;display:grid;justify-items:center;gap:4px;pointer-events:none;text-align:center;max-width:min(560px,90vw)}
#balthazor-verdict[hidden]{display:none}
#balthazor-verdict small{font:800 12px/1 'DM Sans',system-ui,sans-serif;letter-spacing:.24em;text-transform:uppercase;color:#ffb070;text-shadow:0 2px 6px #000}
#balthazor-verdict strong{font:900 clamp(56px,11vw,120px)/1 Impact,'Arial Black',sans-serif;color:transparent;background:linear-gradient(#fff3c2,#ff9b2e 45%,#c2160a);-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:2px #2a0500;filter:drop-shadow(0 5px 0 #000) drop-shadow(0 0 24px #ff4a0a99)}
#balthazor-verdict strong::after{content:'/10';font-size:.38em;margin-left:.08em}
#balthazor-verdict em{font:italic 700 18px/1.25 Georgia,serif;color:#ffe2c4;text-shadow:0 2px 8px #000}
#balthazor-verdict span{font:600 12px/1.2 'DM Sans',system-ui,sans-serif;color:#f3d6c0;opacity:.85;text-shadow:0 1px 4px #000}
#balthazor-verdict.go{animation:balthazor-in 4.2s cubic-bezier(.2,1.3,.4,1) forwards}
#balthazor-verdict[data-high="1"] strong{filter:drop-shadow(0 5px 0 #000) drop-shadow(0 0 34px #ffd04aaa)}
@keyframes balthazor-in{0%{opacity:0;transform:translate(-50%,-30%) scale(.6)}10%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}16%{transform:translate(-50%,-50%) scale(1)}85%{opacity:1}100%{opacity:0;transform:translate(-50%,-56%)}}
@media(prefers-reduced-motion:reduce){#balthazor-verdict.go{animation:none}}

/* Blown to bits by a bazooka. */
#blown-up{position:fixed;inset:0;z-index:60;pointer-events:none;display:grid;place-items:center;align-content:center;gap:8px}
#blown-up[hidden]{display:none}
#blown-up .flash{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,#fff6d8 0%,#ffb347 30%,#c0160a 70%,#3a0000 100%);opacity:0}
#blown-up strong{position:relative;font:900 clamp(48px,10vw,120px)/1 Impact,'Arial Black',sans-serif;color:#fff2d6;-webkit-text-stroke:2px #2a0000;text-shadow:0 6px 0 #000,0 0 30px #ff5a1a;opacity:0}
#blown-up span{position:relative;font:800 16px/1 'DM Sans',system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#ffe2c4;text-shadow:0 2px 6px #000;opacity:0}
#blown-up.go .flash{animation:blown-flash 2.6s ease-out forwards}#blown-up.go strong{animation:blown-word 2.6s cubic-bezier(.2,1.4,.4,1) forwards}#blown-up.go span{animation:blown-by 2.6s ease-out forwards}
@keyframes blown-flash{0%{opacity:1}8%{opacity:.9}30%{opacity:.35}100%{opacity:0}}
@keyframes blown-word{0%{opacity:0;transform:scale(2.6) rotate(-4deg)}10%{opacity:1;transform:scale(.92) rotate(2deg)}16%{transform:scale(1.04) rotate(-1deg)}22%{transform:scale(1)}80%{opacity:1}100%{opacity:0;transform:scale(1.1)}}
@keyframes blown-by{0%,18%{opacity:0}30%,80%{opacity:1}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){#blown-up.go strong,#blown-up.go .flash,#blown-up.go span{animation-duration:1.6s;animation-timing-function:linear}}

/* Harpoon lock-on: red brackets closing on the locked shark. */
#shark-lock{position:fixed;z-index:30;width:var(--size,56px);height:var(--size,56px);transform:translate(-50%,-50%);pointer-events:none}
#shark-lock[hidden]{display:none}
#shark-lock i{position:absolute;width:30%;height:30%;border:3px solid #ff3b2f;filter:drop-shadow(0 0 4px #ff3b2faa)}
#shark-lock i:nth-child(1){left:0;top:0;border-right:0;border-bottom:0}#shark-lock i:nth-child(2){right:0;top:0;border-left:0;border-bottom:0}
#shark-lock i:nth-child(3){left:0;bottom:0;border-right:0;border-top:0}#shark-lock i:nth-child(4){right:0;bottom:0;border-left:0;border-top:0}
#shark-lock b{position:absolute;left:50%;top:100%;transform:translate(-50%,6px);font:800 11px/1 'DM Sans',system-ui,sans-serif;letter-spacing:.18em;color:#ff5a4a;text-shadow:0 1px 3px #000;white-space:nowrap}
#shark-lock.new{animation:shark-lock .22s ease-out}
@keyframes shark-lock{from{transform:translate(-50%,-50%) scale(1.8) rotate(45deg);opacity:.2}to{transform:translate(-50%,-50%) scale(1) rotate(0);opacity:1}}
@media(prefers-reduced-motion:reduce){#shark-lock.new{animation:none}}

/* SHARKNADO: the storm breaks. */
#sharknado-banner{position:fixed;left:50%;top:28%;transform:translate(-50%,-50%);z-index:54;display:grid;justify-items:center;gap:6px;pointer-events:none}
#sharknado-banner[hidden]{display:none}
#sharknado-banner strong{font:900 clamp(44px,9vw,110px)/1 Impact,'Arial Black',sans-serif;letter-spacing:.03em;color:transparent;background:linear-gradient(#f2f6f8,#9fb3c0 48%,#3d5466);-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:2px #0d1820;filter:drop-shadow(0 6px 0 #000) drop-shadow(0 0 22px #9cc9ff66)}
#sharknado-banner span{font:800 15px/1 'DM Sans',system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#e5f0f7;text-shadow:0 2px 6px #000}
#sharknado-banner.go{animation:sharknado-in 3.2s cubic-bezier(.2,1.3,.4,1) forwards}
@keyframes sharknado-in{0%{opacity:0;transform:translate(-50%,-50%) scale(2.4) rotate(-6deg);filter:blur(10px)}12%{opacity:1;transform:translate(-50%,-50%) scale(.94) rotate(2deg);filter:blur(0)}16%{transform:translate(calc(-50% - 10px),-50%) rotate(-2deg)}20%{transform:translate(calc(-50% + 8px),-50%) rotate(1deg)}26%{transform:translate(-50%,-50%) scale(1)}82%{opacity:1;transform:translate(-50%,-50%) scale(1.03)}100%{opacity:0;transform:translate(-50%,-62%) scale(1.08)}}
@media(prefers-reduced-motion:reduce){#sharknado-banner.go{animation:none}}

/* HEADSTRIKE: all ten pins with a head. */
#headstrike{position:fixed;left:50%;top:30%;transform:translate(-50%,-50%);z-index:54;display:grid;justify-items:center;gap:4px;pointer-events:none}
#headstrike[hidden]{display:none}
#headstrike strong{font:900 clamp(40px,8vw,92px)/1 Impact,'Arial Black',sans-serif;letter-spacing:.02em;color:transparent;background:linear-gradient(#fffbe0,#ffd23d 45%,#ff8a1c);-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:2px #3a1c00;filter:drop-shadow(0 5px 0 #000)}
#headstrike span{font:800 16px/1 'DM Sans',system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#fff3c8;text-shadow:0 2px 6px #000}
#headstrike.go{animation:headstrike 2.2s cubic-bezier(.2,1.4,.4,1) forwards}
@keyframes headstrike{0%{transform:translate(-50%,-50%) scale(.3) rotate(-8deg);opacity:0}12%{transform:translate(-50%,-50%) scale(1.15) rotate(3deg);opacity:1}22%{transform:translate(-50%,-50%) scale(1) rotate(-2deg)}80%{opacity:1}100%{transform:translate(-50%,-60%) scale(1.05);opacity:0}}
@media (prefers-reduced-motion:reduce){#headstrike.go{animation:none}}
.pad-connect{border-top:1px solid #c9cdc0;margin:0 0 16px;padding-top:4px}.pad-connect p{margin:12px 0}.pad-connect button{width:100%;background:transparent;color:#243d32;border:1px solid #243d32}.pad-connect button:hover{background:#dfe3d6}#switch2-status{color:#243d32;font-weight:600}
/* The Golden Dolphin (Web/src/golden-dolphin.js): the news on every screen, and a golden dolphin's own HUD. */
#golden-banner{position:fixed;left:50%;top:22%;transform:translateX(-50%);z-index:12;pointer-events:none;text-align:center;width:min(760px,92vw)}#golden-banner[hidden]{display:none}
#golden-banner b{display:block;font:900 clamp(40px,8vw,92px)/1 Georgia,'Times New Roman',serif;letter-spacing:.04em;text-transform:uppercase;background:linear-gradient(100deg,#8a5a12 0%,#ffe9a3 22%,#ffc93c 38%,#fff6d6 50%,#ffc93c 62%,#ffe9a3 78%,#8a5a12 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px #ffbf3c88) drop-shadow(0 4px 6px #0009);animation:golden-shine 2.2s linear infinite}
#golden-banner span{display:block;margin-top:14px;font:700 clamp(14px,2vw,19px) Helvetica,Arial,sans-serif;color:#fff4d2;text-shadow:0 2px 8px #000c,0 0 14px #ffb93c77}
#golden-banner.show b{animation:golden-shine 2.2s linear infinite,golden-in .9s cubic-bezier(.2,1.6,.4,1) both}#golden-banner.show span{animation:golden-fade .6s .5s both}#golden-banner.show{animation:golden-out .8s 4.4s both}
@keyframes golden-shine{to{background-position:-250% 0}}@keyframes golden-in{from{transform:scale(.3);opacity:0;letter-spacing:.6em}to{transform:scale(1);opacity:1}}@keyframes golden-fade{from{opacity:0;transform:translateY(8px)}}@keyframes golden-out{to{opacity:0}}
@media(prefers-reduced-motion:reduce){#golden-banner b,#golden-banner.show b{animation:none;background-position:50% 0}#golden-banner.show span{animation:none}}
#vehicle-hud[data-gold='1']{border-color:#ffd76a99;background:linear-gradient(160deg,#4a3410e8,#20362cdd 70%);box-shadow:0 0 22px #ffbf3c44}#vehicle-hud[data-gold='1'] .vehicle-name{color:#ffd76a}
/* The Shark King (Web/src/shark-king.js): the news on every screen, and the grey hush while time stands still. */
#shark-king{position:fixed;left:50%;top:20%;transform:translateX(-50%);z-index:12;pointer-events:none;text-align:center;width:min(820px,92vw)}#shark-king[hidden]{display:none}
#shark-king b{display:block;font:900 clamp(44px,9vw,104px)/1 Impact,'Arial Black',sans-serif;letter-spacing:.06em;text-transform:uppercase;background:linear-gradient(180deg,#fff2c2 0%,#ffcf4a 38%,#d2421f 62%,#6e0d0d 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:2px #2a0505;filter:drop-shadow(0 0 22px #ff3a1a88) drop-shadow(0 5px 6px #000c)}
#shark-king span{display:block;margin-top:14px;font:800 clamp(14px,2.1vw,20px) Helvetica,Arial,sans-serif;color:#fff1de;text-shadow:0 2px 8px #000d,0 0 14px #ff4a2a88}
#shark-king.show b{animation:king-slam .7s cubic-bezier(.2,1.8,.35,1) both,king-shake .5s .7s 2}#shark-king.show span{animation:golden-fade .6s .4s both}#shark-king.show{animation:golden-out .8s 4.4s both}
@keyframes king-slam{from{transform:scale(3.2) rotate(-6deg);opacity:0;filter:blur(8px)}to{transform:none;opacity:1}}@keyframes king-shake{25%{transform:translate(-4px,2px) rotate(-1deg)}50%{transform:translate(3px,-2px) rotate(1deg)}75%{transform:translate(-2px,1px)}}
#time-stop{position:fixed;inset:0;z-index:6;pointer-events:none;backdrop-filter:grayscale(.9) contrast(1.25) brightness(.92);-webkit-backdrop-filter:grayscale(.9) contrast(1.25) brightness(.92);background:radial-gradient(circle at 50% 50%,transparent 45%,#0a1a3a55 100%);animation:time-stop-in .35s ease-out both}#time-stop[hidden]{display:none}
@keyframes time-stop-in{from{backdrop-filter:none;-webkit-backdrop-filter:none;background:radial-gradient(circle,#ffffffcc 0%,transparent 60%)}}
@media(prefers-reduced-motion:reduce){#shark-king.show b,#shark-king.show span,#time-stop{animation:none}}
/* The Temple of the Fifth Sun (Web/src/ritual-hud.js): the sleep veil, the red haze on the stone, the priest's and the sacrifice's panel, the news. */
#rite-hud{position:fixed;inset:0;z-index:11;pointer-events:none}#rite-hud[hidden],#rite-hud [hidden]{display:none!important}
.rite-veil{position:absolute;inset:0;backdrop-filter:blur(2px) saturate(.55) brightness(.8);-webkit-backdrop-filter:blur(2px) saturate(.55) brightness(.8);background:radial-gradient(ellipse at 50% 45%,#0b0f2a22 25%,#05071acc 80%,#020310f2 100%);animation:rite-breathe 4.2s ease-in-out infinite}
.rite-veil[data-deep="1"]{backdrop-filter:blur(7px) saturate(.3) brightness(.55);-webkit-backdrop-filter:blur(7px) saturate(.3) brightness(.55);background:radial-gradient(ellipse at 50% 45%,#0b0f2a55 10%,#03051af0 70%,#010208 100%)}
.rite-veil::after{content:attr(data-text);position:absolute;left:50%;bottom:22%;transform:translateX(-50%);white-space:nowrap;font:italic 700 clamp(16px,2.4vw,24px) Georgia,serif;color:#cfd6ff;letter-spacing:.06em;text-shadow:0 0 18px #6a7cff99,0 2px 6px #000}
@keyframes rite-breathe{0%,100%{opacity:.82}50%{opacity:1}}
.rite-haze{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,transparent 30%,#7a000c88 70%,#3a0005ee 100%);mix-blend-mode:multiply;transition:opacity .08s}
.rite-panel{position:absolute;left:50%;bottom:9%;transform:translateX(-50%);width:min(440px,90vw);padding:18px 22px 16px;text-align:center;border-radius:6px;background:linear-gradient(#1b0f0bf2,#0d0706f2);border:2px solid #b8862b;box-shadow:0 0 0 4px #1b0f0b,0 0 0 6px #2f9e86,0 18px 50px #000c,inset 0 0 30px #5a0a0a66}
.rite-panel::before{content:'';position:absolute;inset:6px;border:1px dashed #b8862b66;border-radius:3px}
.rite-title{display:block;font:900 clamp(17px,2.6vw,24px)/1.15 Georgia,serif;letter-spacing:.08em;text-transform:uppercase;color:#ffcf6a;text-shadow:0 0 14px #ff5a2a88,0 2px 0 #4a0a00}
.rite-panel[data-mode="victim"] .rite-title{color:#ff6a6a;animation:rite-shake .18s infinite}
@keyframes rite-shake{0%,100%{transform:translate(0,0)}25%{transform:translate(-2px,1px)}50%{transform:translate(2px,-1px)}75%{transform:translate(-1px,-1px)}}
.rite-heart{position:relative;width:92px;height:92px;margin:14px auto 10px;display:grid;place-items:center}
.rite-heart::before{content:'';position:absolute;inset:4px;border-radius:50%;border:3px solid #ffd76a55;box-shadow:0 0 14px #ffd76a33}
.rite-heart span{font-size:58px;line-height:1;color:#e0102a;filter:drop-shadow(0 0 12px #ff1a2acc) drop-shadow(0 0 30px #ff1a2a66)}
.rite-heart i{position:absolute;inset:4px;border-radius:50%;border:4px solid #ffd76a;box-shadow:0 0 18px #ffd76a,inset 0 0 12px #ffd76a88;will-change:transform}
.rite-panel[data-mode="victim"] .rite-heart i,.rite-panel[data-phase="raise"] .rite-heart i{display:none}
.rite-tear{display:flex;justify-content:center;gap:26px;margin:16px 0 12px}
.rite-tear kbd{min-width:66px;padding:14px 0;font:900 30px Helvetica,Arial,sans-serif;color:#ffe2b0;background:linear-gradient(#5a1210,#2a0605);border:2px solid #b8862b;border-radius:8px;box-shadow:0 5px 0 #120302;opacity:.45;transition:opacity .08s,transform .08s}
.rite-tear[data-next="l"] .l,.rite-tear[data-next="r"] .r{opacity:1;transform:translateY(-3px) scale(1.08);box-shadow:0 8px 0 #120302,0 0 22px #ff3a2acc;color:#fff}
.rite-meter{height:12px;margin:6px 4px 8px;border-radius:7px;background:#000a;border:1px solid #b8862b88;overflow:hidden}.rite-meter i{display:block;height:100%;width:0;transition:width .12s;background:linear-gradient(90deg,#ffd76a,#ff8a2a)}
.rite-panel[data-meter="wake"] .rite-meter i{background:linear-gradient(90deg,#6ad6ff,#ffffff)}.rite-panel[data-mode="victim"] .rite-meter i{background:linear-gradient(90deg,#5aff8a,#d8ffe0);box-shadow:0 0 12px #5aff8a}
.rite-panel[data-meter="rip"] .rite-meter i{background:linear-gradient(90deg,#6a0010,#ff1a2a);box-shadow:0 0 12px #ff1a2a}
.rite-panel[data-meter="raise"] .rite-meter i{background:linear-gradient(90deg,#ff8a2a,#fff3b0);box-shadow:0 0 16px #ffd76a}
.rite-keys{margin:4px 0 0;font:700 13px Helvetica,Arial,sans-serif;color:#f3dcc0;letter-spacing:.03em}
.rite-watch{position:absolute;left:50%;top:12px;transform:translateX(-50%);max-width:92vw;padding:8px 16px;border-radius:5px;background:#2a0505e8;border:1px solid #ff3a2a;color:#ffe0d0;font:700 13px Helvetica,Arial,sans-serif;text-align:center;box-shadow:0 0 20px #ff1a2a66;animation:rite-pulse 1.58s ease-in-out infinite}
@keyframes rite-pulse{0%,100%{box-shadow:0 0 12px #ff1a2a44}50%{box-shadow:0 0 28px #ff1a2acc}}
.rite-news{position:absolute;left:50%;top:21%;transform:translateX(-50%);width:min(820px,92vw);text-align:center}
.rite-news b{display:block;font:900 clamp(40px,8vw,96px)/1 Georgia,'Times New Roman',serif;letter-spacing:.05em;text-transform:uppercase;background:linear-gradient(180deg,#ffef9a 0%,#ffb02a 40%,#c0141e 75%,#5a0008 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 22px #ff3a1a99) drop-shadow(0 4px 0 #2a0003)}
.rite-news[data-kind="rite"] b{background:linear-gradient(180deg,#ff8a7a 0%,#e0102a 45%,#5a0008 100%);-webkit-background-clip:text;background-clip:text}
.rite-news[data-kind="saved"] b{background:linear-gradient(180deg,#d8fff0 0%,#2fd6a0 45%,#0a5a4a 100%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 18px #2fd6a099) drop-shadow(0 4px 0 #02201a)}
.rite-news span{display:block;margin-top:14px;font:700 clamp(14px,2vw,19px) Helvetica,Arial,sans-serif;color:#fff0e0;text-shadow:0 2px 8px #000c,0 0 14px #ff3a1a77}
.rite-news.show b{animation:rite-slam .7s cubic-bezier(.2,1.5,.4,1) both}.rite-news.show span{animation:golden-fade .6s .4s both}.rite-news.show{animation:golden-out .8s 5.4s both}
@keyframes rite-slam{0%{opacity:0;transform:scale(2.6);letter-spacing:.4em}100%{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.rite-veil,.rite-watch,.rite-panel[data-mode="victim"] .rite-title,.rite-news.show b,.rite-news.show span,.rite-news.show{animation:none}}
/* The Clash of the Titans (Web/src/clash-hud.js): fighting-game bars, the VS splash, the White Whale's warnings, every blow, FINISH IT, and how it ended. */
#clash-hud{position:fixed;inset:0;z-index:11;pointer-events:none;font-family:Helvetica,Arial,sans-serif}#clash-hud[hidden],#clash-hud [hidden]{display:none!important}
.ch-bars{position:absolute;top:10px;left:16px;width:max(300px,min(720px,calc(100vw - 400px)));display:flex;align-items:flex-start;gap:12px}
.ch-side{flex:1;min-width:0}.ch-side b{display:block;font:900 italic clamp(12px,1.8vw,17px)/1 Georgia,serif;letter-spacing:.08em;color:#fff;text-shadow:0 2px 0 #000,0 0 10px #000a}.ch-side small{display:block;margin:2px 0 5px;font:700 11px Helvetica,Arial,sans-serif;color:#ffd9a8;text-shadow:0 1px 3px #000}
.ch-whale{text-align:right}
.ch-bar{position:relative;height:18px;transform:skewX(-18deg);background:#160606d9;border:2px solid #e2b04a;box-shadow:0 0 0 2px #000,0 4px 14px #000a;overflow:hidden}
.ch-bar i,.ch-bar u{position:absolute;top:0;bottom:0;left:0;display:block;transition:width .12s}.ch-whale .ch-bar i,.ch-whale .ch-bar u{left:auto;right:0}
.ch-bar u{background:#fff3c8;opacity:.85;z-index:0;transition:none}.ch-bar i{z-index:1}
.ch-mega .ch-bar i{background:linear-gradient(180deg,#ff6a5a,#c0101e 55%,#6a0008)}.ch-whale .ch-bar i{background:linear-gradient(180deg,#ffffff,#cfe3ea 55%,#7fa2b0)}
#clash-hud[data-mood="ENRAGED"] .ch-whale .ch-bar i{background:linear-gradient(180deg,#fff,#ffb0a0 55%,#c0302a)}#clash-hud[data-mood="REELING"] .ch-whale .ch-bar{animation:ch-blink .35s steps(2) infinite}
#clash-hud[data-mood="ENRAGED"] .ch-whale small,#clash-hud[data-mood="REELING"] .ch-whale small{color:#ff5a4a}
.ch-vs{flex:0 0 auto;text-align:center;min-width:70px}.ch-vs b{display:block;font:900 italic 34px/1 Georgia,serif;color:#ffd24a;text-shadow:0 3px 0 #6a3a00,0 0 18px #ff9a2a}.ch-vs small{display:block;font:800 15px Helvetica,Arial,sans-serif;color:#fff;text-shadow:0 2px 0 #000}.ch-vs em{display:block;margin-top:3px;font:900 italic 13px Helvetica,Arial,sans-serif;color:#ff7a3a;text-shadow:0 1px 2px #000;white-space:nowrap}
.ch-intro{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:3vw;background:radial-gradient(ellipse at 50% 50%,#000a,#0000 70%)}
.ch-intro b{font:900 italic clamp(26px,5.4vw,66px)/1 Georgia,serif;letter-spacing:.04em;text-shadow:0 4px 0 #000,0 0 30px #000}.ch-intro .l{color:#ff3a2a}.ch-intro .r{color:#f4f8fa}.ch-intro i{font:900 italic clamp(40px,8vw,104px)/1 Georgia,serif;color:#ffd24a;text-shadow:0 5px 0 #6a3a00,0 0 40px #ff9a2a}
.ch-intro.go .l{animation:ch-from-l .55s cubic-bezier(.2,1.4,.4,1) both}.ch-intro.go .r{animation:ch-from-r .55s .15s cubic-bezier(.2,1.4,.4,1) both}.ch-intro.go i{animation:ch-slam .5s .55s cubic-bezier(.2,1.8,.4,1) both}.ch-intro.go{animation:golden-out .6s 3.7s both}
@keyframes ch-from-l{from{transform:translateX(-80vw) skewX(-12deg);opacity:0}}@keyframes ch-from-r{from{transform:translateX(80vw) skewX(-12deg);opacity:0}}@keyframes ch-slam{from{transform:scale(4);opacity:0}}@keyframes ch-blink{50%{opacity:.35}}
.ch-call{position:absolute;left:50%;top:21%;transform:translateX(-50%);text-align:center;width:min(760px,92vw)}.ch-call b{display:block;font:900 italic clamp(26px,4.6vw,52px)/1 Georgia,serif;color:#ffdf3a;letter-spacing:.06em;text-shadow:0 4px 0 #6a1a00,0 0 24px #ff3a1a;animation:ch-blink .4s steps(2) infinite}.ch-call span{display:block;margin-top:8px;font:800 clamp(13px,1.8vw,17px) Helvetica,Arial,sans-serif;color:#fff;text-shadow:0 2px 6px #000,0 0 10px #000}
.ch-call[data-kind="song"] b{color:#8ae8ff;text-shadow:0 4px 0 #003a5a,0 0 24px #2ab8ff}.ch-call[data-kind="maelstrom"] b{color:#b8f0ff;text-shadow:0 4px 0 #002a3a,0 0 24px #00d0ff}
#clash-hud:not([data-rider="1"]) .ch-call b{font-size:clamp(18px,2.6vw,28px);animation:none}
.ch-pop{position:absolute;left:50%;top:40%;transform:translateX(-50%);text-align:center}.ch-pop b{display:block;font:900 italic clamp(30px,5vw,60px)/1 Georgia,serif;color:#ff3a2a;text-shadow:0 4px 0 #3a0000,0 0 22px #ff1a1a}.ch-pop span{display:block;margin-top:4px;font:900 clamp(14px,2vw,20px) Helvetica,Arial,sans-serif;color:#ffe2a8;text-shadow:0 2px 4px #000}
.ch-pop[data-kind="hurt"] b{color:#e8f6ff;text-shadow:0 4px 0 #002233,0 0 22px #8ad8ff}.ch-pop[data-kind="dodge"] b{color:#7aff9a;text-shadow:0 4px 0 #003a10,0 0 22px #2aff6a}
.ch-pop[data-kind="fight"] b{font-size:clamp(60px,12vw,150px);color:#ffd24a;text-shadow:0 6px 0 #6a3a00,0 0 40px #ff9a2a}
.ch-pop.go b{animation:ch-slam .4s cubic-bezier(.2,1.8,.4,1) both}.ch-pop.go span{animation:golden-fade .3s .15s both}
.ch-hurt{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,transparent 35%,#ff1a2a88 80%,#7a0008cc);opacity:0}.ch-hurt.go{animation:ch-hurt .7s ease-out both}@keyframes ch-hurt{0%{opacity:1}100%{opacity:0}}
.ch-finish{position:absolute;left:50%;top:26%;transform:translateX(-50%);font:900 italic clamp(44px,9vw,120px)/1 Georgia,serif;color:#ff1a2a;letter-spacing:.06em;text-shadow:0 6px 0 #2a0000,0 0 40px #ff0010;animation:ch-blink .3s steps(2) infinite,rite-shake .14s infinite;white-space:nowrap}
.ch-finish:not([data-rider="1"]){font-size:clamp(26px,4vw,48px)}
.ch-end{position:absolute;left:50%;top:22%;transform:translateX(-50%);text-align:center;width:min(880px,94vw)}.ch-end b{display:block;font:900 italic clamp(44px,9vw,120px)/1 Georgia,serif;letter-spacing:.04em;color:#fff;text-shadow:0 6px 0 #000,0 0 40px #ff1a1a}.ch-end span{display:block;margin-top:12px;font:800 clamp(14px,2vw,20px) Helvetica,Arial,sans-serif;color:#ffe8d0;text-shadow:0 2px 6px #000}
.ch-end[data-kind="slain"] b{text-shadow:none;background:linear-gradient(180deg,#fff2b0,#ffb02a 40%,#c0101e 75%,#4a0006);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 22px #ff2a1a) drop-shadow(0 5px 0 #200)}
.ch-end[data-kind="whale"] b{font-size:clamp(80px,16vw,200px);color:#f4f8fa;text-shadow:0 8px 0 #7a0008,0 0 50px #ff1a1a}.ch-end[data-kind="parted"] b{font-size:clamp(30px,5vw,60px);color:#cfe8ff;text-shadow:0 4px 0 #001a2a}
.ch-end.go b{animation:ch-slam .6s cubic-bezier(.2,1.6,.4,1) both}.ch-end.go span{animation:golden-fade .5s .4s both}.ch-end[data-kind="slain"].go b{animation-delay:2.6s}.ch-end[data-kind="slain"].go span{animation-delay:3s}
.ch-keys{position:absolute;left:50%;bottom:92px;transform:translateX(-50%);padding:6px 14px;border-radius:5px;background:#000a;color:#ffe8c8;font:700 12px Helvetica,Arial,sans-serif;white-space:nowrap}
@media(prefers-reduced-motion:reduce){.ch-intro.go b,.ch-intro.go i,.ch-call b,.ch-pop.go b,.ch-finish,.ch-end.go b,#clash-hud[data-mood="REELING"] .ch-whale .ch-bar{animation:none}}
/* The Reign of the Sun Priest (Web/src/sun-hud.js): the tonalli disc and powers, who holds the Sun's favour, and the news. */
#sun-hud{position:fixed;inset:0;z-index:10;pointer-events:none;font-family:Helvetica,Arial,sans-serif}#sun-hud[hidden],#sun-hud [hidden]{display:none!important}
.sh-priest{position:absolute;left:16px;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;background:linear-gradient(135deg,#2a1204e8,#120802e8);border:2px solid #e8a83a;box-shadow:0 0 22px #ff9a2a55,0 10px 30px #000a}
.sh-disc{--fill:0deg;position:relative;width:78px;height:78px;border-radius:50%;background:conic-gradient(#ffd24a 0 var(--fill),#3a1a06 var(--fill) 360deg);box-shadow:0 0 18px #ffb02a88;display:grid;place-items:center;flex:0 0 auto}
.sh-disc i{position:absolute;inset:8px;border-radius:50%;background:radial-gradient(circle,#2a1204 0 60%,#1a0a02);box-shadow:inset 0 0 10px #000}
.sh-disc b{position:relative;font:900 22px/1 Georgia,serif;color:#ffe08a;text-shadow:0 0 8px #ff9a2a}.sh-disc small{position:absolute;bottom:17px;font:700 8px Helvetica,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#d8a85a}
.sh-side strong{display:block;font:900 italic 16px Georgia,serif;letter-spacing:.08em;color:#ffd24a;text-shadow:0 0 10px #ff8a1a}.sh-hearts{display:block;margin:2px 0 7px;font:700 11px Helvetica,Arial,sans-serif;color:#ff8a8a}
.sh-power{display:flex;align-items:center;gap:7px;margin-top:4px;position:relative;padding:3px 8px 3px 3px;border-radius:5px;background:#0006;overflow:hidden}.sh-power kbd{min-width:24px;padding:3px 5px;text-align:center;border-radius:4px;background:#ffd24a;color:#2a1204;font:900 12px Helvetica,Arial,sans-serif}
.sh-power em{font:800 12px Helvetica,Arial,sans-serif;font-style:normal;color:#fff2d8}.sh-power small{margin-left:auto;font:700 11px Helvetica,Arial,sans-serif;color:#ffcf6a}
.sh-power[data-state="off"]{opacity:.45}.sh-power[data-state="wait"] kbd{background:#8a6a3a}.sh-power[data-state="ready"]{box-shadow:inset 0 0 0 1px #ffd24a66}
.sh-watch{position:absolute;right:16px;top:78px;max-width:min(420px,60vw);padding:7px 12px;border-radius:6px;background:#2a1204e0;border:1px solid #e8a83a;color:#ffe8c0;font:700 12px Helvetica,Arial,sans-serif;box-shadow:0 0 14px #ff9a2a44}
.sh-news{position:absolute;left:50%;top:24%;transform:translateX(-50%);width:min(860px,94vw);text-align:center}
.sh-news b{display:block;font:900 italic clamp(38px,7.5vw,92px)/1 Georgia,serif;letter-spacing:.05em;background:linear-gradient(180deg,#fffbe0 0%,#ffd24a 40%,#ff7a1a 80%,#a8300a 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 22px #ff9a2a) drop-shadow(0 5px 0 #3a1200)}
.sh-news span{display:block;margin-top:12px;font:800 clamp(14px,2vw,19px) Helvetica,Arial,sans-serif;color:#fff2d8;text-shadow:0 2px 8px #000c,0 0 14px #ff9a2a88}
.sh-news[data-kind="lost"] b,.sh-news[data-kind="stolen"] b{background:linear-gradient(180deg,#e8e0d0,#a89a80 60%,#5a4a30);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 4px 0 #1a1408)}
.sh-news[data-kind="struck"] b{font-size:clamp(30px,5vw,60px)}.sh-news[data-kind="dawn"] b{font-size:clamp(34px,6.5vw,84px)}
.sh-news.go b{animation:rite-slam .7s cubic-bezier(.2,1.5,.4,1) both}.sh-news.go span{animation:golden-fade .5s .35s both}
.sh-struck{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,transparent 30%,#ff7a1a77 75%,#a8300acc);opacity:0}.sh-struck.go{animation:ch-hurt 1.2s ease-out both}
@media(prefers-reduced-motion:reduce){.sh-news.go b,.sh-news.go span,.sh-struck.go{animation:none}}
