:root{--night: #16130f;--panel: rgba(22, 18, 14, .9);--paper: #f3e6cf;--paper-dim: #cbb892;--cinnabar: #d24a32;--gold: #e0b15a;--ink: #1a1612;--line: rgba(243, 230, 207, .16);--sans: "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;--serif: "Noto Serif SC", SimSun, serif;--num: "Big Shoulders Display", "Arial Narrow", sans-serif;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--night);color:var(--paper);font-family:var(--sans)}button,input,select{font:inherit;color:inherit}button{cursor:pointer}[hidden]{display:none!important}:focus-visible{outline:2px solid var(--gold);outline-offset:2px}#stage{position:fixed;inset:0;width:100%;height:100%;display:block}#splash{position:fixed;inset:0;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:32px 20px 48px;background:radial-gradient(ellipse 42% 58% at 50% 0%,rgba(232,206,160,.28),transparent 70%),var(--night);transition:opacity .7s ease}#splash.is-gone{opacity:0;pointer-events:none}.eyebrow{margin:0;letter-spacing:.18em;color:var(--paper-dim);font-size:13px}.hero-num{margin:8px 0 0;line-height:.84;font-family:var(--num);font-weight:800;font-size:clamp(120px,22vw,220px);color:#e7c99a}h1{margin:0;font-family:var(--serif);font-weight:700;font-size:48px;letter-spacing:.2em}.lead{max-width:36em;margin:16px 0 0;line-height:1.7;color:var(--paper-dim)}.fine{color:var(--paper-dim);font-size:13px;line-height:1.6}.stats{display:flex;gap:28px;margin:28px 0 8px}.stats div{display:flex;flex-direction:column;min-width:72px}.stats b{font-family:var(--num);font-size:40px;font-weight:700;line-height:1}.stats span{margin-top:4px;color:var(--paper-dim);font-size:13px}#enter{margin-top:22px;border:0;border-radius:999px;background:var(--cinnabar);color:#fff8f2;padding:12px 36px;font-size:18px}#enter:disabled{background:#5c4036;cursor:wait}#topbar{position:fixed;top:0;left:0;right:0;z-index:12;display:flex;justify-content:space-between;align-items:center;padding:14px 18px;pointer-events:none}#topbar>*{pointer-events:auto}.brand{display:flex;flex-direction:column}.brand strong{font-family:var(--serif);font-size:22px;letter-spacing:.14em}.brand span{color:var(--paper-dim);font-size:12px}.top-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.top-btn,.ghost,.solid{border-radius:999px;border:1px solid var(--line);background:#16120eb8;padding:7px 14px}.top-btn.is-hot,.solid{background:var(--cinnabar);border-color:transparent;color:#fff8f2}.top-btn[aria-pressed=true]{border-color:var(--gold);color:var(--gold)}.bench{position:fixed;z-index:12;top:64px;left:14px;bottom:92px;width:min(320px,calc(100vw - 28px));transform:translate(calc(-100% - 24px));transition:transform .35s ease}.bench.is-open{transform:none}#bench-toggle{position:absolute;top:0;left:calc(100% + 8px);border:0;border-radius:999px;background:var(--cinnabar);color:#fff8f2;padding:8px 14px;white-space:nowrap}.bench-body{height:100%;overflow:auto;padding:16px 14px 20px;background:var(--panel);border:1px solid var(--line);border-radius:18px;backdrop-filter:blur(10px)}.bench-body h2{margin:14px 0 8px;font-size:13px;font-weight:500;color:var(--paper-dim)}.bench-body section:first-child h2{margin-top:0}#q,#sort,.pick input{width:100%;border-radius:10px;border:1px solid var(--line);background:#fff8ec0f;padding:8px 10px}.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{border-radius:999px;border:1px solid var(--line);background:transparent;padding:4px 8px}.chip small{margin-left:6px;color:var(--paper-dim)}.chip[aria-pressed=true]{background:var(--cinnabar);border-color:transparent}.row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0;font-size:14px}.row input[type=range]{width:120px}.row b{font-weight:500;color:var(--gold)}.switch{width:42px;height:24px;border:0;border-radius:99px;background:#3a322b;position:relative;flex:none}.switch[aria-checked=true]{background:var(--cinnabar)}.switch:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--paper);transition:transform .15s ease}.switch[aria-checked=true]:after{transform:translate(18px)}.bench-actions{display:flex;gap:8px}.bench-actions .ghost{flex:1}#dock{position:fixed;z-index:12;left:50%;bottom:18px;transform:translate(-50%);display:flex;align-items:center;gap:4px;padding:6px;border-radius:999px;background:#16120ee0;border:1px solid var(--line)}.mode-btn{border:0;background:transparent;border-radius:999px;padding:8px 12px;color:var(--paper-dim)}.mode-btn[aria-pressed=true]{background:#e7c99a;color:var(--ink)}.mode-btn kbd{font-family:var(--num);margin-left:4px}.led{margin:0 10px 0 6px;color:var(--paper-dim);font-size:13px;white-space:nowrap}.led b{color:var(--gold);font-family:var(--num);font-size:18px}#hint{position:fixed;z-index:12;right:16px;bottom:22px;margin:0;color:var(--paper-dim);font-size:12px}#tip{position:fixed;z-index:15;margin:0;pointer-events:none;padding:4px 8px;border-radius:8px;background:#16120eeb;border:1px solid var(--line);font-size:14px}.empty{position:fixed;z-index:11;left:50%;top:46%;transform:translate(-50%,-50%);text-align:center}.toast{position:fixed;z-index:50;left:50%;bottom:84px;transform:translate(-50%);margin:0;padding:8px 14px;border-radius:999px;background:var(--paper);color:var(--ink)}.modal{position:fixed;inset:0;z-index:40;display:flex;justify-content:center;align-items:flex-start;overflow:auto;padding:24px;background:#0a08069e}.sheet,.pack-wrap{position:relative;width:min(920px,100%);margin:auto;flex:none;background:#1c1814;border:1px solid var(--line);border-radius:22px;padding:22px}.modal-x{position:absolute;top:12px;right:12px;width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:transparent}.profile-sheet{display:grid;grid-template-columns:280px 1fr;gap:22px}.tilt{position:relative}#pf-card canvas,#pack-front canvas,#pack-back canvas,.vs-cards canvas{width:100%;height:auto;border-radius:12px;display:block;transform-style:preserve-3d}.tilt-hint{text-align:center;color:var(--paper-dim);font-size:12px}#pf-eye{margin:8px 0 0;color:var(--gold)}#pf-char{margin:4px 0;font-family:var(--serif);font-size:64px;line-height:1}#pf-py{margin:0 0 12px;font-size:20px;letter-spacing:.06em}.bar{display:grid;grid-template-columns:72px 1fr auto;gap:8px;align-items:center;margin:8px 0;font-size:14px}.bar i{display:block;height:8px;border-radius:99px;background:#3a322b}.bar i span{display:block;height:100%;border-radius:inherit;background:#e7c99a}#pf-words{font-size:18px}.pf-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.pack-wrap{width:min(360px,100%);text-align:center;background:transparent;border:0}.flip{position:relative;width:min(260px,70vw);margin:0 auto 12px;aspect-ratio:5 / 7;transform-style:preserve-3d;transition:transform .7s ease}.flip.is-open{transform:rotateY(180deg)}.face{position:absolute;inset:0;backface-visibility:hidden}.face.front{transform:rotateY(180deg)}.pack-x{top:-6px;right:0}#pack-cap{min-height:1.4em;font-size:18px}.vs-sheet{width:min(980px,100%)}.vs-picks{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:start;margin-top:12px}.pick{position:relative}.suggest{position:absolute;z-index:2;left:0;right:0;top:calc(100% + 4px);background:#2a241e;border:1px solid var(--line);border-radius:10px;overflow:hidden}.suggest button{display:block;width:100%;text-align:left;border:0;background:transparent;padding:8px 10px}.suggest button:hover{background:#fff8ec0f}.vs-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:14px}.vs-cards canvas{max-height:360px;width:auto;margin:0 auto}.vs-row{display:grid;grid-template-columns:72px 1fr 88px 1fr 72px;gap:8px;align-items:center;margin:8px 0}.vs-row .num{text-align:center;font-family:var(--num);font-size:22px}.vs-row .num.win{color:var(--gold)}.track{height:8px;border-radius:99px;background:#3a322b}.track span{display:block;height:100%;border-radius:inherit;background:#8d8072}.track.win span{background:var(--cinnabar)}.track.right span{margin-left:auto}.about-sheet{width:min(640px,100%);max-height:min(84vh,820px);overflow:auto}.about-sheet h3{margin:18px 0 6px;font-size:16px}.about-sheet li{margin:6px 0;line-height:1.6}@media(max-width:800px){#hint{display:none}.stats{gap:14px}.hero-num{font-size:108px}#dock{width:calc(100% - 16px);overflow:auto}.vs-row{grid-template-columns:56px 1fr 64px 1fr 56px}}@media(max-width:560px){.profile-sheet{grid-template-columns:1fr}#pf-card canvas{max-height:42vh;width:auto;margin-inline:auto}#pf-char{font-size:48px}}@media(prefers-reduced-motion:reduce){#splash,.bench,.flip,.switch:after{transition:none}}