/* =====================================================================
   拾光喵 · 子页共用样式（对齐首页 v4 雾霾蓝）
   静态 · 无外部依赖 · 跟随系统深色 · 尊重 prefers-reduced-motion
   ===================================================================== */

:root{
  --bg:#FFFFFF; --bg2:#F7FAFF;
  --primary:#2B6CDE; --btn:#2B6CDE; --btn-hover:#2358B4;
  --title:#16191F; --text:#5B6472; --warm:#F0831E;
  --line:#E7ECF3; --card:#FFFFFF;
  --d1:#D6E6FF; --d2:#7FB0F5; --d3:#FFB366; --d4:#FF9433;
  --deep:#141A2B; --deep2:#1B2436; --deep-text:#F4F7FC; --deep-sub:#A8B7D0;
  --nav-bg:rgba(255,255,255,.72); --nav-fg:#1C1917; --nav-line:rgba(28,25,23,.08);
  --font:"Outfit", -apple-system, BlinkMacSystemFont, "PingFang SC", sans-serif;
  --nav-h:56px;
  --pad-x:clamp(20px,4vw,40px);
  --prose-w:720px;
  --r-card:28px; --r-pill:999px;
}



*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;background:var(--bg);scroll-behavior:smooth}
body{
  font-family:var(--font);color:var(--text);background:var(--bg);
  line-height:1.7;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  min-height:100svh;display:flex;flex-direction:column;overflow-x:clip
}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,h4{font-weight:700;color:var(--title);letter-spacing:.01em}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:12px;top:-64px;z-index:100;background:var(--btn);color:#fff;padding:8px 14px;border-radius:12px;text-decoration:none;font-size:14px}
.skip:focus{top:12px}
:focus-visible{outline:3px solid #8DB6E0;outline-offset:3px;border-radius:6px}

/* ---------- 导航 ---------- */
.nav{
  position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:50;width:min(calc(100% - 28px),760px);
  display:flex;align-items:center;justify-content:space-between;
  padding:9px 20px;border-radius:999px;color:var(--nav-fg);background:var(--nav-bg);
  -webkit-backdrop-filter:saturate(1.5) blur(16px);backdrop-filter:saturate(1.5) blur(16px);
  border:1px solid var(--nav-line);box-shadow:0 10px 30px -18px rgba(28,25,23,.3)
}
.nav-brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;font-size:17px;letter-spacing:.06em;color:var(--nav-fg)}
.nav-brand img{width:30px;height:30px;border-radius:8px}
.nav-links{display:flex;align-items:center;gap:clamp(16px,2.5vw,28px);font-size:15px}
.nav-links a{text-decoration:none;opacity:.88;color:var(--nav-fg)}
.nav-links a:hover,.nav-links a.is-active{opacity:1}
.nav-links a.is-active{font-weight:600}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  height:52px;padding:0 30px;border-radius:26px;background:var(--btn);color:#fff;
  font-size:17px;font-weight:700;letter-spacing:.03em;text-decoration:none;
  transition:background-color .2s ease;border:0;cursor:pointer
}
.btn:hover{background:var(--btn-hover)}
.soon{font-size:14px;color:var(--text)}
.eyebrow{font-size:13px;letter-spacing:.22em;font-weight:700;color:var(--primary)}

/* ---------- 子页头（轻视差） ---------- */
.sub-hero{
  position:relative;overflow:hidden;
  padding:calc(var(--nav-h) + 72px) var(--pad-x) 56px;
  background:var(--bg2);text-align:center
}
.sub-hero .layers{position:absolute;inset:0;pointer-events:none}
.sub-hero .layer{position:absolute;inset:0;will-change:transform}
.sub-hero .layer i{position:absolute;display:block;border-radius:40%;filter:blur(60px)}
.sub-hero .l1 i:nth-child(1){left:-10%;top:10%;width:42%;height:70%;background:var(--d1);border-radius:64px}
.sub-hero .l1 i:nth-child(2){right:-8%;top:40%;width:36%;height:60%;background:var(--d1);border-radius:64px}
.sub-hero .l2 i:nth-child(1){left:12%;top:55%;width:18vmin;height:18vmin;background:var(--d2)}
.sub-hero .l2 i:nth-child(2){right:14%;top:18%;width:14vmin;height:14vmin;background:var(--d2)}
.sub-hero .l3 i:nth-child(1){left:68%;top:62%;width:8vmin;height:8vmin;background:var(--d3)}
.sub-hero .l3 i:nth-child(2){left:22%;top:22%;width:5vmin;height:5vmin;background:var(--d3)}
.sub-hero .l3 i:nth-child(3){right:28%;top:48%;width:1.4vmin;height:1.4vmin;border-radius:50%;background:var(--warm)}
.sub-hero-inner{position:relative;z-index:1;max-width:var(--prose-w);margin:0 auto}
.sub-hero h1{font-size:clamp(32px,5vw,48px);line-height:1.25;margin-top:10px}
.sub-hero .lede{margin-top:14px;font-size:clamp(16px,1.5vw,18px);line-height:1.8;color:var(--text);text-wrap:balance}
.sub-hero .meta{margin-top:12px;font-size:14px;color:var(--text);opacity:.85}

