/* Layout is independent of color. Normal uses the full-scene layout geometry only. */
html[data-studio-layout=normal] body#daailokStudio{--light-sidebar:clamp(250px,21vw,310px)!important;--light-header:62px!important;padding:14px!important;}
html[data-studio-layout=normal] body#daailokStudio .studio{position:relative!important;display:grid!important;grid-template-rows:var(--light-header) minmax(0,1fr)!important;width:100%!important;height:calc(100dvh - 28px)!important;min-height:0!important;margin:0!important;padding:4px!important;border-radius:24px!important;overflow:hidden!important;}
html[data-studio-layout=normal] body#daailokStudio .studio:before,html[data-studio-layout=normal] body#daailokStudio .studio:after{display:none!important;}
html[data-studio-layout=normal] body#daailokStudio .topbar{position:relative!important;display:flex!important;height:var(--light-header)!important;min-height:0!important;padding:0 8px 0 0!important;gap:4px!important;}
html[data-studio-layout=normal] body#daailokStudio .brand{width:var(--light-sidebar)!important;min-width:var(--light-sidebar)!important;height:100%!important;padding:0 20px!important;gap:7px!important;align-items:center!important;border-radius:18px 18px 0 0!important;}
html[data-studio-layout=normal] body#daailokStudio .brand .logo{width:25px!important;height:25px!important;}
html[data-studio-layout=normal] body#daailokStudio .top-function-nav.rail{height:100%!important;flex:1 1 auto!important;min-width:0!important;margin:0!important;gap:2px!important;justify-content:flex-start!important;padding:0 3px!important;}
html[data-studio-layout=normal] body#daailokStudio .top-function-nav .rail-item{height:42px!important;min-width:38px!important;padding:0 11px!important;gap:5px!important;border-radius:var(--ds-radius-pill)!important;}
html[data-studio-layout=normal] body#daailokStudio .top-function-nav .rail-item:after{display:inline!important;}
html[data-studio-layout=normal] body#daailokStudio .top-function-nav .rail-item svg{width:15px!important;height:15px!important;}
html[data-studio-layout=normal] body#daailokStudio .top-actions{gap:5px!important;flex-shrink:0!important;margin-left:0!important;}
html[data-studio-layout=normal] body#daailokStudio .top-actions .top-quiet{display:inline-flex!important;align-items:center!important;justify-content:center!important;height:36px!important;padding:0 11px!important;border-radius:var(--ds-radius-pill)!important;}
html[data-studio-layout=normal] body#daailokStudio .history{gap:0!important;}
html[data-studio-layout=normal] body#daailokStudio .history button{width:26px!important;height:28px!important;border-radius:50%!important;}
html[data-studio-layout=normal] body#daailokStudio .top-status{display:none!important;}
html[data-studio-layout=normal] body#daailokStudio .studio-theme-switch{margin:0!important;padding:2px!important;}
html[data-studio-layout=normal] body#daailokStudio .studio-theme-switch button{padding:4px 7px!important;}
html[data-studio-layout=normal] body#daailokStudio .account-badge{width:33px!important;height:33px!important;border-radius:50%!important;}
html[data-studio-layout=normal] body#daailokStudio .body-grid,html[data-studio-layout=normal] body#daailokStudio .body-grid.drawer-open{position:relative!important;display:block!important;min-height:0!important;grid-template-columns:none!important;overflow:visible!important;}
html[data-studio-layout=normal] body#daailokStudio .main-workspace{position:absolute!important;top:0!important;left:calc(var(--light-sidebar) + 3px)!important;right:0!important;bottom:0!important;display:block!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport{position:absolute!important;inset:0!important;width:auto!important;height:auto!important;min-height:0!important;margin:0!important;border-radius:20px!important;overflow:visible!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-scene{inset:0!important;border-radius:19px!important;overflow:hidden!important;}
html[data-studio-layout=normal] body#daailokStudio #previewCanvas{border-radius:19px!important;}

