:root{--ink:#0e1020;--ivory:#f6f1e9;--gold:#e8c77a;--rose:#ff5c8a;--cobalt:#3f7fe0;--burgundy:#7a1f3d;--slate:#3a3d4d;--sub:#a9adc2;--r-n:#f2f2f5;--r-r:#4da3ff;--r-sr:#8a4dff;--r-ssr:#ffc21a;--prism:linear-gradient(120deg, #ff5c8a, #ffc21a, #4de0a0, #4da3ff, #8a4dff, #ff5c8a);--glass:#0e1020c7;--radius:16px;--safe-b:env(safe-area-inset-bottom,0px);--safe-t:env(safe-area-inset-top,0px);color:var(--ivory);-webkit-tap-highlight-color:transparent;font-family:PingFang SC,Microsoft YaHei,Noto Sans SC,system-ui,sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--ink);overscroll-behavior:none;-webkit-user-select:none;user-select:none;height:100%;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0}#backdrop{background:var(--ink) center/cover;filter:blur(28px)brightness(.45)saturate(1.2);transition:background-image .6s;position:fixed;inset:-40px}#app{background:var(--ink);width:min(100vw,46.1538dvh,480px);height:100dvh;margin:0 auto;position:relative;overflow:hidden;box-shadow:0 0 60px #0008}@media (width<=520px){#app{width:100vw}}.screen{flex-direction:column;animation:.35s both fadeIn;display:flex;position:absolute;inset:0}@keyframes fadeIn{0%{opacity:0}}@keyframes rise{0%{opacity:0;transform:translateY(14px)}}.btn{background:var(--ivory);min-height:48px;color:var(--ink);border-radius:999px;padding:0 22px;font-size:16px;font-weight:700;transition:transform 80ms;position:relative;overflow:hidden}.btn.ghost{background:var(--glass);color:var(--ivory);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #e8c77a66}.press{transform:scale(.95)}.ripple{pointer-events:none;background:#fff6;border-radius:50%;animation:.5s ease-out forwards ripple;position:absolute;transform:scale(0)}@keyframes ripple{to{opacity:0;transform:scale(2.6)}}.icon-btn{background:var(--glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);min-width:44px;min-height:44px;color:var(--sub);border-radius:12px;place-items:center;font-size:13px;display:grid}.scene{background:var(--ink);position:absolute;inset:0;overflow:hidden}.scene .bgfill{filter:blur(24px)brightness(.55);background:50%/cover;position:absolute;inset:-30px}.scene .art{aspect-ratio:2/3;background:50%/cover no-repeat;width:100%;transition:opacity .45s,filter .45s;position:absolute;top:0;left:0;right:0}.scene .art.sharp{opacity:1}.scene .lq{aspect-ratio:2/3;filter:blur(14px);background:50%/cover;width:100%;position:absolute;top:0;left:0;right:0;transform:scale(1.04)}.scene .ph{aspect-ratio:2/3;text-align:center;color:#fff9;place-items:center;width:100%;padding:30px;font-size:13px;line-height:1.7;display:grid;position:absolute;top:0;left:0;right:0}.scene .art-fade{background:linear-gradient(transparent, var(--ink) 75%);pointer-events:none;height:40%;position:absolute;bottom:0;left:0;right:0}.scene.dim .art,.scene.dim .lq{filter:brightness(.72)saturate(.85)}.vignette{pointer-events:none;opacity:0;transition:opacity .4s;position:absolute;inset:0;box-shadow:inset 0 0 120px #000a}.scene.dim .vignette{opacity:1}.topbar{top:calc(var(--safe-t) + 10px);z-index:5;align-items:center;gap:8px;display:flex;position:absolute;left:12px;right:12px}.topbar .spacer{flex:1}.chip{background:var(--glass);color:var(--gold);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:999px;padding:6px 12px;font-size:12px}.loc-title{text-align:center;z-index:6;pointer-events:none;position:absolute;top:18%;left:0;right:0}.loc-title b{letter-spacing:4px;background:linear-gradient(90deg,#0000,#0e1020cc 20% 80%,#0000);border-top:1px solid #e8c77a88;border-bottom:1px solid #e8c77a88;padding:10px 26px;font-size:22px;animation:2.2s both locIn;display:inline-block}@keyframes locIn{0%{opacity:0;letter-spacing:14px}25%,75%{opacity:1;letter-spacing:4px}to{opacity:0}}.dialog{left:10px;right:10px;bottom:calc(var(--safe-b) + 12px);background:var(--glass);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:4;border:1px solid #e8c77a33;border-radius:6px 18px 18px;min-height:150px;padding:22px 18px 18px;animation:.3s both rise;position:absolute}.dialog .name{color:#fff;background:var(--slate);border-radius:8px;padding:4px 14px;font-size:15px;font-weight:700;position:absolute;top:-14px;left:14px}.dialog .say{min-height:60px;font-size:17px;line-height:1.75}.dialog .say.narr{color:#d7d9e6;font-style:italic}.dialog .more{border-right:2px solid var(--gold);border-bottom:2px solid var(--gold);width:10px;height:10px;animation:1s infinite bob;position:absolute;bottom:10px;right:16px;transform:rotate(45deg)}@keyframes bob{50%{transform:translateY(4px)rotate(45deg)}}.tap-layer{z-index:3;position:absolute;inset:0}.choices{left:12px;right:12px;bottom:calc(var(--safe-b) + 16px);z-index:6;flex-direction:column;gap:12px;display:flex;position:absolute}.choices .prompt{text-align:center;color:var(--sub);margin-bottom:4px;font-size:14px;animation:.3s both rise}.opt{border-radius:var(--radius);background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);text-align:left;border:1px solid #fff2;min-height:64px;padding:14px 18px 14px 44px;font-size:16px;line-height:1.45;transition:transform .1s;animation:.35s both rise,2.4s ease-in-out infinite breathe;position:relative;overflow:hidden}.opt:before{font-size:14px;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.opt.a{box-shadow:0 0 0 1px #3f7fe055,0 0 18px #3f7fe033}.opt.a:before{content:"◆";color:var(--cobalt)}.opt.b{animation-delay:80ms,1.2s;box-shadow:0 0 0 1px #ff5c8a55,0 0 18px #ff5c8a33}.opt.b:before{content:"●";color:var(--rose)}.opt.both{border-color:var(--r-ssr);color:#ffe7a3;background:linear-gradient(135deg,#3a2a08ee,#6b4d10ee);font-weight:700}.opt.both:before{content:"✦";color:var(--r-ssr)}@keyframes breathe{50%{border-color:#fff4}}.opt .peek{border-radius:6px;padding:2px 7px;font-size:11px;font-weight:800;position:absolute;top:8px;right:10px}.opt.chosen{border-color:var(--gold);transform:scale(1.03)}.opt.gone{opacity:0;transition:all .25s;transform:scale(.96)}.aff-pop{z-index:30;color:var(--rose);text-shadow:0 2px 8px #0009;pointer-events:none;font-size:18px;font-weight:800;animation:1.4s ease-out forwards affUp;position:absolute}@keyframes affUp{0%{opacity:0;transform:translateY(10px)scale(.8)}20%{opacity:1;transform:scale(1.15)}to{opacity:0;transform:translateY(-70px)}}.heart{z-index:29;color:var(--rose);pointer-events:none;animation:1.6s ease-out forwards heartUp;position:absolute}@keyframes heartUp{0%{opacity:1;transform:translate(0)scale(.6)}to{opacity:0;transform:translate(var(--dx), -160px) scale(1.2)}}.reveal{z-index:40;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0e1020aa;place-items:center;animation:.25s both fadeIn;display:grid;position:absolute;inset:0}.reveal.dark{background:#05060dee}.reveal .stage{aspect-ratio:2/3;perspective:1000px;width:66%;animation:.45s cubic-bezier(.2,.9,.3,1.2) both flyIn;position:relative}.card3d{transform-style:preserve-3d;transition:transform .6s cubic-bezier(.3,1.4,.5,1);position:absolute;inset:0}@keyframes flyIn{0%{opacity:0;transform:translateY(60%)scale(.3)rotate(-8deg)}}.card3d .face,.card3d .back{backface-visibility:hidden;border-radius:14px;position:absolute;inset:0;overflow:hidden}.card3d .back{background:radial-gradient(circle at 50% 40%, #2a2f55, var(--ink));color:var(--gold);border:2px solid #e8c77a88;place-items:center;font-size:42px;display:grid}.card3d .face,.card3d.flipped{transform:rotateY(180deg)}.reveal .meta{left:0;right:0;bottom:calc(var(--safe-b) + 40px);text-align:center;padding:0 24px;animation:.4s .2s both rise;position:absolute}.reveal .meta h3{letter-spacing:2px;font-size:22px}.reveal .meta p{color:var(--sub);margin-top:8px;font-size:14px;line-height:1.6}.reveal .meta .new{background:var(--rose);color:#fff;border-radius:6px;margin-bottom:8px;padding:2px 10px;font-size:12px;font-weight:800;display:inline-block}.reveal .meta .dup{color:var(--sub);margin-bottom:8px;font-size:12px;display:inline-block}.reveal .hint{bottom:calc(var(--safe-b) + 12px);text-align:center;color:#fff6;width:100%;font-size:12px;position:absolute}.rays{background:repeating-conic-gradient(from 0deg, #ffc21a44 0 6deg, transparent 6deg 30deg);pointer-events:none;width:200vmax;height:200vmax;animation:8s linear infinite spin,.6s both fadeIn;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%);-webkit-mask:radial-gradient(circle,#000 0,#0000 45%);mask:radial-gradient(circle,#000 0,#0000 45%)}.rays.ur{background:repeating-conic-gradient(from 0deg, #ff5c8a44 0 5deg, transparent 5deg 15deg, #4da3ff44 15deg 20deg, transparent 20deg 30deg)}@keyframes spin{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}.flash{z-index:50;pointer-events:none;background:#fff;animation:.7s ease-out forwards flash;position:absolute;inset:0}@keyframes flash{0%{opacity:1}to{opacity:0}}.particle{pointer-events:none;z-index:45;position:absolute}.card{background:var(--slate) center/cover;border-radius:14px;width:100%;height:100%;position:relative;overflow:hidden}.card .img{background:50%/cover;position:absolute;inset:0}.card .frame{pointer-events:none;border-radius:14px;position:absolute;inset:0}.card .badge{min-width:30px;height:22px;color:var(--ink);place-items:center;padding:0 6px;font-size:11px;font-weight:900;display:grid;position:absolute;top:8px;left:8px}.card .cap{text-align:center;background:linear-gradient(#0000,#0e1020e6);padding:26px 10px 9px;font-size:13px;font-weight:700;position:absolute;bottom:0;left:0;right:0}.card.N .frame{border:2px solid var(--r-n)}.card.N .badge{background:var(--r-n);border-radius:50%}.card.R .frame{border:4px solid var(--r-r);box-shadow:inset 0 0 14px #4da3ff66,0 0 12px #4da3ff55}.card.R .badge{background:var(--r-r);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);min-width:34px;height:26px}.card.SR .frame{border:6px double var(--r-sr);box-shadow:inset 0 0 22px #8a4dff77,0 0 18px #8a4dff77}.card.SR .badge{background:var(--r-sr);color:#fff;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);min-width:38px}.card.SSR .frame{border:8px double var(--r-ssr);box-shadow:inset 0 0 28px #ffc21a88,0 0 26px #ffc21a99}.card.SSR .badge{background:var(--r-ssr);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);min-width:40px;height:36px;font-size:9px}.card.SSR:after,.card.UR:after{content:"";pointer-events:none;background:linear-gradient(115deg,#0000 35%,#fff5 50%,#0000 65%) 0 0/250% 100%;animation:2.6s ease-in-out infinite sweep;position:absolute;inset:0}@keyframes sweep{0%{background-position:150% 0}to{background-position:-100% 0}}.card.UR .frame{background:var(--prism) border-box;background-size:300% 300%;border:10px solid #0000;animation:3s linear infinite prism;-webkit-mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor,source-over;mask:linear-gradient(#000 0 0) padding-box exclude,linear-gradient(#000 0 0)}.card.UR .badge{background:var(--prism);color:#fff;border-radius:6px}@keyframes prism{to{background-position:300% 0}}.card.locked{background:#1b1d2b}.card.locked .img{filter:brightness(0);opacity:.35}.card.locked .frame{box-shadow:none;border:1px dashed #e8c77a55}.card.locked .q{color:#e8c77a55;place-items:center;font-size:34px;display:grid;position:absolute;inset:0}.panel{background:var(--glass);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:var(--radius);border:1px solid #e8c77a33;padding:16px}.gold{color:var(--gold)}.bar{background:#ffffff18;border-radius:5px;height:10px;overflow:hidden}.bar>i{background:linear-gradient(90deg, #b8913f, var(--gold), #fff2c4);border-radius:5px;height:100%;transition:width 1s;display:block}.scroll{-webkit-overflow-scrolling:touch;flex:1;overflow-y:auto}.levelup{z-index:60;text-align:center;background:radial-gradient(circle at 50% 60%,#4a3a12,#0e1020 70%);flex-direction:column;justify-content:center;align-items:center;gap:18px;padding:24px;animation:.3s both fadeIn;display:flex;position:absolute;inset:0}.levelup .pillar{filter:blur(12px);pointer-events:none;background:linear-gradient(#0000,#ffc21a33 60%,#ffe9a866);width:46%;height:100%;animation:1.2s ease-out both pillar;position:absolute;bottom:0;left:27%}@keyframes pillar{0%{transform-origin:bottom;transform:scaleY(0)}}.levelup h2{letter-spacing:6px;color:var(--gold);text-shadow:0 0 24px #ffc21a88;font-size:30px;animation:.5s .3s both rise}.levelup .lv{color:#fff3c8;font-size:64px;font-weight:900;animation:.6s cubic-bezier(.2,1.6,.4,1) .5s both pop}@keyframes pop{0%{opacity:0;transform:scale(.2)}}.ability{border:1px solid var(--gold);background:#0e1020cc;border-radius:14px;max-width:320px;padding:14px 16px;animation:.5s .9s both rise}.ability b{color:var(--gold);font-size:18px}.ability p{color:var(--sub);margin-top:6px;font-size:14px}.toast{left:50%;top:calc(var(--safe-t) + 64px);z-index:70;background:var(--glass);border:1px solid var(--gold);white-space:nowrap;border-radius:999px;padding:10px 18px;font-size:14px;animation:.3s both rise;position:absolute;transform:translate(-50%)}@keyframes breathe2{50%{opacity:.45;transform:translateY(3px)}}@supports not (aspect-ratio:1){.scene .art,.scene .lq,.scene .ph{height:150vw;max-height:720px}.reveal .stage{height:99vw;max-height:480px}}#err{z-index:999;color:#fff;white-space:pre-wrap;background:#400;max-height:40%;padding:8px;font:12px/1.4 monospace;position:fixed;bottom:0;left:0;right:0;overflow:auto}