:root{--bg:#0b0d12;--bg2:#0f1219;--panel:#12151f;--panel2:#171b28;--line:#2a3145;--ink:#e8f0ff;--ink-dim:#8d97b5;--ink-faint:#5b647f;--cyan:#00ffa3;--magenta:#ff2e88;--violet:#7c4dff;--gold:#ffd400;--blue:#00d0ff;--orange:#ff8a3d;--red:#ff3b3b;--px:4px;--font:"Zpix", "Fusion Pixel 12px", "Silkscreen", "Press Start 2P", ui-monospace, "SFMono-Regular", "Menlo", "Consolas", "PingFang SC", "Microsoft YaHei", monospace}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%}body{min-height:100vh;color:var(--ink);font-family:var(--font);letter-spacing:.3px;image-rendering:pixelated;background:radial-gradient(120% 80% at 50% -10%,#1a2036 0%,#0b0d12 55%,#06070a 100%);flex-direction:column;margin:0;font-size:15px;line-height:1.85;display:flex;overflow-x:hidden}.fx-scan,.fx-vignette,.fx-noise{pointer-events:none;z-index:60;position:fixed;top:0;bottom:0;left:0;right:0}.fx-scan{mix-blend-mode:multiply;opacity:.55;background:repeating-linear-gradient(#0000 0 2px,#00000047 3px 4px)}.fx-vignette{background:radial-gradient(120% 100%,#0000 45%,#000000bf 100%)}.fx-noise{opacity:.05;background-image:repeating-conic-gradient(#fff 0% 25%,#000 0% 50%);background-size:3px 3px;animation:.6s steps(2,end) infinite noiseShift}@keyframes noiseShift{0%{transform:translate(0)}50%{transform:translate(-1px,1px)}to{transform:translate(0)}}@keyframes blink{0%,49%{opacity:1}50%,to{opacity:.25}}@media (prefers-reduced-motion:reduce){.fx-noise,.big-title:before,.big-title:after,.gaze-led,.caret{animation:none}}.topbar{z-index:40;border-bottom:var(--px) solid var(--line);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:linear-gradient(#0b0d12f5,#0b0d12b8);align-items:center;gap:10px;padding:10px 12px;display:flex;position:sticky;top:0}.brand{color:var(--ink);letter-spacing:2px;border:var(--px) solid var(--cyan);box-shadow:var(--px) var(--px) 0 0 #00ffa338;text-shadow:2px 0 #ff2e888c,-2px 0 #00d0ff73;padding:2px 8px;font-size:16px;font-weight:700;text-decoration:none}.brand .dot{color:var(--magenta)}.gaze{color:var(--ink-dim);white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:6px;max-width:62vw;margin-left:auto;font-size:11px;display:flex;overflow:hidden}.gaze b{color:var(--gold);font-variant-numeric:tabular-nums;font-size:12px}.gaze-led{background:var(--cyan);width:8px;height:8px;box-shadow:0 0 8px var(--cyan);animation:1.4s steps(2,end) infinite blink;display:inline-block}.iconbtn{color:var(--ink-dim);border:2px solid var(--line);cursor:pointer;width:30px;height:30px;line-height:1;font-family:var(--font);background:0 0;padding:0;font-size:14px}.iconbtn.on{color:var(--cyan);border-color:var(--cyan)}.app{z-index:10;flex:auto;width:100%;max-width:760px;margin:0 auto;padding:16px 12px;position:relative}.footbar{z-index:40;color:var(--ink-faint);border-top:2px solid var(--line);background:#06070aeb;justify-content:space-between;gap:8px;padding:6px 12px;font-size:10px;display:flex;position:sticky;bottom:0}.footbar-copy{margin-left:auto}.footbar .footbar-author{color:var(--ink-faint);text-underline-offset:2px;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;transition:color .1s step-end}.footbar .footbar-author:hover{color:var(--cyan);text-decoration-style:solid}.panel{background:var(--panel);border:var(--px) solid var(--line);box-shadow:var(--px) var(--px) 0 0 #0009, 0 0 0 1px #ffffff05 inset;margin-bottom:16px;padding:16px}.panel.cy{border-color:#12513d}.panel.mg{border-color:#5a1236}.btn{font-family:var(--font);letter-spacing:1px;color:#04110c;background:var(--cyan);cursor:pointer;box-shadow:var(--px) var(--px) 0 0 #063a2a;border:none;justify-content:center;align-items:center;gap:8px;padding:12px 18px;font-size:14px;font-weight:700;text-decoration:none;transition:transform 40ms step-end,box-shadow 40ms step-end;display:inline-flex}.btn:active{transform:translate(3px,3px);box-shadow:1px 1px #063a2a}.btn.mg{background:var(--magenta);color:#180310;box-shadow:var(--px) var(--px) 0 0 #4d0a26}.btn.ghost{color:var(--ink);border:var(--px) solid var(--line);box-shadow:var(--px) var(--px) 0 0 #0009;background:0 0}.btn.sm{padding:8px 12px;font-size:12px}.btn[disabled]{opacity:.4;cursor:not-allowed}.btnrow{flex-wrap:wrap;gap:10px;margin-top:14px;display:flex}@media (max-width:420px){.gaze{max-width:56vw;font-size:10px}.app{padding:12px 10px}}.stage-head{align-items:center;gap:10px;margin-bottom:10px;display:flex}.stage-time{color:#0a1a14;background:var(--cyan);letter-spacing:1px;padding:2px 8px;font-size:12px;font-weight:700;box-shadow:3px 3px #063a2a}.stage-name{color:var(--ink-faint);letter-spacing:2px;font-size:12px}.stage-name:before{content:"// "}.countdown{letter-spacing:4px;color:var(--red);text-shadow:2px 0 #ff2e8899,-2px 0 #00d0ff59;font-variant-numeric:tabular-nums;justify-content:center;align-items:baseline;gap:8px;margin:4px 0 2px;font-size:clamp(24px,9vw,44px);display:flex}.countdown .lbl{letter-spacing:2px;color:var(--ink-faint);text-shadow:none;font-size:11px}.cd-bar{border:2px solid var(--line);background:#1b2030;height:8px;margin:8px 0 0;position:relative;overflow:hidden}.cd-bar i{background:linear-gradient(90deg, var(--red), var(--magenta));width:100%;height:100%;display:block}.narr{white-space:pre-wrap;color:#dbe4ff;cursor:pointer;min-height:9.5em;font-size:14px;line-height:2.05}.caret{background:var(--cyan);vertical-align:-2px;width:9px;height:16px;animation:.7s steps(2,end) infinite blink;display:inline-block}.choices{flex-direction:column;gap:12px;margin-top:16px;display:flex}.choice{text-align:left;cursor:pointer;width:100%;font-family:var(--font);background:var(--panel2);color:var(--ink);border:var(--px) solid var(--line);box-shadow:var(--px) var(--px) 0 0 #000000a6;padding:12px 14px;transition:transform 40ms step-end}.choice:hover{border-color:var(--cyan)}.choice:active{transform:translate(3px,3px);box-shadow:1px 1px #000000a6}.choice .ct{color:var(--ink);font-size:14px;font-weight:700}.choice .cd{color:var(--ink-dim);margin-top:4px;font-size:11px}.choice .ck{color:var(--cyan);font-weight:700}.effects{flex-wrap:wrap;gap:6px;margin-top:12px;display:flex}.eff{border:2px solid var(--line);color:var(--ink-dim);padding:2px 6px;font-size:11px}.eff.up{color:var(--cyan);border-color:#12513d}.eff.down{color:var(--magenta);border-color:#5a1236}.hud{grid-template-columns:repeat(2,1fr);gap:6px 14px;margin:2px 0 0;display:grid}.hud-row{align-items:center;gap:8px;font-size:11px;display:flex}.hud-name{width:3.4em;color:var(--ink-dim);flex:none}.hud-blocks{flex:auto;gap:2px;display:flex}.hud-blocks i{background:#1e2434;border:1px solid #2a3145;width:100%;max-width:9px;height:12px;display:block}.hud-val{text-align:right;width:2.2em;color:var(--ink-faint);font-variant-numeric:tabular-nums}.toast{background:var(--panel);border:var(--px) solid var(--cyan);color:var(--ink);z-index:80;text-align:center;max-width:86vw;box-shadow:var(--px) var(--px) 0 0 #000000b3;padding:10px 16px;font-size:12px;position:fixed;bottom:70px;left:50%;transform:translate(-50%)}.toast.err{border-color:var(--magenta)}@media (max-width:420px){.hud{grid-template-columns:1fr}}.title-screen{text-align:center;padding:22px 6px 6px}.big-title{letter-spacing:6px;color:var(--ink);text-shadow:3px 0 #ff2e88bf,-3px 0 #00d0ff99;margin:6px 0 2px;font-size:clamp(38px,15vw,84px);font-weight:700;line-height:1.05;position:relative}.big-title:before,.big-title:after{content:attr(data-text);position:absolute;top:0;left:0;right:0}.big-title:before{color:var(--magenta);clip-path:inset(0 0 62%);opacity:.85;animation:3.4s steps(3,end) infinite gl1}.big-title:after{color:var(--blue);clip-path:inset(58% 0 0);opacity:.85;animation:2.7s steps(3,end) infinite gl2}@keyframes gl1{0%,88%{transform:translate(0)}90%{transform:translate(-4px,-2px)}94%{transform:translate(3px,1px)}to{transform:translate(0)}}@keyframes gl2{0%,90%{transform:translate(0)}92%{transform:translate(4px,2px)}96%{transform:translate(-3px,-1px)}to{transform:translate(0)}}.sub-title{color:var(--cyan);letter-spacing:8px;margin:6px 0 0;font-size:13px}.sub-title:before{content:"> "}.sub-title:after{content:" _"}.tagline{text-align:left;border-left:var(--px) solid var(--magenta);max-width:560px;color:var(--ink-dim);margin:18px auto 0;padding:8px 0 8px 12px;font-size:13px;line-height:2}.badges{flex-wrap:wrap;justify-content:center;gap:8px;margin-top:18px;display:flex}.badge{border:2px solid var(--line);color:var(--ink-dim);padding:4px 8px;font-size:11px}.badge b{color:var(--gold)}.ending-head{text-align:center;padding:6px 0 2px}.ending-tag{letter-spacing:3px;color:var(--ink-faint);font-size:11px}.ending-name{letter-spacing:4px;text-shadow:3px 0 #ff2e88b3,-3px 0 #00d0ff80;margin:8px 0 6px;font-size:clamp(24px,8vw,40px);font-weight:700}.ending-quote{color:var(--gold);border-top:2px dashed var(--line);border-bottom:2px dashed var(--line);margin:12px 0;padding:12px 4px;font-size:14px;line-height:2}.ending-quote:before{content:"「 "}.ending-quote:after{content:" 」"}.ending-detail{color:var(--ink-dim);white-space:pre-wrap;font-size:13px;line-height:2}.poster-wrap{text-align:center;margin:14px 0 0}.poster-wrap canvas{border:var(--px) solid var(--line);width:100%;max-width:340px;height:auto;box-shadow:var(--px) var(--px) 0 0 #000000b3}.unlock-note{color:var(--cyan);text-align:center;margin-top:8px;font-size:11px}.unlock-note.new:after{content:" ★NEW";color:var(--gold)}.gal-hero{background:var(--panel2);border:3px solid var(--line);margin:6px 0 4px;padding:14px;box-shadow:4px 4px #00000080}.gal-hero-bar{border:2px solid var(--line);background:#1b2030;height:14px;position:relative;overflow:hidden}.gal-hero-bar i{background:linear-gradient(90deg, var(--cyan), var(--blue));height:100%;box-shadow:0 0 10px var(--cyan);transition:width .4s;display:block}.gal-hero-meta{justify-content:space-between;align-items:baseline;margin-top:10px;display:flex}.gal-hero-big{color:var(--cyan);font-variant-numeric:tabular-nums;text-shadow:0 0 10px #00ffa366;font-size:26px;font-weight:700}.gal-hero-note{color:var(--ink-faint);font-size:12px}.gal-group{margin-top:22px}.gal-group-head{border-bottom:2px solid var(--line);align-items:center;gap:10px;margin-bottom:12px;padding-bottom:8px;display:flex}.gal-group-icon{font-size:16px;line-height:1}.gal-group-title{letter-spacing:2px;color:var(--gc);font-size:14px;font-weight:700}.gal-group-mini{align-items:center;gap:8px;margin-left:auto;display:flex}.gal-group-mini .cd-bar{border-width:1px;width:90px;height:6px;margin:0}.gal-group-mini .cd-bar i{background:var(--gc)}.gal-group-count{color:var(--ink-faint);font-variant-numeric:tabular-nums;text-align:right;min-width:3em;font-size:11px}.gal-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;display:grid}.gal-card{border:3px solid var(--line);background:linear-gradient(#1a1f2f 0%,#131622 100%);min-height:130px;padding:13px 11px 11px;position:relative;overflow:hidden;box-shadow:4px 4px #00000080}.gal-card.on{border-color:color-mix(in srgb, var(--ec) 60%, var(--line));box-shadow:4px 4px 0 0 #00000080, 0 0 14px -5px var(--ec), inset 0 0 20px color-mix(in srgb, var(--ec) 6%, transparent)}.gal-card.on:before{content:"";background:repeating-linear-gradient(-45deg, transparent 0 14px, color-mix(in srgb, var(--ec,transparent) 6%, transparent) 14px 16px);pointer-events:none;position:absolute;top:-40%;bottom:-40%;left:-20%;right:-20%}.gal-band{height:5px;position:absolute;top:0;left:0;right:0}.gal-card.route-sell .gal-band{background:linear-gradient(90deg, var(--gold), #8a6d00)}.gal-card.route-fight .gal-band{background:linear-gradient(90deg, var(--magenta), #8a1d4f)}.gal-card.route-hidden .gal-band{background:linear-gradient(90deg, var(--violet), #43278a)}.gal-topline{margin-bottom:6px}.gal-card .gt{letter-spacing:1px;color:var(--ec,var(--ink-faint));z-index:1;font-size:9px;position:relative}.gal-card .gn{color:var(--ink);z-index:1;margin-bottom:6px;font-size:15px;font-weight:700;line-height:1.4;position:relative}.gal-card.on .gn{color:var(--ec)}.gal-card .gq{color:var(--ink-dim);z-index:1;font-size:11px;line-height:1.7;position:relative}.gal-count{color:#5b647f;border-top:1px dashed var(--line);z-index:1;margin-top:8px;padding-top:6px;font-size:10px;position:relative}.gal-card.off{border-style:dashed;border-color:var(--line);box-shadow:none;background:repeating-linear-gradient(45deg,#ffffff03 0 6px,#0000 6px 12px);justify-content:center;align-items:center;display:flex}.gal-card .gal-lock{flex-direction:column;align-items:center;gap:4px;display:flex}.gal-card .glock{color:var(--ink-faint);letter-spacing:0;opacity:.5;font-size:30px;font-weight:700;line-height:1}.hand-wrap{margin-top:22px}.hand{perspective:900px;justify-content:center;align-items:flex-end;min-height:256px;padding:54px 10px 12px;display:flex;overflow:visible}.hand-actions{justify-content:center;margin-top:6px;display:flex}.card-slot{cursor:pointer;width:132px;font-family:var(--font);transform-origin:50% 100%;will-change:transform;background:0 0;border:none;flex:none;margin-left:-30px;padding:0;transition:transform .18s cubic-bezier(.22,1,.36,1),filter .18s}.card-slot:first-child{margin-left:0}.card-slot:first-child{transform:rotate(-7deg)translateY(12px)}.card-slot:nth-child(2){transform:rotate(-3.5deg)translateY(5px)}.card-slot:nth-child(3){transform:rotate(0)translateY(0)}.card-slot:nth-child(4){transform:rotate(3.5deg)translateY(5px)}.card-slot:nth-child(5){transform:rotate(7deg)translateY(12px)}.card-slot:hover{filter:drop-shadow(0 12px 16px #000000b3);z-index:10;transform:rotate(0)translateY(-36px)scale(1.16)}.card-slot:active{transition-duration:50ms;transform:rotate(0)translateY(-22px)scale(1.22)}.card-slot.playing{opacity:0;z-index:20;pointer-events:none;transition:transform .26s cubic-bezier(.3,.7,.4,1),opacity .26s;transform:rotate(0)translateY(-150px)scale(1.5)}.card{border:3px solid var(--card-edge,var(--line));text-align:left;width:100%;height:200px;animation:.36s cubic-bezier(.22,1,.36,1) both dealIn;animation-delay:var(--deal,0s);background:linear-gradient(#191d2b 0%,#10131d 100%);flex-direction:column;padding:10px 9px 9px;display:flex;position:relative;overflow:hidden}.card.r-common{box-shadow:4px 4px #000000a6,inset 0 0 0 1px #ffffff08}.card.r-rare{box-shadow:4px 4px 0 0 #000000a6, 0 0 9px -4px var(--card-edge), inset 0 0 0 1px #ffffff0a}.card.r-epic{box-shadow:4px 4px 0 0 #000000a6, 0 0 14px -3px var(--card-edge), inset 0 0 0 1px #ffffff0d}.card.r-legendary{box-shadow:4px 4px 0 0 #000000a6, 0 0 24px 0 var(--card-edge), inset 0 0 0 1px #ffffff14}.card:before{content:"";background:repeating-linear-gradient(-45deg, transparent 0 14px, color-mix(in srgb, var(--card-edge,transparent) 7%, transparent) 14px 16px);pointer-events:none;position:absolute;top:-40%;bottom:-40%;left:-20%;right:-20%}@keyframes dealIn{0%{opacity:0;transform:translateY(-20px)rotate(-3deg)}to{opacity:1;transform:translateY(0)rotate(0)}}.card-band{z-index:2;height:4px;position:absolute;top:0;left:0;right:0}.card-band.sell{background:var(--gold)}.card-band.fight{background:var(--magenta)}.card-name{color:var(--ink);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:14px;font-weight:700;line-height:1.4;display:-webkit-box;overflow:hidden}.card-dirs{flex-wrap:wrap;flex:auto;place-content:center;gap:6px 10px;min-height:0;margin:10px 0;display:flex}.dir{border:1px solid color-mix(in srgb, var(--attr) 45%, transparent);background:color-mix(in srgb, var(--attr) 9%, transparent);align-items:center;gap:4px;padding:2px 7px;font-size:12px;display:inline-flex}.dir-dot{background:var(--attr);flex:none;width:6px;height:6px}.dir-name{color:var(--ink-dim)}.dir-arrow{font-size:13px;font-weight:700}.dir.up .dir-arrow{color:var(--cyan)}.dir.down .dir-arrow{color:var(--magenta)}.card-desc{color:var(--ink-dim);-webkit-line-clamp:1;-webkit-box-orient:vertical;margin-top:6px;font-size:10px;line-height:1.5;display:-webkit-box;overflow:hidden}.card-fx{margin-top:auto;padding-top:6px}.card-fx .effects{flex-wrap:wrap;gap:4px;margin-top:0}.eff{border:2px solid color-mix(in srgb, var(--attr,var(--line)) 50%, transparent);background:color-mix(in srgb, var(--attr,var(--panel)) 10%, transparent);color:var(--ink-dim);align-items:center;gap:3px;padding:1px 5px;font-size:11px;display:inline-flex}.eff-dot{background:var(--attr,var(--ink-dim));flex:none;width:6px;height:6px;display:inline-block}.eff-name{color:var(--ink-dim)}.eff-val{color:var(--attr,var(--ink));font-variant-numeric:tabular-nums;font-weight:700}.card-fx .eff{border-width:1px;gap:2px;padding:1px 4px;font-size:9px}.card-fx .eff-dot{width:5px;height:5px}@media (max-width:640px){.hand{perspective:600px;min-height:214px;padding:46px 4px 10px}.card-slot{width:74px;margin-left:-16px}.card-slot:first-child{transform:rotate(-5deg)translateY(9px)}.card-slot:nth-child(2){transform:rotate(-2.5deg)translateY(4px)}.card-slot:nth-child(3){transform:rotate(0)translateY(0)}.card-slot:nth-child(4){transform:rotate(2.5deg)translateY(4px)}.card-slot:nth-child(5){transform:rotate(5deg)translateY(9px)}.card-slot:hover{transform:rotate(0)translateY(-26px)scale(1.2)}.card{border-width:2px;height:150px;padding:7px 5px 5px}.card-band{height:3px}.card-name{-webkit-line-clamp:2;font-size:11px;line-height:1.35}.card-dirs{gap:4px 6px;margin:6px 0}.dir{gap:2px;padding:1px 4px;font-size:9px}.dir-dot{width:4px;height:4px}.dir-arrow{font-size:10px}.card-desc{margin-top:4px;font-size:9px;line-height:1.4}.card-fx{padding-top:4px}.card-fx .eff{padding:0 3px;font-size:8px}}.card-slot,.card,.hand,.card-overlay{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.card-overlay{z-index:90;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}.card-overlay-mask{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#04060ad6;position:absolute;top:0;bottom:0;left:0;right:0}.card-preview{z-index:1;flex-direction:column;align-items:center;animation:.18s previewIn;display:flex;position:relative}@keyframes previewIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.card-preview-face .card{width:210px;height:320px;padding:13px;animation:none;box-shadow:6px 6px #000000bf}.card-preview-face .card-name{-webkit-line-clamp:4;font-size:18px;line-height:1.5}.card-preview-face .card-dirs{gap:8px 12px;margin:14px 0}.card-preview-face .dir{padding:3px 9px;font-size:14px}.card-preview-face .dir-dot{width:8px;height:8px}.card-preview-face .dir-arrow{font-size:16px}.card-preview-face .card-desc{-webkit-line-clamp:3;font-size:12px;line-height:1.6}.card-preview-face .card-fx .eff{padding:2px 5px;font-size:11px}@media (prefers-reduced-motion:reduce){.card{animation:none}.card-slot{transition:none}}
