/* 線上數獨專用樣式 */
.sd-levels { grid-template-columns: repeat(4, 1fr); }
.sd-info { margin: 6px 0; text-align: center; font-size: 1.05rem; }
.sd-info strong { color: var(--brand-dark); font-variant-numeric: tabular-nums; }
.sd-board { position: relative; max-width: 480px; margin: 0 auto; }
.sd-grid { display: grid; grid-template-columns: repeat(9, 1fr); border: 3px solid var(--brand-dark); background: #fff; user-select: none; -webkit-user-select: none; touch-action: manipulation; }
.sd-cell { aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; border: 1px solid #c3cbe0; font-size: clamp(1.1rem, 5.6vw, 1.7rem); color: var(--brand); cursor: pointer; min-width: 0; overflow: hidden; }
.sd-cell.br { border-right: 3px solid var(--brand-dark); }
.sd-cell.bb { border-bottom: 3px solid var(--brand-dark); }
.sd-cell.given { color: #111827; font-weight: 700; }
.sd-cell.peer { background: #eef2fb; }
.sd-cell.same { background: #cfdcfb; }
.sd-cell.sel { background: #9fb8f6; }
.sd-cell.bad { color: #b91c1c; background: #fde2e2; }
.sd-notes { display: grid; grid-template-columns: repeat(3, 1fr); width: 100%; height: 100%; font-size: clamp(.5rem, 2.3vw, .72rem); color: #475569; line-height: 1; font-weight: 400; }
.sd-notes i { display: flex; align-items: center; justify-content: center; font-style: normal; }
.sd-board.paused .sd-grid { visibility: hidden; aspect-ratio: 1 / 1; }
.sd-pause-cover { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: #eff4ff; border: 3px solid var(--brand-dark); color: var(--brand-dark); font-weight: 700; text-align: center; padding: 8px; }
.sd-pause-cover[hidden] { display: none; }
.sd-pad { display: grid; grid-template-columns: repeat(9, 1fr); gap: 4px; max-width: 480px; margin: 8px auto; }
.sd-num { position: relative; padding: 0; min-width: 0; min-height: 54px; font-size: 1.4rem; font-weight: 700; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.05; }
.sd-num small { font-size: .65rem; font-weight: 400; color: var(--muted); }
.sd-tools { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; max-width: 480px; margin: 6px auto; }
.sd-tools .btn { min-height: 46px; padding: 0 4px; }
.sd-tools .btn[aria-pressed="true"] { background: var(--brand); color: #fff; }
@media (min-width: 560px) { .sd-tools { grid-template-columns: repeat(6, 1fr); } }
.sd-levels button, .sd-pad, .sd-tools { user-select: none; -webkit-user-select: none; }
.sd-num[aria-pressed="true"] { background: #eff4ff; border-color: var(--brand-dark); box-shadow: inset 0 0 0 2px var(--brand); }