@font-face{font-family:Inter;src:url('/assets/InterVariable.woff2') format('woff2');font-weight:100 900;font-display:swap}

:root{color-scheme:light;--sdk-ground:#f5f5f7;--sdk-surface:#fff;--sdk-raised:#ececf0;--sdk-text:#1d1d1f;--sdk-muted:#5f6066;--sdk-border:#d2d2d7;--sdk-line:#9b9ba2;--sdk-strong:#4b4b51;--sdk-accent:#0066cc;--sdk-primary:#0071e3;--sdk-primary-ink:#fff;--sdk-peer:#f1f1f4;--sdk-same:#e1ecf9;--sdk-selected:#cfe5ff;--sdk-error:#ad2228;--sdk-error-bg:#fce9e9;--sdk-font:Inter,system-ui,'Malgun Gothic',sans-serif}

:root[data-theme=dark]{color-scheme:dark;--sdk-ground:#0b0b0d;--sdk-surface:#18181b;--sdk-raised:#26262b;--sdk-text:#f5f5f7;--sdk-muted:#b8b8c0;--sdk-border:#48484f;--sdk-line:#65656e;--sdk-strong:#bebec6;--sdk-accent:#74b8ff;--sdk-primary:#5aa9ff;--sdk-primary-ink:#101014;--sdk-peer:#242428;--sdk-same:#273b50;--sdk-selected:#224e78;--sdk-error:#ffadb1;--sdk-error-bg:#4b232b}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px;background:var(--sdk-ground);color:var(--sdk-text);font-family:var(--sdk-font);font-size:16px;line-height:1.6}
body{margin:0}
button,select,input{font:inherit}
button,select{min-height:44px;border:1px solid var(--sdk-border);border-radius:999px;background:var(--sdk-surface);color:var(--sdk-text);padding:8px 18px}
button{cursor:pointer;touch-action:manipulation}
button:hover:not(:disabled){border-color:var(--sdk-text)}
button:disabled{cursor:default;color:var(--sdk-muted)}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--sdk-accent);outline-offset:3px}
h1,h2,h3,p{margin:0}
h1{font-size:32px;letter-spacing:-.03em;font-weight:600;line-height:1.2}
h2{font-size:20px;line-height:1.45;font-weight:600;letter-spacing:-.02em}
h3{font-size:16px;font-weight:600}
p{color:var(--sdk-muted)}
[hidden]{display:none!important}
.sdk-skip{position:fixed;left:16px;top:-100px;z-index:10;background:var(--sdk-surface);padding:8px 16px}
.sdk-skip:focus{top:8px}
.sdk-header{border-bottom:1px solid var(--sdk-border)}
.sdk-header-inner{max-width:1072px;margin:auto;padding:12px 32px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.sdk-brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:600;letter-spacing:-.02em}
.sdk-brand svg{color:var(--sdk-accent)}
.sdk-header nav{display:flex;align-items:center;gap:24px;font-size:14px}
.sdk-plain{border-color:transparent;background:transparent;padding-inline:10px;font-size:14px}
.sdk-primary{background:var(--sdk-primary);color:var(--sdk-primary-ink);border-color:transparent;font-weight:500}
.sdk-primary:hover:not(:disabled){border-color:var(--sdk-primary)}
.sdk-main{max-width:1072px;margin:auto;padding:32px}
.sdk-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:16px}
.sdk-title p{margin-top:8px;font-size:16px}
.sdk-new-controls{display:grid;grid-template-columns:160px 128px auto;align-items:end;gap:8px 12px;flex:none}
.sdk-new-controls label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--sdk-text);min-width:0}
.sdk-new-controls select{width:100%;min-width:0;padding:8px 28px 8px 12px;border-radius:8px;color:var(--sdk-text);font-size:14px}
#sdk-setting-apply{grid-column:1/-1;font-size:12px;color:var(--sdk-muted)}
.sdk-settings-help{margin-bottom:20px;font-size:12px}
.sdk-settings-help p+p{margin-top:4px}
.sdk-workspace{display:grid;grid-template-columns:minmax(0,600px) minmax(0,360px);gap:48px;align-items:start}
.sdk-board-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;margin-bottom:12px;font-size:14px}
.sdk-board-bar strong{font-weight:500}
.sdk-separator{margin:0 8px;color:var(--sdk-muted)}
.sdk-clock{display:flex;align-items:center;gap:8px}
.sdk-clock time{font-variant-numeric:tabular-nums;min-width:46px;text-align:right}
.sdk-board-wrap{position:relative;aspect-ratio:1;background:var(--sdk-surface)}
.sdk-grid{border:2px solid var(--sdk-strong);height:100%;display:grid;grid-template-rows:repeat(9,minmax(0,1fr))}
.sdk-grid-row{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));min-height:0}
.sdk-cell{position:relative;display:flex;align-items:center;justify-content:center;border:0;border-right:1px solid var(--sdk-line);border-bottom:1px solid var(--sdk-line);border-radius:0;padding:0;min-height:0;min-width:0;background:var(--sdk-surface);font-size:clamp(22px,2.4vw,32px);font-weight:600;line-height:1;font-variant-numeric:tabular-nums;color:var(--sdk-text);user-select:none;-webkit-user-select:none}
.sdk-cell:last-child{border-right:0}
.sdk-grid-row:last-child .sdk-cell{border-bottom:0}
.sdk-cell.is-entered{color:var(--sdk-accent);font-weight:400}
.sdk-cell.is-peer{background:var(--sdk-peer)}
.sdk-cell.is-same{background:var(--sdk-same)}
.sdk-cell.is-selected{background:var(--sdk-selected);outline:2px solid var(--sdk-accent);outline-offset:-2px;z-index:1}
.sdk-cell.is-conflict{color:var(--sdk-error);background:var(--sdk-error-bg);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.sdk-cell.is-conflict.is-selected{outline-color:var(--sdk-error)}
.sdk-cell:hover:not(:disabled){border-color:var(--sdk-line)}
.sdk-cell:focus-visible{outline:3px solid var(--sdk-accent);outline-offset:-4px;z-index:2}
.sdk-cell:disabled{color:var(--sdk-text)}
.sdk-cell.is-entered:disabled{color:var(--sdk-accent)}
.sdk-pencil{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:88%;height:88%;font-size:clamp(11px,1vw,13px);font-weight:400;line-height:1;color:var(--sdk-muted)}
.sdk-pencil span{display:flex;align-items:center;justify-content:center}
.sdk-cover{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;background:var(--sdk-surface);border:2px solid var(--sdk-strong);padding:24px}
.sdk-cover p{font-size:14px;margin:12px 0 20px;max-width:270px}
.sdk-cover button+button{margin-left:8px}
.sdk-board-caption{display:flex;justify-content:space-between;gap:12px;margin-top:12px;font-size:12px;color:var(--sdk-muted)}
.sdk-tools{padding-top:10px}
.sdk-selection{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:34px;margin-bottom:16px}
.sdk-selection h2{font-size:16px}
.sdk-selection>span{font-size:12px;color:var(--sdk-muted)}
.sdk-keypad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.sdk-digit{display:flex;align-items:center;justify-content:center;gap:10px;min-height:68px;border:0;border-radius:12px;background:var(--sdk-surface);font-size:28px;font-weight:400;font-variant-numeric:tabular-nums}
.sdk-digit small{font-size:12px;color:var(--sdk-muted)}
.sdk-digit:hover:not(:disabled){outline:1px solid var(--sdk-border)}
.sdk-digit:disabled{background:var(--sdk-raised)}
.sdk-erase{grid-column:1/-1;min-height:44px;font-size:14px;border-radius:999px}
.sdk-tool-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}
.sdk-tool-row button{font-size:14px;padding:8px}
.sdk-tool-row [aria-pressed=true]{background:var(--sdk-text);color:var(--sdk-surface);border-color:var(--sdk-text)}
.sdk-message{min-height:68px;margin-top:16px;font-size:14px;color:var(--sdk-text)}
.sdk-assist{border-top:1px solid var(--sdk-border);padding-top:20px}
.sdk-check{display:flex;align-items:center;gap:10px;min-height:44px;font-size:14px}
.sdk-check input{width:18px;height:18px;accent-color:var(--sdk-accent);margin:0}
.sdk-assist p{font-size:12px;margin-top:8px}
.sdk-assist p+p{margin-top:16px}
.sdk-save-status{font-size:12px;margin-top:20px}
.sdk-rules{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:64px;padding-top:40px;border-top:1px solid var(--sdk-border)}
.sdk-rules h2{font-size:20px;max-width:340px}
.sdk-rules p{font-size:14px;margin-top:12px;line-height:1.8}
.sdk-rule-details details{margin-top:20px}
.sdk-rule-details summary{cursor:pointer;min-height:44px;font-size:14px;padding-block:10px}
.sdk-footer{display:flex;justify-content:space-between;gap:24px;margin-top:48px;padding-block:24px;font-size:12px;color:var(--sdk-muted)}
.sdk-dialog{max-width:420px;width:calc(100% - 32px);background:var(--sdk-surface);color:var(--sdk-text);border:1px solid var(--sdk-border);border-radius:24px;padding:28px}
.sdk-dialog::backdrop{background:#0008}
.sdk-dialog p{font-size:14px;margin:12px 0 24px}
.sdk-dialog form>div{display:flex;justify-content:flex-end;gap:8px}
.sdk-dialog button{font-size:14px}

@media(min-width:1001px) and (max-height:980px){.sdk-main{max-width:964px}
.sdk-workspace{grid-template-columns:minmax(0,520px) minmax(0,332px)}
.sdk-heading{margin-bottom:16px}
.sdk-main{padding-top:24px}
.sdk-digit{min-height:56px}
}

@media(max-width:1000px) and (min-width:641px){.sdk-workspace{grid-template-columns:minmax(0,600px);justify-content:center;gap:24px}
.sdk-heading{display:block}
.sdk-new-controls{margin-top:20px;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto}
.sdk-tools{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;padding-top:0}
.sdk-selection{grid-column:1/-1}
.sdk-keypad{grid-row:2/5}
.sdk-tool-row{margin-top:0;align-self:start}
.sdk-message{min-height:68px}
.sdk-assist{padding-top:12px}
.sdk-save-status{grid-column:1/-1}
.sdk-rules{gap:32px}
}

@media(max-width:640px){.sdk-header-inner{padding:8px 16px;gap:12px}
.sdk-brand{font-size:16px;gap:8px}
.sdk-brand svg{width:20px;height:20px}
.sdk-header nav{gap:8px}
.sdk-header nav>a{display:none}
.sdk-main{padding:20px 16px}
.sdk-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin-bottom:12px}
h1{font-size:28px}
.sdk-title{display:contents}
.sdk-title h1{grid-column:1;grid-row:1;align-self:center}
.sdk-title p{grid-column:1/-1;grid-row:2;font-size:14px;margin:0}
.sdk-new-controls{display:contents}
.sdk-new-controls label{grid-row:3;font-size:14px}
.sdk-new-controls label[for=sdk-size]{grid-column:1}
.sdk-new-controls label[for=sdk-level]{grid-column:2}
.sdk-new-controls>button{grid-column:2;grid-row:1;justify-self:end;padding-inline:16px;font-size:14px}
#sdk-setting-apply{grid-row:4}
.sdk-settings-help{margin-bottom:12px}
.sdk-workspace{grid-template-columns:minmax(0,1fr);gap:16px}
.sdk-board-bar{margin-bottom:8px}
.sdk-board-bar,.sdk-board-bar button{font-size:12px}
.sdk-clock{gap:4px}
.sdk-clock button{padding-inline:6px}
.sdk-board-caption{font-size:12px;gap:8px}
.sdk-cell{font-size:24px}
.sdk-tools{padding-top:0}
.sdk-selection{margin-bottom:12px;min-height:24px}
.sdk-keypad{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.sdk-digit{min-height:48px;gap:5px;font-size:24px;border-radius:8px;padding:4px}
.sdk-digit small{font-size:12px}
.sdk-erase{grid-column:auto;font-size:12px}
.sdk-tool-row{margin-top:8px}
.sdk-message{min-height:44px;margin-top:12px}
.sdk-assist{margin-top:8px;padding-top:12px}
.sdk-rules{grid-template-columns:1fr;gap:24px;margin-top:40px;padding-top:28px}
.sdk-rules h2{max-width:none}
.sdk-footer{margin-top:24px}
.sdk-dialog{padding:24px}
}

.sdk-digit:not(.sdk-erase){position:relative}
.sdk-digit small{position:absolute;right:12px;bottom:10px}

@media(max-width:640px){.sdk-digit small{right:7px;bottom:5px}}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
}


