@layer base, layout, components, responsive;
@layer base {
  :root { --paper:#f6f5f1; --ink:#202721; --muted:#697169; --line:#dedfd7; --blue:#245ce6; font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif; color:var(--ink); background:var(--paper); font-synthesis:none; scroll-behavior:smooth; }
  * { box-sizing:border-box; } body { margin:0; } h1,h2,p { margin:0; } button { font:inherit; } button,a { -webkit-tap-highlight-color:transparent; } button,a { touch-action:manipulation; } button { cursor:pointer; } button { color:inherit; } a { color:inherit; text-decoration:none; } a:hover { color:var(--blue); } button:focus-visible,a:focus-visible { outline:3px solid var(--blue); outline-offset:5px; } ::selection { background:#cfddff; color:var(--ink); } [hidden] { display:none!important; } .icon { width:21px; height:21px; flex:none; } .wrap { width:min(1120px,calc(100% - 64px)); margin-inline:auto; } .eyebrow { display:block; font-size:11px; font-weight:650; letter-spacing:.13em; line-height:1.6; } .brand { display:inline-flex; align-items:center; gap:10px; font-size:17px; font-weight:650; letter-spacing:-.045em; white-space:nowrap; } .brand-mark { flex:none; } .skip-link { position:absolute; left:16px; top:-100px; background:var(--ink); color:#fff; padding:12px; z-index:20; } .skip-link:focus { top:12px; color:#fff; }
  h2 { font-size:45px; font-weight:500; letter-spacing:-.055em; line-height:1.17; } .button { display:inline-flex; justify-content:center; align-items:center; gap:20px; background:var(--blue); color:#fff; border:1px solid transparent; border-radius:7px; padding:15px 22px; font-size:14px; font-weight:550; min-height:50px; transition:background .18s,transform .18s; } .button:hover { background:#174cc9; color:#fff; transform:translateY(-1px); } .button:disabled { cursor:default; opacity:.75; transform:none; } .button-quiet { background:transparent; color:var(--ink); border-color:var(--line); } .button-quiet:hover { background:#ebece6; color:var(--ink); } .button-small { font-size:12px; min-height:40px; padding:10px 14px; gap:8px; }
}
@layer layout {
  .nav-reward { display:inline-flex; align-items:center; gap:5px; padding:6px 9px; border:1px solid rgba(255,128,200,.4); border-radius:7px; background:#ffeff7; color:#bf3989; font-weight:600; white-space:nowrap; }
  .nav-reward:hover { color:#bf3989; border-color:#bf3989; }
  .nav-reward .icon { width:14px; height:14px; }
  .site-header { height:94px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); } .site-header nav { display:flex; align-items:center; gap:32px; font-size:12px; } .site-header .language { display:inline-flex; align-items:center; gap:7px; } .language .icon { width:16px; height:16px; } .nav-source { display:flex; align-items:center; gap:10px; } .nav-source .icon { width:16px; height:16px; transform:rotate(-40deg); }
  .hero { padding-block:clamp(48px,7vw,88px) clamp(36px,5vw,58px); }
  .hero h1 { max-width:19ch; font-size:clamp(36px,5.4vw,72px); font-weight:550; letter-spacing:-.055em; line-height:1.08; text-wrap:balance; }
  html[lang="zh-CN"] .hero h1 { max-width:23ch; letter-spacing:-.045em; line-height:1.2; }
  .hero-intro { max-width:62ch; color:var(--muted); font-size:16px; line-height:1.7; margin-top:18px; }
  .hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px 18px; margin-top:22px; }
  .release-status { color:var(--muted); font-size:13px; }
  .capture-types { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
  .capture-types article { display:grid; grid-template-rows:auto 1fr auto; border-top:1px solid var(--line); padding-top:18px; }
  .capture-types h2 { font-size:20px; font-weight:600; letter-spacing:-.02em; }
  .capture-types p { color:var(--muted); font-size:14px; line-height:1.65; margin-top:7px; }
  .feature-illustration {
    display:block;
    width:100%;
    height:clamp(122px,11vw,146px);
    margin-top:14px;
    border:1px solid #e1e6e4;
    border-radius:8px;
    background:#eef1ef;
    color:var(--blue);
  }
  .site-footer { margin-top:56px; padding-block:22px; border-top:1px solid var(--line); display:flex; justify-content:space-between; flex-wrap:wrap; gap:18px 30px; color:var(--muted); font-size:12px; }
  .site-credit small { display:block; font-size:inherit; margin-top:6px; }
  .site-footer nav { display:flex; align-items:flex-start; flex-wrap:wrap; gap:12px 20px; }
  .site-footer nav .icon { width:12px; height:12px; vertical-align:middle; }
  .site-footer button { border:0; background:none; padding:0; font-size:inherit; color:inherit; }
  .consent { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); width:min(820px,calc(100% - 32px)); background:#fffefa; border:1px solid #dedfd7; box-shadow:0 8px 40px #28351f1a; padding:19px 22px; border-radius:10px; z-index:10; display:flex; align-items:center; gap:30px; } .consent strong { font-size:12px; font-weight:600; } .consent p { font-size:10px; line-height:1.7; color:var(--muted); margin-top:5px; } .consent p a { text-decoration:underline; text-underline-offset:3px; } .consent-actions { display:flex; gap:8px; flex:none; }
  .privacy-page { max-width:760px; padding-block:45px 20px; } .privacy-page>.eyebrow { color:var(--muted); margin-top:55px; } .back-link { font-size:12px; color:var(--muted); } .privacy-page h1 { font-size:55px; margin-top:18px; } .privacy-intro { margin-top:25px; font-size:17px; line-height:1.9; color:var(--muted); } .privacy-page section { margin-top:36px; } .privacy-page h2 { font-size:23px; } .privacy-page section p { font-size:14px; color:var(--muted); line-height:1.9; margin-top:12px; } .privacy-page ul { padding-left:20px; font-size:13px; line-height:2; } .privacy-page ul a { text-decoration:underline; text-underline-offset:3px; } .not-found { text-align:center; padding-block:110px; } .not-found h1 { font-size:55px; } .not-found>p:not(.eyebrow) { margin:25px 0; color:var(--muted); }
}
@layer responsive {
  @media (max-width:760px) {
    .wrap { width:calc(100% - 40px); }
    .capture-types { grid-template-columns:1fr; gap:18px; }
    .site-header { height:78px; }
    .site-header nav { gap:19px; }
    .site-footer { margin-top:40px; }
    .consent { flex-direction:column; align-items:stretch; gap:12px; padding:17px; bottom:12px; }
    .consent-actions { justify-content:flex-end; }
    .privacy-page h1 { font-size:43px; }
    .privacy-page .privacy-intro { font-size:15px; }
  }
  @media (max-width:600px) {
    .hero-intro { font-size:15px; }
  }
  @media (max-width:420px) {
    .wrap { width:calc(100% - 32px); }
    .brand { font-size:15px; gap:8px; }
    .brand-mark { width:28px; height:28px; }
    .site-header nav { gap:10px; font-size:11px; }
    .nav-source .icon, .language .icon { display:none; }
    .nav-reward { padding-inline:7px; }
    .hero-actions .button { font-size:13px; gap:12px; padding:12px 15px; }
  }
  @media (pointer:coarse) {
    .site-header a { min-height:44px; align-content:center; }
    .site-footer nav a,.site-footer nav button { min-height:44px; display:inline-flex; align-items:center; }
    .consent .button { min-height:44px; }
  }
  @media (prefers-reduced-motion:reduce) { :root { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; animation:none!important; } }
}
