/* 钛云 V2 · Radium 毛玻璃全局 Token 草案
 * 方向：漂浮半透明卡片 + backdrop-blur、空间层次、局部高饱和渐变、柔和过渡、苹果精致感
 * 登录页猫 auth-cat-v6 已锁定，本文件不覆盖其资源与构图。
 */

:root {
  /* ========== 配色 ========== */
  /* 中性底 */
  --ty-bg: #f2f2f7;
  --ty-bg-deep: #e8e8ef;
  --ty-surface: rgba(255, 255, 255, 0.62);
  --ty-surface-strong: rgba(255, 255, 255, 0.84);
  --ty-surface-soft: rgba(255, 255, 255, 0.42);

  /* 文字 */
  --ty-ink: #111114;
  --ty-ink-2: rgba(29, 29, 31, 0.78);
  --ty-ink-3: rgba(29, 29, 31, 0.55);
  --ty-ink-4: rgba(29, 29, 31, 0.36);
  --ty-on-strong: #ffffff;

  /* 品牌 / 局部高饱和点缀（克制使用） */
  --ty-accent: #6155f5;
  --ty-accent-2: #2a8cff;
  --ty-accent-3: #ff2d55;
  --ty-accent-soft: rgba(97, 85, 245, 0.14);
  --ty-glow-a: rgba(90, 120, 255, 0.22);
  --ty-glow-b: rgba(40, 160, 255, 0.16);
  --ty-glow-c: rgba(180, 140, 220, 0.14);

  /* 场景底色（auth 可随场景微调，结构保持统一） */
  --ty-scene-login: #aad5bb;
  --ty-scene-register: #bea5d0;
  --ty-scene-neutral: #f2f2f7;

  /* 语义色 */
  --ty-ok: #34c759;
  --ty-ok-text: #006b28;
  --ty-ok-soft: rgba(52, 199, 89, 0.16);
  --ty-warn: #ff8d28;
  --ty-warn-text: #a34400;
  --ty-warn-soft: rgba(255, 141, 40, 0.16);
  --ty-bad: #ff383c;
  --ty-bad-text: #c40f24;
  --ty-bad-soft: rgba(255, 56, 60, 0.13);

  /* 分隔 / 填充 */
  --ty-sep: rgba(60, 60, 67, 0.16);
  --ty-sep-strong: rgba(60, 60, 67, 0.29);
  --ty-fill-1: rgba(120, 120, 128, 0.16);
  --ty-fill-2: rgba(120, 120, 128, 0.12);
  --ty-fill-3: rgba(118, 118, 128, 0.08);
  --ty-scrim: rgba(0, 0, 0, 0.35);

  /* 主按钮 */
  --ty-btn: #111114;
  --ty-btn-pressed: #2c2c31;

  /* ========== 字体 ========== */
  --ty-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC",
    "Hiragino Sans GB", system-ui, "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --ty-font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC",
    system-ui, "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --ty-font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --ty-font-num: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue",
    "PingFang SC", system-ui, sans-serif;

  /* 字号阶梯（仅用这套，禁止 12.5 / 13 等零散值） */
  --ty-fs-caption2: 0.6875rem; /* 11 */
  --ty-fs-caption1: 0.75rem;   /* 12 */
  --ty-fs-footnote: 0.8125rem; /* 13 → 统一到 footnote */
  --ty-fs-subhead: 0.9375rem;  /* 15 */
  --ty-fs-body: 1.0625rem;     /* 17 */
  --ty-fs-callout: 1rem;       /* 16 */
  --ty-fs-headline: 1.0625rem; /* 17 semibold */
  --ty-fs-title3: 1.25rem;     /* 20 */
  --ty-fs-title2: 1.375rem;    /* 22 */
  --ty-fs-title1: 1.75rem;     /* 28 */
  --ty-fs-large: 2.125rem;     /* 34 */

  --ty-lh-tight: 1.2;
  --ty-lh-body: 1.35;
  --ty-lh-loose: 1.5;
  --ty-fw-regular: 400;
  --ty-fw-medium: 500;
  --ty-fw-semibold: 600;
  --ty-fw-bold: 700;

  /* ========== 间距阶梯（4 的倍数） ========== */
  --ty-sp-1: 4px;
  --ty-sp-2: 8px;
  --ty-sp-3: 12px;
  --ty-sp-4: 16px;
  --ty-sp-5: 20px;
  --ty-sp-6: 24px;
  --ty-sp-7: 32px;
  --ty-sp-8: 44px;
  --ty-sp-9: 56px;
  --ty-sp-10: 72px;

  --ty-page-x: 24px;
  --ty-content-max: 980px;
  --ty-auth-card-w: 420px;
  --ty-hit: 44px;

  /* ========== 圆角 ========== */
  --ty-r-xs: 6px;
  --ty-r-sm: 10px;
  --ty-r-md: 14px;
  --ty-r-lg: 22px;
  --ty-r-xl: 28px;
  --ty-r-2xl: 32px;
  --ty-r-pill: 999px;

  /* ========== 毛玻璃 / 阴影三级层级 ========== */
  /* L0 地面：页面底，无浮起 */
  --ty-blur-0: none;
  --ty-shadow-0: none;

  /* L1 贴地玻璃：导航条、次级浮层 */
  --ty-glass-1: rgba(255, 255, 255, 0.55);
  --ty-blur-1: blur(18px) saturate(180%);
  --ty-rim-1: inset 0 0.5px 0 rgba(255, 255, 255, 0.85),
    inset 0 0 0 0.5px rgba(255, 255, 255, 0.45);
  --ty-shadow-1: 0 0.5px 1px rgba(0, 0, 0, 0.04),
    0 4px 12px -4px rgba(16, 18, 40, 0.08),
    0 16px 36px -16px rgba(16, 18, 40, 0.14);

  /* L2 主卡片：登录卡、内容卡 */
  --ty-glass-2: rgba(255, 255, 255, 0.62);
  --ty-blur-2: blur(30px) saturate(190%);
  --ty-rim-2: inset 0 0 0 0.5px rgba(255, 255, 255, 0.75),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  --ty-shadow-2: 0 1px 2px rgba(30, 20, 70, 0.04),
    0 10px 24px -10px rgba(40, 30, 90, 0.14),
    0 30px 60px -32px rgba(60, 40, 140, 0.22);

  /* L3 弹窗 / 强焦点浮层 */
  --ty-glass-3: rgba(255, 255, 255, 0.78);
  --ty-blur-3: blur(40px) saturate(200%);
  --ty-rim-3: inset 0 0 0 0.5px rgba(255, 255, 255, 0.85),
    inset 0 1px 0 rgba(255, 255, 255, 0.95);
  --ty-shadow-3: 0 2px 4px rgba(30, 20, 70, 0.05),
    0 16px 32px -12px rgba(40, 30, 90, 0.18),
    0 40px 72px -30px rgba(80, 50, 180, 0.3);

  /* ========== 动效 ========== */
  --ty-ease: cubic-bezier(0.25, 0.1, 0.25, 1);
  --ty-spring: cubic-bezier(0.32, 0.72, 0, 1);
  --ty-dur-fast: 0.16s;
  --ty-dur: 0.24s;
  --ty-dur-slow: 0.38s;
  --ty-press: 0.97;

  /* ========== 布局壳 ========== */
  --ty-sidebar-w: 264px;
  --ty-tabbar-h: 64px;
}

