:root{--bg: oklch(.13 .025 158);--panel: oklch(.155 .028 157 / 91%);--panel-2: oklch(.1 .02 157 / 94%);--line: oklch(.45 .055 95 / 35%);--text: oklch(.93 .025 82);--muted: oklch(.7 .025 145);--gold: oklch(.72 .105 78);--soft-gold: oklch(.82 .075 82);--red: #d64545;--blue: #3d8fd1;--ok: #3cb89a;--cream: #ebe2cf;--black-bead: #241812;--board-frame-max-h: 820px;--body-pad-v: 16px;--shell-pad-v: 16px;--main-gap: 6px;--controls-h: 38px;--left-column-width: 260px;--right-column-width: 260px;--stack-chrome: calc(var(--controls-h) + var(--main-gap));--ad-column-width: 260px}*{box-sizing:border-box;margin:0;padding:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}body{height:100dvh;min-height:100dvh;max-height:100dvh;font-family:IBM Plex Sans,Segoe UI,system-ui,sans-serif;background:var(--bg);color:var(--text);padding:8px 12px;display:flex;justify-content:center;align-items:center;overflow:hidden}body.hub-page{padding:0;margin:0;align-items:stretch;justify-content:stretch;background:#100f0d;overflow:hidden;transition:background .2s ease}.shell{width:100%;max-width:calc(var(--left-column-width) + var(--frame-w) + var(--right-column-width) + var(--ad-column-width) + 36px);max-height:calc(100dvh - var(--body-pad-v));margin:0 auto;display:grid;grid-template-columns:minmax(200px,var(--left-column-width)) auto minmax(200px,var(--right-column-width));gap:12px;align-items:start;justify-content:center;overflow:hidden;--board-aspect: .7353;--shell-gutter-h: 24px;--side-columns-width: calc(var(--left-column-width) + var(--right-column-width) + var(--ad-column-width) + 36px);--board-area-h: calc(100dvh - var(--body-pad-v) - var(--stack-chrome));--board-area-w: max(160px, calc(100vw - var(--side-columns-width) - var(--shell-gutter-h)));--frame-h: min( var(--board-frame-max-h), var(--board-area-h), calc(var(--board-area-w) / var(--board-aspect)) );--frame-w: min(var(--board-area-w), calc(var(--frame-h) * var(--board-aspect)))}.shell.shell--ads-on{grid-template-columns:minmax(200px,var(--left-column-width)) auto minmax(200px,var(--right-column-width)) var(--ad-column-width)}.shell.shell--no-ads{--ad-column-width: 0px;--side-columns-width: calc(var(--left-column-width) + var(--right-column-width) + 36px);max-width:calc(var(--left-column-width) + var(--frame-w) + var(--right-column-width) + 36px)}.shell.shell--no-ads .ad-slot{display:none}.shell.shell--board-16{--board-frame-max-h: 860px;--main-gap: 4px;--controls-h: 34px;--stack-chrome: calc(var(--controls-h) + var(--main-gap))}.play-theme-group-label{margin:6px 0 4px;font-size:.72rem;color:var(--muted);line-height:1.3}.play-theme-swatches{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 8px}.play-theme-swatch{width:44px;height:32px;padding:0;border-radius:8px;border:2px solid rgba(212,168,75,.35);cursor:pointer;box-shadow:inset 0 0 0 1px #00000040}.play-theme-swatch[data-play-theme="1"]{background:linear-gradient(165deg,#02381f,#002213);background:linear-gradient(165deg,#02381f,color(xyz 0.006 0.012 0.007))}.play-theme-swatch[data-play-theme="2"]{background:linear-gradient(165deg,#613b14,#442000)}.play-theme-swatch[data-play-theme="3"]{background:linear-gradient(165deg,#003f4e,#00212d);background:linear-gradient(165deg,color(xyz 0.031 0.041 0.084),color(xyz 0.01 0.013 0.03))}.play-theme-swatch[data-play-theme="6"]{background:linear-gradient(165deg,#2c163a,#150722)}.play-theme-swatch[data-play-theme="14"]{background:linear-gradient(165deg,#946646,#6b4127)}.play-theme-swatch[data-play-theme="23"]{background:linear-gradient(165deg,#9dc7c7,#74a2a3)}.play-theme-swatch[data-play-theme="24"]{background:linear-gradient(165deg,#cabed9,#a598b5)}.play-theme-swatch[data-play-theme="25"]{background:linear-gradient(165deg,#a5cfbf,#7baa9a)}.play-theme-swatch[data-play-theme="26"]{background:linear-gradient(165deg,#ddd7ca,#bfb6a6)}.play-theme-swatches--dark-charcoal .play-theme-swatch{box-shadow:inset 0 0 0 1px #c9a24e59,inset 0 -10px #110c08}.play-theme-swatch.is-active{border-color:var(--gold);box-shadow:0 0 0 2px #d4a84b73}.play-theme-setting--locked .play-theme-swatch{cursor:not-allowed;opacity:.55;pointer-events:none}.play-theme-setting--locked .play-theme-group-label:after{content:" (locked during match)";color:var(--muted);font-weight:400;font-size:.85em}#play-shell,body{--play-ai-accent: var(--black-bead);--play-human-accent: var(--gold)}.card{background:var(--side-card-bg);border:1px solid var(--side-card-border);border-radius:10px;padding:14px 12px;box-shadow:var(--side-card-glow)}.card.left{padding-top:8px;max-height:calc(100dvh - 24px)}.card.right{max-height:calc(100dvh - 24px);overflow-y:auto}.left h2,.right h2,.ad-slot h2{font-family:Libre Baskerville,Georgia,serif;font-size:.82rem;font-weight:700;text-transform:uppercase;color:var(--gold);letter-spacing:.08em;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid rgba(201,162,78,.22)}.main{display:flex;flex-direction:column;align-items:center;gap:var(--main-gap);width:var(--frame-w);max-width:100%;max-height:calc(100dvh - var(--shell-pad-v));flex-shrink:1;min-height:0}.coach-panel{display:flex;flex-direction:column;gap:8px;margin-bottom:10px;padding:10px 12px;border-radius:10px;border:1px solid rgba(42,157,143,.55);background:#0a1813f2}.coach-panel.is-hidden{display:none}.coach-panel-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.coach-panel-head strong{color:#6ee7c8;font-size:.88rem}.coach-time-label{font-size:.68rem;color:var(--muted);font-weight:600;font-variant-numeric:tabular-nums}.coach-video-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.coach-video-btn{background:#2a9d8f40;border:1px solid rgba(42,157,143,.65);color:#b8f5e8;font-size:.82rem;padding:4px 12px;border-radius:6px}.coach-video-btn.is-hidden{display:none}.coach-scrub{flex:1 1 120px;min-width:80px;accent-color:#2a9d8f}.coach-lesson-body{margin:0;font-size:.82rem;line-height:1.45;color:var(--text)}.coach-lesson-intro{margin:0 0 8px}.coach-lesson-points{margin:0 0 8px;padding-left:18px}.coach-lesson-points li{margin-bottom:6px}.coach-voice-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.coach-speaking-label{font-size:.72rem;color:#6ee7c8;font-weight:600}.coach-speaking-label.is-hidden{display:none}.coach-voice-btn{background:#2a9d8f26;border:1px solid rgba(42,157,143,.45);color:#b8f5e8;font-size:.75rem;padding:4px 10px;border-radius:6px}.coach-emphasis{outline:2px solid rgba(42,157,143,.85);outline-offset:2px;border-radius:6px}.play-panel{height:var(--frame-h);display:flex;flex-direction:column;justify-content:space-between;gap:0}.play-block-row-timer{margin-top:2px}.play-block{display:flex;flex-direction:column;gap:4px;padding:10px 12px;border-radius:8px;border:1px solid rgba(201,162,78,.14);border-left-width:3px}.play-block-ai{flex-shrink:0;border-left-color:var(--play-ai-accent);border-color:var(--play-ai-border);background:var(--play-ai-bg)}.play-block-human{flex-shrink:0;border-left-color:var(--play-human-accent);border-color:var(--play-human-border);background:var(--play-human-bg)}.play-block-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:.92rem}.play-block-head strong{font-family:Libre Baskerville,Georgia,serif;font-weight:700;color:var(--text)}button,select,input,label{touch-action:manipulation}.name-status{min-height:1.2em;font-size:.9rem}.name-status.name-ok{color:#5fd27f}.name-status.name-bad{color:#ff7a7a}.settings-theme select{font:inherit;background:var(--panel-2);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:2px 6px}html[data-theme=black] body,html[data-theme=black] #play-shell{--bg: oklch(9% 0 0) !important;--side-card-bg: oklch(15% 0 0 / 92%) !important;--panel: oklch(12% 0 0 / 92%) !important;--panel-2: oklch(10% 0 0 / 94%) !important;--muted: oklch(72% 0 0) !important}html[data-theme=black] body{background:#020202!important}#account-dialog{z-index:70}.friends-section ul{margin:0 0 8px;padding-left:1.2em;text-align:left}.friends-section li{margin:4px 0;overflow-wrap:anywhere}.friends-section li button{margin-left:4px}.friends-chat{border-top:1px solid var(--line);padding-top:8px}.friends-chat ul{max-height:140px;overflow-y:auto}#account-dialog .modal-actions{position:sticky;bottom:0;padding:8px 0 2px;background:var(--panel-2, #0b231a)}#hub-account-btn{max-width:12ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hub-sidebar-link[hidden],.settings-account button[hidden]{display:none!important}.settings-account{display:flex;flex-wrap:wrap;gap:8px}.settings-account>label{flex:1 0 100%}.settings-account button{flex:1 1 0;min-height:36px;padding:6px 10px;border-radius:8px;border:1px solid var(--gold, #c9a14a);background:transparent;color:var(--text);font:inherit;cursor:pointer}#settings-account-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:12ch}.hub-build,.settings-build{opacity:.6;margin:4px 0;text-align:center;font-size:.7rem}.panel-score{background:none;border:1px solid var(--gold, #c9a14a);border-radius:999px;color:var(--gold, #c9a14a);font:inherit;font-size:.85em;padding:0 8px;cursor:pointer}.panel-score[hidden]{display:none}.panel-score-pop{position:fixed;left:50%;top:30%;transform:translate(-50%);z-index:60;max-width:min(92vw,360px);padding:12px 16px;border:1px solid var(--gold, #c9a14a);border-radius:12px;background:#0d2a1c;color:#f1ead8;text-align:center}.panel-score-pop[hidden],#settings-panel .settings-scores{display:none}.settings-scores ul{margin:4px 0 0;padding-left:18px}.play-block-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.82rem}.play-label{color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;font-weight:700}.match-timer-stack{padding:0 4px;width:100%}.match-timer-mmss{font-family:ui-monospace,monospace;font-weight:800;font-size:1.64rem;line-height:1.1;color:var(--gold);font-variant-numeric:tabular-nums}.match-timer-mmss.off{font-size:.82rem;color:var(--muted)}.play-stat-amber span,.play-stat-amber .val{color:var(--gold);font-weight:800}.shot-ring{--shot-pct: 1;position:relative;width:40px;height:40px;flex-shrink:0}.shot-ring svg{width:100%;height:100%;transform:rotate(-90deg)}.shot-ring-track{fill:none;stroke:#ffffff1f;stroke-width:3}.shot-ring-progress{fill:none;stroke:var(--gold);stroke-width:3;stroke-linecap:round;stroke-dasharray:106.8;stroke-dashoffset:calc(106.8 * (1 - var(--shot-pct)));transition:stroke-dashoffset .35s linear}.shot-ring-sec{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-family:ui-monospace,monospace;font-size:.72rem;font-weight:800;color:var(--gold)}.shot-ring.off .shot-ring-progress{stroke:#9bb5a659}.shot-ring.off .shot-ring-sec{color:var(--muted)}.match-ring{--match-pct: 1;position:relative;width:28px;height:28px;flex-shrink:0}.match-ring svg{width:100%;height:100%;transform:rotate(-90deg)}.match-ring-track{fill:none;stroke:#ffffff1f;stroke-width:3}.match-ring-progress{fill:none;stroke:var(--gold);stroke-width:3;stroke-linecap:round;stroke-dasharray:106.8;stroke-dashoffset:calc(106.8 * (1 - var(--match-pct)));transition:stroke-dashoffset .35s linear}.match-ring.off .match-ring-progress{stroke:#9bb5a659}.match-ring.low-time .match-ring-progress{animation:match-ring-pulse 1s ease-in-out infinite}@keyframes match-ring-pulse{0%,to{opacity:1}50%{opacity:.35}}.ad-slot{align-self:start;width:var(--ad-column-width);max-height:calc(100dvh - 24px)}.ad-frame{background:#f4f4f4;border-radius:10px;padding:10px;height:min(560px,calc(100dvh - 32px));max-height:calc(100dvh - 32px);display:flex;flex-direction:column;gap:8px}.ad-label{font-size:.62rem;text-transform:uppercase;letter-spacing:.08em;color:#5c5c5c;font-weight:700}.ad-placeholder{flex:1;min-height:240px;border-radius:8px;border:1px dashed #ccc;background:#fff;color:#5c5c5c;display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:600}.setting-list{display:flex;flex-direction:column;gap:10px}.setting{display:flex;flex-direction:column;gap:4px}.setting-label-row{display:flex;align-items:center;gap:6px}.setting-label-row label{flex:1;margin:0}.setting label{font-size:.68rem;text-transform:uppercase;color:var(--muted);letter-spacing:.04em;font-weight:700}.setting-help-btn{flex-shrink:0;width:18px;height:18px;padding:0;border-radius:50%;border:1px solid rgba(212,168,75,.45);background:#d4a84b1f;color:var(--muted);font-size:.68rem;font-weight:800;line-height:1;cursor:pointer}@media (max-width: 980px){.setting-help-btn{position:relative}.setting-help-btn:after{content:"";position:absolute;top:-14px;right:-14px;bottom:-14px;left:-14px}}.setting-help-btn:hover,.setting-help-btn.is-open{color:var(--text);border-color:#d4a84bbf;background:#d4a84b38}.setting-help-text{margin:0;font-size:.72rem;line-height:1.35;color:var(--text);font-weight:500;text-transform:none;letter-spacing:normal}.setting label.coach-ai-level-label{margin-top:2px;font-size:.62rem;font-weight:600;text-transform:none;letter-spacing:.02em}select,button,input[type=text]{background:var(--panel-2);color:var(--text);border:1px solid rgba(201,162,78,.28);border-radius:6px;padding:7px 9px;font:inherit}select:disabled{opacity:.45;cursor:not-allowed}button{cursor:pointer;font-weight:700}.board-frame{position:relative;width:100%;height:var(--frame-h);max-height:var(--frame-h);flex-shrink:1;min-height:0;background:var(--board-frame-bg, oklch(.22 .055 157));border-radius:12px;padding:14px;border:1px solid color-mix(in oklch,var(--board-frame-border, var(--gold)) 38%,transparent);box-shadow:0 18px 44px #0000008c,inset 0 0 0 1px #c9a24e24;display:flex;align-items:stretch;justify-content:stretch;overflow:hidden}.start-screen-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#081a13bf;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:35;transition:opacity .3s ease,visibility .3s ease}.start-screen-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}.start-screen-card{background:linear-gradient(135deg,#184332,#0c271d);border:2px solid var(--gold);border-radius:18px;padding:18px 24px;text-align:center;box-shadow:0 12px 40px #0009,0 0 25px #e5c15859;max-width:88%}.start-screen-slogan{font-size:.88rem;line-height:1.45;color:var(--gold);margin:0 0 8px}.start-screen-slogan em{font-style:italic}.start-screen-badge{font-size:.75rem;font-weight:800;letter-spacing:3px;color:var(--gold);margin-bottom:4px}.start-screen-heading{font-size:1.3rem;font-weight:800;color:#fff;margin-bottom:12px;letter-spacing:1px}.start-screen-mode{display:flex;flex-direction:column;gap:4px;margin-bottom:14px;text-align:left}.start-screen-mode label{font-size:.68rem;text-transform:uppercase;color:var(--muted);letter-spacing:.04em;font-weight:700}.start-screen-mode .setting-help-text{margin-bottom:2px}.hub-mode-help-text{white-space:pre-line}.start-screen-mode select{width:100%;text-align:left}.start-game-btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.start-game-btn{background:linear-gradient(180deg,gold,#d4a84b);color:#06261b;font-size:1.1rem;font-weight:900;letter-spacing:1.5px;padding:12px 28px;border-radius:12px;border:none;cursor:pointer;box-shadow:0 6px 18px #d4a84b73,0 2px 4px #0000004d;transition:all .15s ease;display:inline-block;margin-bottom:8px}.start-game-btn:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 8px 24px #d4a84ba6}.start-game-btn:active{transform:scale(.97)}.start-coach-btn{display:inline-block;margin-bottom:8px;padding:8px 18px;border-radius:10px;border:1px solid rgba(212,168,75,.55);background:transparent;color:var(--gold);font-size:.82rem;font-weight:700;letter-spacing:.04em;cursor:pointer}.start-coach-btn:hover{background:#d4a84b1f}.start-screen-hint{font-size:.78rem;color:var(--muted)}.board-celebration-fx{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:25;overflow:hidden}.celebration-halo{position:absolute;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(229,193,88,.4) 0%,rgba(229,193,88,.12) 45%,transparent 70%);pointer-events:none;opacity:0}.board-celebration-fx.animate .celebration-halo{animation:celebrationHaloPulse 2s ease-out forwards}.celebration-particles{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.celebration-particle{position:absolute;left:50%;top:50%;pointer-events:none;-webkit-user-select:none;user-select:none;font-weight:900;line-height:1;transform-origin:center;font-size:var(--size, 16px);color:var(--color, #ffd700);text-shadow:0 0 10px var(--color, #ffd700),0 0 20px rgba(255,255,255,.7);animation:explodeParticle var(--dur, 1.8s) cubic-bezier(.12,.8,.32,1) var(--delay, 0s) forwards}.start-banner{position:relative;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:30;opacity:0;visibility:hidden}.start-banner.animate{visibility:visible;animation:startBannerFade 2s cubic-bezier(.2,.8,.2,1) forwards}.start-banner.animate .start-banner-card{animation:startBannerPop 2s cubic-bezier(.175,.885,.32,1.275) forwards}.start-banner-card{background:linear-gradient(135deg,#0e2a1ff5,#061610fa);border:2.5px solid #e5c158;border-radius:16px;padding:16px 32px;text-align:center;box-shadow:0 0 35px #e5c15880,0 12px 45px #000000bf,inset 0 0 16px #e5c15840;transform:scale(.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.start-banner.animate.coach-segment-banner{animation:coachSegmentBannerFade var(--coach-banner-dur, 3s) cubic-bezier(.2,.8,.2,1) forwards}.start-banner.animate.coach-segment-banner.coach-segment-banner-move{animation:coachSegmentBannerFadeMove var(--coach-banner-dur, 6.5s) cubic-bezier(.2,.8,.2,1) forwards}.start-banner.animate.coach-segment-banner .start-banner-card{animation:coachSegmentBannerPop var(--coach-banner-dur, 3s) cubic-bezier(.175,.885,.32,1.275) forwards}.start-banner.animate.coach-segment-banner.coach-segment-banner-move .start-banner-card{animation:coachSegmentBannerPopMove var(--coach-banner-dur, 6.5s) cubic-bezier(.175,.885,.32,1.275) forwards}.board-celebration-fx.coach-segment-top{align-items:flex-start;justify-content:center;padding-top:12px}.board-celebration-fx.coach-segment-top .celebration-halo{top:8px;width:280px;height:120px;border-radius:20px}@keyframes coachSegmentBannerPopMove{0%{transform:scale(.5);opacity:0}5%{transform:scale(1.05);opacity:1}8%{transform:scale(1);opacity:1}92%{transform:scale(1);opacity:1}to{transform:scale(1.08);opacity:0}}@keyframes coachSegmentBannerFadeMove{0%{opacity:0}4%{opacity:1}94%{opacity:1}to{opacity:0}}@keyframes coachSegmentBannerPop{0%{transform:scale(.5);opacity:0}8%{transform:scale(1.05);opacity:1}14%{transform:scale(1);opacity:1}88%{transform:scale(1);opacity:1}to{transform:scale(1.08);opacity:0}}@keyframes coachSegmentBannerFade{0%{opacity:0}6%{opacity:1}90%{opacity:1}to{opacity:0}}.start-banner-subtitle{font-size:.76rem;font-weight:800;letter-spacing:3.5px;color:#e5c158;margin-bottom:4px;text-transform:uppercase;text-shadow:0 0 10px rgba(229,193,88,.7)}.start-banner-title{font-size:1.85rem;font-weight:900;letter-spacing:2px;color:#fff;text-transform:uppercase;text-shadow:0 2px 12px rgba(229,193,88,.85),0 0 28px rgba(229,193,88,.6);white-space:nowrap}@keyframes celebrationHaloPulse{0%{transform:scale(.2);opacity:0}20%{transform:scale(1.2);opacity:.95}60%{transform:scale(1.6);opacity:.65}to{transform:scale(2.2);opacity:0}}@keyframes explodeParticle{0%{transform:translate(-50%,-50%) scale(0) rotate(0);opacity:0}12%{opacity:1;transform:translate(calc(-50% + var(--dx) * .35),calc(-50% + var(--dy) * .35)) scale(1.4) rotate(calc(var(--rot) * .35))}50%{opacity:1;transform:translate(calc(-50% + var(--dx) * .85),calc(-50% + var(--dy) * .85)) scale(1.1) rotate(calc(var(--rot) * .85))}80%{opacity:.85;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy) + 20px)) scale(.9) rotate(var(--rot))}to{opacity:0;transform:translate(calc(-50% + var(--dx) * 1.1),calc(-50% + var(--dy) + 55px)) scale(.3) rotate(calc(var(--rot) * 1.4))}}@keyframes startBannerPop{0%{transform:scale(.4);opacity:0}10%{transform:scale(1.06);opacity:1}18%{transform:scale(1);opacity:1}42%{transform:scale(1);opacity:1}48%{transform:scale(1.14);opacity:1}54%{transform:scale(1);opacity:1}85%{transform:scale(1);opacity:1}to{transform:scale(1.15);opacity:0}}@keyframes startBannerFade{0%{opacity:0}8%{opacity:1}86%{opacity:1}to{opacity:0;visibility:hidden}}canvas{touch-action:none;width:100%;height:100%;display:block;border-radius:4px;background:transparent;box-shadow:inset 0 0 0 1px #c9a24e6b;cursor:pointer}.controls{display:flex;gap:6px;flex-wrap:nowrap;justify-content:center;align-items:center;width:100%;min-height:var(--controls-h);flex-shrink:0}.controls button{padding:5px 7px;font-size:.82rem;white-space:nowrap;flex:0 1 auto}.controls .finish{display:none}.controls .finish.visible{display:inline-block}.controls .finish.visible.coach-demo{background:linear-gradient(180deg,#e8c860 0%,var(--gold) 100%);box-shadow:0 0 14px #d645458c,0 0 22px #d4a84b73,inset 0 0 10px #d645451f;animation:coach-resign-btn-glow 1.4s ease-in-out infinite}.coach-lesson-points .coach-point-emphasis{color:var(--gold);font-weight:700;background:#d4a84b2e;border-radius:6px;padding:4px 6px;margin:0 -6px;list-style-position:inside}#undo-btn:disabled{opacity:.4;cursor:not-allowed}.stat{display:flex;justify-content:space-between;font-size:.88rem;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.07)}.val-wrap{position:relative;display:inline-flex;align-items:center;min-width:1.5rem;justify-content:flex-end}.capture-tick{position:absolute;left:calc(100% + 6px);top:50%;color:var(--gold);font-size:.78rem;font-weight:800;opacity:0;pointer-events:none;transform:translateY(-50%);white-space:nowrap}.capture-tick.show{animation:capture-tick-pop .85s ease-out forwards}@keyframes capture-tick-pop{0%{opacity:0;transform:translateY(calc(-50% + 4px)) scale(.85)}18%{opacity:1;transform:translateY(-50%) scale(1)}to{opacity:0;transform:translateY(calc(-50% - 12px)) scale(1)}}.val{font-weight:700;font-variant-numeric:tabular-nums}.pill{display:flex;justify-content:space-between;align-items:center;padding:8px;border-radius:10px;border:1px solid transparent;margin-bottom:8px}.pill.active{border-color:#d4a84bb3;background:#d4a84b1a}.pill.red{border-left:4px solid var(--red)}.pill.blue{border-left:4px solid var(--blue)}.tiny{font-size:.74rem;color:var(--muted)}.timer{font-family:ui-monospace,monospace;font-weight:700;color:var(--gold)}.modal{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b8;align-items:center;justify-content:center;padding:12px;z-index:30;overflow:hidden}.modal .celebration-particles{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:32}.modal .celebration-halo{position:absolute;width:440px;height:440px;border-radius:50%;background:radial-gradient(circle,rgba(229,193,88,.35) 0%,rgba(229,193,88,.1) 45%,transparent 70%);pointer-events:none;opacity:0;z-index:28}.modal.animate .celebration-halo{animation:celebrationHaloPulse 2s ease-out forwards}.modal-card{position:relative;width:min(400px,94%);background:linear-gradient(135deg,#184332,#0c271d);border:2px solid var(--gold);border-radius:18px;padding:26px 28px;text-align:center;box-shadow:0 12px 40px #000000b3,0 0 25px #e5c15859;z-index:31}.modal-badge{font-size:.74rem;font-weight:800;letter-spacing:3px;color:var(--gold);margin-bottom:8px;text-transform:uppercase;text-shadow:0 0 8px rgba(229,193,88,.5)}.result-title{font-size:1.45rem;font-weight:900;letter-spacing:1px;margin-bottom:8px;text-transform:uppercase;line-height:1.3}.result-title.victory{color:gold;text-shadow:0 0 16px rgba(255,215,0,.6)}.result-title.defeat{color:#fbbf24;text-shadow:0 0 12px rgba(251,191,36,.4)}.result-title.draw{color:#e2e8f0;text-shadow:0 0 10px rgba(226,232,240,.4)}.result-desc{font-size:.95rem;color:var(--muted);margin-bottom:20px;line-height:1.4}.result-view-board-btn{background:transparent;color:var(--muted);font-size:.92rem;font-weight:700;letter-spacing:.5px;padding:8px 12px;border-radius:10px;border:1px solid rgba(212,168,75,.35);cursor:pointer;transition:color .15s ease,border-color .15s ease,background .15s ease}.result-view-board-btn:hover{color:#f8fafc;border-color:#d4a84ba6;background:#d4a84b14}.play-again-btn{background:linear-gradient(180deg,gold,#d4a84b);color:#06261b;font-size:1.05rem;font-weight:900;letter-spacing:1.5px;padding:12px 24px;border-radius:12px;border:none;cursor:pointer;box-shadow:0 6px 18px #d4a84b73;transition:all .15s ease;width:100%}.play-again-btn:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 8px 24px #d4a84ba6}.modal-actions{display:flex;flex-direction:column;gap:10px}.modal-actions button{width:100%}.modal.coach-snapshot .modal-actions,.modal.coach-snapshot .play-again-btn,.modal.coach-snapshot .resign-action{pointer-events:none;cursor:default}.modal.coach-snapshot .play-again-btn,.modal.coach-snapshot .resign-action{opacity:.82}#resign-agree-btn.resign-action--draw{background:var(--panel);color:var(--text);border:2px dashed var(--gold)}#resign-decline-btn.resign-action--claim{background:var(--gold);color:#06261b;border:2px solid var(--text);font-weight:600}#resign-btn,#finish-btn,#restart-btn{background:var(--gold);color:#06261b;font-weight:600}#resign-btn,#finish-btn{border:2px solid var(--red)}#restart-btn{border:2px solid var(--gold)}#restart-btn .new-game-new{color:#000}#resign-btn:hover:not(:disabled),#finish-btn:hover:not(:disabled){background:var(--gold);box-shadow:inset 0 0 0 999px #d6454524}#restart-btn:hover:not(:disabled){background:var(--gold);box-shadow:inset 0 0 0 999px #00000014}#resign-btn:focus-visible,#finish-btn:focus-visible{outline:2px solid var(--red);outline-offset:2px}#restart-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}#resign-btn.coach-resign-btn-glow{background:linear-gradient(180deg,#e8c860 0%,var(--gold) 100%);color:#06261b;border:2px solid var(--red);box-shadow:0 0 14px #d645458c,0 0 22px #d4a84b73,inset 0 0 10px #d645451f;animation:coach-resign-btn-glow 1.4s ease-in-out infinite}@keyframes coach-resign-btn-glow{0%,to{box-shadow:0 0 10px #d6454573,0 0 20px #d4a84b4d,inset 0 0 8px #d645451a}50%{box-shadow:0 0 18px #d64545b3,0 0 32px #d4a84b73,inset 0 0 14px #d645452e}}.modal.coach-resign-offer-glow .modal-card{border:2px solid var(--gold);box-shadow:0 0 18px #d4a84b8c,0 0 36px #d4a84b40;animation:coach-resign-glow 1.6s ease-in-out infinite}@keyframes coach-resign-glow{0%,to{box-shadow:0 0 14px #d4a84b73,0 0 28px #d4a84b2e}50%{box-shadow:0 0 22px #d4a84bb8,0 0 44px #d4a84b52}}.modal.coach-resign-offer-glow #resign-agree-btn.resign-action--draw{border-color:#d4a84bd9}.modal.coach-resign-offer-glow #resign-decline-btn.resign-action--claim{background:linear-gradient(180deg,#e8c878 0%,var(--gold) 100%)}#sfx-mute-btn{background:#244b3c;color:var(--text);border-color:#d4a84b66}#sfx-mute-btn.muted{opacity:.55;background:#1c2e27}.bgm-section{display:flex;flex-direction:column;gap:8px;margin-top:4px}.bgm-controls{display:flex;gap:6px}.bgm-controls button{flex:1;padding:6px;font-size:.8rem}#bgm-play{background:linear-gradient(180deg,#72bf77,#4caf50);color:#06261b;border:none}#bgm-pause{background:var(--gold);color:#06261b;border:none}.bgm-vol-row{display:flex;align-items:center;gap:8px}#bgm-vol{flex:1;accent-color:var(--gold)}.settings-toggle-btn,.settings-close-btn{display:none}@media (max-width: 980px){.shell,.shell.shell--ads-on,.shell.shell--no-ads{grid-template-columns:1fr;max-width:100%}.main{width:100%}.ad-slot{display:none}.play-panel{height:auto;min-height:0}body:not(.hub-page){align-items:flex-start;overflow-y:auto;height:auto;max-height:none;padding:6px 8px}#play-shell{max-height:none;overflow:visible;gap:6px;--side-columns-width: 0px;--shell-gutter-h: 16px;--stack-chrome: 214px;--board-area-h: max(300px, calc(100dvh - var(--body-pad-v) - var(--stack-chrome)))}#play-shell .card.left,#play-shell .play-panel,#play-shell .main{display:contents}#play-shell .play-block-ai{order:1}#play-shell .board-frame{order:2;width:min(100%,var(--frame-w));margin-inline:auto}#play-shell .play-block-human{order:3}#play-shell{--phone-ad-h: 58px}#play-shell.shell--no-ads{--phone-ad-h: 0px}#play-shell .controls{position:fixed;left:0;right:0;bottom:var(--phone-ad-h);z-index:20;flex-wrap:wrap;padding:6px 8px;background:var(--bg);border-top:1px solid rgba(201,162,78,.22)}body:not(.hub-page){padding-bottom:130px}body:not(.hub-page):has(#play-shell.shell--no-ads){padding-bottom:72px}#play-shell .ad-slot{display:block;position:fixed;left:0;right:0;bottom:0;z-index:20;width:100%;height:var(--phone-ad-h);max-height:none}#play-shell.shell--no-ads .ad-slot{display:none}#play-shell .ad-frame{height:100%;max-height:none;flex-direction:row;align-items:center;padding:4px 8px;border-radius:0}#play-shell .ad-placeholder{min-height:0;height:100%}#play-shell .card.right{display:none}#play-shell.is-settings-open .card.right{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;max-height:none;overflow-y:auto;border-radius:0}.settings-toggle-btn{display:inline-block;margin-left:auto;padding:0 8px;height:24px;line-height:1}#resign-btn,#sfx-mute-btn,#undo-btn,#restart-btn,#home-btn,.settings-toggle-btn{min-width:44px;min-height:44px}.settings-close-btn{display:block;margin-bottom:10px}.play-block{flex-direction:row;flex-wrap:wrap;align-items:center;gap:2px 10px;padding:4px 10px}.play-block-head{flex:1 1 auto;display:flex;align-items:center}.play-block-head .tiny,.panel-name-level,.panel-score{display:none}#settings-panel .settings-scores:not([hidden]){display:block}#play-shell .play-block-row:has(#top-p1-beads),#play-shell .play-block-row:has(#top-p2-beads){display:none}.play-block-row{gap:6px}.play-block-row:has(.shot-ring.off),.play-block-row-timer:has(.match-timer-mmss.off){display:none}}#settings-menu-btn,.phone-back-btn{display:none}@media (max-width: 980px) and (orientation: portrait){body:not(.hub-page),body:not(.hub-page):has(#play-shell.shell--no-ads){height:100dvh;max-height:100dvh;overflow:hidden;padding:0;align-items:stretch}#play-shell{--phone-ad-h: 50px;--phone-row-h: 38px;--body-pad-v: 0px;--shell-gutter-h: 12px;--online-bar-h: 0px;--stack-chrome: calc(var(--phone-row-h) * 2 + var(--phone-ad-h) + var(--online-bar-h) + 8px);--board-area-h: calc(100dvh - var(--stack-chrome));display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;height:100dvh;max-height:100dvh;width:100%;max-width:100%;margin:0;gap:0;overflow:hidden}#play-shell.shell--no-ads{--phone-ad-h: 0px}#play-shell.is-hidden{display:none}#play-shell .play-block-ai{order:1}#play-shell .online-bar{order:2;margin:0;border-radius:0;flex:none;flex-wrap:nowrap;gap:2px 8px;padding:2px 8px;font-size:.78rem;line-height:1.15}#play-shell .online-bar>span:first-child,#play-shell .online-bar>#online-bar-text{flex:1 1 auto;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}#play-shell:has(#online-bar:not([hidden])){--online-bar-h: 36px}#play-shell .online-bar-actions{flex:none;flex-wrap:nowrap;gap:6px}#play-shell .online-bar .online-say,#play-shell .online-bar .online-copy-btn{min-height:30px;max-width:6.5rem;padding:0 6px;font-size:.78rem}#play-shell .board-frame{order:3;flex:none;margin:auto;padding:6px;width:min(100%,var(--frame-w))}#play-shell .play-block-human{order:4}#play-shell .play-block{position:relative;z-index:1}#play-shell .ad-slot{order:5}#play-shell .play-block{flex:none;flex-wrap:nowrap;align-items:center;height:var(--phone-row-h);min-height:var(--phone-row-h);max-height:var(--phone-row-h);gap:10px;padding:0 8px;border-radius:0;overflow:hidden;white-space:nowrap}#play-shell .play-block-human{background:var(--play-ai-bg)}#play-shell .play-block-head{flex:1 1 auto;min-width:0;gap:6px;align-items:center;justify-content:flex-start;font-size:.95rem}#play-shell .play-block-head strong{overflow:hidden;text-overflow:ellipsis}#play-shell .play-block-row{flex:none;gap:4px;font-size:.74rem;margin:0}#play-shell .play-label{display:none}#play-shell .shot-ring{width:28px;height:28px}#play-shell .shot-ring-sec{font-size:.6rem}#play-shell .match-ring{width:20px;height:20px}#play-shell .match-timer-mmss{font-size:.95rem;line-height:1}#play-shell .match-timer-mmss.off{font-size:.74rem}#play-shell{--phone-gold: oklch(.86 .12 82)}#play-shell .play-stat-amber span,#play-shell .play-stat-amber .val{color:var(--phone-gold);font-size:.82rem}#play-shell .play-stat-amber .val{font-size:.86rem}#play-shell .val-wrap{min-width:0;justify-content:flex-start}#play-shell .shot-ring-progress,#play-shell .match-ring-progress,#play-shell .shot-ring.off .shot-ring-progress,#play-shell .match-ring.off .match-ring-progress{stroke:var(--phone-gold)}#play-shell .shot-ring-track,#play-shell .match-ring-track{stroke:#ffffff47}#play-shell .shot-ring-sec,#play-shell .shot-ring.off .shot-ring-sec,#play-shell .match-timer-mmss,#play-shell .match-timer-mmss.off{color:var(--phone-gold)}#play-shell .settings-toggle-btn{order:-1;position:relative;flex:none;margin:0;padding:0;width:34px;min-width:34px;height:34px;min-height:34px}#play-shell .settings-toggle-btn:after{content:"";position:absolute;top:-5px;right:-5px;bottom:-5px;left:-5px}#play-shell .phone-back-btn{display:block;order:-1;position:relative;flex:none;margin:0;padding:0;width:34px;min-width:34px;height:34px;min-height:34px;font-size:1.1rem;line-height:1}#play-shell .phone-back-btn:after{content:"";position:absolute;top:-5px;right:-5px;bottom:-5px;left:-5px}#play-shell .play-block-row:has(.shot-ring.off),#play-shell .play-block-row-timer:has(.match-timer-mmss.off){display:flex}#play-shell .controls{display:contents}#play-shell #resign-btn,#play-shell #sfx-mute-btn,#play-shell #restart-btn,#play-shell #home-btn,#play-shell #settings-menu-btn{display:none}#play-shell.is-menu-open #resign-btn,#play-shell.is-menu-open #sfx-mute-btn,#play-shell.is-menu-open #restart-btn,#play-shell.is-menu-open #home-btn,#play-shell.is-menu-open #settings-menu-btn{display:block;position:fixed;left:8px;width:200px;min-height:44px;text-align:left;z-index:60;box-shadow:0 6px 18px #0000008c}#play-shell.is-menu-open #sfx-mute-btn,#play-shell.is-menu-open #home-btn{background-color:#0b231a}#play-shell.is-menu-open #resign-btn{top:calc(var(--phone-row-h) + 6px)}#play-shell.is-menu-open #sfx-mute-btn{top:calc(var(--phone-row-h) + 6px + 46px)}#play-shell.is-menu-open #restart-btn{top:calc(var(--phone-row-h) + 6px + 92px)}#play-shell.is-menu-open #settings-menu-btn{top:calc(var(--phone-row-h) + 6px + 138px)}#play-shell.is-menu-open #home-btn{top:calc(var(--phone-row-h) + 6px + 184px)}#play-shell #undo-btn,#play-shell #finish-btn.visible{position:fixed;bottom:calc(var(--phone-ad-h) + var(--phone-row-h) + 8px);z-index:30;min-height:34px;min-width:0;padding:4px 12px}#play-shell #undo-btn{right:12px}#play-shell #finish-btn.visible{left:50%;transform:translate(-50%)}#play-shell .ad-slot{display:block;position:static;flex:none;width:100%;height:var(--phone-ad-h);max-height:none}#play-shell.shell--no-ads .ad-slot{display:none}#play-shell .ad-frame{padding:0 8px}}@media (max-width: 980px) and (orientation: landscape) and (max-height: 520px){body:not(.hub-page){height:100dvh;overflow:hidden;padding:6px 8px}body:not(.hub-page),body:not(.hub-page):has(#play-shell.shell--no-ads){padding-bottom:6px}#play-shell{display:grid;grid-template-columns:auto minmax(220px,1fr);grid-template-rows:auto auto auto 1fr;column-gap:10px;row-gap:6px;align-items:start;height:calc(100dvh - 12px);--stack-chrome: 0px;--body-pad-v: 12px;--side-columns-width: 250px;--board-area-h: calc(100dvh - 12px) ;--board-area-w: calc(100vw - 266px) }#play-shell .board-frame{grid-column:1;grid-row:1 / span 4;order:0;margin:0}#play-shell .play-block-ai{grid-column:2;grid-row:1;order:0}#play-shell .play-block-human{grid-column:2;grid-row:2;order:0}#play-shell .controls{position:static;grid-column:2;grid-row:3;padding:0;border-top:0;background:transparent}#play-shell .ad-slot{position:static;grid-column:2;grid-row:4;align-self:end;height:50px}}.online-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 6px;padding:6px 10px;border:1px solid rgba(201,162,78,.35);border-radius:6px;background:#0000002e;color:var(--text);font-size:.9rem}.online-bar{flex-wrap:wrap}.online-bar[hidden]{display:none}.online-bar-actions{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}.online-say{min-height:44px;max-width:9rem}.online-copy-btn{min-height:44px;padding:0 12px}.online-lobby-card{max-width:420px;width:calc(100vw - 32px);max-height:calc(100dvh - 32px);overflow-y:auto}.history-board{display:block;margin:6px 0 2px;color:#d9b45c}.online-lobby-section{display:flex;flex-direction:column;gap:8px;margin:12px 0}.online-lobby-section[hidden]{display:none}.online-lobby-section h4{margin:0}.online-lobby-section label{display:flex;flex-direction:column;gap:4px;text-align:left}.online-lobby-section select,.online-lobby-section input,.online-lobby-section button{min-height:44px}.online-lobby-section input{text-transform:uppercase;letter-spacing:.2em;text-align:center;font-size:1.2rem}.online-lobby-error{min-height:1.2em;margin:0;color:#ff9d8a}.sb-error-banner{position:fixed;top:0;left:0;right:0;z-index:100;padding:8px 12px;text-align:center;background:#7a1f1f;color:#fff;font-weight:600}.sb-error-banner button{margin-left:8px;padding:2px 10px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}#home-btn{background:transparent;color:var(--gold);border:2px solid var(--gold);font-weight:600}#home-btn:hover{box-shadow:inset 0 0 0 999px #d4a84b24}#home-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.bgm-credit,.settings-legal{margin:10px 2px 0;font-size:.7rem;color:var(--muted)}.bgm-credit a,.settings-legal a{color:inherit}#account-facebook:not([hidden]){display:block;text-align:center;text-decoration:none;padding:12px 0}.account-card{display:flex;flex-direction:column;overflow:hidden;max-height:calc(100dvh - 24px)}.account-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;padding-right:2px}#account-dialog .modal-actions{position:static;padding:8px 0 2px}#account-dialog .online-lobby-error{min-height:0}#account-dialog .online-lobby-error:empty{display:none}.account-heading{margin:4px 0 0;padding-top:10px;border-top:1px solid var(--line);text-align:left;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.account-label-row{display:flex;align-items:center;gap:8px;text-align:left}.account-label-row .account-heading{margin:0;padding:0;border:0;flex:0 1 auto}.account-label-row label{display:inline}.online-lobby-section label.account-adult{flex-direction:row;align-items:center;gap:10px;min-height:44px;cursor:pointer}.online-lobby-section input[type=checkbox]{flex:none;width:22px;height:22px;min-height:0;margin:0;padding:0;text-transform:none;letter-spacing:normal}.online-lobby-section .setting-help-btn{min-height:18px}#account-dialog .setting-help-text{font-size:.82rem;text-align:left;color:var(--muted)}.account-or{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:.85rem}.account-or:before,.account-or:after{content:"";flex:1;border-top:1px solid var(--line)}.account-delete-list{margin:0;padding-left:1.2em;text-align:left}.friends-section h5:has(+ul:empty){display:none}#account-dialog .modal-actions{background:none}.account-scroll h4.account-heading:has(+ul:empty){display:none}.friends-section h5{text-align:left;margin:6px 0 0}#account-local .account-label-row{border-top:1px solid var(--line);padding-top:10px}.friends-section ul:empty{display:none}.play-hub{--hub-left-w: clamp(132px, 14vw, 180px);--hub-right-w: clamp(148px, 16vw, 220px);width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;display:grid;grid-template-columns:var(--hub-left-w) minmax(0,1fr) var(--hub-right-w);grid-template-rows:1fr;gap:0;align-items:stretch;background:var(--hub-page-bg);color:var(--hub-text);font-family:Segoe UI,system-ui,sans-serif}.play-hub{--hub-page-bg: oklch(28% .11 158) !important;--hub-rail-bg: linear-gradient(165deg, oklch(32% .1 158), oklch(22% .09 160)) !important;--hub-centre-bg: oklch(28% .11 158) !important;--hub-card-bg: oklch(34% .11 158 / 92%) !important;--hub-card-hover: oklch(38% .115 158 / 96%) !important;--hub-border: oklch(45% .055 95 / 35%) !important;--hub-border-soft: oklch(45% .055 95 / 35%) !important;--hub-text: #ffffff !important;--hub-muted: #ffffff !important;--hub-centre-text: #ffffff !important;--hub-centre-muted: #ffffff !important;--hub-accent: oklch(72% .105 78) !important;--hub-accent-soft: oklch(82% .075 82) !important;--hub-accent-ring: oklch(72% .105 78 / 45%) !important;--hub-brand: oklch(93% .025 82) !important;--hub-ad-bg: oklch(32% .1 158) !important;--hub-ad-border: oklch(45% .055 95 / 35%) !important;--hub-look-box-bg: oklch(48% .095 158) !important}.play-hub[data-hub-page-look=black]{--hub-page-bg: oklch(9% 0 0) !important;--hub-rail-bg: linear-gradient(165deg, oklch(13% 0 0), oklch(6% 0 0)) !important;--hub-centre-bg: oklch(9% 0 0) !important;--hub-card-bg: oklch(15% 0 0 / 92%) !important;--hub-card-hover: oklch(19% 0 0 / 96%) !important;--hub-border: oklch(55% .07 95 / 35%) !important;--hub-border-soft: oklch(55% .07 95 / 35%) !important;--hub-text: #ffffff !important;--hub-muted: #ffffff !important;--hub-centre-text: #ffffff !important;--hub-centre-muted: #ffffff !important;--hub-accent: #c9a24a !important;--hub-accent-soft: #e6ce94 !important;--hub-accent-ring: #c9a24a73 !important;--hub-brand: #ffffff !important;--hub-ad-bg: oklch(13% 0 0) !important;--hub-ad-border: oklch(55% .07 95 / 35%) !important;--hub-look-box-bg: oklch(34% 0 0) !important}body.hub-page{background:#00321c;background:oklch(28% .11 158)}.hub-page-look-swatches{display:flex;gap:8px;padding:8px 0 4px;justify-content:center}.hub-page-look-swatch{width:22px;height:22px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0}.hub-page-look-swatch--black{background:#020202}.hub-page-look-swatch--green{background:#00321c;background:oklch(28% .11 158)}.hub-page-look-swatch.is-active{border-color:#c9a24a}.play-hub.is-hidden,.shell.is-hidden{display:none}.hub-rail{display:flex;flex-direction:column;min-height:0;height:100%;background:var(--hub-rail-bg);border-right:1px solid var(--hub-border-soft)}.hub-rail--left{position:relative;padding:16px 10px 14px;overflow:hidden}.hub-review-toggle-input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.hub-review-trigger{display:block}.hub-review-panel{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;display:flex;flex-direction:column;gap:10px;padding:16px 12px 14px;background:var(--hub-card-bg);border-right:1px solid var(--hub-border-soft);transform:translate(-100%);transition:transform .2s ease}.hub-rail--left:has(.hub-review-toggle-input:checked) .hub-review-panel{transform:translate(0)}.hub-review-panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.hub-review-panel-head .hub-rail-title{margin:0}.hub-review-panel-close{cursor:pointer;font-size:1.1rem;line-height:1;color:var(--hub-centre-muted)}.hub-review-panel-close:hover{color:var(--hub-centre-text)}.hub-rail--right{border-right:none;border-left:1px solid var(--hub-border-soft);padding:16px 12px 14px;gap:12px}.hub-brand{font-size:.68rem;font-weight:700;line-height:1.35;color:var(--hub-brand);text-align:center;margin-bottom:18px;word-break:break-word}.hub-sidebar-nav{display:flex;flex-direction:column;gap:4px}.hub-sidebar-link{padding:11px 8px;border:none;border-radius:6px;background:transparent;color:var(--hub-accent);font-size:.95rem;font-weight:600;line-height:1.25;text-align:center;cursor:pointer;transition:background .15s,color .15s}.hub-sidebar-link:hover{background:var(--hub-card-hover)}.hub-sidebar-link--soon,.hub-sidebar-link--soon:hover{color:var(--hub-accent)}.hub-sidebar-spacer{visibility:hidden}.hub-rail-notice{display:flex;align-items:flex-start;gap:8px;margin-bottom:12px;padding:10px 12px;border-radius:6px;border:1px solid var(--hub-border);background:var(--hub-card-bg);font-size:.78rem;line-height:1.4;color:var(--hub-centre-text, var(--hub-text))}.hub-rail-notice.is-hidden{display:none}.hub-rail-notice-dismiss{flex-shrink:0;border:none;background:transparent;color:var(--hub-muted);font-size:1.1rem;line-height:1;cursor:pointer;padding:0 2px}.hub-rail-notice-dismiss:hover{color:var(--hub-text)}.hub-coming-soon{margin:0;font-size:.72rem;line-height:1.45;color:var(--hub-muted);font-weight:500}.hub-rail-foot{margin-top:auto;display:flex;flex-direction:column;gap:8px;padding-top:16px;border-top:1px solid var(--hub-border-soft)}#hub-section-look .hub-play-theme-setting{margin:0;padding:0;display:flex;flex-direction:row;gap:10px}#hub-section-look .play-theme-swatches{flex-direction:column;flex-wrap:nowrap}#hub-section-look .play-theme-swatch{width:40px;height:28px}#hub-section-look .play-theme-group-label{font-size:.72rem;color:var(--hub-centre-muted)}.hub-look-body{display:flex;align-items:flex-start;gap:16px;padding:12px;border-radius:10px;background:var(--hub-look-box-bg);border:1px solid var(--hub-border)}.hub-board-preview{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}.hub-board-preview-grid{--hub-board-preview-bg: oklch(.8 .045 195);--hub-board-preview-bead-dark-hl: #4a4038;--hub-board-preview-bead-dark-mid: #241812;--hub-board-preview-bead-dark-shadow: #0d0906;--hub-board-preview-bead-light-hl: #ffffff;--hub-board-preview-bead-light-mid: #ebe2cf;--hub-board-preview-bead-light-shadow: #d6c9a8;width:100%;max-width:160px;aspect-ratio:1;border-radius:8px;border:1px solid var(--hub-border);background-image:var(--hub-board-preview-bg);position:relative}.hub-board-preview-bead{position:absolute;width:22px;height:22px;border-radius:50%;border:1px solid rgba(0,0,0,.25);box-shadow:0 1px 3px #0000004d}.hub-board-preview-bead--dark{top:-11px;left:-11px;background-image:radial-gradient(circle at 25% 22%,#ffffffd9,#fff0 38%),radial-gradient(circle at 30% 28%,var(--hub-board-preview-bead-dark-hl) 0%,var(--hub-board-preview-bead-dark-mid) 55%,var(--hub-board-preview-bead-dark-shadow) 100%)}.hub-board-preview-bead--light{bottom:-11px;right:-11px;background-image:radial-gradient(circle at 25% 22%,#ffffffd9,#fff0 38%),radial-gradient(circle at 30% 28%,var(--hub-board-preview-bead-light-hl) 0%,var(--hub-board-preview-bead-light-mid) 55%,var(--hub-board-preview-bead-light-shadow) 100%)}.hub-board-preview-caption{font-size:.62rem;color:#fff;text-align:center;margin:0}.hub-rail-foot .hub-play-theme-setting{width:100%;margin:0;padding:0;border:none;background:transparent}.hub-rail-foot .hub-play-theme-setting>label{display:block;font-size:.72rem;font-weight:600;color:var(--hub-muted);margin-bottom:2px}.hub-rail-foot .hub-play-theme-setting .play-theme-mode{font-size:.68rem;margin:2px 0 6px;color:var(--hub-muted)}.hub-rail-foot .hub-play-theme-setting .play-theme-mode-opt input{accent-color:var(--hub-accent)}.hub-rail-foot-link{border:1px solid var(--hub-border-soft);border-radius:6px;background:transparent;color:var(--hub-accent);font-size:.72rem;font-weight:600;padding:9px 6px;cursor:pointer;text-align:center;text-decoration:none}.hub-main{min-width:0;min-height:0;height:100%;display:flex;flex-direction:column;background:var(--hub-centre-bg);color:var(--hub-centre-text, var(--hub-text))}.hub-content{flex:1;min-height:0;overflow-y:auto;padding:12px 22px 8px}.hub-hero{text-align:center;margin-bottom:24px}.hub-slogan{font-size:.86rem;line-height:1.45;color:var(--hub-centre-muted, var(--hub-muted));margin:0 0 6px}.hub-slogan em{font-style:italic}.hub-title{font-family:Cinzel,Libre Baskerville,Georgia,serif;font-size:clamp(1.35rem,2.4vw,1.75rem);font-weight:800;letter-spacing:.02em;color:var(--hub-accent);margin:0}.hub-sections{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(40px,auto);gap:6px 12px;width:100%}.hub-grid-box{min-width:0;min-height:0;display:flex;flex-direction:column}#hub-section-lesson{justify-content:center}.hub-section-title{font-family:Cinzel,Libre Baskerville,Georgia,serif;font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--hub-accent);margin:0 0 8px}.hub-section-head{display:flex;align-items:center;gap:6px;margin-bottom:8px}.hub-section-head .hub-section-title{margin:0;flex:1}.hub-section-head .setting-help-btn{border-color:var(--hub-border);background:var(--hub-card-bg);color:var(--hub-centre-muted, var(--hub-muted))}.hub-section-head .setting-help-btn:hover,.hub-section-head .setting-help-btn.is-open{color:var(--hub-centre-text, var(--hub-text));border-color:var(--hub-accent);background:var(--hub-accent-soft)}.hub-mode-help-text{white-space:pre-line;margin-bottom:8px;color:var(--hub-centre-text, var(--hub-text));opacity:.92}.hub-board-tile-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.hub-board-tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:99px;padding:7px 4px;border-radius:6px;border:2px solid var(--hub-accent);background:var(--hub-card-bg);color:var(--hub-centre-text, var(--hub-text));cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s;font:inherit}.hub-board-tile-badge{position:absolute;top:-7px;left:-7px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:var(--hub-accent);color:#fff;font-size:.62rem;font-weight:700;letter-spacing:.02em;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px #0000004d}.hub-board-tile:hover{background:var(--hub-card-hover);border-color:var(--hub-border)}.hub-board-tile.is-selected{border-color:var(--hub-accent);background:var(--hub-accent-soft);box-shadow:0 0 0 1px var(--hub-accent-ring)}.hub-board-tile.is-selected .hub-board-tile-label,.hub-board-tile.is-selected .hub-board-tile-sub{color:#000}.hub-board-tile-icon{width:16px;height:16px;border-radius:3px;border:1px solid var(--hub-accent);background:var(--hub-accent);position:relative}.hub-board-tile.is-selected .hub-board-tile-icon{border-color:var(--hub-accent-ring)}.hub-board-tile-label{font-size:.72rem;font-weight:700;color:var(--hub-centre-text, var(--hub-text));text-align:center;line-height:1.2}.hub-board-tile-sub{font-size:.62rem;color:var(--hub-centre-muted, var(--hub-muted));text-align:center;line-height:1.2}.hub-board-tile[data-board-id="6x3x5"]{order:1}.hub-board-tile[data-board-id="6x4"]{order:2}.hub-board-tile[data-board-id="7x4x5"]{order:3}.hub-board-tile[data-board-id="8x4x6"]{order:4}.hub-board-tile[data-board-id="10x5"]{order:5}.hub-board-tile[data-board-id="12x6x5"]{order:6}.hub-board-tile[data-board-id="16"]{order:7}.hub-lesson-grid{display:flex;flex-direction:row;gap:8px}.hub-lesson-btn{flex:1;padding:7px 12px;border-radius:999px;border:1px solid var(--hub-border);background:var(--hub-card-bg);color:var(--hub-centre-text, var(--hub-text));font-size:.78rem;font-weight:700;cursor:pointer;transition:border-color .15s,background .15s,color .15s}.hub-lesson-btn:hover:not(:disabled){background:var(--hub-card-hover);border-color:var(--hub-border)}.hub-lesson-btn:first-child:hover:not(:disabled){border-color:var(--hub-accent);background:var(--hub-accent-soft)}.hub-lesson-btn:disabled{opacity:.45;cursor:not-allowed}.hub-mode-tile-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.hub-mode-tile{display:flex;align-items:center;gap:10px;padding:12px;border-radius:6px;border:2px solid var(--hub-accent);background:var(--hub-card-bg);color:var(--hub-centre-text, var(--hub-text));font-size:.8rem;font-weight:600;line-height:1.25;text-align:left;cursor:pointer;transition:border-color .15s,background .15s}.hub-mode-tile:hover:not(:disabled){background:var(--hub-card-hover);border-color:var(--hub-border)}.hub-mode-tile:disabled{opacity:.42;cursor:not-allowed}.hub-mode-tile[data-hub-mode=spectate]{border-style:dashed}.hub-mode-tile-icon{flex-shrink:0;width:14px;height:14px;border-radius:3px;border:1px solid var(--hub-accent);background:var(--hub-accent)}.hub-mode-tile[data-hub-mode=pve]{order:1}.hub-mode-tile[data-hub-mode=pvp]{order:2}.hub-mode-tile[data-hub-mode=pvp-online]{order:3}.hub-mode-tile[data-hub-mode=spectate]{order:4}.hub-rail-title{font-size:.62rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--hub-muted);margin:0 0 10px}.hub-ad-side{flex:1;min-height:0;display:flex;flex-direction:column;gap:6px;background:var(--hub-ad-bg);border-radius:4px;border:1px solid var(--hub-ad-border);padding:8px}.hub-ad-side .ad-label{font-size:.58rem;text-transform:uppercase;letter-spacing:.08em;color:#5c5c5c;font-weight:700}.hub-ad-side .ad-placeholder{flex:1;min-height:0;border-radius:4px;border:1px dashed #c8c8c8;background:#f8f8f8;color:#5c5c5c;display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:600;text-align:center}.hub-rail--right{display:flex;flex-direction:column}@media (max-width: 860px){#hub-section-look{grid-column:1 / -1!important}#hub-section-board{grid-column:1 / -1!important;grid-row:8 / span 5!important}#hub-section-mode{grid-row:13 / span 1!important}#hub-section-mode-tiles{grid-row:14 / span 2!important}.play-hub{width:100vw;height:100dvh;grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr) auto;overflow-y:auto}.hub-rail--left{flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px;height:auto;border-right:none;border-bottom:1px solid var(--hub-border-soft);padding:10px 12px}.hub-brand{width:100%;margin-bottom:4px}.hub-sidebar-nav{flex-direction:row;flex-wrap:wrap;row-gap:4px;flex:1;justify-content:center}.hub-rail-foot{flex-direction:row;margin-top:0;padding-top:0;border-top:none;gap:8px}.hub-main{min-height:0}.hub-rail--right{height:auto;border-left:none;border-top:1px solid var(--hub-border-soft);flex-direction:row;gap:10px}.hub-ad-side{flex:1;min-height:100px}.hub-board-tile-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.hub-board-tile{min-height:84px;padding:6px 3px}.hub-mode-tile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#hub-section-look .play-theme-swatch,.hub-page-look-swatch{width:44px;height:44px}.hub-board-preview-grid{max-width:136px}}@media (max-width: 480px){.hub-mode-tile-grid{grid-template-columns:1fr}.hub-lesson-grid{flex-direction:column}.hub-content{padding:14px 14px 10px}}.hub-star-legend{margin:8px 2px 0;font-size:.72rem;color:var(--hub-centre-muted, var(--hub-muted))}.hub-current-board{margin:0;font-size:.78rem;color:var(--hub-centre-muted, var(--hub-muted));text-align:right}.hub-legal-links{display:none;margin:14px 0 4px;text-align:center;font-size:.78rem;color:var(--hub-centre-muted, var(--hub-muted))}.hub-legal-links a{color:inherit}@media (max-width: 860px){#hub-section-mode{grid-row:2 / span 1!important}#hub-section-mode-tiles{grid-row:3 / span 2!important}#hub-section-board{grid-row:5 / span 5!important}#hub-section-look{grid-row:10 / span 5!important}.hub-rail--left{padding:6px 10px;gap:6px}.hub-rail--left .hub-brand-block,.hub-rail--left .hub-sidebar-link--active,.hub-rail--left .hub-sidebar-spacer,.hub-rail--left .hub-rail-foot{display:none}.hub-sidebar-link{padding:8px 6px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}.hub-mode-tile{min-height:44px}.hub-legal-links a{display:inline-flex;align-items:center;min-height:44px;padding:0 6px}.hub-ad-side{min-height:56px}.hub-hero{margin-bottom:10px}.hub-legal-links{display:block}}