/* Studio 2.0: category rail, canvas and one contextual editing panel. */
.studio-v2{--line:#e2e3df;--ui-green:#283f35;--ink:#202c26;background:#f3f3ef;color:#202c26}
.studio-v2 header{height:64px;padding:0 26px;background:#fcfcfa;border-bottom:1px solid #dedfd9}.studio-v2 .header-title{font-size:10px;letter-spacing:1.8px}.studio-v2 .brand{font-size:20px}.studio-v2 .brand-sub{font-size:8px}.studio-v2 .primary{border-radius:7px;height:38px}
.studio-v2 main{display:grid;grid-template-columns:92px minmax(300px,1fr) 350px;grid-template-rows:58px minmax(0,1fr);height:calc(100dvh - 64px);min-height:500px;overflow:hidden}
.category-rail{grid-column:1;grid-row:1 / 3;background:#fcfcfa;border-right:1px solid #dedfd9;display:flex;flex-direction:column;align-items:center;padding:25px 8px 16px;gap:22px}.rail-label{font-size:9px;letter-spacing:2px;color:#89928b}
.studio-v2 #steps{display:flex;flex-direction:column;width:100%;gap:8px;margin:0}.studio-v2 #steps .step{display:flex;flex-direction:column;gap:9px;min-height:76px;padding:13px 1px;border:0;background:transparent;border-radius:12px;font-size:11px;color:#737c73}.studio-v2 #steps .step-num{font-family:Arial,sans-serif;font-size:24px;line-height:24px;color:#6d7e70}.studio-v2 #steps .step.active{background:#e6ecdf;color:#254233;font-weight:700}.studio-v2 #steps .step.active .step-num{color:#294836}.studio-v2 .rail-search{margin-top:auto;border:1px solid #dde1d7;border-radius:50%;height:38px;width:38px;background:white;font-size:24px;color:#415b4a}
.studio-v2 .workspace{grid-column:2;grid-row:1 / 3;min-width:0;padding:0 30px 18px;background:radial-gradient(ellipse at 50% 44%,#fafbf7,#eeefe9);border:0}.studio-v2 .workspace.night{background:#101814}.studio-v2 .canvas-top{height:78px;min-height:78px;padding-top:20px}.studio-v2 .canvas-top h2{font-size:19px;color:#334436}.studio-v2 .canvas-top .eyebrow{font-size:8px;letter-spacing:2px}.studio-v2 .selection-status{display:none}.studio-v2 .render-toolbar{gap:10px;align-self:center;z-index:2}.studio-v2 .render-toolbar>div{border:1px solid #dfe3d8;border-radius:9px;box-shadow:0 3px 10px #293a2410;background:#ffffffd9}.studio-v2 .render-toolbar button{min-height:34px;padding:7px 10px;font-size:11px;border-radius:6px}.studio-v2 .canvas-tools{top:153px;left:24px;right:24px}.studio-v2 .canvas-tools button{width:34px;height:34px;border-radius:8px}.studio-v2 #stage{min-height:140px;flex:1;width:100%}.studio-v2 .light-control{border:0;background:#ffffffb3;border-radius:20px;padding:5px 9px;margin-top:8px}.studio-v2 .light-control button{padding:7px 9px;font-size:10px}.studio-v2 .canvas-hint{font-size:10px;color:#798272;margin-top:10px}.studio-v2 #dimension-readout{font-size:10px;color:#73806d}
.panel-switch{grid-column:3;grid-row:1;display:flex;align-items:stretch;padding:0 20px;gap:22px;background:#fff;border-left:1px solid var(--line);border-bottom:1px solid var(--line)}.studio-v2 .panel-switch button{background:none;border:0;border-bottom:2px solid transparent;border-radius:0;font-size:13px;padding:0 4px;color:#8b938a}.studio-v2 .panel-switch button[aria-pressed="true"]{color:#294c36;border-bottom-color:#365e40;font-weight:650}.v2-count{font-size:10px;background:#edf1e8;border-radius:10px;padding:2px 5px;margin-left:3px}
.studio-v2 .library,.studio-v2 .inspector{grid-column:3;grid-row:2;border-left:1px solid var(--line);border-right:0;padding:0 22px 28px;background:#fff;min-height:0;max-height:none;overflow-y:auto}.studio-v2[data-panel="design"] .inspector{display:none}.studio-v2:not([data-panel="design"]) .library{display:none}.studio-v2 .library>.panel-heading,.studio-v2 .inspector>.panel-heading{position:static;padding:22px 0 16px;background:transparent}.studio-v2 .library>.panel-heading>.eyebrow,.studio-v2 .inspector>.panel-heading>.eyebrow,.studio-v2 .library h1,.studio-v2 .inspector h2,.studio-v2 .inspector-tabs{display:none}.studio-v2 .find-control{border-radius:7px;min-height:38px;background:#f7f8f4;color:#697662}.studio-v2 .catalog-title{margin:4px 0 8px}.studio-v2 .catalog-title h2{font-size:21px;font-weight:600;letter-spacing:-.8px}.studio-v2 .catalog-title span{font-size:10px}.studio-v2 .catalog-description{line-height:1.8;color:#838b7e;font-size:12px;margin-bottom:22px}
.studio-v2 .menu-group{border:0;border-top:1px solid #e5e8df;border-radius:0;box-shadow:none;margin:0}.studio-v2 .menu-group>summary{padding:17px 0;background:white;color:#33482f;font-size:13px;font-weight:600}.studio-v2 .menu-group>summary small{font-size:11px;font-weight:400;margin-top:5px;color:#818c78}.studio-v2 .menu-group[open]>summary{border:0;background:white}.studio-v2 .menu-group-body{padding:0 0 20px}.studio-v2 .menu-group[open] .menu-chevron{color:#354e2f}.studio-v2 .options{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.studio-v2 .option{border-radius:8px;background:#fafbf7;padding:10px 4px;border-color:#e5e8de;min-height:87px}.studio-v2 .option.active{background:#edf3e6;border-color:#8fa680;box-shadow:inset 0 0 0 1px #8fa680}.studio-v2 .option .option-name{font-size:11px}.studio-v2 .option svg{height:44px}.studio-v2 .spec-select{font-size:12px;color:#526247}.studio-v2 select,.studio-v2 .dimension-grid input,.studio-v2 .text-input{min-height:37px;border-radius:6px;background:#fafbf8}.studio-v2 .help{font-size:11px;line-height:1.8;color:#7a8571}.studio-v2 .step-next{border-radius:7px;min-height:42px;margin-top:20px}.studio-v2 .reference-link{border:0;border-top:1px solid #e4e7dd;padding:16px 0}.studio-v2 .empty-selection{padding-top:55px}.studio-v2 .empty-selection strong{font-size:16px;color:#42513c}.studio-v2 .layer-group{border-radius:7px}.studio-v2 .variant-card{border-radius:8px}.studio-v2 .selected-header{border-radius:8px}
.studio-v2.focus-mode main{grid-template-columns:92px minmax(0,1fr)}.studio-v2.focus-mode .workspace{grid-column:2;grid-row:1 / 3}.studio-v2.focus-mode .panel-switch{display:none}.v2-return{display:none}
@media(min-width:1550px){.studio-v2 main{grid-template-columns:100px minmax(400px,1fr) 380px}}
@media(max-width:1100px) and (min-width:851px){.studio-v2 main{grid-template-columns:78px minmax(280px,1fr) 310px}.studio-v2 .library,.studio-v2 .inspector{padding-left:16px;padding-right:16px}.studio-v2 .workspace{padding-left:16px;padding-right:16px}.studio-v2 #steps .step{font-size:10px}.studio-v2 .render-toolbar button{padding:6px}}
@media(max-width:850px){.studio-v2 header{height:56px;padding:0 14px}.studio-v2 main{height:auto;min-height:0;display:grid;grid-template-columns:1fr;grid-template-rows:470px auto 54px auto;overflow:visible}.studio-v2 .workspace{grid-column:1;grid-row:1;height:470px;padding:0 14px 12px}.studio-v2 .canvas-top{height:62px;min-height:62px;padding-top:12px}.studio-v2 .canvas-top h2{font-size:16px}.studio-v2 .render-toolbar button{padding:6px;font-size:10px;min-height:32px}.studio-v2 .canvas-tools{top:130px;left:20px;right:20px}.category-rail{grid-column:1;grid-row:2;display:block;padding:10px 12px;border:0;border-top:1px solid var(--line);background:#fafbf8;position:sticky;top:0;z-index:8}.rail-label,.studio-v2 .rail-search{display:none}.studio-v2 #steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:3px}.studio-v2 #steps .step{min-height:61px;gap:5px;padding:8px 0;font-size:10px;border-radius:8px}.studio-v2 #steps .step-num{font-size:20px;line-height:20px}.panel-switch{grid-column:1;grid-row:3;border-left:0;padding:0 20px;position:sticky;top:81px;z-index:7}.studio-v2 .library,.studio-v2 .inspector{grid-column:1;grid-row:4;max-height:none;overflow:visible;border-left:0;padding:0 20px 75px}.studio-v2 .library>.panel-heading,.studio-v2 .inspector>.panel-heading{position:static;padding-top:18px}.studio-v2 .find-control kbd{display:none}.studio-v2 #catalog summary{scroll-margin-top:145px}.studio-v2 .v2-return{display:block;position:fixed;bottom:16px;right:16px;z-index:15;border:1px solid #d4ddcd;background:#fcfff6eb;border-radius:24px;box-shadow:0 4px 18px #223c2920;padding:11px 16px;font-size:12px;color:#385532}.studio-v2.focus-mode main{display:block}.studio-v2.focus-mode .category-rail,.studio-v2.focus-mode .v2-return{display:none}.studio-v2.focus-mode .workspace{height:calc(100dvh - 56px)}.studio-v2 .canvas-hint{font-size:9px}.studio-v2 .brand-sub{display:none}.studio-v2 .light-control{margin-top:3px}}
@media(max-width:360px){.studio-v2 #steps .step{font-size:9px}.studio-v2 .render-toolbar{gap:3px}.studio-v2 .render-toolbar button{font-size:9px;padding:5px}.studio-v2 .workspace{padding-left:8px;padding-right:8px}}