/* 工具类：三级玻璃卡 */
.ty-glass-1 {
  background: var(--ty-glass-1);
  backdrop-filter: var(--ty-blur-1);
  -webkit-backdrop-filter: var(--ty-blur-1);
  box-shadow: var(--ty-rim-1), var(--ty-shadow-1);
}
.ty-glass-2 {
  background: var(--ty-glass-2);
  backdrop-filter: var(--ty-blur-2);
  -webkit-backdrop-filter: var(--ty-blur-2);
  box-shadow: var(--ty-rim-2), var(--ty-shadow-2);
}
.ty-glass-3 {
  background: var(--ty-glass-3);
  backdrop-filter: var(--ty-blur-3);
  -webkit-backdrop-filter: var(--ty-blur-3);
  box-shadow: var(--ty-rim-3), var(--ty-shadow-3);
}

/* 局部高饱和光晕（放在场景背景层，不盖内容） */
.ty-ambient {
  pointer-events: none;
  position: absolute;
  inset: 0;
  background:
    radial-gradient(60% 50% at 12% 18%, var(--ty-glow-a), transparent 60%),
    radial-gradient(50% 45% at 88% 22%, var(--ty-glow-b), transparent 55%),
    radial-gradient(45% 40% at 70% 88%, var(--ty-glow-c), transparent 50%);
  opacity: 0.9;
}