html[data-studio-layout=normal] body#daailokStudio :is(.layers-panel,.ai-panel,.properties-panel){position:relative!important;inset:auto!important;width:100%!important;min-width:0!important;margin:0!important;border-radius:0!important;padding:10px 14px!important;}
html[data-studio-layout=normal] body#daailokStudio .layers-panel{order:0!important;flex:0 0 29%!important;min-height:170px!important;max-height:290px!important;height:auto!important;overflow:auto!important;}
html[data-studio-layout=normal] body#daailokStudio .ai-panel{order:1!important;flex:0 0 auto!important;height:auto!important;min-height:150px!important;max-height:none!important;overflow:visible!important;}
html[data-studio-layout=normal] body#daailokStudio .properties-panel{order:2!important;flex:1 0 240px!important;min-height:240px!important;max-height:none!important;height:auto!important;overflow:visible!important;border-radius:17px!important;margin-top:2px!important;}
html[data-studio-layout=normal] body#daailokStudio .right-resizer,html[data-studio-layout=normal] body#daailokStudio .properties-panel .handle{display:none!important;}
html[data-studio-layout=normal] body#daailokStudio .left-drawer{position:absolute!important;left:0!important;top:0!important;bottom:0!important;width:var(--light-sidebar)!important;max-width:none!important;height:auto!important;border-radius:0 0 18px 18px!important;z-index:80!important;}
html[data-studio-layout=normal] body#daailokStudio .drawer-inner{width:100%!important;padding:15px 13px!important;}
html[data-studio-layout=normal] body#daailokStudio :is(.section-head,.prop-head,.ai-head){height:40px!important;min-height:40px!important;padding:0!important;}
html[data-studio-layout=normal] body#daailokStudio .prop-empty span{display:block!important;margin-top:10px!important;}
html[data-studio-layout=normal] body#daailokStudio .selection-symbol{border-radius:50%!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-hud-top{right:14px!important;top:14px!important;left:auto!important;display:flex!important;flex-direction:column!important;gap:7px!important;border-radius:var(--ds-radius-pill)!important;padding:6px!important;}
html[data-studio-layout=normal] body#daailokStudio .hud-trigger{width:36px!important;height:36px!important;min-width:0!important;padding:8px!important;border-radius:50%!important;}
html[data-studio-layout=normal] body#daailokStudio .hud-trigger :is(.hud-trigger-label,.hud-chevron){display:none!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-toolbox{left:14px!important;top:50%!important;transform:translateY(-50%)!important;bottom:auto!important;padding:5px!important;border-radius:var(--ds-radius-pill)!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-tool{width:31px!important;height:31px!important;border-radius:50%!important;}
html[data-studio-layout=normal] body#daailokStudio .north-compass{left:18px!important;top:18px!important;bottom:auto!important;width:48px!important;height:48px!important;border-radius:50%!important;}
html[data-studio-layout=normal] body#daailokStudio :is(.hud-menu,.account-menu,.floating-palette,.context-menu,.preview-simple-card,.creation-dialog){border-radius:17px!important;}
html[data-studio-layout=normal] body#daailokStudio .light-workspace-controls{display:flex!important;position:absolute!important;z-index:30!important;bottom:20px!important;left:24px!important;gap:12px!important;align-items:center!important;pointer-events:none!important;}
html[data-studio-layout=normal] body#daailokStudio .light-workspace-caption{display:flex!important;flex-direction:column!important;gap:5px!important;}
html[data-studio-layout=normal] body#daailokStudio #lightShotsToggle{pointer-events:auto!important;height:32px!important;padding:0 15px!important;border-radius:var(--ds-radius-pill)!important;}
html[data-studio-layout=normal] body#daailokStudio .timeline{display:none!important;position:absolute!important;left:10px!important;right:10px!important;bottom:10px!important;height:160px!important;min-height:0!important;margin:0!important;border-radius:17px!important;z-index:50!important;overflow:hidden!important;}
html[data-studio-layout=normal] body#daailokStudio .studio[data-light-shots=open] .timeline{display:block!important;}
html[data-studio-layout=normal] body#daailokStudio .studio[data-light-shots=open] .light-workspace-controls{bottom:183px!important;}
html[data-studio-layout=normal] body#daailokStudio .timeline-toolbar{height:39px!important;padding:0 12px!important;}
html[data-studio-layout=normal] body#daailokStudio .shot-strip{height:112px!important;padding:10px!important;gap:9px!important;}
html[data-studio-layout=normal] body#daailokStudio .shot-card{width:140px!important;min-width:140px!important;height:91px!important;border-radius:12px!important;}
html[data-studio-layout=normal] body#daailokStudio .shot-add{height:91px!important;border-radius:12px!important;}
html[data-studio-layout=normal] body#daailokStudio .shot-thumb{height:52px!important;}
html[data-studio-layout=normal] body#daailokStudio .track-area{display:none!important;}
@media (max-width:1450px){html[data-studio-layout=normal] body#daailokStudio{--light-sidebar:250px!important;}
html[data-studio-layout=normal] body#daailokStudio .top-function-nav .rail-item{padding:0 7px!important;gap:4px!important;}
html[data-studio-layout=normal] body#daailokStudio .top-function-nav .rail-item svg{display:none!important;}
html[data-studio-layout=normal] body#daailokStudio .top-actions .top-quiet{padding:0 9px!important;}
html[data-studio-layout=normal] body#daailokStudio .brand{padding:0 16px!important;}
}
@media (max-width:1200px){html[data-studio-layout=normal] body#daailokStudio{--light-sidebar:232px!important;--light-header:94px!important;}
html[data-studio-layout=normal] body#daailokStudio .topbar{display:grid!important;grid-template-columns:var(--light-sidebar) minmax(0,1fr) auto!important;grid-template-rows:46px 46px!important;gap:0 5px!important;}
html[data-studio-layout=normal] body#daailokStudio .brand{grid-column:1!important;grid-row:1/3!important;height:100%!important;}
html[data-studio-layout=normal] body#daailokStudio .top-function-nav.rail{grid-column:2/4!important;grid-row:1!important;justify-content:space-between!important;}
html[data-studio-layout=normal] body#daailokStudio .top-actions{grid-column:2/4!important;grid-row:2!important;justify-content:flex-end!important;}
html[data-studio-layout=normal] body#daailokStudio .history{position:absolute!important;left:calc(var(--light-sidebar) + 8px)!important;bottom:8px!important;}
html[data-studio-layout=normal] body#daailokStudio .top-function-nav .rail-item{padding:0 12px!important;height:35px!important;}
html[data-studio-layout=normal] body#daailokStudio .top-actions .top-quiet{height:31px!important;padding:0 13px!important;}
}
@media (max-width:800px){html[data-studio-layout=normal] body#daailokStudio{--light-sidebar:205px!important;padding:6px!important;}
html[data-studio-layout=normal] body#daailokStudio .studio{height:calc(100dvh - 12px)!important;border-radius:19px!important;padding:3px!important;}
html[data-studio-layout=normal] body#daailokStudio .brand{padding:0 10px!important;}
html[data-studio-layout=normal] body#daailokStudio .light-workspace-caption{display:none!important;}
html[data-studio-layout=normal] body#daailokStudio .top-function-nav .rail-item{padding:0 8px!important;}
html[data-studio-layout=normal] body#daailokStudio .top-actions .top-quiet{padding:0 8px!important;}
html[data-studio-layout=normal] body#daailokStudio .history{display:none!important;}
html[data-studio-layout=normal] body#daailokStudio :is(.layers-panel,.ai-panel,.properties-panel){padding:10px!important;}
html[data-studio-layout=normal] body#daailokStudio .light-workspace-controls{left:15px!important;}
}
@media (max-width:620px){html[data-studio-layout=normal] body#daailokStudio{--light-sidebar:168px!important;--light-header:120px!important;}
html[data-studio-layout=normal] body#daailokStudio .topbar{grid-template-columns:var(--light-sidebar) minmax(0,1fr)!important;grid-template-rows:58px 60px!important;}
html[data-studio-layout=normal] body#daailokStudio .top-function-nav.rail{grid-column:2!important;justify-content:flex-start!important;align-content:center!important;gap:2px!important;}
html[data-studio-layout=normal] body#daailokStudio .top-function-nav .rail-item{height:25px!important;padding:0 7px!important;min-width:0!important;}
html[data-studio-layout=normal] body#daailokStudio .top-actions{grid-column:2!important;align-content:center!important;gap:3px!important;}
html[data-studio-layout=normal] body#daailokStudio .top-actions .top-quiet{height:24px!important;padding:0 6px!important;}
html[data-studio-layout=normal] body#daailokStudio .brand{align-content:center!important;justify-content:center!important;}
html[data-studio-layout=normal] body#daailokStudio .brand .logo{display:none!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-hud-top{top:8px!important;right:8px!important;padding:3px!important;gap:3px!important;}
html[data-studio-layout=normal] body#daailokStudio .hud-trigger{width:29px!important;height:29px!important;padding:6px!important;}
html[data-studio-layout=normal] body#daailokStudio .north-compass{width:38px!important;height:38px!important;left:9px!important;top:9px!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-toolbox{left:8px!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-tool{width:26px!important;height:26px!important;}
html[data-studio-layout=normal] body#daailokStudio .timeline-actions button{padding:0 5px!important;}
html[data-studio-layout=normal] body#daailokStudio .timeline-title span{display:none!important;}
}
html[data-studio-layout=normal] body#daailokStudio .main-workspace{left:0!important;top:calc(-1 * var(--light-header))!important;right:0!important;bottom:0!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport{border-radius:20px!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-scene,html[data-studio-layout=normal] body#daailokStudio #previewCanvas{border-radius:20px!important;}

