.sd-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.eggs{font-size:1.6rem;letter-spacing:2px}
.egg{display:inline-block;transition:opacity .3s,filter .3s,transform .3s}
.egg.cracked{opacity:.3;filter:grayscale(1);transform:rotate(-25deg)}

.sd-levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0 4px}
.sd-level{display:flex;flex-direction:column;align-items:center;gap:2px;min-height:56px;padding:6px 4px;border:3px solid var(--bark);border-radius:12px;background:var(--card);
  font-family:var(--font-display);font-size:.95rem;color:var(--ink)}
.sd-level.on{background:var(--leaf)}
.sd-help{margin:8px 0 12px}

.sd-board{--n:4;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));width:100%;margin:0 auto;
  border:5px solid var(--bark);border-radius:14px;overflow:hidden;background:var(--bark);gap:2px}
.sd-board.size-4{max-width:340px}
.sd-board.size-6{max-width:460px}
.sd-cell{aspect-ratio:1;border:0;background:var(--card);display:grid;place-items:center;padding:0;
  font-size:clamp(1.5rem,8vw,2.4rem);line-height:1;color:var(--ink);min-height:var(--tap)}
.size-6 .sd-cell{font-size:clamp(1.3rem,6.5vw,2rem)}
.sd-cell.edge-r{border-right:4px solid var(--bark)}
.sd-cell.edge-b{border-bottom:4px solid var(--bark)}
.sd-cell.given{background:#ecd394}
.sd-cell.near{background:#e3f2c6}
.sd-cell.given.near{background:#d9cf8a}
.sd-cell.sel{background:var(--leaf);box-shadow:inset 0 0 0 4px var(--fern)}
.sd-cell.wrong{background:#ffb3a1;animation:wobble .4s}
@keyframes wobble{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.sd-board.win .sd-cell{animation:hop .5s ease-out}
@keyframes hop{50%{transform:translateY(-6px)}}

.sd-msg{min-height:1.6em;text-align:center;font-weight:800;color:var(--on-bg-soft);margin:10px 0 6px}
.sd-pad{--n:4;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:6px;max-width:460px;margin:0 auto}
.sd-pick{min-height:56px;border:3px solid var(--bark);border-radius:12px;background:var(--card);
  padding:0;font-size:clamp(1.4rem,7vw,1.9rem);box-shadow:3px 3px 0 var(--bark)}
.sd-pick:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--bark)}
.sd-pick:disabled{opacity:.35;box-shadow:none;cursor:default}
.sd-art{width:78%;height:78%;display:block;pointer-events:none}
.sd-cell.given .sd-art{filter:saturate(.85)}
.sd-pick .sd-art{width:44px;height:44px;margin:auto}
.sd-stars{font-family:var(--font-body);font-weight:800;font-size:.75rem;letter-spacing:.5px}