:root{--bg: #141f26;--bg2: #1b2a33;--card: #22333d;--line: #354a56;--ink: #eaf1f4;--dim: #9fb6c2;--faint: #6d8794;--gold: #e9b93c;--gold-d: #8a6006;--sea: #57b6c4;--green: #5fbf7a;--red: #e0645c;--tap: 44px;--btn: 64px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;height:100%;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:17px;line-height:1.35;-webkit-text-size-adjust:100%;overscroll-behavior:none}body{position:fixed;left:0;right:0;top:0;bottom:0;overflow:hidden}#app{position:absolute;left:0;right:0;top:0;bottom:0}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}.shell{position:absolute;left:0;right:0;top:0;bottom:0;display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top) + 8px) 12px calc(env(safe-area-inset-bottom) + 10px)}.scroll{overflow-y:auto;-webkit-overflow-scrolling:touch}.grow{flex:1;min-height:0}.row{display:flex;gap:8px}.row>*{flex:1}.center{text-align:center}.mt{margin-top:12px}.mb{margin-bottom:12px}h1{font-size:22px;margin:4px 0 2px}h2{font-size:18px;margin:14px 0 6px}p{margin:6px 0}.kicker{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin:0}.dim{color:var(--dim)}.small{font-size:14px}.tiny{font-size:12px;color:var(--faint)}.btn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:var(--tap);padding:10px 14px;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);font-weight:600;text-align:center;width:100%}.btn:active{transform:translateY(1px)}.btn-primary{min-height:var(--btn);font-size:19px;background:var(--gold);border-color:var(--gold-d);color:#241a04}.btn-sea{background:var(--sea);border-color:#2b7c88;color:#06222a;min-height:var(--btn);font-size:19px}.btn-ghost{background:transparent}.btn-sm{min-height:var(--tap);font-size:15px;padding:8px 10px}.btn[disabled]{opacity:.4}.btn-wide{min-height:72px;font-size:20px}.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px;margin:10px 0}.card-tight{padding:10px;margin:8px 0}.field{margin:10px 0}.field>label{display:block;font-size:13px;color:var(--dim);margin-bottom:4px}input[type=text],input[type=tel],input[type=number],select,textarea{width:100%;min-height:48px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--bg2);-webkit-appearance:none;appearance:none}textarea{min-height:80px;resize:vertical}select{background-image:none}.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{min-height:var(--tap);padding:8px 12px;border-radius:999px;border:1px solid var(--line);background:var(--bg2);font-size:15px}.chip.on{background:var(--gold);border-color:var(--gold-d);color:#241a04;font-weight:700}.meter{display:flex;align-items:center;gap:8px}.meter-track{flex:1;height:16px;border-radius:999px;background:#10191f;border:1px solid var(--line);overflow:hidden}.meter-fill{height:100%;background:var(--gold);transition:width .4s linear}.meter-fill.drain{background:var(--sea)}.meter-num{font-variant-numeric:tabular-nums;font-weight:700;min-width:46px;text-align:right}.meter-lbl{font-size:12px;color:var(--faint)}.seqbar{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.seq{width:56px;height:56px;border-radius:14px;border:1px solid var(--line);background:var(--bg2);color:var(--dim);font-size:18px;font-weight:700;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.05;padding:0}.seq.done{background:#2c3f49;color:var(--faint)}.seq.now{background:var(--gold);border-color:var(--gold-d);color:#241a04;box-shadow:0 0 0 3px #e9b93c40}.seq.bonus{border-style:dashed}.seqbar-sm{gap:5px}.seqbar-sm .seq{width:36px;height:36px;font-size:15px}.seqbar-sm .seq-who{display:none}.seq-who{font-size:10px;font-weight:600;opacity:.75;max-width:52px;overflow:hidden}.btn-preset{flex-direction:column;gap:2px;align-items:flex-start;text-align:left}.btn-preset .sub{font-size:13px;font-weight:500;opacity:.8}.intro{font-size:13px;color:var(--faint);margin:2px 0 0}.body{font-size:15px;color:var(--dim);margin:4px 0 8px}.core{border:2px solid var(--gold);border-radius:16px;padding:14px;background:#e9b93c12;font-size:21px;font-weight:600;line-height:1.28}.core-sm{font-size:18px}.aggr{border-color:var(--sea);background:#57b6c417}.kp{display:flex;flex-direction:column;gap:8px}.kp-slots{display:flex;gap:8px;justify-content:center}.kp-slot{width:46px;height:58px;border:2px solid var(--line);border-radius:12px;background:var(--bg2);display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:800}.kp-slot.cur{border-color:var(--gold)}.kp-pad{display:flex;flex-direction:column;gap:6px}.kp-row{display:grid;gap:6px}.kp-row-num{grid-template-columns:repeat(5,1fr)}.kp-row-alpha{grid-template-columns:repeat(7,1fr)}.kp-row-ctl{grid-template-columns:2fr 1fr}.kp-key{min-height:46px;border:1px solid var(--line);border-radius:10px;background:var(--card);font-size:18px;font-weight:700}.kp-row-alpha .kp-key{min-height:40px;font-size:16px}.kp-key:active{background:var(--gold);color:#241a04}.shake{animation:shake .32s}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-7px)}75%{transform:translate(7px)}}.mascot{display:block;margin:0 auto}.mascot .tail{animation:wag .5s ease-in-out infinite alternate;transform-origin:96px 92px}@keyframes wag{0%{transform:rotate(-16deg)}to{transform:rotate(16deg)}}.mascot .zzz{animation:float 2.4s ease-in-out infinite}@keyframes float{0%,to{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-5px)}}.bars{display:inline-flex;gap:5px}.bars i{width:16px;height:10px;border-radius:3px;background:#2c3f49;display:block}.bars i.on{background:var(--gold)}.modal{position:fixed;left:0;right:0;top:0;bottom:0;background:#080d10d1;display:flex;align-items:center;justify-content:center;padding:16px;z-index:60}.modal-card{width:100%;max-width:340px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px}.modal-kicker{font-size:12px;color:var(--faint);margin:0 0 6px;text-transform:uppercase;letter-spacing:.1em}.modal-q{font-size:24px;font-weight:700;margin:0 0 10px}.modal-in{text-align:center;font-size:26px;font-weight:700}.modal-err{color:var(--red);font-size:14px}.modal-btns{display:flex;gap:8px;margin-top:10px}.toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom) + 18px);transform:translate(-50%,20px);background:#0d151a;border:1px solid var(--line);color:var(--ink);padding:10px 16px;border-radius:999px;font-size:15px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:90;max-width:90%;text-align:center}.toast.show{opacity:1;transform:translate(-50%)}.tiles{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tile{border:1px solid var(--line);border-radius:16px;background:var(--card);padding:12px 10px;min-height:92px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center}.tile-name{font-size:15px;font-weight:700}.tile-hs{font-size:12px;color:var(--faint)}.tile svg{width:40px;height:40px}.playfield{position:absolute;left:0;right:0;top:0;bottom:0;display:flex;flex-direction:column;background:var(--bg);z-index:40}.play-top{display:flex;align-items:center;gap:8px;padding:calc(env(safe-area-inset-top) + 6px) 10px 6px}.play-top .btn{width:auto}.play-score{flex:1;text-align:right;font-weight:700;font-variant-numeric:tabular-nums}.play-stage{flex:1;min-height:0;position:relative;display:flex;flex-direction:column}.gcanvas{position:absolute;left:0;top:0;width:100%;height:100%;display:block;touch-action:none}.center-col{position:absolute;left:0;right:0;top:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:16px;text-align:center}.big-score{font-size:46px;font-weight:800;color:var(--gold)}.btnguard{display:flex;flex-direction:column;gap:8px;width:100%;max-width:300px;pointer-events:none;opacity:.45;transition:opacity .2s}.btnguard.live{pointer-events:auto;opacity:1}.dpad{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:8px 10px calc(env(safe-area-inset-bottom) + 8px)}.dpad .btn{min-height:68px;font-size:26px}.list{margin:0;padding-left:20px}.list li{margin:4px 0}.check{display:flex;align-items:center;gap:10px;min-height:var(--tap);padding:4px 0}.check input{width:26px;height:26px;min-height:0;flex:0 0 26px}.check-multi{align-items:flex-start}.check-multi input{margin-top:2px}.check-multi .tiny{display:block;margin-top:1px}.hr{height:1px;background:var(--line);margin:14px 0;border:0}.badge{display:inline-block;padding:2px 8px;border-radius:999px;background:var(--bg2);border:1px solid var(--line);font-size:12px;color:var(--dim)}.badge.good{border-color:#2f7a48;color:#a7e0b8}.key-box{font-size:30px;font-weight:800;letter-spacing:.18em;color:var(--gold)}.sticky-bottom{padding-top:8px}pre.log{font-size:11px;line-height:1.3;white-space:pre-wrap;word-break:break-word;background:#0e161b;border:1px solid var(--line);border-radius:12px;padding:10px}.updbar{background:var(--green);color:#06210f;padding:10px;border-radius:12px;font-weight:700;margin:8px 0}.panwrap{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:10px}.holes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%;max-width:380px}.hole{position:relative;aspect-ratio:1 / 1;border-radius:50%;background:#21170c;border:3px solid #3b2a17;overflow:hidden;display:flex;align-items:center;justify-content:center}.hole .pop{width:66%;height:66%;transform:translateY(130%);transition:transform .16s ease-out}.hole.up .pop{transform:translateY(0)}.hole .pop svg{width:100%;height:100%}.hole.hit{background:#2d3f1f}.hole.miss{background:#4a1f1c}.fx{position:absolute;top:6px;left:50%;transform:translate(-50%);font-weight:800;font-size:20px;animation:rise .6s ease-out forwards}.fx-good{color:#8fe0a2}.fx-bad{color:#ff9b93}@keyframes rise{to{transform:translate(-50%,-22px);opacity:0}}.mgrid{flex:1;min-height:0;display:grid;gap:6px;padding:8px;align-content:center}.mcard{position:relative;aspect-ratio:3 / 4}.mback,.mface{position:absolute;left:0;top:0;right:0;bottom:0;border-radius:10px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);transition:opacity .18s}.mback{background:#2b3f4a}.mface{background:#12303a;opacity:0}.mcard.flip .mface,.mcard.done .mface{opacity:1}.mcard.flip .mback,.mcard.done .mback{opacity:0}.mcard.done .mface{border-color:var(--green)}.mback svg,.mface svg{width:72%;height:72%}.qbox{flex:1;min-height:0;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:6px;align-items:center}.mrow{display:flex;gap:6px;align-items:center;justify-content:center}.mslot{width:46px;height:46px;border-radius:10px;background:var(--bg2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center}.mslot.sm{width:34px;height:34px}.mslot svg{width:78%;height:78%}.dot{width:12px;height:12px;border-radius:50%;background:#3a4f5b;display:block}.mkeys{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:6px}.mkey{width:54px;height:54px;border-radius:12px;background:var(--card);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;padding:6px}.mkey svg{width:100%;height:100%}.mkey.undo{font-size:22px}.mfeed{display:grid;grid-template-columns:1fr 1fr;gap:3px;margin-left:6px}.mfeed span{width:10px;height:10px;border-radius:50%;background:#2b3d47;display:block}.mfeed span.gold{background:var(--gold)}.mfeed span.white{background:#e9e2d0}.duel{flex:1;min-height:0;display:flex;flex-direction:column}.zone{flex:1;display:flex;align-items:center;justify-content:center;border-radius:16px;margin:4px;transition:background .1s;background:#23343d;touch-action:none}.zone.top{transform:rotate(180deg)}.zone.wait{background:#4a3a18}.zone.go{background:#2f7a48}.zone.win{background:#1f5c35}.zone.lose{background:#4a2320}.z-in{display:flex;flex-direction:column;align-items:center;gap:4px}.z-in b{font-size:26px}.pips{display:flex;gap:5px;margin-top:4px}.pip{width:12px;height:12px;border-radius:50%;background:#ffffff38;display:block}.pip.on{background:var(--gold)}.ico{width:1.05em;height:1.05em;vertical-align:-.16em;margin:0 1px}.core .ico{width:1.25em;height:1.25em}.kaart{width:100%;border-collapse:collapse;margin:6px 0}.kaart td,.kaart th{border:1px solid var(--line);text-align:center;padding:6px 2px;font-weight:700;font-size:16px}.kaart th{background:var(--bg2);color:var(--gold)}.kaart th .ico{width:1.4em;height:1.4em}.kaart .corner{border:0;background:transparent}.glyphrow{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}.glyphrow span{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--dim)}.glyphrow .ico{width:20px;height:20px;color:var(--gold)}
