:root{--bg:#07070b;--panel:#101017;--panel2:#16161f;--line:#262633;--text:#ececf4;--dim:#8a8aa0;--red:#e11d2e;--red2:#ff4d5e;--light:#cfcfdb;--dark:#3b3b4b;--bs:min(94vw, calc(100dvh - 230px), 760px);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:Segoe UI,system-ui,-apple-system,Roboto,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;overflow-x:hidden}button{font:inherit;color:inherit;cursor:pointer}[hidden]{display:none!important}.bg{z-index:0;background:radial-gradient(1200px 700px at 50% -10%, #1a0a10 0%, var(--bg) 60%);position:fixed;inset:0;overflow:hidden}.bg i{filter:blur(90px);opacity:.28;background:radial-gradient(circle, var(--red), transparent 65%);border-radius:50%;width:60vmax;height:60vmax;animation:22s ease-in-out infinite alternate drift;position:absolute}.bg i:first-child{top:-10vmax;left:-20vmax}.bg i:nth-child(2){opacity:.2;animation-delay:-8s;bottom:-20vmax;right:-25vmax}.bg i:nth-child(3){opacity:.1;width:30vmax;height:30vmax;animation-delay:-14s;top:40vh;left:30vw}@keyframes drift{to{transform:translate(6vmax,4vmax)scale(1.15)}}#app{z-index:1;max-width:1180px;margin:0 auto;padding:10px 16px 24px;position:relative}.top{justify-content:space-between;align-items:center;padding:4px 2px 10px;display:flex}.logo{letter-spacing:.32em;align-items:baseline;gap:.6em;font-family:Georgia,Times New Roman,serif;font-size:15px;display:flex}.logo b{color:var(--red);text-shadow:0 0 14px #e11d2eb3;font-weight:700}.top-actions{gap:8px;display:flex}.icon-btn{border:1px solid var(--line);background:var(--panel);border-radius:12px;width:38px;height:38px;font-size:18px;transition:all .2s}.icon-btn:hover{border-color:var(--red);box-shadow:0 0 16px #e11d2e59}.icon-btn.off{opacity:.4;text-decoration:line-through}.game{justify-content:center;align-items:flex-start;gap:20px;display:flex}.board-col{width:calc(var(--bs) + 22px);max-width:100%}.player{align-items:center;gap:10px;min-height:58px;padding:8px 4px;display:flex}.avatar{filter:drop-shadow(0 4px 10px #0009);flex:none;width:44px;height:44px}.avatar svg{width:100%;height:100%;display:block}.pinfo{flex:1;min-width:0}.pname{white-space:nowrap;text-overflow:ellipsis;font-size:15px;font-weight:600;overflow:hidden}.caps{flex-wrap:wrap;align-items:center;height:20px;margin-top:2px;display:flex}.caps svg{filter:drop-shadow(0 1px 2px #000000b3);width:20px;height:20px;margin-right:-6px}.caps small{color:var(--dim);margin-left:10px;font-size:12px}.clock{font-variant-numeric:tabular-nums;background:var(--panel);border:1px solid var(--line);text-align:center;letter-spacing:.02em;border-radius:12px;min-width:104px;padding:6px 14px;font-size:26px;font-weight:700;transition:all .25s}.player.active .clock{border-color:var(--red);background:#1b0c11;box-shadow:0 0 22px #e11d2e59,inset 0 0 14px #e11d2e26}.player.low .clock{color:var(--red2);animation:1s infinite pulse}.clock.none{opacity:.35;font-size:22px}@keyframes pulse{50%{opacity:.55}}.board-wrap{justify-content:center;align-items:stretch;gap:8px;display:flex;position:relative}.evalbar{border:1px solid var(--line);background:#e8e8f2;border-radius:8px;flex:none;width:14px;position:relative;overflow:hidden}.evalfill{background:#0c0c11;height:50%;transition:height .5s cubic-bezier(.2,.8,.2,1);position:absolute;top:0;left:0;right:0}.evalbar span{color:#888;mix-blend-mode:difference;white-space:nowrap;font-size:9px;position:absolute;bottom:3px;left:50%;transform:translate(-50%)}.board{width:var(--bs);height:var(--bs);touch-action:none;-webkit-user-select:none;user-select:none;border-radius:10px;position:relative;box-shadow:0 0 0 2px #1c1c27,0 0 0 3px #e11d2e8c,0 20px 70px #000000b3,0 0 80px #e11d2e2e}.squares,.pieces{border-radius:10px;position:absolute;inset:0}.squares{grid-template:repeat(8,1fr)/repeat(8,1fr);display:grid;overflow:hidden}.pieces{pointer-events:none}.sq{position:relative}.sq.l{background:var(--light)}.sq.d{background:var(--dark)}.sq .co{font-size:calc(var(--bs) * .02 + 4px);opacity:.75;pointer-events:none;font-weight:700;position:absolute}.sq.l .co{color:var(--dark)}.sq.d .co{color:var(--light)}.sq .co.f{bottom:2px;right:4px}.sq .co.r{top:2px;left:4px}.sq.last:before{content:"";background:#e11d2e52;position:absolute;inset:0}.sq.sel:before{content:"";box-shadow:inset 0 0 0 3px var(--red);background:#ffffff47;position:absolute;inset:0}.sq.check:before{content:"";background:radial-gradient(circle,#ff283cf2 0%,#e11d2e8c 45%,#0000 75%);animation:1s infinite pulse;position:absolute;inset:0}.sq.target:after{content:"";background:#e11d2ecc;border-radius:50%;width:28%;height:28%;position:absolute;top:36%;left:36%;box-shadow:0 0 12px #e11d2ee6}.sq.capture:after{background:0 0;width:88%;height:88%;top:6%;left:6%;box-shadow:inset 0 0 0 4px #e11d2ee6,0 0 14px #e11d2ecc}.sq.over:before{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 3px #ffffffb3}.piece{will-change:transform;width:12.5%;height:12.5%;padding:1%;transition:transform .22s cubic-bezier(.3,.9,.3,1);position:absolute;top:0;left:0}.piece svg{filter:drop-shadow(0 5px 6px #0000008c);width:100%;height:100%;display:block}.piece.b svg{filter:drop-shadow(0 5px 6px #0000008c)drop-shadow(0 0 6px #e11d2e40)}.piece.dragging{z-index:50;transition:none}.piece.dragging svg{filter:drop-shadow(0 14px 14px #0009);transform:scale(1.18)}.piece.snap{transition:transform .15s ease-out}.piece.gone{opacity:0;transform-origin:50%;transition:transform .22s,opacity .25s}.piece.gone svg{transition:transform .25s;transform:scale(.4)rotate(18deg)}.piece.pop svg{animation:.35s cubic-bezier(.2,1.6,.4,1) pop}@keyframes pop{0%{transform:scale(.3)}to{transform:scale(1)}}.piece.flash svg{animation:.5s flash}@keyframes flash{30%{filter:brightness(2.4)drop-shadow(0 0 14px #ff4d5e)}}.thinking{opacity:0;pointer-events:none;z-index:60;gap:5px;transition:all .2s;display:flex;position:absolute;top:10px;right:10px}.thinking.on{opacity:1}.thinking i{background:var(--red);width:8px;height:8px;box-shadow:0 0 10px var(--red);border-radius:50%;animation:1s infinite bounce}.thinking i:nth-child(2){animation-delay:.15s}.thinking i:nth-child(3){animation-delay:.3s}@keyframes bounce{50%{opacity:.5;transform:translateY(-6px)}}.panel{background:linear-gradient(180deg, var(--panel), #0c0c12);border:1px solid var(--line);width:300px;height:calc(var(--bs) + 120px);border-radius:16px;flex-direction:column;flex:none;gap:12px;max-height:80vh;padding:14px;display:flex}.status{color:var(--text);background:var(--panel2);border-left:3px solid var(--red);border-radius:10px;min-height:40px;padding:10px 12px;font-size:14px}.moves{scrollbar-width:thin;scrollbar-color:#333 transparent;flex:1;grid-template-columns:34px 1fr 1fr;align-content:start;gap:2px 4px;font-size:14px;display:grid;overflow-y:auto}.moves .n{color:var(--dim);padding:4px 0 4px 4px}.moves .m{border-radius:6px;padding:4px 8px;font-weight:600}.moves .m.cur{color:#fff;background:#e11d2e40}.moves .empty{color:var(--dim);grid-column:1/-1;padding:8px 4px}.controls{grid-template-columns:1fr 1fr;gap:8px;display:grid}.btn{border:1px solid var(--line);background:var(--panel2);border-radius:10px;padding:10px;font-size:14px;transition:all .2s}.btn:hover:not(:disabled){border-color:var(--red);box-shadow:0 0 14px #e11d2e40}.btn:disabled{opacity:.35;cursor:default}.btn.danger:hover:not(:disabled){background:#2a0e14}.btn.primary{letter-spacing:.04em;background:linear-gradient(#f0283a,#b3121f);border-color:#ff5a68;font-weight:700;box-shadow:0 6px 26px #e11d2e66}.btn.primary:hover{filter:brightness(1.12)}.overlay{z-index:100;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#040408c7;place-items:center;padding:16px;animation:.25s fade;display:grid;position:fixed;inset:0;overflow-y:auto}@keyframes fade{0%{opacity:0}}.modal{background:linear-gradient(#14141d,#0b0b11);border:1px solid #2c2c3b;border-radius:20px;width:min(560px,100%);padding:24px;animation:.3s cubic-bezier(.2,.9,.3,1.2) rise;box-shadow:0 30px 120px #000c,0 0 80px #e11d2e26}@keyframes rise{0%{opacity:0;transform:translateY(20px)scale(.96)}}.modal h1{letter-spacing:.24em;text-align:center;margin:0 0 4px;font-family:Georgia,serif;font-size:26px}.modal h1 b{color:var(--red);text-shadow:0 0 18px #e11d2ecc}.modal .sub{text-align:center;color:var(--dim);margin-bottom:16px;font-size:13px}.roster{grid-template-columns:repeat(6,1fr);gap:6px;margin:8px 0 18px;display:grid}.roster div{text-align:center}.roster svg{filter:drop-shadow(0 6px 8px #0009);width:100%;max-width:64px;margin:0 auto;transition:transform .25s;display:block}.roster div:hover svg{transform:translateY(-5px)scale(1.06)}.roster span{letter-spacing:.12em;color:var(--red2);text-shadow:0 0 8px #e11d2ecc;margin-top:2px;font-family:Georgia,serif;font-size:9px;display:block}.grp{color:var(--dim);text-transform:uppercase;letter-spacing:.14em;margin:14px 0 6px;font-size:11px}.seg{flex-wrap:wrap;gap:6px;display:flex}.seg button{border:1px solid var(--line);background:var(--panel2);border-radius:10px;flex:auto;min-width:64px;padding:9px 12px;font-size:14px;transition:all .15s}.seg button small{color:var(--dim);font-size:11px;display:block}.seg button:hover{border-color:#55303a}.seg button.on{border-color:var(--red);background:#230e14;box-shadow:0 0 16px #e11d2e4d}.modal .go{width:100%;margin-top:20px;padding:14px;font-size:16px}.result{text-align:center}.result .big{text-shadow:0 0 24px #e11d2ecc;margin:6px 0;font-family:Georgia,serif;font-size:34px}.result .why{color:var(--dim);margin-bottom:18px}.result .row{gap:8px;display:flex}.result .row .btn{flex:1;padding:13px}.promo{justify-content:center;gap:10px;display:flex}.promo button{background:var(--panel2);border:1px solid var(--line);border-radius:14px;width:92px;padding:8px;transition:all .2s}.promo button:hover{border-color:var(--red);transform:translateY(-4px);box-shadow:0 0 22px #e11d2e66}.promo svg{width:100%;display:block}.promo span{letter-spacing:.12em;color:var(--red2);font-family:Georgia,serif;font-size:10px}.confirm p{text-align:center;margin:8px 0 20px;font-size:17px}@media (width<=900px){.game{flex-direction:column;align-items:center}.panel{width:min(var(--bs) + 22px, 100%);height:auto;max-height:none}.moves{max-height:140px}:root{--bs:min(94vw, calc(100dvh - 330px), 640px)}.clock{min-width:88px;font-size:22px}}@media (width<=520px){.evalbar{width:8px}.evalbar span{display:none}.roster{grid-template-columns:repeat(3,1fr)}}.evalbar.flip{transform:rotate(180deg)}.evalbar.flip span{transform:translate(-50%)rotate(180deg)}.tok{border:3px solid var(--red);background:#cfcfd6;border-radius:50%;width:100%;height:100%;position:relative;overflow:hidden;box-shadow:0 0 14px #e11d2e73,inset 0 0 12px #00000080}.tok img{pointer-events:none;-webkit-user-drag:none;width:auto;max-width:none;height:100%;position:absolute;top:0;left:50%;transform:translate(-50%)}.tok.mir img{transform:translate(-50%)scaleX(-1)}.tok.w{background:#e8f4ff;border-color:#f2f2f8;box-shadow:0 0 14px #ffffff59,inset 0 0 12px #0006}.tok.w img{filter:hue-rotate(185deg)saturate(1.6)brightness(1.12)contrast(1.05)}.tok.w:after{content:"";pointer-events:none;background:radial-gradient(circle at 50% 30%,#b4e1ff59,#0000 70%);border-radius:50%;position:absolute;inset:0}.tok.t-p{transform:scale(.84)}.piece svg,.piece .tok{filter:none}.piece .tok{filter:drop-shadow(0 5px 6px #0000008c)}.piece.dragging .tok{transform:scale(1.18)}.caps .tok{width:20px;height:20px;box-shadow:none;border-width:1.5px;flex:none;margin-right:-6px}.avatar .tok{border-width:2px}.roster .tok{aspect-ratio:1;width:100%;max-width:64px;height:auto;margin:0 auto;transition:transform .25s}.roster div:hover .tok{transform:translateY(-5px)scale(1.06)}.promo .tok{aspect-ratio:1;width:100%;height:auto}.board-col{flex:640px;width:min(940px,100%);max-width:940px}.board{background:#07070b;border-radius:14px;flex:1;width:auto;height:min(100dvh - 200px,760px);min-height:360px;overflow:hidden}.board canvas{width:100%;height:100%;display:block}.squares,.pieces{display:none}.thinking{z-index:5}.panel{height:min(100dvh - 200px,760px)}@media (width<=900px){.board{height:min(60dvh,560px)}.panel{height:auto}}.cine{pointer-events:none;z-index:6;--c:#e11d2e;position:absolute;inset:0;overflow:hidden}.cine .bar{background:#000;height:0;transition:height .35s cubic-bezier(.2,.8,.2,1);position:absolute;left:0;right:0}.cine .bar.top{top:0}.cine .bar.bot{bottom:0}.cine.bars .bar{height:11%}.cine .banner{opacity:0;border-left:5px solid var(--c);background:linear-gradient(90deg,#000000c7 0% 55%,#0000 100%);flex-direction:column;align-items:flex-start;padding:8px 8% 10px;transition:transform .35s cubic-bezier(.2,.9,.2,1),opacity .25s;display:flex;position:absolute;bottom:16%;left:0;right:0;transform:translate(-110%)skew(-12deg)}.cine.ban .banner{opacity:1;transform:translate(0)skew(-12deg)}.cine .banner small{letter-spacing:.35em;color:var(--c);text-shadow:0 0 10px var(--c);font-size:12px;font-weight:700}.cine .banner b{letter-spacing:.1em;color:#fff;text-shadow:0 0 18px var(--c), 0 0 3px var(--c);font-family:Georgia,serif;font-size:clamp(22px,4.2vw,42px);font-style:italic;line-height:1.1}.cine .flash{opacity:0;background:#fff;position:absolute;inset:0}.cine .flash.go{animation:.38s ease-out cineflash}@keyframes cineflash{0%{opacity:.85}to{opacity:0}}.cine .vig{opacity:0;background:radial-gradient(#0000 45%,#ff1432a6 100%);position:absolute;inset:0}.cine .vig.danger{animation:1.1s ease-out cinevig}@keyframes cinevig{0%{opacity:0}20%{opacity:1}to{opacity:0}}.player{position:relative}.bubble{z-index:30;color:#14141c;max-width:min(320px,70%);box-shadow:0 8px 30px #0009, 0 0 0 2px var(--red);opacity:0;pointer-events:none;background:#fff;border-radius:4px 16px 16px;padding:9px 14px;font-size:14px;font-weight:600;transition:all .25s;position:absolute;top:calc(100% - 2px);left:62px;transform:translateY(-6px)scale(.96)}.bubble.on{opacity:1;transform:none}.stages{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.stage{border:1px solid var(--line);background:var(--panel2);border-radius:14px;flex-direction:column;align-items:center;gap:2px;padding:10px 6px 8px;transition:all .15s;display:flex;position:relative}.stage .tok{width:56px;height:56px}.stage b{margin-top:4px;font-size:14px}.stage small{color:var(--dim);text-align:center;font-size:11px}.stage i{color:#ffc83a;letter-spacing:.1em;margin-top:2px;font-size:12px;font-style:normal}.stage:hover:not(:disabled){border-color:#55303a}.stage.on{border-color:var(--red);background:#230e14;box-shadow:0 0 18px #e11d2e59}.stage.lock{opacity:.45;cursor:default;filter:grayscale(.8)}.about{background:var(--panel2);border-left:3px solid var(--red);color:var(--text);border-radius:10px;min-height:40px;margin-top:10px;padding:10px 12px;font-size:13px}.stars{color:#ffc83a;letter-spacing:.15em;text-shadow:0 0 18px #ffc83ab3;margin:4px 0;font-size:38px}.goals{text-align:left;max-width:280px;color:var(--dim);gap:4px;margin:8px auto 12px;font-size:14px;display:grid}.goals .ok{color:var(--text)}.goals .ok:first-letter{color:#ffc83a}@media (width<=520px){.stages{grid-template-columns:repeat(2,1fr)}}.bubble.happy{box-shadow:0 8px 30px #0009,0 0 0 2px #ffc83a}.bubble.angry{box-shadow:0 8px 30px #0009, 0 0 0 2px var(--red);background:#fff1f2}.bubble.sad{background:#eef3ff;box-shadow:0 8px 30px #0009,0 0 0 2px #7aa7ff}.bubble.calm{box-shadow:0 8px 30px #0009,0 0 0 2px #8a8aa0}.avatar{transition:transform .2s,filter .3s}.avatar.r-happy{animation:.7s rhappy}.avatar.r-angry{filter:drop-shadow(0 0 10px var(--red));animation:.5s rangry}.avatar.r-sad{filter:grayscale(.5)brightness(.8);transform:translateY(3px)scale(.94)}@keyframes rhappy{30%{transform:translateY(-8px)scale(1.12)}60%{transform:translateY(0)scale(1.05)}}@keyframes rangry{0%,to{transform:translate(0)}20%{transform:translate(-4px)rotate(-4deg)}40%{transform:translate(4px)rotate(4deg)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}.btn.wide{grid-column:1/-1}