:root{--bg:#15161f;--bg-raised:#1d1f2b;--bg-panel:#232636;--border:#32364a;--text:#e8eaf2;--text-dim:#9aa0b5;--accent:#8d97e8;--accent-strong:#6b77e0;--danger:#e0573d;--radius:10px;font-size:15px}*{box-sizing:border-box}html,body,#root{background:var(--bg);height:100%;color:var(--text);-webkit-font-smoothing:antialiased;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}button{font:inherit;color:inherit;border:1px solid var(--border);background:var(--bg-raised);border-radius:var(--radius);cursor:pointer;min-height:38px;padding:8px 14px;transition:background .15s,border-color .15s}button:hover:not(:disabled){background:var(--bg-panel);border-color:var(--accent)}button:disabled{opacity:.4;cursor:default}button.primary{background:var(--accent-strong);border-color:var(--accent-strong);font-weight:600}button.primary:hover:not(:disabled){background:var(--accent)}button.ghost{background:0 0}button.danger:hover:not(:disabled){border-color:var(--danger);color:var(--danger)}input{font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:7px 10px}input:focus{border-color:var(--accent);outline:none}input[type=color]{cursor:pointer;border-radius:8px;width:38px;height:38px;padding:2px}input[type=range]{width:100%;accent-color:var(--accent);padding:0}input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent)}.hint{color:var(--text-dim);margin:10px 2px 0;font-size:.85rem;line-height:1.45}.error{color:var(--danger)}.muted{color:var(--text-dim)}.home{max-width:720px;margin:0 auto;padding:48px 24px}.home-header{align-items:center;gap:16px;margin-bottom:28px;display:flex}.home-header h1{letter-spacing:.02em;margin:0;font-size:1.7rem}.home-header p{color:var(--text-dim);margin:4px 0 0}.home-actions{gap:12px;margin-bottom:28px;display:flex}.project-list{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin:0;padding:0;list-style:none;display:grid}.project-card{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;justify-content:space-between;align-items:flex-start;padding:16px;transition:border-color .15s;display:flex}.project-card:hover{border-color:var(--accent)}.project-card h3{margin:0 0 6px}.project-card p{color:var(--text-dim);margin:2px 0;font-size:.85rem}.empty-state{color:var(--text-dim);background:var(--bg-raised);border:1px dashed var(--border);border-radius:var(--radius);text-align:center;padding:28px;line-height:1.5}.alpha-badge{vertical-align:middle;letter-spacing:.08em;text-transform:uppercase;color:#f0b429;border:1px solid #f0b42973;border-radius:999px;margin-left:8px;padding:2px 8px;font-size:.65rem;font-weight:700;display:inline-block}.home-footer{border-top:1px solid var(--border);color:var(--text-dim);flex-wrap:wrap;justify-content:space-between;gap:16px;margin-top:36px;padding-top:16px;font-size:.82rem;display:flex}.home-footer a{color:var(--accent)}.crash{max-width:560px;margin:80px auto;padding:0 24px}.crash-detail{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius);color:var(--danger);padding:12px;font-size:.8rem;overflow-x:auto}.button-link{border:1px solid var(--border);border-radius:var(--radius);background:0 0;align-items:center;padding:8px 14px;text-decoration:none;display:inline-flex}.editor{flex-direction:column;height:100%;display:flex}.topbar{background:var(--bg-raised);border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:10px;padding:10px 14px;display:flex}.topbar .spacer{flex:1}.project-name{background:0 0;border-color:#0000;width:180px;font-weight:600}.project-name:hover,.project-name:focus{border-color:var(--border)}.piece-count{color:var(--text-dim);white-space:nowrap;font-size:.85rem}.seg-group{border:1px solid var(--border);border-radius:var(--radius);display:flex;overflow:hidden}.seg{background:0 0;border:none;border-radius:0;min-height:36px;padding:8px 12px}.seg.active{background:var(--accent-strong);font-weight:600}.editor-body{flex:1;min-height:0;display:flex}.sidebar{border-right:1px solid var(--border);background:var(--bg);flex-direction:column;flex-shrink:0;gap:14px;width:320px;padding:14px;display:flex;overflow-y:auto}.panel{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius);padding:14px}.panel-header{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.panel-header h2{letter-spacing:.03em;text-transform:uppercase;color:var(--text-dim);margin:0;font-size:1rem}.panel-actions{gap:6px;display:flex}.fabric-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.fabric-row{cursor:pointer;border:1px solid #0000;border-radius:8px;align-items:center;gap:8px;padding:6px;display:flex}.fabric-row:hover{background:var(--bg-panel)}.fabric-row.selected{border-color:var(--accent);background:var(--bg-panel)}.fabric-name{background:0 0;border-color:#0000;flex:1;min-width:0;padding:6px}.fabric-name:hover,.fabric-name:focus{border-color:var(--border)}.fabric-usage{color:var(--text-dim);white-space:nowrap;font-size:.8rem}.fabric-usage.over{color:var(--danger);font-weight:700}.fabric-count{text-align:right;width:58px}.preset-row{flex-wrap:wrap;gap:8px;margin-bottom:12px;display:flex}.preset{flex:1;min-width:80px}.preset.active{border-color:var(--accent);background:var(--bg-panel);font-weight:600}.slider-row{margin:12px 2px;display:block}.slider-row span{color:var(--text-dim);margin-bottom:4px;font-size:.85rem;display:block}.check-row{cursor:pointer;align-items:center;gap:8px;margin:12px 2px;font-size:.9rem;display:flex}.solve-button{width:100%;margin-top:8px}.solve-session{flex-direction:column;gap:10px;margin-top:10px;display:flex}.progress-track{background:var(--bg);border-radius:3px;height:6px;overflow:hidden}.progress-fill{background:var(--accent);height:100%;transition:width .1s linear}.accept-row{gap:8px;display:flex}.accept-row .primary{flex:1}.canvas-wrap{background:#101117;flex:1;min-width:0;position:relative}.quilt-canvas{touch-action:none;width:100%;height:100%;display:block}.quilt-canvas.tool-paint{cursor:crosshair}.quilt-canvas.tool-lock{cursor:pointer}.quilt-canvas.tool-pan{cursor:grab}.fit-button{opacity:.85;position:absolute;bottom:14px;right:14px}.hover-chip{border:1px solid var(--border);pointer-events:none;background:#1d1f2beb;border-radius:8px;align-items:center;gap:8px;padding:6px 10px;font-size:.85rem;display:flex;position:absolute;top:12px;left:12px}.hover-swatch{border:1px solid #ffffff40;border-radius:4px;width:14px;height:14px}.hover-locked{color:var(--text-dim)}.compare-banner{background:var(--accent-strong);pointer-events:none;border-radius:8px;padding:5px 14px;font-size:.85rem;font-weight:600;position:absolute;top:12px;left:50%;transform:translate(-50%)}.ombre-dial{text-align:center;-webkit-user-select:none;user-select:none;position:absolute;bottom:14px;left:14px}.ombre-dial svg{cursor:grab;touch-action:none;display:block}.ombre-dial svg:active{cursor:grabbing}.dial-face{fill:#1d1f2be6;stroke:var(--border);stroke-width:1.5px}.dial-arrow{stroke:var(--accent);stroke-width:3px;stroke-linecap:round}.dial-label{color:var(--text-dim);background:#1d1f2be6;border-radius:6px;margin-top:4px;padding:2px 8px;font-size:.75rem;display:inline-block}.pooling-chip{border-radius:999px;min-height:28px;padding:3px 10px;font-size:.8rem}.pooling-chip.good{color:#6fd388;border-color:#6fd38866}.pooling-chip.warn{color:#f0b429;border-color:#f0b42966}.pooling-chip.bad{color:#ff7a5c;border-color:#ff7a5c80}.compare-button{width:100%}.dialog-backdrop{z-index:50;background:#08090eb3;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.dialog{background:var(--bg-raised);border:1px solid var(--border);border-radius:14px;width:100%;max-width:440px;padding:24px}.dialog h2{margin:0 0 16px}.field{margin-bottom:14px;display:block}.field>span{color:var(--text-dim);margin-bottom:5px;font-size:.85rem;display:block}.field input{width:100%}.field-grid{grid-template-columns:1fr 1fr 1fr;gap:10px;display:grid}.size-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.size-grid .preset{flex-direction:column;align-items:center;gap:2px;padding:8px 6px;display:flex}.size-grid .preset small{color:var(--text-dim);font-size:.72rem}@media (width<=760px){.editor-body{flex-direction:column-reverse}.sidebar{border-right:none;border-top:1px solid var(--border);flex-direction:row;align-items:flex-start;width:100%;max-height:42vh}.sidebar .panel{min-width:280px}.field-grid{grid-template-columns:1fr 1fr}}