/* Use the same panel frame, heading and scroll structure for layers and tool pages. */
html body#daailokStudio #leftDrawer .drawer-inner{display:flex!important;flex-direction:column!important;padding:12px!important;gap:0!important;height:100%!important;box-sizing:border-box!important;overflow:hidden!important}
html body#daailokStudio #layersPanel{display:flex!important;flex-direction:column!important;padding:12px!important;gap:0!important;box-sizing:border-box!important;border-radius:16px!important;overflow:hidden!important}
html body#daailokStudio #leftDrawer{border-radius:16px!important}
html body#daailokStudio :is(#layersPanel .section-head,#leftDrawer .drawer-head){display:flex!important;align-items:center!important;justify-content:space-between!important;height:45px!important;min-height:45px!important;flex-shrink:0!important;padding:0!important;margin:0!important;gap:8px!important;border-bottom:1px solid var(--editor-divider,#ffffff18)!important}
html body#daailokStudio :is(#layersPanel .section-head,#leftDrawer .drawer-head) small{display:none!important}
html body#daailokStudio :is(#layerSectionTitle,#drawerTitle){margin:0!important;font-size:15px!important;font-weight:600!important;line-height:21px!important}
html body#daailokStudio #drawerContent{min-height:0!important;flex:1 1 auto!important;overflow:auto!important;padding:12px 0!important}
html body#daailokStudio #layersPanel .layer-toolbar{display:flex!important;flex-wrap:wrap!important;gap:8px!important;height:auto!important;min-height:0!important;flex:none!important;padding:12px 0!important;margin:0!important}
html body#daailokStudio #layerCount{flex-basis:100%;line-height:1.5}
html body#daailokStudio #layersPanel #layerList{flex:1 1 0!important;min-height:0!important;max-height:none!important;overflow:auto!important;padding:0 0 8px!important}
html body#daailokStudio #layersPanel .head-actions{display:flex;gap:6px!important;flex-shrink:0}
html body#daailokStudio #layersPanel .head-actions button{width:28px!important;height:28px!important;min-width:0!important;padding:3px!important}
html body#daailokStudio #creationModal [hidden]{display:none!important}
html body#daailokStudio #creationFilePreview{display:grid;grid-template-columns:72px minmax(0,1fr) auto!important;gap:12px!important;align-items:center!important}
html body#daailokStudio #creationFileThumb{display:grid;place-items:center;width:72px;height:62px;overflow:hidden;border:1px solid #ffffff24;border-radius:9px;background:#8881;box-sizing:border-box}
html body#daailokStudio #creationPreviewImage{width:100%!important;height:100%!important;object-fit:contain!important;border:0!important;border-radius:0!important;background:transparent!important}
html body#daailokStudio #creationPreviewFallback{font-size:11px;letter-spacing:.06em;opacity:.65}
html body#daailokStudio #creationFilePreview>div{min-width:0}
html body#daailokStudio #creationFileName{max-width:100%!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body#daailokStudio #creationBackToImage{display:block;margin:0 0 12px;padding:7px 11px;border-radius:var(--ds-radius-pill);font-size:12px}
html body#daailokStudio .project-manager-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:end;margin:14px 0 10px}.project-manager-toolbar label{display:grid;gap:6px;flex:1;min-width:100px;font-size:11px}.project-manager-toolbar select{width:100%;height:32px}.project-manager-toolbar button{padding:8px;border-radius:8px}
.project-manager-note{font-size:11px;line-height:1.6;opacity:.65;margin:10px 0 14px}.project-manager-list{display:grid;gap:12px}.project-manage-card{min-width:0;border:1px solid #ffffff20;border-radius:12px;padding:12px;background:#ffffff05}.project-manage-card>b{display:block;overflow-wrap:anywhere;font-size:13px;line-height:1.6}.project-manage-card>small{display:block;font-size:10px;line-height:1.6;opacity:.6;margin-top:6px}.project-manage-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.project-manage-actions button{padding:6px 9px;border-radius:7px;min-height:30px}.project-manage-actions button:disabled{opacity:.3;cursor:default}
@media(max-width:600px){html body#daailokStudio #creationFilePreview{grid-template-columns:72px minmax(0,1fr)!important}html body#daailokStudio #creationReplaceFile{grid-column:2;justify-self:start}}
html body#daailokStudio #layersPanel{border-width:1px!important;border-style:solid!important;border-color:var(--editor-edge,#ffffff18)!important}
html body#daailokStudio #layersPanel[data-light-glass-ready]{border-color:transparent!important}

/* Both tool pages and layers are direct children of body-grid. One footprint per layout. */
html body#daailokStudio .body-grid > :is(#layersPanel,#leftDrawer){position:absolute!important;grid-area:auto!important;margin:0!important;min-width:0!important;max-width:none!important;min-height:0!important;max-height:none!important;box-sizing:border-box!important}
html[data-studio-layout=compact] body#daailokStudio .body-grid > :is(#layersPanel,#leftDrawer){inset:8px auto 10px 10px!important;width:220px!important;height:auto!important}
@media(max-width:1280px){html[data-studio-layout=compact] body#daailokStudio .body-grid > :is(#layersPanel,#leftDrawer){inset:6px auto 8px 8px!important;width:200px!important}}

html[data-studio-layout=normal] body#daailokStudio .body-grid > :is(#layersPanel,#leftDrawer){inset:var(--studio-panel-gap) var(--studio-panel-gap) auto auto!important;width:var(--light-sidebar)!important;height:calc((100% - 4 * var(--studio-panel-gap)) / 3.2)!important}
html body#daailokStudio .body-grid > #layersPanel{z-index:26!important;transform:none!important}
/* Shared typography for the two project tabs, including controls and metadata. */
html body#daailokStudio #assetLibrary{--project-name-size:12px;--project-detail-size:10px;--project-control-size:11px}
html body#daailokStudio #assetLibrary :is(.project-card b,.project-manage-name){font-family:inherit!important;font-size:var(--project-name-size)!important;font-weight:500!important;line-height:1.5!important}
html body#daailokStudio #assetLibrary :is(.project-card small,.project-manage-card>small,.project-manager-note,.project-pane-head span){font-family:inherit!important;font-size:var(--project-detail-size)!important;font-weight:400!important;line-height:1.6!important}
html body#daailokStudio #assetLibrary :is(.project-manager-toolbar label,.project-manager-toolbar select,.project-manager-toolbar button,.project-manage-actions button,.project-card em,.project-pane-head b,.project-pane-head button){font-family:inherit!important;font-size:var(--project-control-size)!important;font-weight:500!important;line-height:1.5!important}
html body#daailokStudio .project-manage-name{cursor:text;min-width:0;outline-offset:3px}
html body#daailokStudio .project-name-input{display:block;box-sizing:border-box;width:100%;min-width:0;margin:0;padding:3px 5px;font:inherit!important;color:inherit;background:transparent;border:1px solid var(--ds-optical-accent);border-radius:5px;outline:none}

/* Unified navigation panel motion: scene layers and every tool drawer use one transition language. */
html body#daailokStudio .body-grid > :is(#layersPanel,#leftDrawer){
  transition:opacity .16s cubic-bezier(.2,.8,.2,1),transform .18s cubic-bezier(.2,.8,.2,1)!important;
}
html body#daailokStudio .body-grid:not(.drawer-open) > #layersPanel{
  opacity:1!important;transform:translateX(0)!important;pointer-events:auto!important;
}
html body#daailokStudio .body-grid.drawer-open > #layersPanel{
  opacity:0!important;transform:translateX(-8px)!important;pointer-events:none!important;
}
html body#daailokStudio .body-grid > #leftDrawer{
  opacity:0!important;transform:translateX(-8px)!important;pointer-events:none!important;
}
html body#daailokStudio .body-grid.drawer-open > #leftDrawer{
  opacity:1!important;transform:translateX(0)!important;pointer-events:auto!important;
}
@keyframes daailokNavPanelEnter{
  from{opacity:.28;transform:translateX(-7px)}
  to{opacity:1;transform:translateX(0)}
}
html body#daailokStudio #leftDrawer.nav-panel-enter .drawer-inner,
html body#daailokStudio #layersPanel.nav-panel-enter > :is(.section-head,.layer-toolbar,.layer-list){
  animation:daailokNavPanelEnter .18s cubic-bezier(.2,.8,.2,1) both;
}
@media(prefers-reduced-motion:reduce){
  html body#daailokStudio .body-grid > :is(#layersPanel,#leftDrawer){transition:none!important}
  html body#daailokStudio #leftDrawer.nav-panel-enter .drawer-inner,
  html body#daailokStudio #layersPanel.nav-panel-enter > :is(.section-head,.layer-toolbar,.layer-list){animation:none!important}
}

