:root{--bg: #0d1117;--bg-1: #161b22;--bg-2: #1c2128;--bg-3: #252d38;--border: rgba(255, 255, 255, .07);--border-2: rgba(255, 255, 255, .13);--text: #e6edf3;--text-2: #a8b8cc;--text-3: #484f58;--amber: #f0b429;--amber-dim: rgba(240, 180, 41, .18);--amber-glow: rgba(240, 180, 41, .08);--red: #f85149;--grid-line: rgba(17, 24, 39, .18);--grid-major: rgba(17, 24, 39, .4);font-family:DM Sans,sans-serif;color:var(--text);background-color:var(--bg);line-height:1.5;font-size:14px;font-weight:400}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);background-size:40px 40px;background-position:-1px -1px;font-size:15px}button,input{font:inherit}button{cursor:pointer}#root{min-height:100vh}.screen-state{min-height:100vh;display:grid;place-items:center;color:var(--text-2);font-family:DM Mono,monospace;font-size:.9rem;letter-spacing:.04em}.app-shell{max-width:1440px;margin:0 auto;padding:28px 28px 56px;display:flex;flex-direction:column;height:100dvh;overflow:hidden}.topbar{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid var(--border)}.topbar h1{margin:0;font-family:Fraunces,serif;font-size:clamp(2rem,5vw,3.6rem);font-weight:300;letter-spacing:-.04em;line-height:1;color:var(--text)}.topbar h1 span{color:var(--amber);font-style:italic}.eyebrow{margin:0 0 6px;font-family:DM Mono,monospace;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--amber)}.ghost-link{font-family:DM Mono,monospace;font-size:.75rem;color:var(--text-2);text-decoration:none;padding:6px 12px;border:1px solid var(--border-2);border-radius:6px;transition:border-color .15s,color .15s}.ghost-link:hover{color:var(--text);border-color:var(--amber)}.toolbar{display:flex;flex-wrap:wrap;align-items:stretch;gap:10px;padding:12px;background:#1e2a3e;border:1px solid rgba(255,255,255,.14);border-radius:10px}.toolbar-section{display:grid;gap:8px;align-content:start;padding:10px;flex:0 0 auto;background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:8px}.toolbar-section-wide{min-width:0}.toolbar-title{margin:0;font-family:DM Mono,monospace;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--amber)}.toolbar-group{display:flex;align-items:flex-end;gap:6px;flex-wrap:wrap;min-width:0}.tooltip-trigger{display:inline-flex}.canvas-toolbar-group{flex-wrap:nowrap}.size-fields input[type=number]{width:56px;background:#28364e;border:1px solid rgba(255,255,255,.2);border-radius:6px;padding:6px 8px;color:var(--text);text-align:center;font-family:DM Mono,monospace;font-size:.9rem;-moz-appearance:textfield}.size-fields input[type=number]::-webkit-inner-spin-button,.size-fields input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.size-fields input[type=number]:focus{outline:none;border-color:var(--amber)}.toolbar-x{color:var(--text);font-size:.8rem;padding:0 2px}.btn{display:inline-flex;align-items:center;gap:5px;padding:7px 13px;border-radius:6px;border:1px solid transparent;font-size:.875rem;font-weight:500;white-space:nowrap;transition:background .12s,border-color .12s,color .12s,opacity .12s}.btn-ghost{background:transparent;border-color:#ffffff2e;color:#a8b8cc}.btn-ghost:hover{background:#ffffff12;color:var(--text)}.btn-primary{background:var(--amber);border-color:var(--amber);color:#0d1117;font-weight:600}.btn-primary:hover{background:#f9c946}.btn-subtle{background:#28364e;border-color:#ffffff29;color:#c8d4e0}.btn-subtle:hover{background:#32425e;color:var(--text)}.btn-danger{background:#be2c2c38;border-color:#f8514980;color:#ffb4af}.btn-danger:hover{background:#be2c2c57;border-color:#f85149b8;color:#ffd6d3}.btn:disabled{opacity:.32;cursor:not-allowed;pointer-events:none}.file-button{position:relative;overflow:hidden}.file-button input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;font-size:0}.content,.play-layout{margin-top:16px;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;flex:1;min-height:0;min-width:0}.editor-panel{background:var(--bg-1);border:1px solid var(--border);border-radius:10px;padding:24px;display:flex;align-items:center;justify-content:center;min-height:480px;min-width:0;min-height:0}.maker-editor-panel{align-items:stretch;justify-content:stretch;overflow:hidden}.maker-workbench{width:100%;display:grid;grid-template-columns:144px minmax(0,1fr);gap:18px;align-items:stretch;min-height:0}.maker-sidebar{display:grid;gap:10px;align-content:start;position:sticky;top:24px}.maker-canvas-viewport{min-width:0;min-height:0;overflow:auto;display:grid;justify-items:center;align-items:start}.maker-canvas-viewport.pan-active{cursor:grab}.maker-canvas-viewport.pan-active:active{cursor:grabbing}.maker-canvas-viewport.zoom-active{cursor:zoom-in}.tool-actions{padding:10px}.tool-actions-plain{padding:0}.tool-actions-inline{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.stack-actions,.tool-actions-row{display:grid;gap:6px}.tool-action-btn{width:100%;justify-content:center}.side-panel{display:grid;gap:12px;align-content:start;min-height:0;min-width:0;overflow:auto}.side-panel-actions{margin:14px 0}.side-check-status{justify-content:flex-start;margin-bottom:10px;gap:10px;padding:8px 10px;align-items:flex-start}.side-check-status .check-status-icon{width:28px;height:28px;font-size:.9rem}.side-check-status-copy{display:grid;gap:2px;min-width:0}.side-check-status .check-status-label{margin:0;font-size:.66rem}.side-check-status .modal-status{line-height:1.35}.side-check-solution-stack{display:block;width:100%}.solution-tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:0;margin-bottom:10px;background:var(--bg-2);border:1px solid var(--border);border-radius:8px;overflow:hidden}.solution-tab{appearance:none;min-width:0;padding:8px 10px;border:0;border-right:1px solid var(--border);background:var(--bg-2);color:var(--text-2);font-family:DM Mono,monospace;font-size:.75rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.solution-tab:last-child{border-right:0}.solution-tab:hover{background:var(--bg-3);color:var(--text)}.solution-tab.active{background:var(--amber);color:#1a1a1a}.segmented-solution-tabs{margin-bottom:6px}.side-panel-note{margin-top:10px;font-size:.78rem;color:var(--text-2);text-align:right}.card{background:var(--bg-1);border:1px solid var(--border);border-radius:10px;padding:18px;min-width:0}.card h2{margin:0 0 12px;font-family:DM Mono,monospace;font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--amber)}.card p{margin:0 0 8px;font-size:.9rem;color:var(--text-2);line-height:1.6}.card p:last-child{margin-bottom:0}.share-input{width:100%;background:var(--bg-2);border:1px solid var(--border-2);border-radius:6px;padding:7px 10px;color:var(--text-2);font-family:DM Mono,monospace;font-size:.75rem}.share-input:focus{outline:none;border-color:var(--amber)}.ratio-bar-track{height:4px;background:var(--bg-3);border-radius:99px;overflow:hidden;margin-top:8px}.ratio-bar-fill{height:100%;background:var(--amber);border-radius:99px;transition:width .4s ease}.grid-shell{display:grid;gap:12px;justify-items:center}.editor-grid-scale{transform:scale(var(--editor-grid-scale, 1));transform-origin:top left}.editor-grid-scale-shell{display:grid;place-items:start;flex-shrink:0}.toolbox{padding:12px}.toolbox-header h2{margin-bottom:6px}.toolbox-header p,.toolbox-hint{margin:0;font-size:.8rem;color:var(--text-2)}.toolbox-grid{margin-top:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.tool-button{display:grid;justify-items:center;width:100%;padding:7px 4px;border-radius:8px;border:1px solid var(--border-2);background:var(--bg-2);color:var(--text-2);transition:border-color .12s,background .12s,color .12s,transform .12s}.tool-button:hover{border-color:#f0b4296b;color:var(--text);transform:translateY(-1px)}.tool-button.active{background:linear-gradient(180deg,#f0b4292e,#f0b42914);border-color:var(--amber);color:var(--text)}.tool-button-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:6px;background:#ffffff0d;font-size:1.15rem;font-family:DM Mono,monospace}.editor-grid,.play-grid{display:grid;gap:0;background:transparent;border:1px solid var(--grid-line);border-radius:0;padding:0;overflow:hidden;box-shadow:0 4px 24px #00000080}.editor-grid.zoom-mode .cell,.editor-grid.pan-mode .cell{pointer-events:none}.cell{width:100%;aspect-ratio:1;border:0;background:#d8d8d8;color:#c22;display:grid;place-items:center;font-size:.8rem;font-family:DM Mono,monospace;touch-action:none;transition:background .06s;box-shadow:inset 1px 0 0 var(--grid-line),inset 0 1px 0 var(--grid-line)}.cell:hover{background:#c4c4c4}.cell.major-top,.clue-cell.major-top{box-shadow:inset 1px 0 0 var(--grid-line),inset 0 2px 0 var(--grid-major)}.cell.major-left,.clue-cell.major-left{box-shadow:inset 2px 0 0 var(--grid-major),inset 0 1px 0 var(--grid-line)}.cell.major-top.major-left,.clue-cell.major-top.major-left{box-shadow:inset 2px 0 0 var(--grid-major),inset 0 2px 0 var(--grid-major)}.cell.filled{background:#1a1a1a;color:#d8d8d8;outline:1px solid rgba(255,255,255,.16);outline-offset:-1px}.cell.marked{color:#c22}.cell.preview-filled{background:#505050}.cell.preview-cleared{background:#f1e8cf}.play-grid .cell{width:var(--board-cell-size, 32px);min-width:var(--board-cell-size, 32px);min-height:var(--board-cell-size, 32px);font-size:1rem}.play-grid .cell.play-cell-unknown{background:#d8d8d8;color:transparent}.play-grid .cell.play-cell-filled{background:#1a1a1a;color:#d8d8d8;outline:1px solid rgba(255,255,255,.16);outline-offset:-1px}.play-grid .cell.play-cell-crossed{background:#d8d8d8;color:#c22}.puzzle-board-viewport{width:100%;height:100%;overflow:auto;display:grid;place-items:center}.puzzle-board{display:grid;gap:6px;align-items:start;width:max-content}.sticky-corner,.sticky-top,.sticky-left{position:sticky}.sticky-corner{top:0;left:0;z-index:4}.sticky-top{top:0;z-index:3}.sticky-left{left:0;z-index:2}.puzzle-corner,.column-clues,.row-clues{display:grid;gap:0;background:transparent;border:1px solid var(--grid-line);border-radius:0;padding:0;overflow:hidden}.puzzle-corner,.column-clues,.row-clues{background:#2b3644}.clue-cell{display:grid;place-items:center;text-align:center;width:var(--board-cell-size, 32px);height:var(--board-cell-size, 32px);background:#2b3644;color:var(--text);font-family:DM Mono,monospace;font-size:calc(var(--board-cell-size, 32px) * .5);font-weight:600;line-height:.9;justify-self:stretch;align-self:stretch;box-shadow:inset 1px 0 0 var(--grid-line),inset 0 1px 0 var(--grid-line)}.clue-cell.solved{background:#32425e;color:#f3f4f6;font-weight:600}.modal-backdrop{position:fixed;inset:0;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:grid;place-items:center;padding:24px;z-index:20;animation:fade-in .12s ease}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.modal-card{width:min(1200px,100%);max-height:calc(100vh - 48px);overflow:auto;background:var(--bg-1);border:1px solid var(--border-2);border-radius:12px;box-shadow:0 24px 80px #0009;padding:24px;animation:slide-up .14s ease}@keyframes slide-up{0%{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header,.modal-footer{display:flex;justify-content:space-between;align-items:center;gap:16px}.modal-header h2{margin:0;font-family:Fraunces,serif;font-size:1.5rem;font-weight:300;letter-spacing:-.02em;color:var(--text)}.modal-footer{margin-top:20px;padding-top:20px;border-top:1px solid var(--border)}.image-modal-body{display:grid;grid-template-columns:minmax(0,1.4fr) 280px;gap:16px;margin-top:20px}.check-modal{width:min(680px,100%)}.export-modal,.share-modal{width:min(560px,100%)}.guide-modal{width:min(720px,100%)}.progress-modal{width:min(420px,100%)}.guide-modal-body{display:grid;gap:14px;margin-top:18px}.guide-section{padding:14px 16px;background:var(--bg-2);border:1px solid var(--border);border-radius:10px}.guide-section h3{margin:0 0 8px;font-family:DM Mono,monospace;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--amber)}.guide-section p{margin:0;color:var(--text-2);line-height:1.7}.share-modal-body{margin-top:18px}.share-targets{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.share-target-button{justify-content:center;width:42px;height:42px;min-width:42px;padding:0}.share-icon{width:16px;height:16px;flex-shrink:0}.share-target-x{color:#f5f7fa}.share-target-facebook{color:#9fc0ff}.share-target-line{color:#b8ffd7}.share-target-bluesky{color:#9ed6ff}.share-target-mastodon{color:#c9bcff}.share-target-misskey{color:#c3ffb0}.progress-modal-body{margin-top:18px}.progress-status-panel{margin-bottom:0}.export-modal-body{display:grid;gap:12px;margin-top:18px}.export-option{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;padding:14px 16px;background:var(--bg-2);border:1px solid var(--border);border-radius:10px;cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .15s ease}.export-option:hover,.export-option.active{background:var(--bg-3);border-color:var(--amber);transform:translateY(-1px)}.export-option input{margin-top:3px}.export-option strong{display:block;color:var(--text)}.export-option p{margin:4px 0 0;color:var(--text-2)}.check-modal-body{display:grid;gap:14px;margin-top:16px}.check-status-panel{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--bg-2);border:1px solid var(--border);border-radius:10px;justify-content:center}.check-status-panel.compact{text-align:center}.check-status-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-family:DM Mono,monospace;font-size:1.1rem;background:var(--bg-3);border:1px solid var(--border-2);color:var(--text);flex-shrink:0}.check-status-icon.running{color:var(--amber);animation:check-spin .9s linear infinite}.check-status-icon.done{color:#86efac}.check-status-icon.cancelled,.check-status-icon.error,.check-status-icon.negative{color:var(--red)}@keyframes check-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.check-status-label{margin:0 0 4px;font-family:DM Mono,monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--amber)}.check-solution-stack{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;justify-items:center}.check-solution-stack.single{grid-template-columns:1fr;justify-content:center}.check-solution-panel{min-height:0;width:100%;min-width:0;padding:12px}.check-solution-panel .static-grid-preview{margin:0 auto}.image-preview-stack,.slider-panel{background:var(--bg-2);border:1px solid var(--border);border-radius:8px;padding:16px}.inline-file-button{display:inline-flex;width:fit-content}.preview-panels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}.preview-panel{min-height:280px;background:var(--bg-3);border:1px solid var(--border);border-radius:8px;padding:12px;display:grid;grid-template-rows:auto 1fr;min-width:0}.preview-panel h3{margin:0 0 10px;font-family:DM Mono,monospace;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-2)}.preview-frame{min-height:300px;height:300px;display:grid;place-items:center;overflow:hidden;border-radius:6px;background:transparent;padding:0}.preview-panel.check-solution-panel.side-check-solution-panel{min-height:0;background:transparent;border:0;border-radius:0;display:flex;flex-direction:column;gap:0;padding:8px 0 0}.preview-frame.side-check-preview-frame{width:100%;min-height:0;height:auto;aspect-ratio:1 / 1;padding:0;background:transparent;place-items:center;border-radius:0}.check-solution-panel.side-check-solution-panel .static-grid-preview{margin:0 auto}.preview-frame p{margin:0;text-align:center;color:var(--text-2)}.preview-panel img{display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;border-radius:6px}.preview-image-surface{width:100%;height:100%;background-position:center;background-repeat:no-repeat;background-size:contain}.static-grid-preview{display:grid;gap:0;width:var(--preview-width, 220px);height:var(--preview-height, 220px);max-width:100%;max-height:100%;background:transparent;border:1px solid var(--grid-line);border-radius:0;padding:0;overflow:hidden;margin:0 auto}.static-grid-preview.fit-square{width:var(--preview-fit-width, 100%);height:var(--preview-fit-height, 100%);max-width:100%;max-height:100%}.static-grid-cell{width:100%;aspect-ratio:1;background:#d8d8d8;box-shadow:inset 1px 0 0 var(--grid-line),inset 0 1px 0 var(--grid-line)}.static-grid-cell.filled{background:#1a1a1a}.static-grid-cell.major-top{box-shadow:inset 1px 0 0 var(--grid-line),inset 0 2px 0 var(--grid-major)}.static-grid-cell.major-left{box-shadow:inset 2px 0 0 var(--grid-major),inset 0 1px 0 var(--grid-line)}.static-grid-cell.major-top.major-left{box-shadow:inset 2px 0 0 var(--grid-major),inset 0 2px 0 var(--grid-major)}.slider-panel{display:grid;gap:16px;align-content:start}.dimension-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.number-field{display:grid;gap:6px}.number-field span{font-size:.85rem;color:var(--text-2)}.number-field input[type=number]{width:100%;background:var(--bg-3);border:1px solid var(--border-2);border-radius:8px;padding:10px 12px;color:var(--text);font-family:DM Mono,monospace;font-size:.95rem;-moz-appearance:textfield}.number-field input[type=number]::-webkit-inner-spin-button,.number-field input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.number-field input[type=number]:focus{outline:none;border-color:var(--amber)}.slider-field{display:grid;gap:6px}.slider-field span{display:flex;justify-content:space-between;font-size:.85rem;color:var(--text-2)}.slider-field strong{font-family:DM Mono,monospace;color:var(--amber);font-weight:400}.slider-field input[type=range]{width:100%;-webkit-appearance:none;appearance:none;height:4px;background:var(--bg-3);border-radius:99px;outline:none;border:0;padding:0}.slider-field input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--amber);cursor:pointer;transition:transform .1s}.slider-field input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}.slider-field input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--amber);cursor:pointer;border:0}.modal-status{font-size:.875rem;color:var(--text-2)}.play-shell .card{align-self:start}.size-fields{display:flex;align-items:center;gap:6px}.inline-number-field{display:inline-flex;align-items:center;gap:6px}.inline-number-field span{font-size:.8rem;color:var(--text-2);line-height:1;white-space:nowrap}.inline-number-field input[type=number]{width:64px;background:#28364e;border:1px solid rgba(255,255,255,.2);border-radius:6px;padding:6px 8px;color:var(--text);text-align:center;font-family:DM Mono,monospace;font-size:.9rem;-moz-appearance:textfield}.canvas-scale-field input[type=number]{width:52px}.inline-number-field input[type=number]::-webkit-inner-spin-button,.inline-number-field input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.inline-number-field input[type=number]:focus{outline:none;border-color:var(--amber)}.inline-unit{font-family:DM Mono,monospace;font-size:.82rem;font-weight:400;color:var(--text-2)}.play-main{display:grid;grid-template-rows:minmax(0,1fr);min-height:0}.play-board-panel{min-width:0;min-height:0;align-items:start;justify-content:center;overflow:auto}.play-sidebar{display:grid;gap:14px;min-height:0;overflow:auto}.play-reset-button{margin-top:2px}.play-stats{display:grid;gap:10px}.play-scale-control{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}.play-scale-buttons{display:grid;grid-template-columns:repeat(2,auto);gap:6px}.play-scale-btn{width:44px;height:44px;min-width:44px;justify-content:center;align-items:center;padding:0;font-size:1.5rem;line-height:1}.play-stat{display:flex;justify-content:space-between;gap:12px;color:var(--text-2);font-size:.9rem}.play-stat strong{color:var(--text);font-family:DM Mono,monospace;font-weight:500}.play-hint{margin:0;font-size:.82rem;color:var(--text-2)}@media(max-width:900px){.content,.play-layout{grid-template-columns:1fr}.toolbar{display:grid;grid-template-columns:1fr}.image-modal-body,.preview-panels,.maker-workbench{grid-template-columns:1fr}.toolbox,.maker-sidebar{position:static}.toolbox-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}