:root{font-family:system-ui,"Noto Sans TC",sans-serif;background:#101526;color:#f9f1df}*{box-sizing:border-box}body{margin:0}button{font:inherit}.layout{min-height:100vh;display:flex;align-items:center;justify-content:center;gap:24px;padding:22px;background:radial-gradient(circle at 35% 15%,#2d2d58 0,#171a32 46%,#0d1020 100%)}.game-shell{height:min(92vh,850px);aspect-ratio:9/16;min-height:570px;position:relative;overflow:hidden;border:5px solid #b99354;border-radius:26px;background:linear-gradient(#101e54,#563761 55%,#bc745f);box-shadow:0 28px 80px #050914a8,0 0 0 2px #e6be71 inset;touch-action:none}.game-shell:after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 90px #0c0d35b0}canvas{width:100%;height:100%;display:block}.topbar,.hud,.meter,.bottom,.message{position:absolute;z-index:2}.topbar{top:15px;left:17px;right:17px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:22px;font-weight:1000;letter-spacing:.06em;color:#fce6a6;text-shadow:0 2px 10px #141134}.brand em{font-style:normal;font-size:13px;letter-spacing:.1em;margin-left:4px;color:#fff}.badge{font-size:11px;background:#261d42c9;border:1px solid #d5aa70;padding:6px 9px;border-radius:99px}.hud{top:57px;left:17px;right:17px;display:flex;justify-content:space-between;font-weight:800;font-size:12px;text-shadow:0 2px 5px #171128}.meter{top:82px;left:17px;right:17px;height:8px;border-radius:20px;background:#261a4c9e;border:1px solid #d8ad79;overflow:hidden}.meter div{height:100%;width:0;background:linear-gradient(90deg,#e77daf,#f8d47e,#67d5dc);border-radius:20px}.bottom{bottom:15px;left:14px;right:14px;display:flex;align-items:center;justify-content:space-between;gap:9px;padding:8px 10px;border:1px solid #e5bc85;background:#1d1b39c9;border-radius:12px;font-size:11px;font-weight:700}.bottom button{background:#ffd084;border:0;color:#30213a;border-radius:8px;padding:7px 9px;font-weight:800;white-space:nowrap;cursor:pointer}.message{left:50%;top:37%;width:80%;transform:translateX(-50%);text-align:center;font-weight:900;text-shadow:0 2px 12px #151330;font-size:20px;transition:opacity .4s}.message.hidden{opacity:0;pointer-events:none}.notes{max-width:350px;background:#1c2038;border:1px solid #675471;border-radius:20px;padding:27px;box-shadow:0 20px 50px #080a1799}.eyebrow{font-size:11px!important;color:#e4b777!important;font-weight:800;letter-spacing:.16em}.notes h1{font-size:28px;line-height:1.2;margin:8px 0 18px;color:#f5d692}.notes h2{font-size:15px;margin:23px 0 10px;color:#ffe0a6}.notes p,.notes li{font-size:13px;line-height:1.65;color:#e1deea}.notes ul{padding-left:20px}.notes a{color:#f4cc8c}.swatches{display:flex;flex-wrap:wrap;gap:7px}.swatches span{font-size:11px;font-weight:800;border-radius:99px;padding:5px 9px;color:#1d1c38}.mexico{background:#f591b6}.egypt{background:#71d4d3}.volcano{background:#ef9868}.olympus{background:#a8baf9}.caution{border-left:3px solid #e5b670;padding-left:11px;color:#f1d8b7!important}@media(max-width:800px){.layout{padding:0;display:block}.game-shell{height:100dvh;min-height:0;width:100%;aspect-ratio:auto;border:0;border-radius:0}.notes{max-width:none;border-radius:0}.bottom{font-size:10px}}@media(max-height:690px) and (min-width:801px){.game-shell{height:95vh;min-height:0}}
.crowd-preview{display:flex;align-items:center;gap:8px;margin:14px 0 18px;font-size:12px;font-weight:800;color:#f7deb0}.crowd-preview span{margin-right:auto}.crowd-preview button{width:30px;height:30px;border:1px solid #d4ad75;border-radius:8px;background:#f4d18e;color:#28213a;cursor:pointer;font-size:18px;font-weight:900}.crowd-preview button:disabled{opacity:.4;cursor:default}.crowd-preview strong{min-width:35px;text-align:center}
.gate-hint{position:absolute;z-index:2;top:99px;left:50%;transform:translateX(-50%);padding:5px 11px;border:1px solid #e9c787;border-radius:99px;background:#211d45cc;color:#ffe5a3;font-size:12px;font-weight:900;white-space:nowrap}.message{background:#211a42b8;border-radius:14px;padding:10px 12px;line-height:1.35}
.gate-hint.boss-warning{background:#582645e8;border-color:#ffb2a2;color:#fff2ce;box-shadow:0 0 16px #ef6e7955}.gate-hint.boss-strike{background:#a3304be8;border-color:#ffe2a5;color:#fff;box-shadow:0 0 24px #ff687aaa}
.gem-score{position:absolute;z-index:2;top:134px;left:50%;transform:translateX(-50%);padding:5px 12px;border:1px solid #d5b98a;border-radius:99px;background:#251b42d9;color:#ffe2a2;font-size:12px;font-weight:900;white-space:nowrap}
.result-panel[hidden]{display:none!important}.result-panel{position:absolute;z-index:5;left:7%;right:7%;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px;align-items:center;padding:24px 18px;border:2px solid #f7d89a;border-radius:20px;background:linear-gradient(155deg,#25204af2,#3e275bf2);box-shadow:0 12px 48px #090917dd;text-align:center}.result-panel h2{margin:0;color:#ffe3a3;font-size:23px}.result-panel p{margin:0;color:#f7eddd;font-size:14px;line-height:1.6}.result-panel strong{color:#89eff0;font-size:18px;line-height:1.4}.result-panel button{border:0;border-radius:9px;background:#ffd084;color:#30213a;padding:9px 22px;font-weight:900;cursor:pointer}
.boss-health[hidden]{display:none!important}.boss-health{position:absolute;z-index:2;top:169px;left:17%;right:17%;padding:5px 9px 8px;border:1px solid #f0c290;border-radius:11px;background:#301735e8;text-align:center;color:#ffe5aa;font-size:11px;font-weight:900;text-shadow:0 2px 4px #2a1838}.boss-health-track{margin-top:4px;height:9px;overflow:hidden;border-radius:99px;background:#210f32;border:1px solid #ddad7b}.boss-health-track div{height:100%;width:100%;background:linear-gradient(90deg,#f9b464,#e94c76);transition:width .2s}.bottom button{flex-shrink:0}.bottom #sound-toggle{background:#49375e;color:#ffe3a4;border:1px solid #d5ad7e;padding:6px 7px;font-size:10px}.bottom #sound-toggle[aria-pressed="false"]{opacity:.72}
.brand{display:flex;align-items:center;gap:5px}.brand-logo{position:relative;display:block;width:100px;height:31px;overflow:hidden;flex:none}.brand-logo img{position:absolute;display:block;width:190px;height:auto;left:-45px;top:-11px}.brand em{font-size:12px;margin-left:0;white-space:nowrap}.message.play-toast{top:auto;bottom:69px;width:min(78%,300px);padding:7px 10px;border:1px solid #e0bd87;background:#211b3ddd;font-size:12px;line-height:1.3;text-shadow:0 1px 3px #150e2a;pointer-events:none}.game-shell.damage-flash::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;box-shadow:inset 0 0 65px #ff4e73a8}
.brand{gap:12px}.brand-logo{width:104px}

/* 用途：同一張使用者指定圖作開場封面；執行：模型載入後啟用 PLAY，點擊才開始跑。注意：窄螢幕保留完整人物與蛇，旁邊用模糊圖補滿。 */
.start-cover[hidden]{display:none!important}
.start-cover{position:absolute;inset:0;z-index:10;isolation:isolate;overflow:hidden;background:#10172d;text-align:center}
.cover-backdrop,.cover-art{position:absolute;inset:0;width:100%;height:100%;display:block}
.cover-backdrop{object-fit:cover;filter:blur(22px) brightness(.48);transform:scale(1.12)}
.cover-art{object-fit:contain;filter:saturate(1.03)}
.start-cover::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#080e2ac4 0%,#080e2a48 21%,transparent 38%,transparent 67%,#1212267a 100%)}
.cover-heading{position:absolute;z-index:2;top:5.5%;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:1px;pointer-events:none;filter:drop-shadow(0 3px 12px #080e32)}
.cover-logo{position:relative;display:block;width:min(64%,282px);aspect-ratio:3.25/1;overflow:hidden}
.cover-logo img{position:absolute;display:block;width:175%;height:auto;left:50%;top:50%;transform:translate(-50%,-50%)}
.cover-heading strong{color:#fff1ce;font-size:clamp(20px,3.3vh,28px);font-weight:1000;letter-spacing:.2em;text-indent:.2em;text-shadow:0 2px 8px #17122d}
.cover-actions{position:absolute;z-index:2;left:50%;bottom:7.5%;width:min(82%,300px);transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:9px}
.cover-play{width:min(100%,215px);min-height:58px;border:2px solid #fff2c3;border-radius:18px;background:linear-gradient(180deg,#ffe6a3,#f5ae58);box-shadow:0 6px 0 #7a3b52,0 10px 24px #08081fa8;color:#442343;font-size:24px;font-weight:1000;letter-spacing:.19em;text-indent:.19em;cursor:pointer}
.cover-play:disabled{opacity:.7;cursor:wait}
.cover-play:not(:disabled):hover,.cover-play:not(:disabled):focus-visible{background:linear-gradient(180deg,#fff6c7,#ffc273);outline:3px solid #fff;outline-offset:3px}
.cover-actions p{margin:0;padding:4px 10px;border-radius:99px;background:#191431bd;color:#fff3db;font-size:11px;font-weight:800;text-shadow:0 2px 6px #0b0b25}
@media(max-height:650px){.cover-heading{top:3%}.cover-actions{bottom:4%}.cover-play{min-height:49px}}