/* Interaction pass 5 · unified navigation, neutral idle states, HUD cleanup and workspace rhythm. */
html body#daailokStudio .brand{
  text-decoration:none!important;cursor:pointer!important;
}
html body#daailokStudio .brand .brand-lockup{
  transition:transform .24s cubic-bezier(.2,.8,.2,1),opacity .22s ease!important;
}
html body#daailokStudio .brand .brand-name{
  transition:color .22s ease,text-shadow .22s ease,letter-spacing .24s cubic-bezier(.2,.8,.2,1)!important;
}
html body#daailokStudio .brand:hover .brand-lockup{transform:translateY(-1px)!important}
html body#daailokStudio .brand:hover .brand-name{
  color:#ffe1a0!important;letter-spacing:.025em!important;text-shadow:0 0 14px rgba(var(--ds-optical-accent-rgb),.22)!important;
}
html body#daailokStudio .brand:active .brand-lockup{transform:translateY(0) scale(.985)!important}

/* Every left navigation page uses the same title/content entrance, not just the first pages. */
html body#daailokStudio #leftDrawer.nav-panel-enter #drawerTitle,
html body#daailokStudio #leftDrawer.nav-panel-enter #drawerContent,
html body#daailokStudio #layersPanel.nav-panel-enter :is(.section-head,.layer-toolbar,.layer-list){
  animation:daailokNavContentEnter .20s cubic-bezier(.2,.8,.2,1) both!important;
}
html body#daailokStudio #leftDrawer.nav-panel-enter #drawerContent{animation-delay:.018s!important}
@keyframes daailokNavContentEnter{
  from{opacity:.22;transform:translateX(-8px)}
  to{opacity:1;transform:translateX(0)}
}

/* Idle actions must stay neutral until hovered or actually selected. */
html body#daailokStudio .drawer-item:not(.active):not(:hover):not(:focus-visible){
  background:transparent!important;border-color:transparent!important;box-shadow:none!important;
}

/* AI send button follows the same transparent -> hover -> pressed gold language. */
html body#daailokStudio #aiSend{
  background:transparent!important;border:1px solid transparent!important;color:rgba(235,238,235,.72)!important;
  box-shadow:none!important;transform:translateZ(0);transition:transform .16s cubic-bezier(.2,.8,.2,1),background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease!important;
}
html body#daailokStudio #aiSend:hover:not(:disabled){
  background:rgba(var(--ds-optical-accent-rgb),.08)!important;border-color:rgba(var(--ds-optical-accent-rgb),.28)!important;color:#f2d28d!important;
  transform:translateY(-1px) scale(1.035)!important;
}
html body#daailokStudio #aiSend:active:not(:disabled),
html body#daailokStudio #aiSend.ai-send-pulse:not(:disabled){
  background:var(--ds-optical-accent)!important;border-color:var(--ds-optical-accent)!important;color:#17130d!important;
  box-shadow:0 0 14px rgba(var(--ds-optical-accent-rgb),.25)!important;transform:scale(.96)!important;
}

/* Portal HUD menus never leave a stale square/ghost surface after leaving the control. */
html body#daailokStudio .hud-menu.hud-portal-open{
  border-radius:14px!important;overflow:hidden!important;isolation:isolate!important;
}
html body#daailokStudio .hud-dropdown:not(.open) .hud-trigger{
  transform:none!important;
}

/* Camera-save cards are actions, not permanently selected items. */
html body#daailokStudio .camera-shot-add:not(:hover):not(:focus-visible){
  color:inherit!important;border-color:rgba(255,255,255,.10)!important;box-shadow:none!important;
}

