:root{--workbench-header-height:108px}
.immersive .app-header{height:auto;padding:0;display:flex;flex-direction:column;align-items:stretch;background:#fff;color:#26362e;border-bottom:1px solid #e1e6e2;gap:0}
.workbench-header-main{display:flex;align-items:center;min-height:64px;padding:0 24px;gap:0}
.immersive .app-header .brand{width:auto;flex:none;padding-right:20px;margin:0;border-right:1px solid #e1e6e2}
.immersive .app-header .brand img{content:normal;width:140px;height:26px;display:block}
.workbench-title{padding-left:20px;white-space:nowrap;font-size:18px;font-weight:500;line-height:26px;color:#26362e}
.immersive .app-header .header-actions{gap:16px;min-width:0}
.workbench-tabs{display:flex;align-items:stretch;padding:0 24px;height:44px;flex:none;gap:0}
.workbench-tabs button{display:flex;align-items:center;justify-content:center;gap:8px;flex:1;position:relative;padding:0 12px;color:#738077;font-size:14px;font-weight:400;border-radius:0;transition:color .15s,background .15s}
.workbench-tabs button img{width:20px;height:20px;flex:none}
.workbench-tabs button:hover{background:#f5f8f5;color:#263e30}
.workbench-tabs button[aria-selected=true]{color:#243d2e;background:transparent}
.workbench-tabs button[aria-selected=true]:after{content:"";position:absolute;bottom:0;height:2px;left:0;right:0;background:#319963}
.workbench-tabs button:focus-visible,.immersive .app-header button:focus-visible{outline:2px solid #319963;outline-offset:-3px}
.immersive .app-body{height:calc(100vh - var(--workbench-header-height));min-height:0}
.immersive.focus-view .app-body{height:100vh;height:100dvh}
#model-workbench{position:fixed;top:var(--workbench-header-height);left:0;width:100%;height:calc(100vh - var(--workbench-header-height));border:0;background:#f7f8f7;z-index:30}
body.model-active #render-workbench{display:none}
#model-workbench.checkin-overlay{background:transparent;z-index:100}
.immersive .app-header #workbench-checkin{display:flex;align-items:center;gap:6px;color:#788179;border:0;border-radius:6px;padding:6px 0;font-size:12px;background:transparent;white-space:nowrap}
#workbench-checkin svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.immersive .app-header #workbench-checkin:hover{color:#258651}
.immersive .app-header .member-account{gap:14px}
.immersive .app-header .member-feather-balance{display:flex;align-items:center;gap:6px;padding:5px 12px;background:#f3f5f2;border:1px solid #e7ebe5;border-radius:20px;color:#29382f;font-size:14px;line-height:20px;font-weight:600;white-space:nowrap}
.immersive .app-header .member-feather-balance img{width:20px;height:20px}
.immersive .app-header .member-status{display:flex;align-items:center;gap:10px;padding:0;color:#788179;font-size:12px}
.immersive .app-header .member-status.is-member{color:#39483f;border-left:1px solid #e7ebe5;padding-left:14px}
.member-status.is-member #member-label{display:none}
.member-status:not(.is-member) .account-chevron{display:none}
.account-chevron{width:7px;height:7px;border-right:1px solid #7c887f;border-bottom:1px solid #7c887f;transform:rotate(45deg);margin:0 3px 4px 0}
.immersive .app-header .member-avatar{width:30px;height:30px;border-radius:50%}
.immersive .app-header .test-data-entry,.immersive .app-header .member-login{color:#53655a;background:#f4f6f3;border-color:#e1e7e0}
.immersive .app-header .avatar{color:#7c6b55;background:#dfd0bd}
.immersive .member-message{top:calc(var(--workbench-header-height) + 8px)}
@media(max-width:700px){.workbench-header-main{padding:0 14px;flex-wrap:wrap;min-height:64px;row-gap:8px;padding-top:12px;padding-bottom:12px}.immersive .app-header .brand{padding-right:12px}.immersive .app-header .brand img{width:128px;height:24px}.workbench-title{padding-left:12px;font-size:17px}.immersive .app-header .header-actions{gap:12px}.workbench-tabs{padding:0 14px}}
@media(max-width:540px){.immersive .app-header .header-actions{width:100%;justify-content:flex-end;padding-top:2px}.immersive .app-header .member-account{gap:12px}}

.immersive .app-header #member-checkin{color:#788179;background:transparent;border:0;font-size:12px}
.immersive #source-preview{width:100%;max-width:250px;aspect-ratio:4/3;border-radius:20px;background:#f0f2ef;overflow:hidden}
.immersive .reference-source-empty{border:1px dashed #cdd6ce;border-radius:20px}

.brush-sizes{display:flex;align-items:center;gap:2px;padding:0 5px;border-left:1px solid #e1e7e2;border-right:1px solid #e1e7e2}
.brush-sizes[hidden]{display:none}
.brush-tools .brush-sizes button{display:flex;align-items:center;justify-content:center;gap:4px;min-width:36px;padding:5px;font-size:11px}
.brush-sizes i{display:block;flex:none;background:currentColor;border-radius:50%}
.brush-sizes button[aria-pressed="true"]{background:#dff9e9;box-shadow:inset 0 0 0 1px #4dd87c;color:#16703e}
#selection{touch-action:none}
#selection>b{display:none}
#selection .selection-resize{position:absolute;display:block;width:14px;height:14px;background:#fff;border:2px solid #4dd87c;border-radius:3px;transform:translate(-50%,-50%);z-index:2;touch-action:none}
.selection-resize[data-resize="nw"]{left:0;top:0;cursor:nwse-resize}.selection-resize[data-resize="ne"]{left:100%;top:0;cursor:nesw-resize}.selection-resize[data-resize="sw"]{left:0;top:100%;cursor:nesw-resize}.selection-resize[data-resize="se"]{left:100%;top:100%;cursor:nwse-resize}
.selection-resize[data-resize="n"]{left:50%;top:0;cursor:ns-resize}.selection-resize[data-resize="s"]{left:50%;top:100%;cursor:ns-resize}.selection-resize[data-resize="w"]{left:0;top:50%;cursor:ew-resize}.selection-resize[data-resize="e"]{left:100%;top:50%;cursor:ew-resize}
#selection>#clear-selection{top:-32px}

/* Same settings width as the furniture-model workspace. */
@media(min-width:641px){.immersive .settings,.immersive.composing .settings{--settings-width:380px;width:380px;min-width:380px;flex-basis:380px}}

.immersive .settings-scroll{padding-inline:22px;scrollbar-gutter:stable}
.immersive #source-preview{width:100%;max-width:none;aspect-ratio:4/3}


/* Keep the widened settings column in normal flow and fully release its width
   when collapsed; a fixed flex-basis would leave an invisible empty column. */
@media(min-width:641px){
 .immersive .settings,.immersive.composing .settings{position:relative;left:auto;top:auto;bottom:auto;min-width:0;flex:0 0 auto;--settings-content-inset:22px}
 .immersive.settings-collapsed .settings{width:0;min-width:0;flex-basis:auto}
}

@media(min-width:641px){
 .immersive .settings{border-right:1px solid #e9e9e9}
 .immersive .settings .settings-scroll,.immersive .settings .generate-footer{width:calc(var(--settings-width) - 1px);min-width:calc(var(--settings-width) - 1px);padding-inline:22px}
 .immersive .settings .settings-scroll{scrollbar-width:thin}
}

.history-preview .history-preview-arrow{display:grid;place-items:center;padding:0;line-height:1}
.history-preview-arrow svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* Balanced rail / settings proportions with room at both panel edges. */
@media(min-width:641px){
 .immersive .settings,.immersive.composing .settings{--settings-width:346px;width:346px;--settings-content-inset:18px}
 .immersive.settings-collapsed .settings{width:0}
 .immersive .settings .settings-scroll,.immersive .settings .generate-footer{padding-inline:18px}
}

@media(min-width:641px){
 .immersive .rail{width:68px;min-width:68px;flex:0 0 68px}
 .immersive .rail .rail-item,.immersive .rail #new-session,.immersive .rail #new-session.active{height:64px;min-height:64px;flex-basis:64px;padding:8px 0;justify-content:center;gap:6px}
 .immersive .rail .rail-item i,.immersive .rail .rail-item svg{width:22px;height:22px}
 .immersive .rail .rail-item span{font-size:12px;line-height:18px}
 .immersive .rail .rail-bottom{margin-top:auto}
 .immersive .rail .customer-help-button img{width:32px;height:30px}
}

/* The shared account card must paint above the embedded workspace (30),
   while the explicit check-in overlay keeps its existing higher layer (100). */
.immersive .app-header{z-index:40;overflow:visible}
/* Account popovers must also clear the positioned tabs inside the header. */
.immersive .app-header .member-account{z-index:2}
.immersive .app-header .member-card{z-index:1}

/* Gate dvh + var(): old CEF accepts var() at parse time, then invalidates height. */
@supports (height:100dvh){
 .immersive .app-body{height:calc(100dvh - var(--workbench-header-height))}
 .immersive.focus-view .app-body{height:100dvh}
 #model-workbench{height:calc(100dvh - var(--workbench-header-height))}
}

/* Tabs use a bottom indicator rather than the browser's rectangular focus ring. */
.immersive .app-header .workbench-tabs button,
.immersive .app-header .workbench-tabs button:focus{border:0;outline:none;box-shadow:none}
.immersive .app-header .workbench-tabs button:focus-visible:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:#319963}
/* Hide native-only controls even when their layout rule uses display:flex. */
.immersive #recapture-scene[hidden]{display:none!important}