:root{--ink: #1c2330;--muted: #6b7686;--line: #d9dee6;--bg: #f4f6f9;--accent: #1f6feb;--danger: #c62828;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px;color:var(--ink)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg)}#root{display:flex;flex-direction:column}h1,h2,h3{margin:.8em 0 .4em}h3{font-size:1rem}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}input,select,button,.button{font:inherit;padding:6px 10px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink)}button,.button{cursor:pointer;white-space:nowrap}button:hover:not(:disabled),.button:hover{background:#eef2f7;text-decoration:none}button:disabled{opacity:.5;cursor:default}.primary{background:var(--accent);border-color:var(--accent);color:#fff}.primary:hover:not(:disabled){background:#1a5fd0}.link{border:0;background:none;padding:0;color:var(--accent)}.link:hover:not(:disabled){background:none;text-decoration:underline}.danger{color:var(--danger)}.muted{color:var(--muted)}.error{color:var(--danger);background:#fdecea;border:1px solid #f5c6c2;border-radius:6px;padding:8px 12px}.notice{background:#fff8e1;border:1px solid #f0d98a;border-radius:6px;padding:8px 12px;margin:4px 0}.empty{color:var(--muted);padding:24px 0}.spacer{flex:1}.top{display:flex;align-items:center;gap:16px;padding:10px 20px;background:#fff;border-bottom:1px solid var(--line)}.brand{font-weight:700;font-size:1.15rem;color:var(--ink)}.page{padding:16px 20px;width:100%;max-width:1400px;margin:0 auto}.page.narrow{max-width:900px}.page.dropping{outline:3px dashed var(--accent);outline-offset:-8px}.bar{display:flex;align-items:center;gap:8px;margin:8px 0}.bar.wrap{flex-wrap:wrap}.crumbs{font-size:1rem}.login{margin:12vh auto;width:320px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:24px;display:flex;flex-direction:column;gap:12px}.login label,.field{display:flex;flex-direction:column;gap:4px;font-size:.9rem;color:var(--muted)}.login input,.field input,.field select{color:var(--ink)}.grid{list-style:none;padding:0;margin:12px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}.card{background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px;display:flex;flex-direction:column;gap:6px}.thumb{height:130px;border-radius:6px;background:#000;display:flex;align-items:center;justify-content:center;overflow:hidden}.thumb img{max-width:100%;max-height:100%}.thumb.folder{background:#e8eef7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23809bc4' d='M3 5h6l2 2h10v12H3z'/%3E%3C/svg%3E") center / 64px no-repeat}.thumb.marker{background:#e7f3ea;color:#2e6b3f;font-weight:600}.card .name{font-weight:600;color:var(--ink);overflow-wrap:anywhere}.card .actions{display:flex;gap:12px;font-size:.85rem}.chips{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:10px 0}.chip{display:inline-flex;align-items:center;gap:4px}.drawing{background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px}.drawing svg{width:100%;max-height:62vh;display:block}table{border-collapse:collapse;width:100%;background:#fff}th,td{border:1px solid var(--line);padding:6px 10px;text-align:left}th{background:#f0f3f7;font-weight:600}table.sizes input{width:100%;min-width:3.5em;padding:4px 6px}.picker{background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px 14px}.picker ul{list-style:none;margin:8px 0 0;padding:0;max-height:220px;overflow:auto}.picker li{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 0;border-top:1px solid var(--line)}.order{background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px 14px;margin-bottom:10px}.order header{display:flex;align-items:baseline;gap:10px;margin-bottom:8px}.fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin:10px 0}.fields .wide{grid-column:1 / -1;margin:0}.editor{flex:1;min-height:0;display:flex;flex-direction:column;padding:4px 16px 12px}.workspace{flex:1;min-height:0;display:flex;gap:12px}.workspace svg{flex:1;min-width:0;background:#dfe4ea;border:1px solid var(--line);border-radius:8px;touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none}.workspace aside{width:330px;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:8px;padding:4px 14px 14px}dl{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:0}dt{color:var(--muted)}dd{margin:0;font-weight:600}dd.bad{color:var(--danger)}dd.good{color:#2e7d32}.fabric{fill:#fff;stroke:#8a94a3;vector-effect:non-scaling-stroke}.end{stroke:var(--accent);stroke-dasharray:6 4;vector-effect:non-scaling-stroke}.piece{cursor:move}.piece path{fill:#cfe3ff;stroke:#1c2330;stroke-width:1;vector-effect:non-scaling-stroke}.piece.waiting path{fill:#f3e9c6}.piece.conflict path{fill:#ffc9c4;stroke:var(--danger);stroke-width:2}.piece.selected path{stroke:var(--accent);stroke-width:3}.piece .grain{stroke:#5b6b82;vector-effect:non-scaling-stroke}.piece text{fill:#1c2330;pointer-events:none}.modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#141c2873;display:flex;align-items:flex-start;justify-content:center;padding:6vh 16px;overflow:auto}.dialog{background:var(--bg);border-radius:10px;padding:8px 20px 16px;width:560px;max-width:100%}.dialog.wide{width:860px}button.on{background:#dbe8ff;border-color:var(--accent)}.fields.tight{grid-template-columns:1fr 1fr;gap:8px;margin:6px 0}.fields.tight input{width:100%}tr.base th,tr.base td{background:#f7f9fc}.pattern .other path{fill:#eef1f5;stroke:#8a94a3;vector-effect:non-scaling-stroke;cursor:pointer}.pattern .other text,.pattern text{fill:#5b6b82;pointer-events:none}.pattern .active .fill{fill:#fff;stroke:none;pointer-events:none}.pattern .active .size{fill:none;stroke-width:1;vector-effect:non-scaling-stroke;pointer-events:none}.pattern .seam{fill:none;stroke:#2e7d32;stroke-dasharray:5 4;vector-effect:non-scaling-stroke;pointer-events:none}.pattern .hit{fill:none;stroke:#1c2330;stroke-width:2;vector-effect:non-scaling-stroke;pointer-events:none}.pattern .grab,.pattern .other path.grab{fill:none;stroke:transparent;stroke-width:16;vector-effect:non-scaling-stroke;pointer-events:stroke;cursor:pointer}.pattern .other path.hit{fill:none;stroke-width:1}.pattern .hit.picked{stroke:var(--accent);stroke-width:4}.pattern path.hit.measured-0,button.group-0.on{stroke:#e65100;stroke-width:5;border-color:#e65100}.pattern path.hit.measured-1,button.group-1.on{stroke:#6a1b9a;stroke-width:5;border-color:#6a1b9a}.pattern.tool-insert .active .grab,.pattern.tool-notch .active .grab{cursor:crosshair}.pattern .grain{stroke:#0057b8;stroke-width:1.5;vector-effect:non-scaling-stroke;pointer-events:none}.pattern .handle{fill:#fff;stroke:#1c2330;stroke-width:1.5;vector-effect:non-scaling-stroke;cursor:move}.pattern .handle.picked{fill:var(--accent)}.pattern .handle.grain-end{stroke:#0057b8}.pattern .notch path{fill:none;stroke:#c62828;stroke-width:2;vector-effect:non-scaling-stroke}.pattern .notch circle{fill:#c62828;fill-opacity:.15;stroke:none;cursor:move}.pattern .notch.picked circle{fill-opacity:.5}.workspace aside table.sizes{font-size:12px}.workspace aside table.sizes th,.workspace aside table.sizes td{padding:4px 5px}
