assets/workbench/workbench.css

:root{font-family:Inter,"Segoe UI",Arial,sans-serif;color:#273c43;background:#eef1ef;font-synthesis:none;--accent:#235d63;--muted:#77858a;--line:#dce3df;--panel:#fafbf8;--ink:#233940}
*{box-sizing:border-box}body{margin:0;min-width:340px}button,input,textarea{font:inherit}button,.button{cursor:pointer;border:1px solid #d5ded9;background:#fff;color:var(--ink);border-radius:7px;padding:9px 13px;transition:background .15s,border-color .15s}button:hover,.button:hover{background:#e9f1ed;border-color:#8faea6}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #379487;outline-offset:3px}button:disabled{opacity:.4;cursor:default}button:disabled:hover{background:inherit}.topbar{height:83px;padding:0 26px;display:flex;align-items:center;gap:35px;background:var(--panel);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;min-width:225px}.brand svg{width:38px;fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linejoin:round}.brand>span{font-size:23px;letter-spacing:-.9px;font-weight:600}.brand-number{font-weight:400;color:#62938a}.brand small{display:block;font-size:8px;letter-spacing:2.1px;color:var(--muted);margin-top:2px}.file-context{display:flex;align-items:center;gap:11px;flex:1;min-width:0}.file-context strong{font-size:13px;display:block;max-width:460px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.file-context small{display:block;color:var(--muted);font-size:11px;margin-top:5px;letter-spacing:.3px}.live-dot,.caption-dot,.status-dot{width:7px;height:7px;background:#5f9d82;border-radius:100%;flex:none}.quiet{background:transparent;border-color:transparent;font-size:12px}.quiet kbd{border:1px solid #d7ddd8;padding:1px 4px;border-radius:3px;font-size:9px;margin-left:12px;color:#8b9690}.tabs{height:54px;display:flex;align-items:stretch;padding:0 22px;border-bottom:1px solid var(--line);background:#f6f8f3;gap:20px}.tab{border:none;border-radius:0;background:none;padding:0 9px;font-size:10px;color:#a0aca7;display:flex;align-items:center;gap:9px;border-bottom:2px solid transparent}.tab span{font-size:12px;color:#64756d}.tab:hover{background:none}.tab.active{border-bottom-color:var(--accent);color:#7c9b8a}.tab.active span{color:var(--ink);font-weight:600}.tab-note{margin-left:auto;align-self:center;font-size:10px;color:#8a9790}.count{font-size:9px!important;padding:2px 5px;border-radius:8px;background:#e5ece6}.count:empty{display:none}main{height:calc(100vh - 173px);min-height:510px;display:grid;grid-template-columns:234px minmax(280px,1fr) 257px}.parts-panel,.detail-panel{background:var(--panel);padding:23px 18px;min-height:0}.parts-panel{display:flex;flex-direction:column;border-right:1px solid var(--line)}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:19px}.eyebrow{font-size:9px;font-weight:600;letter-spacing:1.5px;color:#7e9187}.pill{font-size:9px;padding:4px 7px;background:#e8eee7;color:#617f6e;border-radius:5px}input[type=search],input[type=number],textarea{border:1px solid #d9e1db;background:#fff;border-radius:6px;padding:10px;color:var(--ink);width:100%;outline:none}input[type=search]{font-size:11px;margin-bottom:16px}input::placeholder,textarea::placeholder{color:#96a39b}.parts-list{overflow:auto;flex:1;min-height:120px;margin:0 -8px}.part-row{display:flex;width:100%;align-items:center;gap:8px;text-align:left;border:1px solid transparent;background:none;padding:11px 9px;margin-bottom:3px;color:#687c72;border-radius:6px}.part-row.active{background:#e8f1ec;border-color:#c5dacf;color:#274e43}.part-icon{width:19px;height:19px;border:1px solid #9fb5a8;border-radius:4px;font-size:11px;display:grid;place-items:center;flex:none}.part-label{flex:1;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.part-badge{font-size:8px;color:#8d9b93}.scene-summary{display:flex;gap:20px;border-top:1px solid var(--line);padding-top:20px;margin-top:16px}.scene-summary strong{font-size:17px;display:block;font-weight:500;color:#315746}.scene-summary span{display:block;color:var(--muted);font-size:8px;margin-top:5px}.muted{font-size:10px;line-height:1.7;color:#8a9690}.workspace{min-width:0;min-height:0;position:relative}.pane{display:none;height:100%;min-height:0}.pane.active{display:flex;flex-direction:column}.viewport-toolbar{height:53px;background:#1a282c;display:flex;align-items:center;justify-content:space-between;padding:0 19px;gap:10px}.viewport-toolbar button{background:none;border-color:transparent;color:#839796;font-size:10px;padding:6px 9px}.view-presets{display:flex;gap:3px}.view-presets .active,.viewport-toolbar button[aria-pressed=true]{background:#2a3c3e;color:#c7ddcf}.viewport-toolbar button:hover{color:#dcf1e4;background:#293a3e}#viewport{position:relative;flex:1;min-height:250px;background:radial-gradient(ellipse at 50% 35%,#2b3a40,#18282e);overflow:hidden}#viewport canvas{display:block;width:100%;height:100%;touch-action:none}.viewport-caption{position:absolute;bottom:18px;left:21px;font-size:9px;letter-spacing:.4px;color:#6e8887;display:flex;align-items:center;gap:9px;pointer-events:none}.caption-dot{background:#759f8f;width:5px;height:5px}.separator{color:#486564}.axis-label{position:absolute;bottom:19px;right:22px;color:#b7776c;font-size:10px;pointer-events:none}.axis-label span{color:#7fb497;margin:0 8px}.axis-label{color:#819fb7}.viewport-bottom{height:36px;display:flex;justify-content:space-between;padding:0 19px;align-items:center;background:#18282d;color:#708c87;font-size:9px;gap:15px}#viewport-empty{position:absolute;inset:0;display:grid;place-items:center;color:#aac1b6;font-size:12px;pointer-events:none}.detail-panel{border-left:1px solid var(--line);overflow:auto}.detail-panel h2{font-size:17px;font-weight:500;line-height:1.4;margin:13px 0 11px;word-break:break-word}.metrics{margin:26px 0}.metric{display:flex;justify-content:space-between;font-size:11px;padding:9px 0;border-bottom:1px solid #e4eae4;gap:10px}.metric span{color:#87978b}.metric strong{font-weight:500}.point-card{background:#f0f4ec;border:1px solid #e1e9dd;border-radius:9px;padding:16px 13px}.point-card p{font-size:11px;line-height:1.6;color:#688573;word-break:break-word}.point-card label{font-size:10px;display:block;margin:14px 0 7px;color:#76887a}.point-card input{padding:7px 10px;font-size:12px}.point-card button{margin-top:10px;font-size:10px;width:100%}.secondary{background:#e7efe7;border-color:#ccddce;color:#386447}.detail-note{display:flex;align-items:flex-start;gap:9px;margin:22px 0}.status-dot{margin-top:4px;background:#b4bda1;width:6px;height:6px}.detail-note strong{font-size:10px;color:#6f816f;font-weight:500}.detail-note p{font-size:9px;line-height:1.7;margin:6px 0;color:#9aa593}#isolate-part{font-size:10px;width:100%}.scroll-pane{overflow:auto;padding:29px 30px;background:#f1f4ee}.section-title{margin-bottom:23px}.section-title h1{font-size:23px;letter-spacing:-.7px;font-weight:500;margin:10px 0}.section-title p{font-size:12px;color:#819080;line-height:1.7;margin:0}.diagnostic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:24px}.diagnostic-card{background:#fafcf7;border:1px solid #dce5d8;border-radius:9px;padding:16px}.diagnostic-card strong{font-size:24px;font-weight:500;display:block;margin:10px 0;color:#44634d}.diagnostic-card .muted{margin-bottom:0}.diagnostic-card.attention strong{color:#a57549}.render-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.image-card{background:#fafcf7;border:1px solid #d9e3d6;border-radius:9px;overflow:hidden}.image-card img{display:block;width:100%;aspect-ratio:1;object-fit:contain;background:#1f2b31;cursor:zoom-in}.image-card .image-meta{padding:12px 14px}.image-meta strong{display:block;font-size:12px;font-weight:500}.image-meta small{font-size:9px;color:#8b9886;display:block;line-height:1.6;margin-top:6px}.image-meta .badge{display:inline-block;font-size:8px;margin-top:8px;padding:3px 5px;border-radius:3px;background:#e5ede1;color:#688158}.image-meta .badge.generated{background:#f1e9d7;color:#9a824e}.reference-actions{display:flex;align-items:center;gap:10px;margin-bottom:20px}.reference-actions button,.reference-actions label{font-size:11px}.prompt-card{padding:18px;background:#eaf1e4;border:1px solid #d7e4d1;border-radius:9px;margin-bottom:23px}.prompt-card p{font-size:13px;line-height:1.7;color:#496946}.prompt-card summary{font-size:10px;color:#768c70;cursor:pointer}.prompt-card pre{font-family:inherit;white-space:pre-wrap;font-size:11px;line-height:1.8;color:#6d8367}.edit-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:18px}.edit-card{background:#fbfcf7;border:1px solid #dce5d6;padding:19px;border-radius:9px;align-self:start}.edit-card>label{display:block;font-size:12px;margin-bottom:10px}.edit-card textarea{resize:vertical;line-height:1.7;font-size:12px}.primary{background:var(--accent);border-color:var(--accent);color:#e7f6eb;margin-top:22px;width:100%;font-size:12px;padding:12px}.primary:hover{background:#307077;color:#fff}.request-result{font-size:10px;line-height:1.7;color:#4f7b58;overflow-wrap:anywhere;margin-top:13px}.request-result.error{color:#a8614e}.region-row{padding:13px 0;border-bottom:1px solid #e1e8db;font-size:11px;display:flex;align-items:flex-start;gap:10px}.region-row span{flex:1}.region-row small{display:block;color:#8ca07f;font-size:9px;margin-top:5px}.region-row button{padding:3px 6px;font-size:11px;background:none;border-color:transparent}.control-row{padding-top:17px}.control-row label{font-size:10px;color:#6f8669;display:block;margin-bottom:8px}.control-row input{font-size:12px}footer{height:36px;display:flex;justify-content:space-between;align-items:center;padding:0 22px;font-size:9px;color:#8d9b8f;background:#f8faf5;border-top:1px solid #dce5d7}dialog{padding:15px;border:none;background:#edf2e8;max-width:90vw;max-height:90vh;border-radius:12px;color:var(--ink)}dialog::backdrop{background:#102025bf}dialog img{max-width:82vw;max-height:77vh;display:block;object-fit:contain}dialog p{font-size:11px}.dialog-close{position:absolute;top:20px;right:20px;border:none;background:#102025d6;color:white;font-size:20px;padding:2px 9px;border-radius:100%}#toast{position:fixed;bottom:48px;left:50%;transform:translateX(-50%) translateY(12px);padding:10px 17px;border-radius:7px;background:#294f40;color:#e4f3e9;font-size:12px;opacity:0;transition:.2s;pointer-events:none;box-shadow:0 5px 25px #142c2520}#toast.visible{opacity:1;transform:translateX(-50%)}
@media(max-width:1100px){main{grid-template-columns:190px minmax(250px,1fr) 218px}.topbar{padding:0 17px;gap:18px}.brand{min-width:190px}.parts-panel,.detail-panel{padding:19px 13px}.scroll-pane{padding:24px 22px}.edit-layout{grid-template-columns:1fr}.diagnostic-grid{grid-template-columns:repeat(2,1fr)}.viewport-bottom span:last-child{display:none}}
@media(max-width:800px){main{grid-template-columns:156px minmax(200px,1fr)}.detail-panel{display:none}.topbar{height:72px}.brand{min-width:150px}.brand>span{font-size:20px}.brand small{font-size:7px;letter-spacing:1px}.brand svg{width:30px}.topbar .quiet{display:none}.tabs{padding:0 12px;gap:9px;height:47px}.tab{padding:0 5px;gap:5px}.tab-note{display:none}main{height:calc(100vh - 155px);min-height:470px}.parts-panel{padding:19px 10px}.eyebrow{font-size:8px;letter-spacing:1px}.scene-summary{gap:10px}.scene-summary strong{font-size:14px}.viewport-toolbar{padding:0 10px}.viewport-toolbar button{padding:6px;font-size:9px}.scroll-pane{padding:20px 16px}.section-title h1{font-size:20px}.section-title p{font-size:11px}.render-grid{gap:12px}.reference-actions{flex-direction:column;align-items:stretch}.file-context strong{font-size:11px}.file-context small{font-size:9px}footer{padding:0 13px}footer span:last-child{display:none}}
@media(max-width:520px){main{grid-template-columns:1fr}.parts-panel{display:none}.topbar{gap:14px;padding:0 14px}.brand{min-width:132px}.brand>span{font-size:18px}.brand svg{width:27px}.tab span{font-size:11px}.tabs{gap:3px;justify-content:space-between}.viewport-toolbar{padding:0 11px}.scroll-pane{padding:25px 18px}.render-grid{grid-template-columns:1fr 1fr}.image-meta{padding:9px!important}.image-meta strong{font-size:10px}.diagnostic-card{padding:12px}.diagnostic-card strong{font-size:20px}.section-title h1{font-size:20px}.viewport-bottom{padding:0 15px}.file-context small{font-size:8px}}

.mobile-region{display:none}@media(max-width:800px){.mobile-region{display:grid;gap:8px;padding:13px 0;margin-bottom:15px;border-bottom:1px solid #dce3df;font-size:11px}.mobile-region p{color:#688573;line-height:1.6}}