/* Large-board viewport. */
.sdk-board-scroll{width:100%;height:100%;overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y}
.sdk-grid{grid-template-rows:repeat(var(--sdk-size,9),minmax(0,1fr))}
.sdk-grid-row{grid-template-columns:repeat(var(--sdk-size,9),minmax(0,1fr))}
.sdk-cell{font-size:var(--sdk-cell-font,24px)}
.sdk-cell.sdk-block-right{border-right:2px solid var(--sdk-strong)}
.sdk-cell.sdk-block-bottom{border-bottom:2px solid var(--sdk-strong)}
.sdk-grid[data-size="25"][data-view="fit"] .sdk-value{transform:scaleX(.85)}
.sdk-pencil-compact{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);font-size:11px}
.sdk-pencil-count{display:flex;align-items:center;justify-content:center;font-size:20px}
.sdk-view-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:12px}
.sdk-view-controls button{font-size:12px;padding:8px 12px}
.sdk-view-controls [aria-pressed=true]{background:var(--sdk-text);border-color:var(--sdk-text);color:var(--sdk-surface)}
.sdk-view-controls>span{flex-basis:100%;font-size:12px;color:var(--sdk-muted)}
.sdk-selected-notes{font-size:12px;color:var(--sdk-text);margin-bottom:12px;overflow-wrap:anywhere}
.sdk-number-entry{margin-bottom:16px}
.sdk-number-entry label{display:block;font-size:14px;margin-bottom:8px}
.sdk-number-entry label span{margin-left:8px;color:var(--sdk-muted)}
.sdk-number-entry>div{display:grid;grid-template-columns:minmax(0,1fr) 80px;gap:8px}
.sdk-number-entry input{width:100%;height:44px;border:1px solid var(--sdk-border);border-radius:8px;padding:8px 12px;background:var(--sdk-surface);color:var(--sdk-text);font-variant-numeric:tabular-nums}
.sdk-number-entry input[aria-invalid=true]{border-color:var(--sdk-error)}
.sdk-number-entry p{font-size:12px;margin-top:6px}
#sdk-number-error{color:var(--sdk-error)}
.sdk-keypad[data-size="16"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.sdk-keypad[data-size="25"]{grid-template-columns:repeat(5,minmax(0,1fr))}
.sdk-keypad:not([data-size="9"]) .sdk-digit{min-height:48px;font-size:24px}
.sdk-keypad:not([data-size="9"]) .sdk-digit:not(.sdk-erase){min-height:56px;flex-direction:column;gap:0;padding:4px 2px;line-height:1.2}
.sdk-keypad:not([data-size="9"]) .sdk-digit small{position:static;font-size:12px;line-height:1.2}
.sdk-keypad:not([data-size="9"]) .sdk-erase{grid-column:1/-1;font-size:14px;min-height:44px}
.sdk-digit[aria-pressed=true]{outline:2px solid var(--sdk-accent);outline-offset:-2px}
.sdk-rules h2{word-break:keep-all}
@media(min-width:641px) and (max-width:1000px){
  .sdk-tools{grid-template-areas:"selection selection" "notes notes" "keys entry" "keys tools" "keys message" "keys help" "save save"}
  .sdk-selection{grid-area:selection}
  .sdk-selected-notes{grid-area:notes}
  .sdk-keypad{grid-area:keys}
  .sdk-number-entry{grid-area:entry}
  .sdk-tool-row{grid-area:tools}
  .sdk-message{grid-area:message}
  .sdk-assist{grid-area:help}
  .sdk-save-status{grid-area:save}
}
@media(max-width:640px){.sdk-selection{flex-wrap:wrap}.sdk-view-controls button{flex:1}.sdk-view-controls>span{font-size:12px}.sdk-keypad:not([data-size="9"]) .sdk-digit small{right:5px;bottom:4px;font-size:12px}}

/* Compact phone play and a single, shared settings form. */
.sdk-digit-details>summary{display:none}
.sdk-settings-dialog{padding:0;border:1px solid var(--sdk-border);background:var(--sdk-surface);color:var(--sdk-text)}
.sdk-settings-dialog::backdrop{background:#0008}
.sdk-settings-dialog>header{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:var(--sdk-surface);border-bottom:1px solid var(--sdk-border)}
#sdk-settings-body{padding:16px 16px max(20px,env(safe-area-inset-bottom))}
@media(min-width:641px) and (max-width:1000px){.sdk-digit-details{grid-row:2/5}}
@media(max-width:640px){
 .sdk-header-inner{padding:4px 10px;min-height:48px}.sdk-main{padding:8px 10px}.sdk-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;gap:8px;min-height:44px}.sdk-title{display:block}.sdk-title h1{font-size:22px}.sdk-title p{display:none}
 #sdk-open-settings{font-size:13px;padding:8px 14px}
 body[data-sdk-mobile-ready=true] .sdk-heading>.sdk-new-controls,body[data-sdk-mobile-ready=true] .sdk-main>.sdk-settings-help{display:none}
 .sdk-settings-dialog{position:fixed;inset:auto 0 0;margin:0;width:100%;max-width:none;max-height:85dvh;border-radius:20px 20px 0 0;overscroll-behavior:contain}
 .sdk-settings-dialog .sdk-new-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .sdk-settings-dialog .sdk-new-controls label{grid-row:auto;grid-column:auto}
 .sdk-settings-dialog .sdk-new-controls>button{grid-column:1/-1;grid-row:auto;justify-self:stretch}
 .sdk-settings-dialog #sdk-setting-apply{grid-row:auto;grid-column:1/-1}
 .sdk-settings-dialog .sdk-settings-help{margin:16px 0 0}
 .sdk-workspace{gap:8px}.sdk-board-bar{margin-bottom:4px;font-size:12px;gap:6px}.sdk-separator{margin-inline:4px}.sdk-clock button{min-height:44px}
 .sdk-board-wrap{width:min(100%,calc(100svh - 350px));margin-inline:auto}
 .sdk-board-caption{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .sdk-view-controls[data-size="9"]{display:none}
 .sdk-view-controls{gap:6px;margin-top:6px}.sdk-view-controls>span{display:none}
 .sdk-selection{margin-bottom:6px;min-height:24px}.sdk-selection h2{font-size:13px}.sdk-selection>span{font-size:11px}
 .sdk-keypad{gap:5px}.sdk-digit{min-height:44px;font-size:22px}.sdk-digit small{font-size:10px;right:5px;bottom:3px}
 .sdk-erase{font-size:12px}.sdk-tool-row{margin-top:6px;gap:6px}.sdk-tool-row button{min-height:44px;font-size:13px;padding:8px}
 .sdk-number-entry{margin-bottom:8px}.sdk-number-entry label{font-size:12px;margin-bottom:4px}.sdk-number-entry p{font-size:11px}
 .sdk-digit-details:not([open])>summary{display:block;min-height:44px;padding:10px 0;font-size:13px;color:var(--sdk-accent)}
 .sdk-digit-details:has(.sdk-keypad[data-size="25"])>summary{display:block;min-height:44px;padding:10px 0;font-size:13px;color:var(--sdk-accent)}
 .sdk-message{min-height:24px;margin-top:8px;font-size:12px}.sdk-selected-notes{margin-bottom:6px}
 .sdk-assist,.sdk-save-status{margin-top:12px}.sdk-rules{margin-top:28px;padding-top:24px}
}
@media(max-width:640px){.sdk-digit small{font-size:11px}}
@media(max-width:640px){.sdk-main{padding-inline:16px}}
