:root{--bg: #0b0f12;--bg-2: #11171b;--panel: #171a1f;--panel-2: #1e2328;--line: #3a342d;--line-strong: #5b4a32;--gold: #d8b45f;--gold-2: #f0d28a;--text: #e8dcc8;--muted: #9aa696;--dim: #6d7770;--cyan: #63d6ff;--green: #9dc46a;--red: #e06a5a;--orange: #ff9a3a;--shadow: rgba(0, 0, 0, .55);font-family:Microsoft YaHei,PingFang SC,Noto Sans SC,system-ui,sans-serif;color:var(--text);background:var(--bg)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;min-height:100%;height:100%;overflow:hidden;background:var(--bg)}body{position:relative;min-height:100dvh;background:radial-gradient(circle at 50% 18%,rgba(74,92,84,.22),transparent 58%),radial-gradient(circle at 20% 90%,rgba(80,46,54,.16),transparent 60%),linear-gradient(180deg,#0b1013,#10161a 45%,#0a0e11)}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.22;background-image:linear-gradient(rgba(152,168,144,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(152,168,144,.08) 1px,transparent 1px);background-size:24px 24px;mask-image:radial-gradient(circle at 50% 40%,#000 30%,transparent 82%)}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;touch-action:manipulation;user-select:none}button:disabled{cursor:default}.pixel-icon{image-rendering:pixelated;image-rendering:crisp-edges;display:block;pointer-events:none}.app{position:relative;display:flex;flex-direction:column;width:100%;height:100vh;height:100dvh;overflow:hidden}.hud{position:relative;z-index:20;flex:0 0 auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;width:100%;max-width:680px;margin:0 auto;padding:calc(8px + env(safe-area-inset-top)) 12px 8px;border-bottom:1px solid rgba(216,180,95,.16);background:linear-gradient(180deg,#12171bf5,#0e1316b8)}.hud-side{display:flex;align-items:center;min-width:0}.hud-side-right{justify-content:flex-end;gap:6px}.shield-widget{display:flex;align-items:center;gap:6px;min-width:0}.shield-icon{width:24px;height:24px;filter:drop-shadow(0 0 5px rgba(99,214,255,.45))}.hud-label{font-size:10px;letter-spacing:0;color:var(--muted);white-space:nowrap}.pips{display:flex;gap:3px;margin-top:4px;height:10px}.pip{width:8px;height:8px;transform:rotate(45deg);border:1px solid rgba(99,214,255,.28);background:#1b2227;box-shadow:inset 0 0 2px #000c;transition:background .16s,box-shadow .16s,border-color .16s}.pip.on{background:linear-gradient(135deg,#d6f7ff,#55b6e8 60%,#2f78b0);border-color:#bff3ff;box-shadow:0 0 5px #63d6ffb3}.timer-widget{display:flex;flex-direction:column;align-items:center;min-width:92px}.timer-row{display:flex;align-items:baseline;gap:4px}.timer{font-family:Consolas,Courier New,monospace;font-size:20px;font-weight:700;letter-spacing:0;color:var(--gold-2);text-shadow:0 0 10px rgba(216,180,95,.2)}.timer-total{font-family:Consolas,monospace;font-size:9px;color:var(--dim)}.timer-track{width:92px;height:3px;margin-top:2px;background:#272b2b;border:1px solid #0c1012;overflow:hidden}.timer-track i{display:block;width:0;height:100%;background:linear-gradient(90deg,#8a6b2e,var(--gold),#ffe9ac);transition:width .16s linear}.icon-btn,.mini-btn,.close-btn{display:grid;place-items:center;border:1px solid #3b352c;background:linear-gradient(180deg,#252b2e,#171c20);box-shadow:inset 0 1px #ffffff0f,0 2px #070a0c}.icon-btn{width:40px;height:40px}.icon-btn img{width:18px;height:18px}.mini-btn{min-width:38px;height:28px;padding:0 6px;font-family:Consolas,monospace;font-size:9px;letter-spacing:0;color:var(--muted)}.icon-btn:active,.mini-btn:active,.close-btn:active{transform:translateY(1px);box-shadow:inset 0 2px 4px #00000080}.stage{position:relative;flex:1 1 auto;min-height:0;padding-top:26px;overflow:hidden;background:radial-gradient(ellipse at 50% 55%,rgba(88,104,84,.13),transparent 62%),linear-gradient(180deg,#080b0d33,#080b0dbf)}.stage:after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 80px 28px #0306088c}.game{position:absolute;inset:26px 0 0;display:block;line-height:0}.game canvas{image-rendering:pixelated;image-rendering:crisp-edges;filter:drop-shadow(0 8px 26px rgba(0,0,0,.55))}.field-badge,.enemy-count,.elite-state{position:absolute;z-index:5;top:4px;padding:2px 6px;border:1px solid rgba(216,180,95,.18);background:#0c1013b8;font-size:9px;line-height:16px;letter-spacing:0;color:var(--muted);white-space:nowrap}.field-badge{left:8px;display:none}.enemy-count{right:8px;font-family:Consolas,monospace;color:var(--text)}.elite-state{left:50%;transform:translate(-50%);color:var(--dim)}.elite-state.danger{color:var(--orange);border-color:#ff9a3a59}.trial-bar{position:relative;z-index:12;flex:0 0 auto;display:grid;gap:4px;width:100%;max-width:680px;margin:0 auto;padding:4px 8px;border-bottom:1px solid rgba(216,180,95,.22);background:#0c1013f0;font-size:10px;color:var(--muted)}.trial-bar.hidden{display:none}.trial-row{display:flex;align-items:center;gap:4px;min-width:0}.trial-bar .trial-label{flex:0 0 auto;padding:0 2px;font-size:9px;white-space:nowrap;color:var(--dim)}.trial-bar button{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:40px;min-height:36px;padding:0 8px;border:1px solid rgba(216,180,95,.22);background:#181f24e6;color:var(--muted);font:inherit;white-space:nowrap;cursor:pointer}.trial-bar button.active{border-color:#d8b45fa6;color:var(--text);background:#362c1ae6}.trial-presets{display:flex;flex:1 1 auto;gap:4px;min-width:0}.trial-presets button{flex:1 1 0}.trial-bar .trial-capacity{display:flex;flex:0 0 auto;gap:4px}.trial-bar .trial-capacity button{min-width:44px;padding:0 6px}.trial-tools{gap:6px}.trial-tools button{flex:1 1 0;min-width:0;padding:0 4px}.trial-glyph{width:16px;height:16px}.trial-glyph-text{display:inline-flex;align-items:center;justify-content:center;font-size:15px;line-height:1}.trial-bar .trial-exit{color:var(--orange)}.tutorial-bar{position:relative;z-index:12;flex:0 0 auto;display:flex;align-items:center;gap:8px;width:100%;max-width:680px;min-height:42px;margin:0 auto;padding:4px 8px;border-bottom:1px solid rgba(216,180,95,.22);background:#0c1013f0;font-size:10px;color:var(--muted)}.tutorial-bar.hidden{display:none}.tutorial-copy{display:flex;flex:1 1 auto;align-items:baseline;gap:6px;min-width:0;overflow:hidden;white-space:nowrap}.tutorial-step{flex:0 0 auto;font-family:Consolas,monospace;color:var(--gold)}.tutorial-copy strong{flex:0 0 auto;color:var(--text);font-size:11px}.tutorial-hint{overflow:hidden;text-overflow:ellipsis;color:var(--muted)}.tutorial-combos{display:flex;flex:0 0 auto;gap:4px}.tutorial-combo{padding:2px 6px;border:1px solid rgba(216,180,95,.35);color:var(--gold-2);white-space:nowrap}.tutorial-side{display:flex;flex:0 0 auto;align-items:center;gap:6px}.tutorial-time{min-width:30px;font-family:Consolas,monospace;text-align:right;color:var(--text)}.tutorial-skip{min-width:52px;min-height:36px;padding:0 10px;border:1px solid rgba(216,180,95,.28);background:#181f24e6;color:var(--muted);font:inherit}.level-strip{display:flex;align-items:center;gap:8px;width:100%;min-height:38px;margin:8px 0 10px;padding:0 10px;border:1px solid rgba(216,180,95,.3);background:#0a0e108c;color:var(--text);font:inherit;text-align:left}.level-strip-label{flex:0 0 auto;color:var(--gold);font-size:10px}.level-strip strong{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.level-strip-state{flex:0 0 auto;font-family:Consolas,monospace;font-size:10px;color:var(--dim)}.intro-links{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:2px 12px;margin-top:4px}.levels-panel{max-height:min(82dvh,620px);overflow-y:auto}.level-list{display:grid;gap:6px;margin:10px 0}.level-card{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:46px;padding:6px 8px;border:1px solid rgba(216,180,95,.24);background:#12181ce6;color:var(--muted);font:inherit;text-align:left}.level-card:disabled{opacity:.45}.level-card.selected{border-color:#d8b45fb3;box-shadow:inset 0 0 0 1px #d8b45f40}.level-card.cleared .level-state{color:var(--green, #8fd68f)}.level-num{font-family:Consolas,monospace;font-size:12px;color:var(--gold)}.level-name{display:grid;gap:2px;min-width:0}.level-name strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-size:12px}.level-name small,.level-state{font-size:10px;color:var(--dim)}.reward-note{margin:6px 0 0;color:var(--gold-2)}@media(max-width:420px){.tutorial-combos{display:none}.tutorial-hint{max-width:100%}}.toast{position:absolute;z-index:30;left:50%;bottom:10px;max-width:calc(100% - 24px);padding:7px 12px;border:1px solid #4b4133;background:#121418f2;box-shadow:0 4px 18px #00000073;color:var(--text);font-size:12px;white-space:nowrap;opacity:0;transform:translate(-50%,8px);pointer-events:none;transition:opacity .15s,transform .15s}.toast.show{opacity:1;transform:translate(-50%)}.toast.warn{border-color:#e06a5a99;color:#ffc7bd}.toast.good{border-color:#9dc46a8c;color:#d9f0b8}.controls{position:relative;z-index:20;flex:0 0 auto;width:100%;max-width:560px;margin:0 auto;padding:7px 12px calc(8px + env(safe-area-inset-bottom));background:linear-gradient(180deg,#0f141799,#0d1114fa 30%);border-top:1px solid rgba(216,180,95,.12)}.input-row{display:flex;align-items:center;gap:7px;height:50px}.clear-btn{flex:0 0 44px;height:48px;display:grid;place-items:center;border:1px solid #3b352c;background:linear-gradient(180deg,#252b2e,#171c20);box-shadow:inset 0 1px #ffffff0d,0 2px #070a0c}.clear-btn img{width:16px;height:16px;opacity:.8}.clear-btn:disabled{opacity:.35}.slots{flex:1 1 auto;display:flex;gap:5px;min-width:0}.slot{position:relative;flex:1 1 0;min-width:0;height:48px;display:grid;place-items:center;border:1px dashed #3f4640;background:#15191bbf;box-shadow:inset 0 0 0 1px #0000004d;transition:border-color .12s,background .12s,transform 80ms}.slot small{position:absolute;right:3px;bottom:1px;font-family:Consolas,monospace;font-size:8px;color:#586058}.slot.filled{border-style:solid;border-color:#5b5140;background:linear-gradient(180deg,#2a2726,#1a191c)}.slot.selected{border-color:#d8b45f;box-shadow:inset 0 0 0 1px #d8b45f66,0 0 8px #d8b45f40}.cast-status{position:relative;flex:0 0 96px;height:50px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;overflow:hidden;border:1px solid #5b5140;background:linear-gradient(180deg,rgba(255,240,190,.1),transparent 45%),linear-gradient(180deg,#2a2726,#171a1c);box-shadow:inset 0 0 0 1px #0a0c0d,0 2px #070a0c;color:#ffe9ac;text-align:center}.cast-state{font-size:9px;color:#b9a877;letter-spacing:0}.cast-status strong{max-width:88px;overflow:hidden;font-size:13px;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 1px #000}.slot.ghost{opacity:.42}.slot-icon{width:24px;height:24px}.slot:active{transform:translateY(1px)}.slots.shake{animation:shake .22s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-3px)}50%{transform:translate(3px)}75%{transform:translate(-2px)}}.cast-btn{position:relative;flex:0 0 84px;height:50px;display:flex;align-items:center;justify-content:center;gap:4px;overflow:hidden;border:2px solid #7a5b2a;background:linear-gradient(180deg,rgba(255,240,190,.16),transparent 42%),linear-gradient(180deg,#8d6a2d,#513a1a);box-shadow:inset 0 0 0 1px #2a1e0e,0 2px #080a0b,0 0 16px #d8b45f1f;color:#ffe9ac;font-size:14px;font-weight:700;letter-spacing:0;text-shadow:0 1px #000}.cast-btn:disabled{filter:saturate(.35) brightness(.7);box-shadow:inset 0 0 0 1px #1c1d1b,0 2px #080a0b}.cast-btn:not(:disabled):active{transform:translateY(1px)}.cast-icon{width:18px;height:18px}.cast-cooldown{position:absolute;inset:auto 0 0;height:var(--cd, 0%);background:#080a0c9e;pointer-events:none;transition:height 80ms linear}.elements{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;margin-top:5px}.element-btn{position:relative;height:54px;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border:1px solid #3b352c;background:linear-gradient(180deg,rgba(255,255,255,.045),transparent 50%),linear-gradient(180deg,#252b2e,#171c20);box-shadow:inset 0 1px #ffffff0d,0 2px #070a0c;transition:border-color .12s,background .12s,transform 80ms}.element-btn:after{content:"";position:absolute;inset:0;border:1px solid var(--el, transparent);opacity:.25;pointer-events:none}.element-btn img{width:24px;height:24px}.element-btn span{font-size:11px;line-height:12px}.element-btn small{position:absolute;right:3px;top:2px;font-family:Consolas,monospace;font-size:7px;color:#586058}.element-btn[data-element=F]{--el: #ff7a2a}.element-btn[data-element=W]{--el: #55b6e8}.element-btn[data-element=E]{--el: #a3aa80}.element-btn[data-element=A]{--el: #b8d8a8}.element-btn[data-element=L]{--el: #ffd34a}.element-btn:active{transform:translateY(1px);background:linear-gradient(180deg,#30383a,#1b2124)}.status-row{display:flex;align-items:center;justify-content:space-between;gap:8px;height:18px;margin-top:4px;font-size:10px;color:var(--muted)}.recipe-status{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recipe-status.ready{color:var(--green)}.recipe-status.missing{color:#d9a06a}.last-recipe{flex:0 0 auto;font-family:Consolas,monospace;font-size:9px;color:var(--dim)}.overlay{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:18px;background:radial-gradient(circle at 50% 40%,#1014168c,#040608d9);backdrop-filter:blur(3px)}.overlay.hidden,.dev-panel.hidden,.modal.hidden,#btn-dev.hidden{display:none}body.show-intro .controls{visibility:hidden}.overlay.intro-overlay{align-items:flex-end;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent 45%,rgba(4,6,8,.6));backdrop-filter:none;pointer-events:none}.intro-overlay .overlay-card{width:min(100%,360px);pointer-events:auto}.intro-panel{padding:12px 14px 8px}.intro-panel h1{font-size:22px;letter-spacing:0}.intro-line{margin:6px 0 10px;font-size:12px;line-height:1.5;color:var(--muted)}.intro-actions{display:flex;align-items:center;gap:10px}.intro-actions .primary-btn{flex:1 1 auto;min-height:46px;margin:0}.intro-actions .text-btn{flex:0 0 auto}.intro-panel .load-note{margin:6px 0 0}.overlay-card{width:min(100%,390px)}.panel{position:relative;padding:22px 20px 18px;border:2px solid var(--line-strong);background:linear-gradient(180deg,rgba(216,180,95,.045),transparent 28%),linear-gradient(180deg,#1a1a20,#121318);box-shadow:0 18px 60px #0009,inset 0 0 0 1px #0b0c0e;text-align:center}.panel:before,.panel:after{content:"";position:absolute;width:14px;height:14px;border-color:var(--gold);border-style:solid;opacity:.65}.panel:before{left:5px;top:5px;border-width:1px 0 0 1px}.panel:after{right:5px;bottom:5px;border-width:0 1px 1px 0}.mark{display:block;width:144px;height:48px;margin:0 auto 8px;image-rendering:pixelated}.eyebrow{display:block;margin-bottom:6px;font-size:10px;letter-spacing:0;color:var(--gold);text-transform:uppercase}.panel h1{margin:0;font-size:38px;line-height:1;letter-spacing:0;color:var(--gold-2);text-shadow:0 0 18px rgba(216,180,95,.28),0 3px 0 #4a3519}.panel h2{margin:0 0 8px;font-size:24px;letter-spacing:0;color:var(--gold-2)}.panel.won h2{color:#c9e79a}.panel.lost h2{color:#f0a196}.lead{margin:12px 0;font-size:13px;line-height:1.65;color:var(--text)}.small{margin:10px 0;font-size:11px;line-height:1.6;color:var(--muted)}.tutorial{display:flex;align-items:center;justify-content:center;gap:6px;margin:14px 0 8px;padding:9px 4px;border:1px dashed #3e3a30;background:#080a0c59;font-size:11px;color:var(--text)}.tutorial b{display:inline-grid;place-items:center;width:18px;height:18px;margin-right:3px;border:1px solid #6b5732;background:#2a2419;font-family:Consolas,monospace;font-size:10px;color:var(--gold-2)}.tutorial .plus{color:var(--dim)}.primary-btn{display:block;width:100%;min-height:50px;margin:16px 0 6px;border:2px solid #7a5b2a;background:linear-gradient(180deg,rgba(255,240,190,.18),transparent 45%),linear-gradient(180deg,#a37a35,#5d431d);box-shadow:inset 0 0 0 1px #2a1e0e,0 3px #080a0b;color:#fff0c0;font-size:15px;font-weight:700;letter-spacing:0;text-shadow:0 1px #000}.primary-btn:active{transform:translateY(2px);box-shadow:inset 0 0 0 1px #2a1e0e,0 1px #080a0b}.text-btn{padding:8px;font-size:11px;color:var(--muted);text-decoration:underline;text-underline-offset:3px}.text-btn:hover{color:var(--gold-2)}.result-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px 8px;margin:10px 0 4px;padding:10px;border:1px solid #33322c;background:#080a0c66;font-size:10px;text-align:center;color:var(--muted)}.result-score{display:flex;align-items:baseline;justify-content:center;gap:8px;margin-top:10px;font-size:11px;color:var(--muted)}.result-score b{font-family:Consolas,monospace;font-size:26px;color:var(--gold-2)}@media(max-width:420px){.result-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}.result-stats b{display:block;margin-top:3px;font-family:Consolas,monospace;font-size:17px;color:var(--gold-2)}.result-panel{max-height:min(92dvh,760px);overflow-y:auto;overscroll-behavior:contain}.result-block{margin:10px 0 4px;padding:8px 10px;border:1px solid #33322c;background:#080a0c66;text-align:left}.result-block-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:10px;color:var(--muted)}.result-block-head b{font-family:Consolas,monospace;font-size:13px;color:var(--gold-2)}.result-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}.result-chip{max-width:100%;padding:2px 6px;border:1px solid #4a4432;background:#1b1c18;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;color:#d8c99a}.result-chip.more{border-style:dashed;color:var(--muted)}.result-details{margin-top:6px;font-size:10px;color:var(--muted)}.result-details summary{cursor:pointer;color:var(--gold-2)}.result-details ul{max-height:92px;overflow-y:auto;margin:6px 0 0;padding-left:16px;line-height:1.6}.result-details li{overflow-wrap:anywhere}.dev-panel{position:fixed;z-index:60;right:8px;top:calc(58px + env(safe-area-inset-top));width:min(310px,calc(100vw - 16px));max-height:min(78dvh,640px);overflow:auto;padding:10px;border:1px solid #57503f;background:#0f1216fa;box-shadow:0 16px 44px #000000a6;font-size:11px}.dev-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid #34372f;color:var(--gold-2);letter-spacing:0}.close-btn{width:28px;height:28px;font-size:16px;line-height:1;color:var(--muted)}.dev-grid{display:grid;grid-template-columns:1fr auto;gap:4px 10px;margin:0 0 9px;font-family:Consolas,Microsoft YaHei,monospace}.dev-grid dt{color:var(--muted)}.dev-grid dd{margin:0;text-align:right;color:var(--text)}.dev-actions{display:grid;grid-template-columns:1fr 1fr;gap:5px}.dev-actions button,.speed-row button,.wide-btn{min-height:34px;border:1px solid #3b3f38;background:#22282a;color:var(--text);font-size:10px}.dev-actions button:active,.speed-row button:active,.wide-btn:active{background:#30383a}.speed-row{display:flex;gap:5px;margin:7px 0}.speed-row button{flex:1}.speed-row button.active{border-color:var(--gold);color:var(--gold-2);background:#30291c}.wide-btn{width:100%}.dev-note{margin:8px 0 0;font-size:9px;line-height:1.6;color:var(--dim)}.modal{position:fixed;inset:0;z-index:70;display:flex;align-items:center;justify-content:center;padding:12px;background:#040608c7;backdrop-filter:blur(3px)}.modal-card{display:flex;flex-direction:column;width:min(540px,100%);max-height:90dvh;padding:14px;border:2px solid var(--line-strong);background:#14161a;box-shadow:0 20px 70px #000000b3}.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.modal-head h2{margin:0;font-size:20px;color:var(--gold-2)}.modal-copy{margin:8px 0;font-size:10px;line-height:1.6;color:var(--muted)}.modal-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:2px 0 8px}.recipe-filter{display:flex;gap:4px}.recipe-filter button{min-height:32px;padding:4px 10px;border:1px solid #3c4750;background:#171d21;color:var(--muted);font:inherit;font-size:10px;cursor:pointer}.recipe-filter button.active{border-color:#d8b45fa6;background:#362c1ae6;color:var(--text)}.recipe-count{font-family:Consolas,monospace;font-size:10px;color:var(--dim);white-space:nowrap}.recipe-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;overflow:auto;padding-right:3px;flex:1 1 auto;min-height:0}.recipe-card{padding:6px 7px;border:1px solid #313630;background:#191d20;opacity:.72}.recipe-card.is-ready{border-color:#6d7f45;background:linear-gradient(180deg,#263020,#1a2118);opacity:1}.recipe-card-top{display:flex;justify-content:space-between;font-family:Consolas,monospace;font-size:9px;color:var(--dim)}.recipe-card.is-ready .recipe-card-top span{color:var(--green)}.recipe-card-name{margin:3px 0 4px;font-size:11px;color:var(--text)}.recipe-card-elements{display:flex;gap:2px}.recipe-card.is-locked{border-style:dashed;opacity:.55}.outline-pip{display:inline-block;width:12px;height:12px;border:1px dashed #5b636a}.recipe-try{padding:2px 6px;border:1px solid rgba(216,180,95,.5);background:#362c1ae6;color:var(--text);font:inherit;font-size:9px;cursor:pointer}.recipe-card-tactic{margin-top:3px;font-size:9px;color:var(--dim)}.recipe-empty{grid-column:1 / -1;margin:10px 0;font-size:11px;color:var(--dim)}.tiny-icon{width:12px;height:12px;opacity:.85}.slot.hidden,.aim-btn.hidden,.aim-cancel-zone.hidden{display:none}.aim-cancel-zone{position:fixed;left:50%;bottom:calc(4px + env(safe-area-inset-bottom,0px));z-index:60;transform:translate(-50%);display:grid;place-items:center;width:min(190px,60vw);height:28px;border:1px dashed #d9877a;background:#221214d1;font-size:9px;color:#ffc7bd;letter-spacing:0;pointer-events:none}.cast-btn{touch-action:none}.element-btn.locked{opacity:.34;filter:grayscale(.85);border-style:dashed}.element-btn.locked:before{content:"未掌握";position:absolute;left:50%;top:50%;z-index:2;transform:translate(-50%,-50%);padding:1px 3px;background:#080a0cd1;font-size:8px;line-height:12px;color:var(--muted);white-space:nowrap}.element-btn:disabled{cursor:default}.aim-btn{flex:0 0 auto;height:18px;padding:0 6px;border:1px solid #4b4133;background:#1c2022;font-size:9px;color:#ffc7bd;white-space:nowrap}.switch-row{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 10px}.switch-item{flex:1 1 72px;display:flex;align-items:center;justify-content:center;gap:4px;height:44px;min-height:44px;border:1px solid #3c4750;background:#171d21;font-size:10px;color:var(--muted)}.switch-item input{width:12px;height:12px;margin:0;accent-color:#d8b45f}.volume-row{display:flex;align-items:center;gap:8px;min-height:44px;margin:0 0 10px;font-size:10px;color:var(--muted)}.volume-row input{flex:1 1 auto;accent-color:#d8b45f}.app.is-left-handed .input-row{flex-direction:row-reverse}.app.is-left-handed .elements{direction:rtl}.reward-panel{padding:20px 16px 16px}.reward-list{display:grid;gap:8px;margin-top:12px}.reward-card{display:grid;grid-template-columns:26px 1fr;grid-template-rows:auto auto;align-items:center;column-gap:8px;padding:10px 12px;border:1px solid #4c4232;background:linear-gradient(180deg,rgba(255,255,255,.04),transparent 55%),linear-gradient(180deg,#26262a,#17181c);text-align:left;box-shadow:inset 0 1px #ffffff0d,0 2px #070a0c}.reward-card:active{transform:translateY(1px)}.reward-card strong{font-size:14px;color:var(--gold-2)}.reward-card>span:last-child{grid-column:2;font-size:10px;color:var(--muted)}.reward-icon{grid-row:1 / span 2;display:grid;place-items:center;width:26px;height:26px}.reward-icon .tiny-icon{width:22px;height:22px}@media(min-width:760px){.hud{padding-top:12px;padding-bottom:10px}.controls{padding-bottom:14px}.element-btn{height:58px}.element-btn img{width:28px;height:28px}.slot,.clear-btn{height:52px}.cast-status{height:54px}}@media(max-width:359px){.timer{font-size:17px}.element-btn{height:48px}.element-btn img{width:20px;height:20px}.element-btn span{font-size:10px}.cast-status{flex-basis:78px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
