@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Noto+Sans+TC:wght@400;500;600;700;800;900&display=swap";:root{font-family:DM Sans,Noto Sans TC,system-ui,sans-serif;color:#f3f1e8;background:#18232c;font-synthesis:none}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}#arena{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}.vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(11,20,28,.78) 0%,rgba(11,20,28,.18) 31%,transparent 57%),linear-gradient(0deg,rgba(12,21,29,.72) 0%,transparent 34%),linear-gradient(180deg,rgba(12,21,29,.38),transparent 20%)}.topbar{position:absolute;top:0;left:0;right:0;height:92px;padding:0 3.2vw;display:flex;align-items:center;gap:18px;z-index:5;border-bottom:1px solid rgba(255,255,255,.15);background:linear-gradient(180deg,rgba(12,25,34,.48),transparent)}.brand{display:flex;align-items:center;gap:13px;margin-right:auto}.brand-mark{font-size:31px;font-weight:900;line-height:1;background:#f6ca65;color:#1a2630;border-radius:12px;padding:7px 8px;letter-spacing:-5px;box-shadow:0 4px 25px #f6c86744}.brand-mark span{font-size:13px;vertical-align:middle;margin-right:4px}.brand strong{font-size:19px;letter-spacing:.11em;line-height:1.1}.brand .three{font-size:11px;color:#ffd16c;padding-left:6px}.brand small{display:block;color:#b9c9ce;font-size:8px;letter-spacing:.22em;margin-top:6px}.round-pill{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.08em;border:1px solid #ffffff45;background:#142430a9;border-radius:100px;padding:10px 18px;white-space:nowrap;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.pulse{width:7px;height:7px;border-radius:50%;background:#a7e6a8;box-shadow:0 0 10px #a7e6a8;animation:pulse 2s infinite}.divider{width:1px;height:15px;background:#fff5;margin:0 5px}.icon-button{border:1px solid #ffffff50;color:#fff;background:#17293799;border-radius:12px;padding:11px 14px;white-space:nowrap}.icon-button span{font-size:11px}.left-panel{position:absolute;top:130px;left:3.4vw;width:min(274px,25vw);z-index:4}.eyebrow{font-size:10px;letter-spacing:.22em;color:#f7cd74;font-weight:800}.left-panel h1{font-size:clamp(26px,2.7vw,43px);letter-spacing:-.05em;line-height:1.22;margin:19px 0;font-weight:900}.left-panel h1 em,.intro h2 em{color:#ffd370;font-style:normal}.left-panel p{font-size:13px;color:#d5dce0;line-height:1.85;max-width:260px}.stat-grid{display:flex;gap:14px;margin:28px 0}.stat-grid>div{background:#182b37be;border:1px solid #ffffff2f;border-radius:13px;padding:12px 16px;min-width:104px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.stat-grid small{display:block;color:#b2c1c8;font-size:11px}.stat-grid b{display:block;font-size:28px;color:#ffda86;margin-top:3px}.players-title{display:flex;justify-content:space-between;font-size:12px;font-weight:800;margin-bottom:11px}.players-title span{color:#aee5b6;font-size:10px;font-weight:600}.roster{max-height:194px;overflow:auto;scrollbar-width:thin}.roster-item{display:flex;align-items:center;gap:10px;padding:7px 5px;border-bottom:1px solid #ffffff20;font-size:12px}.roster-item .avatar{color:#f8cb69}.roster-item small{margin-left:auto;color:#c8d2d5;font-size:10px}.roster-item.out{opacity:.4}.roster-item.self{color:#ffd77b}.mode{font-size:10px;color:#bad1cf;margin-top:13px}.view-controls{position:absolute;right:3.4vw;top:112px;z-index:4;display:flex;align-items:center;gap:13px;color:#e1e8e9;font-size:10px;text-shadow:0 1px 4px #17232c}.view-controls button{border:1px solid #ffffff5b;color:#fff;border-radius:100px;background:#1c303eaf;padding:9px 14px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.target-card{position:absolute;right:3.4vw;top:170px;z-index:5;display:flex;align-items:center;gap:15px;background:#182936f2;border:1px solid #fcd27988;box-shadow:0 15px 50px #0006;border-radius:14px;padding:13px 37px 13px 15px}.target-card[hidden]{display:none}.target-card small{display:block;color:#b2bdc5;font-size:10px}.target-card b{display:block;font-size:16px;margin-top:3px}.target-card span{display:block;color:#ffdb8a;font-size:10px;margin-top:4px}.target-card button:not(.target-close){border:0;background:#ffcf6d;border-radius:9px;padding:11px;color:#20303b;font-weight:800;font-size:12px}.target-close{position:absolute;right:6px;top:5px;border:0;background:none;color:#cdd3d6;font-size:21px}.toast{position:absolute;z-index:20;top:115px;left:50%;transform:translate(-50%,-10px);opacity:0;pointer-events:none;background:#172833ec;border:1px solid #ffcd76;border-radius:10px;color:#fff1d2;padding:12px 20px;box-shadow:0 12px 30px #0006;transition:.25s;font-size:13px;text-align:center}.toast.show{opacity:1;transform:translate(-50%)}.controls-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.controls-head h2{font-size:19px;margin:5px 0 0;letter-spacing:-.02em}.controls-head>span{color:#9febb0;font-size:11px}.control-wrap{position:absolute;bottom:2vw;left:50%;transform:translate(-50%);z-index:4;width:min(820px,86vw);padding:19px 24px 20px;background:linear-gradient(145deg,#1c303bec,#10222ef3);border:1px solid #ffffff3c;border-radius:20px;box-shadow:0 22px 80px #071017a9,inset 0 1px #ffffff1a;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}.controls-grid{display:grid;grid-template-columns:150px minmax(170px,1fr) 186px;align-items:center;gap:28px}.dial-wrap{display:flex;align-items:center;gap:12px}.dial{width:96px;height:96px;border-radius:50%;background:radial-gradient(circle at center,#203947,#1a303c 61%,#3f5b64 62%,#1b333f 67%);border:1px solid #72909c;position:relative;flex:none;touch-action:none;box-shadow:inset 0 4px 14px #08151b,0 7px 18px #0005}.dial-rings{position:absolute;inset:10px;border:1px dashed #a9bdc866;border-radius:50%}.dial-center{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:10px;text-align:center;color:#d9e2e5;line-height:1.4;pointer-events:none}.dial-arrow{position:absolute;left:50%;top:50%;color:#ffd269;font-size:25px;line-height:1;margin-top:-33px;transform:translate(-50%,-50%) rotate(0);transform-origin:50% calc(50% + 33px);pointer-events:none}.dial-text{font-size:10px;color:#b2c7ce;line-height:1.8;white-space:nowrap}.dial-text strong{display:block;color:#ffe0a0;font-size:17px}.sliders{display:grid;grid-template-columns:1fr;gap:3px}.sliders label{display:flex;justify-content:space-between;font-size:11px;font-weight:700;color:#d6e0e4}.sliders output{font-size:12px;color:#ffe09d}.sliders input{width:100%;accent-color:#ffcf70;cursor:pointer;margin:5px 0 10px}.tip{color:#b5c6cb;font-size:10px;line-height:1.5}.fire-button{height:82px;border:0;border-radius:12px;background:linear-gradient(135deg,#ffdc8b,#f0ac4e);color:#27313a;box-shadow:0 8px 25px #e4a34f52,inset 0 2px #fff7cc;display:flex;align-items:center;justify-content:space-around;text-align:left;font-size:16px;font-weight:900;transition:transform .17s}.fire-button:hover:not(:disabled){transform:translateY(-3px)}.fire-button .banana{font-size:25px}.fire-button small{display:block;font-size:9px;letter-spacing:.16em;margin-top:4px}.fire-button .arrow{font-size:23px}.intro{position:absolute;inset:0;z-index:30;background:linear-gradient(115deg,#0d1c28ef,#172b37dc 53%,#152d3a8a);display:flex;align-items:center;justify-content:center;text-align:center;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:opacity .5s,visibility .5s}.intro.gone{opacity:0;visibility:hidden;pointer-events:none}.intro-inner{width:min(560px,88vw)}.intro-top,.intro-kicker{font-size:11px;color:#fbd17a;letter-spacing:.2em;font-weight:800}.intro-top{margin-bottom:30px}.intro-glyph{display:inline-flex;width:82px;height:82px;align-items:center;justify-content:center;font-size:38px;border:1px solid #fbd27c8a;border-radius:22px;background:#fbd47a16;transform:rotate(-7deg);box-shadow:0 0 50px #edbc5b22;margin-bottom:27px}.intro h2{font-size:clamp(44px,6vw,78px);line-height:1.14;letter-spacing:-.07em;margin:14px 0;font-weight:900}.intro p{font-size:14px;line-height:1.85;color:#d3e0e3;max-width:475px;margin:20px auto}.intro-steps{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin:30px 0}.intro-steps span{font-size:11px;border:1px solid #ffffff50;background:#ffffff14;border-radius:100px;padding:8px 13px}.start-button{background:#ffd27a;border:0;color:#1d2d35;border-radius:13px;width:min(285px,100%);padding:16px;font-size:15px;font-weight:900;box-shadow:0 10px 38px #ffcf7249}.start-button span{margin-left:15px}.intro-inner>small{display:block;color:#a9bdc4;font-size:10px;margin-top:16px}@keyframes pulse{50%{opacity:.3;box-shadow:0 0 1px #a7e6a8}}@media(max-width:960px){.left-panel{top:102px;width:220px}.left-panel h1{font-size:27px;margin:10px 0}.left-panel p{font-size:11px}.stat-grid{margin:12px 0}.controls-grid{grid-template-columns:132px 1fr 160px;gap:15px}.control-wrap{width:92vw}.view-controls>span{display:none}}@media(max-width:650px){.topbar{height:62px;padding:0 13px}.brand-mark{font-size:22px}.brand strong{font-size:13px}.brand small{display:none}.round-pill{font-size:10px;padding:8px 10px}.icon-button{padding:8px}.left-panel{top:76px;left:15px;width:155px;pointer-events:none}.left-panel h1{font-size:22px;margin:5px 0}.left-panel p,.left-panel .eyebrow,.players-title,.roster,.mode{display:none}.stat-grid{gap:5px;margin:8px 0}.stat-grid>div{min-width:66px;padding:6px 8px}.stat-grid small{font-size:8px}.stat-grid b{font-size:17px}.view-controls{top:75px;right:12px}.view-controls button{font-size:11px;padding:7px}.view-controls button span{display:none}.target-card{right:10px;top:120px;max-width:240px;padding:10px 27px 10px 10px;gap:7px}.target-card b{font-size:12px}.target-card button:not(.target-close){font-size:9px;padding:8px}.control-wrap{bottom:calc(8px + env(safe-area-inset-bottom));width:calc(100% - 14px);padding:12px;border-radius:14px}.controls-head{margin-bottom:9px}.controls-head h2{font-size:13px}.controls-head .eyebrow{font-size:8px}.controls-head>span{font-size:9px}.controls-grid{grid-template-columns:80px 1fr 90px;gap:9px}.dial-wrap{display:block}.dial{height:65px;width:65px}.dial-rings{inset:7px}.dial-center{font-size:8px}.dial-arrow{font-size:16px;margin-top:-23px;transform-origin:50% calc(50% + 23px)}.dial-text{font-size:8px}.dial-text strong{display:inline;font-size:10px;margin-left:3px}.sliders label{font-size:9px}.sliders output{font-size:9px}.sliders input{margin:3px 0 6px}.tip{display:none}.fire-button{height:70px;font-size:11px;display:block;text-align:center;padding:5px}.fire-button .banana{display:block;font-size:19px}.fire-button small{font-size:7px}.fire-button .arrow{display:none}.intro-top{font-size:9px;margin-bottom:18px}.intro p{font-size:12px}.intro-steps{margin:20px 0}.intro-steps span{font-size:9px}.toast{top:74px;width:max-content;max-width:90vw;font-size:11px}}