.csRoot [data-tone=amber]{--bgTone:var(--csAmber);--bgToneInk:var(--csAmberText)}.csRoot [data-tone=success]{--bgTone:var(--csSuccess);--bgToneInk:var(--csSuccess)}.csRoot [data-tone=danger]{--bgTone:var(--csDanger);--bgToneInk:var(--csDanger)}.csRoot [data-tone=ink]{--bgTone:var(--csInk);--bgToneInk:var(--csInk)}.csRoot .bgShell[data-shake="1"]{animation:bgShake var(--bgShakeMs,var(--csStepMs)) var(--csEaseLinear)}.csRoot .bgSep{margin-inline:-.16em}.csRoot .bgFlip{display:inline-flex;transform:rotate(90deg)}.csRoot .bgDebug{position:fixed;left:8px;bottom:8px;z-index:90;max-width:300px;max-height:45dvh;overflow:hidden;padding:6px 8px;opacity:.92;pointer-events:none;border-radius:var(--csRadRead);background:var(--csWell);border:1px solid var(--csWellEdge);font-family:var(--csMono);font-size:11px;line-height:var(--csLeadBody);color:var(--csInkBody)}.csRoot .bgDebug dl{display:grid;grid-template-columns:auto 1fr;gap:0 8px;margin:4px 0 0}.csRoot .bgDebug dt{color:var(--csInkMeta)}.csRoot .bgDebug dd{margin:0;word-break:break-all}.csRoot .bgDebugRow{display:contents}.csRoot .bgDebugToggle{pointer-events:auto;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;background:none;font:inherit;color:var(--csAmberText);cursor:pointer}.csRoot .bgFx{position:fixed;inset:0;z-index:80;pointer-events:none}.csRoot .bgFloat{position:fixed;transform:translate(-50%,-50%);padding:3px 11px;border-radius:999px;border:2px solid var(--bgTone);background:var(--csPanel);font-family:var(--csMono);font-size:18px;font-weight:800;line-height:var(--csLeadFlat);color:var(--bgToneInk);white-space:nowrap;animation:bgFloatUp var(--csSweepMs) var(--csEaseOut) forwards}.csRoot .bgFloat[data-fly="1"]{animation-name:bgFloatFly}.csRoot .bgFloat[data-word="1"]{font-family:var(--csDisplay);letter-spacing:.01em}.csRoot .bgFloat[data-big="1"]{padding:4px 14px;font-size:28px}.csRoot .bgFloat[data-bare="1"]{padding:0;border:0;background:none;text-shadow:0 0 3px var(--csPanel),0 0 6px var(--csPanel),0 1px 1px var(--csPanel)}.csRoot .bgStampWrap{position:fixed;inset:0;display:grid;place-items:center}.csRoot .bgStampWrap>*{grid-area:1/1}.csRoot .bgStampWrap[data-at="1"]{inset:auto;translate:-50% -50%}.csRoot .bgStamp{max-width:calc(100vw - 56px);box-sizing:border-box;padding:8px 20px;border:5px solid var(--bgTone);border-radius:var(--csRadKey);outline:2px solid var(--bgTone);outline-offset:5px;background:var(--csPanel);font-family:var(--csDisplay);font-size:clamp(26px,8.2vw,64px);text-align:center;text-wrap:balance;font-weight:800;letter-spacing:.04em;line-height:var(--csLeadTitle);color:var(--bgToneInk);transform:rotate(-6deg);animation:bgStampIn var(--csEnterMs) var(--csEaseHinge) both,bgFadeOut var(--csTintMs) var(--csEaseLinear) calc(var(--csEnterMs) + var(--csWaitMs)) forwards}.csRoot .bgStamp[data-variant=wobble]{font-size:clamp(24px,7.6vw,48px);border-width:4px;outline:0;transform:rotate(3deg);animation:bgWobbleIn calc(var(--csEnterMs) * 3) var(--csEaseOut) both,bgFadeOut var(--csTintMs) var(--csEaseLinear) calc(var(--csEnterMs) + var(--csWaitMs)) forwards}.csRoot .bgStampWave{width:120px;height:120px;border-radius:50%;border:3px solid var(--bgTone);opacity:0;animation:bgWave var(--csSettleMs) var(--csEaseOut) calc(var(--csEnterMs) * .6) both}.csRoot .bgStampWave[data-variant=wobble]{display:none}.csRoot .bgBannerWrap{position:fixed;display:flex;align-items:center;justify-content:center;overflow:hidden;container-type:size}.csRoot .bgBannerLocal{position:absolute;inset:0;z-index:8;pointer-events:none}.csRoot .bgBanner{display:block;width:100%;padding:min(12px,12cqb) 16px;box-sizing:border-box;border-top:2px solid var(--bgTone);border-bottom:2px solid var(--bgTone);background:var(--csFace);text-align:center;font-family:var(--csDisplay);font-size:clamp(13px,min(6.4cqi,44cqb),26px);font-weight:800;line-height:var(--csLeadTitle);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--bgToneInk);animation:bgWipe calc(var(--csSweepMs) + var(--csWaitMs)) var(--csEaseOut) forwards}.csRoot .bgBanner[data-live="1"]{background:color-mix(in srgb,var(--csFace) 55%,transparent);animation-duration:var(--csSweepMs)}.csRoot .bgShell[data-paused="1"] .bgBannerLocal .bgBanner{animation-play-state:paused}.csRoot .bgFlash{position:fixed;inset:0;background:color-mix(in srgb,var(--bgTone) 32%,transparent);animation:bgFadeOut var(--csSettleMs) var(--csEaseOut) forwards}.csRoot .bgVignette{position:fixed;inset:0;box-shadow:inset 0 0 0 4px var(--bgTone),inset 0 0 48px color-mix(in srgb,var(--bgTone) 45%,transparent);animation:bgPulse var(--csIdleMs) var(--csEaseIdle) infinite}.csRoot .bgSparkle{position:fixed;width:0;height:0}.csRoot .bgSparkleDot{position:absolute;left:-4px;top:-4px;width:8px;height:8px;border-radius:2px;background:var(--bgTone);transform:rotate(45deg);animation:bgSparkFly var(--csSettleMs) var(--csEaseOut) forwards}.csRoot .bgBoardFit{position:relative;display:flex;align-items:center;justify-content:center;flex:1 1 0;min-width:0;min-height:0;width:100%;height:100%}.csRoot .bgBoardFit[data-mode=width]{height:auto;flex:none}.csRoot .bgBoardFit[data-mode=fixed],.csRoot .bgBoardFit[data-mode=tiny]{flex:none}.csRoot .bgBoard{position:relative;flex:none;touch-action:none;transition:transform var(--csStepMs) var(--csEase),opacity var(--csTintMs) var(--csEase),outline-color var(--csTintMs) var(--csEase),outline-width var(--csStepMs) var(--csEase);outline:0 solid transparent;outline-offset:3px;border-radius:var(--csRadKey)}.csRoot .bgBoard[data-spin="1"]{transform:rotate(180deg)}.csRoot .bgBoard[data-dim="1"]{opacity:.4}.csRoot .bgBoard[data-lift="1"]{transform:translateY(-4px);outline:3px solid var(--csAmber)}.csRoot .bgBoard[data-rim]{outline:var(--bgRimW,3px) solid var(--bgRim)}.csRoot .bgBoard[data-rim=amber]{--bgRim:var(--csAmber)}.csRoot .bgBoard[data-rim=success]{--bgRim:var(--csSuccess)}.csRoot .bgBoard[data-rim=danger]{--bgRim:var(--csDanger)}.csRoot .bgBoard[data-rim=ink]{--bgRim:var(--csInk)}.csRoot .bgBoard[data-shake="1"]{animation:bgShake var(--bgShakeMs,var(--csStepMs)) var(--csEaseLinear)}.csRoot .bgBoard[data-coords="1"],.csRoot .bgBoard[data-tiny="1"]{border-radius:var(--csRadRead)}.csRoot .csBoard.bgBoardFrame{width:100%;height:100%}.csRoot .bgBoard[data-coords="1"] .bgOverlay,.csRoot .bgBoard[data-coords="1"] .csBoard.bgBoardFrame,.csRoot .bgBoard[data-tiny="1"] .csBoard.bgBoardFrame{border-radius:var(--csRadRead)}.csRoot .bgOverlay{position:absolute;inset:0;z-index:5;overflow:hidden;border-radius:var(--csRadKey);touch-action:none;container-type:size;-moz-user-select:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.csRoot .bgOverlay[data-input=tap]{cursor:pointer}.csRoot .bgOverlay:focus{outline:none}.csRoot .bgBoardCursor{position:absolute;z-index:9;width:12.5%;height:12.5%;box-sizing:border-box;border:var(--csFocusW) solid var(--csAmberHi);border-radius:var(--csRadRead);pointer-events:none;opacity:0}.csRoot .bgOverlay:focus-visible .bgBoardCursor{opacity:1}.csRoot .bgOverlay>*,.csRoot .bgOverlay[data-input=none],.csRoot .bgOverlay[data-input=pass]{pointer-events:none}.csRoot .bgDeco{position:absolute;width:12.5%;height:12.5%;display:flex;align-items:center;justify-content:center;box-sizing:border-box}.csRoot .bgDeco[data-kind=glow]{background:color-mix(in srgb,var(--bgTone) 52%,transparent);animation:bgFadeIn var(--csTintMs) var(--csEaseOut) both}.csRoot .bgDeco[data-kind=glow][data-anim="0"]{animation:none}.csRoot .bgDeco[data-kind=ring]{border:.9cqw solid var(--bgTone);border-radius:1cqw;animation:bgBloom var(--csEnterMs) var(--csEaseHinge) both}.csRoot .bgDeco[data-kind=ring][data-shrink="1"]{animation:bgShrinkIn calc(var(--csSweepMs) / 2) var(--csEaseOut) both}.csRoot .bgDeco[data-kind=mark]{color:var(--bgToneInk);z-index:3}.csRoot .bgDeco[data-kind=mark] svg{width:52%;height:52%;animation:bgBloom var(--csEnterMs) var(--csEaseHinge) both}.csRoot .bgMarkText{display:grid;place-items:center;min-width:46%;height:46%;padding:0 .6cqw;box-sizing:border-box;border-radius:999px;background:var(--csPanel);border:.3cqw solid var(--bgTone);font-size:3.4cqw;font-weight:700;line-height:var(--csLeadFlat);color:var(--bgToneInk);animation:bgBloom var(--csEnterMs) var(--csEaseHinge) both}.csRoot .bgDeco[data-mark=label] .bgMarkText{font-size:3cqw;white-space:nowrap}.csRoot .bgCrosshair{position:relative;width:70%;height:70%;border:.5cqw solid var(--bgTone);border-radius:50%;animation:bgShrinkIn var(--csEnterMs) var(--csEaseOut) both}.csRoot .bgCrosshair:after,.csRoot .bgCrosshair:before{content:"";position:absolute;background:var(--bgTone);left:50%;top:-18%;width:.5cqw;height:136%;transform:translateX(-50%)}.csRoot .bgCrosshair:after{transform:translateX(-50%) rotate(90deg)}.csRoot .bgDeco[data-kind=pop]{background:color-mix(in srgb,var(--bgTone) 38%,transparent);animation:bgPop var(--csStepMs) var(--csEaseHinge) both;z-index:2}.csRoot .bgPopLabel{padding:.2cqw .9cqw;border-radius:.8cqw;background:var(--csPanel);font-size:3.2cqw;font-weight:700;line-height:var(--csLeadFlat);color:var(--csInk)}.csRoot .bgDeco[data-kind=ghost][data-anim="1"] .bgGlyph{animation:bgGhostIn var(--csEnterMs) var(--csEaseHinge) both}.csRoot .bgDeco[data-kind=fly]{z-index:6}.csRoot .bgDeco[data-kind=topple]{z-index:4}.csRoot .bgDeco[data-kind=topple][data-anim="1"] .bgGlyph{transform-origin:50% 90%;animation:bgTopple calc(var(--csSettleMs) * .7) var(--csEaseHinge) forwards}.csRoot .bgDeco[data-kind=topple]:not([data-anim="1"]) .bgGlyph{opacity:.35}.csRoot .bgDeco[data-kind=morph] .bgGlyph{position:absolute;inset:0}.csRoot .bgMorphFrom{animation:bgPinchOut calc(var(--bgMorphMs) / 2) var(--csEaseOut) forwards}.csRoot .bgMorphTo{transform:scale(.15);animation:bgPinchIn calc(var(--bgMorphMs) / 2) var(--csEaseHinge) calc(var(--bgMorphMs) / 2) forwards}.csRoot .bgParticle{position:absolute;left:50%;top:50%;width:14%;height:14%;margin:-7% 0 0 -7%;border-radius:2px;background:var(--bgTone);animation:bgParticle var(--csSettleMs) var(--csEaseOut) forwards}.csRoot .bgTint{position:absolute;inset:0}.csRoot .bgCell{position:absolute;width:12.5%;height:12.5%;background:color-mix(in srgb,var(--bgTone) var(--bgTintA,30%),transparent);animation:bgFadeIn var(--csTintMs) var(--csEaseOut) both}.csRoot .bgZoneMask{box-shadow:0 0 0 200vmax color-mix(in srgb,var(--csGround) 55%,transparent)}.csRoot .bgZoneFrame,.csRoot .bgZoneMask{position:absolute;transition:left var(--csSweepMs) var(--csEaseOut),top var(--csSweepMs) var(--csEaseOut),width var(--csSweepMs) var(--csEaseOut),height var(--csSweepMs) var(--csEaseOut)}.csRoot .bgZoneFrame{box-sizing:border-box;border:2px solid var(--csAmber);border-radius:var(--csRadRead)}.csRoot .bgBoard .cm-chessboard .board .square{transition:fill var(--csSettleMs) var(--csEase),stroke var(--csSettleMs) var(--csEase)}.csRoot .bgBoard[data-surface=flat] .cm-chessboard .board .square,.csRoot .bgBoard[data-surface=frame] .cm-chessboard .board .square{fill:color-mix(in srgb,var(--board-square-light,var(--csBoardLight)) 50%,var(--board-square-dark,var(--csBoardDark)))!important;stroke:color-mix(in srgb,var(--csGround) 45%,transparent)!important;stroke-width:1px}.csRoot .bgBoard[data-surface=frame] .cm-chessboard .board .square{stroke:transparent!important}.csRoot .bgVeil{position:absolute;inset:0;z-index:7;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:0 12px;text-align:center;background:var(--csPanel)}.csRoot .bgVeilText{font-family:var(--csDisplay);font-size:30px;font-weight:700;line-height:var(--csLeadTitle);color:var(--csInkMeta);animation:bgBreathe var(--csIdleMs) var(--csEaseIdle) infinite}.csRoot .bgVeil[data-card="1"] .bgVeilText{color:var(--csInk);animation:none}.csRoot .bgVeilSub{font-size:16px;font-weight:600;line-height:var(--csLeadBody);color:var(--csInkMeta)}.csRoot .bgBoardFlash{position:absolute;inset:0;z-index:7;background:color-mix(in srgb,var(--bgTone) 45%,transparent);animation:bgFadeOut var(--csSettleMs) var(--csEaseOut) forwards}.csRoot .bgGlyph{display:block;flex:none}.csRoot .bgGlyph[data-fallback="1"]{display:grid;place-items:center;border-radius:50%;font-family:var(--csDisplay);font-weight:700;font-size:60%;background:var(--csInk);color:var(--csPanel)}.csRoot .bgGlyph[data-fallback="1"][data-colour=b]{background:var(--csGround);color:var(--csInk);border:1px solid var(--csEdge)}.csRoot .bgPlay{flex:1;gap:16px}.csRoot .bgPlay,.csRoot .bgPlayMain{display:flex;min-width:0;min-height:0}.csRoot .bgPlayMain{flex-direction:column;flex:1;gap:10px;container-type:inline-size}.csRoot .bgPlayAbove,.csRoot .bgPlayBelow{flex:none;display:flex;flex-direction:column;align-items:center;gap:8px}.csRoot .bgPlayBoard{position:relative;display:flex;flex:1;min-height:0;min-width:0;max-height:100cqi;align-items:center;justify-content:center;gap:16px}.csRoot .bgPlayBoard[data-boards="2"]{max-height:none}.csRoot .bgPlaySide{flex:none;width:320px;display:flex;flex-direction:column;gap:12px;min-height:0}.csRoot .bgKeyRow{display:flex;justify-content:center;gap:12px;width:100%}.csRoot .bgKeyRow>*{flex:1 1 0;min-width:0;max-width:260px}.csRoot .bgKeyRow>.bgGameKey[data-wide="1"],.csRoot .bgKeyRow>:only-child{max-width:none}.csRoot .csKey.csBtn.bgGameKey{min-height:56px;font-size:17px}.csRoot .csKey.csBtn.bgGameKey[data-wide="1"]{width:100%}.csRoot .bgHotkey{margin-left:6px}@media (max-width:1023.98px) and (orientation:portrait){.csRoot .bgPlay[data-side="1"]{flex-direction:column}.csRoot .bgPlaySide{width:100%}}@media (max-width:639.98px){.csRoot .bgPlayBoard[data-boards="2"]{flex-direction:column;gap:10px}.csRoot .bgPlayAbove,.csRoot .bgPlayBelow{padding-inline:8px}}@media (hover:none),(max-width:639.98px),(pointer:coarse){.csRoot .bgHotkey{display:none}}@keyframes bgShake{0%,to{transform:translateX(0)}20%{transform:translateX(calc(var(--bgShakePx, 6px) * -1))}40%{transform:translateX(var(--bgShakePx,6px))}60%{transform:translateX(calc(var(--bgShakePx, 6px) * -.6))}80%{transform:translateX(calc(var(--bgShakePx, 6px) * .4))}}@keyframes bgPulse{0%,to{opacity:1}50%{opacity:.55}}@keyframes bgRise{0%{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes bgFloatIdle{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes bgFloatUp{0%{transform:translate(-50%,-50%) scale(.8);opacity:0}15%{transform:translate(-50%,-50%) scale(1.08);opacity:1}75%{opacity:1}to{transform:translate(calc(-50% + var(--bgDx, 0px)),calc(-50% + var(--bgDy, -48px))) scale(.9);opacity:0}}@keyframes bgFloatFly{0%{transform:translate(-50%,-50%) scale(.8);opacity:0}15%{transform:translate(-50%,-50%) scale(1.08);opacity:1}60%{opacity:1}to{transform:translate(calc(-50% + var(--bgDx, 0px)),calc(-50% + var(--bgDy, 0px))) scale(.35);opacity:0}}@keyframes bgStampIn{0%{transform:rotate(-6deg) scale(1.4);opacity:0}to{transform:rotate(-6deg) scale(1);opacity:1}}@keyframes bgFadeOut{0%{opacity:1}to{opacity:0}}@keyframes bgFadeIn{0%{opacity:0}to{opacity:1}}@keyframes bgWipe{0%{clip-path:inset(0 100% 0 0)}30%{clip-path:inset(0 0 0 0)}78%{clip-path:inset(0 0 0 0)}to{clip-path:inset(0 0 0 100%)}}@keyframes bgBloom{0%{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}@keyframes bgShrinkIn{0%{transform:scale(2.2);opacity:0}to{transform:scale(1);opacity:1}}@keyframes bgPop{0%{transform:scale(1)}45%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes bgGhostIn{0%{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}@keyframes bgTopple{0%{transform:rotate(0) translateY(0)}to{transform:rotate(90deg) translate(12%,-8%);opacity:.85}}@keyframes bgPinchOut{to{transform:scale(.15);opacity:0}}@keyframes bgPinchIn{to{transform:scale(1)}}@keyframes bgParticle{0%{transform:translate(0) scale(var(--bgPs,1));opacity:1}to{transform:translate(var(--bgPx),var(--bgPy)) scale(.2);opacity:0}}@keyframes bgBreathe{0%,to{opacity:1}50%{opacity:.45}}@keyframes bgWobbleIn{0%{transform:translateX(-40px) rotate(-8deg);opacity:0}30%{transform:translateX(8px) rotate(6deg);opacity:1}50%{transform:translateX(-5px) rotate(-3deg)}70%{transform:translateX(3px) rotate(4deg)}to{transform:translateX(0) rotate(3deg);opacity:1}}@keyframes bgWave{0%{transform:scale(.4);opacity:.9}to{transform:scale(4);opacity:0}}@keyframes bgSparkFly{0%{translate:0 0;scale:var(--bgSs,1);opacity:1}to{translate:var(--bgSx) var(--bgSy);scale:.2;opacity:0}}@media (prefers-reduced-motion:reduce){.csRoot .bgFloat,.csRoot .bgStamp{animation-name:none}.csRoot .bgStamp{transform:rotate(-6deg)}.csRoot .bgStamp[data-variant=wobble]{transform:rotate(3deg)}.csRoot .bgSparkle,.csRoot .bgStampWave{display:none}.csRoot .bgBanner{animation-name:none}.csRoot .bgBoardFlash,.csRoot .bgFlash{animation-name:none;opacity:.6}.csRoot .bgDeco[data-kind=topple][data-anim="1"] .bgGlyph{animation-name:none;opacity:.35}.csRoot .bgMorphFrom{animation-name:none;opacity:0}.csRoot .bgMorphTo{animation-name:none;transform:none}.csRoot .bgBoard[data-spin="1"]{transform:none}}