/* A single spacing rhythm around the viewport and all four surrounding panel groups. */
html[data-studio-layout=compact] body#daailokStudio{--studio-panel-gap:10px}
html[data-studio-layout=compact] body#daailokStudio .body-grid{
  gap:var(--studio-panel-gap)!important;padding:var(--studio-panel-gap)!important;
}
html[data-studio-layout=compact] body#daailokStudio .body-grid > :is(#layersPanel,#leftDrawer){
  inset:var(--studio-panel-gap) auto var(--studio-panel-gap) var(--studio-panel-gap)!important;
}
html[data-studio-layout=compact] body#daailokStudio .main-workspace{
  gap:var(--studio-panel-gap)!important;
}
html[data-studio-layout=compact] body#daailokStudio .main-workspace > :is(.viewport,.timeline){
  margin:0!important;
}
html[data-studio-layout=compact] body#daailokStudio .viewport{
  border-radius:14px!important;
}
html[data-studio-layout=compact] body#daailokStudio .timeline{
  border-radius:12px!important;
}

html[data-studio-layout=normal] body#daailokStudio{--studio-panel-gap:10px}
html[data-studio-layout=normal] body#daailokStudio .light-viewport-frame{
  left:var(--studio-panel-gap)!important;
  right:calc(var(--light-sidebar) + 18px)!important;
  top:calc(var(--light-header) + var(--studio-panel-gap))!important;
  bottom:var(--studio-panel-gap)!important;
}

html[data-studio-layout=normal] body#daailokStudio .timeline{
  left:var(--studio-panel-gap)!important;
  right:calc(var(--light-sidebar) + 18px)!important;
  bottom:var(--studio-panel-gap)!important;
}
@media(max-width:1280px){
  html[data-studio-layout=compact] body#daailokStudio{--studio-panel-gap:8px}
}
@media(prefers-reduced-motion:reduce){
  html body#daailokStudio #leftDrawer.nav-panel-enter #drawerTitle,
  html body#daailokStudio #leftDrawer.nav-panel-enter #drawerContent,
  html body#daailokStudio #layersPanel.nav-panel-enter :is(.section-head,.layer-toolbar,.layer-list){animation:none!important}
  html body#daailokStudio .brand .brand-lockup,html body#daailokStudio .brand .brand-name,html body#daailokStudio #aiSend{transition:none!important}
}

/* Shot capture pass 6 · light-layout spacing, consistent drawer cards and image preview dialog. */
html body#daailokStudio #leftDrawer :is(
  .drawer-item[data-action="new-scene"],
  #drawerContent[data-tool="home"] .drawer-item[data-action="import"],
  #drawerContent[data-tool="home"] .drawer-item[data-action="open-cloud-assets"],
  .drawer-item[data-action="pose-from-image"]
){
  min-height:44px!important;
  border:1px solid rgba(255,255,255,.11)!important;
  border-radius:9px!important;
  background:rgba(255,255,255,.025)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.018)!important;
}
html body#daailokStudio #leftDrawer :is(
  .drawer-item[data-action="new-scene"],
  #drawerContent[data-tool="home"] .drawer-item[data-action="import"],
  #drawerContent[data-tool="home"] .drawer-item[data-action="open-cloud-assets"],
  .drawer-item[data-action="pose-from-image"]
):hover{
  border-color:rgba(var(--ds-optical-accent-rgb),.30)!important;
  background:rgba(var(--ds-optical-accent-rgb),.055)!important;
}
html[data-studio-theme=light] body#daailokStudio #leftDrawer :is(
  .drawer-item[data-action="new-scene"],
  #drawerContent[data-tool="home"] .drawer-item[data-action="import"],
  #drawerContent[data-tool="home"] .drawer-item[data-action="open-cloud-assets"],
  .drawer-item[data-action="pose-from-image"]
){
  border-color:rgba(255,255,255,.20)!important;
  background:rgba(255,255,255,.045)!important;
}

/* In the silver/light workspace, all editing surfaces use the same 10px corridor. */











/* Saved-shot preview is an image dialog; it never takes over the editing camera. */
.shot-preview-modal{
  position:fixed;inset:0;z-index:10020;display:grid;place-items:center;padding:28px;
}
.shot-preview-modal[hidden]{display:none!important}
.shot-preview-backdrop{position:absolute;inset:0;background:rgba(4,7,9,.72);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.shot-preview-dialog{
  position:relative;z-index:1;width:min(1080px,calc(100vw - 56px));max-height:calc(100vh - 56px);
  display:flex;flex-direction:column;overflow:hidden;border:1px solid rgba(255,255,255,.15);border-radius:18px;
  background:linear-gradient(145deg,rgba(25,32,37,.97),rgba(10,14,17,.97));
  box-shadow:0 36px 110px rgba(0,0,0,.55);
}
.shot-preview-dialog>header{
  min-height:58px;display:flex;align-items:center;justify-content:space-between;padding:9px 14px 9px 18px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.shot-preview-dialog>header small{display:block;font-size:8px;letter-spacing:.14em;opacity:.55}
.shot-preview-dialog>header b{display:block;margin-top:3px;font-size:13px;font-weight:560}
.shot-preview-dialog>header button{
  width:34px;height:34px;border:1px solid transparent;border-radius:50%;background:transparent;color:#c8ccca;font-size:20px;
}
.shot-preview-dialog>header button:hover{border-color:rgba(var(--ds-optical-accent-rgb),.28);color:var(--ds-optical-accent);background:rgba(var(--ds-optical-accent-rgb),.06)}
.shot-preview-stage{
  min-height:0;padding:14px;display:grid;place-items:center;overflow:auto;background:#06090b;
}
.shot-preview-stage img{
  display:block;max-width:100%;max-height:calc(100vh - 145px);width:auto;height:auto;object-fit:contain;border-radius:10px;
  box-shadow:0 16px 45px rgba(0,0,0,.34);
}
html[data-studio-theme=light] body#daailokStudio .shot-preview-dialog{
  background:linear-gradient(145deg,rgba(78,83,86,.97),rgba(43,48,51,.98));
  border-color:rgba(255,255,255,.30);
}
@media(max-width:800px){
  .shot-preview-modal{padding:14px}
  .shot-preview-dialog{width:calc(100vw - 28px);max-height:calc(100vh - 28px)}
  .shot-preview-stage img{max-height:calc(100vh - 118px)}
  
}

/* Camera workflow pass 7 · title-bar saves, optical parameters and camera styles. */
html body#daailokStudio .timeline-toolbar{gap:8px!important}
html body#daailokStudio .timeline-title{flex:0 0 auto!important}
html body#daailokStudio .camera-save-actions{
  min-width:0;flex:1 1 auto;display:flex;flex-direction:row-reverse;align-items:center;justify-content:flex-start;gap:5px;
  overflow-x:auto;scrollbar-width:none
}
html body#daailokStudio .camera-save-actions::-webkit-scrollbar{display:none}
html body#daailokStudio .camera-shot-save{
  flex:0 0 auto;height:26px;padding:0 9px;border:1px solid rgba(255,255,255,.10);border-radius:7px;
  background:transparent;color:#b9bdb9;font-size:9px;white-space:nowrap;
  transition:background .15s ease,border-color .15s ease,color .15s ease,transform .15s cubic-bezier(.2,.8,.2,1)
}
html body#daailokStudio .camera-shot-save:hover{
  color:var(--ds-optical-accent);border-color:rgba(var(--ds-optical-accent-rgb),.30);background:rgba(var(--ds-optical-accent-rgb),.06);transform:translateY(-1px)
}
html body#daailokStudio .camera-shot-save:active{
  color:#17130d;border-color:var(--ds-optical-accent);background:var(--ds-optical-accent);transform:scale(.97)
}
html[data-studio-theme=light] body#daailokStudio .camera-shot-save{
  color:#eeeeea;border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.035)
}
html[data-studio-theme=light] body#daailokStudio .camera-shot-save:hover{color:#ffe0a0}

