@font-face{font-family:BF Display;src:url(/fonts/display.woff2)format("woff2");font-display:swap}@font-face{font-family:BF Title;src:url(/fonts/title.woff2)format("woff2");font-display:swap}:root{--paper:#e7e0cd;--paper-2:#d6cdb4;--ink:#15130f;--ink-2:#4a463d;--line:#15130f2e;--veil:#e7e0cdd1;--red:#c23a22;--red-ink:#fbf3e4;--blue:#25667f;--good:#3c7a4a;--font-display:"BF Display", "Kaiti SC", "STKaiti", "KaiTi", "Ma Shan Zheng", serif;--font-title:"BF Title", "BF Display", "Kaiti SC", "STKaiti", "KaiTi", serif;--font-body:"Songti SC", "STSong", "Noto Serif SC", "Source Han Serif SC", "SimSun", serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--paper:#151a24;--paper-2:#0c1018;--ink:#e4e8ea;--ink-2:#a3acb7;--line:#e4e8ea2e;--veil:#10141dcc;--red:#e0553a;--red-ink:#1a0f0b;--blue:#5fb3d0;--good:#7cc48a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--paper:#151a24;--paper-2:#0c1018;--ink:#e4e8ea;--ink-2:#a3acb7;--line:#e4e8ea2e;--veil:#10141dcc;--red:#e0553a;--red-ink:#1a0f0b;--blue:#5fb3d0;--good:#7cc48a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}body{background:var(--paper);color:var(--ink);font:15px/1.6 var(--font-body);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;touch-action:none;-webkit-user-select:none;user-select:none}#app{position:fixed;inset:0}canvas.stage{width:100%;height:100%;display:block;position:absolute;inset:0}[hidden]{display:none!important}button,input{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:0;padding:0}:focus-visible{outline:2px solid var(--red);outline-offset:3px}input{-webkit-user-select:text;user-select:text}.ui{z-index:20;pointer-events:none;position:absolute;inset:0}.screen{pointer-events:auto;padding:max(20px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));animation:.35s ease-out both screen-in;position:absolute;inset:0;overflow-y:auto}@keyframes screen-in{0%{opacity:0;transform:translateY(6px)}}.primary,.ghost,.seg button,.result-btns button,.pause-btns button,.sel-foot button,.online-grid .join button,.room-box button,.profile button{letter-spacing:.12em;border-radius:2px;min-height:44px;padding:0 22px;transition:transform .12s,background .2s}.primary{background:var(--ink);color:var(--paper)}.primary:hover{background:var(--red);color:var(--red-ink)}.ghost{border:1px solid var(--line)}.ghost:hover{border-color:var(--ink)}button:active{transform:translateY(1px)}button:disabled{opacity:.45;cursor:default}.link{color:var(--red);text-underline-offset:3px;text-decoration:underline}.page-head{align-items:center;gap:16px;max-width:980px;margin:0 auto 18px;display:flex}.page-head h2{font:400 clamp(30px, 5vw, 44px)/1 var(--font-display);letter-spacing:.08em;margin:0}.hint{color:var(--ink-2);margin:6px 0;font-size:13px}.field{gap:4px;display:grid}.field span{letter-spacing:.2em;color:var(--ink-2);font-size:12px}.field input{border:0;border-bottom:2px solid var(--ink);background:0 0;border-radius:0;outline:none;min-height:44px;padding:0 12px;font-size:18px}.field input:focus{border-color:var(--red)}.menu,.settings,.online,.account,.board-page,.select,.result,.pause{background:linear-gradient(90deg, var(--veil) 0%, var(--veil) 42%, transparent 78%)}.settings,.online,.account,.board-page,.select{background:var(--veil);-webkit-backdrop-filter:blur(6px)}.title{cursor:pointer;background:radial-gradient(ellipse at 50% 45%, var(--veil) 0%, var(--veil) 30%, transparent 80%);-webkit-backdrop-filter:blur(3px);place-items:center;display:grid}.title-wrap{text-align:center;justify-items:center;gap:6px;display:grid}.logo{font:400 clamp(110px, 22vw, 260px)/.9 var(--font-title);color:var(--ink);gap:.02em;margin:0;display:flex}.logo span:nth-child(2){transform:translateY(.18em)rotate(4deg)}.title .logo span{animation:1.1s cubic-bezier(.2,.7,.1,1) both brush-in}.title .logo span:nth-child(2){animation-delay:.25s}@keyframes brush-in{0%{opacity:0;filter:blur(10px);clip-path:inset(0 100% 0 0)}to{opacity:1;filter:blur();clip-path:inset(0)}}.tagline{letter-spacing:.6em;color:var(--ink-2);margin:28px 0 0;padding-left:.6em;font-size:clamp(14px,2vw,18px)}.start-hint{font:400 22px var(--font-display);letter-spacing:.3em;color:var(--red);margin-top:36px;animation:2.2s ease-in-out infinite breathe}@keyframes breathe{50%{opacity:.35}}.seal-corner{right:max(24px, env(safe-area-inset-right));bottom:max(24px, env(safe-area-inset-bottom));background:var(--red);color:var(--red-ink);font:400 26px/1.05 var(--font-display);border-radius:3px;padding:8px 9px;position:absolute;transform:rotate(-4deg)}.menu{padding-left:max(5vw, 16px, env(safe-area-inset-left));flex-direction:column;gap:28px;display:flex}.menu-head{flex-wrap:wrap;align-items:flex-end;gap:24px;display:flex}.logo.small{font-size:clamp(64px,9vw,100px)}.acct{text-align:left;border-left:3px solid var(--red);padding:2px 12px;display:grid}.acct b{font-weight:600}.acct span{color:var(--ink-2);font-size:12px}.menu-list{gap:4px;max-width:460px;display:grid}.menu-list>button,.menu-row>button{text-align:left;border-radius:2px;padding:10px 14px 10px 18px;transition:background .2s,padding .2s;display:grid;position:relative}.menu-list b{font:400 clamp(26px, 3.4vw, 34px)/1.2 var(--font-display);letter-spacing:.06em}.menu-list small{color:var(--ink-2);font-size:13px}.menu-list>button:before,.menu-row>button:before{content:"";background:var(--red);width:4px;transition:transform .2s;position:absolute;top:18%;bottom:18%;left:0;transform:scaleY(0)}.menu-list>button:hover,.menu-list>button:focus-visible,.menu-row>button:hover,.menu-row>button:focus-visible{background:#7f78641f;outline:none;padding-left:26px}.menu-list>button:hover:before,.menu-list>button:focus-visible:before,.menu-row>button:hover:before,.menu-row>button:focus-visible:before{transform:scaleY(1)}.menu-row{gap:4px;display:flex}.menu-row b{font-size:24px}.select{flex-direction:column;gap:16px;display:flex}.sel-head{flex-wrap:wrap;align-items:baseline;gap:16px;width:100%;max-width:1100px;margin:0 auto;display:flex}.sel-head h2{font:400 clamp(30px, 5vw, 46px)/1 var(--font-display);margin:0}.sel-head p{color:var(--ink-2);margin:0}.sel-timer{font:400 36px var(--font-display);color:var(--red);font-variant-numeric:tabular-nums;margin-left:auto}.levels{gap:8px;width:100%;max-width:1100px;margin:0 auto;display:flex}.levels button{border:1px solid var(--line);border-radius:2px;padding:6px 16px}.levels button[aria-checked=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;width:100%;max-width:1100px;margin:0 auto;display:grid}.card{text-align:left;border:1px solid var(--line);background:#7f78640f;border-radius:3px;grid-template-columns:auto 1fr;grid-template-areas:"g n""g d""s s";align-items:center;gap:4px 14px;padding:14px 16px;transition:transform .18s,border-color .18s,box-shadow .18s;display:grid}.card:hover{transform:translateY(-2px)}.card[aria-pressed=true]{border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red)}.glyph{font:400 76px/1 var(--font-display);color:var(--ink);text-align:center;grid-area:g;width:1.1em}.card[aria-pressed=true] .glyph{color:var(--red)}.card-name{grid-area:n;display:grid}.card-name b{font:400 30px/1.1 var(--font-display)}.card-name small{color:var(--ink-2);letter-spacing:.1em;font-size:12px}.card-desc{color:var(--ink-2);grid-area:d;font-size:13px}.stats{grid-area:s;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 14px;margin-top:6px;font-size:12px;display:grid}.stats>span{justify-content:space-between;align-items:center;gap:8px;display:flex}.stats em{color:var(--ink-2);letter-spacing:.15em;font-style:normal}.dots{gap:3px;display:inline-flex}.dots i{border:1px solid var(--ink-2);border-radius:50%;width:9px;height:9px}.dots i.on{background:var(--ink);border-color:var(--ink)}.card[aria-pressed=true] .dots i.on{background:var(--red);border-color:var(--red)}.sel-detail{width:100%;max-width:1100px;margin:0 auto}.detail-cols{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:24px;display:grid}.detail-cols.three{grid-template-columns:repeat(3,minmax(0,1fr))}.detail-cols h3,.detail-cols h4,.set-group h3,.sub-h{font:400 22px var(--font-display);letter-spacing:.1em;margin:0 0 6px}.detail-cols h4{font-size:18px}.moves{border-collapse:collapse;width:100%;font-size:13px}.moves th{text-align:left;white-space:nowrap;color:var(--ink-2);vertical-align:top;width:1%;padding:4px 12px 4px 0;font-weight:400}.moves td{border-bottom:1px dashed var(--line);padding:4px 0}.moves td b{margin-right:8px;font-weight:600}.moves td small{color:var(--ink-2)}.ctl-grid{grid-template-columns:auto 1fr;gap:4px 14px;margin:0;font-size:13px;display:grid}.ctl-grid dt{color:var(--ink-2)}.ctl-grid dd{margin:0}.ctl{color:var(--ink-2);font-size:13px}.sel-foot{justify-content:flex-end;gap:10px;width:100%;max-width:1100px;margin:0 auto;padding-bottom:8px;display:flex}.sel-wait{background:var(--veil);font:400 34px var(--font-display);letter-spacing:.15em;place-items:center;display:grid;position:absolute;inset:0}.sel-wait span{animation:1.6s ease-in-out infinite breathe}.result{padding-left:max(6vw, 16px, env(safe-area-inset-left));place-items:center start;display:grid}.result-card{gap:10px;max-width:520px;display:grid;position:relative}.result-seal{width:120px;height:120px;font:400 86px/1 var(--font-display);background:var(--red);color:var(--red-ink);border-radius:6px;place-items:center;animation:.5s cubic-bezier(.3,1.6,.5,1) both stamp-in;display:grid;transform:rotate(-6deg)}.result-card.lose .result-seal{background:var(--ink);color:var(--paper)}@keyframes stamp-in{0%{opacity:0;transform:scale(2.6)rotate(-14deg)}}.result-card h2{font:400 clamp(40px, 6vw, 64px)/1.1 var(--font-display);margin:8px 0 0}.result-sub{color:var(--ink-2);margin:0}.result-lines{font-variant-numeric:tabular-nums;flex-wrap:wrap;gap:18px;margin:0;padding:0;list-style:none;display:flex}.rating{font-variant-numeric:tabular-nums;margin:0;font-size:17px}.rating b{font-size:22px}.up{color:var(--good);font-style:normal}.down{color:var(--red);font-style:normal}.result-note{color:var(--red);margin:0}.result-btns,.pause-btns{flex-wrap:wrap;gap:10px;margin-top:10px;display:flex}.pause{background:var(--veil);-webkit-backdrop-filter:blur(4px);place-items:center;display:grid}.pause-card{gap:14px;width:100%;max-width:900px;display:grid}.pause-card h2{font:400 48px/1 var(--font-display);margin:0}.set-group{max-width:980px;margin:0 auto 22px}.seg{border:1px solid var(--line);border-radius:2px;display:inline-flex}.seg button{border-radius:0;min-height:40px;padding:0 18px}.seg button[aria-checked=true],.seg button[aria-selected=true]{background:var(--ink);color:var(--paper)}.slider{grid-template-columns:7em minmax(0,1fr);align-items:center;gap:12px;max-width:520px;margin:6px 0;display:grid}.slider input{accent-color:var(--red);width:100%}.online>*,.account>*,.board-page>*{max-width:980px;margin-left:auto;margin-right:auto}.who{gap:6px;max-width:980px;margin-bottom:16px;display:grid}.who .field{max-width:320px}.online-grid{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:14px;display:grid}.big{text-align:left;border:1px solid var(--line);border-radius:3px;align-content:center;min-height:110px;padding:18px;transition:border-color .2s,transform .15s;display:grid}.big:hover,.big:focus-visible{border-color:var(--red);transform:translateY(-2px)}.big b{font:400 32px/1.2 var(--font-display)}.big small{color:var(--ink-2)}.join{border:1px solid var(--line);border-radius:3px;align-content:center;gap:10px;padding:18px;display:grid}.join input{text-transform:uppercase;letter-spacing:.4em;font-size:24px}.status{justify-items:start;gap:12px;margin-top:22px;display:grid}.status-text{font:400 26px var(--font-display);margin:0;animation:2s ease-in-out infinite breathe}.room-box{grid-template-columns:auto minmax(0,1fr) auto;align-items:end;gap:16px;width:100%;display:grid}.room-code{font:400 64px/1 var(--font-display);letter-spacing:.15em;color:var(--red)}.auth{gap:16px;max-width:380px;display:grid}.form-err{color:var(--red);margin:0}.profile{flex-wrap:wrap;align-items:center;gap:18px;display:flex}.profile h3{font:400 32px var(--font-display);margin:0}.profile p{color:var(--ink-2);margin:0}.profile button{margin-left:auto}.rank-seal{background:var(--red);color:var(--red-ink);font:400 30px/1 var(--font-display);writing-mode:vertical-rl;border-radius:4px;padding:14px 12px}.sub-h{margin-top:22px}.table-wrap{overflow-x:auto}.board{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}.board th{text-align:left;color:var(--ink-2);letter-spacing:.15em;border-bottom:2px solid var(--ink);white-space:nowrap;padding:8px 10px;font-size:12px;font-weight:400}.board td{border-bottom:1px solid var(--line);white-space:nowrap;padding:9px 10px}.board tr.me td{background:#c23a221a}.board tbody tr:nth-child(-n+3) td:first-child{color:var(--red);font:400 22px var(--font-display)}.hud{z-index:10;pointer-events:none;color:var(--ink);position:absolute;inset:0}.hud-top{padding:max(14px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 0 max(16px, env(safe-area-inset-left));grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:start;gap:14px;display:grid;position:absolute;top:0;left:0;right:0}.hp-side{gap:4px;min-width:0;display:grid}.hp-side.s1{justify-items:end}.hp-name{align-items:baseline;gap:10px;max-width:100%;display:flex}.hp-side.s1 .hp-name{flex-direction:row-reverse}.hp-name b{text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:600;overflow:hidden}.hp-style{color:var(--ink-2);letter-spacing:.1em;white-space:nowrap;font-size:12px}.hp-bar{clip-path:polygon(0 18%,3% 0,100% 10%,99% 100%,1% 88%);background:#7f78642e;width:100%;height:18px;position:relative}.hp-side.s1 .hp-bar{transform:scaleX(-1)}.hp-bar i{transform-origin:0;position:absolute;inset:0}.hp-lag{background:var(--red);opacity:.75}.hp-fill{background:var(--ink);transition:transform 80ms linear}.hp-side.low .hp-fill{background:var(--red);animation:.6s steps(2,end) infinite low-hp}@keyframes low-hp{50%{opacity:.6}}.gd-bar{background:#7f78642e;width:62%;height:4px;overflow:hidden}.gd-bar i{background:var(--blue);transform-origin:0;height:100%;display:block}.hp-side.s1 .gd-bar i{transform-origin:100%}.hp-side.gd-broken .gd-bar{animation:.2s steps(2,end) infinite low-hp}.pips{gap:6px;display:flex}.pips i{border:1.5px solid var(--red);border-radius:2px;width:16px;height:16px;transform:rotate(45deg)scale(.8)}.pips i.on{background:var(--red)}.hud-timer{justify-items:center;min-width:76px;display:grid}.t-num{font:400 46px/1 var(--font-display);font-variant-numeric:tabular-nums}.t-num.low{color:var(--red)}.t-net{color:var(--ink-2);white-space:nowrap;font-size:11px}.hud-bottom{padding:0 max(16px, env(safe-area-inset-right)) max(14px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));justify-content:space-between;gap:16px;display:flex;position:absolute;bottom:0;left:0;right:0}.mt{align-items:center;gap:8px;display:flex}.mt-lbl{font:400 24px var(--font-display)}.mt-cells{gap:4px;display:flex}.mt-cells i{background:linear-gradient(90deg, var(--ink) calc(var(--v,0) * 100%), #7f786433 0);width:clamp(38px,6vw,70px);height:10px;transform:skew(-20deg)}.mt.s1 .mt-cells{flex-direction:row-reverse}.mt.s1 .mt-cells i{background:linear-gradient(270deg, var(--ink) calc(var(--v,0) * 100%), #7f786433 0);transform:skew(20deg)}.mt-cells i.full{background:var(--ink)}.mt-ready{font:400 20px var(--font-display);color:var(--red);opacity:0;transition:opacity .2s}.mt.max .mt-ready{opacity:1;animation:.9s ease-in-out infinite breathe}.mt.max .mt-cells i{background:var(--red)}.combo{opacity:0;justify-items:start;transition:opacity .25s;display:grid;position:absolute;top:22%}.combo.s0{left:max(5vw,16px)}.combo.s1{justify-items:end;right:max(5vw,16px)}.combo.on{opacity:1}.combo b{font:400 clamp(56px, 8vw, 96px)/.9 var(--font-display);color:var(--red)}.combo span{font:400 26px var(--font-display);margin-top:-4px}.combo small{color:var(--ink-2);font-variant-numeric:tabular-nums;font-size:12px}.combo.pop b{animation:.25s ease-out pop}@keyframes pop{0%{transform:scale(1.45)}}.announce{opacity:0;place-items:center;display:grid;position:absolute;inset:0}.announce span{font:400 clamp(72px, 15vw, 190px)/1 var(--font-display);letter-spacing:.08em;text-shadow:0 0 30px var(--paper), 0 0 2px var(--paper)}.announce.on{animation:1.3s ease-out both ann}.announce.fight span{color:var(--red)}.announce.ko span{color:var(--red);font-family:var(--font-title);font-size:clamp(110px,22vw,280px)}.announce.ko.on{animation-duration:2.2s}.announce.small span{color:var(--blue);font-size:clamp(48px,8vw,90px)}@keyframes ann{0%{opacity:0;filter:blur(12px);transform:scale(1.6)}14%{opacity:1;filter:blur();transform:scale(1)}78%{opacity:1}to{opacity:0;transform:scale(.98)}}.stamp{opacity:0;position:absolute;top:30%;right:16%}.stamp span{background:var(--red);min-width:1.4em;color:var(--red-ink);font:400 clamp(80px, 12vw, 150px)/1 var(--font-display);box-shadow:0 0 0 4px var(--paper), 0 0 0 7px var(--red);border-radius:.08em;place-items:center;padding:.12em .18em;display:grid;transform:rotate(-8deg)}.stamp small{font:600 clamp(13px, 1.6vw, 18px)/1.4 var(--font-body);letter-spacing:.2em}.stamp.on{animation:.45s cubic-bezier(.3,1.5,.5,1) both stamp}@keyframes stamp{0%{opacity:0;transform:scale(3)}to{opacity:1;transform:scale(1)}}.super-banner{opacity:0;flex-direction:row-reverse;align-items:center;gap:10px;display:flex;position:absolute;top:14%;bottom:14%}.super-banner.s0{left:max(8vw,16px)}.super-banner.s1{flex-direction:row;right:max(8vw,16px)}.super-banner b{writing-mode:vertical-rl;font:400 clamp(70px, 13vh, 140px)/1 var(--font-display);letter-spacing:.1em;text-shadow:0 0 24px var(--paper)}.super-banner small{writing-mode:vertical-rl;background:var(--red);color:var(--red-ink);letter-spacing:.3em;border-radius:2px;padding:8px 4px;font-size:13px}.super-banner.on{animation:1.2s ease-out both banner}.super-banner.s1.on{animation-name:banner-r}@keyframes banner{0%{opacity:0;clip-path:inset(0 0 100%);transform:translate(-40px)}18%{opacity:1;clip-path:inset(0);transform:none}80%{opacity:1}to{opacity:0}}@keyframes banner-r{0%{opacity:0;clip-path:inset(0 0 100%);transform:translate(40px)}18%{opacity:1;clip-path:inset(0);transform:none}80%{opacity:1}to{opacity:0}}.net-warn{background:var(--veil);border-left:3px solid var(--red);padding:10px 18px;position:absolute;top:40%;left:50%;transform:translate(-50%)}.touchpad{z-index:15;position:absolute;inset:0}.tp-zone{touch-action:none;width:50%;position:absolute;top:30%;bottom:0;left:0}.tp-stick{border:2px solid var(--line);pointer-events:none;background:#7f78641f;border-radius:50%;width:110px;height:110px;margin:-55px 0 0 -55px;position:fixed}.tp-knob{background:var(--ink);opacity:.6;border-radius:50%;width:46px;height:46px;margin:-23px 0 0 -23px;position:absolute;top:50%;left:50%}.tp-btns{right:max(14px, env(safe-area-inset-right));bottom:max(54px, calc(env(safe-area-inset-bottom) + 40px));grid-template-rows:repeat(2,62px);grid-template-columns:repeat(3,62px);gap:10px;display:grid;position:absolute}.tp-b{border:2px solid var(--ink);font:400 24px var(--font-display);touch-action:none;opacity:.85;background:#7f786426;border-radius:50%;place-items:center;display:grid}.tp-b.on{background:var(--ink);color:var(--paper)}.tp-special{border-color:var(--red);color:var(--red)}.tp-special.on{background:var(--red);color:var(--red-ink)}.toast{left:50%;bottom:max(28px, env(safe-area-inset-bottom));z-index:50;opacity:0;background:var(--ink);color:var(--paper);pointer-events:none;border-radius:2px;max-width:calc(100vw - 32px);padding:10px 18px;transition:opacity .25s,transform .25s;position:fixed;transform:translate(-50%,20px)}.toast.on{opacity:1;transform:translate(-50%)}@media (max-width:760px){.cards{grid-template-columns:minmax(0,1fr)}.card{grid-template-columns:auto 1fr;padding:10px 12px}.glyph{font-size:54px}.detail-cols,.detail-cols.three,.online-grid{grid-template-columns:minmax(0,1fr)}.menu{background:var(--veil)}.room-box{grid-template-columns:minmax(0,1fr)}.hud-top{gap:8px}.t-num{font-size:34px}.hp-bar{height:13px}.stamp{right:8%}.tp-btns{grid-template-rows:repeat(2,56px);grid-template-columns:repeat(3,56px)}}@media (orientation:portrait) and (pointer:coarse){.hud:after{content:"横过来玩更顺手";color:var(--ink-2);font-size:12px;position:absolute;top:92px;left:50%;transform:translate(-50%)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}