/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}:root,:host{--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1)}.invisible{visibility:hidden}.visible{visibility:visible}.relative{position:relative}.static{position:static}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.grid{display:grid}.border{border-style:var(--tw-border-style);border-width:1px}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}:root{--violet:#a855f7;--pink:#ec4899;--blue:#3b82f6;--green:#22c55e;--orange:#f97316;--red:#ef4444;--yellow:#eab308;--grad-brand:linear-gradient(135deg, var(--violet), var(--pink));--radius-card:20px;--radius-btn:12px;--font-display:"Poppins", ui-sans-serif, sans-serif;--font-body:"Inter", ui-sans-serif, sans-serif}[data-app-theme=midnight]{--bg:#0e1117;--surface:#171a22;--surface-2:#1d212b;--border:#262b36;--border-soft:#1c2029;--text:#f4f3fb;--text-dim:#9a9fae;--text-faint:#6b7280;--x-color:#a855f7;--o-color:#ff6b5b;--board-line:#2a2f3d;--board-bg:transparent;--surface-rgb:23, 26, 34;--hover-shadow:0 8px 18px #00000059;--hover-shadow-lg:0 14px 30px #0006;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-app-theme=canvas]{--bg:#fafafa;--surface:#fff;--surface-2:#f5f5f5;--border:#e2e2e5;--border-soft:#ececee;--text:#1f2430;--text-dim:#6b7280;--text-faint:#9ca3af;--x-color:#a855f7;--o-color:#ff6b5b;--board-line:#334155;--board-bg:transparent;--surface-rgb:255, 255, 255;--hover-shadow:0 4px 10px #0f172a12;--hover-shadow-lg:0 8px 18px #0f172a14;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-app-theme=notebook]{--bg:#f6efd8;--surface:#efe6c9;--surface-2:#eae0c0;--border:#d8cba0;--border-soft:#e3d8b8;--text:#2b2620;--text-dim:#6b6250;--text-faint:#9c9377;--x-color:#a855f7;--o-color:#ff6b5b;--board-line:#4a4238;--board-bg:transparent;--surface-rgb:239, 230, 201;--hover-shadow:0 6px 16px #78643c38;--hover-shadow-lg:0 12px 26px #78643c42;--font-hand:"Caveat", cursive;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%}body{background-color:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;background-attachment:fixed;margin:0}[data-app-theme=midnight] body{background-image:radial-gradient(900px 500px at 15% -10%,#a855f729,#0000 60%),radial-gradient(700px 500px at 100% 10%,#3b82f61a,#0000 55%)}[data-app-theme=notebook] body{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='matrix' values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.02 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");background-repeat:repeat}#root{flex-direction:column;min-height:100%;display:flex}a{color:var(--blue);text-decoration:none}button,input{font-family:var(--font-body)}h1,h2,h3{font-family:var(--font-display)}[data-app-theme=notebook] h1,[data-app-theme=notebook] h2{font-family:var(--font-hand);letter-spacing:.01em}*,:before,:after{transition:background-color .3s,border-color .3s,color .3s}::selection{background:var(--violet);color:#fff}:focus-visible{box-shadow:0 0 0 1.5px var(--violet), 0 0 0 4px #a855f747;outline:none}.btn{border-radius:var(--radius-btn);font-family:var(--font-body);cursor:pointer;box-shadow:none;border:none;justify-content:center;align-items:center;gap:.5rem;padding:.7rem 1.4rem;font-size:.9rem;font-weight:600;transition:transform .2s,filter .2s,box-shadow .2s,background .2s,background-color .3s,border-color .3s,color .3s;display:inline-flex}.btn:hover:not(:disabled){filter:brightness(1.08);box-shadow:var(--hover-shadow);transform:translateY(-2px)scale(1.02)}.btn:active:not(:disabled){box-shadow:none;transition-duration:.1s;transform:translateY(0)scale(.97)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--grad-brand);color:#fff}.btn-blue{background:var(--blue);color:#fff}.btn-green{background:var(--green);color:#06210f}.btn-orange{background:var(--orange);color:#2a1000}.btn-ghost{border:1.5px solid var(--border);color:var(--text);background:0 0}.btn-ghost:hover:not(:disabled){border-color:var(--text-dim)}.input{border:1.5px solid var(--border);color:var(--text);border-radius:var(--radius-btn);font-family:var(--font-body);background:#00000040;padding:.7rem .9rem;font-size:1rem}.input:focus-visible{border-color:var(--violet)}[data-app-theme=notebook] .btn{box-shadow:0 2px 6px #78643c2e}[data-app-theme=notebook] .btn:hover:not(:disabled){box-shadow:var(--hover-shadow);transform:translateY(-2px)scale(1.02)}[data-app-theme=notebook] .btn:active:not(:disabled){transform:translateY(0)scale(.97)}[data-app-theme=notebook] .btn-ghost{background:var(--surface);border-color:var(--border)}@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}.auth-modal-backdrop{-webkit-backdrop-filter:blur(4px);z-index:50;background:#0009;justify-content:center;align-items:center;padding:1rem;animation:.2s forwards modal-backdrop-in;display:flex;position:fixed;inset:0}.auth-modal{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-card);width:100%;max-width:360px;box-shadow:var(--hover-shadow-lg);padding:1.75rem 1.5rem;animation:.22s cubic-bezier(.16,1,.3,1) forwards modal-pop-in;position:relative}@keyframes modal-backdrop-in{0%{opacity:0}to{opacity:1}}@keyframes modal-pop-in{0%{opacity:0;transform:scale(.96)translateY(8px)}to{opacity:1;transform:scale(1)translateY(0)}}.auth-modal h2{margin:0 0 1.25rem;font-size:1.3rem;font-weight:700}.auth-modal form{flex-direction:column;gap:.9rem;display:flex}.auth-field{color:var(--text-dim);flex-direction:column;gap:.35rem;font-size:.8rem;display:flex}.auth-field .input{width:100%}.auth-submit{width:100%;margin-top:.25rem}.auth-modal-error{color:var(--red);margin:0;font-size:.8rem}.auth-modal-notice{color:var(--green);margin:0;font-size:.8rem}.auth-modal-toggle{color:var(--text-dim);cursor:pointer;text-align:center;background:0 0;border:none;width:100%;margin-top:1rem;font-size:.8rem}.auth-modal-toggle:hover{color:var(--text)}.auth-modal-close{color:var(--text-dim);cursor:pointer;background:0 0;border:none;font-size:1.4rem;line-height:1;position:absolute;top:.75rem;right:.9rem}.auth-modal-close:hover{color:var(--text)}.join-modal-code{text-align:center;letter-spacing:.35rem;font-size:1.2rem}.header{border-bottom:1px solid var(--border-soft);background:rgba(var(--surface-rgb), .85);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10;align-items:center;gap:2rem;padding:1rem 1.5rem;display:flex;position:sticky;top:0}.header-brand{color:var(--text);font-family:var(--font-display);flex-shrink:0;align-items:center;gap:.6rem;font-size:1.05rem;font-weight:700;display:flex}.header-nav{flex:1;gap:1.5rem;display:flex}.header-link{color:var(--text-dim);border-bottom:2px solid #0000;padding:.3rem 0;font-size:.9rem;font-weight:500}.header-link:hover{color:var(--text)}.header-link--active{color:var(--text);border-bottom-color:var(--violet)}.header-actions{align-items:center;gap:.75rem;display:flex}.header-join-btn{border-color:var(--violet);color:var(--violet)}.header-mute-btn{cursor:pointer;color:var(--text-dim);background:0 0;border:none;justify-content:center;align-items:center;min-width:2.75rem;min-height:2.75rem;padding:.3rem;font-size:1.1rem;line-height:1;display:flex}.header-hamburger{cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;min-width:2.75rem;min-height:2.75rem;display:none}.header-hamburger-bars,.header-hamburger-bars:before,.header-hamburger-bars:after{background:var(--text);border-radius:2px;width:1.15rem;height:2px;transition:transform .2s,opacity .2s;display:block}.header-hamburger-bars{position:relative}.header-hamburger-bars:before,.header-hamburger-bars:after{content:"";position:absolute;left:0}.header-hamburger-bars:before{top:-6px}.header-hamburger-bars:after{top:6px}.header-hamburger-bars--open{background:0 0}.header-hamburger-bars--open:before{top:0;transform:rotate(45deg)}.header-hamburger-bars--open:after{top:0;transform:rotate(-45deg)}.header-mobile-panel{display:none}.header-mute-btn:hover{color:var(--text)}.header-theme-btn{cursor:pointer;color:var(--text-dim);background:0 0;border:none;justify-content:center;align-items:center;min-width:2.75rem;min-height:2.75rem;padding:.3rem;font-size:1.1rem;line-height:1;display:flex}.header-theme-btn:hover{color:var(--text)}.header-username{color:var(--text-dim);font-size:.85rem;font-weight:600}@media (width<=720px){.header{flex-wrap:nowrap;gap:.5rem;padding:.75rem 1rem}.header-brand span,.header-nav,.header-actions-wide{display:none}.header-hamburger{display:flex}.header-actions{margin-left:auto}.header-mobile-panel{border-bottom:1px solid var(--border-soft);background:var(--surface);box-sizing:border-box;z-index:9;flex-direction:column;gap:.25rem;width:100%;padding:.75rem 1rem 1rem;display:flex;position:absolute;top:100%;left:0;right:0}.header-mobile-link{color:var(--text-dim);padding:.7rem .25rem;font-size:.95rem;font-weight:500}.header-mobile-link.active,.header-mobile-link[aria-current=page]{color:var(--text)}.header-mobile-divider{background:var(--border-soft);height:1px;margin:.4rem 0}.header-mobile-btn{justify-content:center;width:100%}}.magic-card-spotlight{border-radius:inherit;background:radial-gradient(220px circle at var(--spot-x,50%) var(--spot-y,50%), #a855f729, transparent 70%);opacity:0;pointer-events:none;transition:opacity .25s;position:absolute;inset:0}.magic-card-border{border-radius:inherit;background:radial-gradient(160px circle at var(--spot-x,50%) var(--spot-y,50%), var(--violet), transparent 70%);-webkit-mask-composite:xor;opacity:0;pointer-events:none;padding:1px;transition:opacity .25s;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}:is(button,a,div):hover>.magic-card-spotlight,:is(button,a,div):hover>.magic-card-border{opacity:1}@media (prefers-reduced-motion:reduce){.magic-card-spotlight,.magic-card-border{transition:none}}.variant-card{background:var(--surface);border:1.5px solid var(--border-soft);border-radius:var(--radius-card);cursor:pointer;text-align:left;box-shadow:none;flex-direction:column;align-items:flex-start;gap:.75rem;padding:1rem;transition:border-color .2s,transform .2s,box-shadow .2s;display:flex;position:relative;overflow:hidden}.variant-card:hover:not(:disabled){border-color:var(--border);box-shadow:var(--hover-shadow-lg);transform:translateY(-3px)scale(1.015)}.variant-card--selected{border-color:var(--violet);box-shadow:0 0 0 1px var(--violet)}.variant-card:disabled{opacity:.45;cursor:not-allowed}.variant-card-art{aspect-ratio:1.6;background:#f7f7fb;border-radius:14px;justify-content:center;align-items:center;width:100%;display:flex;overflow:hidden}.mini-board-img{object-fit:contain;width:100%;height:100%;transition:transform .2s}.variant-card:hover:not(:disabled) .mini-board-img{transform:translateY(-3px)}.variant-card-body h3{color:var(--text);margin:0 0 .2rem;font-size:.92rem;font-weight:600}.variant-card-body p{color:var(--text-dim);margin:0;font-size:.78rem;line-height:1.3}.variant-card-tag{background:var(--surface-2);color:var(--text-dim);border-radius:999px;padding:.25rem .6rem;font-size:.68rem;font-weight:500}@property --border-beam-angle{syntax:"<angle>";inherits:false;initial-value:0deg}.magic-border-beam{border-radius:inherit;background:conic-gradient(from var(--border-beam-angle), transparent calc(100% - var(--beam-size)), var(--beam-color) 100%);-webkit-mask-composite:xor;animation:border-beam-spin var(--beam-duration) linear infinite;pointer-events:none;padding:1.5px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}@keyframes border-beam-spin{to{--border-beam-angle:360deg}}@media (prefers-reduced-motion:reduce){.magic-border-beam{animation:none}}.home{flex:1;width:100%;max-width:1100px;margin:0 auto;padding:2.5rem 1.5rem 4rem}.hero{grid-template-columns:1.3fr 1fr;align-items:center;gap:2rem;margin-bottom:3rem;display:grid}@media (width<=760px){.hero{grid-template-columns:1fr}}.hero-text h1{color:var(--text);margin:0 0 1.25rem;font-size:clamp(2rem,5vw,2.8rem);font-weight:700;line-height:1.15}.grad-text{background:var(--grad-brand);color:#0000;-webkit-background-clip:text;background-clip:text}.hero-text p{color:var(--text-dim);max-width:46ch;margin:0 0 1.5rem;font-size:1rem;line-height:1.5}.hero-actions{flex-wrap:wrap;gap:.85rem;display:flex}.hero-cta{position:relative}.hero-art{aspect-ratio:1;background:radial-gradient(#a855f724,#0000 70%);border-radius:24px;justify-content:center;align-items:center;display:flex}.variants-section{margin-bottom:2.5rem}.variants-section-header{justify-content:space-between;align-items:baseline;margin-bottom:1rem;display:flex}.variants-section-header h2{margin:0;font-size:1.4rem;font-weight:700}.home-name{max-width:320px;margin-bottom:1.5rem}.home-name label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);margin-bottom:.4rem;font-size:.75rem;display:block}.home-name input{width:100%}.variant-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:1rem;display:grid}.home-actions{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-card);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding:1.25rem;display:flex}.home-actions-label{color:var(--text-dim);margin:0;font-size:.9rem}.home-join{gap:.6rem;display:flex}.code-input{text-align:center;letter-spacing:.35rem;width:8.5rem;font-size:1.2rem}.home-error{color:var(--red);text-align:center;min-height:1.1em;margin-top:.75rem;font-size:.85rem}.board-themed{background:var(--board-bg,transparent);border-radius:var(--board-radius,16px);padding:var(--board-padding,0);transition:background .2s}.board-wrap{aspect-ratio:1;width:100%;position:relative}.gravity-drop-row{grid-auto-flow:column;gap:2px;margin-bottom:.5rem;display:grid}.gravity-drop-btn{background:var(--surface-2);border:1px solid var(--border-soft);color:var(--text-dim);cursor:pointer;border-radius:8px;padding:.3rem 0;font-size:1rem;transition:color .2s,border-color .2s,transform .2s}.gravity-drop-btn:hover:not(:disabled){color:var(--violet);border-color:var(--violet);transform:translateY(-1px)}.gravity-drop-btn:disabled{opacity:.3;cursor:not-allowed}.sos-scoreboard{justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.6rem;font-size:.85rem;font-weight:600;display:flex}.sos-score--x{color:var(--x-color)}.sos-score--o{color:var(--o-color)}.sos-letter-picker{gap:.4rem;display:flex}.sos-letter-chip{border:1.5px solid var(--border);width:2.25rem;height:2.25rem;color:var(--text);cursor:pointer;background:0 0;border-radius:50%;font-weight:700}.sos-letter-chip--selected{border-color:var(--violet);color:var(--violet);background:#a855f724}.sos-tie{text-align:center;color:var(--text-dim);margin-top:.5rem;font-size:.85rem}.connect6-hint{text-align:center;color:var(--text-dim);margin:0;font-size:.78rem;position:absolute;bottom:-1.6rem;left:0;right:0}.quixo-axis-picker{color:var(--text-dim);justify-content:center;align-items:center;gap:.5rem;font-size:.8rem;display:flex;position:absolute;bottom:-2.2rem;left:0;right:0}.pentago-rotate-picker{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0806148c;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;display:flex;position:absolute;inset:0}.pentago-rotate-label{color:var(--text);margin:0;font-size:.78rem;font-weight:600}.pentago-rotate-grid{aspect-ratio:1;grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(2,1fr);gap:.75rem;width:70%;display:grid}.pentago-rotate-cell{border:1.5px dashed var(--border-soft);border-radius:10px;justify-content:center;align-items:center;gap:.4rem;display:flex}.pentago-rotate-cell .btn{padding:.3rem .5rem;font-size:1.1rem}.board-svg{width:100%;height:100%;display:block;overflow:visible}.board-line{stroke:var(--board-line,var(--border));stroke-width:2.9px;stroke-linecap:round;fill:none;stroke-dasharray:1;stroke-dashoffset:1px;animation:.3s ease-out forwards board-line-draw}.board-line--h{animation-delay:0s}.board-line--v{animation-delay:.3s}.mark{stroke-width:6px;stroke-linecap:round;fill:none;opacity:0;transform-box:fill-box;transform-origin:50%;animation:.22s forwards pop-in}.mark--x{stroke:var(--x-color);filter:drop-shadow(0 0 4px #a855f7a6)}.mark--o{stroke:var(--o-color);filter:drop-shadow(0 0 4px #ff6b5ba6)}[data-app-theme=midnight] .mark{animation:.22s forwards midnight-pop}.win-strike{stroke-width:8px;stroke-linecap:round;fill:none;stroke-dasharray:1;stroke-dashoffset:1px;animation:.35s ease-out .1s forwards draw-strike}.win-strike--x{stroke:var(--x-color)}.win-strike--o{stroke:var(--o-color)}[data-app-theme=midnight] .win-strike--x{filter:drop-shadow(0 0 5px #a855f78c)}[data-app-theme=midnight] .win-strike--o{filter:drop-shadow(0 0 5px #ff6b5b8c)}[data-app-theme=notebook] .mark{opacity:1;animation:none}[data-app-theme=notebook] .mark--x1,[data-app-theme=notebook] .mark--o{stroke-dasharray:1;stroke-dashoffset:1px;animation:.13s ease-out forwards draw-strike}[data-app-theme=notebook] .mark--x2{stroke-dasharray:1;stroke-dashoffset:1px;animation:.13s ease-out .12s forwards draw-strike}.mark--ghost{opacity:0;pointer-events:none;animation:none!important}[data-app-theme=notebook] .mark--ghost{opacity:.2;transition:opacity .15s}[data-app-theme=notebook] .win-strike,[data-app-theme=notebook] .win-strike--x,[data-app-theme=notebook] .win-strike--o{stroke-width:14px;stroke:#f9e94e;opacity:.55;mix-blend-mode:multiply;filter:none}@keyframes pop-in{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes midnight-pop{0%{opacity:0;transform:scale(.4)}65%{opacity:1;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}@keyframes draw-strike{to{stroke-dashoffset:0}}@keyframes board-line-draw{to{stroke-dashoffset:0}}.cell-overlay{display:grid;position:absolute;inset:0}.cell-btn{cursor:pointer;background:0 0;border:none;padding:0}.cell-btn:disabled{cursor:default}.cell-btn:not(:disabled):hover{background:#a855f70f}.ultimate-board{aspect-ratio:1;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);gap:3%;width:100%;display:grid}.ultimate-cell{border:1.5px solid var(--border-soft);border-radius:10px;transition:border-color .2s;position:relative}.ultimate-cell--active{border-color:var(--violet);box-shadow:0 0 0 1px var(--violet)}.ultimate-cell--resolved{border-width:2px}.ultimate-cell-stamp{font-family:var(--font-display);pointer-events:none;justify-content:center;align-items:center;font-size:4.5rem;font-weight:700;display:flex;position:absolute;inset:0}.notakto-board{gap:4%;width:100%;display:flex}.notakto-cell{border-radius:10px;flex:1;transition:opacity .25s;position:relative}.notakto-cell--dead{opacity:.3}.notakto-dead-stamp{font-family:var(--font-display);color:var(--red);pointer-events:none;justify-content:center;align-items:center;font-size:3rem;font-weight:700;display:flex;position:absolute;inset:0}.cell-btn--selected{box-shadow:inset 0 0 0 2px var(--blue);background:#a855f724;border-radius:8px}.gobblet-layout{align-items:center;gap:1rem;display:flex}.gobblet-board-wrap{flex:1;min-width:0}.gobblet-panel{border:1.5px solid var(--border-soft);border-radius:16px;flex-direction:column;flex-shrink:0;align-items:center;gap:.75rem;width:6.5rem;padding:.75rem .5rem;display:flex}.gobblet-panel--x{border-color:#a855f766}.gobblet-panel--o{border-color:#ef444466}.gobblet-panel-header{color:var(--text);text-align:center;align-items:center;gap:.4rem;font-size:.78rem;font-weight:600;display:flex}.gobblet-panel-dot{border-radius:50%;flex-shrink:0;width:.45rem;height:.45rem}.gobblet-panel-dot--x{background:var(--x-color)}.gobblet-panel-dot--o{background:var(--o-color)}.gobblet-panel-grid{grid-template-columns:repeat(1,1fr);justify-items:center;gap:.5rem;display:grid}.gobblet-piece-btn{cursor:pointer;background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;width:100%;padding:.3rem .2rem;transition:transform .2s,background .2s,opacity .2s;display:flex;position:relative}.gobblet-piece-btn:hover:not(:disabled){transform:translateY(-2px)scale(1.04)}.gobblet-piece-btn--selected{background:var(--surface-2);box-shadow:0 0 0 2px var(--violet)}.gobblet-piece-btn:disabled{cursor:not-allowed;opacity:.3}.gobblet-piece-count{color:var(--text-dim);font-size:.68rem;font-weight:700;position:absolute;bottom:.1rem;right:.3rem}@media (width<=640px){.gobblet-layout{flex-direction:column}.gobblet-panel{width:100%}.gobblet-panel-grid{grid-template-columns:repeat(3,1fr)}}.numerical-digit{font-family:var(--font-display);opacity:0;transform-box:fill-box;transform-origin:50%;font-size:4rem;font-weight:700;animation:.25s forwards pop-in}.numerical-digit--x{fill:var(--x-color)}.numerical-digit--o{fill:var(--o-color)}.numerical-picker-wrap{flex-direction:column;align-items:center;gap:.5rem;margin-top:1.25rem;display:flex}.numerical-picker-label{letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);font-size:.7rem;font-weight:700}.numerical-picker{justify-content:center;gap:.6rem;display:flex}.numerical-chip{border:1.5px solid var(--border);width:2.5rem;height:2.5rem;color:var(--text);font-family:var(--font-body);cursor:pointer;background:0 0;border-radius:50%;font-size:1.05rem;transition:border-color .2s,transform .2s}.numerical-chip:hover:not(:disabled){transform:translateY(-2px)scale(1.06)}.numerical-chip--selected{border-color:var(--violet);color:var(--violet)}.numerical-chip:disabled{opacity:.25;cursor:not-allowed}.threed-board{flex-direction:column;align-items:center;gap:1rem;width:100%;display:flex}.threed-cube-wrap{aspect-ratio:1;border:1.5px solid var(--border-soft);background:radial-gradient(circle at 50% 35%,#a855f714,#0000 70%);border-radius:16px;width:100%;max-width:22rem;position:relative;overflow:hidden}.threed-hint{text-align:center;color:var(--text-dim);pointer-events:none;margin:0;font-size:.72rem;position:absolute;bottom:.5rem;left:0;right:0}.threed-layers{flex-direction:row;gap:.65rem;width:100%;display:flex}.threed-layer{border:1.5px solid var(--border-soft);border-radius:12px;flex-direction:column;flex:1;align-items:center;gap:.4rem;min-width:0;padding:.5rem;display:flex}.threed-layer-label{letter-spacing:.04em;text-transform:uppercase;color:var(--text-dim);text-align:center;font-size:.64rem;font-weight:700}.threed-layer-grid{aspect-ratio:1;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);gap:3px;width:100%;display:grid}.threed-layer-cell{background:var(--surface-2);border:1px solid var(--border-soft);cursor:pointer;border-radius:5px;justify-content:center;align-items:center;padding:0;transition:border-color .2s,background .2s;display:flex}.threed-layer-cell:hover:not(:disabled){border-color:var(--violet)}.threed-layer-cell:disabled{cursor:default}.threed-layer-cell--pending{background:#facc1526;border-color:#facc15}.threed-mark{font-size:.85rem;font-weight:700;line-height:1}.threed-mark--x{color:#ef4444}.threed-mark--o{color:#3b82f6}.threed-mark--pending{color:#facc15;font-size:.65rem}@media (width<=640px){.threed-layers{flex-direction:column}.threed-layer-grid{max-width:20rem;margin:0 auto}}@media (width<=480px){.threed-layer-label{font-size:.56rem}}.player-badge{align-items:center;gap:.5rem;display:flex}.player-badge--reverse{flex-direction:row-reverse}.player-badge-avatar{border-style:solid;border-width:2px;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:2rem;height:2rem;font-size:.95rem;font-weight:700;display:flex}.player-badge-avatar--x{border-color:var(--x-color);color:var(--x-color)}.player-badge-avatar--o{border-color:var(--o-color);color:var(--o-color)}.player-badge-name{color:var(--text);font-size:.9rem;font-weight:600}.player-badge-dot{border-radius:50%;width:.4rem;height:.4rem}.player-badge-dot--x{background:var(--x-color)}.player-badge-dot--o{background:var(--o-color)}.game-over-overlay{z-index:8;-webkit-backdrop-filter:blur(2px);border-radius:inherit;background:#0000002e;justify-content:center;align-items:center;padding:1rem;animation:.2s forwards game-over-backdrop-in;display:flex;position:absolute;inset:0}.game-over-dialog{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-card);width:100%;max-width:300px;box-shadow:var(--hover-shadow-lg);text-align:center;padding:1.75rem 1.5rem 1.5rem;animation:.25s cubic-bezier(.16,1,.3,1) forwards game-over-in;position:relative}@keyframes game-over-backdrop-in{0%{opacity:0}to{opacity:1}}@keyframes game-over-in{0%{opacity:0;transform:translateY(16px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.game-over-icon{border:2px solid var(--violet);background:radial-gradient(circle,#a855f729,#0000 70%);border-radius:50%;justify-content:center;align-items:center;width:4.5rem;height:4.5rem;margin:0 auto 1rem;font-size:2rem;display:flex}.game-over-icon--defeat{border-color:var(--border);filter:grayscale(.6)opacity(.75);background:radial-gradient(circle,#9490b024,#0000 70%)}.game-over-icon--draw{border-color:var(--border);filter:grayscale(.3)opacity(.85);background:radial-gradient(circle,#9490b024,#0000 70%)}.game-over-dialog h1{margin:0 0 .4rem;font-size:1.6rem;font-weight:700}.game-over-subtitle{color:var(--text-dim);margin:0 0 1.25rem;font-size:.88rem;line-height:1.4}.game-over-stats{grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:1.5rem;display:grid}.game-over-stat{background:var(--surface-2);border:1px solid var(--border-soft);border-radius:12px;flex-direction:column;align-items:center;gap:.2rem;padding:.6rem .3rem;display:flex}.game-over-stat strong{font-family:var(--font-display);font-size:1.05rem;font-weight:700}.game-over-stat span{color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;font-size:.68rem}.game-over-actions{flex-direction:column;gap:.55rem;display:flex}.game-over-btn{width:100%}.game-over-btn--secondary{background:var(--surface-2);border:1px solid var(--border);color:var(--text)}.game-over-btn--text{color:var(--text-dim);cursor:pointer;background:0 0;border:none;margin-top:.1rem;padding:.4rem;font-size:.85rem;font-weight:600;transition:color .2s}.game-over-btn--text:hover{color:var(--text)}[data-app-theme=notebook] .game-over-overlay{background:#3c321e26}[data-app-theme=notebook] .game-over-dialog{border-radius:4px;animation-name:game-over-in-notebook;box-shadow:0 10px 24px #78643c47,0 2px 6px #78643c2e}[data-app-theme=notebook] .game-over-dialog:before{content:"";background:#f9e94e8c;width:3.5rem;height:1.1rem;position:absolute;top:-.6rem;left:50%;transform:translate(-50%)rotate(3deg);box-shadow:0 1px 2px #0000001a}@keyframes game-over-in-notebook{0%{opacity:0;transform:rotate(-1.5deg)translateY(16px)scale(.98)}to{opacity:1;transform:rotate(-1.5deg)translateY(0)scale(1)}}.analysis-panel{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-card);width:100%;max-width:460px;margin-top:1.25rem;padding:1rem 1.25rem}.analysis-panel-header{align-items:center;gap:.5rem;margin-bottom:.75rem;font-size:.85rem;font-weight:700;display:flex}.analysis-panel-dot{background:var(--green);border-radius:50%;width:.5rem;height:.5rem}.analysis-panel-empty{color:var(--text-dim);margin:0;font-size:.85rem}.analysis-row{justify-content:space-between;align-items:baseline;padding:.3rem 0;font-size:.85rem;display:flex}.analysis-label{color:var(--text-dim)}.analysis-value{font-weight:600;font-family:var(--font-display)}.analysis-bar{background:var(--o-color);border-radius:999px;height:6px;margin:.35rem 0 .6rem;overflow:hidden}.analysis-bar-fill{background:var(--x-color);height:100%;transition:width .3s}.analysis-panel-note{color:var(--text-faint);margin:.6rem 0 0;font-size:.78rem;font-style:italic}.move-history-panel{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-card);width:100%;max-width:460px;margin-top:1.25rem;padding:1rem 1.25rem}.move-history-header{margin-bottom:.75rem;font-size:.85rem;font-weight:700}.move-history-empty{color:var(--text-dim);margin:0;font-size:.85rem}.move-history-list{flex-direction:column;gap:.35rem;max-height:220px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.move-history-item{border-bottom:1px solid var(--border-soft);align-items:center;gap:.6rem;padding:.25rem 0;font-size:.82rem;display:flex}.move-history-item:last-child{border-bottom:none}.move-history-num{color:var(--text-faint);flex-shrink:0;width:1.5rem}.move-history-symbol{flex-shrink:0;width:1rem;font-weight:700}.move-history-symbol--x{color:var(--x-color)}.move-history-symbol--o{color:var(--o-color)}.move-history-desc{color:var(--text);flex:1}.move-history-player{color:var(--text-dim);flex-shrink:0;font-size:.75rem}.paper-celebration{pointer-events:none;z-index:6;position:absolute;inset:0;overflow:visible}.paper-celebration-piece{background:var(--text-dim);opacity:.85;border-radius:1px;width:10px;height:6px;animation:1.4s ease-out forwards paper-drift;position:absolute;top:50%;left:50%}.paper-celebration-piece:nth-child(3n+1){background:#a855f7}.paper-celebration-piece:nth-child(3n+2){background:#ff6b5b}.paper-celebration-piece--star{clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);background:#f9e94e;border-radius:0;width:9px;height:9px}@keyframes paper-drift{0%{opacity:1;transform:translate(0)rotate(0)}to{transform:translate(var(--dx), var(--dy)) rotate(var(--rot));opacity:0}}[data-app-theme=midnight] .paper-celebration-piece{border-radius:50%;width:6px;height:6px}[data-app-theme=midnight] .paper-celebration-piece:nth-child(3n+1){background:#a855f7;box-shadow:0 0 6px #a855f7}[data-app-theme=midnight] .paper-celebration-piece:nth-child(3n+2){background:#ff6b5b;box-shadow:0 0 6px #ff6b5b}[data-app-theme=midnight] .paper-celebration-piece--star{clip-path:none;border-radius:50%;width:6px;height:6px;box-shadow:0 0 6px #f9e94e}[data-app-theme=canvas] .paper-celebration-piece{opacity:.55;border-radius:50%;width:6px;height:6px}[data-app-theme=canvas] .paper-celebration-piece--star{clip-path:none;opacity:.5;border-radius:50%;width:6px;height:6px}.room{flex-direction:column;flex:1;align-items:center;padding:1.5rem 1.25rem 3rem;display:flex}.room-panel-toggles{gap:1.25rem;margin-top:1.5rem;display:flex}.analysis-toggle{color:var(--text-dim);cursor:pointer;background:0 0;border:none;font-size:.8rem}.analysis-toggle:hover{color:var(--text)}.room-topbar{justify-content:space-between;align-items:center;width:100%;max-width:460px;margin-bottom:.5rem;display:flex}.room-back{color:var(--text-dim);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;min-width:2.75rem;min-height:2.75rem;padding:.25rem;font-size:1.2rem;line-height:1;display:flex}.room-back:hover{color:var(--text)}.room-spectator-tag{letter-spacing:.06em;color:var(--text-dim);border:1.5px solid var(--border-soft);border-radius:999px;padding:.25rem .75rem;font-size:.68rem;font-weight:700}.room-menu{position:relative}.room-menu-trigger{color:var(--text-dim);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;min-width:2.75rem;min-height:2.75rem;padding:.25rem .5rem;font-size:1.2rem;line-height:1;display:flex}.room-menu-trigger:hover{color:var(--text)}.room-menu-dropdown{background:var(--surface);border:1px solid var(--border-soft);z-index:5;border-radius:12px;flex-direction:column;gap:.4rem;min-width:180px;padding:.6rem .9rem;display:flex;position:absolute;top:calc(100% + .4rem);right:0}.room-menu-code{letter-spacing:.1em;color:var(--text-dim);font-size:.85rem;font-weight:600}.room-menu-dropdown button{color:var(--violet);cursor:pointer;text-align:left;background:0 0;border:none;padding:0;font-size:.85rem;font-weight:600}.room-hud{justify-content:space-between;align-items:center;width:100%;max-width:460px;margin-bottom:1.25rem;display:flex}.room-hud-center{flex-direction:column;align-items:center;gap:.15rem;display:flex}.room-hud-turn{letter-spacing:.06em;color:var(--violet);border:1.5px solid var(--violet);border-radius:999px;padding:.25rem .75rem;font-size:.68rem;font-weight:700}.room-hud-score{font-family:var(--font-display);font-size:1.2rem;font-weight:700}.room-hud-waiting{color:var(--text-faint);font-size:.8rem}.room-hud-spectators{color:var(--text-faint);font-size:.7rem}.room-hud-timer{color:var(--text-dim);font-size:.7rem;font-weight:700}.room-hud-timer--danger{color:var(--red)}.room-board{width:100%;max-width:460px;position:relative}.room-board--wide,.room-topbar--wide,.room-hud--wide{max-width:640px}.room-turn-footer{text-align:center;flex-direction:column;align-items:center;gap:.3rem;margin-top:1.25rem;display:flex}.room-turn-footer-dot{border-radius:50%;width:.5rem;height:.5rem;margin-bottom:.15rem}.room-turn-footer p{margin:0;font-size:1.05rem;font-weight:700}.room-turn-footer small{color:var(--text-dim);font-size:.82rem}.room-status{text-align:center;min-height:1.6rem;font-family:var(--font-display);margin:1.1rem 0;font-size:1.3rem;font-weight:600}.room-error{color:var(--red);text-align:center;margin-top:1rem;font-size:.9rem}.wild-picker{color:var(--text-dim);text-transform:uppercase;letter-spacing:.06em;justify-content:center;align-items:center;gap:.6rem;margin-top:1.25rem;font-size:.8rem;display:flex}.wild-chip{cursor:pointer;background:0 0;border-radius:50%;width:2.25rem;height:2.25rem;font-weight:700}.wild-chip--x{border:1.5px solid var(--x-color);color:var(--x-color);opacity:.6}.wild-chip--o{border:1.5px solid var(--o-color);color:var(--o-color);opacity:.6}.wild-chip--selected{opacity:1}.wild-chip--selected.wild-chip--x{background:#a855f724}.wild-chip--selected.wild-chip--o{background:#ef444424}@media (width<=480px){.room{padding:1.25rem .75rem 3rem}}.explorer{flex:1;width:100%;max-width:1100px;margin:0 auto;padding:2.5rem 1.5rem 4rem}.explorer h1{margin:0 0 .6rem;font-size:1.8rem;font-weight:700}.explorer>p{color:var(--text-dim);margin:0 0 1.75rem}.explorer-search{width:100%;max-width:320px;margin-bottom:1.75rem;display:block}.explorer-no-results{color:var(--text-dim);font-size:.9rem}.explorer .variant-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:1rem;display:grid}.variant-landing{flex:1;width:100%;max-width:620px;margin:0 auto;padding:1.5rem 1.5rem 4rem}.variant-landing-back{color:var(--text-dim);cursor:pointer;background:0 0;border:none;margin-bottom:1rem;padding:0;font-size:.85rem}.variant-landing-back:hover{color:var(--text)}.variant-landing-hero{text-align:center;margin-bottom:2.5rem}.variant-landing-hero svg{margin-bottom:1rem}.variant-landing-hero h1{margin:0 0 .65rem;font-size:1.7rem;font-weight:700}.variant-landing-hero p{color:var(--text-dim);margin:0;max-width:40ch;margin-inline:auto;line-height:1.4}.match-settings{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-card);flex-direction:column;gap:.7rem;margin-bottom:1.25rem;padding:1rem 1.25rem;display:flex}.match-settings-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.match-settings-label{color:var(--text-dim);flex-shrink:0;font-size:.8rem;font-weight:600}.match-settings-chips{flex-wrap:wrap;gap:.4rem;display:flex}.settings-chip{background:var(--surface-2);border:1px solid var(--border);color:var(--text);cursor:pointer;border-radius:999px;padding:.35rem .75rem;font-size:.76rem;font-weight:600;transition:border-color .2s,color .2s,background .2s,transform .2s}.settings-chip:hover{border-color:var(--violet);color:var(--violet);transform:translateY(-1px)}.settings-chip--selected{border-color:var(--violet);color:var(--violet);background:#a855f729}.variant-landing-actions{flex-direction:column;gap:.9rem;display:flex}.variant-action{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-card);cursor:pointer;text-align:left;box-shadow:none;align-items:center;gap:1rem;padding:1.1rem 1.25rem;transition:transform .2s,border-color .2s,box-shadow .2s;display:flex}.variant-action:hover:not(:disabled){box-shadow:var(--hover-shadow);transform:translateY(-2px)}.variant-action:disabled{opacity:.5;cursor:not-allowed}.variant-action--violet{border-color:#a855f759}.variant-action--green{border-color:#22c55e59}.variant-action--blue{border-color:#3b82f659}.variant-action-icon{background:var(--surface-2);border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:2.75rem;height:2.75rem;font-size:1.5rem;display:flex}.variant-action-body{flex-direction:column;flex:1;display:flex}.variant-action-body strong{color:var(--text);font-size:1rem;font-weight:600}.variant-action-body small{color:var(--text-dim);margin-top:.1rem;font-size:.82rem}.variant-action-chevron{color:var(--text-faint);font-size:1.3rem}.variant-action--robot{cursor:default}.variant-action-difficulties{flex-shrink:0;gap:.4rem;display:flex}.difficulty-chip{background:var(--surface-2);border:1px solid var(--border);color:var(--text);cursor:pointer;border-radius:999px;padding:.4rem .85rem;font-size:.78rem;font-weight:600;transition:border-color .2s,color .2s,transform .2s}.difficulty-chip:hover:not(:disabled){border-color:var(--violet);color:var(--violet);transform:translateY(-1px)}.difficulty-chip:disabled{opacity:.5;cursor:not-allowed}.variant-landing-error{color:var(--red);text-align:center;margin-top:1.25rem;font-size:.85rem}.profile{flex:1;width:100%;max-width:620px;margin:0 auto;padding:2rem 1.5rem 4rem}.profile h1{margin:0 0 1.5rem;font-size:1.6rem;font-weight:700}.profile h2{margin:2rem 0 .9rem;font-size:1.1rem;font-weight:700}.profile-empty{color:var(--text-dim);font-size:.9rem}.profile-stats-grid{grid-template-columns:repeat(4,1fr);gap:.75rem;display:grid}.profile-stat{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-card);flex-direction:column;align-items:center;gap:.3rem;padding:1rem .5rem;display:flex}.profile-stat strong{font-family:var(--font-display);font-size:1.5rem;font-weight:700}.profile-stat span{color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;text-align:center;font-size:.72rem}.profile-stat--win strong{color:var(--green)}.profile-stat--loss strong{color:var(--red)}.profile-secondary{grid-template-columns:repeat(3,1fr);gap:.75rem;margin-top:.9rem;display:grid}.profile-secondary div{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-card);flex-direction:column;gap:.25rem;padding:.85rem .75rem;display:flex}.profile-secondary span{color:var(--text-dim);font-size:.72rem}.profile-secondary strong{font-family:var(--font-display);font-size:1.1rem}.profile-recent-list{flex-direction:column;gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.profile-recent-item{background:var(--surface);border:1px solid var(--border-soft);border-left:3px solid var(--border);color:inherit;border-radius:10px;justify-content:space-between;align-items:center;gap:.75rem;padding:.7rem .9rem;font-size:.85rem;text-decoration:none;transition:border-color .2s,transform .2s;display:flex}.profile-recent-item:hover{border-color:var(--border);transform:translate(2px)}.profile-recent-item--win{border-left-color:var(--green)}.profile-recent-item--loss{border-left-color:var(--red)}.profile-recent-item--draw{border-left-color:var(--text-faint)}.profile-recent-variant{flex:1;font-weight:600}.profile-recent-vs{color:var(--text-dim);text-align:center;flex:1}.profile-recent-result{text-transform:capitalize;flex-shrink:0;font-weight:700}.profile-recent-item--win .profile-recent-result{color:var(--green)}.profile-recent-item--loss .profile-recent-result{color:var(--red)}.replay{flex-direction:column;flex:1;align-items:center;width:100%;max-width:460px;margin:0 auto;padding:1.5rem 1.25rem 3rem;display:flex}.replay-loading,.replay-error{color:var(--text-dim);margin-top:3rem}.replay-topbar{justify-content:space-between;align-items:center;width:100%;margin-bottom:1rem;display:flex}.replay-copy{color:var(--violet);cursor:pointer;background:0 0;border:none;font-size:.8rem;font-weight:600}.replay-header{text-align:center;margin-bottom:1.25rem}.replay-header h1{margin:0 0 .25rem;font-size:1.5rem;font-weight:700}.replay-subtitle{color:var(--text-dim);margin:0 0 1rem;font-size:.85rem}.replay-players{justify-content:center;align-items:center;gap:1rem;display:flex}.replay-vs{color:var(--text-faint);font-size:.8rem}.replay-board{width:100%}.replay-controls{width:100%;margin-top:1.25rem}.replay-scrubber{width:100%;accent-color:var(--violet)}.replay-move-count{text-align:center;color:var(--text-dim);margin:.4rem 0 1rem;font-size:.8rem}.replay-buttons{justify-content:center;align-items:center;gap:.6rem;display:flex}.replay-btn{padding:.6rem .9rem}.placeholder{text-align:center;flex:1;width:100%;max-width:600px;margin:0 auto;padding:4rem 1.5rem}.placeholder h1{margin:0 0 .75rem;font-size:1.6rem;font-weight:700}.placeholder p{color:var(--text-dim);line-height:1.5}