:root{color-scheme:dark;--ink:#101b2d;--paper:#eaf6ff;--cyan:#8ee8ef;--gold:#ffdc88;--muted:#97aabe}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--ink);color:var(--paper);font:16px/1.5 system-ui,-apple-system,"Microsoft YaHei",sans-serif;touch-action:none;user-select:none}button{font:inherit;color:inherit;border:1px solid #60768c70;background:#24374acc;border-radius:8px;cursor:pointer;padding:12px 20px;touch-action:none}button:hover{background:#365568;border-color:var(--cyan)}button:active{transform:translateY(1px)}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:var(--cyan);color:#133746;border:1px solid var(--cyan);font-weight:750}small{font-size:12px;color:var(--muted)}#game,#vignette{position:absolute;inset:0;width:100%;height:100%}#vignette{pointer-events:none;background:radial-gradient(ellipse,transparent 50%,#08111b80)}.hidden{display:none!important}.screen{position:absolute;inset:0;padding:max(24px,env(safe-area-inset-top)) max(40px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(40px,env(safe-area-inset-left))}.eyebrow{font-size:12px;letter-spacing:3px;color:var(--cyan);font-weight:650}#menu{display:flex;align-items:center;background:linear-gradient(90deg,#101b2dfa 5%,#15283ded 38%,#182b3e40 80%)}.menu-panel{width:430px;z-index:2}h1{font-size:clamp(65px,8vw,116px);line-height:1.15;letter-spacing:10px;margin:18px 0 0;font-weight:900;text-shadow:0 4px 35px #97d7ff20}h1 span{display:block;font-size:24px;letter-spacing:9px;font-weight:400;margin-top:8px}.tagline{color:#acc0d3;letter-spacing:3px;margin:24px 0 35px}.menu-actions{width:340px;display:grid;gap:10px}.menu-actions>button{text-align:left;display:flex;align-items:center;justify-content:space-between}.menu-actions .primary{padding:16px 20px}.menu-row{display:flex;gap:8px}.menu-row button{flex:1;font-size:14px;padding:10px 5px}.menu-help{margin-top:24px;font-size:12px;color:#91aabd;line-height:1.9}.menu-character{position:absolute;width:min(55vw,650px);height:85%;right:7%;bottom:2%;background-repeat:no-repeat;background-size:400% 500%;background-position:0 0;filter:drop-shadow(0 20px 40px #90c6ed35);opacity:.9}.edition{position:absolute;right:24px;bottom:18px;color:#8197ad;font-size:12px}#hud{position:absolute;inset:0;pointer-events:none;padding:20px}#hud button,#hud .stick{pointer-events:auto}.hud-left{position:absolute;left:max(24px,env(safe-area-inset-left));top:18px;display:flex;gap:18px;align-items:center}.wave{display:flex;flex-direction:column;line-height:1.1;border-right:1px solid #8295a850;padding-right:18px}.wave strong{font-size:40px}.wave small{font-size:12px;margin-bottom:4px}.vitals{width:200px}.hp-caption{display:flex;justify-content:space-between;font-size:13px;margin-bottom:5px}.hp-track{height:7px;background:#0b1525;border:1px solid #6c8da066;border-radius:10px;overflow:hidden}.hp-track i{display:block;height:100%;width:100%;background:var(--cyan);transition:width .1s}.hud-right{position:absolute;right:max(24px,env(safe-area-inset-right));top:20px;display:flex;align-items:center;gap:20px}.hud-right button{padding:4px 13px;font-size:24px;background:#18283bd9}.gold{color:var(--gold);font-size:23px}#remaining{color:#b8cbd9;font-size:14px}.weapon-label{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);text-align:center;background:#101b2dcc;padding:8px 20px;border-radius:9px;min-width:180px}.weapon-label b{font-size:14px}.weapon-label small{display:block}#spell-progress{height:3px;background:#496575;margin-top:5px}#spell-progress i{height:100%;display:block;background:#b5abff}.stick{position:absolute;bottom:max(25px,env(safe-area-inset-bottom));left:max(40px,env(safe-area-inset-left));width:120px;height:120px;border-radius:50%;border:1px solid #abd9e656;background:#93bdda12;display:grid;place-items:center;touch-action:none}.stick i{position:absolute;width:48px;height:48px;border-radius:50%;border:1px solid #b6eaf481;background:#a0d4e82b;pointer-events:none}.stick span{font-size:12px;color:#bad5e1;transform:translateY(44px);pointer-events:none}.attack{left:auto;right:max(45px,env(safe-area-inset-right));width:135px;height:135px;border-color:#bfaafc69;background:#bfb0ef10}.attack i{border-color:#d0c0ff88;background:#d0c0ff29}.attack span{transform:translateY(51px)}.round{position:absolute;bottom:180px;right:max(73px,env(safe-area-inset-right));border-radius:50%;width:76px;height:76px;padding:0;background:#173044cc}.round small{display:block;font-size:12px}#banner{position:absolute;top:24%;left:0;right:0;text-align:center;font-size:24px;letter-spacing:6px;color:#e3faff;text-shadow:0 2px 8px #000}#toast{position:absolute;bottom:160px;left:50%;transform:translateX(-50%);font-size:14px;color:var(--gold);text-align:center}#boss-hud{position:absolute;top:88px;left:35%;right:35%;text-align:center;font-size:12px}#boss-hud>div{height:5px;background:#202838;margin-top:6px}#boss-hud i{display:block;height:100%;background:#81d6ab}#shop{background:#101c2df5;display:flex;flex-direction:column;justify-content:center;gap:30px;overflow:auto}.shop-head{display:flex;justify-content:space-between;align-items:center}.shop-head h2{font-size:28px;margin:6px 0}.shop-head p{margin:0;color:#9db4c9;font-size:14px}.wallet{font-size:32px;color:var(--gold)}#cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{text-align:left;position:relative;display:flex;flex-direction:column;min-height:250px;padding:24px;background:linear-gradient(140deg,#253c53,#172b3e);border-color:#66859a66}.card .type{font-size:12px;letter-spacing:2px;color:var(--cyan)}.card .symbol{font-size:30px;margin:18px 0;color:#d4e9f6}.card h3{font-size:21px;margin:0 0 10px}.card p{font-size:14px;color:#b6c9d8;flex:1;margin:0 0 15px}.card footer{display:flex;align-items:center;justify-content:space-between;color:var(--gold);font-size:19px}.card .double{font-size:12px;color:#c2b4ff}.shop-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px}.shop-bottom p{color:#a7bdce;font-size:14px;margin:0}.shop-bottom b{color:#ccbaff}.shop-bottom>div{display:flex;gap:12px}.overlay{position:absolute;inset:0;background:#060e1bc7;display:grid;place-items:center;z-index:10;backdrop-filter:blur(9px)}.dialog{position:relative;width:min(600px,90vw);max-height:90dvh;overflow:auto;padding:32px;background:#1b2c40;border:1px solid #66869b;border-radius:16px;touch-action:pan-y}.close{position:absolute;right:12px;top:10px;border:0;background:none;font-size:27px;padding:0 8px}.dialog h2{margin-top:0}.dialog p{color:#bad0df}.dialog button{margin:5px 5px 5px 0}.dialog label{display:block;margin:24px 0}.dialog input{width:100%;accent-color:var(--cyan)}.dialog .stat{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #60738950}.dialog details{font-size:14px;color:#bdd2e3;margin:10px 0}.dialog details p{font-size:13px}.dialog select{font:inherit;padding:8px;background:#2b4358;color:white;border:1px solid #688195;border-radius:5px}.dialog .choice{border-color:#8ee8ef}.notice{font-size:13px!important;color:#e2c98d!important}#rotate{display:none;position:absolute;inset:0;background:#142236;z-index:100;align-items:center;justify-content:center;flex-direction:column;text-align:center}#rotate>div{font-size:70px;color:var(--cyan)}@media(orientation:portrait) and (max-width:1000px){#rotate{display:flex}}@media(max-height:600px){.screen{padding:16px max(28px,env(safe-area-inset-right)) 16px max(28px,env(safe-area-inset-left))}.menu-panel{width:360px}h1{font-size:62px;margin:6px 0}h1 span{font-size:19px}.tagline{margin:14px 0 18px;font-size:13px}.menu-help{margin-top:12px}.menu-actions{width:300px;gap:7px}.menu-actions .primary{padding:11px 16px}.menu-actions>button{padding:8px 16px}.menu-row button{padding:7px 5px}.menu-character{height:96%;right:4%}.eyebrow{font-size:12px}.stick{width:94px;height:94px;bottom:18px;left:max(28px,env(safe-area-inset-left))}.stick i{width:40px;height:40px}.stick span{transform:translateY(32px)}.attack{left:auto;right:max(28px,env(safe-area-inset-right));width:106px;height:106px}.attack span{transform:translateY(38px)}.round{bottom:140px;right:max(47px,env(safe-area-inset-right));width:62px;height:62px;font-size:14px}.hud-left{top:12px;gap:12px}.wave strong{font-size:30px}.vitals{width:145px}.hud-right{top:12px;gap:12px}.gold{font-size:20px}.weapon-label{bottom:10px;padding:5px 12px}#boss-hud{top:62px;left:37%;right:37%}#shop{gap:14px}.shop-head h2{font-size:21px}.card{min-height:190px;padding:14px}.card .symbol{font-size:23px;margin:4px 0}.card h3{font-size:17px}.card p{font-size:13px;margin-bottom:8px}.shop-bottom p{font-size:12px}.shop-bottom button{padding:9px 12px;font-size:13px}#cards{gap:12px}.wallet{font-size:25px}.dialog{padding:24px}.shop-head p{font-size:12px}}
.menu-character{width:min(52vw,83vh);height:min(52vw,83vh);right:7%;bottom:5%}
#shop{touch-action:pan-y}
@media(max-height:380px){#shop{gap:8px;padding-top:12px;padding-bottom:12px}.card{min-height:153px;padding:10px}.card .symbol{display:none}.card h3{font-size:16px;margin:7px 0}.card p{font-size:12px}.shop-head h2{font-size:18px;margin:2px 0}.shop-head .eyebrow{display:none}.shop-bottom p{max-width:44%}.shop-bottom button{padding:7px 10px}.menu-help{margin-top:8px}.tagline{margin:10px 0}.menu-panel h1{font-size:50px}.menu-panel h1 span{font-size:17px}.menu-actions{gap:5px}.menu-row button{padding:5px}.menu-panel .eyebrow{font-size:11px}}