html body#daailokStudio .camera-settings{display:grid;gap:9px}
html body#daailokStudio .camera-control-grid{display:grid;gap:7px}
html body#daailokStudio .camera-control-grid>label{
  min-height:32px;display:grid;grid-template-columns:62px minmax(0,1fr) 50px;align-items:center;gap:7px;
  color:#929793;font-size:10px
}
html body#daailokStudio .camera-control-grid>label:has(input[type=number]){grid-template-columns:62px minmax(0,1fr)}
html body#daailokStudio .camera-control-grid input[type=range]{width:100%;accent-color:var(--ds-optical-accent)}
html body#daailokStudio .camera-control-grid input[type=number]{
  width:100%;height:30px;padding:0 8px;border:1px solid rgba(255,255,255,.09);border-radius:7px;background:rgba(255,255,255,.035);color:#e7e9e6
}
html body#daailokStudio .camera-control-grid output{font-size:10px;color:#d9dcda;text-align:right}
html body#daailokStudio .camera-fov-row{grid-template-columns:62px 1fr!important}
html body#daailokStudio .camera-lens-presets,
html body#daailokStudio .camera-filter-grid{display:flex;flex-wrap:wrap;gap:5px}
html body#daailokStudio .camera-lens-presets button,
html body#daailokStudio .camera-filter-grid button{
  height:27px;padding:0 8px;border:1px solid rgba(255,255,255,.09);border-radius:7px;background:rgba(255,255,255,.025);color:#aeb2ae;font-size:9px
}
html body#daailokStudio .camera-lens-presets button:hover,
html body#daailokStudio .camera-filter-grid button:hover{border-color:rgba(var(--ds-optical-accent-rgb),.25);color:#e8cf9a}
html body#daailokStudio .camera-lens-presets button.active,
html body#daailokStudio .camera-filter-grid button.active{
  border-color:rgba(var(--ds-optical-accent-rgb),.38)!important;background:rgba(var(--ds-optical-accent-rgb),.10)!important;color:var(--ds-optical-accent)!important
}
html body#daailokStudio .camera-filter-title{margin-top:3px}
html body#daailokStudio .camera-filter-note{font-size:9px;line-height:1.55;color:#737975}
html[data-studio-theme=light] body#daailokStudio .camera-control-grid input[type=number],
html[data-studio-theme=light] body#daailokStudio .camera-lens-presets button,
html[data-studio-theme=light] body#daailokStudio .camera-filter-grid button{
  border-color:rgba(255,255,255,.20);background:rgba(255,255,255,.045);color:#f1f1ed
}
@media(max-width:1280px){html body#daailokStudio .camera-shot-save{padding:0 7px;font-size:8px}}

/* Layout + camera typography pass 8 */

/* Light normal: real 10px corridors between viewport, right stack and shot panel. */





/* Light compact: old geometry had zero-gap joins on the left and bottom. */












/* Camera property typography: structured hierarchy, consistent baselines and spacing. */
html body#daailokStudio .camera-settings{
  display:grid!important;
  gap:12px!important;
  padding:12px!important;
  border:1px solid rgba(255,255,255,.075)!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.018)!important;
}
html body#daailokStudio .camera-settings-head,
html body#daailokStudio .camera-filter-head{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:10px!important;
  min-height:30px!important;
}
html body#daailokStudio .camera-settings-head>div,
html body#daailokStudio .camera-filter-head>div{
  display:grid!important;
  gap:2px!important;
}
html body#daailokStudio .camera-settings-head b,
html body#daailokStudio .camera-filter-head b{
  font-size:12px!important;
  line-height:1.25!important;
  font-weight:650!important;
  letter-spacing:.02em!important;
  color:#eceeeb!important;
}
html body#daailokStudio .camera-settings-head small,
html body#daailokStudio .camera-filter-head small{
  font-size:7px!important;
  line-height:1!important;
  letter-spacing:.16em!important;
  color:#6f7672!important;
}
html body#daailokStudio .camera-settings-head>span,
html body#daailokStudio .camera-filter-head>span{
  font-size:9px!important;
  line-height:1.3!important;
  color:#929894!important;
}
html body#daailokStudio .camera-setting-row{
  display:grid!important;
  grid-template-columns:72px minmax(0,1fr)!important;
  gap:12px!important;
  align-items:center!important;
  min-height:42px!important;
}
html body#daailokStudio .camera-setting-label{
  display:grid!important;
  gap:3px!important;
}
html body#daailokStudio .camera-setting-label b{
  font-size:10px!important;
  line-height:1.25!important;
  font-weight:600!important;
  color:#d8dbd8!important;
}
html body#daailokStudio .camera-setting-label small{
  font-size:6.5px!important;
  line-height:1!important;
  letter-spacing:.11em!important;
  color:#666d69!important;
}
html body#daailokStudio .camera-setting-control{
  min-width:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 54px!important;
  align-items:center!important;
  gap:8px!important;
}
html body#daailokStudio .camera-setting-control input[type=range]{
  width:100%!important;
  margin:0!important;
  accent-color:var(--ds-optical-accent)!important;
}
html body#daailokStudio .camera-setting-control output{
  height:26px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:7px!important;
  background:rgba(255,255,255,.025)!important;
  font-size:9px!important;
  line-height:1!important;
  font-variant-numeric:tabular-nums!important;
  color:#e2e4e1!important;
}
html body#daailokStudio .camera-preset-label{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  margin-top:-2px!important;
}
html body#daailokStudio .camera-preset-label span{
  font-size:9px!important;
  font-weight:560!important;
  color:#a7aca8!important;
}
html body#daailokStudio .camera-preset-label small{
  font-size:8px!important;
  color:#626965!important;
}
html body#daailokStudio .camera-lens-presets{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:5px!important;
}
html body#daailokStudio .camera-lens-presets button{
  height:34px!important;
  padding:0!important;
  display:flex!important;
  align-items:baseline!important;
  justify-content:center!important;
  gap:2px!important;
}
html body#daailokStudio .camera-lens-presets button b{
  font-size:10px!important;
  line-height:1!important;
  font-weight:650!important;
}
html body#daailokStudio .camera-lens-presets button small{
  font-size:6.5px!important;
  line-height:1!important;
  opacity:.62!important;
}
html body#daailokStudio .camera-metric-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:6px!important;
}
html body#daailokStudio .camera-metric{
  min-width:0!important;
  min-height:48px!important;
  display:grid!important;
  align-content:center!important;
  gap:5px!important;
  padding:7px 8px!important;
  border:1px solid rgba(255,255,255,.065)!important;
  border-radius:9px!important;
  background:rgba(255,255,255,.018)!important;
}
html body#daailokStudio .camera-metric>span{
  font-size:8px!important;
  line-height:1!important;
  color:#777e79!important;
}
html body#daailokStudio .camera-metric>b{
  font-size:11px!important;
  line-height:1.2!important;
  font-weight:620!important;
  font-variant-numeric:tabular-nums!important;
  color:#dfe2df!important;
}
html body#daailokStudio .camera-metric input{
  width:100%!important;
  height:25px!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  font-size:10px!important;
  line-height:25px!important;
  font-variant-numeric:tabular-nums!important;
  color:#dfe2df!important;
}
html body#daailokStudio .camera-filter-head{
  padding-top:2px!important;
  border-top:1px solid rgba(255,255,255,.055)!important;
  padding-top:10px!important;
}
html body#daailokStudio .camera-filter-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
}
html body#daailokStudio .camera-filter-grid button{
  min-width:0!important;
  height:44px!important;
  padding:7px 9px!important;
  display:grid!important;
  align-content:center!important;
  justify-items:start!important;
  gap:3px!important;
  text-align:left!important;
}
html body#daailokStudio .camera-filter-grid button b{
  font-size:9px!important;
  line-height:1.15!important;
  font-weight:600!important;
}
html body#daailokStudio .camera-filter-grid button small{
  font-size:7px!important;
  line-height:1.15!important;
  font-weight:400!important;
  opacity:.55!important;
}
html[data-studio-theme=light] body#daailokStudio .camera-settings{
  border-color:rgba(255,255,255,.16)!important;
  background:rgba(18,18,18,.10)!important;
}
html[data-studio-theme=light] body#daailokStudio .camera-metric,
html[data-studio-theme=light] body#daailokStudio .camera-setting-control output{
  border-color:rgba(255,255,255,.16)!important;
  background:rgba(255,255,255,.035)!important;
}
@media(max-width:1280px){
  html body#daailokStudio .camera-settings{padding:10px!important}
  html body#daailokStudio .camera-setting-row{grid-template-columns:62px minmax(0,1fr)!important;gap:8px!important}
  html body#daailokStudio .camera-filter-grid{grid-template-columns:1fr!important}
}
@media(max-width:800px){
  html[data-studio-theme=light] body#daailokStudio{--studio-panel-gap:8px!important}
}

