:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#242321;background:#f3f0e8;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--ink: #242321;--muted: #69645c;--line: #d4cdbf;--panel: #fffdf8;--panel-soft: #f8f4eb;--accent: #d7433f;--accent-dark: #9b2928;--mint: #428b77;--rail: #23211f}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;overflow:hidden}body{margin:0;min-width:320px;background:#f3f0e8}button,input,select,textarea{font:inherit}button{border:0}.app-shell{display:grid;grid-template-rows:54px minmax(0,1fr);height:100dvh;overflow:hidden}.mode-rail{display:grid;grid-template-columns:auto auto minmax(180px,280px);align-items:center;gap:14px;min-width:0;padding:8px 12px;color:#fffdf8;background:var(--rail);border-bottom:1px solid rgba(255,255,255,.08)}.brand-mark{display:flex;align-items:center;gap:9px;min-height:36px;font-weight:850;letter-spacing:0;white-space:nowrap}.brand-mark svg{color:#f0c24f}.mode-buttons{display:flex;gap:4px;min-width:0;padding:3px;background:#ffffff12;border:1px solid rgba(255,255,255,.08);border-radius:8px}.mode-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:32px;padding:0 12px;color:#fffdf8b3;background:transparent;border-radius:6px;cursor:pointer}.mode-button:hover,.mode-button.active{color:#fffdf8;background:#ffffff21}.library-panel{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;min-width:0;margin-left:auto}.library-panel label,.field-row label{color:var(--muted);font-size:.72rem;font-weight:850;text-transform:uppercase}.library-panel label{color:#fffdf899}.library-panel select,.field-row input{width:100%;min-width:0;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:6px;outline:0}.library-panel select{height:34px;padding:0 9px;color:#fffdf8;background:#ffffff14;border-color:#ffffff24}.workspace{display:grid;grid-template-rows:auto minmax(0,1fr);min-width:0;min-height:0;gap:8px;padding:10px 12px;overflow:hidden}.topbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(160px,360px) auto;align-items:center;gap:10px;min-width:0}.title-block{min-width:0}.topbar h1{margin:0;overflow:hidden;font-size:1.18rem;line-height:1.15;letter-spacing:0;text-overflow:ellipsis;white-space:nowrap}.topbar p{margin:4px 0 0;color:var(--muted);font-size:.82rem}.status-chip{min-width:0;padding:8px 10px;overflow:hidden;color:var(--muted);background:#fffdf8b8;border:1px solid var(--line);border-radius:6px;font-size:.82rem;text-overflow:ellipsis;white-space:nowrap}.topbar-actions{display:flex;align-items:center;gap:7px}.primary-button,.ghost-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:34px;padding:7px 10px;border-radius:6px;font-size:.84rem;font-weight:850;cursor:pointer}.primary-button{color:#fff;background:var(--accent)}.ghost-button{color:var(--ink);background:#fffdf8c7;border:1px solid var(--line)}.danger-button{color:var(--accent-dark);border-color:#d7433f57}.primary-button:hover,.ghost-button:hover{filter:brightness(.98)}.primary-button:disabled,.ghost-button:disabled{opacity:.55;cursor:not-allowed}.board-stage{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,320px);align-items:stretch;gap:10px;min-height:0;overflow:hidden}.board-wrap{display:grid;place-items:center;min-width:0;min-height:0;padding:8px;overflow:hidden;background:#fffdf8b8;border:1px solid var(--line);border-radius:8px}.puzzle-board{display:grid;grid-template-columns:repeat(var(--size),minmax(0,1fr));grid-template-rows:repeat(var(--size),minmax(0,1fr));width:min(100%,calc(100dvh - 144px),760px);max-height:100%;aspect-ratio:1;overflow:hidden;background:#201d1b;border:3px solid #201d1b;border-radius:6px;touch-action:none}.cell{position:relative;display:grid;place-items:center;min-width:0;min-height:0;overflow:hidden;color:#2a2824;background:linear-gradient(#ffffff38,#ffffff0a),var(--cell-color);border:1px solid rgba(35,33,31,.16);border-radius:0;cursor:pointer}.cell svg{pointer-events:none}.cell:hover,.cell.selected-region{z-index:1;box-shadow:inset 0 0 0 2px #ffffffb8}.cell.unassigned{background:repeating-linear-gradient(135deg,rgba(32,29,27,.06),rgba(32,29,27,.06) 8px,transparent 8px,transparent 16px),var(--cell-color)}.cell.border-top{border-top:3px solid #201d1b}.cell.border-right{border-right:3px solid #201d1b}.cell.border-bottom{border-bottom:3px solid #201d1b}.cell.border-left{border-left:3px solid #201d1b}.cell.conflict{z-index:2;box-shadow:inset 0 0 0 4px #bd1c2ab8,0 0 0 2px #bd1c2a3d}.cell.auto-cross{filter:saturate(.88)}.cell.locked:after{position:absolute;right:5px;bottom:4px;width:7px;height:7px;content:"";background:#201d1b;border-radius:999px}.mark-icon{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.star-mark{width:54%;max-width:38px;min-width:16px;height:auto;color:#211f1d;filter:drop-shadow(0 2px 0 rgba(255,255,255,.32))}.cell.solution .star-mark{color:var(--accent-dark)}.cross-mark{width:45%;max-width:32px;min-width:14px;height:auto;color:#23211f9e;stroke-width:3.25}.cell.auto-cross .cross-mark{color:#23211f6b;stroke-width:2.75}.inspector{display:flex;flex-direction:column;gap:10px;min-width:0;min-height:0;padding:10px;overflow:hidden;background:var(--panel);border:1px solid var(--line);border-radius:8px}.panel-title{display:flex;gap:8px;align-items:flex-start}.panel-title svg{flex:0 0 auto;margin-top:1px;color:var(--accent)}.panel-title h2{margin:0;font-size:.98rem;line-height:1.1}.panel-title p,.mode-note{margin:3px 0 0;color:var(--muted);font-size:.78rem;line-height:1.3}.field-row{display:grid;gap:5px}.field-row input{min-height:34px;padding:7px 9px}.field-row.split{grid-template-columns:1fr 82px;align-items:center}.segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;padding:3px;background:#eee7d9;border:1px solid var(--line);border-radius:8px}.segmented button{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:32px;color:var(--muted);background:transparent;border-radius:6px;font-size:.78rem;font-weight:850;cursor:pointer}.segmented button.active{color:var(--ink);background:#fffdf8}.palette{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.swatch{display:grid;place-items:center;aspect-ratio:1;color:#221f1d;background:var(--swatch);border:2px solid rgba(32,29,27,.16);border-radius:6px;font-size:.78rem;font-weight:900;cursor:pointer}.swatch.active{border-color:#201d1b;box-shadow:inset 0 0 0 2px #ffffffc7}.button-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.play-actions{grid-template-columns:repeat(4,minmax(0,1fr))}.button-grid .wide{grid-column:1 / -1}.mini-stats{display:flex;flex-wrap:wrap;gap:5px}.mini-stats span{display:inline-flex;align-items:center;gap:4px;padding:4px 6px;color:var(--muted);background:var(--panel-soft);border:1px solid var(--line);border-radius:6px;font-size:.72rem;font-weight:800}.mini-stats i{display:block;width:9px;height:9px;border-radius:3px}.issue-list{display:grid;gap:6px;min-height:0;overflow:hidden}.issue-list.clean{display:flex;align-items:center;gap:7px;padding:8px;color:#285d50;background:#7cc6a429;border:1px solid rgba(66,139,119,.24);border-radius:6px;font-size:.8rem;font-weight:800}.issue-list>div{display:grid;gap:3px;padding:8px;background:#fff8ed;border:1px solid #efd8af;border-radius:6px}.issue-list strong{color:var(--accent-dark);font-size:.66rem;text-transform:uppercase}.issue-list span{color:var(--muted);font-size:.78rem;line-height:1.28}.play-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.play-stats>div:not(.progress-track){display:grid;gap:3px;padding:9px 8px;background:var(--panel-soft);border:1px solid var(--line);border-radius:6px}.play-stats span{color:var(--ink);font-size:1.18rem;font-weight:900;line-height:1}.play-stats strong{color:var(--muted);font-size:.68rem;text-transform:uppercase}.progress-track{grid-column:1 / -1;height:7px;overflow:hidden;background:#e6ddca;border-radius:999px}.progress-track i{display:block;height:100%;background:#f0c24f;border-radius:inherit}.solver-status{display:grid;gap:4px;padding:10px;background:var(--panel-soft);border:1px solid var(--line);border-radius:6px}.solver-status strong{color:var(--accent-dark);text-transform:capitalize}.solver-status.solved strong{color:#2e715f}.solver-status.multiple strong{color:#946c18}.solver-status span,.step-list span{color:var(--muted);font-size:.8rem;line-height:1.32}.step-slider{width:100%;accent-color:var(--accent)}.step-list{display:grid;gap:7px;min-height:0;margin:0;padding:0 0 0 18px;overflow:hidden}.step-list li{padding-left:2px}.step-list strong{display:block;margin-bottom:2px;font-size:.8rem}@media(max-width:980px){.mode-rail{grid-template-columns:auto minmax(0,1fr)}.library-panel{display:none}.topbar{grid-template-columns:minmax(0,1fr) auto}.status-chip{display:none}.board-stage{grid-template-columns:minmax(0,1fr) 270px}}@media(max-width:900px){.app-shell{grid-template-rows:auto minmax(0,1fr)}.mode-rail{grid-template-columns:1fr;gap:6px;padding:6px}.brand-mark{display:none}.mode-buttons{width:100%}.mode-button{flex:1;padding:0 8px}.workspace{gap:6px;padding:6px}.topbar{display:none}.board-stage{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;gap:6px}.board-wrap{padding:5px}.puzzle-board{width:min(100%,calc(100dvh - 362px),96vw)}.inspector{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:6px;padding:7px}.panel-title,.palette,.button-grid,.play-stats,.solver-status,.step-slider,.step-list{grid-column:1 / -1}.panel-title p,.mini-stats,.issue-list.clean,.mode-note{display:none}.palette{grid-template-columns:repeat(10,minmax(0,1fr))}.play-actions{grid-template-columns:repeat(5,minmax(0,1fr))}.play-actions .wide{grid-column:auto}.swatch{min-height:24px;aspect-ratio:auto}}@media(max-width:460px){.mode-button span{font-size:.78rem}.mode-button svg,.primary-button svg,.ghost-button svg{display:none}.button-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.play-actions{grid-template-columns:repeat(5,minmax(0,1fr))}.primary-button,.ghost-button{min-height:32px;padding:6px 5px;font-size:.76rem}.button-grid .wide{grid-column:1 / -1}.play-actions .wide{grid-column:auto}}