html[data-studio-layout=normal] body#daailokStudio :is(.layers-panel,.ai-panel,.properties-panel){flex-shrink:0!important;isolation:isolate!important;border-radius:16px!important;overflow:hidden!important;}
html[data-studio-layout=normal] body#daailokStudio .layers-panel{flex-basis:27%!important;overflow:auto!important;}
html[data-studio-layout=normal] body#daailokStudio .properties-panel{margin:0!important;flex-basis:230px!important;}
html[data-studio-layout=normal] body#daailokStudio .left-drawer{width:calc(var(--light-sidebar) - 7px)!important;border-radius:16px!important;isolation:isolate!important;}
html[data-studio-layout=normal] body#daailokStudio canvas.light-panel-optics{position:absolute!important;left:-6px!important;top:-6px!important;z-index:-1!important;max-width:none!important;max-height:none!important;margin:0!important;padding:0!important;pointer-events:none!important;display:block!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-hud-top{top:calc(var(--light-header) + 14px)!important;}
html[data-studio-layout=normal] body#daailokStudio .north-compass{left:calc(var(--light-sidebar) + 18px)!important;top:calc(var(--light-header) + 18px)!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-toolbox{left:calc(var(--light-sidebar) + 14px)!important;}
html[data-studio-layout=normal] body#daailokStudio .light-workspace-controls{left:calc(var(--light-sidebar) + 24px)!important;}
html[data-studio-layout=normal] body#daailokStudio .timeline{left:calc(var(--light-sidebar) + 10px)!important;}
@media (max-width:800px){html[data-studio-layout=normal] body#daailokStudio .light-workspace-controls{left:calc(var(--light-sidebar) + 15px)!important;}
}
@media (max-width:620px){html[data-studio-layout=normal] body#daailokStudio .north-compass{left:calc(var(--light-sidebar) + 9px)!important;top:calc(var(--light-header) + 9px)!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-toolbox{left:calc(var(--light-sidebar) + 8px)!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-hud-top{top:calc(var(--light-header) + 8px)!important;}
}
html[data-studio-layout=normal] body#daailokStudio .layers-panel{overflow:hidden!important;}
html[data-studio-layout=normal] body#daailokStudio .layers-panel #layerList{overflow:auto!important;max-height:calc(100% - 92px)!important;}
html[data-studio-layout=normal] body#daailokStudio .properties-panel{flex:1 0 auto!important;min-height:230px!important;height:auto!important;}

