/* Shared by index.html / privacy.html / terms.html.
   Single source for the design tokens: they used to be copied into all three
   pages, byte-identical -- change one, forget two, and nothing goes red. */

:root{
    /* 按 design.lagentbot.com 的角色表取值（design-console/tokens.ts） ──
       映射：官网变量 → 规范角色。渐变两条规范里逐字相同，原样保留
       （GRADIENTS 那节写着「只服务官网与宣传物料」）。 */
    /* NEUTRALS：规范是六层紫灰（色相锁 258°、饱和 8–10%）。
       这里只落官网真正用到的三层：规范里的 surface/field/hover 在这个站上
       零引用，加进来就是几个没人用的名字，等着被误用。用到时再从规范取。 */
    --bg:#09080A;              /* page   */
    --surface:#131215;         /* canvas */
    --surface-2:#1F1D22;       /* inset  */
    /* LINES */
    --line:rgba(255,255,255,0.10);        /* separator        */
    --line-strong:rgba(255,255,255,0.20); /* separator-strong */
    /* INK：四级，层级靠明度不靠字号 */
    --text:#FFFFFF;                        /* label   */
    --text-dim:rgba(235,235,245,0.80);     /* label-2 */
    --text-faint:rgba(235,235,245,0.43);   /* label-3 */
    /* BRAND：全站锁一把 violet */
    --accent:#8257E5;                      /* brand         */
    --accent-deep:#6E45CE;                 /* brand-pressed */
    /* 🔴 brand 与 brand-ink 是规范里**两个**角色，官网此前用一个 token 干两件事。
       brand 是填充/可交互（#8257E5 在 page 上 4.23，够大字不够正文），
       brand-ink 是「深底上的强调文字，要够亮」（8.52）。凡是 color: 都用后者。 */
    --accent-ink:#B49CF0;                  /* brand-ink */
    --accent-glow:rgba(130,87,229,0.18);
    /* 渐变：与规范逐字相同，未改 */
    --grad-brand:linear-gradient(135deg, #6264A7 0%, #8257E5 55%, #A78BFA 100%);
    --grad-brand-hover:linear-gradient(135deg, #7276C4 0%, #9670F0 55%, #BCA8FF 100%);
    --grad-text:linear-gradient(90deg, #9EA2FF 0%, #C4B5FD 100%);
    /* SEMANTIC */
    --green:#30D158;           /* ok  */
    --green-dim:#047857;       /* ok-ink（浅底用） */
    --red:#FF453A;             /* bad */
    --red-deep:#D70015;
    /* RADII：按「这是个什么东西」选 */
    --radius:12px;             /* radius-group   */
    --radius-sm:10px;          /* radius-control */
    --maxw:1160px;
    /* FONTS：规范是 Inter（SF Pro 的可商用替代），数据走 IBM Plex Mono */
    --font-display:'Inter',system-ui,sans-serif;
    --font-body:'Inter',system-ui,sans-serif;
    --font-mono:'IBM Plex Mono',ui-monospace,monospace;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--bg);
    color:var(--text);
    font-family:var(--font-body);
    font-size:16px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  a{color:inherit;text-decoration:none;}
  img{display:block;max-width:100%;}

  ::selection{background:var(--accent-glow);color:#fff;}

  :focus-visible{
    outline:2px solid var(--accent);
    outline-offset:3px;
    border-radius:4px;
  }

  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;}

  /* ---------------- NAV ---------------- */
  .nav{
    position:sticky;top:0;z-index:50;
    height:72px;
    display:flex;align-items:center;
    background:rgba(10,12,16,0.78);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    border-bottom:1px solid var(--line);
  }
  .nav .wrap{display:flex;align-items:center;justify-content:space-between;width:100%;gap:24px;}
  .nav-logo{height:54px;width:auto;}
  .nav-links{display:flex;align-items:center;gap:30px;}
  .nav-links a.link{
    font-family:var(--font-mono);
    font-size:13px;
    letter-spacing:0.04em;
    color:var(--text-dim);
    transition:color .18s ease;
  }
  .nav-links a.link:hover{color:var(--text);}

  .btn{
    display:inline-flex;align-items:center;gap:8px;
    font-family:var(--font-display);
    font-weight:600;
    font-size:14px;
    line-height:1;
    padding:12px 18px;
    border-radius:var(--radius-sm);
    border:1px solid transparent;
    cursor:pointer;
    transition:transform .15s ease, background .18s ease, border-color .18s ease;
    white-space:nowrap;
  }
  .btn-primary{
    background:var(--grad-brand);
    color:#fff;
    border-color:rgba(167,139,250,0.45);
    box-shadow:0 0 0 1px rgba(130,87,229,0.28), 0 8px 30px -12px rgba(130,87,229,0.42);
  }
  .btn-primary:hover{background:var(--grad-brand-hover);transform:translateY(-1px);}
  .btn-ghost{
    background:transparent;
    color:var(--text);
    border-color:var(--line-strong);
  }
  .btn-ghost:hover{border-color:var(--text-dim);transform:translateY(-1px);}
  .nav .btn{padding:10px 16px;}
  .foot-top{
    display:grid;
    grid-template-columns:1.4fr repeat(5,1fr);
    gap:36px 24px;
    padding-bottom:44px;
    border-bottom:1px solid var(--line);
  }
  .foot-brand .foot-logo{height:46px;width:auto;opacity:0.92;margin-bottom:16px;}
  .foot-desc{color:var(--text-dim);font-size:13.5px;max-width:34ch;margin:0;}
  .foot-col h4{
    font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;
    text-transform:uppercase;color:var(--text-faint);
    margin:0 0 16px;font-weight:500;
  }
  .foot-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:11px;}
  .foot-col a{font-size:14px;color:var(--text-dim);transition:color .16s ease;}
  .foot-col a:hover{color:var(--text);}
  .foot-col .foot-off{font-size:14px;color:var(--text-faint);opacity:.55;cursor:default;}
  .foot-bottom{
    display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:18px;
    padding-top:26px;
  }
  .foot-copy{color:var(--text-faint);font-size:13px;font-family:var(--font-mono);letter-spacing:0.03em;}
  .foot-social{display:flex;align-items:center;gap:18px;}
  .foot-social a{color:var(--text-dim);display:inline-flex;transition:color .16s ease;}
  .foot-social a:hover{color:var(--text);}
  .foot-social svg{width:18px;height:18px;display:block;fill:currentColor;}
  .foot-lang{
    font-family:var(--font-mono);font-size:12px;letter-spacing:0.08em;
    color:var(--text-dim);border:1px solid var(--line-strong);
    border-radius:6px;padding:5px 11px;
  }

  /* ---------------- RESPONSIVE ---------------- */
  @media (max-width:960px){
    .foot-top{grid-template-columns:1fr 1fr 1fr;}
    .foot-brand{grid-column:1 / -1;}
  }