:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--canvas:#242321;--canvas-raised:#292825;--surface-1:#302e2b;--surface-2:#393631;--surface-3:#423e38;--line:#4c4740;--text:#f5f1e8;--text-muted:#b7b0a5;--text-faint:#a49c8f;--accent:#d8ad61;--success:#88a866;--error:#ce6b5e}*{box-sizing:border-box}body{background:var(--canvas);color:var(--text);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:15px}button,input,select{font:inherit}button,a,input,select{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent)}button{border:1px solid var(--line);min-height:44px;color:var(--text);cursor:pointer;background:0 0;border-radius:7px;padding:10px 14px;font-weight:600;transition:background .15s}button:hover{background:var(--surface-2)}button:disabled{opacity:.45;cursor:default}a{color:var(--accent)}.app-shell{--safe-height:calc(env(safe-area-inset-top,0px) + env(safe-area-inset-bottom,0px));max-width:1240px;height:100dvh;padding:env(safe-area-inset-top,0px) max(12px, 2vw, env(safe-area-inset-right,0px)) env(safe-area-inset-bottom,0px) max(12px, 2vw, env(safe-area-inset-left,0px));grid-template-rows:52px minmax(0,1fr) 22px;gap:4px;margin:auto;display:grid}.topbar{justify-content:space-between;align-items:center;gap:12px;display:flex}.brand{color:var(--text);letter-spacing:-1px;flex-shrink:0;align-items:center;gap:8px;font-size:23px;text-decoration:none;display:inline-flex}.brand img{width:32px;height:32px;display:block}.brand-name{font-weight:650}.brand-name>span{color:#c1c3ad;font-weight:380}.topbar nav{align-items:center;gap:6px;display:flex}.topbar button{font-size:13px}.text-button{color:var(--text-muted);border-color:#0000;align-items:center;gap:8px;display:inline-flex}.icon-button{justify-content:center;align-items:center;width:44px;padding:4px;display:inline-flex}.workbench{--board-size:min(760px, calc(100dvh - 260px - var(--safe-height)), calc(96vw - 24px));grid-template-columns:minmax(0, var(--board-size));grid-template-rows:minmax(0,1fr) 116px;place-content:stretch center;min-height:0;display:grid}.board-column{min-width:0;width:var(--board-size);align-self:center}.board-heading,.board-footer{color:var(--text-muted);justify-content:space-between;align-items:center;gap:8px;font-size:12px;display:flex}.board-heading{height:36px}.board-footer{height:24px;color:var(--text-faint)}.last-move{white-space:nowrap;align-items:baseline;gap:7px;min-width:0;display:flex}.last-move strong{color:var(--text);font-size:14px}.move-number{color:var(--text-faint)}.move-route{color:var(--text-muted);font-size:11px}.line-progress{color:var(--text-faint);margin-top:3px;font-size:10px;display:block}.mode-button,.board-flip{color:var(--text-muted);white-space:nowrap;border:0;align-items:center;gap:6px;padding:0 2px;font-size:12px;font-weight:450;display:inline-flex}.board-flip{min-height:24px}.mode-button:hover,.board-flip:hover{color:var(--text);background:0 0}.board-wrap{aspect-ratio:1;touch-action:none;border:2px solid #42493b;border-radius:8px;width:100%;position:relative;box-shadow:0 8px 28px #0003}.square-access{touch-action:none;width:100%;height:100%;position:relative}.square-access:focus-visible{outline-offset:-3px;z-index:5}.chess-piece{pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%;display:block}.context-panel{grid-template-rows:60px 56px;min-height:0;display:grid}.panel-copy{align-content:center;min-height:0;padding:2px 8px}.panel-copy h1:not(.sr-only){letter-spacing:-.3px;margin:0 0 3px;font-size:18px;font-weight:550;line-height:1.2}.panel-copy p{color:var(--text-muted);margin:0;font-size:12px;line-height:1.35}.panel-copy>a{font-size:12px}.is-solved h1{color:#bdd3a5}.panel-actions{border-top:1px solid var(--line);background:var(--surface-1);border-radius:0 0 8px 8px;grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.panel-actions button{white-space:nowrap;border:0;border-radius:0;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-width:0;min-height:56px;padding:5px 2px;font-size:11px;font-weight:500;display:flex}.panel-actions button:first-child{border-radius:0 0 0 8px}.panel-actions button:last-child{border-radius:0 0 8px}.panel-actions .design-icon{width:21px;height:21px}.panel-actions .advance-button.primary{color:var(--accent);background:#d8ad611a}.panel-actions .advance-button.primary:hover{background:#d8ad6130}.primary{background:var(--accent);color:#211d16;border-color:var(--accent);justify-content:space-between;align-items:center;min-height:48px;display:flex}.primary:hover{background:#e5b969}.advance-button{border-color:#81745b;transition:none}.site-footer{min-width:0;color:var(--text-faint);justify-content:space-between;align-items:center;gap:12px;font-size:10px;display:flex}.site-footer>span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.site-footer button{min-height:22px;color:var(--text-muted);border:0;flex-shrink:0;padding:0 2px;font-size:10px}.notice{z-index:40;top:max(60px, env(safe-area-inset-top));border:1px solid var(--line);background:var(--surface-1);border-radius:8px;justify-content:space-between;align-items:center;gap:12px;width:min(520px,100vw - 24px);padding:8px 12px;font-size:13px;display:flex;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 8px 30px #0007}.notice button{border:0;min-width:44px;padding:4px}.design-icon{vertical-align:middle;flex:none;width:20px;height:20px}.mode-button .design-icon,.board-flip .design-icon,.utility-row .design-icon{width:16px;height:16px}.utility-row{flex-wrap:wrap;gap:8px;display:flex}.utility-row button{flex:1;justify-content:center;align-items:center;gap:6px;padding:8px;font-size:13px;display:inline-flex}.review-actions{gap:10px;display:grid}.review-actions>p{margin:0 0 6px}.continuation-button{color:#c7d6b3;background:#88a8661a;border-color:#88a86666;justify-content:space-between;align-items:center;display:flex}.continuation-button:hover{background:#88a8662a}.theme-tags{flex-wrap:wrap;gap:6px;margin:14px 0;display:flex}.theme-tags>span{color:#bacd9f;border:1px solid #a7b78940;border-radius:3px;padding:4px 7px;font-size:10px}.promotion-backdrop{z-index:20;background:#0009;place-items:center;display:grid;position:absolute;inset:0}.promotion{background:var(--surface-1);border-radius:8px;max-width:calc(100% - 12px);margin:6px;padding:12px}.promotion h2{margin:0 0 10px;font-size:16px}.promotion>div{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin-bottom:8px;display:grid}.promotion>div button{flex-direction:column;align-items:center;gap:2px;min-width:0;padding:4px;font-size:10px;display:flex}.promotion>div img{max-width:100%;height:auto}.sheet{color:var(--text);background:0 0;border:0;width:min(500px,100vw - 24px);max-height:calc(100dvh - 32px);padding:0;overflow:visible}.sheet::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#121210b8}.sheet-content{background:var(--surface-1);border:1px solid var(--line);overscroll-behavior:contain;border-radius:10px;max-height:calc(100dvh - 32px);padding:24px;overflow:auto;box-shadow:0 24px 70px #0005}.sheet-header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;display:flex}.sheet-header h2{letter-spacing:-.4px;margin:0;font-size:21px;font-weight:550}.sheet-header button{border:0;justify-content:center;align-items:center;min-width:44px;padding:0;display:inline-flex}.settings-grid{gap:18px;display:grid}.settings-grid label{color:var(--text-muted);flex-direction:column;gap:10px;font-size:13px;display:flex}.settings-grid .toggle{flex-direction:row;justify-content:space-between;align-items:center;min-height:44px}.settings-grid input:not([type=checkbox]),.settings-grid select{background:var(--canvas);border:1px solid var(--line);width:100%;min-height:44px;color:var(--text);border-radius:5px;padding:8px}.settings-grid input[type=range]{accent-color:var(--accent);padding:0}.settings-grid input[type=checkbox]{width:20px;height:20px;accent-color:var(--accent)}.muted,.shortcut-guide{color:var(--text-muted);font-size:13px;line-height:1.7}.shortcut-guide{font-size:11px}.danger{color:#f09283;border-color:#9c584e}.history-list{gap:8px;margin:20px 0;display:grid}.history-list button{text-align:left;justify-content:space-between;align-items:center;gap:20px;padding:14px;display:flex}.history-list button>span:first-child{flex-direction:column;gap:6px;display:flex}.history-list small{color:var(--text-faint);font-size:10px}.history-list button>span:last-child{font-size:11px}.success-text{color:#b9cc9e}.confidence{flex-wrap:wrap;gap:6px;display:flex}.confidence button{font-size:12px}.license-copy{font-size:14px;line-height:1.7}.design-credit{border-bottom:1px solid var(--line);align-items:center;gap:10px;margin-bottom:20px;padding:0 0 18px;font-size:13px;text-decoration:none;display:flex}.empty-practice{text-align:center;color:var(--text-muted);padding:20px 12px 28px}.empty-practice img{opacity:.8;margin:0 auto 16px;display:block}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (width<=899px) and (orientation:portrait),(width<=519px){.app-shell{padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.topbar,.site-footer{padding-inline:10px}.workbench{--board-size:min(760px, calc(100vw - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)), calc(100dvh - 260px - var(--safe-height)))}.board-heading,.board-footer{padding-inline:8px}.board-wrap{border:0;border-radius:0}.sheet{width:100%;max-height:90dvh;margin:auto auto 0}.sheet-content{max-height:90dvh;padding-bottom:calc(24px + env(safe-area-inset-bottom));border-radius:16px 16px 0 0}}@media (width<=599px){.brand{gap:6px;font-size:21px}.brand img{width:28px;height:28px}.topbar nav{gap:2px}.topbar .text-button{justify-content:center;width:40px;padding:0}.practice-label{display:none}}@media (orientation:landscape) and (height<=540px) and (width>=520px){.app-shell{padding-bottom:max(4px, env(safe-area-inset-bottom));grid-template-rows:40px minmax(0,1fr);gap:4px}.site-footer,.board-footer{display:none}.workbench{--board-size:min(760px, calc(100dvh - 132px - var(--safe-height)), calc(96vw - 252px));grid-template-columns:var(--board-size) 236px;grid-template-rows:auto 56px;column-gap:16px}.board-heading{height:28px}.board-heading .mode-button{min-height:28px;font-size:10px}.board-heading .move-route{display:none}.board-heading .last-move{gap:4px}.context-panel{display:contents}.panel-copy{grid-area:1/2;align-self:center;padding:8px}.panel-actions{grid-area:2/1/auto/-1}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