html[data-studio-layout=normal] body#daailokStudio :is(.layers-panel,.ai-panel,.properties-panel){display:flex!important;flex-direction:column!important;min-height:0!important;max-height:none!important;height:100%!important;min-width:0!important;overflow:hidden!important;padding:8px 12px!important;box-sizing:border-box!important;}
html[data-studio-layout=normal] body#daailokStudio .layers-panel{grid-row:1!important;order:0!important;}
html[data-studio-layout=normal] body#daailokStudio .ai-panel{grid-row:2!important;order:1!important;}
html[data-studio-layout=normal] body#daailokStudio .properties-panel{grid-row:3!important;order:2!important;margin:0!important;}
html[data-studio-layout=normal] body#daailokStudio :is(.section-head,.prop-head,.ai-head,.layer-toolbar,.selection-summary){flex-shrink:0!important;}
html[data-studio-layout=normal] body#daailokStudio .layers-panel #layerList{flex:1 1 0!important;min-height:0!important;max-height:none!important;height:auto!important;overflow:auto!important;}
html[data-studio-layout=normal] body#daailokStudio .properties-panel #propertyContent{flex:1 1 0!important;min-height:0!important;max-height:none!important;height:auto!important;overflow:auto!important;}
html[data-studio-layout=normal] body#daailokStudio .ai-panel .light-ai-scroll{display:block!important;flex:1 1 0!important;min-height:0!important;overflow:auto!important;}
html[data-studio-layout=normal] body#daailokStudio .left-drawer{inset:0 0 auto auto!important;width:var(--light-sidebar)!important;height:calc(31.25% - 5px)!important;min-height:0!important;max-height:none!important;overflow:hidden!important;box-sizing:border-box!important;transform:none!important;}
html[data-studio-layout=normal] body#daailokStudio .drawer-inner{height:100%!important;min-height:0!important;overflow:auto!important;box-sizing:border-box!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport::after{content:""!important;display:block!important;position:absolute!important;left:0!important;right:calc(var(--light-sidebar) + 8px)!important;top:var(--light-header)!important;bottom:0!important;border-radius:18px!important;pointer-events:none!important;z-index:5!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport::before{content:""!important;display:block!important;position:absolute!important;right:0!important;top:var(--light-header)!important;bottom:0!important;width:calc(var(--light-sidebar) + 8px)!important;pointer-events:auto!important;z-index:6!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-hud-top{right:calc(var(--light-sidebar) + 22px)!important;top:calc(var(--light-header) + 14px)!important;}
html[data-studio-layout=normal] body#daailokStudio .north-compass{left:18px!important;top:calc(var(--light-header) + 18px)!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport-toolbox{left:14px!important;}
html[data-studio-layout=normal] body#daailokStudio .axis-gizmo{right:calc(var(--light-sidebar) + 24px)!important;}
html[data-studio-layout=normal] body#daailokStudio .light-workspace-controls{left:24px!important;}
html[data-studio-layout=normal] body#daailokStudio .timeline{left:10px!important;right:calc(var(--light-sidebar) + 18px)!important;}

