.sdk-page{--sdk-ink: #0b1119;--sdk-panel: #111c2b;--sdk-cell: #16202e;--sdk-line: #243246;--sdk-fg: #e6edf5;--sdk-muted: #94a3b8;--sdk-given: #e6edf5;--sdk-user: #93c5fd;--sdk-spark: #34d399;--sdk-spark-ink: #062018;--sdk-need: #f59e0b;--sdk-no: rgba(251, 113, 133, .3);--sdk-bad: #fb7185;background:radial-gradient(1200px 600px at 50% -10%,#13233a 0%,var(--sdk-ink) 60%)}.sdk-wrap{padding-top:36px}.sdk-head{display:grid;gap:6px;margin-bottom:14px}.sdk-h1{font-family:var(--font-display);font-weight:700;font-size:clamp(2rem,6vw,2.75rem);line-height:1;letter-spacing:-.02em;color:#fff;margin:0}.sdk-h1 span{color:var(--sdk-spark)}.sdk-date{margin:0;font-size:.875rem;color:var(--sdk-muted);font-variant-numeric:tabular-nums}.sdk-clock{color:var(--sdk-fg)}.sdk-streak{color:var(--sdk-spark)}.sdk-lede{margin:0;color:#cbd5e1;max-width:60ch}.sdk-past{margin:0;color:var(--sdk-need);font-size:.9rem}.sdk-past a{color:var(--sdk-fg)}.sdk-link{background:none;border:0;padding:0;color:var(--sdk-muted);text-decoration:underline;font:inherit;cursor:pointer}.sdk-seg{display:inline-flex;flex-wrap:wrap;background:var(--sdk-panel);border-radius:999px;padding:3px;gap:2px;margin-bottom:14px}.sdk-seg button{border:0;background:transparent;color:var(--sdk-muted);border-radius:999px;padding:7px 14px;font:500 .875rem var(--font-sans);cursor:pointer}.sdk-seg button.is-on{background:var(--sdk-fg);color:var(--sdk-ink)}.sdk-stage{display:grid;gap:14px;grid-template-columns:minmax(0,1fr);grid-template-areas:"board" "keys" "tools" "side"}.sdk-boardcol{grid-area:board;min-width:0}.sdk-keys{grid-area:keys;display:grid;grid-template-columns:repeat(9,1fr);gap:5px}.sdk-tools{grid-area:tools;display:flex;flex-wrap:wrap;gap:8px}.sdk-side{grid-area:side;display:grid;gap:12px;align-content:start;min-width:0}@media(min-width:900px){.sdk-stage{grid-template-columns:72px minmax(0,min(600px,max(360px,calc(100svh - 300px)))) minmax(0,1fr);grid-template-areas:"keys board side" "keys tools side";align-items:start;column-gap:20px}.sdk-keys{grid-template-columns:1fr}}.sdk-gutter{display:grid;grid-template-columns:10px minmax(0,1fr);grid-template-rows:10px 1fr;gap:4px}.sdk-ticks{display:grid;gap:8px;padding:6px}.sdk-ticks>span{display:grid;gap:3px}.sdk-ticks i{display:block;border-radius:3px;min-width:4px;min-height:4px}.sdk-ticks i.need{background:var(--sdk-need)}.sdk-ticks i.has{background:#1f2b3b}.sdk-board{display:grid;gap:8px;padding:6px;border-radius:14px;background:#0f1824;box-shadow:0 20px 50px #00000073}.sdk-box{display:grid;gap:3px}.sdk-cell{position:relative;aspect-ratio:1;min-width:0;padding:0;border:0;border-radius:8px;display:grid;place-items:center;background:var(--sdk-cell);color:var(--sdk-given);font:600 clamp(1rem,5.4vw,1.875rem)/1 var(--font-display);cursor:pointer;transition:background-color .15s}.sdk-cell:focus-visible{outline:2px solid #fff;outline-offset:-2px}.sdk-cell.is-user{color:var(--sdk-user)}.sdk-cell.is-peer{background:#1a2638}.sdk-cell.is-shade{background:repeating-linear-gradient(135deg,var(--sdk-no) 0 3px,#121a26 3px 9px)}.sdk-cell.is-shade .sdk-v{opacity:.4}.sdk-cell.is-open{background:#22344c;box-shadow:inset 0 0 0 2px #34d399bf}.sdk-cell.is-lit{background:var(--sdk-spark);color:var(--sdk-spark-ink)}.sdk-cell.is-sel{box-shadow:inset 0 0 0 2px #fff}.sdk-cell.is-focus{background:#2a2a14}.sdk-cell.is-target{box-shadow:inset 0 0 0 3px var(--sdk-need)}.sdk-cell.is-wrong{box-shadow:inset 0 0 0 3px var(--sdk-bad);color:var(--sdk-bad)}.sdk-cell.is-clash .sdk-v{color:var(--sdk-bad)}.sdk-notes{position:absolute;top:6%;right:6%;bottom:6%;left:6%;display:grid}.sdk-notes i{display:grid;place-items:center;font:500 clamp(.55rem,2.5vw,.75rem)/1 var(--font-sans);font-style:normal;color:#64748b;border-radius:50%}.sdk-notes i.is-on{background:var(--sdk-spark);color:var(--sdk-spark-ink);font-weight:700}.sdk-notes i.is-x{color:var(--sdk-bad);text-decoration:line-through}.sdk-key{border:0;border-radius:12px;background:var(--sdk-panel);padding:8px 4px 7px;display:grid;gap:5px;justify-items:center;cursor:pointer}.sdk-key b{font:600 1.375rem/1 var(--font-display);color:var(--sdk-fg)}.sdk-bar{width:80%;height:4px;background:#1f2b3b;border-radius:4px;overflow:hidden}.sdk-bar s{display:block;height:100%;background:var(--sdk-spark)}.sdk-key.is-on{background:var(--sdk-spark)}.sdk-key.is-on b{color:var(--sdk-spark-ink)}.sdk-key.is-on .sdk-bar{background:#06201840}.sdk-key.is-on .sdk-bar s{background:var(--sdk-spark-ink)}.sdk-key.is-done{opacity:.35}.sdk-key:focus-visible,.sdk-tools button:focus-visible,.sdk-seg button:focus-visible{outline:2px solid #fff;outline-offset:2px}.sdk-tools button.sdk-done{background:var(--sdk-spark);color:var(--sdk-spark-ink);border-color:var(--sdk-spark);font-weight:600}.sdk-checked{flex-basis:100%;margin:2px 0 0;color:#cbd5e1;font-size:.875rem}.sdk-tools button{border:1px solid var(--sdk-line);background:transparent;color:#cbd5e1;border-radius:999px;padding:8px 14px;font:500 .875rem var(--font-sans);cursor:pointer}.sdk-tools button.is-on{background:var(--sdk-fg);color:var(--sdk-ink);border-color:var(--sdk-fg)}.sdk-tools button:disabled{opacity:.4;cursor:default}.sdk-card{background:var(--sdk-panel);border-radius:16px;padding:16px;display:grid;gap:8px}.sdk-card h2{margin:0;font:600 1rem var(--font-display);color:#fff}.sdk-card p{margin:0;font-size:.9rem;line-height:1.5;color:#cbd5e1}.sdk-tech{color:var(--sdk-spark)}.sdk-legend{color:var(--sdk-muted)!important;font-size:.8rem!important}.sdk-go{justify-self:start;border:0;border-radius:999px;background:var(--sdk-spark);color:var(--sdk-spark-ink);padding:9px 16px;font:600 .875rem var(--font-sans);cursor:pointer;text-decoration:none}.sdk-hint-acts{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.sdk-learn{color:var(--sdk-user);font-size:.875rem}.sdk-map{display:grid;grid-template-columns:repeat(3,36px);gap:4px}.sdk-map i{aspect-ratio:1;border-radius:6px;display:grid;place-items:center;font:600 .75rem var(--font-sans);font-style:normal}.sdk-map i.has{background:var(--sdk-spark);color:var(--sdk-spark-ink)}.sdk-map i.need{box-shadow:inset 0 0 0 2px var(--sdk-need)}.sdk-solved{border:1px solid rgba(52,211,153,.45);background:#34d3991a}.sdk-solved h2{color:var(--sdk-spark);font-size:1.1rem}.sdk-share{display:flex;flex-wrap:wrap;gap:8px}.sdk-share a:not(.sdk-go),.sdk-share button:not(.sdk-go){border:1px solid var(--sdk-line);background:transparent;color:var(--sdk-fg);border-radius:999px;padding:8px 14px;font:600 .875rem var(--font-sans);text-decoration:none;cursor:pointer}.sdk-share-text{margin:0;white-space:pre-wrap;word-break:break-word;font:.75rem/1.45 var(--font-mono);color:var(--sdk-muted);background:#7f7f7f1f;border-radius:8px;padding:10px}.sdk-game{display:grid;gap:6px;text-decoration:none;color:var(--sdk-fg);border-top:1px solid var(--sdk-line);padding-top:12px}.sdk-game-k{font-size:.8rem;color:var(--sdk-muted)}.sdk-game img{width:100%;height:auto;border-radius:10px;aspect-ratio:5 / 4;object-fit:cover}.sdk-game span:last-child{color:var(--sdk-spark);font-size:.875rem}.sdk-about{padding-top:72px;display:grid;gap:14px}.sdk-about .amzp-h2{margin-bottom:4px}.sdk-about p{margin:0;color:#cbd5e1;max-width:66ch;line-height:1.65}@media(prefers-reduced-motion:reduce){.sdk-cell{transition:none}}.sdk-cell.is-unit{box-shadow:inset 0 0 0 2px var(--sdk-spark)}.sdk-cell.is-unit.is-target{box-shadow:inset 0 0 0 3px var(--sdk-need)}.htp-toc ol{margin:14px 0 0;padding-left:22px;columns:2;column-gap:24px}.htp-toc li{margin:4px 0;break-inside:avoid}.htp-toc a{color:var(--sdk-spark)}.htp-lesson{padding-top:40px;scroll-margin-top:72px}.htp-h2{margin:0 0 8px;font:700 1.5rem/1.15 var(--font-display);color:#fff;display:flex;align-items:baseline;gap:10px}.htp-num{font:600 .95rem var(--font-mono);color:var(--sdk-spark)}.htp-player{display:grid;gap:8px;max-width:420px;scroll-margin-top:72px}.htp-label{margin:0;font:600 .75rem var(--font-sans);letter-spacing:.06em;text-transform:uppercase;color:var(--sdk-spark)}.htp-text{margin:0;min-height:4.5em;color:#e2e8f0;line-height:1.5}.htp-board{width:min(100%,360px,46svh)}.htp-board .sdk-board{gap:5px;padding:5px}.htp-board .sdk-cell{font-size:clamp(.95rem,4.4vw,1.3rem);border-radius:6px}.htp-board .sdk-box{gap:2px}.htp-board .sdk-notes i{font-size:clamp(.55rem,2.5vw,.7rem)}.htp-keys{display:grid;gap:4px}.htp-keys .sdk-key{padding:7px 2px}.htp-keys .sdk-key b{font-size:1.1rem}.htp-say{margin:0;min-height:2.8em;color:var(--sdk-muted);font-size:.95rem}.htp-say.is-good{color:var(--sdk-spark);font-weight:600}.htp-nav{display:flex;justify-content:space-between;align-items:center;gap:10px}.htp-nav button:not(.sdk-go){border:1px solid var(--sdk-line);background:transparent;color:#cbd5e1;border-radius:999px;padding:8px 16px;font:500 .9rem var(--font-sans);cursor:pointer}.htp-nav button:disabled{opacity:.35;cursor:default}.htp-every{color:var(--sdk-muted);font-size:.9rem}.htp-every summary{cursor:pointer}.htp-every ol{padding-left:20px;line-height:1.5}.htp-done p{color:#cbd5e1;max-width:62ch;line-height:1.6}.htp-done a:not(.sdk-go){color:var(--sdk-spark)}.htp-done .sdk-go{display:inline-block;margin:4px 0 6px}@media(max-width:480px){.htp-toc ol{columns:1}.htp-lesson{padding-top:28px}}
