:root{color-scheme:light;--paper:#f4efe6;--card:#fffdf8;--ink:#2a2f3a;--muted:#6f6878;--line:#ded7c8;--green:#1f6b4b;--amber:#a56816;--gold:#e7c25a;--re-bg:var(--card);--re-ink:var(--ink);--re-muted:var(--muted);--re-line:var(--line);--re-accent:var(--green)}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,sans-serif}[hidden]{display:none!important}button,select{font:inherit;color:inherit;min-height:44px;border:1px solid var(--line);border-radius:9px;background:var(--card);padding:8px 12px}button{cursor:pointer;touch-action:manipulation}button:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--amber);outline-offset:3px}a{color:var(--green)}
.shell{max-width:1060px;margin:auto;padding:24px 32px 10px}header{display:flex;gap:12px;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:12px}.brand{display:inline-flex;align-items:center;min-height:44px;font-size:16px;font-weight:800;letter-spacing:2px;text-decoration:none;color:var(--ink)}.brand span{color:var(--amber)}.utilities{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.utilities a{font-size:13px}.heading{margin:16px 0 10px}.eyebrow{font-size:12px;letter-spacing:2px;color:var(--green);font-weight:800}h1{font-size:clamp(32px,6vw,48px);letter-spacing:-2px;margin:0;line-height:1.15}h1 span{color:var(--green)}.howto{color:var(--muted);line-height:1.5;margin:8px 0}.layout{max-width:900px;margin:auto}.lab{border:1px solid var(--line);border-radius:20px;background:var(--card);padding:18px;box-shadow:0 12px 40px #3a2f1a08}.game-area{--size:5;width:min(100%,max(360px,calc(122px + var(--size)*36px)));margin:auto}.puzzle-stage{scroll-margin-top:76px}.toolbar{display:flex;align-items:end;gap:12px;flex-wrap:wrap}.toolbar label{font-size:13px;font-weight:700}.toolbar select{display:block;margin-top:5px;max-width:100%}.challenge{margin:10px 0;color:var(--green);font-weight:700;font-size:14px}.hud{display:grid;grid-template-columns:repeat(3,1fr);margin:10px 0;padding:8px 0;border-block:1px solid var(--line);text-align:center}.hud small{font-size:12px;color:var(--muted)}.hud strong{display:block;font-size:13px;font-variant-numeric:tabular-nums;margin-top:4px}
.field{position:relative;margin-top:12px;background:#ece6d8;border-radius:12px;padding:12px}.board-wrap{overflow:auto;max-height:min(75vh,calc(100svh - 260px));overscroll-behavior:contain;padding:4px}.board{--cell:36px;display:grid;grid-template-columns:90px repeat(var(--size),var(--cell));grid-template-rows:auto repeat(var(--size),var(--cell));width:max-content;margin:auto;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:none}.board.pan{touch-action:pan-x pan-y}.corner{display:grid;place-content:center;color:var(--muted)}.clue{font-variant-numeric:tabular-nums;font-weight:750;font-size:14px;display:flex;align-items:center;justify-content:end;white-space:nowrap;color:var(--ink)}.clue.column{position:sticky;top:-4px;background:#ece6d8;z-index:2;flex-direction:column;justify-content:end;padding-bottom:6px;gap:1px}.clue.row{position:sticky;left:-4px;background:#ece6d8;z-index:2;padding-right:8px}.clue.complete{color:var(--green);text-decoration:line-through;text-decoration-thickness:1px;opacity:.65}.cell{min-height:0;width:var(--cell);height:var(--cell);padding:0;border:1px solid #b8b3a6;border-radius:0;background:#fffdf8;color:var(--muted);font-size:24px;line-height:1;touch-action:inherit}.cell.group-left{border-left:2px solid #706b60}.cell.group-top{border-top:2px solid #706b60}.cell[data-state=filled]{background:var(--green);box-shadow:inset 0 0 0 3px #ffffff12}.cell[data-state=empty]{background:#eeeade}.cell.hint-line{outline:1px dashed var(--amber);outline-offset:-3px}.cell.hint-cell{outline:3px solid var(--amber);outline-offset:-3px}.cell:focus-visible{outline:3px solid var(--amber);outline-offset:-3px;z-index:1}.board.won .cell[data-state=filled]{animation:reveal .5s ease-out}.board.won .cell:not([data-state=filled]){background:transparent;border-color:transparent}.board.won .clue{opacity:.45}.paused-note{position:absolute;inset:0;display:grid;place-content:center;text-align:center;border-radius:12px;background:#243d37;color:white;font-size:24px;font-weight:800}body[data-phase=paused] .board{visibility:hidden}.paused-note button{background:var(--gold);color:var(--ink)}
.tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:16px}.pen-tools{justify-content:center;margin:0}.tools button[aria-pressed=true]{background:var(--green);color:white}.small,.instructions{font-size:13px;color:var(--muted);line-height:1.65}#status{font-size:14px;line-height:1.5;min-height:42px;margin-bottom:4px}.small{margin:8px 0}.instructions{margin:14px 4px}.cabinet{border-block-end:1px solid var(--line);padding:16px 0}.cabinet summary{cursor:pointer;font-weight:750;min-height:44px;padding:10px 0}.cabinet ul{padding:0;list-style:none;display:grid;gap:6px}.cabinet li button{text-align:left;width:100%;font-size:13px}.collection{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:16px}.collection figure{margin:0}.mini-picture{display:grid;grid-template-columns:repeat(var(--size),1fr);width:100px;height:100px;background:#e9e4d7;border-radius:6px;overflow:hidden}.mini-picture .ink{background:var(--green)}figcaption{font-size:12px;margin-top:6px}textarea{width:100%;min-height:160px;margin-top:12px;font:inherit}.game-help-links{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:10px 4px}.game-help-links button{background:none;border:0;padding:8px 0;font-size:13px;color:var(--green);text-decoration:underline}.game-help-links a{display:inline-flex;align-items:center;min-height:44px;font-size:13px}dialog{max-width:520px;width:calc(100% - 32px);max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--line);border-radius:18px;background:var(--card);color:var(--ink)}dialog::backdrop{background:#18251dcc;backdrop-filter:blur(3px)}.help-body{padding:20px;line-height:1.65}.help-body h2{margin:0 0 12px}.help-actions{padding:12px 20px;border-top:1px solid var(--line)}.help-actions button{width:100%}.result-actions{display:flex;gap:8px;flex-wrap:wrap}
@keyframes reveal{from{opacity:.5;transform:scale(.85)}to{opacity:1;transform:scale(1)}}
@media(max-width:600px){.shell{padding:12px 10px 4px}header{position:sticky;top:0;z-index:3;background:var(--paper);padding:6px 0 10px}.lab{padding:12px}.game-area{width:100%}.heading{margin:16px 0 12px}.eyebrow{font-size:10px;letter-spacing:1px}.howto{font-size:13px;margin:8px 0}.challenge{margin:10px 0}.hud{margin:10px 0;padding:8px 0}.hud strong{margin-top:2px}.pan-tip{font-size:12px;line-height:1.4;margin:6px 0}.board-wrap{max-height:calc(100svh - 270px)}.field{padding:4px}.brand{font-size:12px;letter-spacing:1px}.hud strong{font-size:13px}.toolbar{gap:8px}.toolbar select{font-size:13px}.board{--cell:32px;grid-template-columns:82px repeat(var(--size),var(--cell))}.clue{font-size:13px}.tools button{flex:1;padding:8px}.utilities{gap:6px;flex-wrap:nowrap}.utilities button{font-size:12px;font-weight:700;padding:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Keep the finished pixel picture visible above its result and sharing controls. */
#result.cc-round-end{position:relative;inset:auto;margin-top:18px;border-top:1px solid var(--line);border-radius:0;overflow:visible}

#result .cc-re-title{margin-top:0}#result .result-actions{margin-top:10px}