/* ============================================================
   theme.css · 全站共享基础（设计令牌 / reset / 背景 / 动效关键帧）
   各页面专属样式仍在本页面的独立样式表（style.css / guncodes.css）
   修改设计令牌只需改这里，两页自动生效
   ============================================================ */

/* ---------- 设计令牌 ---------- */
:root {
  /* iOS 系统色 */
  --ios-blue: #007aff;
  --ios-indigo: #5856d6;
  --ios-purple: #af52de;
  --ios-teal: #30b0c7;
  --ios-green: #34c759;
  --ios-orange: #ff9500;
  --ios-red: #ff3b30;

  /* 表面与文字 */
  --bg: #f2f3f7;
  --glass: rgba(255, 255, 255, 0.55);
  --glass-strong: rgba(255, 255, 255, 0.74);
  --glass-border: rgba(255, 255, 255, 0.7);
  --glass-highlight: rgba(255, 255, 255, 0.55);
  --glass-shadow: 0 8px 32px rgba(31, 35, 41, 0.1), 0 2px 8px rgba(31, 35, 41, 0.05);
  --glass-shadow-deep: 0 18px 52px rgba(31, 35, 41, 0.16), 0 4px 12px rgba(31, 35, 41, 0.06);
  --text: #1c1c1e;
  --text-secondary: #8e8e93;
  --hover-bg: rgba(0, 0, 0, 0.045);
  --field-bg: rgba(118, 118, 128, 0.12);
  --sheen: rgba(255, 255, 255, 0.4);
  --accent: var(--ios-blue);

  /* 字体（各页 body 统一引用） */
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display",
    "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;

  /* 统一动效语言：同曲线、同时长，全站一致 */
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1); /* 弹跳：弹窗/菜单/提示 */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);        /* 平滑：悬停/过渡/入场 */
  --ease-ios: cubic-bezier(0.32, 0.72, 0, 1);       /* iOS 系统曲线：循环/长动效 */
  --dur-1: 160ms;
  --dur-2: 280ms;
  --dur-3: 480ms;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #000000;
    --glass: rgba(44, 44, 46, 0.62);
    --glass-strong: rgba(58, 58, 62, 0.8);
    --glass-border: rgba(255, 255, 255, 0.16);
    --glass-highlight: rgba(255, 255, 255, 0.1);
    --glass-shadow: 0 12px 40px rgba(0, 0, 0, 0.55), 0 2px 8px rgba(0, 0, 0, 0.4);
    --glass-shadow-deep: 0 24px 64px rgba(0, 0, 0, 0.7), 0 6px 16px rgba(0, 0, 0, 0.5);
    --text: #f2f2f7;
    --text-secondary: #98989f;
    --hover-bg: rgba(255, 255, 255, 0.08);
    --field-bg: rgba(120, 120, 128, 0.24);
    --sheen: rgba(255, 255, 255, 0.16);
    --accent: #0a84ff;
  }
}

/* ---------- 基础 ---------- */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

/* 键盘焦点可见性（全站统一 accent 焦点环；输入框若有更明确的焦点指示可自行覆盖） */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* ---------- 渐变光斑背景（iOS 壁纸式，缓慢漂移） ---------- */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(1100px 760px at 12% 8%, rgba(10, 132, 255, 0.16), transparent 62%),
    radial-gradient(900px 680px at 88% 14%, rgba(175, 82, 222, 0.13), transparent 62%),
    radial-gradient(980px 760px at 55% 100%, rgba(48, 176, 199, 0.11), transparent 62%),
    var(--bg);
  will-change: transform;
  animation: aurora 32s var(--ease-ios) infinite alternate;
}

@media (prefers-color-scheme: dark) {
  body::before {
    background:
      radial-gradient(1100px 760px at 12% 8%, rgba(10, 132, 255, 0.26), transparent 62%),
      radial-gradient(900px 680px at 88% 14%, rgba(88, 86, 214, 0.22), transparent 62%),
      radial-gradient(980px 760px at 55% 100%, rgba(48, 176, 199, 0.16), transparent 62%),
      #000;
  }
}

@keyframes aurora {
  from {
    transform: scale(1) translate(0, 0);
  }
  to {
    transform: scale(1.08) translate(-1.5%, 1.5%);
  }
}

/* ============ 统一动效关键帧 ============ */
@keyframes fade-up {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: none; }
}

@keyframes fade-down {
  from { opacity: 0; transform: translateY(-14px); }
  to   { opacity: 1; transform: none; }
}

@keyframes pop-in {
  from { opacity: 0; transform: scale(0.92) translateY(-8px); }
  to   { opacity: 1; transform: none; }
}

@keyframes fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ============ 减弱动效偏好：关闭全部动画与过渡 ============ */
@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
  }

  body::before {
    animation: none;
  }
}