/* Camera aspect + stable HUD pass 9 */

/* Frame ratio is the first camera parameter and uses compact segmented controls. */
html body#daailokStudio .camera-aspect-setting{
  display:grid!important;
  grid-template-columns:72px minmax(0,1fr)!important;
  gap:12px!important;
  align-items:center!important;
  min-height:42px!important;
}
html body#daailokStudio .camera-aspect-presets{
  min-width:0!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:4px!important;
}
html body#daailokStudio .camera-aspect-presets button{
  min-width:0!important;
  height:30px!important;
  padding:0 3px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(255,255,255,.09)!important;
  border-radius:7px!important;
  background:rgba(255,255,255,.025)!important;
  color:#aeb2ae!important;
  font-size:8.5px!important;
  line-height:1!important;
  font-weight:560!important;
  font-variant-numeric:tabular-nums!important;
}
html body#daailokStudio .camera-aspect-presets button:hover{
  border-color:rgba(var(--ds-optical-accent-rgb),.25)!important;
  color:#e8cf9a!important;
}
html body#daailokStudio .camera-aspect-presets button.active{
  border-color:rgba(var(--ds-optical-accent-rgb),.38)!important;
  background:rgba(var(--ds-optical-accent-rgb),.10)!important;
  color:var(--ds-optical-accent)!important;
}

/* Lens preset labels are vertically centered; old baseline alignment pushed text upward. */
html body#daailokStudio .camera-lens-presets button{
  min-width:0!important;
  height:38px!important;
  padding:4px 0!important;
  display:grid!important;
  grid-template-rows:auto auto!important;
  place-content:center!important;
  place-items:center!important;
  gap:1px!important;
  line-height:1!important;
}
html body#daailokStudio .camera-lens-presets button b,
html body#daailokStudio .camera-lens-presets button small{
  display:block!important;
  margin:0!important;
  padding:0!important;
  line-height:1!important;
  text-align:center!important;
}
html body#daailokStudio .camera-lens-presets button b{
  font-size:10px!important;
  font-weight:650!important;
}
html body#daailokStudio .camera-lens-presets button small{
  font-size:6.5px!important;
  opacity:.62!important;
}

