.chess-main{max-width:1180px;margin:64px auto 0;padding:36px 24px 64px}.chess-intro{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:24px}.chess-intro h1{font:400 2rem/1.15 Georgia,serif;margin:0 0 10px}.chess-intro p{margin:0;color:var(--text-secondary)}.chess-intro>a{white-space:nowrap}.chess-page button,.chess-page summary{min-height:44px}.chess-page button{cursor:pointer}.chess-page button:disabled{cursor:default;opacity:.55}.chess-game[hidden]{display:none}.chess-game{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"first second" "toolbar toolbar" "rocker rocker";gap:16px;outline-offset:5px}.chess-face{border:2px solid var(--border);border-radius:8px;background:var(--card-bg);color:var(--text);padding:24px 16px;min-width:0;min-height:260px;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.chess-first{grid-area:first}.chess-second{grid-area:second}.chess-face-content{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-width:0}.chess-color{font-size:1.25rem;font-weight:650}.chess-time{font-size:clamp(3.5rem,8vw,6.5rem);font-weight:650;font-variant-numeric:tabular-nums;line-height:1.05;letter-spacing:-.035em;white-space:nowrap}.chess-turn{font-size:.9375rem;min-height:1.5em}.chess-face.is-active{background:var(--accent);border-color:var(--accent);color:var(--bg)}.chess-face.is-active .chess-color::before{content:"";display:inline-block;width:9px;height:9px;margin-right:8px;border-radius:50%;background:currentColor}.chess-face.is-active:active{filter:brightness(.94)}.chess-face.is-flagged{border-width:4px;border-style:double}.chess-opposed .chess-first .chess-face-content{transform:rotate(180deg)}.chess-toolbar{grid-area:toolbar;align-self:center;position:relative}.chess-main-controls{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}.chess-main-controls>span{font-size:.9375rem;font-variant-numeric:tabular-nums;color:var(--text-secondary)}.chess-main-controls button,.chess-main-controls summary,.chess-dialog button,.chess-focus>header button{padding:10px 16px;border:1px solid var(--border);border-radius:5px;background:var(--card-bg);color:var(--text);font:inherit}.chess-main-controls .btn-primary,.chess-dialog .btn-primary{background:var(--accent);color:var(--bg);border-color:var(--accent)}.chess-main-controls summary{list-style:none;cursor:pointer}.chess-main-controls summary::-webkit-details-marker{display:none}.chess-message{font-size:.9375rem;color:var(--text-secondary);text-align:center;margin:10px 0 0;min-height:1.5em}.chess-more-panel{position:absolute;right:0;bottom:100%;z-index:10;width:min(340px,90vw);max-height:min(360px,60dvh);overflow:auto;background:var(--card-bg);border:1px solid var(--border);padding:12px;box-shadow:0 8px 20px #0002}.chess-more-panel button{display:block;width:100%;text-align:left;margin:0 0 6px}.chess-more-panel p{font-size:.875rem;color:var(--text-secondary);line-height:1.5}.chess-rocker{grid-area:rocker;background:var(--bg-alt);color:var(--text);border:1px solid var(--border);border-radius:5px;padding:16px;font:inherit;font-size:1.125rem}.chess-rocker span{margin-left:12px;color:var(--text-secondary);font-size:.875rem}.chess-notice:empty{display:none}.chess-notice{padding:12px;border:1px solid var(--border);font-size:.9375rem}.chess-policy{color:var(--text-secondary);font-size:.9375rem;line-height:1.6;margin:22px 0 32px}.chess-settings-form{border-top:1px solid var(--border);padding-top:28px}.chess-settings-form fieldset{border:0;margin:0;padding:0}.chess-settings-form legend{font-weight:650;font-size:1.25rem;margin-bottom:18px}.chess-settings-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.chess-page label{display:block;font-size:.9375rem}.chess-page input[type=number],.chess-page select{display:block;width:100%;min-height:44px;margin-top:7px;padding:10px 12px;font:inherit;border:1px solid var(--input-border);background:var(--input-bg);color:var(--text);border-radius:4px}.chess-page input:disabled,.chess-page select:disabled{opacity:.6}.chess-presets{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}.chess-presets button{padding:10px 20px;font:inherit;font-variant-numeric:tabular-nums;border:1px solid var(--border);border-radius:5px;background:var(--card-bg);color:var(--text)}.chess-presets button:hover:not(:disabled){border-color:var(--accent)}.chess-options{display:flex;gap:16px 28px;flex-wrap:wrap;margin:20px 0}.chess-options label{display:flex;align-items:center;gap:10px;min-height:44px}.chess-options input{width:20px;height:20px;accent-color:var(--accent)}.chess-help{border-top:1px solid var(--border);margin-top:36px;padding-top:28px;max-width:72ch;line-height:1.7}.chess-help h2{font-size:1.375rem;margin:24px 0 10px}.chess-help p{color:var(--text-secondary)}.chess-dialog{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:28px;max-width:min(520px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto}.chess-dialog::backdrop,.chess-focus::backdrop{background:#0009}.chess-dialog h2{font-size:1.5rem;margin:0 0 16px}.chess-dialog p{line-height:1.6}.chess-dialog label{margin-bottom:16px}.chess-dialog-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}.chess-focus{position:fixed;inset:0;max-width:none;max-height:none;width:100%;height:100%;height:100dvh;margin:0;border:0;padding:12px max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:var(--bg);color:var(--text);overflow:auto}.chess-focus[open]{display:flex;flex-direction:column;gap:12px}.chess-focus>header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:none;min-height:44px}.chess-focus>.chess-game{flex:1;min-height:0;grid-template-rows:minmax(0,1fr) auto auto}.chess-focus .chess-face{min-height:0;display:flex;justify-content:center;align-items:center}.chess-focus .chess-time{font-size:clamp(3rem,12vw,10rem)}.chess-focus-open{overflow:hidden}.chess-page :focus-visible{outline:3px solid var(--accent);outline-offset:4px}.chess-face.is-active:focus-visible{outline-color:var(--text)}
@media(max-width:700px) and (orientation:portrait){.chess-main{padding:24px 16px 40px}.chess-intro{display:block}.chess-intro h1{font-size:1.625rem}.chess-intro>a{display:inline-block;margin-top:12px}.chess-game{grid-template-columns:1fr;grid-template-areas:"first" "toolbar" "second";gap:12px}.chess-face{min-height:190px;padding:18px 12px}.chess-time{font-size:4.5rem}.chess-rocker{display:none}.chess-settings-grid{grid-template-columns:1fr 1fr}.chess-settings-grid label:nth-last-child(-n+2){grid-column:1/-1}.chess-main-controls{gap:8px}.chess-main-controls>span{font-size:.8125rem}.chess-main-controls button,.chess-main-controls summary{padding:10px 12px;font-size:.875rem}.chess-message{font-size:.8125rem}.chess-focus>.chess-game{grid-template-rows:minmax(0,1fr) auto minmax(0,1fr)}.chess-focus .chess-time{font-size:clamp(3rem,17vw,6rem)}.chess-focus .chess-face-content{gap:7px}.chess-focus .chess-turn{font-size:.8125rem}}
@media(max-height:480px) and (orientation:landscape){.chess-focus{padding:6px 12px}.chess-focus[open]{gap:8px}.chess-focus>.chess-game{gap:12px;grid-template-rows:minmax(0,1fr) auto}.chess-focus .chess-rocker{display:none}.chess-focus .chess-time{font-size:clamp(2.5rem,10vh,4rem)}.chess-focus .chess-face{padding:8px}.chess-focus .chess-face-content{gap:4px}.chess-focus .chess-color{font-size:1rem}.chess-focus .chess-turn,.chess-focus .chess-message{font-size:.75rem}.chess-focus .chess-message{margin-top:4px}.chess-focus>header{font-size:.875rem}.chess-settings-grid{grid-template-columns:1fr 1fr}}
@media(forced-colors:active){.chess-face.is-active{background:Highlight;color:HighlightText;border-color:Highlight}.chess-face.is-active .chess-color::before{background:HighlightText}.chess-face.is-flagged{border:4px double CanvasText}}
@media(prefers-reduced-motion:reduce){.chess-game *{transition:none;animation:none}}
/* Mechanical surfaces move independently from the fixed text and hit targets. */
.chess-face,.chess-rocker{position:relative;isolation:isolate;background:var(--bg-alt);border-color:transparent;filter:none!important;overflow:visible}
.chess-face::before,.chess-rocker::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border:1px solid var(--border);border-radius:inherit;background:var(--card-bg);box-shadow:0 3px 0 var(--input-border),0 6px 10px rgb(0 0 0 / .12),inset 0 1px 0 rgb(255 255 255 / .45);transform:translateY(-2px);transition:transform 90ms cubic-bezier(.2,.8,.2,1)}
.chess-face-content{position:relative}
.chess-face.is-active{background:var(--bg-alt);color:var(--bg)}
.chess-face.is-active::before{background:var(--accent);border-color:var(--accent);transform:translateY(-3px)}
.chess-game[data-phase=running] .chess-face:not(.is-active)::before{transform:translateY(0)}
.chess-face.is-pressed::before{transform:translateY(0);transition-duration:45ms}
.chess-rocker:not(:disabled):active::before{transform:translateY(0)}
.chess-face.is-flagged{border-color:var(--text);border-style:double}
[data-theme=dark] .chess-face::before,[data-theme=dark] .chess-rocker::before{box-shadow:0 3px 0 var(--input-border),0 6px 10px rgb(0 0 0 / .25),inset 0 1px 0 rgb(255 255 255 / .13)}
@media(hover:hover) and (pointer:fine){.chess-face.is-active:hover::before{border-color:var(--text)} }
.chess-control-summary{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 20px;flex-wrap:wrap}
.chess-control-summary>div{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.chess-control-summary button,.chess-editor-actions button,.chess-notice button{font:inherit;padding:10px 14px;border:1px solid var(--border);background:var(--card-bg);color:var(--text);border-radius:5px}
.chess-editor{border-block:1px solid var(--border);padding:12px 0;margin-bottom:24px}
.chess-editor>summary{cursor:pointer;min-height:44px;padding:10px 0;font-weight:600}
.chess-editor .chess-settings-form{border:0;padding:16px 0}
.chess-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.chess-presets button{display:flex;flex-direction:column;gap:5px;text-align:left;padding:14px;min-width:0}
.chess-presets button span{font-size:.875rem}.chess-presets button small{font-size:.75rem;color:var(--text-secondary)}
.chess-presets button[aria-pressed=true]{border:2px solid var(--accent);padding:13px;background:var(--bg-alt)}
.chess-presets button[aria-pressed=true] strong::after{content:" · Выбрано";font-size:.75rem;color:var(--accent)}
.chess-editor-actions{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0}
.chess-editor-actions .btn-primary{background:var(--accent);color:var(--bg)}
#chessDraftPreview,#chessPresetChoice{line-height:1.6}
@media(max-width:600px){.chess-presets{grid-template-columns:repeat(2,minmax(0,1fr))}.chess-control-summary{gap:12px}.chess-control-summary strong{font-size:1rem}}
@media(prefers-reduced-motion:reduce){.chess-face::before,.chess-rocker::before{transition:none;transform:none!important}.chess-face.is-pressed::before{border:3px double var(--text)}}
@media(forced-colors:active){.chess-face,.chess-rocker{border:1px solid ButtonText}.chess-face::before,.chess-rocker::before{box-shadow:none}.chess-face.is-active::before{background:Highlight;border-color:Highlight}.chess-face.is-active{color:HighlightText}}

.chess-dialog{margin:auto;inset:0}

/* Physical clock language: a substantial rocker and deep push surfaces. */
.chess-game{padding:20px;background:var(--bg-alt);border:1px solid var(--border);border-radius:20px;grid-template-areas:"rocker rocker" "first second" "toolbar toolbar";box-shadow:inset 0 1px 0 rgb(255 255 255 / .35),0 7px 14px rgb(0 0 0 / .08);gap:24px}
.chess-face{border-radius:14px;background:var(--input-border);padding:28px 18px}
.chess-face::before{inset:0 0 4px;border-radius:14px;box-shadow:0 7px 0 var(--input-border),0 9px 8px rgb(0 0 0 / .16),inset 0 2px 0 rgb(255 255 255 / .55);transform:translateY(-5px)}
.chess-face.is-active::before{transform:translateY(-7px)}
.chess-face.is-pressed::before{transform:translateY(0)}
[data-theme=dark] .chess-face::before{box-shadow:0 7px 0 var(--input-border),0 9px 8px rgb(0 0 0 / .35),inset 0 2px 0 rgb(255 255 255 / .22)}
.chess-rocker{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-radius:18px;padding:14px 28px;background:var(--input-border)}
.chess-rocker::before{inset:2px 0 8px;border-radius:18px;background:var(--card-bg);border:1px solid var(--input-border);box-shadow:0 8px 0 var(--input-border),0 12px 10px rgb(0 0 0 / .2),inset 0 3px 0 rgb(255 255 255 / .6);transform:translateY(-5px);transition:transform 95ms cubic-bezier(.2,.8,.2,1)}
.chess-rocker::after{content:"";position:absolute;bottom:1px;left:calc(50% - 12px);width:24px;height:7px;border-radius:5px;background:var(--text-secondary);pointer-events:none;z-index:-1}
.chess-rocker span{margin:0;color:inherit}.chess-rocker .rocker-side{font-size:.875rem;color:var(--text-secondary)}
.rocker-action{display:flex;flex-direction:column;gap:5px;font-size:1.125rem;font-weight:600}.rocker-action>span{font-size:.8125rem;font-weight:400;color:var(--text-secondary)}
.chess-game[data-phase=running][data-active-side=first] .chess-rocker::before{transform:translateY(-5px) rotate(-.7deg)}
.chess-game[data-phase=running][data-active-side=second] .chess-rocker::before{transform:translateY(-5px) rotate(.7deg)}
.chess-game .chess-rocker:not(:disabled):active::before{transform:translateY(0) rotate(0)}
.chess-rocker:disabled{opacity:1;color:var(--text-muted)}
.chess-focus>.chess-game{grid-template-rows:auto minmax(0,1fr) auto}
@media(max-width:700px) and (orientation:portrait){.chess-game{padding:14px;gap:20px;grid-template-areas:"first" "toolbar" "second"}.chess-rocker{display:none}.chess-focus>.chess-game{grid-template-rows:minmax(0,1fr) auto minmax(0,1fr)}.chess-face{min-height:180px}.chess-focus .chess-face{padding:12px}}
@media(max-height:480px) and (orientation:landscape){.chess-focus>.chess-game{padding:10px;grid-template-rows:minmax(0,1fr) auto;grid-template-areas:"first second" "toolbar toolbar";gap:16px}.chess-focus .chess-rocker{display:none}}
@media(prefers-reduced-motion:reduce){.chess-game .chess-rocker::before,.chess-game .chess-face::before{transform:none!important;transition:none}}
@media(forced-colors:active){.chess-game,.chess-face,.chess-rocker{box-shadow:none}.chess-face::before,.chess-rocker::before{box-shadow:none;border:2px solid ButtonText}}

#chessLockedControl{border:0;padding:4px 0;margin:0 0 16px}
.chess-focus .chess-face{container-type:inline-size}
.chess-focus .chess-time{font-size:clamp(2rem,18cqw,10rem)}

/* The lever carries the depth; displays stay quiet. */
.chess-game{box-shadow:none;background:var(--bg-alt);gap:20px}
.chess-face::before,[data-theme=dark] .chess-face::before{box-shadow:0 2px 4px rgb(0 0 0 / .12);transform:translateY(-2px)}
.chess-face.is-active::before{transform:translateY(-2px)}
.chess-face.is-pressed::before{transform:translateY(0)}
.chess-rocker{min-height:112px;padding:22px 28px}
.chess-rocker .rocker-side{font-size:1rem;font-weight:600;color:var(--text)}
.chess-rocker .rocker-action{font-size:1.25rem}
.chess-control-summary{margin-bottom:8px}
.chess-editor>summary{display:none}.chess-editor:not([open]){display:none}.chess-editor[open]{border-top:0}
#chessControl{display:none}
@media(max-width:700px) and (orientation:portrait){.chess-game{gap:16px}.chess-face::before{box-shadow:0 2px 4px rgb(0 0 0 / .12)}}
@media(prefers-reduced-motion:reduce){.chess-face::before,.chess-face.is-active::before{transform:none!important}}

.chess-face{box-shadow:none}