html[data-studio-layout=normal] body#daailokStudio .right-panel > :is(.layers-panel,.ai-panel,.properties-panel){grid-column:1 / -1!important;align-self:stretch!important;justify-self:stretch!important;max-width:100%!important;min-width:0!important;margin:0!important;}
html[data-studio-layout=normal] body#daailokStudio .layers-panel::before{content:none!important;display:none!important;}
html[data-studio-layout=normal] body#daailokStudio .light-viewport-frame{display:block!important;position:absolute!important;top:var(--light-header)!important;bottom:0!important;left:0!important;right:calc(var(--light-sidebar) + 8px)!important;border-radius:18px!important;pointer-events:none!important;z-index:5!important;isolation:isolate!important;overflow:visible!important;}
html[data-studio-layout=normal] body#daailokStudio .light-viewport-frame > canvas.light-panel-optics{z-index:0!important;}
html[data-studio-layout=normal] body#daailokStudio .viewport:has(.light-viewport-frame[data-light-glass-ready])::after{display:none!important;}
html[data-studio-layout=normal] body#daailokStudio :is(#studioOpticalControl,button)[data-glass-live][data-glass-ready]{isolation:isolate!important;overflow:visible!important;}
/* The accepted optical treatment also serves the dark normal layout. */
html[data-studio-theme=dark][data-studio-layout=normal] body#daailokStudio .viewport-scene{background:#17191c!important}
html[data-studio-theme=dark][data-studio-layout=normal] body#daailokStudio [data-light-glass-ready],html[data-studio-theme=light] body#daailokStudio .timeline[data-light-glass-ready]{background:transparent!important;border-color:transparent!important;box-shadow:none!important}
html body#daailokStudio .timeline[data-light-glass-ready]{isolation:isolate!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html body#daailokStudio #studioLayoutToggle{position:fixed!important;z-index:180!important;display:grid;place-items:center;width:34px;height:34px;padding:7px;border-radius:10px;border:1px solid #ffffff40;background:#17191ca0;color:#dfe1e3;box-shadow:inset 0 1px 0 #ffffff22;cursor:pointer}
html body#daailokStudio #studioLayoutToggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
html body#daailokStudio #studioLayoutToggle:hover{color:var(--ds-optical-accent);border-color:rgba(var(--ds-optical-accent-rgb),0.533333)}