/* HUD menus stay inside their dropdown. No body portal, no reparent/reflow ghost. */
html body#daailokStudio .viewport-hud-top,
html body#daailokStudio .hud-dropdown{
  overflow:visible!important;
}
html body#daailokStudio .hud-dropdown.open::after{
  content:""!important;
  position:absolute!important;
  z-index:559!important;
  left:0!important;
  right:0!important;
  top:100%!important;
  height:8px!important;
  background:transparent!important;
  pointer-events:auto!important;
}
html body#daailokStudio .hud-dropdown .hud-menu{
  position:absolute!important;
  z-index:560!important;
  top:calc(100% + 7px)!important;
  left:auto!important;
  right:0!important;
  margin:0!important;
  contain:none!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
}
html body#daailokStudio #viewDropdown .hud-menu{
  width:176px!important;
  min-width:176px!important;
  max-width:176px!important;
}
html body#daailokStudio #displayDropdown .hud-menu{
  width:164px!important;
  min-width:164px!important;
  max-width:164px!important;
}
html body#daailokStudio #qualityDropdown .hud-menu{
  width:156px!important;
  min-width:156px!important;
  max-width:156px!important;
}
body>.hud-menu.hud-portal-open{
  display:none!important;
}

/* Silver/light camera controls keep the same selected language. */
html[data-studio-theme=light] body#daailokStudio .camera-aspect-presets button{
  border-color:rgba(255,255,255,.20)!important;
  background:rgba(255,255,255,.045)!important;
  color:#f1f1ed!important;
}
html[data-studio-theme=light] body#daailokStudio .camera-aspect-presets button.active{
  border-color:rgba(var(--ds-optical-accent-rgb),.42)!important;
  background:rgba(var(--ds-optical-accent-rgb),.11)!important;
  color:var(--ds-optical-accent)!important;
}
@media(max-width:1280px){
  html body#daailokStudio .camera-aspect-setting{
    grid-template-columns:62px minmax(0,1fr)!important;
    gap:8px!important;
  }
  html body#daailokStudio .camera-aspect-presets button{font-size:8px!important}
}

/* HUD + property fade + shot scrollbar pass 10 */

/* Explicit final open/closed state for in-place HUD menus. This overrides the legacy hover-only rules. */
html body#daailokStudio .hud-dropdown > .hud-menu{
  display:grid!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(-4px) scale(.985)!important;
  transition:opacity .12s ease,transform .12s ease,visibility 0s linear .12s!important;
}
html body#daailokStudio .hud-dropdown.open > .hud-menu,
html body#daailokStudio .hud-dropdown.open:hover > .hud-menu,
html body#daailokStudio .hud-dropdown.open:focus-within > .hud-menu{
  display:grid!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:none!important;
  transition:opacity .12s ease,transform .12s ease,visibility 0s!important;
}
html body#daailokStudio .hud-dropdown:not(.open) > .hud-menu{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
html body#daailokStudio #viewDropdown.open > #viewControls{
  display:grid!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}

/* Property title fades before scrolling content can visually collide with it. */
html body#daailokStudio #propertiesPanel .prop-head{
  --property-head-fade:0;
  opacity:calc(1 - var(--property-head-fade))!important;
  transform:translateY(calc(var(--property-head-fade) * -10px))!important;
  transition:opacity .10s linear,transform .10s linear!important;
  transform-origin:top center!important;
  will-change:opacity,transform;
}
html body#daailokStudio #propertiesPanel .prop-head.scroll-hidden{
  pointer-events:none!important;
}
@media(prefers-reduced-motion:reduce){
  html body#daailokStudio #propertiesPanel .prop-head{transition:none!important}
}

/* Reveal the horizontal scrollbar only when saved shots overflow. */
html body#daailokStudio #shotStrip{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-gutter:stable!important;
  scrollbar-width:thin!important;
  scrollbar-color:rgba(var(--ds-optical-accent-rgb),.48) rgba(255,255,255,.055)!important;
  padding-bottom:10px!important;
  overscroll-behavior-x:contain!important;
}
html body#daailokStudio #shotStrip::-webkit-scrollbar{
  height:8px!important;
}
html body#daailokStudio #shotStrip::-webkit-scrollbar-track{
  background:rgba(255,255,255,.045)!important;
  border-radius:var(--ds-radius-pill)!important;
  margin:0 8px!important;
}
html body#daailokStudio #shotStrip::-webkit-scrollbar-thumb{
  min-width:34px!important;
  background:rgba(var(--ds-optical-accent-rgb),.42)!important;
  border:2px solid transparent!important;
  background-clip:padding-box!important;
  border-radius:var(--ds-radius-pill)!important;
}
html body#daailokStudio #shotStrip::-webkit-scrollbar-thumb:hover{
  background:rgba(var(--ds-optical-accent-rgb),.68)!important;
  background-clip:padding-box!important;
}
html[data-studio-theme=light] body#daailokStudio #shotStrip{
  scrollbar-color:rgba(255,225,160,.62) rgba(255,255,255,.10)!important;
}
html[data-studio-theme=light] body#daailokStudio #shotStrip::-webkit-scrollbar-track{
  background:rgba(255,255,255,.10)!important;
}
html[data-studio-theme=light] body#daailokStudio #shotStrip::-webkit-scrollbar-thumb{
  background:rgba(255,225,160,.56)!important;
  background-clip:padding-box!important;
}

/* Recovery pass 13 · stable HUD portal without pointer-move reparenting. */
body>.hud-menu.hud-portal-open{
  display:grid!important;
  position:fixed!important;
  z-index:2147482000!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:none!important;
  margin:0!important;
  border-radius:12px!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
}
html body#daailokStudio .hud-dropdown.open > .hud-menu:not(.hud-portal-open){
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Shot workflow + account login state pass 14 */
html body#daailokStudio #accountMenu button[data-account-action="login"]{
  color:#c9ceca!important;
  background:transparent!important;
  border-color:transparent!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
