:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;--bg: #f5f7f7;--surface: #ffffff;--surface-2: #eef3f2;--ink: #20262d;--muted: #68747b;--line: #d9e1df;--teal: #2d6f73;--red: #a43d4b;--ochre: #c5913b;--blueblack: #27313c;--shadow: 0 18px 48px rgba(32, 38, 45, .11)}*{box-sizing:border-box}body{margin:0;min-width:320px;background:linear-gradient(90deg,rgba(45,111,115,.05) 1px,transparent 1px),linear-gradient(180deg,rgba(45,111,115,.05) 1px,transparent 1px),var(--bg);background-size:34px 34px;color:var(--ink)}button,input,textarea,select{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh;display:flex;flex-direction:column}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;background:#ffffffdb;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);position:sticky;top:0;z-index:5}.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:38px;height:38px;border-radius:8px;display:grid;place-items:center;color:#fff;background:var(--teal);box-shadow:0 8px 22px #2d6f733d}h1,h2,p{margin:0}.brand h1{font-size:19px;line-height:1.1;letter-spacing:0}.brand p{color:var(--muted);font-size:13px;margin-top:3px}.toolbar,.mini-toolbar,.tabs,.segmented,.size-row,.swatches{display:flex;align-items:center}.toolbar{gap:9px}.icon-button,.tool{width:38px;height:38px;border:1px solid var(--line);border-radius:8px;color:var(--blueblack);background:#fff;display:grid;place-items:center}.primary-button{height:38px;border:0;border-radius:8px;padding:0 14px;display:inline-flex;gap:8px;align-items:center;justify-content:center;background:var(--blueblack);color:#fff;font-size:14px;font-weight:700}.primary-button.full{width:100%}.secondary-button{height:34px;border:1px solid #cfe0de;border-radius:8px;padding:0 12px;background:#eef6f5;color:var(--teal);font-size:12px;font-weight:800}.workspace{flex:1;display:grid;grid-template-columns:112px minmax(520px,1fr) 384px;gap:18px;padding:18px}.workflow-rail,.inspector,.canvas-panel,.idea-strip,.completion-panel{background:#ffffffed;border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 26px #20262d0d}.workflow-rail{padding:14px 10px;display:flex;flex-direction:column;align-items:center;gap:18px;min-height:calc(100vh - 112px)}.progress-ring{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--teal) var(--progress),#e4ebe9 0);color:var(--ink);font-size:14px;font-weight:800}.progress-ring span{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#fff}.workflow-rail nav{width:100%;display:grid;gap:8px}.rail-step{position:relative;width:100%;min-height:66px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--muted);display:grid;place-items:center;gap:4px;font-size:12px;font-weight:700}.rail-step.active{color:var(--teal);background:#eef6f5;border-color:#cfe0de}.rail-check{position:absolute;top:7px;right:8px;color:var(--teal)}.main-stage{min-width:0;display:grid;gap:18px;grid-template-rows:auto 1fr auto}.idea-strip{display:grid;grid-template-columns:minmax(0,1fr) 220px 220px;gap:14px;padding:14px}.source-card{min-height:146px;border-radius:8px;border:1px solid #cfe0de;background:linear-gradient(180deg,#f7fbfa,#edf5f3);padding:14px;display:flex;flex-direction:column;justify-content:space-between}.source-actions{display:grid;grid-template-columns:1fr;gap:7px;margin-top:10px}.pdf-upload{height:34px;border:1px solid var(--teal);border-radius:8px;display:inline-flex;align-items:center;justify-content:center;gap:7px;color:#fff;background:var(--teal);font-size:12px;font-weight:900}.pdf-upload input{display:none}.source-card h2{margin-top:7px;font-size:17px}.source-card p{margin-top:5px;color:var(--muted);font-size:12px;line-height:1.35}.source-card .source-status{margin-top:9px;color:#536268;font-size:11px}.source-label{color:var(--teal);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:0}label{color:var(--muted);display:grid;gap:7px;font-size:12px;font-weight:800}textarea,input,select{border:1px solid var(--line);border-radius:8px;background:#fbfcfc;color:var(--ink);outline:none}textarea:focus,input:focus,select:focus{border-color:#2d6f73b3;box-shadow:0 0 0 3px #2d6f7321}.prompt-block textarea{width:100%;min-height:112px;padding:12px;resize:vertical;font-size:14px;line-height:1.5}.reference-drop{min-height:146px;border:1px dashed #b7c6c3;border-radius:8px;display:grid;place-items:center;align-content:center;gap:9px;color:var(--teal);background:#f6faf9;overflow:hidden;text-align:center}.reference-drop input{display:none}.reference-drop img{width:100%;height:100%;object-fit:cover}.canvas-panel{padding:18px}.panel-heading,.completion-panel{display:flex;align-items:center;justify-content:space-between;gap:18px}.panel-heading h2,.completion-panel h2,.section-title h2{font-size:18px;line-height:1.2}.panel-heading p,.completion-panel p{color:var(--muted);margin-top:5px;font-size:13px}.segmented,.tabs,.size-row{gap:3px;padding:3px;border:1px solid var(--line);border-radius:8px;background:var(--surface-2)}.segmented button,.tabs button,.size-row button{border:0;border-radius:6px;height:31px;padding:0 11px;background:transparent;color:var(--muted);font-size:12px;font-weight:800}.segmented button.selected,.tabs button.selected,.size-row button.selected{color:var(--ink);background:#fff;box-shadow:0 3px 12px #20262d14}.canvas-grid{display:grid;grid-template-columns:minmax(320px,1fr) 328px;gap:18px;align-items:stretch;margin-top:18px}.sweater-preview{min-height:500px;border-radius:8px;background:radial-gradient(circle at 50% 35%,rgba(45,111,115,.08),transparent 32%),linear-gradient(180deg,#fff,#f2f6f5);display:grid;place-items:center;position:relative;overflow:hidden}.sweater-preview svg{width:min(93%,520px);height:auto}.sweater-shadow{fill:#20262d17;transform:translate(4px,8px)}.sweater-outline{fill:none;stroke:#7f8d91;stroke-width:2.2;stroke-linejoin:round}.neck{fill:none;stroke:#7f8d91;stroke-width:7;stroke-linecap:round}.ruffle{fill:none;stroke:var(--teal);stroke-width:3;stroke-linecap:round;opacity:.72}.front-opening,.raglan-line{fill:none;stroke:#7f8d91;stroke-width:2;stroke-linecap:round}.front-opening{stroke-width:2.5}.button-band{fill:#ffffff94;stroke:#d5dddb;stroke-width:1}.button-dot{fill:var(--ochre);stroke:#7c642c;stroke-width:.8}.ribbing{fill:none;stroke:var(--teal);stroke-width:3;stroke-linecap:round;opacity:.6}.preview-stats{position:absolute;left:16px;right:16px;bottom:14px;display:flex;justify-content:space-between;color:var(--muted);font-size:12px;font-weight:800}.chart-editor{display:grid;grid-template-rows:auto auto 1fr;gap:12px;min-width:0}.mini-toolbar{gap:8px}.tool.active{color:#fff;background:var(--teal);border-color:var(--teal)}.swatches{gap:8px}.swatch{width:34px;height:34px;border-radius:8px;border:1px solid var(--line);background:var(--swatch)}.swatch.selected{box-shadow:0 0 0 3px #2d6f732e;border-color:var(--teal)}.chart-grid{display:grid;grid-template-columns:repeat(20,minmax(10px,1fr));grid-auto-rows:1fr;aspect-ratio:20 / 18;border:1px solid #b9c8c5;background:#b9c8c5;gap:1px;align-self:start;width:100%}.chart-grid button{min-width:0;border:0;padding:0}.structure-panel{align-self:start;border:1px solid var(--line);border-radius:8px;background:#fbfcfc;padding:14px;display:grid;gap:14px}.structure-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.structure-heading h3{margin:0;font-size:17px}.structure-heading span{color:var(--muted);font-size:12px;font-weight:800}.structure-list{display:grid;gap:8px}.structure-row{border-bottom:1px solid var(--line);padding:0 0 8px;display:grid;gap:3px}.structure-row span{color:var(--teal);font-size:11px;font-weight:900;text-transform:uppercase}.structure-row strong{color:var(--ink);font-size:13px;line-height:1.35}.button-map{min-height:86px;border-radius:8px;background:linear-gradient(90deg,transparent 49%,rgba(45,111,115,.24) 49% 51%,transparent 51%),#eef6f5;display:flex;flex-direction:column;align-items:center;justify-content:space-around;padding:10px 0}.button-map span{width:9px;height:9px;border-radius:50%;background:var(--ochre);border:1px solid #7c642c}.completion-panel{padding:16px 18px}.checklist{display:grid;grid-template-columns:repeat(2,minmax(190px,1fr));gap:8px;min-width:420px}.check{min-height:34px;display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px;font-weight:800}.check span{width:20px;height:20px;border-radius:6px;border:1px solid var(--line);display:grid;place-items:center}.check.done{color:var(--ink)}.check.done span{color:#fff;background:var(--teal);border-color:var(--teal)}.inspector{min-height:calc(100vh - 112px);padding:14px;display:flex;flex-direction:column;min-width:0}.tabs{align-self:stretch;justify-content:space-between}.tabs button{flex:1}.inspector-body{display:grid;gap:14px;padding-top:18px}.section-title{display:flex;align-items:center;gap:9px;color:var(--blueblack)}.section-title svg{color:var(--teal)}.inspector input,.inspector select,.inspector textarea{width:100%;min-height:40px;padding:9px 10px;font-size:14px}.inspector textarea{min-height:116px;resize:vertical;line-height:1.45}.number-control{display:grid;grid-template-columns:34px 1fr 34px;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#fff}.number-control input{border:0;border-radius:0;text-align:center;background:#fff;min-height:38px}.number-control button{border:0;color:var(--blueblack);display:grid;place-items:center;background:#f2f6f5}.calculation-strip,.yarn-meter,.diagram-metrics,.tip-box,.import-summary{border-radius:8px;background:#eef6f5;border:1px solid #cfdfdc;padding:13px}.import-summary{display:grid;gap:5px}.import-summary span{color:var(--teal);font-size:11px;font-weight:900;text-transform:uppercase}.import-summary strong{color:var(--ink);font-size:14px}.import-summary p{color:var(--muted);font-size:12px;line-height:1.4}.calculation-strip{display:flex;justify-content:space-between;color:var(--teal);font-size:13px;font-weight:900}.calculation-strip span{display:inline-flex;align-items:center;gap:6px}.yarn-meter,.diagram-metrics{display:flex;align-items:center;justify-content:space-between}.yarn-meter span,.diagram-metrics span{color:var(--muted);font-size:12px;font-weight:800}.yarn-meter strong,.diagram-metrics strong{color:var(--teal);font-size:24px}.tip-box{color:#455158;font-size:13px;line-height:1.45}.recipe-panel{min-height:0}.recipe-panel pre{max-height:calc(100vh - 290px);overflow:auto;white-space:pre-wrap;margin:0;border:1px solid var(--line);border-radius:8px;padding:14px;color:#2f3840;background:#fbfcfc;font-size:12px;line-height:1.55}@media(max-width:1160px){.workspace{grid-template-columns:92px minmax(0,1fr)}.inspector{grid-column:2;min-height:auto}}@media(max-width:860px){.topbar{height:auto;padding:14px;gap:14px;align-items:flex-start}.brand p{display:none}.workspace{display:block;padding:12px}.workflow-rail{min-height:auto;margin-bottom:12px;flex-direction:row;overflow-x:auto}.workflow-rail nav{grid-auto-flow:column;grid-auto-columns:84px;display:grid}.main-stage,.inspector{margin-top:12px}.idea-strip,.canvas-grid,.completion-panel{grid-template-columns:1fr;display:grid}.panel-heading{align-items:flex-start;flex-direction:column}.checklist{min-width:0;grid-template-columns:1fr}.sweater-preview{min-height:390px}.toolbar .icon-button{display:none}}
