.app-shell{max-width:1240px}main{gap:34px;grid-template-columns:minmax(0,1fr) 330px}.header{height:88px}.panel-heading{margin-bottom:14px}.robot-opponent[hidden]{display:none}.robot-opponent{margin-top:17px}.robot-scene{position:relative;overflow:hidden;border:1px solid #46515c;border-radius:10px;aspect-ratio:1.85;background:#101821}.robot-scene img{width:100%;height:100%;object-fit:cover;display:block;object-position:center 48%}.robot-scene:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#0c131fe8);pointer-events:none}.robot-scene-caption{position:absolute;bottom:12px;left:14px;right:14px;z-index:1;display:flex;justify-content:space-between;align-items:center;font-size:.875rem;font-weight:600;text-shadow:0 1px 5px #000}.robot-scene-caption b{font:600 .75rem ui-monospace,monospace;color:var(--accent);margin:0 9px}.robot-scene-caption>span:last-child{background:#0c131fba;border:1px solid #b3754299;padding:4px 9px;border-radius:6px;color:#ffd5a8;font:.875rem ui-monospace,monospace}.robot-scene.thinking{border-color:#edaa72;box-shadow:0 0 0 2px #f4a36a25}.robot-scene.thinking img{animation:robot-focus 1.8s ease-in-out infinite alternate}.difficulty-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:17px 0 10px;font-size:.875rem}.difficulty-heading>label{color:#c6cfda}.difficulty-heading>strong{color:var(--accent);font-size:.875rem;font-weight:500}.level-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:4px}.level-button{padding:0;min-width:0;min-height:36px;border:1px solid #42505e;border-radius:5px;background:#1b2531;color:#e4e9ef;font:500 .875rem ui-monospace,monospace}.level-button:hover{border-color:var(--accent);background:#303237}.level-button[aria-pressed='true']{background:var(--accent);border-color:var(--accent);color:#1c2127;font-weight:700}.level-description{font-size:.875rem;line-height:1.6;color:var(--muted);margin:10px 0 0;min-height:22px;word-break:keep-all}.status-block{padding:20px 0 17px;min-height:120px}.status-block h2{font-size:1.25rem;margin:7px 0}.players{grid-template-columns:1fr 1fr;gap:8px}.player{padding:12px 10px;gap:8px;align-content:start;flex-wrap:wrap}.player-stone{width:29px;height:29px}.player strong{font-size:.875rem}.turn-tag{width:100%;margin-left:37px;margin-top:-3px}.match-stats{margin:17px 0}.actions{grid-template-columns:1fr 1fr}.actions button{padding:12px 7px;font-size:.875rem}.rules{margin-top:19px;padding-top:15px}.board-heading{margin-bottom:20px}.board-caption{margin-top:15px}footer{padding-top:17px}@keyframes robot-focus{from{filter:brightness(1)}to{filter:brightness(1.12)}}@media(max-width:1000px){main{grid-template-columns:minmax(0,1fr) 300px;gap:24px}.app-shell{padding:0 24px}.level-grid{gap:3px}.level-button{min-height:34px}.board-caption .keyboard-hint{display:none}}@media(max-width:760px){.app-shell{padding:0 18px;max-width:600px}.header{height:76px}main{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;padding-top:24px}.game-panel{display:contents}.play-section{grid-column:1;grid-row:2}.panel-heading{display:none}.mode-switch{grid-column:1;grid-row:1}.robot-opponent{grid-column:1;grid-row:3;display:grid;grid-template-columns:126px minmax(0,1fr);gap:0 14px;margin-top:0}.robot-opponent .robot-scene{grid-row:1/4;aspect-ratio:auto;min-height:154px}.robot-scene img{object-position:58% center}.robot-scene-caption{left:8px;right:8px;bottom:9px;display:block;font-size:.75rem}.robot-scene-caption b{margin:0 3px}.robot-scene-caption>span:last-child{display:inline-block;margin-top:7px;font-size:.75rem}.difficulty-heading{margin:0 0 9px;font-size:.875rem;align-items:flex-start;flex-direction:column;gap:4px}.level-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}.level-button{min-height:33px}.level-description{margin-top:8px;font-size:.8125rem;min-height:0}.status-block{grid-row:4;min-height:0;padding:0}.players{grid-row:5}.match-stats{grid-row:6;margin:0}.actions{grid-row:7}.rules{grid-row:8;margin:0}.robot-opponent[hidden]{display:none}.board-heading{margin-bottom:17px}h1{font-size:1.5rem}.rule-tag{display:block}.board-caption{font-size:.75rem}.player{min-height:73px}.status-block h2{font-size:1.25rem}}@media(max-width:380px){.app-shell{padding:0 12px}.robot-opponent{grid-template-columns:105px minmax(0,1fr);gap:0 10px}.difficulty-heading{font-size:.8125rem}.difficulty-heading>strong{font-size:.8125rem}.robot-scene-caption{font-size:.6875rem}.level-grid{gap:4px}}@media(prefers-reduced-motion:reduce){.robot-scene.thinking img{animation:none}}
/* Main-board robot overlay. Its transparent canvas never intercepts input. */
.board-stage{position:relative;isolation:isolate}.robot-dock{height:auto;aspect-ratio:640/115;position:relative;padding:10px 16px;display:flex;flex-direction:column;justify-content:center;gap:4px;background:linear-gradient(110deg,#20313e,#16222d);border:1px solid #334957;border-radius:12px 12px 0 0;margin-bottom:9px}.robot-dock .eyebrow{font-size:.625rem;letter-spacing:.15em;margin:0;color:#90b9c5}.robot-dock strong{font-size:.9375rem;font-weight:500}.robot-dock>span:last-child{font-size:.75rem;color:#b7c8d2}.main-robot-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:5;pointer-events:none}.local-match .robot-dock,.local-match .main-robot-canvas{display:none}.motion-toggle{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:8px;padding:7px;border:1px solid #3b4d5c;border-radius:6px;background:#1c2934;color:#a9bac8;font-size:.75rem}.motion-toggle[aria-pressed=true]{color:#bdeef1;border-color:#4a7279}.motion-led{width:6px;height:6px;border-radius:50%;background:#71808d}.motion-toggle[aria-pressed=true] .motion-led{background:#81dfdf;box-shadow:0 0 7px #81dfdf70}.motion-toggle:hover{background:#2a3d4a}@media(max-width:760px){.robot-opponent .motion-toggle{grid-column:1/-1;grid-row:4;margin-top:12px}.robot-dock{padding:6px 10px;gap:2px}.robot-dock .eyebrow{display:none}.robot-dock strong{font-size:.75rem}.robot-dock>span:last-child{font-size:.625rem}}
/* Approved design: keep the original layout, upgrade only materials and robot. */
.robot-dock{aspect-ratio:640/205;background:none;border:0;border-radius:0;margin-bottom:0;justify-content:flex-end;padding:0 10px 16px;gap:5px}.robot-dock .eyebrow,.robot-dock strong{display:none}.robot-dock>span:last-child{font-size:.75rem;color:#a6b7bf;max-width:42%}.board-frame{padding:14px;background:linear-gradient(135deg,#fff0c17a,transparent 15%,#5a301c44 85%),url('./assets/kaya-wood.png') center/cover;border:1px solid #dfb77f;border-radius:6px;box-shadow:0 8px 0 #6b482d,0 12px 3px #0b0c0e50,0 22px 40px #0005,inset 3px 3px 2px #ffe4b8,inset -3px -4px 2px #805530}.board{background:linear-gradient(110deg,#fff2d52b,#b7833820),url('./assets/kaya-wood.png') center/cover;border-radius:0;box-shadow:inset 0 0 0 1px #7c542a88,inset 0 0 24px #9d6d2920}.stone.black,.player-stone.black{background:radial-gradient(ellipse at 32% 24%,#97958d 0%,#53544f 8%,#222622 25%,#090e0c 60%,#030605 85%,#31332c 100%);box-shadow:2px 5px 5px #422a1580,inset -2px -3px 3px #000,inset 1px 1px 2px #bbb5a050}.stone.white,.player-stone.white{background:radial-gradient(ellipse at 31% 24%,#fff 0%,#fffdf7 25%,#f3eddf 58%,#d1c8b7 87%,#b7ad99 100%);box-shadow:2px 5px 5px #422a1560,inset 1px 1px 2px #fff,inset -1px -2px 2px #b4a68d70}.cell.last .stone:after{inset:40%;background:#f2a665;box-shadow:0 0 0 1px #57331166}.board-caption{margin-top:22px}@media(max-width:760px){.board-frame{padding:9px}.robot-dock{padding:0 4px 9px}.robot-dock>span:last-child{font-size:.625rem}.board-caption{margin-top:19px}}
/* Let the robot occupy the existing heading's right-hand space. */
.robot-dock{aspect-ratio:640/85;padding-bottom:10px}.main-robot-canvas{top:-120px;height:calc(100% + 120px)}@media(max-width:1000px) and (min-width:761px){.main-robot-canvas{top:-90px;height:calc(100% + 90px)}}@media(max-width:760px){.main-robot-canvas{top:-60px;height:calc(100% + 60px)}.robot-dock{padding-bottom:5px}.board-heading>div{max-width:55%}.board-heading .rule-tag{display:none}}
.header-tools{display:flex;align-items:center;gap:20px}.sound-control{position:relative;z-index:30}.sound-button{width:42px;height:42px;display:grid;place-items:center;border:1px solid #40505d;border-radius:50%;color:#ebdbca;background:#1a2631}.sound-button:hover,.sound-button[aria-expanded=true]{background:#34404a;border-color:var(--accent)}.sound-button svg{width:21px;height:21px}.sound-muted{display:none}.sound-button[data-muted=true] .sound-muted{display:block}.sound-button[data-muted=true] .sound-waves{display:none}.sound-panel[hidden]{display:none}.sound-panel{position:absolute;right:0;top:52px;width:272px;max-width:calc(100vw - 32px);padding:20px;background:#1b2631;border:1px solid #4a5865;box-shadow:0 16px 50px #0007;border-radius:13px;z-index:50}.sound-panel>strong{font-size:1rem}.sound-panel>p{color:var(--muted);font-size:.75rem;line-height:1.6;margin:6px 0 14px}.sound-panel fieldset{border:0;padding:0;margin:0 0 15px;display:grid;gap:6px}.sound-panel fieldset label{display:grid;grid-template-columns:20px 1fr;align-items:center;column-gap:7px;border:1px solid transparent;padding:8px;border-radius:7px;font-size:.875rem;cursor:pointer}.sound-panel fieldset label:has(input:checked){background:#354047;border-color:#a37955}.sound-panel input{accent-color:var(--accent)}.sound-panel small{grid-column:2;font-size:.6875rem;color:var(--muted);margin-top:3px}.volume-label{display:flex;justify-content:space-between;color:var(--muted);font-size:.75rem}.sound-panel input[type=range]{width:100%;margin:12px 0}.sound-panel>button{width:100%;padding:9px;border:1px solid #596572;border-radius:6px;background:transparent;color:var(--text);font-size:.8125rem}.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}@media(max-width:760px){.header-tools{gap:8px}.header-tools .header-note{display:none}.sound-button{width:40px;height:40px}}

/* Preserve refined stones; all other styling is the published baseline. */

.cell .stone{width:91%;height:91%;aspect-ratio:1;border-radius:50%}
.stone.black,.player-stone.black{background:radial-gradient(ellipse at 29% 24%,#9c9e9f 0%,#505254 12%,#181a1b 35%,#050607 67%,#121414 91%,#414344 100%);box-shadow:1px 3px 3px #38230e70,inset -1px -2px 2px #000,inset 1px 1px 1px #c6c4bd35}
.stone.white,.player-stone.white{background:repeating-linear-gradient(145deg,transparent 0 3px,#c4b99d0d 3.4px 4px,transparent 4.4px 7px),radial-gradient(circle at 32% 25%,#fff 0%,#fbfaf4 23%,#ece7dc 62%,#cbc3b4 86%,#a99e8c 100%);box-shadow:1px 3px 3px #38230e60,inset 1px 1px 2px #fff,inset -1px -2px 2px #aa9c8670}
.cell.last .stone:after{inset:auto -8% -11%;height:18%;border:1px solid #ffe2ae;border-top:0;border-radius:0;background:none;box-shadow:none}

.stone.white,.stone.black,.player-stone.white,.player-stone.black{background-image:url('./assets/stones-shell-slate.png');background-size:227.44% 113.72%;background-repeat:no-repeat;box-shadow:none;filter:drop-shadow(1px 3px 2px #37230c75)}
.stone.white,.player-stone.white{background-position:6% 50%}
.stone.black,.player-stone.black{background-position:94.4% 50%}


/* Original reference: deep ink background and compact two-stone wordmark. */
:root{--bg:#09171c;--surface:#111f27;--line:#22333c;--muted:#99aab5;color-scheme:dark}
html{background:#09171c;color-scheme:dark}
body{background:radial-gradient(ellipse at 45% 0%,#10242b 0%,#0b1b21 45%,#08151a 100%);background-attachment:fixed}
.brand{gap:10px;font-size:18px;letter-spacing:-.045em;font-weight:400;color:#f1f2f0}
.brand strong{font-weight:800}
.brand-mark{width:24px;height:26px}
.brand-mark i{width:15px;height:15px;left:0;top:0;border:0;background:#edf2f1;box-shadow:0 1px 2px #0003}
.brand-mark i+i{left:9px;top:10px;background:#ffa365}
.mode-switch{background:#09151c;border-color:#2a3b45}
.player{background:#12212a;border-color:#293b45}
.player.active{background:#202728;border-color:#d7905d}
.sound-button{background:#11232c;border-color:#304550}
@media(max-width:760px){.brand{font-size:17px;gap:9px}}

/* Keep essential game controls visible and selected levels legible. */
.level-grid{overflow:visible}
.level-button{display:grid;place-items:center;opacity:1;visibility:visible;color:#e8eef2;background:#182a34}
.level-button[aria-pressed='true'],.level-button[aria-pressed='true']:hover,.level-button[aria-pressed='true']:focus{background:#ffa365;color:#132129;border-color:#ffbb86;box-shadow:0 0 0 1px #ffa36555;font-weight:800;opacity:1}
@media(min-width:761px){
.game-panel{align-self:start;position:sticky;top:16px;max-height:calc(100dvh - 32px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#40525d transparent;padding-right:6px;padding-bottom:8px}
.game-panel>.actions{margin:12px 0 16px;position:static;padding:0;background:transparent;box-shadow:none}
.game-panel>.actions button{min-height:44px}
}

/* New game must remain visible without pointer hover. */
#new-game{background-color:#ffa365!important;background-image:none!important;color:#172027!important;border:1px solid #ffb47e!important;opacity:1!important;visibility:visible!important;min-height:46px;box-shadow:0 2px 5px #0003;-webkit-text-fill-color:#172027}
#new-game svg{color:#172027;stroke:currentColor;opacity:1}
#new-game:hover{background-color:#ffb984!important;border-color:#ffc99f!important}
#new-game:active{background-color:#f79454!important}
#new-game:focus-visible{outline:3px solid #ffe0bb;outline-offset:3px}