html body#daailokStudio #accountMenu button[data-account-action="login"]:hover{
  color:#f1f2ef!important;
  background:rgba(255,255,255,.055)!important;
  border-color:rgba(255,255,255,.08)!important;
  box-shadow:none!important;
}
html body#daailokStudio #accountMenu button[data-account-action="login"]:active,
html body#daailokStudio #accountMenu button[data-account-action="login"]:focus-visible{
  color:#17130d!important;
  background:var(--ds-optical-accent)!important;
  border-color:var(--ds-optical-accent)!important;
  box-shadow:0 0 14px rgba(var(--ds-optical-accent-rgb),.18)!important;
}
html[data-studio-theme=light] body#daailokStudio #accountMenu button[data-account-action="login"]{
  color:#eceeea!important;
  background:transparent!important;
  border-color:transparent!important;
}
html[data-studio-theme=light] body#daailokStudio #accountMenu button[data-account-action="login"]:hover{
  color:#fff!important;
  background:rgba(255,255,255,.08)!important;
  border-color:rgba(255,255,255,.15)!important;
}
html[data-studio-theme=light] body#daailokStudio #accountMenu button[data-account-action="login"]:active,
html[data-studio-theme=light] body#daailokStudio #accountMenu button[data-account-action="login"]:focus-visible{
  color:#17130d!important;
  background:var(--ds-optical-accent)!important;
  border-color:var(--ds-optical-accent)!important;
}
html body#daailokStudio .shot-card.active{
  border-color:rgba(var(--ds-optical-accent-rgb),.42)!important;
  box-shadow:inset 0 0 0 1px rgba(var(--ds-optical-accent-rgb),.08)!important;
}


/* Normal workspace: detached navigation panel occupies the first row of the same right-hand grid. */
html[data-studio-layout=normal] body#daailokStudio .right-panel{position:absolute!important;height:auto!important;margin:0!important;grid-template-columns:minmax(0,1fr)!important;align-items:stretch!important;pointer-events:auto!important;z-index:25!important;border-radius:16px!important;inset:var(--studio-panel-gap) var(--studio-panel-gap) var(--studio-panel-gap) auto!important;width:var(--light-sidebar)!important;padding:0!important;border:0!important;display:grid!important;grid-template-rows:minmax(0,1fr) minmax(0,.85fr) minmax(0,1.35fr)!important;gap:var(--studio-panel-gap)!important;overflow:visible!important}
html[data-studio-layout=normal] body#daailokStudio .right-panel>:is(.ai-panel,.properties-panel){min-height:0!important;height:100%!important;margin:0!important;width:100%!important;box-sizing:border-box!important}
html[data-studio-layout=normal] body#daailokStudio .right-panel>.ai-panel{grid-row:2!important}
html[data-studio-layout=normal] body#daailokStudio .right-panel>.properties-panel{grid-row:3!important}

/* Shared geometry: labels stay on one line in both themes. */
html body#daailokStudio #propertiesPanel .quick-actions button{padding-inline:6px!important;white-space:normal;overflow-wrap:anywhere;min-width:0}

/* Keep caption rows within the fixed card; the preview fills only the remaining height. */
html body#daailokStudio .shot-card{display:grid!important;grid-template-rows:minmax(0,1fr) auto;align-content:stretch}
html body#daailokStudio .shot-card .shot-thumb{min-height:0;height:100%!important}
html body#daailokStudio .shot-info{min-width:0}
html body#daailokStudio .shot-info :is(b,small){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}


/* Test preview · restore the ORIGINAL vertical manager cards (reference image 1).
   No three-column open grid, no new sort toolbar, no change to panel width. */
html body#daailokStudio #assetLibrary .project-list{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  align-content:start!important;
  gap:12px!important;
  min-width:0!important;
}
html body#daailokStudio #assetLibrary .project-library-entry{
  position:relative!important;
  isolation:isolate!important;
  box-sizing:border-box!important;
  display:block!important;
  min-width:0!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  padding:10px 12px!important;
  overflow:hidden!important;
  text-align:left!important;
  cursor:pointer;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:12px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.048),rgba(255,255,255,.015))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.075)!important;
  transition:background .20s ease,border-color .20s ease,box-shadow .20s ease!important;
}
html body#daailokStudio #assetLibrary .project-library-entry:before{
  content:"";position:absolute;z-index:0;inset:0;
  pointer-events:none;opacity:0;
  border-radius:inherit;
  background:
    radial-gradient(ellipse at 15% 0%,rgba(255,255,255,.13),transparent 53%),
    linear-gradient(112deg,transparent 7%,rgba(255,255,255,.065) 40%,transparent 78%);
  transform:translateX(-15%);
  transition:transform .32s cubic-bezier(.2,.8,.2,1),opacity .22s ease;
}
html body#daailokStudio #assetLibrary .project-library-entry:hover:before,
html body#daailokStudio #assetLibrary .project-library-entry:focus-within:before{
  transform:translateX(0);opacity:1;
}
html body#daailokStudio #assetLibrary .project-library-entry:hover,
html body#daailokStudio #assetLibrary .project-library-entry:focus-within{
  border-color:rgba(var(--ds-optical-accent-rgb,240,202,120),.32)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.024))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 0 14px rgba(var(--ds-optical-accent-rgb,240,202,120),.08)!important;
}
html body#daailokStudio #assetLibrary .project-library-entry.active{
  border-color:rgba(var(--ds-optical-accent-rgb,240,202,120),.56)!important;
  background:linear-gradient(145deg,rgba(var(--ds-optical-accent-rgb,240,202,120),.10),rgba(255,255,255,.018))!important;
  box-shadow:inset 2px 0 0 var(--ds-optical-accent,#eac979),inset 0 1px 0 rgba(255,255,255,.10)!important;
}
/* Independent boxed order number, then full-width title and edit time. */
html body#daailokStudio #assetLibrary .project-library-entry > :is(.project-order-row,.project-manage-name,small,.project-manage-actions,.project-version-list){
  position:relative;z-index:1;
}
html body#daailokStudio #assetLibrary .project-library-entry > .project-order-row{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:100%!important;
  min-width:0!important;
  margin:0 0 7px!important;
}
html body#daailokStudio #assetLibrary .project-library-entry .project-order-number{
  display:inline-flex!important;
  justify-content:center!important;
  align-items:center!important;
  box-sizing:border-box!important;
  min-width:30px!important;
  height:22px!important;
  padding:0 7px!important;
  border:1px solid rgba(255,255,255,.20)!important;
  border-radius:4px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018))!important;
  font:inherit!important;
  font-size:var(--project-name-size,12px)!important;
  font-weight:500!important;
  line-height:1.2!important;
  font-variant-numeric:tabular-nums!important;
  color:var(--ds-studio-text-muted,#adb5b1)!important;
  white-space:nowrap!important;
  user-select:none!important;
  pointer-events:none!important;
}
html body#daailokStudio #assetLibrary .project-library-entry > .project-manage-name{
  display:block!important;
  width:100%!important;min-width:0!important;
  margin:0!important;
  font-family:inherit!important;
  font-size:var(--project-name-size,12px)!important;
  font-weight:500!important;line-height:1.55!important;
  color:var(--ds-studio-text-base,#eff2ee)!important;
  white-space:normal!important;word-break:break-word!important;
  overflow-wrap:anywhere!important;overflow:visible!important;
  text-overflow:clip!important;
  cursor:pointer;
}
html body#daailokStudio #assetLibrary .project-library-entry > small{
  display:block!important;
  width:100%!important;
  margin-top:4px!important;
  color:var(--ds-studio-text-muted,#adb5b1)!important;
  font-family:inherit!important;font-size:var(--project-detail-size,10px)!important;
  font-weight:400!important;line-height:1.6!important;
  white-space:normal!important;overflow-wrap:anywhere!important;
  overflow:visible!important;text-overflow:clip!important;
}
html body#daailokStudio #assetLibrary .project-library-entry > small[hidden]{display:none!important}
html body#daailokStudio #assetLibrary .project-library-entry [data-project-status]{
  display:inline!important;
  font:inherit!important;
  white-space:normal!important;
  color:var(--ds-studio-text-muted,#adb5b1)!important;
}
html body#daailokStudio #assetLibrary .project-library-entry [data-project-status][hidden]{display:none!important}
html body#daailokStudio #assetLibrary .project-library-entry[data-generation-status="failed"] [data-project-status]{
  color:var(--ds-studio-warning,#e7a7a7)!important;
}
/* Two equal-width columns across the FULL inner card width:
   up center = delete center; down center = open center.
   Left controls flush with title/date left edge, right flush with card right edge. */
