:root{font-family:DM Sans,system-ui,sans-serif;color:#dce2ec;background:#13171e;font-synthesis:none;color-scheme:dark;--accent: #c5df88;--line: #303743;--muted: #929dad}*{box-sizing:border-box}body{margin:0}main{max-width:66rem;margin:auto;padding:3rem 2rem}button,input{font:inherit;border:1px solid var(--line);border-radius:8px;min-height:44px;padding:.65rem .9rem}button{background:#252c36;color:#dce2ec;cursor:pointer;touch-action:manipulation;transition:background .15s,border-color .15s}button:hover{background:#343e4b;border-color:#687587}button:disabled{opacity:.32;cursor:not-allowed}button[aria-pressed=true]{color:var(--accent);background:#333e2b;border-color:#7e965b}input{min-width:0;background:#161c24;color:#edf1f7;width:100%}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}h1{font-size:2.5rem;letter-spacing:-.045em;overflow-wrap:anywhere;margin:.5rem 0}h2{font-size:1rem;font-weight:600;margin:2rem 0 1rem}p{color:var(--muted);line-height:1.5}form{display:grid;gap:.65rem;max-width:28rem}label{font-size:.8rem;color:#adb8c7;font-weight:500}.toolbar,.palette{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}.icon-button{width:44px;height:44px;padding:11px;flex-shrink:0;display:inline-grid;place-items:center}.icon-button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.error:empty{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%)}.error{color:#ffb2a7;margin:0;padding:.75rem 1rem;background:#452b2a;border-radius:8px}.warning{background:#443a26;padding:1rem;border-radius:10px}#offline-status:empty{display:none}#offline-status{padding:.65rem 1.5rem;background:#303b29;color:var(--accent);font-size:.8rem}.library-page>div:first-child{color:var(--accent);font-size:.7rem;font-weight:700;letter-spacing:.18em}.library-page>p{margin:.5rem 0}.library-page .storage-note{font-size:.75rem}.library-page form{background:#1c222b;padding:1.5rem;border:1px solid var(--line);border-radius:14px}.library-page form button[type=submit]{margin-top:.5rem;background:var(--accent);color:#202919;border-color:var(--accent);font-weight:700}.library{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem}.library li{background:#1c222b;border:1px solid var(--line);border-radius:12px;padding:1rem;display:grid;gap:.75rem}.library li>button:first-child{text-align:left;background:transparent;border:none;padding:0;font-weight:600}.library li>span{font-size:.75rem;color:var(--muted)}.library li.finished-card{border-color:#3f7657}.library .puzzle-status.is-finished{justify-self:start;display:inline-flex;align-items:center;gap:.4rem;color:#a5ebbb;background:#203e2e;border:1px solid #3f7657;border-radius:6px;padding:.3rem .5rem;font-weight:600}.library .puzzle-status.is-finished:before{content:"✓"}.library li>button:last-child{justify-self:start;font-size:.75rem;min-height:32px;padding:.3rem .6rem;color:#b5bdca}.editor{max-width:none;height:100dvh;padding:0;display:grid;grid-template-columns:1fr;grid-template-rows:auto auto minmax(0,1fr) auto;overflow:hidden;position:relative}.editor-header{grid-column:1 / -1;display:flex;align-items:center;gap:1rem;padding:.85rem 1.25rem;border-bottom:1px solid var(--line);background:#1b2029;z-index:4}.editor-header h1{font-size:1.1rem;letter-spacing:-.025em;margin:0;max-width:28vw}.editor-header>.icon-button{border:none;background:transparent}.save-status{font-size:.75rem;white-space:nowrap}.save-status:before{content:"";display:inline-block;width:5px;height:5px;background:var(--accent);border-radius:50%;margin-right:.5rem;vertical-align:middle}.editor-header nav{margin-left:auto}.editor-header nav>.mode-switch{flex-shrink:0}.editor-header nav .finish-button.is-finished{display:inline-flex;gap:.4rem;width:auto;flex:0 0 auto;padding-inline:.75rem;color:#a5ebbb;background:#203e2e;border-color:#3f7657;font-size:.8rem;font-weight:600}.editor-header nav .finish-button.is-finished:hover{background:#2a503b;border-color:#65a77d}.editor>.error{grid-column:1 / -1;z-index:5}.grid-settings{grid-column:1 / -1;background:#1b2029;padding:.5rem 1.3rem;border-bottom:1px solid var(--line);font-size:.75rem;z-index:3}summary{cursor:pointer;color:#aeb8c6}.grid-settings form{max-width:none;padding:.75rem 0}.dimension-controls{display:grid;gap:.75rem}.dimension-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;max-width:15rem}.dimension-field{display:grid;gap:.4rem}.dimension-fields input{width:100%}.size-presets{display:flex;flex-wrap:wrap;gap:.35rem}.size-presets button{min-height:36px;padding:.4rem .55rem;font-size:.75rem}.grid-settings .resize-form{max-width:28rem}.resize-form>button{justify-self:start}.toolbelt{grid-column:1;grid-row:4;background:#1b2029;border-top:1px solid var(--line);padding:.75rem 1.5rem max(.75rem,env(safe-area-inset-bottom));display:flex;flex-wrap:wrap;align-items:center;gap:1rem;max-height:38dvh;overflow:auto}.toolbelt .toolbar{flex-direction:row;gap:.4rem}.toolbelt .toolbar+.toolbar{border-left:1px solid var(--line);padding-left:1rem}.toolbelt button{background:transparent;border-color:transparent}.toolbelt button:hover{background:#303947}.toolbelt button[aria-pressed=true]{color:var(--accent);background:#333e2b;border-color:#6f8351}.workspace{grid-column:1;grid-row:3;position:relative;min-height:0;min-width:0;overflow:hidden;background:#141a22}.grid-viewport{width:100%;height:100%;overflow:auto;padding:80px;touch-action:none;overscroll-behavior:contain;cursor:grab;background-color:#161c25;background-image:radial-gradient(#35404f 1px,transparent 1px);background-size:20px 20px;scrollbar-color:#424c5b #161c25}.grid{position:relative;width:max-content;margin:0 auto;box-shadow:0 14px 50px #0005,0 0 0 1px #788a96;color:#263b44}.grid-row{display:grid;grid-template-columns:repeat(var(--columns),var(--cell-size, 44px))}.cell{width:var(--cell-size, 44px);height:var(--cell-size, 44px);font-size:calc(16px * var(--zoom, 1));border:1px solid #b5c3c5;background:var(--room-color, #e5e9df);display:grid;place-items:center;font-weight:700;-webkit-user-select:none;user-select:none;position:relative}.cell-inactive{background:#27303c;border:1px dashed #4d5a69}.cell-blocker{font-size:0}.cell-obstacle{background:repeating-linear-gradient(135deg,#daceaf 0 5px,#eee5cd 5px 10px);color:#74603c;font-size:calc(24px * var(--zoom, 1))}.cell-notes{display:grid;grid-template-columns:repeat(3,1fr);width:100%;padding:1px;font-size:calc(10px * var(--zoom, 1));line-height:calc(9px * var(--zoom, 1));font-weight:500;text-align:center}.cell[aria-disabled=false]{cursor:crosshair}.solving .cell[aria-disabled=false]{cursor:pointer}.cell[aria-selected=true]{background-color:#dfedb6;box-shadow:inset 0 0 0 3px #617e30}.cell:not(.cell-blocker):hover:after{content:"";position:absolute;inset:0;background:#64807b20;pointer-events:none}.cell-blocker,.cell-empty.cell-shaded{background-image:repeating-linear-gradient(135deg,#526b7930 0 3px,transparent 3px 7px)}.cell-restricted:before,.cell-blocker:before,.cell-blocker:after{content:"";position:absolute;left:50%;top:50%;width:calc(2.5px * var(--zoom, 1));height:calc(21px * var(--zoom, 1));background:currentColor;transform:translate(-50%,-50%) rotate(45deg);border-radius:calc(.5px * var(--zoom, 1));pointer-events:none}.cell-blocker:after{transform:translate(-50%,-50%) rotate(-45deg)}.cell.cell-character{color:var(--character-color);background-image:linear-gradient(color-mix(in srgb,var(--character-color) 18%,transparent),color-mix(in srgb,var(--character-color) 18%,transparent))}.cell.cell-conflict{outline:3px solid #b62b30;outline-offset:-5px;color:#9c1820}.stroke-target{box-shadow:inset 0 0 0 3px #719044;filter:brightness(.88)}.edge-preview{position:absolute;background:#9cc45d;box-shadow:0 0 8px #9cc45d;transform:translate(-2px,-2px);z-index:2;pointer-events:none}.can-pan,.can-pan .cell{cursor:grab}.is-panning,.is-panning .cell{cursor:grabbing}.viewport-controls{background:#202731;border:1px solid #414c5c;padding:3px;border-radius:12px;flex-wrap:nowrap;flex-shrink:0;margin-left:auto;gap:0}.toolbelt .viewport-controls{padding:3px;gap:0}.viewport-controls button{background:transparent;border:none}.viewport-controls>span{min-width:48px;text-align:center;font-size:.75rem;color:#bdc7d4;font-variant-numeric:tabular-nums}.canvas-hint{position:absolute;bottom:30px;left:24px;font-size:.72rem;color:#9aa7b8;pointer-events:none}.top-wall{border-top:calc(3px * var(--zoom, 1)) solid #344853}.bottom-wall{border-bottom:calc(3px * var(--zoom, 1)) solid #344853}.left-wall{border-left:calc(3px * var(--zoom, 1)) solid #344853}.right-wall{border-right:calc(3px * var(--zoom, 1)) solid #344853}.top-window{border-top:calc(5px * var(--zoom, 1)) double #344853}.bottom-window{border-bottom:calc(5px * var(--zoom, 1)) double #344853}.left-window{border-left:calc(5px * var(--zoom, 1)) double #344853}.right-window{border-right:calc(5px * var(--zoom, 1)) double #344853}.solving{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.solving .workspace{grid-column:1;grid-row:2}.solve-dock{grid-column:1 / -1;grid-row:3;background:#1b2029;border-top:1px solid var(--line);padding:.75rem 1.5rem max(.75rem,env(safe-area-inset-bottom));display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;z-index:3;max-height:38dvh;overflow:auto}.mode-switch{position:relative;display:flex;padding:3px;border:1px solid var(--line);border-radius:12px;background:#141a22;isolation:isolate}.mode-switch:before{content:"";position:absolute;top:3px;bottom:3px;left:3px;width:44px;background:#333e2b;border:1px solid #6f8351;border-radius:8px;transition:transform .2s ease;z-index:-1}.mode-switch.second-active:before,.mode-switch.assistant-active:before,.mode-switch.notes-active:before{transform:translate(44px)}.mode-switch .icon-button{background:transparent;border-color:transparent;border-radius:8px;color:var(--muted)}.mode-switch .icon-button[aria-pressed=true]{background:transparent;border-color:transparent;color:var(--accent)}.mode-switch .icon-button:hover{color:#edf1f7}@media(prefers-reduced-motion:reduce){.mode-switch:before{transition:none}}.solve-inputs{width:100%;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}.solve-inputs .palette{flex:1;min-width:0;display:grid;grid-template-columns:repeat(var(--palette-columns, 6),minmax(0,1fr))}.solve-inputs>button{flex-shrink:0}.solve-dock .palette button{min-width:0;width:100%;padding-inline:0;font-weight:700}.restart-menu{position:relative;font-size:.8rem;flex-shrink:0;margin-left:auto}.restart-menu>summary{list-style:none;background:#252c36;border:1px solid var(--line);border-radius:8px;color:#dce2ec}.restart-menu>summary::-webkit-details-marker{display:none}.restart-menu>summary:hover,.restart-menu[open]>summary{background:#343e4b;border-color:#687587}.restart-menu .toolbar{position:absolute;right:0;top:calc(100% + 8px);z-index:10;width:260px;max-width:calc(100vw - 24px);padding:.5rem;border:1px solid #414c5c;border-radius:12px;background:#202731;box-shadow:0 12px 32px #0006;display:flex;flex-direction:column;align-items:stretch}.restart-menu .toolbar button{text-align:left;background:transparent;border-color:transparent}.restart-menu .toolbar button:hover{background:#343e4b}@media(max-width:760px){main{padding:2rem 1.25rem}.editor{padding:0}.editor-header{flex-wrap:wrap;gap:.5rem;padding:.5rem .65rem}.editor-header h1{max-width:75vw;flex:1}.save-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.editor-header nav{width:100%;margin:0}.editor-header nav button{flex:1}.editor-header nav .icon-button{flex:0 0 44px}.toolbelt{padding:.65rem;gap:.65rem}.toolbelt .toolbar{gap:.25rem}.toolbelt .toolbar+.toolbar{padding-left:.65rem}.grid-viewport{padding:48px}.canvas-hint{display:none}.solving{grid-template-columns:1fr}.solve-dock{padding:.65rem;gap:.5rem}.solve-dock button{padding:.5rem}.solve-inputs .palette{flex-basis:100%}}