/* Selected Studio layout. Presentation layer only; scene settings stay untouched. */
@font-face{font-family:Inter;src:url('./assets/studio-fonts/InterVariable.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{
 --paper:#f7f7f8;--panel:#fff;--ink:#24252a;--muted:#626773;--line:#e6e7eb;
 --accent:#315eeb;--accent-dark:#244bd1;
 --color-action-primary:#315eeb;--color-action-primary-hover:#244bd1;
 --color-surface:#fff;--color-surface-soft:#f7f7f8;--color-border:#e6e7eb;--color-text-muted:#626773;
 font-family:Inter,'Noto Sans SC','PingFang SC','Microsoft YaHei UI',sans-serif;font-size:14px;
}
body{background:var(--paper)}
button,input,textarea,select{font-family:inherit}
button,input,select,textarea{transition:background-color 140ms,border-color 140ms,color 140ms}
button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.desktop-shell.studio-layout{
 display:block;position:relative;width:100%;height:100dvh;min-height:0;overflow:hidden;
 --studio-left:clamp(210px,17.2vw,280px);--studio-right:clamp(306px,23vw,360px);
 --studio-left-clearance:calc(var(--studio-left) + 48px);--studio-right-clearance:calc(var(--studio-right) + 96px);
 background:var(--paper);
}
.studio-layout .app-toolbar{position:absolute;inset:0 0 auto;height:72px;padding:0 24px;background:transparent;border:0;box-shadow:none;display:grid;grid-template-columns:minmax(200px,1fr) auto minmax(150px,1fr);z-index:12;gap:16px}
.studio-layout .brand-lockup{min-width:0;gap:12px}
.studio-layout .brand-lockup strong{display:block;font-size:17px;line-height:24px;font-weight:600;color:var(--ink);flex-shrink:0}
.studio-layout .brand-mark{background:var(--accent);box-shadow:none;border-radius:8px;width:32px;height:32px}
.studio-layout .offline-indicator{display:none}
.studio-drawing-name{min-width:0;max-width:240px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:13px;color:var(--muted)}
.studio-layout .toolbar-workspaces{gap:16px}
.studio-layout .toolbar-workspaces .workspace-tab{position:relative;height:44px;min-height:44px;padding:0 8px;font-size:14px;font-weight:500;border:0;border-radius:0;background:transparent;color:var(--muted);box-shadow:none}
.studio-layout .toolbar-workspaces .workspace-tab.active{background:transparent;color:var(--accent);box-shadow:inset 0 -2px var(--accent)}
.studio-layout .toolbar-actions{justify-content:flex-end;gap:8px}
.studio-layout .toolbar-actions .render-button{background:white;color:var(--accent);border:1px solid #cbd5fb;box-shadow:none;min-height:36px;padding:6px 14px;font-weight:500}
.studio-layout .workspace-menu summary{font-size:13px;color:var(--muted)}
.studio-layout .workflow-guide{display:none}
.studio-layout .viewport-panel{position:absolute;inset:72px 0 30px;padding:0;background:transparent;overflow:hidden;z-index:1}
.studio-layout .workspace-panel{margin:0;border-top:0}
.studio-layout .render-context{height:28px;min-height:28px;margin:0;color:var(--muted);font-size:13px}
.studio-layout .render-context>span{display:none}
.studio-layout .render-context button{padding:4px 8px;font-size:12px;border:0;background:transparent}
.studio-layout .render-context strong{font-weight:500}
.studio-layout .viewport-toolbar{justify-content:center;padding:0;min-height:38px;flex-wrap:wrap}
.studio-layout .viewport-camera-readout{display:none}
.studio-layout .viewport-actions{padding:4px;border:1px solid var(--line);border-radius:20px;background:#fff;gap:4px;box-shadow:0 2px 8px #24252a05;flex-wrap:nowrap}
.studio-layout .view-button{border:0;min-height:28px;padding:4px 14px;border-radius:16px;background:transparent;color:var(--muted);font-size:13px;font-weight:400}
.studio-layout .view-button.active{background:#eef2ff;color:var(--accent);font-weight:500}
.studio-layout .preview-modes{padding:2px;gap:2px;margin:4px auto 0;max-width:100%;border:0;border-radius:6px;background:transparent}
.studio-layout .preview-modes button{font-size:12px;min-height:28px;padding:4px 10px;color:var(--muted)}
.studio-layout .preview-modes [aria-pressed=true]{background:#fff;color:var(--ink);box-shadow:0 0 0 1px var(--line)}
.studio-layout .viewport-pan-hint{display:none}
.studio-layout .viewport-stage{border:0;border-radius:0;box-shadow:none;background:transparent;min-height:100px}
.studio-layout .viewport-quality-chip{max-width:100%;padding:0;margin:0;min-height:22px;color:var(--muted);font-size:12px;line-height:20px}
.studio-layout .profile-workspace{height:calc(100% - 32px);margin:16px var(--studio-right-clearance) 16px var(--studio-left-clearance);width:calc(100% - var(--studio-left-clearance) - var(--studio-right-clearance));border:1px solid var(--line);border-radius:8px;box-shadow:none;background:white}
.studio-layout .profile-workspace-heading{min-height:48px;padding:10px 16px;font-size:13px}
.studio-layout .profile-workspace-heading strong{font-size:14px;font-weight:600;color:var(--ink)}
.studio-layout .profile-workspace-heading span{font-size:12px;color:var(--muted)}
.studio-layout .import-empty{inset:48px 0 0;background:#fff}
.studio-layout .import-empty strong{font-size:17px;font-weight:500}
.studio-layout .import-empty .primary{width:auto;min-width:150px}
.desktop-shell.studio-layout>.project-tree-panel,
.desktop-shell.studio-layout.render-active>.project-tree-panel,
.desktop-shell.studio-layout>.inspector-panel{position:absolute;display:flex!important;flex-direction:column;z-index:6;background:white;border:1px solid var(--line);border-radius:12px;box-shadow:0 4px 18px #24252a07;scrollbar-gutter:auto;overflow:hidden}
.desktop-shell.studio-layout>.project-tree-panel{left:24px;top:104px;width:var(--studio-left);max-height:calc(100dvh - 240px)}
.desktop-shell.studio-layout>.inspector-panel{top:92px;right:72px;bottom:48px;width:var(--studio-right)}
.studio-panel-heading{display:flex;align-items:center;gap:8px;min-height:48px;padding:8px 12px;border-bottom:1px solid var(--line);flex:none;background:white;margin:0}
.studio-panel-toggle{display:flex;align-items:center;gap:8px;padding:6px 0;border:0;border-radius:6px;background:transparent;color:var(--ink);text-align:left;min-width:0;min-height:32px;flex:1}
.studio-panel-toggle strong{font-size:14px;line-height:20px;font-weight:600}
.studio-icon{display:block;width:18px;height:18px;flex:none;object-fit:contain;opacity:.75}
.studio-secondary-tab{border:0;background:transparent;color:var(--muted);padding:6px;font-size:13px}
.studio-icon-button{display:flex;align-items:center;justify-content:center;min-width:32px;min-height:32px;padding:6px;border:0;border-radius:6px;background:transparent;color:var(--ink)}
.studio-icon-button:hover,.studio-secondary-tab:hover{background:#f0f1f3}
.studio-panel-content{min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;flex:1;scrollbar-width:thin;scrollbar-color:#c7c9d0 transparent}
.studio-layout .tree-grow>.tree-heading{display:none}
.studio-layout .tree-section{padding:12px;border-bottom:1px solid var(--line)}
.studio-layout .tree-section:last-child{border:0}
.studio-layout .tree-section:not(.tree-grow)>.tree-heading{display:none}
.studio-layout .tree-product-button.compact-product{grid-template-columns:52px minmax(0,1fr);gap:4px 12px;min-height:68px;margin:0;padding:10px 8px;border:0;border-radius:6px;color:var(--ink)}
.studio-layout .tree-thumbnail{width:52px;height:44px;border-radius:4px}
.studio-layout .tree-product-button strong{font-size:13px;font-weight:500}
.studio-layout .tree-product-state{font-size:12px;font-weight:400;color:var(--muted)}
.studio-layout .tree-product.selected .tree-product-button.compact-product{background:#eef2ff;color:var(--ink);border:0}
.studio-layout .tree-product-button.compact-product:hover{background:#f0f1f3}
.studio-layout .project-filename{font-size:12px;font-weight:400;color:var(--muted);margin:8px 0}
.studio-layout .import-design-control{background:transparent;border:0;border-radius:6px;color:var(--accent);min-height:36px;font-weight:500;justify-content:flex-start;padding:4px 8px}
.studio-layout .project-details{margin:4px 0;font-size:12px}
.studio-layout .unit-badge{background:#f7f7f8;border-color:var(--line);color:var(--muted);padding:5px 8px}
.studio-layout .inspector-tabs{top:0;border:0;background:white;padding:8px 12px;gap:4px;box-shadow:none}
.studio-layout .inspector-tabs button{padding:8px 4px;border-radius:6px;background:transparent;color:var(--muted);font-size:13px;font-weight:500;box-shadow:none}
.studio-layout .inspector-tabs [aria-selected=true]{background:#eef2ff;color:var(--accent);box-shadow:none}
.studio-layout .inspector-group{padding:16px;border-bottom:1px solid var(--line);color:var(--ink)}
.studio-layout .inspector-heading h2{font-weight:600;font-size:14px;color:var(--ink)}
.studio-layout .inspector-heading>span{color:var(--muted);font-size:12px}
.studio-layout .property-row{font-size:13px;color:#454953;min-height:38px;gap:8px}
.studio-layout.render-active .property-row{grid-template-columns:minmax(80px,1fr) 98px 64px}
.studio-layout .numeric-field input,.studio-layout select,.studio-layout input[type=text],.studio-layout .control-number{border-color:#d7dae0;border-radius:6px;min-height:32px;background:white;color:var(--ink);font-size:13px;font-weight:400;font-variant-numeric:tabular-nums}
.studio-layout .control-number{padding:5px 18px 5px 7px}
.studio-layout .range-control button{border:0;background:#f7f7f8;color:var(--muted);border-radius:4px}
.studio-layout .control-hint{background:transparent;border-left:0;border-radius:0;padding:0;color:var(--muted);font-size:12px;line-height:20px;margin:8px 0}
.studio-layout .preview-refresh{padding:12px 16px;background:white;border-top:1px solid var(--line)}
.studio-layout .primary,.studio-layout .render-button{border-radius:6px;box-shadow:none;background:var(--accent);font-weight:500}
.studio-layout .primary:disabled{background:#e6e7eb;color:#858a95;border-color:#e6e7eb}
.studio-layout .reset-adjustment{font-size:12px;padding:4px 8px;border:0;background:transparent;color:var(--accent);min-height:28px}
.studio-layout .material-group h3{font-size:13px;color:var(--muted);font-weight:500}
.studio-layout .material-token{font-size:12px;border-radius:6px;border-color:var(--line);color:#454953}
.studio-layout .material-card{border-radius:6px;box-shadow:none;background:#fafafb;border-color:var(--line)}
.studio-layout .region-status{border:0;border-radius:6px;background:#eef2ff;color:#3154bd;line-height:20px}
.studio-layout .material-color-feedback{color:var(--muted);font-size:12px;line-height:20px}
.studio-layout .material-confirm-bar{bottom:0;margin-top:16px;gap:8px;padding:12px 0}
.studio-layout .studio-tool-rail{position:absolute;right:16px;top:104px;width:40px;z-index:7;display:flex;flex-direction:column;gap:12px}
.studio-tool-rail .studio-icon-button{height:40px;width:40px;border-radius:8px;background:transparent}
.studio-tool-rail .studio-icon{height:22px;width:22px}
.studio-tool-rail [aria-pressed=true]{background:var(--accent)}
.studio-tool-rail [aria-pressed=true] .studio-icon{filter:brightness(0) invert(1);opacity:1}
.studio-layout .render-status-bar{position:absolute;bottom:0;left:0;right:0;height:30px;padding:0 24px;border-top:0;background:transparent;color:var(--muted);z-index:4;font-size:12px}
.desktop-shell.studio-layout>.studio-panel-collapsed{bottom:auto;max-height:48px}
.studio-layout.studio-products-collapsed{--studio-left-clearance:48px}
.studio-layout.studio-inspector-collapsed{--studio-right-clearance:96px}
.desktop-shell.studio-layout.extension-active>.project-tree-panel,.desktop-shell.studio-layout.extension-active>.inspector-panel{display:none!important}
.studio-layout.extension-active .viewport-panel{padding:16px 24px 0;overflow:auto}
.studio-layout.extension-active .extension-workspace{height:auto;min-height:100%;overflow:visible}
.studio-layout .commerce-heading h2,.studio-layout .ai-art-heading h2{font-size:20px;font-weight:600;color:var(--ink)}
.studio-layout .commerce-layout{gap:24px}
.studio-layout .commerce-preview,.studio-layout .ai-art-preview{background:#f0f1f3;border-color:var(--line);border-radius:8px}
.studio-layout .commerce-workspace,.studio-layout .ai-art-workspace{color:var(--ink)}
.studio-layout .commerce-categories button,.studio-layout .commerce-template-options button{border-color:var(--line);border-radius:6px}
.studio-layout .commerce-categories button[aria-pressed=true],.studio-layout .commerce-template-options button[aria-pressed=true]{background:#eef2ff;border-color:#cbd5fb;color:var(--accent)}
.studio-layout .auto-light-button{background:#eef2ff;border:1px solid #d6defa;border-radius:6px;font-size:13px;color:var(--accent)}

/* UI v2: canvas-first approved layout, original controls and render ratios retained. */
body{min-width:0}.desktop-shell.studio-layout{--studio-left:240px;--studio-right:320px;--studio-left-clearance:272px;--studio-right-clearance:408px}
.desktop-shell.studio-layout.studio-products-collapsed{--studio-left:72px;--studio-left-clearance:104px}
.desktop-shell.studio-layout.studio-inspector-collapsed{--studio-right-clearance:128px}
.studio-layout .app-toolbar{height:64px;padding:0 16px;grid-template-columns:minmax(0,1fr) auto minmax(130px,1fr);gap:16px}
.studio-layout .studio-drawing-name{display:block;max-width:280px;font-size:13px}.studio-layout .brand-lockup{flex-wrap:wrap;gap:8px}
.studio-layout .viewport-panel{inset:64px 0 28px}.studio-layout .render-workspace{height:100%;padding:16px var(--studio-right-clearance) 16px var(--studio-left-clearance);display:flex;flex-direction:column;gap:8px;min-height:0}
.studio-layout .render-context,.studio-layout .viewport-quality-chip,.studio-layout .viewport-camera-readout,.studio-layout .viewport-pan-hint{display:none}
.studio-layout .viewport-toolbar{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:8px;flex-wrap:nowrap;min-height:44px}
.studio-layout .preview-modes{margin:0;padding:3px;flex-shrink:0;background:#eceef2;border-radius:6px}.studio-layout .preview-modes button{min-height:32px;font-size:13px;padding:5px 9px}
.studio-layout .viewport-actions{padding:0;border:0;background:none;box-shadow:none;gap:0}.studio-layout .view-button{padding:5px 7px;min-height:32px;font-size:13px}
.studio-layout .viewport-stage{flex:1;min-height:0;width:100%;max-width:none;aspect-ratio:auto}.studio-layout .blender-calibration img{object-fit:contain}
.studio-layout .workbench-context-status{order:5;margin:0;padding:3px 0;border:0;border-top:1px solid var(--line);background:transparent;color:var(--muted);font-size:13px;min-height:28px;flex-shrink:0}
.studio-layout .render-state-details{position:static;margin:0;font-size:13px;max-height:120px;overflow:auto;background:transparent}.studio-layout .render-state-details summary{padding:4px 0;font-size:13px}
.studio-layout .render-state-details p{line-height:20px;font-size:13px}.studio-mobile-view{display:none}
.studio-layout .workbench-context-status{flex-wrap:wrap}.studio-layout .render-state-details{margin-left:auto}.studio-layout .render-state-details[open]{flex-basis:100%;margin-left:0}
.desktop-shell.studio-layout>.project-tree-panel{left:16px;top:80px;bottom:44px;max-height:none;width:var(--studio-left);border-radius:10px;box-shadow:none}
.desktop-shell.studio-layout>.inspector-panel{right:72px;top:80px;bottom:44px;width:320px;border-radius:10px;box-shadow:none}
.desktop-shell.studio-layout>.inspector-panel.studio-panel-collapsed{width:40px;right:72px}
.studio-panel-collapsed .studio-panel-heading{padding:2px;justify-content:center}.studio-panel-collapsed .studio-panel-toggle{justify-content:center;min-width:36px;min-height:44px}.studio-panel-collapsed .studio-panel-toggle strong{display:none}
.studio-layout .studio-tool-rail{right:16px;top:80px;width:40px;gap:8px}.studio-tool-rail .studio-icon-button{height:44px;width:40px;border-radius:6px}
.studio-panel-heading{min-height:48px;padding:8px 12px}.studio-rail-import{width:100%;min-height:44px;border-top:1px solid var(--line);border-radius:0;flex-shrink:0}
.studio-products-compact .studio-panel-heading{padding:4px 8px;min-height:48px}.studio-products-compact .studio-panel-toggle{justify-content:center;min-height:44px}
.studio-products-compact .studio-panel-toggle strong,.studio-products-compact .studio-secondary-tab,.studio-products-compact .tree-section:not(.tree-grow){display:none}
.studio-products-compact .tree-grow{padding:4px 8px}.studio-products-compact .tree-product-button.compact-product{display:flex;justify-content:center;width:54px;min-height:56px;padding:3px}
.studio-products-compact .tree-thumbnail{height:48px;width:48px;flex-shrink:0}.studio-products-compact .tree-product-button strong,.studio-products-compact .tree-product-state{display:none}
.studio-layout .inspector-tabs{display:none!important}.studio-layout .inspector-heading h2{font-size:16px;line-height:24px}.studio-layout .inspector-group{padding:16px}
.studio-layout .render-status-bar{height:28px;padding:0 16px}.studio-layout .control-hint{font-size:13px;line-height:20px}
.studio-layout .profile-workspace{height:calc(100% - 32px);margin:16px var(--studio-right-clearance) 16px var(--studio-left-clearance);width:calc(100% - var(--studio-left-clearance) - var(--studio-right-clearance))}
/* Material view has no render tool rail: return that space to its canvas. */
@media(min-width:901px){
 .desktop-shell.studio-layout:not(.render-active):not(.extension-active){--studio-right-clearance:352px}
 .desktop-shell.studio-layout:not(.render-active):not(.extension-active).studio-inspector-collapsed{--studio-right-clearance:72px}
 .desktop-shell.studio-layout:not(.render-active):not(.extension-active)>.inspector-panel{right:16px}
}
.studio-layout .numeric-field{display:flex;align-items:center;justify-content:flex-end;min-width:0}.studio-layout .numeric-field .control-number{width:80px;min-width:80px;padding:5px 7px}.studio-layout .numeric-field small{width:22px;flex-shrink:0;font-size:13px;text-align:center}
.studio-layout.render-active .studio-precise-row{grid-template-columns:minmax(0,1fr) 102px}.studio-precise-row>output{display:none}
.studio-fine-tune{margin-top:12px;border-top:1px solid var(--line);font-size:13px}.studio-fine-tune summary{padding:10px 0;cursor:pointer}
.studio-fine-inline{grid-column:1/-1;margin-top:0;border-top:0;width:100%}.studio-fine-inline summary{padding:2px 0;font-size:12px;color:var(--muted)}.studio-fine-inline .range-control{width:100%;min-height:36px}
.studio-tuning-row{display:grid;grid-template-columns:90px minmax(0,1fr);align-items:center;gap:8px;min-height:40px}.studio-tuning-row .range-control{width:100%}
.studio-layout.extension-active .viewport-panel{padding:8px 16px 16px;overflow:hidden}.studio-layout.extension-active .extension-workspace{height:100%;min-height:0;overflow:auto}
@media(max-width:1100px){.studio-layout .brand-lockup strong{font-size:14px}.studio-layout .studio-drawing-name{max-width:180px}.studio-layout .toolbar-workspaces{gap:4px}.studio-layout .view-button{padding:4px 5px}.studio-layout .app-toolbar{gap:8px}}
@media(max-width:900px){
 body{overflow:auto}.desktop-shell.studio-layout{height:auto;min-height:100dvh;overflow:visible;display:flex;flex-direction:column;padding:76px 12px 12px;gap:12px}
 .studio-layout .app-toolbar{position:fixed;top:0;left:0;right:0;background:#f7f7f8;height:64px;border-bottom:1px solid var(--line);grid-template-columns:minmax(0,1fr) auto;padding:0 12px;z-index:20}
 .studio-layout .brand-lockup{display:none}.studio-layout .toolbar-workspaces{gap:4px}.studio-layout .toolbar-workspaces .workspace-tab{font-size:13px;height:44px}.studio-layout .toolbar-actions{gap:4px}.studio-layout .workspace-menu summary{font-size:13px}
 .studio-layout .toolbar-actions .render-button{padding:6px 8px;font-size:13px}
 .studio-layout .viewport-panel{position:relative;inset:auto;min-height:0;overflow:visible;order:1;flex:none}
 .studio-layout .workspace-panel{height:auto;min-height:0}.studio-layout .render-workspace{padding:0;min-height:400px}.studio-layout .viewport-stage{height:340px;flex:none;min-height:260px}
 .desktop-shell.studio-layout>.project-tree-panel{position:relative;inset:auto;width:100%;max-height:none;order:2;flex:none}
 .studio-layout .project-tree{display:flex;gap:8px;overflow-x:auto}.studio-layout .tree-product-button.compact-product{flex-shrink:0;width:150px}
 .studio-products-compact .studio-panel-content .tree-grow{padding:4px 8px}.studio-products-compact .studio-panel-heading{display:flex;min-height:44px}.studio-products-compact .studio-panel-toggle{flex:none;width:44px}.studio-products-compact .studio-rail-import{position:absolute;right:4px;top:4px;width:44px;border:0}
 .desktop-shell.studio-layout>.inspector-panel,.desktop-shell.studio-layout>.inspector-panel.studio-panel-collapsed{position:relative;inset:auto;width:100%;max-height:none;order:3;flex:none}.studio-layout .studio-panel-content{max-height:480px}
 .studio-layout .inspector-tabs:not([hidden]){display:flex!important}.studio-layout .studio-tool-rail{display:none!important}
 .studio-layout .profile-workspace{margin:0;width:100%;height:440px}.studio-layout .render-status-bar{position:static;order:4;height:auto;min-height:28px;padding:4px 0}
 .studio-layout.extension-active .viewport-panel{padding:0}.studio-layout.extension-active .extension-workspace{height:auto;min-height:0;overflow:visible}
}
@media(max-width:600px){.studio-layout .viewport-actions{display:none}.studio-mobile-view{display:block;max-width:94px}.studio-layout .preview-modes button{padding:5px 7px}.studio-layout .viewport-toolbar{gap:4px}.studio-layout .workspace-menu summary{padding:6px 3px}.studio-layout .toolbar-workspaces .workspace-tab{padding:0 4px}}
@media(max-height:560px) and (min-width:901px){.desktop-shell.studio-layout{height:650px;overflow:visible}body{overflow:auto}}
@media(prefers-reduced-motion:reduce){button,input,select,textarea{transition:none!important}}
.studio-layout .commerce-table-editor{overflow-x:auto;max-width:100%}.studio-layout .commerce-preflight{line-height:20px;font-size:13px}
.studio-layout .commerce-preflight details{margin-top:8px;font-size:13px}.studio-layout .commerce-preflight summary{cursor:pointer;min-height:32px}.studio-layout .commerce-preflight details p{font-size:13px;line-height:20px}
.mishi-logo{display:block;width:164px;height:auto;max-width:100%;object-fit:contain}
.studio-layout .brand-lockup strong{flex-shrink:0;line-height:0}
.studio-layout .tree-product-button.compact-product.selected{background:#eef2ff;color:var(--ink)}

/* Material production has its own page hierarchy, not another render inspector. */
.studio-layout .art-steps{margin:0 0 16px;gap:24px;border-bottom:1px solid var(--line);flex-wrap:nowrap}
.studio-layout .art-steps button{flex:none;background:transparent;border:0;border-radius:0;min-height:48px;padding:8px 0;font-size:18px;font-weight:600;color:var(--muted);border-bottom:2px solid transparent}
.studio-layout .art-steps button.active{background:transparent;color:var(--ink);border-bottom-color:var(--accent)}
.studio-layout .commerce-workspace{height:100%;display:flex;flex-direction:column;min-height:0}
.studio-layout [data-extension-art]{height:calc(100% - 65px);min-height:0}
.studio-layout .commerce-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:16px}
.studio-layout .commerce-heading h2{font-size:16px;margin:0;flex-shrink:0}.studio-layout .commerce-heading p{font-size:13px;line-height:20px;margin:0;color:var(--muted)}
.studio-layout .commerce-categories{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px;flex-shrink:0}
.studio-layout .commerce-categories button{padding:12px!important;min-height:72px}.studio-layout .commerce-categories strong{font-size:14px}.studio-layout .commerce-categories span{font-size:13px;line-height:20px;color:var(--muted)}
.studio-layout .commerce-layout{grid-template-columns:360px minmax(0,1fr);gap:24px;align-items:stretch;flex:1;min-height:0}
.studio-layout .commerce-inputs{display:flex;flex-direction:column;min-height:0;background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.commerce-input-scroll{overflow:auto;min-height:0;padding:16px;flex:1;overscroll-behavior:contain}
.commerce-make-actions{padding:12px 16px;border-top:1px solid var(--line);background:var(--panel);flex-shrink:0;max-height:40%;overflow:auto}
.studio-layout .commerce-make-actions p{margin:8px 0 0;font-size:12px;line-height:18px}.studio-layout .commerce-make-actions button{min-height:40px}
.studio-layout .commerce-inputs label{font-size:13px;line-height:20px;margin:12px 0}.studio-layout .commerce-inputs h3{font-size:14px}
.studio-layout .commerce-product-choice{display:flex;align-items:center;gap:8px;margin:4px 0}.studio-layout .commerce-product-choice label{display:flex;align-items:center;gap:8px;flex:1;min-width:0;margin:0;min-height:48px}
.studio-layout .commerce-product-choice label img{width:48px;height:36px;object-fit:contain;flex:none}.studio-layout .commerce-product-choice label span{font-size:13px;overflow-wrap:anywhere}.studio-layout .commerce-product-choice button{font-size:12px;flex:none;min-height:36px}
.studio-layout .commerce-advanced{font-size:13px;border-top:1px solid var(--line);padding-top:12px;margin:16px 0}.commerce-advanced summary{cursor:pointer}
.studio-layout .commerce-template-options{grid-template-columns:1fr}.studio-layout .commerce-template-schematic svg{height:90px}
.studio-layout .commerce-output{position:static;display:flex;flex-direction:column;min-height:0}
.studio-layout .commerce-preview{flex:1;min-height:220px;position:relative;display:flex;align-items:center;justify-content:center}
.studio-layout .commerce-preview>[data-commerce-result]{width:100%;height:100%;position:absolute;inset:0;object-fit:contain}
.studio-layout .commerce-preview>[data-commerce-empty]{width:100%;padding:24px;overflow:auto;max-height:100%;box-sizing:border-box}
.studio-layout .commerce-selection-summary h3{font-size:16px;margin:0 0 16px}.studio-layout .commerce-selection-summary p{padding:0;text-align:left;color:var(--muted);font-size:13px;line-height:20px}
.commerce-summary-product{display:flex;align-items:center;gap:12px;margin:12px 0;font-size:14px}.studio-layout .commerce-summary-product img{width:72px;height:56px;object-fit:contain}
.commerce-asset-help{font-size:13px;color:var(--muted);margin-top:8px}.commerce-asset-help p{line-height:20px}.commerce-asset-help summary{cursor:pointer}
.commerce-compose-switch{display:none}
@media(max-width:900px){
 .studio-layout [data-extension-art],.studio-layout .commerce-workspace{height:auto;min-height:0}.studio-layout .commerce-heading{display:block}.studio-layout .commerce-heading p{margin-top:8px}
 .studio-layout .commerce-categories{grid-template-columns:repeat(2,minmax(0,1fr))}
 .commerce-compose-switch{display:flex;gap:8px;margin:0 0 12px}.commerce-compose-switch button{min-height:44px;flex:1}.commerce-compose-switch [aria-pressed=true]{color:var(--accent);background:#eef2ff}
 .studio-layout .commerce-layout{grid-template-columns:1fr}.commerce-input-scroll{overflow:visible}.commerce-make-actions{max-height:none;overflow:visible}.studio-layout .commerce-preview{min-height:320px}
 [data-compose-panel=inputs] .commerce-output{display:none}[data-compose-panel=preview] .commerce-inputs{display:none}
 .studio-layout .commerce-preview>[data-commerce-result]{position:static;height:auto}
}
@media(max-width:420px){.studio-layout .commerce-categories{grid-template-columns:1fr}.studio-layout .commerce-preview{min-height:260px}}
.studio-layout .profile-workspace{position:relative}
.material-status-legend{position:absolute;bottom:8px;left:8px;right:8px;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 10px;border:1px solid #52606d;border-radius:6px;background:#202a33ed;color:#d7e0e9;font-size:11px;pointer-events:none}
.material-status-counts{display:flex;gap:12px;flex-wrap:wrap}
.material-status-counts [data-material-state]::before{content:"";display:inline-block;width:7px;height:7px;margin-right:5px;border:1px solid #8795a4;border-radius:2px}
.material-status-counts [data-material-state=pending]::before{border-style:dashed;border-color:#e1a052;background:#d9822530}
.material-status-counts [data-material-state=confirmed]::before{border-color:#92b4df;background:#4b7bb850}
.material-status-legend [data-status-hint]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:45%}
.material-card[data-material-state=confirmed]{border-left:3px solid #4b7bb8}
.material-card[data-material-state=pending]{border-left:3px dashed #d98225}
.material-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.marking-asset{display:flex;gap:12px;align-items:center;min-height:64px;margin:16px 0;color:var(--muted);font-size:13px}
.marking-asset img{width:72px;height:56px;object-fit:contain;border:1px solid var(--border,#dfe2e8);border-radius:6px;background:repeating-conic-gradient(#eef0f4 0% 25%,white 0% 50%) 0 0/12px 12px}
.marking-actions{display:flex;gap:12px;align-items:center;margin-bottom:16px}
.marking-place{width:100%;min-height:36px;margin:12px 0}
.marking-controls{border-top:1px solid var(--border,#dfe2e8);margin-top:16px;padding-top:8px}
.studio-layout .marking-controls .property-row{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:12px 0}
.studio-layout .marking-controls input[type=number]{width:80px;min-height:34px;border:1px solid var(--border,#dfe2e8);border-radius:6px;background:white;padding:6px 8px;color:var(--text,#20242c);box-sizing:border-box}
.studio-layout .marking-controls input[type=color]{width:80px;height:34px;border:1px solid var(--border,#dfe2e8);border-radius:6px;background:white;padding:3px}
.studio-layout .marking-controls select{width:108px;min-height:34px}
.marking-status{overflow-wrap:anywhere}.marking-placement{cursor:crosshair!important}
.marking-control-title{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:14px 0 8px;font-size:13px;font-weight:600}
.marking-controls [data-marking-scale-range]{width:100%;margin:6px 0;accent-color:var(--accent,#3157ee)}
.marking-faces{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.marking-faces button{min-height:34px;padding:6px 3px;border:1px solid var(--border,#dfe2e8);border-radius:6px;background:white;color:var(--text,#20242c);font:inherit;font-size:12px;cursor:pointer;transition:background 140ms,border-color 140ms,transform 100ms}
.marking-faces button:hover:not(:disabled){background:#f0f3ff;border-color:#a8b8fb}.marking-faces button:active:not(:disabled){transform:scale(.97)}
.marking-faces button[aria-pressed=true]{background:#e9eeff;color:#3157ee;border-color:#7f99ff}.marking-faces button:disabled{opacity:.45;cursor:not-allowed}
.marking-more{border-top:1px solid var(--border,#dfe2e8);margin-top:16px;padding-top:12px}.marking-more summary{font-size:13px;cursor:pointer;color:var(--muted,#667085)}
.marking-gizmo{position:absolute;z-index:8;width:92px;height:92px;transform:translate(-50%,-50%);pointer-events:none}
.marking-outlines{position:absolute;z-index:7;pointer-events:none;overflow:hidden}.marking-outlines[hidden]{display:none}.marking-outlines polygon{fill:#3157ee08;stroke:#3157ee;stroke-width:1.5;stroke-dasharray:4 3;vector-effect:non-scaling-stroke;pointer-events:all;cursor:pointer}.marking-outlines polygon[aria-pressed=true]{stroke-dasharray:none;fill:#3157ee10;cursor:grab}.marking-outlines polygon:focus-visible{stroke-width:3;outline:none}.marking-outlines.marking-invalid polygon{stroke:#bb4a35;fill:#bb4a350a}
.marking-gizmo[hidden]{display:none}.marking-gizmo button{position:absolute;width:28px;height:28px;border:1px solid #b2c0ef;border-radius:6px;background:#fffefc;color:#3157ee;box-shadow:0 2px 5px #1c25451a;pointer-events:auto;cursor:grab;touch-action:none;font-size:14px;transition:background 120ms,transform 100ms}
.marking-gizmo button:hover{background:#e9eeff}.marking-gizmo button:active{cursor:grabbing;transform:scale(.95)}.marking-gizmo button:focus-visible{outline:2px solid #3157ee;outline-offset:2px}
.marking-gizmo [data-marking-nudge=up]{left:32px;top:0}.marking-gizmo [data-marking-nudge=down]{left:32px;bottom:0}.marking-gizmo [data-marking-nudge=left]{left:0;top:32px}.marking-gizmo [data-marking-nudge=right]{right:0;top:32px}.marking-gizmo [data-marking-drag]{left:32px;top:32px;background:#3157ee;color:white}
@media(prefers-reduced-motion:reduce){.marking-faces button,.marking-gizmo button{transition:none}}
@media(max-height:560px) and (min-width:901px){.studio-layout.extension-active .extension-workspace{height:auto;overflow:visible}.studio-layout [data-extension-art],.studio-layout .commerce-workspace{height:auto}.commerce-input-scroll{max-height:400px}.commerce-make-actions{max-height:none}}

/* A shader specimen has a flat section and large rounded cube edges. */
.studio-layout .material-group-tokens{gap:10px 8px}
.studio-layout .material-inspector .inspector-heading{display:none}
.studio-layout .material-token.material-token-preview{display:flex;flex-direction:column;align-items:stretch;gap:6px;padding:4px 4px 8px;border:1px solid transparent;border-radius:10px;background:transparent;min-width:0;min-height:0;text-align:center;white-space:normal;cursor:grab}
.studio-layout .material-token.material-token-preview::before{display:none}
.studio-layout .material-token-preview:hover{border-color:#c8d3ee;background:#f5f7fc}
.studio-layout .material-token-preview:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.studio-layout .material-token-preview:active{cursor:grabbing}
.material-preview-frame{display:block;width:100%;aspect-ratio:1;border-radius:14px;background:linear-gradient(145deg,#f5f6f8,#e4e7ec);overflow:hidden;pointer-events:none}
.material-preview-frame img{display:block;width:100%;height:100%;object-fit:contain}
.material-preview-name{font-size:12px;line-height:18px;min-height:18px;color:#435268;overflow-wrap:anywhere;pointer-events:none}
.material-drag-label{position:fixed;z-index:10000;display:block;width:max-content;max-width:210px;padding:5px 10px;border:1px solid #bac7eb;border-radius:6px;background:#f5f8ff;color:#253758;box-shadow:0 2px 5px #17365b22;font:13px/20px "Microsoft YaHei",sans-serif;white-space:nowrap;pointer-events:none}
.studio-layout .toolbar-actions .feedback-open{display:inline-flex;align-items:center;padding:7px 9px;min-height:34px;font-size:12px;white-space:nowrap}
.personal-material-workspace{padding:18px}
.personal-material-workspace .extension-layout{min-height:0}
.personal-material-workspace .extension-stage{min-height:280px}
.personal-material-workspace .extension-stage .product-sample{height:100%;min-height:280px}
.personal-material-empty{position:absolute;inset:0;display:grid;place-items:center;padding:24px;margin:0;text-align:center;color:#627086;line-height:1.7}
.personal-ai-status{border-top:1px solid var(--line);padding-top:16px;margin-top:8px}
.personal-ai-status h3 span{margin-left:8px;font-weight:400;font-size:12px;color:#78859a}
.personal-ai-status{display:grid;gap:10px}
.personal-ai-status h3,.personal-ai-status p{margin:0}
.personal-ai-status textarea{width:100%;min-height:76px;resize:vertical;padding:8px;border:1px solid var(--line);border-radius:6px;font:inherit;font-size:13px;line-height:1.5}
.personal-ai-status label{font-size:13px;line-height:1.6}
.personal-ai-status .personal-ai-prompt-label{display:grid;gap:5px}
.personal-ai-status .personal-ai-consent{display:block;color:#526279;font-size:12px}
.personal-ai-consent input{width:auto;margin-right:5px;vertical-align:middle}
.personal-ai-note{color:#748195;font-size:12px!important}
.personal-ai-status [data-ai-result] img{display:block;width:100%;max-height:240px;object-fit:contain;background:#e7ebf0;border-radius:8px;margin-bottom:8px}
.personal-ai-status [data-ai-result] a{display:block;text-align:center;color:var(--accent)}
.personal-ai-status [hidden]{display:none!important}
.studio-layout.extension-active .personal-material-workspace{height:100%;min-height:0;overflow:auto}
@media(max-width:900px){.personal-material-workspace .extension-layout{grid-template-columns:1fr}.personal-material-workspace .extension-stage{height:320px}.studio-layout.extension-active .personal-material-workspace{height:auto}.studio-layout .toolbar-actions .feedback-open{padding-inline:5px}}
@media(max-width:600px){.studio-layout .app-toolbar{display:flex;flex-wrap:wrap;height:auto;min-height:56px;row-gap:4px;padding-bottom:8px}.studio-layout .toolbar-workspaces{flex:1 0 100%;justify-content:flex-start}.studio-layout .toolbar-workspaces .workspace-tab{flex:0 0 auto;padding-inline:10px;white-space:nowrap}.studio-layout .toolbar-actions{flex:1 0 100%;margin-left:0;justify-content:flex-end}.material-preview-name{font-size:13px}}

/* Personal extension pages share one immutable sample, with separate controls. */
.studio-layout.extension-active .personal-material-workspace{display:flex;flex-direction:column;gap:14px;overflow:hidden;box-sizing:border-box}
.personal-material-workspace .extension-heading{flex:none;margin:0}
.personal-extension-tabs{display:flex;gap:8px;flex:none;border-bottom:1px solid var(--line);padding-bottom:12px}
.personal-extension-tabs button{padding:10px 16px;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:14px;color:var(--muted)}
.personal-extension-tabs button.active{background:#edf2ff;border-color:#b7c8ff;color:var(--accent)}
.personal-material-workspace [data-mode-panel]{flex:1;min-height:0;overflow:auto}
.personal-material-workspace [data-mode-panel][hidden]{display:none!important}
.personal-material-workspace .extension-layout{height:100%;grid-template-columns:minmax(0,1fr) 330px;gap:20px}
.personal-material-workspace .extension-settings{overflow:auto;padding:0 8px 16px 0;min-height:0}
.personal-material-workspace .extension-settings p,.personal-texture-rights{font-size:13px;color:#627086;line-height:1.65}
.personal-material-workspace .extension-stage{overflow:hidden;border-radius:12px}
.personal-ai-status{margin:0;padding:0;border:0;height:100%;display:block}
.personal-ai-layout{height:100%;display:grid;grid-template-columns:minmax(320px,440px) minmax(0,1fr);gap:20px}
.personal-ai-inputs,.personal-ai-preview{overflow:auto;min-width:0;min-height:0;border:1px solid var(--line);border-radius:12px;background:#fff;padding:20px}
.personal-ai-inputs{display:flex;flex-direction:column;gap:12px}
.personal-picture-products{margin:0;padding:12px;border:1px solid var(--line);border-radius:10px;min-width:0}
.personal-picture-product{display:grid!important;grid-template-columns:20px minmax(0,1fr);gap:6px 10px;align-items:center;margin:10px 0}
.personal-picture-product input[type=checkbox]{width:16px!important;margin:0!important}
.personal-picture-product small{grid-column:2;color:var(--muted);font-size:12px}
.personal-picture-crop{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.personal-ai-status label{display:grid;gap:5px}
.personal-ai-status input:not([type=checkbox]),.personal-ai-status select{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:6px;padding:8px;font:inherit;font-size:13px}
.personal-ai-status input[type=checkbox]{width:auto;flex:none}
.personal-ai-status label:has(input[type=checkbox]){display:block}
.personal-ai-status p{font-size:13px;line-height:1.65;color:#627086}
.personal-ai-status h3{font-size:16px;margin-bottom:4px}
.personal-ai-status [data-page-editor]{margin-top:12px;padding-top:16px;border-top:1px solid var(--line);display:grid;gap:12px}
.personal-ai-status [data-page-documents]{display:grid;gap:10px}
.personal-ai-status [data-page-documents] section{border:1px solid var(--line);border-radius:8px;padding:12px;margin-top:12px}
.personal-ai-status [data-page-documents] details{margin-top:10px}
.personal-ai-status [data-page-documents] summary{cursor:pointer;font-size:13px;color:#3b4d66}
.personal-table-editor{overflow:auto;margin-top:10px}
.personal-table-editor table{border-collapse:collapse;table-layout:fixed;min-width:100%;width:max-content}
.personal-table-editor td,.personal-table-editor th{border:1px solid var(--line);padding:4px}
.personal-table-editor td{min-width:120px}
.personal-table-editor input{min-width:120px}
.personal-ai-preview{background:#f1f3f7;display:flex;flex-direction:column;gap:16px}
.personal-ai-preview [data-ai-reference-stage]{min-height:240px;flex:none}
.personal-ai-preview .extension-stage{height:240px;min-height:240px}
.personal-ai-preview .extension-stage .product-sample{min-height:240px}
.personal-page-preview-toolbar{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:12px}
.personal-page-pages{display:grid;gap:16px;margin-top:14px}
.personal-page-pages figure{margin:0;display:grid;gap:10px}
.personal-page-pages img{display:block;width:100%;height:auto;border:1px solid #d8dfeb;border-radius:8px;background:#fff}
.personal-page-pages a{color:var(--accent);text-align:center;font-size:13px}
@media(max-width:900px){
 .studio-layout.extension-active .personal-material-workspace{height:auto;overflow:visible}
 .personal-material-workspace .extension-layout,.personal-ai-layout{height:auto;grid-template-columns:1fr}
 .personal-material-workspace [data-mode-panel]{overflow:visible}
 .personal-ai-inputs,.personal-ai-preview{overflow:visible}
 .personal-extension-tabs{flex-wrap:wrap}
 .personal-material-workspace .extension-settings{overflow:visible}
}

.personal-ai-inputs > *, .personal-ai-status [data-page-editor], .personal-ai-status [data-page-documents], .personal-ai-status [data-page-documents] section {min-width:0}
.personal-ai-status textarea{box-sizing:border-box}
.personal-table-editor{min-width:0;max-width:100%}

.personal-ai-status [data-page-editor],.personal-ai-status [data-page-documents]{grid-template-columns:minmax(0,1fr)}
.personal-ai-status [data-page-documents] > *{min-width:0;max-width:100%}
.studio-layout .material-void-action{grid-column:1/-1;justify-content:center;min-height:38px;border:1px dashed #b8c5d5;border-radius:8px;background:transparent;padding:8px;cursor:grab}
.studio-layout .material-void-action::before{display:none}
.personal-sample-display{display:flex;flex-direction:column;min-width:0;min-height:0;gap:10px}
.personal-sample-display .extension-stage{flex:1;min-height:220px}
.personal-sample-views{display:flex;gap:8px;flex-wrap:wrap}
.personal-sample-views button{font-size:13px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:#fff}
.personal-sample-views button[aria-pressed=true]{background:#edf2ff;color:var(--accent);border-color:#b7c8fa}
.personal-render-comparison{padding:14px;border:1px solid var(--line);border-radius:10px;background:#fff;margin-bottom:16px}
.personal-render-comparison h4{margin:0;font-size:14px}
[data-render-reference-list]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
[data-render-reference-list] figure,.personal-ai-reference-input figure{margin:0;min-width:0}
[data-render-reference-list] img,.personal-ai-reference-input img{display:block;width:100%;aspect-ratio:1;object-fit:contain;border:1px solid var(--line);border-radius:8px;background:#f5f6f8}
[data-render-reference-list] figcaption,.personal-ai-reference-input figcaption{font-size:12px;color:#627086;text-align:center;padding:5px}
.personal-ai-reference-input{border:1px solid var(--line);border-radius:8px;padding:10px}
.personal-ai-reference-input summary{cursor:pointer;font-size:13px;color:#435268}
[data-ai-reference-images]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.personal-ai-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:280px;padding:20px;border:1px dashed #cbd4e1;border-radius:10px;background:#f8f9fc;text-align:center}
.personal-ai-empty span{font-size:13px;color:#7b8797;max-width:340px;line-height:1.7}
.personal-ai-status .personal-ai-output [data-ai-result] img{max-height:none;object-fit:contain;background:#fff}

/* Keep navigation available while the narrow layout scrolls. */
.studio-layout .app-toolbar{position:fixed;top:0;background:#f7f7f8;z-index:30}
.studio-layout #marking-inspector .status-check{display:flex;align-items:center;gap:6px}