.sdk-intro{margin-bottom:24px}.sdk-frame{border:2px solid color-mix(in srgb,var(--foreground) 30%,transparent);border-radius:10px;padding:20px;background:color-mix(in srgb,var(--foreground) 3%,var(--background));box-shadow:inset 0 0 0 4px var(--background),inset 0 0 0 5px color-mix(in srgb,var(--foreground) 15%,transparent),0 2px 20px color-mix(in srgb,var(--foreground) 6%,transparent);position:relative}.sdk-frame::before,.sdk-frame::after{content:'';position:absolute;width:8px;height:8px;border-radius:50%;background:var(--accent);opacity:.5}.sdk-frame::before{top:8px;left:8px;box-shadow:calc(100% - 16px)0 currentColor}.sdk-frame::after{bottom:8px;right:8px;box-shadow:calc(-100% + 16px)0 currentColor}.sdk-control-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;margin-bottom:16px;background:color-mix(in srgb,var(--foreground) 6%,var(--background));border:1px solid color-mix(in srgb,var(--foreground) 15%,transparent);border-radius:6px;font-size:1.05em;font-weight:600}.sdk-left-controls{display:flex;align-items:center;gap:10px}.sdk-select{padding:5px 10px;font-family:inherit;font-size:.9em;color:var(--foreground);background:var(--background);border:1px solid color-mix(in srgb,var(--foreground) 40%,transparent);border-radius:3px;cursor:pointer}.sdk-timer-group{display:flex;align-items:center;gap:8px}.sdk-timer{font-variant-numeric:tabular-nums;font-size:1.1em;color:var(--accent)}.sdk-btn{padding:7px 18px;font-family:inherit;font-size:.95em;color:var(--foreground);background:var(--background);border:1px solid color-mix(in srgb,var(--foreground) 40%,transparent);border-radius:3px;cursor:pointer;transition:border-color .15s,background .15s}.sdk-btn:hover:not(:disabled){border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--background))}.sdk-btn:disabled{opacity:.4;cursor:not-allowed}.sdk-btn-small{padding:3px 10px;font-size:.8em}.sdk-btn-danger{color:#f44;border-color:color-mix(in srgb,#ff4444 40%,transparent)}.sdk-btn-danger:hover{background:color-mix(in srgb,#ff4444 10%,var(--background));border-color:#f44}.sdk-btn.sdk-active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 15%,var(--background));color:var(--accent)}.sdk-board{display:grid;grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(9,1fr);border:2px solid var(--foreground);background:var(--background);aspect-ratio:1;max-width:460px;margin:0 auto;user-select:none}.sdk-cell{display:flex;align-items:center;justify-content:center;font-size:1.5em;font-weight:600;border:1px solid color-mix(in srgb,var(--foreground) 20%,transparent);cursor:pointer;position:relative;transition:background .1s;color:var(--foreground);aspect-ratio:1}.sdk-cell[data-col="2"],.sdk-cell[data-col="5"]{border-right:2px solid var(--foreground)}.sdk-cell[data-row="2"],.sdk-cell[data-row="5"]{border-bottom:2px solid var(--foreground)}.sdk-cell.sdk-given{color:var(--foreground);font-weight:700}.sdk-cell.sdk-player{color:var(--accent)}.sdk-cell.sdk-selected{background:color-mix(in srgb,var(--accent) 25%,var(--background))}.sdk-cell.sdk-peer{background:color-mix(in srgb,var(--foreground) 6%,var(--background))}.sdk-cell.sdk-same-num{background:color-mix(in srgb,var(--accent) 12%,var(--background))}.sdk-cell.sdk-conflict{color:#f44}.sdk-cell.sdk-error{background:color-mix(in srgb,#ff4444 20%,var(--background))}.sdk-pencil-marks{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:100%;height:100%;position:absolute;top:0;left:0}.sdk-pencil-marks span{display:flex;align-items:center;justify-content:center;font-size:.38em;font-weight:400;color:color-mix(in srgb,var(--foreground) 60%,transparent);line-height:1}.sdk-numpad{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;max-width:460px;margin:18px auto 0}.sdk-num-btn{padding:12px 0;font-family:inherit;font-size:1.3em;font-weight:600;color:var(--foreground);background:color-mix(in srgb,var(--foreground) 5%,var(--background));border:1px solid color-mix(in srgb,var(--foreground) 25%,transparent);border-radius:4px;cursor:pointer;transition:border-color .15s,background .15s}.sdk-num-btn:hover:not(:disabled){border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--background))}.sdk-num-btn:disabled{opacity:.25;cursor:not-allowed}.sdk-num-btn.sdk-num-active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 20%,var(--background));color:var(--accent)}.sdk-erase-btn{grid-column:span 2;font-size:.95em}.sdk-actions{display:flex;justify-content:center;gap:12px;max-width:460px;margin:14px auto 0}.sdk-stats{margin-top:24px;padding:16px;background:color-mix(in srgb,var(--foreground) 5%,var(--background));border:1px solid color-mix(in srgb,var(--foreground) 15%,transparent);border-radius:6px}.sdk-stats-title{margin:0 0 12px;font-size:1em;color:var(--accent)}.sdk-stats-grid{display:grid;grid-template-columns:1fr auto;gap:6px 16px;font-size:.9em}.sdk-stat-label{color:color-mix(in srgb,var(--foreground) 70%,transparent)}.sdk-stat-value{text-align:right;font-variant-numeric:tabular-nums}.sdk-board.sdk-paused{position:relative}.sdk-board.sdk-paused::after{content:'PAUSED';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:1.8em;font-weight:700;letter-spacing:.1em;color:var(--foreground);background:color-mix(in srgb,var(--background) 85%,transparent);z-index:10}.sdk-board.sdk-paused .sdk-cell{color:transparent!important}.sdk-board.sdk-paused .sdk-pencil-marks{visibility:hidden}.sdk-complete-msg{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:16px;padding:14px;background:color-mix(in srgb,var(--accent) 8%,var(--background));border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);border-radius:6px;font-size:1.05em}.sdk-complete-check{font-size:1.4em;color:var(--accent);font-weight:700}.sdk-board.sdk-complete{animation:sdk-glow 1.5s ease-in-out;border-color:var(--accent)}@keyframes sdk-glow{0%{box-shadow:0 0 color-mix(in srgb,var(--accent) 50%,transparent)}50%{box-shadow:0 0 20px 4px color-mix(in srgb,var(--accent) 40%,transparent)}100%{box-shadow:0 0 color-mix(in srgb,var(--accent) 50%,transparent)}}.sdk-cell.sdk-ripple{animation:sdk-ripple .5s ease-out}@keyframes sdk-ripple{0%{transform:scale(1);background:color-mix(in srgb,var(--accent) 40%,var(--background))}50%{transform:scale(1.1)}100%{transform:scale(1);background:0 0}}@media(max-width:480px){.sdk-frame{padding:12px}.sdk-board{max-width:100%}.sdk-cell{font-size:1.1em}.sdk-pencil-marks span{font-size:.3em}.sdk-numpad{max-width:100%;gap:5px;margin-top:14px}.sdk-num-btn{padding:10px 0;font-size:1.1em}.sdk-actions{max-width:100%;flex-wrap:wrap;margin-top:10px}.sdk-control-bar{font-size:.9em;padding:8px 10px;margin-bottom:12px}}