/* ainzy.net 控制台磨砂玻璃层
   注入方式：Apache mod_substitute 在 </head> 前插 <link>（见 post_virtualhost_global.conf 的 apex :443 vhost）
   ⚠️ 同一个 vhost 下 /media/home.html 也是 text/html，会被一起注入，
      所以整份规则统一挂在 html.font-inter 下（new-api 的 React 根节点固定带这个 class，
      light/dark 都有；home.html 没有），保证只对控制台生效。
   原则：只加 background / backdrop-filter / box-shadow，不碰任何布局属性；
        选择器包在 :where() 里把特异性压到 0，Tailwind 显式写的 bg-* 永远赢，改不坏现有配色。 */

/* 1) 给页面底色加一层极淡的环境光，玻璃背后才有东西可以糊 */
html.font-inter body{
  background-image:
    radial-gradient(900px 620px at 14% -12%, color-mix(in srgb, var(--foreground) 7%, transparent), transparent 70%),
    radial-gradient(760px 520px at 96% 6%,  color-mix(in srgb, var(--foreground) 5%, transparent), transparent 72%);
  background-attachment: fixed;
  background-repeat: no-repeat;
}

@supports ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))){

  /* 2) 大圆角 + 有边框的容器 = 卡片/面板。
        刻意不含 rounded-lg / rounded-md，那两个尺寸在这套 UI 里主要是按钮和输入框，糊掉会显脏。 */
  html.font-inter :where([class~='rounded-xl'],[class~='rounded-2xl'],[class~='rounded-3xl'])[class~='border']{
    background-image: linear-gradient(157deg, color-mix(in srgb, var(--foreground) 5%, transparent) 0%, transparent 58%);
    background-color: color-mix(in srgb, var(--card) 55%, transparent);
    -webkit-backdrop-filter: blur(16px) saturate(150%);
    backdrop-filter: blur(16px) saturate(150%);
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--foreground) 8%, transparent);
  }

  /* 3) 语义化表面：卡片、气泡、下拉、弹窗、侧边栏 */
  html.font-inter :where(.bg-card,.bg-popover,[data-slot='card'],[data-slot='popover-content'],[data-slot='dropdown-menu-content']){
    background-color: color-mix(in srgb, var(--card) 62%, transparent);
    -webkit-backdrop-filter: blur(18px) saturate(150%);
    backdrop-filter: blur(18px) saturate(150%);
  }
  html.font-inter :where([role='dialog'],[data-radix-popper-content-wrapper] > *){
    -webkit-backdrop-filter: blur(20px) saturate(150%);
    backdrop-filter: blur(20px) saturate(150%);
  }
  html.font-inter :where([data-slot='sidebar-container'],[data-sidebar='sidebar'],aside){
    background-color: color-mix(in srgb, var(--sidebar, var(--card)) 68%, transparent);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    backdrop-filter: blur(18px) saturate(140%);
  }

  /* 4) sticky 顶栏（模型广场那个 header 是 pointer-events:none 的透明壳，
        真正画出来的条带走规则 2，这里补的是控制台里真正吸顶的那种） */
  html.font-inter :where(header[class*='sticky'],nav[class*='sticky']){
    background-color: color-mix(in srgb, var(--background) 62%, transparent);
    -webkit-backdrop-filter: blur(16px) saturate(150%);
    backdrop-filter: blur(16px) saturate(150%);
  }
}