:root{font-family:system-ui,sans-serif;color:#fff3d5;background:#9ebdb6;font-synthesis:none;--panel: #143b33f2;--line: #f8efd733}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input{font:inherit}button{cursor:pointer;color:inherit;border:1px solid var(--line);background:#214c41;border-radius:5px;padding:12px 18px}button:hover{background:#326354}button:disabled{opacity:.5;cursor:default}button:focus-visible,input:focus-visible{outline:2px solid #f6c474;outline-offset:4px}[hidden]{display:none!important}#world{position:fixed;inset:0;background:linear-gradient(#b7d5cd,#e8ead8 70%)}#world canvas{display:block;width:100%;height:100%;touch-action:none}.title-screen{position:fixed;inset:0;display:flex;align-items:center;background:linear-gradient(90deg,#0b282cd9 0%,#102e2d9c 32%,#173c3220 62%,transparent 85%),linear-gradient(0deg,#0c292c88,transparent 35%)}.title-content{position:relative;margin-left:7.5vw;width:min(530px,42vw);padding:40px 0}h1{position:relative;display:inline-block;font-family:Impact,Arial Black,sans-serif;font-size:clamp(66px,7.8vw,118px);line-height:.8;letter-spacing:-3px;font-weight:950;text-shadow:0 3px 0 #5d603e,0 7px 0 #142e2a,0 14px 26px #071f2377;transform:rotate(-4deg);margin:0 0 58px}h1 small{color:#fff1ca;font-size:.58em;letter-spacing:-1px}h1 span{color:#f3c577}h1 i{position:absolute;width:5px;height:80%;background:#d96c41;right:9%;top:22%;transform:rotate(34deg);border-radius:8px;box-shadow:2px 0 #422f25}h1 i:after{content:"";position:absolute;width:16px;height:31%;border-radius:5px 5px 8px 8px;bottom:-5px;left:-6px;background:#e68b4e;border:2px solid #f4b276}.title-screen nav{width:min(285px,100%);display:grid;gap:5px}.title-screen nav button{position:relative;text-align:left;background:transparent;border-color:transparent;border-radius:2px;font-size:17px;padding:12px 20px;letter-spacing:.2px;color:#e6e7ce;transition:background .15s,transform .15s}.title-screen nav button:hover,.title-screen nav button:focus-visible{background:#fff2cf16;transform:translate(5px)}.title-screen nav .primary{background:#efc37c;color:#203a32;box-shadow:0 4px #98734366;margin-bottom:8px;font-weight:800}.title-screen nav .primary:after{content:"↗";position:absolute;right:20px;font-size:23px;top:9px}.title-screen nav .primary:hover{background:#ffdb9f}.title-screen nav .quiet{font-size:12px;opacity:.7;margin-top:6px}.primary{background:#e8bc72;color:#183c32;font-weight:700}.primary:hover{background:#f3ce8e}.quiet{background:transparent;border-color:transparent;font-size:12px}#menu-message{font-size:12px;line-height:1.6;max-width:min(370px,90vw);min-height:20px}#menu-button{position:fixed;right:18px;top:18px;padding:5px 10px;background:#153b3355;border-color:transparent;font-size:18px;z-index:2}.lobby{position:fixed;bottom:25px;left:50%;transform:translate(-50%);width:360px;max-width:calc(100% - 32px);padding:20px 24px;background:var(--panel);border:1px solid var(--line);border-radius:7px;text-align:center}h2{font-size:24px;margin:0 0 12px;line-height:1.1;letter-spacing:-.7px}#crew-count{font-size:12px;color:#d7ddc9;margin:0 0 14px}#crew{list-style:none;padding:0;margin:0 0 16px;display:flex;justify-content:center;gap:12px}.crew-seat{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:9px;width:60px;color:#c9d8c3}.seat-dot{height:20px;width:20px;display:grid;place-items:center;border:1px solid #fff3d577;border-radius:50%;font-size:10px}.connected .seat-dot{background:var(--seat-color);color:#163d34;border-color:transparent}.mine .seat-dot{outline:2px solid #fff3d5;outline-offset:2px}.lobby-actions{display:flex;gap:8px}.lobby-actions button{flex:1;font-size:12px;padding:10px 8px}.control-note{font-size:10px;line-height:1.7;margin:12px 0 0;color:#cfdbc6}.notice{position:fixed;top:22%;left:50%;transform:translate(-50%);padding:12px 18px;background:var(--panel);border-radius:5px;font-size:12px;max-width:calc(100% - 32px);text-align:center}.result-screen{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#102f2c75;text-align:center}.result-screen h2{font-family:Impact,Arial Black,sans-serif;font-size:clamp(48px,8vh,85px);text-transform:uppercase;margin:0}.result-screen p{font-size:13px;margin:3px 0 15px}.result-screen .primary{min-width:220px}#toast{position:fixed;top:65px;left:50%;transform:translate(-50%);background:var(--panel);border-radius:5px;padding:10px 16px;font-size:12px;opacity:0;transition:opacity .15s;pointer-events:none;z-index:4;width:max-content;max-width:min(420px,calc(100% - 32px));text-align:center}#toast.show{opacity:1}dialog{width:350px;max-width:calc(100% - 32px);max-height:calc(100dvh - 32px);overflow-y:auto;color:#fff3d5;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:26px;box-shadow:0 10px 60px #0e2e3366}dialog::backdrop{background:#0e2e3366;backdrop-filter:blur(3px)}dialog h2{font-size:24px;font-weight:600;margin:4px 0 18px}dialog p{font-size:12px;line-height:1.8;color:#c8d9c8}.dialog-close{position:absolute;top:8px;right:10px;background:transparent;border:0;padding:0 6px;font-size:24px}dialog .primary{width:100%}.menu-actions{display:grid;gap:6px;margin-top:12px}.menu-actions button{font-size:12px;text-align:left}.setting{display:flex;justify-content:space-between;gap:12px;font-size:12px;margin:18px 0}input[type=checkbox]{accent-color:#e8bc72}#join-form label{font-size:11px}#room-code{display:block;width:100%;background:#fff6df;color:#183c32;border:0;border-radius:4px;padding:12px;font-size:12px;margin:9px 0 16px}dl{display:grid;grid-template-columns:40px 1fr;gap:15px;align-items:center;font-size:13px}dt{font-size:23px;color:#efbf6e}dd{margin:0}@media(max-height:620px){h1{font-size:58px}.title-screen{padding-top:14px}.title-screen nav{gap:6px}.title-screen nav button{padding:9px 14px}.lobby{padding:14px 18px;bottom:12px}.control-note{margin-top:8px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}@media(max-width:700px)and (min-height:621px){.title-screen{justify-content:center;background:linear-gradient(#102b2d99,transparent 48%,#102b2ddd 85%)}.title-content{position:static;width:calc(100% - 48px);margin:0;text-align:center;padding:0}h1{position:absolute;top:85px;left:50%;transform:translate(-50%) rotate(-4deg);font-size:min(17vw,100px);white-space:nowrap}.title-screen nav{position:absolute;bottom:100px;left:50%;transform:translate(-50%);width:245px}.title-screen nav button{font-size:15px;padding:10px 18px}#menu-message{position:absolute;bottom:25px;left:5%;width:90%;font-size:10px}}@media(max-height:620px){.title-content{width:45vw;padding:16px 0}h1{margin-bottom:16px;font-size:64px}.title-screen nav{gap:0;width:230px}.title-screen nav button{font-size:13px;padding:8px 16px}.title-screen nav .primary:after{top:1px}#menu-message{margin:6px 0 0;min-height:0}}input[type=range]{width:130px;accent-color:#e8bc72}