/* ============================================================
   VEO9 STUDIO · SPA 外壳级 CSS
   只放：#view-root 容器 / 视图根复位 / 视图过渡 / 全局 toast 宿主 / 统一 --ease。
   绝不含任何视图私有类（.toolbar/.card/.toast 等一律进各视图 scoped <style>）。
   ============================================================ */
:root{ --ease:cubic-bezier(.22,1,.36,1); }

/* 唯一可变区 */
#view-root{ position:relative; min-height:0; }

/* router 建的视图根 div（.view-名）：占满、作为各视图背景/布局的宿主，
   原来挂在 body 上的「全屏背景图 / display:flex」一律降级 scope 到这里。 */
#view-root > [class^="view-"],
#view-root > [class*=" view-"]{
  min-height:100vh;
  animation:viewIn .42s var(--ease);
  /* 不用 `both` 填充:`both` 会让视图根静止在 opacity≠1 → 生成层叠上下文,把视图内的弹层(灯箱 z120 等)
     压到 sticky 顶栏(z40)之下 → 灯箱关闭按钮被顶栏盖住点不到。不填充则静止回 opacity:1(无上下文),弹层正常浮于顶栏之上。 */
}
@keyframes viewIn{ from{ opacity:0 } to{ opacity:1 } }
@media (prefers-reduced-motion: reduce){
  #view-root > [class^="view-"]{ animation:none }
}

/* 顶栏按视图显隐：受保护视图显示、login 隐藏 */
veo9-topbar[hidden]{ display:none !important; }

/* 全局 toast 宿主（视图共用；点击穿透，单条 toast 自带样式） */
.toast-wrap#app-toast{
  position:fixed; bottom:28px; left:50%; transform:translateX(-50%); z-index:200;
  display:flex; flex-direction:column; gap:10px; align-items:center; pointer-events:none;
}

/* View Transitions：默认交叉淡入淡出（不支持的浏览器直接换 DOM，无过渡、不退化）。 */
::view-transition-old(root),
::view-transition-new(root){ animation-duration:.34s; }

/* ============================================================
   白天主题 · Atelier Daylight 外壳覆盖
   仅覆盖外壳自有色面：body/app 底 / #view-root 过渡宿主 / .veo9-grain 纸张颗粒。
   暗色默认全部保留不动；取值锁定调色板，与 login.js·veo9-pages.css 同源（奶油 #f1ebde·墨 #2b2620·铜金 #9c7c43）。
   ============================================================ */
/* 外壳底=暖纸渐变，墨字（视图背景未绘前不露暗底）*/
:root[data-theme="light"] body{ background:linear-gradient(180deg,#f5f0e6,#ece4d4) fixed,#f1ebde; color:#2b2620; }
/* 视图宿主=纯奶油纸：viewIn 淡入 / ::view-transition 交叉淡出期间不闪暗底 */
:root[data-theme="light"] #view-root{ background:#f1ebde; }
:root[data-theme="light"] #view-root > [class^="view-"],
:root[data-theme="light"] #view-root > [class*=" view-"]{ color:#2b2620; }
/* 纸张颗粒：白天可见，正片叠底叠在奶油纸上（与 veo9-pages.css 一致）*/
:root[data-theme="light"] .veo9-grain{ opacity:.5; mix-blend-mode:multiply; }
