.container.play{grid-template-columns:minmax(0,560px) minmax(0,1fr);align-items:start;gap:48px;max-width:1100px;display:grid}.play-board{aspect-ratio:1;width:100%}.play .hint{color:var(--slate);font-size:14px}.play-status{background:var(--white);box-shadow:inset 0 0 0 1px var(--ink);font:800 22px/1.3 var(--serif);padding:16px 20px}.play-actions{flex-wrap:wrap;gap:12px;display:flex}.play [hidden]{display:none}#play-error{color:#b00020}.play-moves{columns:2;font-variant-numeric:tabular-nums;max-height:240px;padding-left:32px;overflow:auto}.play-moves li{break-inside:avoid;padding:3px 8px}@media (width<=860px){.container.play{grid-template-columns:minmax(0,1fr);gap:24px}}.play-board-section{min-width:0}.play-practice{background:var(--white);box-shadow:inset 0 0 0 1px var(--ink);border-radius:4px;margin:0 0 16px;padding:14px 18px}.play-practice p{margin:0}.play-practice-title{font:800 20px/1.3 var(--serif)}.play-practice-title span{color:var(--blue);font:700 12px var(--sans);letter-spacing:.12em;text-transform:uppercase;display:block}.play-practice .hint+.hint{margin-top:4px}.play-configuration{border-top:1px solid var(--ink);margin-top:24px;padding-top:20px}.play-configuration h2{font:800 22px/1.3 var(--serif);margin:0 0 16px}.play-next-game{border:0;min-width:0;margin:0;padding:0}.play-next-game legend{margin-bottom:10px;padding:0;font-weight:600}.play-options{border:1px solid var(--ink);border-radius:8px;grid-template-columns:repeat(3,minmax(0,1fr));display:grid;overflow:hidden}.play-options label{cursor:pointer;display:flex;position:relative}.play-options label+label{border-left:1px solid var(--ink)}.play-options input{opacity:0;width:1px;height:1px;position:absolute}.play-options span{text-align:center;background:var(--white);color:var(--ink);flex:1;justify-content:center;align-items:center;padding:12px 8px;font-weight:600;display:flex}.play-options label:hover span{text-underline-offset:4px;text-decoration:underline}.play-options input:checked+span{background:var(--ink);color:var(--white)}.play-options input:focus-visible+span{outline-offset:-5px;outline:2px solid}.play-next-game .hint{margin:10px 0 0;line-height:1.5}.play-next-game+.play-next-game,.play-opening{margin-top:24px}.play-opening>label{margin-bottom:10px;font-weight:600;display:block}.play-opening-picker{position:relative}#play-opening-search{box-sizing:border-box;border:1px solid var(--ink);background:var(--white);width:100%;min-height:48px;color:var(--ink);font:inherit;border-radius:8px;padding:12px 44px 12px 14px}#play-opening-search:focus-visible{outline:2px solid var(--ink);outline-offset:3px}#play-opening-search::-webkit-search-cancel-button{appearance:none}.play-opening-x{width:44px;height:48px;color:color-mix(in srgb, var(--slate) 75%, var(--white));font:400 26px/1 var(--sans);cursor:pointer;background:0 0;border:0;padding:0;position:absolute;top:0;right:0}.play-opening-x:hover{color:var(--ink)}.play-opening-x:focus-visible{outline:2px solid var(--ink);outline-offset:-8px;border-radius:8px}.play-opening-options{z-index:5;border:1px solid var(--ink);background:var(--white);border-radius:8px;max-height:320px;padding:6px;position:absolute;top:calc(100% + 6px);left:0;right:0;overflow-y:auto;box-shadow:0 8px 20px #0002}.play-opening-option{cursor:pointer;overflow-wrap:anywhere;border-radius:4px;padding:10px 12px}.play-opening-option[aria-selected=true]{background:var(--ink);color:var(--white)}.play-opening-option small{margin-top:4px;font-size:12px;line-height:1.5;display:block}.play-opening-option:hover{text-underline-offset:3px;text-decoration:underline}.play-opening .hint{line-height:1.5}#play-opening-clear{font:inherit;cursor:pointer}.container.play.stockfish{grid-template-areas:"board panel""next panel";gap:0 48px}.stockfish .play-board-section{grid-area:board}.stockfish .play-panel{grid-area:panel}.stockfish .play-configuration{grid-area:next}@media (width<=860px){.container.play.stockfish{grid-template-areas:"board""panel""next";row-gap:24px}.stockfish .play-configuration{margin-top:0}}.play .play-title{margin:0 0 16px;font-size:clamp(2rem,1.5rem + 2vw,2.75rem)}.stockfish .play-actions+.hint{margin-top:16px}.play-level{font-weight:600}
