@property --otie-x{syntax:"<angle>";inherits:false;initial-value:0deg}@property --otie-y{syntax:"<angle>";inherits:false;initial-value:0deg}@property --otie-z{syntax:"<angle>";inherits:false;initial-value:0deg}@property --otie-scale{syntax:"<number>";inherits:false;initial-value:1}.otie-acting{transition:none!important}.otie-move{animation:.48s ease-out otieMove}@keyframes otieMove{35%{--otie-x:-8deg;--otie-y:3deg}}.otie-capture{animation:.64s cubic-bezier(.3,.9,.25,1) otieCapture}@keyframes otieCapture{0%{--otie-scale:1;--otie-x:0deg}18%{--otie-scale:1.1;--otie-x:-11deg;color:#ff7847}34%{--otie-scale:.85;--otie-x:14deg}50%{--otie-scale:1.04;--otie-x:-3deg}66%{--otie-scale:.95;--otie-x:5deg;color:#ff7847}to{--otie-scale:1;--otie-x:0deg}}.otie-castle{animation:.9s cubic-bezier(.45,0,.2,1) otieCastle}@keyframes otieCastle{0%{--otie-y:0deg}50%{color:#4fa3ff}to{--otie-y:360deg}}.otie-check{animation:.65s ease-in-out otieCheck}@keyframes otieCheck{15%{--otie-z:10deg;color:#ffb020}35%{--otie-z:-10deg;color:#ffb020}55%{--otie-z:7deg;color:#ffb020}75%{--otie-z:-3deg}}.otie-promote{animation:.95s cubic-bezier(.34,1.56,.64,1) otiePromote}@keyframes otiePromote{0%{--otie-scale:1;--otie-x:0deg}20%{--otie-scale:.92}55%{--otie-scale:1.14;--otie-x:-10deg;color:#ffd24a}78%{color:#ffd24a}to{--otie-scale:1;--otie-x:0deg}}.otie-checkmate{animation:1s cubic-bezier(.2,.9,.25,1) otieCheckmate}@keyframes otieCheckmate{0%{--otie-x:0deg;--otie-z:0deg}22%{--otie-x:-20deg;color:#ff5d3a}40%{--otie-x:-20deg;--otie-z:0deg}to{--otie-x:0deg;--otie-z:360deg;color:#ffd24a}}.otie-victory{animation:1.6s ease-in-out otieVictory,1.6s step-end otieVictoryFlag}@keyframes otieVictory{0%{--otie-z:0deg}14%{--otie-z:17deg}28%{--otie-z:-17deg}42%{--otie-z:13deg}56%{--otie-z:-13deg}70%{--otie-z:9deg}84%{--otie-z:-5deg}to{--otie-z:0deg}}@keyframes otieVictoryFlag{0%,to{color:var(--brand-logo-accent,var(--accent))}16%{color:var(--text-main)}33%{color:var(--brand-logo-accent,var(--accent))}50%{color:var(--text-main)}66%{color:var(--brand-logo-accent,var(--accent))}83%{color:var(--text-main)}}.otie-victory .brand-logo-neutral,.otie-victory .mark-neutral{animation:1.6s step-end otieVictoryFlagNeutral}@keyframes otieVictoryFlagNeutral{0%,to{fill:var(--text-main)}16%{fill:var(--brand-logo-accent,var(--accent))}33%{fill:var(--text-main)}50%{fill:var(--brand-logo-accent,var(--accent))}66%{fill:var(--text-main)}83%{fill:var(--brand-logo-accent,var(--accent))}}.otie-defeat{animation:2.4s ease-in-out otieDefeat}@keyframes otieDefeat{22%{--otie-x:-34deg;--otie-z:-7deg;--otie-scale:.9;color:#8d8d94}68%{--otie-x:-34deg;--otie-z:-7deg;--otie-scale:.9;color:#8d8d94}}.otie-defeat .brand-logo-neutral,.otie-defeat .mark-neutral{animation:2.4s ease-in-out otieNeutralDrain}@keyframes otieNeutralDrain{22%{fill:#6e6e76}68%{fill:#6e6e76}}.otie-draw{animation:1.2s ease-in-out otieDraw}@keyframes otieDraw{22%{--otie-y:15deg}52%{--otie-y:-15deg}78%{--otie-y:6deg}}.otie-enpassant{animation:.82s ease-in-out otieEnPassant}@keyframes otieEnPassant{0%{--otie-y:0deg;--otie-z:0deg}20%{--otie-y:32deg}38%{--otie-y:27deg;--otie-z:-7deg;color:#ff7847}60%{--otie-y:-16deg;--otie-z:5deg}80%{--otie-y:7deg}to{--otie-y:0deg;--otie-z:0deg}}@media (prefers-reduced-motion:reduce){.otie-move,.otie-capture,.otie-castle,.otie-check,.otie-enpassant{animation:none}.otie-promote,.otie-checkmate,.otie-victory,.otie-draw{animation:.9s ease-in-out otieQuietPulse}.otie-defeat{animation:1.4s ease-in-out otieQuietDim}.otie-defeat .brand-logo-neutral,.otie-defeat .mark-neutral,.otie-victory .brand-logo-neutral,.otie-victory .mark-neutral{animation:none}}@keyframes otieQuietPulse{50%{color:#ffd24a}}@keyframes otieQuietDim{50%{color:#8d8d94}}@property --glow{syntax:"<number>";inherits:true;initial-value:0}:root{--accent:#8fbf5a;--accent-text:#8fbf5a;--panel-accent-text:#8fbf5a;--accent-glow:#8fbf5a66;--accent-faded:#8fbf5a14;--accent-border:#8fbf5a38;--shadow-soft:#40562947;--shadow-medium:#4056296b;--shadow-deep:#4056299e;--viewfinder-bg-start:#1f1e19;--viewfinder-bg-end:#100f0c;--viewfinder-grid-light:#2b2a25;--viewfinder-grid-dark:#151410;--viewfinder-grid-opacity:.5;--viewfinder-border:#ffffff1a;--viewfinder-corner:#ffffff59;--viewfinder-label:#aaa49a;--viewfinder-scan-shadow:0 0 14px #8fbf5ab8;--on-accent:#11110e;--brand-logo-pointer-x:0deg;--brand-logo-pointer-y:0deg;--brand-logo-spin:0deg;--bg-core:#0a0908;--bg-raised:#1b1a18;--bg-gradient:radial-gradient(1200px 640px at 50% -12%, #17160f 0%, #0a0908 60%) fixed, #0a0908;--text-main:#f2efe8;--text-muted:#aaa49a;--text-dim:#918a7e;--panel-text-main:#f2efe8;--panel-text-muted:#aaa49a;--panel-text-dim:#918a7e;--surface-soft:#161512;--surface-hover:#211f1b;--surface-border:#ffffff24;--panel-surface-soft:#24231f;--panel-surface-hover:#2f2d28;--panel-surface-border:#ffffff29;--panel-solid:#181712;--panel-soft:#181712c7;--panel-bg:linear-gradient(180deg, #181712, #0f0e0b);--panel-border:#ffffff14;--board-light:#e9e2cf;--board-dark:#7d9455;--board-highlight:#8fbf5a6b;--on-board-light:#000;--on-board-dark:#000;--danger-text:#e08479;--danger-bg:#d7544814;--danger-border:#d7544866;--warn-text:#dfa32e;--warn-bg:#dfa32e14;--warn-border:#dfa32e66}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:var(--bg-gradient);color:var(--text-main);-webkit-font-smoothing:antialiased;flex-direction:column;justify-content:flex-start;align-items:center;padding:0;font-family:Figtree,sans-serif;display:flex}:where(.app-dialog,.modal,.sound-menu,.connect-action-box,.pair-qr-card,#lobby-time-panel,.lobby-col-right .lobby-content,.analysis-study-column,.analysis-tool-card,.theme-preview-panel,.status-toast){--text-main:var(--panel-text-main);--text-muted:var(--panel-text-muted);--text-dim:var(--panel-text-dim);--surface-soft:var(--panel-surface-soft);--surface-hover:var(--panel-surface-hover);--surface-border:var(--panel-surface-border);--accent-text:var(--panel-accent-text);color:var(--text-main)}a{color:inherit;text-decoration:none}a:hover:not(.primary):not(.secondary-action):not(.lobby-ghost):not(.small){color:var(--accent-text)}::-webkit-scrollbar{width:0;height:0}input,button,select{font-family:inherit}.app-header{z-index:100;justify-content:space-between;align-items:center;padding:12px 14px;display:flex;position:relative}.app-dialog-backdrop{z-index:160;background:color-mix(in srgb, var(--bg-core) 75%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);overscroll-behavior:contain;justify-content:center;align-items:center;padding:24px;animation:.14s ease-out both app-dialog-fade-in;display:flex;position:fixed;inset:0}.app-dialog{border:1px solid var(--surface-border);background:url("data:image/svg+xml;utf8,<svg viewBox=\"0 0 200 200\" xmlns=\"http://www.w3.org/2000/svg\"><filter id=\"noiseFilter\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.8\" numOctaves=\"3\" stitchTiles=\"stitch\"/></filter><rect width=\"100%\" height=\"100%\" filter=\"url(%23noiseFilter)\" opacity=\"0.04\"/></svg>"), linear-gradient(180deg, color-mix(in srgb, var(--panel-solid) 85%, transparent), #000000b3);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);width:min(100%,420px);box-shadow:inset 0 1px 1px #ffffff1f, 0 30px 80px var(--shadow-deep);border-radius:20px;padding:26px;animation:.18s cubic-bezier(.2,.8,.2,1) both app-dialog-rise-in}.app-dialog h2{color:var(--text-main);margin:0;font-size:21px;line-height:1.2}.app-dialog p{color:var(--text-muted);white-space:pre-line;margin:12px 0 22px;font-size:14px;line-height:1.55}#page-footer{display:none}body:has(#screen-connect.active) #page-footer{display:block}.app-dialog-actions{justify-content:flex-end;gap:10px;display:flex}.app-dialog-actions button{min-width:104px}@keyframes app-dialog-fade-in{0%{opacity:0}}@keyframes app-dialog-rise-in{0%{opacity:0;transform:translateY(8px)scale(.985)}}@media (prefers-reduced-motion:reduce){.app-dialog-backdrop,.app-dialog{animation:none}}@media (width<=520px){.app-dialog-backdrop{align-items:flex-end;padding:0}.app-dialog{width:100%;padding:24px 20px max(20px, env(safe-area-inset-bottom));border-radius:22px 22px 0 0}.app-dialog-actions{flex-direction:column-reverse}.app-dialog-actions button{width:100%;min-height:48px}}input:focus{outline:none}:where(button,input,select,a,[tabindex]):focus-visible{outline:2px solid var(--accent);outline-offset:3px}:where(input,select):focus-visible{box-shadow:0 0 0 4px var(--accent-faded);border-color:var(--accent)!important}button{transition:transform 60ms,filter .15s}button:active{transform:scale(.985)}button:hover{filter:brightness(1.15)}button:disabled{opacity:.5;filter:none;pointer-events:none}.field-error{color:var(--danger-text);margin-top:10px;font-size:12.5px;line-height:1.45;display:none}.field-error.visible{display:block}.secondary-action{--pointer-x:50%;--pointer-y:50%;--glow:0;min-height:44px;transition:--glow .3s,background-color .18s,border-color .18s,color .18s,transform 60ms;border-color:var(--surface-border)!important;background-color:var(--surface-soft)!important;background-image:radial-gradient(circle 80px at var(--pointer-x) var(--pointer-y), color-mix(in srgb, var(--surface-glow-tint,var(--text-main)) calc(12% * var(--glow)), transparent), transparent)!important}.secondary-action:hover{--glow:1;background-color:var(--surface-hover)!important;color:var(--text-main)!important;border-color:#8fbf5a5c!important}.mono{font-family:Space Mono,monospace}.brand-logo{perspective:77px;perspective-origin:50%;width:32px;height:32px;filter:drop-shadow(0 3px 3px var(--shadow-medium));-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:manipulation;outline:none;flex:none;place-items:center;transition:filter .32s;display:grid}.brand-logo:focus,.brand-logo:active,.brand-logo:focus-visible{box-shadow:none;-webkit-tap-highlight-color:transparent;outline:none}.brand-logo-plane{--brand-logo-hover-x:0deg;--brand-logo-hover-y:0deg;width:27px;height:27px;color:var(--brand-logo-accent,var(--accent));transform-origin:50%;transform:rotateX(42.28deg) rotateX(var(--brand-logo-pointer-x)) rotateX(var(--brand-logo-hover-x)) rotateX(var(--otie-x,0deg)) rotateY(-27.67deg) rotateY(var(--brand-logo-pointer-y)) rotateY(var(--brand-logo-hover-y)) rotateY(var(--otie-y,0deg)) rotateZ(18.81deg) rotateZ(var(--brand-logo-spin)) rotateZ(var(--otie-z,0deg)) scale(var(--otie-scale,1));outline:1px solid #0000;transition:transform .8s cubic-bezier(.16,1,.3,1);display:block;overflow:visible}.brand-logo-plane.is-spinning{transition:none}.brand-logo-plane.is-spinning,.brand-logo-plane.otie-acting{will-change:transform}.brand-logo-neutral{fill:var(--text-main)}.brand-logo-accent{fill:currentColor}.brand-logo:hover,.brand-logo:active{filter:drop-shadow(-2px 6px 5px var(--shadow-medium))}@media (hover:hover){.brand-logo:hover .brand-logo-plane{--brand-logo-hover-x:-9deg;--brand-logo-hover-y:18deg}}.brand-logo:active .brand-logo-plane{--brand-logo-hover-x:-9deg;--brand-logo-hover-y:18deg}@media (prefers-reduced-motion:reduce){.brand-logo{transition:none}.brand-logo-plane{will-change:auto;transition:none}@media (hover:hover){.brand-logo:hover{filter:drop-shadow(0 3px 3px var(--shadow-medium))}.brand-logo:hover .brand-logo-plane{--brand-logo-hover-x:0deg;--brand-logo-hover-y:0deg}}}@keyframes cvScreenIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes cvScan{0%{opacity:0;transform:translateY(11px)}15%{opacity:1}85%{opacity:1}to{opacity:0;transform:translateY(169px)}}@keyframes cvBlink{50%{opacity:.25}}@keyframes cvPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.55)}}@keyframes cvGuide{50%{opacity:.35;filter:brightness(1.3)}}@keyframes cvFloat{50%{transform:translateY(-5px)}}.connect-viewfinder{border:1px solid var(--viewfinder-border);background:linear-gradient(150deg, var(--viewfinder-bg-start), var(--viewfinder-bg-end));border-radius:20px;justify-content:center;align-items:center;height:180px;margin-bottom:22px;display:flex;position:relative;overflow:hidden}.connect-viewfinder-board{background:conic-gradient(var(--viewfinder-grid-light) 90deg, var(--viewfinder-grid-dark) 0 180deg, var(--viewfinder-grid-light) 0 270deg, var(--viewfinder-grid-dark) 0) 0 0 / 56px 56px;opacity:var(--viewfinder-grid-opacity);transform-origin:50% 70%;position:absolute;inset:0;transform:perspective(420px)rotateX(46deg)scale(1.28)translateY(2px)}.connect-viewfinder-scan{background:linear-gradient(90deg, transparent, var(--accent), transparent);height:2px;box-shadow:var(--viewfinder-scan-shadow);animation:3.4s ease-in-out infinite cvScan;position:absolute;top:0;left:0;right:0}.connect-viewfinder-corner{border-color:var(--viewfinder-corner);border-style:solid;width:20px;height:20px;position:absolute}.connect-viewfinder-corner.top-left{border-width:2px 0 0 2px;top:14px;left:14px}.connect-viewfinder-corner.top-right{border-width:2px 2px 0 0;top:14px;right:14px}.connect-viewfinder-corner.bottom-left{border-width:0 0 2px 2px;bottom:14px;left:14px}.connect-viewfinder-corner.bottom-right{border-width:0 2px 2px 0;bottom:14px;right:14px}.connect-viewfinder-live{color:var(--viewfinder-label);letter-spacing:1.5px;align-items:center;gap:6px;font-family:Space Mono,monospace;font-size:10px;display:flex;position:absolute;top:14px;left:44px}.connect-viewfinder-live i{background:#d75448;border-radius:50%;width:7px;height:7px;animation:1.4s step-end infinite cvBlink;display:inline-block}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}#app-wrap{flex-direction:column;width:100%;display:flex;position:relative;overflow:hidden}.modal-backdrop{z-index:40;background:color-mix(in srgb, var(--bg-core) 70%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);justify-content:center;align-items:center;padding:26px;animation:.2s both cvScreenIn;display:none;position:fixed;inset:0}.modal-backdrop.open{display:flex}@media (width<=520px){.modal-backdrop{align-items:flex-end;padding:0}.modal-backdrop>.modal{max-width:none;padding-bottom:max(22px, env(safe-area-inset-bottom));border-radius:22px 22px 0 0}#screen-game .grid-cols-2 button,#screen-game #btn-report-wrong,#screen-analysis button{min-height:48px}}.screen{display:none}.screen.active{animation:.34s cubic-bezier(.2,.7,.2,1) both cvScreenIn;display:flex}.status-toast{z-index:45;box-shadow:0 10px 30px var(--shadow-medium);white-space:nowrap;background:#14130ff5;border:1px solid #ffffff24;border-radius:999px;padding:12px 20px;font-size:13.5px;font-weight:500;animation:.25s both cvScreenIn;display:none;position:fixed;bottom:26px;left:50%;transform:translate(-50%)}.sq.hl:before{content:"";z-index:5;background:#9bc70069;position:absolute;inset:0}.sq.selected:before{content:"";z-index:6;background:#ebb93e4d;border:3px solid #ebb93ecc;position:absolute;inset:0}.sq.legal-dst:not(:has(.piece)):after{content:"";z-index:10;pointer-events:none;background:#00000040;border-radius:50%;position:absolute;inset:35%}.sq.legal-dst:has(.piece):after{content:"";z-index:10;pointer-events:none;box-sizing:border-box;border:4px solid #00000040;border-radius:50%;position:absolute;inset:4%}.sq.guide-from:before{content:"";z-index:5;background:#ebb93e40;position:absolute;inset:0}.sq.guide-to:after{content:"";z-index:10;border:2.5px dashed #ebb93ee6;border-radius:50%;animation:1.2s ease-in-out infinite cvGuide;position:absolute;inset:16%}.coord{opacity:.6;z-index:15;pointer-events:none;font-family:Space Mono,monospace;font-size:10px;font-weight:500;position:absolute}.theme-presets{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.theme-preset-button{--pointer-x:50%;--pointer-y:50%;--glow:0;background-color:color-mix(in srgb, var(--text-main) 2.5%, transparent);background-image:radial-gradient(circle 60px at var(--pointer-x) var(--pointer-y), color-mix(in srgb, var(--surface-glow-tint,var(--text-main)) calc(8% * var(--glow)), transparent), transparent);place-items:center;gap:5px;min-width:0;padding:8px 6px 7px;transition:--glow .3s,border-color .2s,background-color .2s;display:grid}.theme-preset-button:hover{--glow:1;border-color:var(--accent-border);background-color:color-mix(in srgb, var(--text-main) 6%, transparent)}.theme-preset-button.selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent);background-color:var(--accent-faded)}.theme-preset-swatch{border:1px solid var(--surface-border);width:48px;height:48px;box-shadow:0 5px 12px var(--shadow-soft);border-radius:9px;grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(2,1fr);display:grid;overflow:hidden}.theme-preset-swatch i.light{background:var(--swatch-light)}.theme-preset-swatch i.dark{background:var(--swatch-dark)}.theme-preset-label{max-width:100%;color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;font-size:11px;line-height:1.1;overflow:hidden}.theme-preset-button.selected .theme-preset-label{color:var(--text-main)}.theme-customize-button{width:100%;min-height:38px}.theme-customize-button.selected{color:var(--accent-text);border-color:var(--accent-border);background:var(--accent-faded)}.theme-menu-divider{background:var(--surface-border);height:1px;margin:2px 0}.modal.theme-editor{text-align:left;max-width:580px}.theme-editor h3{margin-bottom:6px}.theme-editor-intro{color:var(--text-muted);margin:0 0 18px;font-size:13px;line-height:1.5}.theme-editor-layout{grid-template-columns:210px minmax(0,1fr);align-items:start;gap:20px;display:grid}.theme-preview{background:var(--bg-gradient);border:1px solid var(--surface-border);width:210px;min-height:250px;box-shadow:0 18px 40px -16px var(--shadow-medium);border-radius:14px;align-items:center;padding:14px;display:flex;overflow:hidden}.theme-preview-panel{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:11px;gap:10px;width:100%;padding:12px;display:grid}.theme-preview-brand{color:var(--text-main);align-items:center;gap:6px;font-size:11px;font-weight:800;display:flex}.theme-preview-brand span{background:var(--accent);width:7px;height:7px;box-shadow:0 0 8px var(--accent-glow);border-radius:50%}.theme-preview-board{aspect-ratio:1;border:1px solid color-mix(in srgb, var(--text-main) 42%, transparent);border-radius:8px;grid-template-columns:repeat(4,1fr);width:100%;display:grid;overflow:hidden}.theme-preview-square{place-items:center;display:grid}.theme-preview-square.light{background:var(--board-light)}.theme-preview-square.dark{background:var(--board-dark)}.theme-preview-square i{width:88%;height:88%;display:block}.theme-preview-square svg{width:100%;height:100%;display:block}.theme-preview-action{background:var(--accent);color:var(--on-accent);text-align:center;border-radius:7px;padding:7px 8px;font-size:10px;font-weight:800}.theme-fields{grid-template-columns:1fr 1fr;gap:12px;display:grid}.theme-field{color:var(--text-muted);gap:6px;font-size:12px;display:grid}.theme-field input[type=color]{cursor:pointer;min-height:44px;padding:5px}.theme-contrast-note{border:1px solid var(--surface-border);border-left:3px solid var(--accent);background:var(--surface-soft);min-height:34px;color:var(--text-main);border-radius:8px;margin:14px 0 0;padding:9px 10px;font-size:12px;line-height:1.4}.theme-contrast-note.ok{color:var(--text-muted)}.theme-editor-actions{justify-content:flex-end;gap:8px;margin-top:16px;display:flex}.theme-editor-actions button{min-height:44px;padding:11px 14px}.theme-editor-actions .primary{color:var(--on-accent)}@media (width<=560px){.modal.theme-editor{max-width:none}.theme-editor-layout{grid-template-columns:1fr}.theme-preview{width:min(72vw,230px);min-height:0;margin:0 auto}.theme-editor-actions{grid-template-columns:1fr 1fr;display:grid}.theme-editor-actions #btn-theme-save{grid-area:1/1/auto/-1}}.desktop-only{display:none!important}.mobile-only{display:flex}#app-wrap{height:100dvh}.mobile-status-bar{letter-spacing:.5px;flex:none;justify-content:space-between;align-items:center;height:46px;padding:0 30px 0 32px;font-size:13px;font-weight:600;display:flex}.app-header{flex:none;justify-content:space-between;align-items:center;padding:6px 20px 12px;display:flex}.screen{flex-direction:column;flex:1;padding:8px 22px 26px;position:relative;overflow-y:auto}.grid-cols-2{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.grid-cols-3{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.grid-cols-4{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.lobby-tabs{background:var(--surface-soft);border:1px solid var(--surface-border);border-radius:14px;gap:5px;margin-bottom:24px;padding:5px;display:flex}.lobby-tabs button{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:10px;flex:1;padding:10px;font-size:14px;font-weight:500;transition:all .2s}.lobby-tabs button.active{background:var(--surface-hover);color:var(--text-main);font-weight:600}.tc-grid{grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px;display:grid}.tc-grid button{--pointer-x:50%;--pointer-y:50%;--glow:0;font-variant-numeric:tabular-nums;border:1px solid var(--surface-border);background-color:var(--surface-soft);background-image:radial-gradient(circle 70px at var(--pointer-x) var(--pointer-y), color-mix(in srgb, var(--surface-glow-tint,var(--text-main)) calc(8% * var(--glow)), transparent), transparent);color:var(--text-main);cursor:pointer;border-radius:14px;justify-items:center;gap:3px;padding:14px 10px 12px;font-family:Space Mono,monospace;font-size:15px;font-weight:700;transition:--glow .3s,border-color .18s,background-color .18s,transform .1s,box-shadow .18s;display:grid}.tc-grid button:hover{--glow:1;border-color:var(--accent-border);background-color:var(--surface-hover)}.tc-grid button:active{transform:scale(.985)}.tc-grid button[data-speed]:after{content:attr(data-speed);letter-spacing:.18em;text-transform:uppercase;color:var(--text-dim);font-size:9.5px;font-weight:700}.tc-grid button.selected{background-color:var(--accent);background-image:radial-gradient(circle 70px at var(--pointer-x) var(--pointer-y), color-mix(in srgb, #fff calc(15% * var(--glow)), transparent), transparent);color:var(--on-accent);border-color:var(--accent);box-shadow:0 8px 22px -8px var(--accent);z-index:1;position:relative}.tc-grid button.selected[data-speed]:after{color:var(--on-accent);opacity:.75}.toggle-checkbox{opacity:0;pointer-events:none;position:absolute}.toggle-checkbox:focus-visible+.toggle-track{outline:2px solid var(--accent);outline-offset:3px}.toggle-label{cursor:pointer;justify-content:space-between;align-items:center;padding:2px;display:flex}.toggle-track{background:color-mix(in srgb, var(--text-main) 10%, transparent);box-sizing:border-box;border-radius:12px;align-items:center;width:40px;height:24px;padding:2px;transition:all .2s;display:flex;position:relative}.toggle-knob{width:20px;height:20px;box-shadow:0 2px 5px var(--shadow-soft);background:#f2efe8;border-radius:50%;transition:transform .2s cubic-bezier(.2,.7,.2,1);display:block}.toggle-checkbox:checked+.toggle-track{background:var(--accent)}.toggle-checkbox:checked+.toggle-track .toggle-knob{transform:translate(16px)}.primary{--pointer-x:50%;--pointer-y:50%;--glow:0;background-color:var(--accent);background-image:radial-gradient(circle 100px at var(--pointer-x) var(--pointer-y), color-mix(in srgb, #fff calc(15% * var(--glow)), transparent), transparent);color:var(--on-accent);cursor:pointer;box-shadow:0 10px 30px -10px var(--accent);border:none;border-radius:15px;padding:16px;font-size:16px;font-weight:700;transition:--glow .3s,transform 60ms,filter .15s}.primary:hover{--glow:1;filter:brightness(1.15)}.tablet-broadcast-action.primary{background-color:var(--surface-soft);color:var(--accent);border:1px solid color-mix(in srgb, var(--accent) 45%, transparent);box-shadow:none;background-image:radial-gradient(circle 100px at var(--pointer-x) var(--pointer-y), color-mix(in srgb, var(--surface-glow-tint,var(--text-main)) calc(12% * var(--glow)), transparent), transparent)}.tablet-broadcast-action.primary:hover{background-color:var(--surface-hover);border-color:color-mix(in srgb, var(--accent) 75%, transparent);filter:none}.danger{background:var(--danger-bg);border:none;border:1px solid var(--danger-border);color:var(--danger-text);cursor:pointer;border-radius:15px;padding:16px;font-size:16px;font-weight:700}.small{border-radius:12px;padding:11px;font-size:12.5px}input[type=text],select{border:1px solid var(--surface-border);background:var(--surface-soft);width:100%;color:var(--text-main);border-radius:13px;padding:13px 15px;font-size:14px}select{appearance:none}@media (width>=850px){.desktop-only{display:flex!important}.mobile-only{display:none!important}body{padding:30px 16px 120px}.app-header{border-bottom:1px solid color-mix(in srgb, var(--text-main) 5%, transparent);padding:14px 28px}#app-wrap{background:var(--bg-core);border:1px solid var(--surface-border);width:1120px;max-width:calc(100vw - 40px);height:auto;min-height:640px;box-shadow:0 60px 120px -30px var(--shadow-deep);border-radius:16px;flex-shrink:0;overflow:visible}.screen{padding:0;position:relative;overflow:visible}}#qr-svg svg,#pair-qr svg{width:100%;height:auto;display:block}#calib-overlay{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}#calib-overlay:active{cursor:grabbing}#calib-overlay text{-webkit-user-select:none;user-select:none}#calib-overlay .grid-line{stroke:#8fbf5ab3;stroke-width:1.2px;fill:none}#calib-overlay .edge{stroke:var(--accent);stroke-width:2.5px;fill:#8fbf5a14}#calib-overlay .handle{fill:var(--accent);stroke:#fff;stroke-width:2px}#calib-overlay .handle-hit{fill:#0000}.calibration-expand{z-index:6;border:1px solid var(--surface-border);background:color-mix(in srgb, var(--bg-core) 76%, transparent);color:#eee9dd;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:8px 11px;position:absolute;top:10px;right:10px}.calibration-expanded-hint{display:none}#video-wrap.calibration-expanded{z-index:1200;border:1px solid #8fbf5a6b;background:#050504!important;border-radius:16px!important;width:auto!important;max-width:none!important;height:auto!important;max-height:none!important;position:fixed!important;inset:12px!important;box-shadow:0 30px 100px #000000e6!important}#video-wrap.calibration-expanded video{object-fit:contain!important;width:100%!important;max-width:none!important;height:100%!important;max-height:none!important}#video-wrap.calibration-expanded .calibration-expand{color:var(--accent);border-color:#8fbf5a8c}#video-wrap.calibration-expanded .calibration-expanded-hint{z-index:6;background:color-mix(in srgb, var(--bg-core) 74%, transparent);color:#c9c3b6;text-align:center;white-space:nowrap;pointer-events:none;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:9px;max-width:calc(100% - 32px);padding:7px 11px;font-size:10px;display:block;position:absolute;bottom:12px;left:50%;transform:translate(-50%)}body.calibration-focus{overflow:hidden}@media (width<=600px){#video-wrap.calibration-expanded{inset:6px!important}#video-wrap.calibration-expanded .calibration-expanded-hint{white-space:normal}}#screen-analysis{padding:20px 22px 44px}.analysis-shell{flex-direction:column;gap:18px;width:min(100%,1240px);margin:0 auto;display:flex}.analysis-header,.analysis-heading,.analysis-header-actions{align-items:center;display:flex}.analysis-header{justify-content:space-between;gap:18px}.analysis-heading{flex-wrap:wrap;gap:15px}.analysis-kicker{color:var(--accent-text);letter-spacing:2.4px;text-transform:uppercase;font-size:12px}.analysis-subtitle{color:var(--text-dim);margin-top:3px;font-size:12px}.analysis-turn{border:1px solid var(--surface-border);background:color-mix(in srgb, var(--text-main) 4%, transparent);border-radius:999px;gap:8px;padding:8px 13px;font-size:13px;font-weight:600}.analysis-turn i{background:#e9e2cf;border-radius:50%;width:10px;height:10px}.analysis-header-actions{flex-wrap:wrap;gap:13px}.analysis-toggle{color:var(--text-muted);cursor:pointer;align-items:center;gap:8px;font-size:13px;display:flex}.analysis-toggle input{width:auto;margin:0}.analysis-toggle-track{border-radius:10px;flex:none;width:34px;height:20px}.analysis-toggle-track .toggle-knob{width:16px;height:16px}.toggle-checkbox:checked+.analysis-toggle-track .toggle-knob{transform:translate(14px)}.analysis-header-actions .danger{padding:9px 14px}.analysis-status{margin:0}.analysis-main{grid-template-columns:minmax(360px,520px) minmax(320px,1fr);align-items:start;gap:22px;display:grid}.analysis-board-column{flex-direction:column;gap:10px;min-width:0;display:flex}.analysis-transport{grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;width:100%;max-width:512px;margin:0 auto;display:grid}.analysis-transport[hidden],.analysis-variation-tools[hidden],.analysis-variation-line[hidden]{display:none}.analysis-transport span{text-align:center;min-width:78px;color:var(--text-muted);font-size:11px}.analysis-variation-tools{gap:8px;width:100%;max-width:512px;margin:0 auto;display:flex}.analysis-variation-line{background:var(--accent-faded);width:100%;max-width:512px;color:var(--accent);border-radius:10px;margin:0 auto;padding:10px 12px;font-size:11px;line-height:1.5}.analysis-study-column{border:1px solid var(--panel-border);background:var(--panel-bg);border-radius:18px;flex-direction:column;gap:12px;min-width:0;min-height:100%;padding:18px;display:flex}.analysis-section-heading,.analysis-review-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.analysis-section-heading>div,.analysis-review-head>div,.analysis-tool-title{flex-direction:column;gap:3px;display:flex}.analysis-section-heading strong,.analysis-review-head strong,.analysis-tool-title strong{color:var(--text-main);font-size:13px}.analysis-section-heading span,.analysis-review-head span,.analysis-tool-title span{color:var(--text-dim);font-size:11px}.analysis-engine-line{border:1px solid var(--accent-border);background:var(--accent-faded);color:var(--accent);border-radius:11px;padding:11px 13px;font-size:11.5px;line-height:1.6}.analysis-moves{border:1px solid var(--surface-border);background:var(--surface-soft);min-height:250px;max-height:370px;color:var(--text-muted);border-radius:14px;padding:16px;font-family:Space Mono,monospace;font-size:13.5px;line-height:2;overflow:auto}.analysis-game-review{border-top:1px solid var(--surface-border);padding-top:12px}.analysis-game-review[hidden],.analysis-engine-line[hidden]{display:none}.analysis-review-head{margin-bottom:10px}#ana-eval-graph{width:100%;height:130px;display:block;overflow:visible}.analysis-tool-dock{grid-template-columns:minmax(280px,1.15fr) minmax(250px,.85fr) minmax(250px,1fr);align-items:start;gap:12px;display:grid}.analysis-tool-card{border:1px solid var(--panel-border);background:var(--panel-bg);border-radius:15px;flex-direction:column;gap:11px;min-width:0;padding:15px;display:flex}.analysis-source-actions{grid-template-columns:1fr 1fr;gap:8px;display:grid}.analysis-import-panel{border-top:1px solid var(--surface-border);padding-top:9px}.analysis-import-panel summary{color:var(--text-muted);cursor:pointer;font-size:12px;font-weight:600}.analysis-import-body{gap:8px;margin-top:9px;display:grid}.analysis-import-body textarea{resize:vertical;width:100%;font-size:12px;line-height:1.5}.analysis-import-body button{justify-self:end}.analysis-fen-row{gap:8px;margin-top:9px;display:flex}.analysis-fen-row input{flex:1;min-width:0;font-size:11px}.analysis-import-panel p{color:var(--text-muted);margin:8px 0 0;font-size:11px;line-height:1.45}.analysis-board-actions{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.analysis-report-wrong{border-color:var(--danger-border);background:var(--danger-bg);color:var(--danger-text);justify-content:center;align-items:center;gap:6px;font-size:11.5px;font-weight:600;display:inline-flex}.analysis-pi-strip{border:1px solid var(--surface-border);background:color-mix(in srgb, var(--text-main) 8%, transparent);border-radius:11px;align-items:center;gap:9px;padding:9px 10px;display:flex}#ana-pi-pips{flex:none;align-items:center;display:inline-flex}#ana-pi-read{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:11px;overflow:hidden}#ana-pi-expand{flex:none;padding:6px 9px;font-family:Space Mono,monospace;font-size:10.5px}@media (width<=1040px){.analysis-main{grid-template-columns:minmax(330px,470px) minmax(300px,1fr);gap:16px}.analysis-tool-dock{grid-template-columns:1fr 1fr}.analysis-tracking-card{grid-column:1/-1}}@media (width<=699px),(width<=849px) and (height<=560px){#screen-analysis{padding:16px 14px 42px}.analysis-header{flex-direction:column;align-items:flex-start}.analysis-header-actions{width:100%}.analysis-header-actions .danger{margin-left:auto}.analysis-main{flex-direction:column;display:flex}.analysis-board-column,.analysis-study-column{width:100%}.analysis-tool-dock{flex-direction:column;display:flex}.analysis-tool-card{width:100%}.analysis-moves{min-height:180px;max-height:300px}}@media (width>=700px) and (height>=700px) and (width<=849.98px){#screen-analysis .analysis-main{align-items:center}}@media (width<=480px){.analysis-subtitle{display:none}.analysis-heading{flex-direction:column;align-items:flex-start;gap:9px}.analysis-source-actions,.analysis-board-actions{grid-template-columns:1fr}}.sq.evt-pop .piece{animation:.4s cubic-bezier(.2,.85,.3,1.2) bPop}@keyframes bPop{0%{transform:scale(.55)}to{transform:scale(1)}}.sq.evt-burst:before{content:"";box-shadow:inset 0 0 0 6px var(--accent);pointer-events:none;border-radius:50%;animation:.55s ease-out forwards bBurst;position:absolute;inset:0}@keyframes bBurst{0%{opacity:.95;transform:scale(.4)}to{opacity:0;transform:scale(1.5)}}.sq.evt-check .piece{animation:.9s ease-out 2 bCheck}.sq.evt-mate .piece{filter:drop-shadow(0 0 12px var(--live-red));animation:1.1s ease-in-out infinite bCheck}@keyframes bCheck{0%,to{opacity:.35}50%{opacity:1}}#game-result .result-card{animation:.7s cubic-bezier(.2,.85,.3,1.15) both bResultIn}@keyframes bResultIn{0%{opacity:0;transform:translateY(-40%)scale(.85)}to{opacity:1;transform:none}}