/* ---------- 正文区 ---------- */
.page{flex:1;padding:48px var(--pad-x) 80px;background:var(--bg)}
.page-inner{max-width:var(--prose-w);margin:0 auto}
.prose{font-size:clamp(16px,1.35vw,17px);line-height:1.85;color:var(--text)}
.prose h2{font-size:clamp(22px,2.6vw,28px);line-height:1.35;margin:2.2em 0 .7em;color:var(--title)}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:clamp(18px,2vw,20px);margin:1.6em 0 .5em;color:var(--title)}
.prose p,.prose ul,.prose ol{margin:0 0 1em}
.prose ul,.prose ol{padding-left:1.25em}
.prose li{margin:.35em 0}
.prose a{color:var(--btn);text-underline-offset:3px}
.prose a:hover{text-decoration:underline}
.prose strong{color:var(--title);font-weight:700}
.prose .note{font-size:14px;color:var(--text);opacity:.9;padding:14px 16px;border-radius:16px;background:var(--bg2);border:1px solid var(--line)}
.prose hr{border:0;border-top:1px solid var(--line);margin:2.4em 0}

/* FAQ 手风琴式列表（静态展开也可读） */
.faq-list{display:grid;gap:14px}
.faq-item{
  background:var(--card);border:1px solid var(--line);border-radius:22px;padding:22px 24px
}
.faq-item h2{font-size:clamp(18px,2.2vw,20px);margin:0 0 10px;line-height:1.4}
.faq-item p{margin:0;font-size:16px;line-height:1.8;color:var(--text)}
.faq-item p+p{margin-top:.7em}

/* 更新日志 */
.change-list{display:grid;gap:18px}
.change-card{
  background:var(--card);border:1px solid var(--line);border-radius:22px;padding:24px 26px
}
.change-card .ver{font-size:13px;letter-spacing:.18em;font-weight:700;color:var(--primary)}
.change-card h2{font-size:clamp(20px,2.4vw,24px);margin:8px 0 6px}
.change-card .when{font-size:14px;margin-bottom:12px}
.change-card ul{margin:0;padding-left:1.15em}
.change-card li{margin:.3em 0}

/* 许可表 */
.lic-table{width:100%;border-collapse:collapse;font-size:15px;margin:1em 0 1.5em}
.lic-table th,.lic-table td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.lic-table th{color:var(--title);font-weight:700;font-size:13px;letter-spacing:.04em}
.lic-table td{color:var(--text)}