html body#daailokStudio #assetLibrary .project-library-entry .project-manage-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  justify-content:stretch!important;
  align-items:start!important;
  gap:4px 10px!important;
  width:100%!important;
  margin-top:8px!important;
}
html body#daailokStudio #assetLibrary .project-library-entry .project-manage-actions button{
  box-sizing:border-box!important;
  width:44px!important;
  min-width:0!important;
  min-height:27px!important;
  padding:3px 4px!important;
  border:1px solid transparent!important;
  border-radius:7px!important;
  text-align:center!important;
  background:transparent!important;
  color:inherit!important;
  font-family:inherit!important;
  font-size:var(--project-control-size,11px)!important;
  font-weight:500!important;
  box-shadow:none!important;
  white-space:nowrap!important;
  cursor:pointer;
}
html body#daailokStudio #assetLibrary .project-library-entry .project-manage-actions button[data-manage="up"],
html body#daailokStudio #assetLibrary .project-library-entry .project-manage-actions button[data-manage="delete"]{
  justify-self:start!important;
}
html body#daailokStudio #assetLibrary .project-library-entry .project-manage-actions button[data-manage="down"],
html body#daailokStudio #assetLibrary .project-library-entry .project-manage-actions button[data-project-open]{
  justify-self:end!important;
}
html body#daailokStudio #assetLibrary .project-library-entry .project-manage-actions button:hover:not(:disabled),
html body#daailokStudio #assetLibrary .project-library-entry .project-manage-actions button:focus-visible{
  color:var(--ds-optical-accent,#f1cf81)!important;
  border-color:rgba(var(--ds-optical-accent-rgb,240,202,120),.25)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.095),rgba(var(--ds-optical-accent-rgb,240,202,120),.05))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12)!important;
}
html body#daailokStudio #assetLibrary .project-library-entry .project-manage-actions button:disabled{
  opacity:.3!important;cursor:default!important;
}
html body#daailokStudio .asset-project-actions{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
html body#daailokStudio .asset-project-actions button{
  min-width:0!important;
  border-radius:9px!important;
  border-color:rgba(255,255,255,.12)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.016))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10)!important;
}
html body#daailokStudio .asset-project-actions button:hover{
  color:var(--ds-optical-accent,#f1cf81)!important;
  border-color:rgba(var(--ds-optical-accent-rgb,240,202,120),.32)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.13),0 0 12px rgba(var(--ds-optical-accent-rgb,240,202,120),.09)!important;
}
html body#daailokStudio #assetLibrary .project-recovery-tools{padding-bottom:6px}
html[data-studio-theme=light] body#daailokStudio #assetLibrary .project-library-entry{
  background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.042))!important;
  border-color:rgba(255,255,255,.30)!important;
}
@media(prefers-reduced-motion:reduce){
  html body#daailokStudio #assetLibrary .project-library-entry:before{
    transition:none!important;
  }
}

/* Test preview: source-backed progress track in every generating project. */
html body#daailokStudio #assetLibrary .project-library-entry > .project-generation-progress{
  position:relative;z-index:1;display:block;box-sizing:border-box;
  width:100%;height:3px;margin-top:6px;overflow:hidden;
  border-radius:3px;background:rgba(255,255,255,.13);
}
html body#daailokStudio #assetLibrary .project-library-entry > .project-generation-progress[hidden]{
  display:none!important;
}
html body#daailokStudio #assetLibrary .project-library-entry [data-project-progress-fill]{
  display:block;height:100%;width:0;
  border-radius:inherit;background:var(--ds-optical-accent,#eac979);
  transition:width .28s ease;
}
html body#daailokStudio #assetLibrary .project-library-entry[data-generation-status="failed"] [data-project-progress-fill]{
  background:var(--ds-studio-warning,#e7a7a7);
}
html body#daailokStudio #assetLibrary .project-library-entry[data-generation-status="success"] [data-project-status]{
  color:var(--ds-optical-accent,#eac979)!important;
}
@media(prefers-reduced-motion:reduce){
  html body#daailokStudio #assetLibrary .project-library-entry [data-project-progress-fill]{transition:none}
}