/* ---------- 邀请页（沉浸） ---------- */
.invite-page{background:var(--bg)}
.invite-hero{
  position:relative;min-height:100svh;display:flex;align-items:center;justify-content:center;
  text-align:center;padding:calc(var(--nav-h) + 40px) 24px 80px;overflow:hidden;background:var(--bg2)
}
.invite-hero .layers{position:absolute;inset:0;pointer-events:none}
.invite-hero .layer{position:absolute;inset:0;will-change:transform}
.invite-hero .layer i{position:absolute;display:block;border-radius:40%;filter:blur(60px)}
.invite-hero .il1 i:nth-child(1){left:-14%;top:4%;width:50%;height:55%;background:var(--d1);border-radius:72px}
.invite-hero .il1 i:nth-child(2){right:-12%;bottom:-8%;width:48%;height:50%;background:var(--d1);border-radius:72px}
.invite-hero .il2 i:nth-child(1){left:8%;top:58%;width:24vmin;height:24vmin;background:var(--d2)}
.invite-hero .il2 i:nth-child(2){right:10%;top:12%;width:28vmin;height:28vmin;background:var(--d2)}
.invite-hero .il2 i:nth-child(3){left:62%;top:72%;width:12vmin;height:12vmin;background:var(--d3)}
.invite-hero .il3 i:nth-child(1){left:18%;top:24%;width:10vmin;height:10vmin;background:var(--d3)}
.invite-hero .il3 i:nth-child(2){right:20%;top:58%;width:14vmin;height:14vmin;background:var(--d4)}
.invite-hero .il3 i:nth-child(3){left:48%;top:18%;width:1.8vmin;height:1.8vmin;border-radius:50%;background:var(--warm)}
.invite-hero .il4 i:nth-child(1){left:72%;top:36%;width:6vmin;height:6vmin;background:var(--primary);opacity:.55}
.invite-hero .il4 i:nth-child(2){left:28%;top:78%;width:5vmin;height:5vmin;background:var(--d3)}
.invite-inner{position:relative;z-index:1;max-width:560px;width:100%}
.invite-logo{
  width:min(42vw,180px);height:auto;aspect-ratio:1;border-radius:22.5%;margin:0 auto;
  will-change:transform
}
.invite-name{
  margin-top:20px;font-size:clamp(26px,3.4vw,34px);letter-spacing:.16em;
  color:var(--title);line-height:1.2;padding-left:.16em;font-weight:700
}
.invite-title{
  margin-top:36px;font-size:clamp(28px,5vw,44px);line-height:1.3;
  color:var(--title);font-weight:700;text-wrap:balance
}
.invite-sub{
  margin:18px auto 0;max-width:28em;font-size:clamp(16px,1.5vw,18px);
  line-height:1.85;color:var(--text);text-wrap:balance
}
.invite-action{
  margin-top:32px;display:flex;align-items:center;justify-content:center;
  gap:14px;flex-wrap:wrap
}
.invite-points{
  position:relative;z-index:1;max-width:720px;margin:-20px auto 0;
  padding:0 24px 100px;display:grid;gap:14px
}
.invite-point{
  background:var(--card);border:1px solid var(--line);border-radius:22px;
  padding:22px 24px;will-change:transform
}
.invite-point h2{font-size:20px;margin:0 0 6px}
.invite-point p{margin:0;font-size:16px;line-height:1.75;color:var(--text)}

/* ---------- 页脚 ---------- */
.site-footer{position:relative;z-index:1;padding:56px 24px 28px;background:var(--bg);border-top:1px solid var(--line);text-align:left;font-size:14px;line-height:1.6;color:var(--text)}
.footer-grid{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px}
.footer-brand{display:flex;flex-direction:column;gap:4px}
.footer-logo img{width:36px;height:36px;border-radius:10px}
.footer-brand strong{font-size:16px;color:var(--title);letter-spacing:.02em}
.footer-tagline{font-size:13px;color:var(--text);opacity:.75;margin-top:6px}
.footer-col h4{font-size:13px;font-weight:700;color:var(--title);margin:0 0 12px;letter-spacing:.02em}
.footer-col a{display:block;padding:5px 0;color:var(--text);text-decoration:none}
.footer-col a:hover{color:var(--title)}
.footer-bottom{max-width:1080px;margin:40px auto 0;padding-top:18px;border-top:1px solid var(--line);color:var(--text);opacity:.7;font-size:13px;text-align:center}

/* ---------- 响应式 ---------- */
@media (max-width:760px){
  .footer-grid{grid-template-columns:1fr 1fr;gap:24px}.footer-brand{grid-column:1/-1}
  :root{--nav-h:52px}
  .nav-brand{font-size:16px}
  .nav-brand img{width:28px;height:28px}
  .nav-links{gap:14px;font-size:14px}
  .sub-hero{padding:calc(var(--nav-h) + 48px) 20px 40px}
  .page{padding:36px 20px 64px}
  .faq-item,.change-card,.invite-point{padding:18px 18px;border-radius:18px}
  .invite-hero{padding:calc(var(--nav-h) + 28px) 20px 60px}
  .btn{height:48px;padding:0 26px;font-size:16px}
}

@media (max-width:380px){
  .nav-brand span{display:none}
  .nav-links{gap:12px}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *{transition:none!important;animation:none!important}
  .sub-hero .layer,.invite-hero .layer,.invite-logo,.invite-point{will-change:auto!important;transform:none!important}
}
