/* Prismly 官网 · 设计令牌与全站样式
   来源：design/site/handoff-r1/site-template/styles.css（令牌对应 brand/design-tokens.md）。
   不能有内联样式和内联脚本：_headers 的 CSP 只允许同源样式表、不允许脚本。 */
@font-face{font-family:"Caveat";src:url("/assets/fonts/caveat-wordmark.fef297c031.woff2") format("woff2");font-weight:700;font-display:swap}

:root{
  color-scheme:light dark;
  --surface:#F4FBFA;--surface-lowest:#FFFFFF;--surface-low:#EFF5F4;--surface-c:#E9EFEE;--surface-high:#E3EAE9;--surface-highest:#DDE4E3;
  --on-surface:#191C1C;--on-surface-var:#3F4948;
  --primary:#006A6A;--on-primary:#FFFFFF;--primary-c:#6FF7F6;--on-primary-c:#002020;
  --secondary-c:#CCE8E7;--on-secondary-c:#051F1F;
  --outline:#6F7979;--outline-var:#BEC9C8;
  --error:#BA1A1A;--success:#1B6B3A;--warning:#7A5900;--warning-c:#FFDF9E;--on-warning-c:#261900;
  --ghost:#D7C4FF;--badge:url("/assets/icons/badge_clone_light.3be9564715.svg");
  --hero-bg:var(--secondary-c);--hero-fg:var(--on-secondary-c);
  --shadow:0,32,32;
  --r-card:24px;--r-hero:28px;--pad-x:clamp(16px,5vw,56px);--max:1200px;
}
@media (prefers-color-scheme:dark){:root{
  --surface:#0E1514;--surface-lowest:#090F0F;--surface-low:#161D1D;--surface-c:#1A2121;--surface-high:#252B2B;--surface-highest:#2F3636;
  --on-surface:#DDE4E3;--on-surface-var:#BEC9C8;
  --primary:#4CDADA;--on-primary:#003737;--primary-c:#004F4F;--on-primary-c:#6FF7F6;
  --secondary-c:#324B4B;--on-secondary-c:#CCE8E7;
  --outline:#889392;--outline-var:#3F4948;
  --error:#FFB4AB;--success:#8AD6A3;--warning:#F5BE48;--warning-c:#5C4200;--on-warning-c:#FFDF9E;
  --ghost:#4A3D73;--badge:url("/assets/icons/badge_clone_dark.be72ccf89b.svg");
  --shadow:0,0,0;
}}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{margin:0;padding:0}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;background:var(--surface);color:var(--on-surface);line-height:1.6;-webkit-font-smoothing:antialiased;text-wrap:pretty;overflow-wrap:break-word}
:lang(ja) body,body:lang(ja){font-family:system-ui,-apple-system,"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic UI",Meiryo,sans-serif;line-height:1.8}
:lang(zh) body,body:lang(zh){font-family:system-ui,-apple-system,"PingFang SC","Noto Sans SC","Microsoft YaHei",sans-serif}
:lang(de){hyphens:auto;-webkit-hyphens:auto}
:lang(ja){word-break:auto-phrase}
a{color:var(--primary);text-underline-offset:3px}
a:hover{color:var(--on-surface)}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,p,ul,ol,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--pad-x);padding-right:var(--pad-x)}
.skip{position:absolute;left:12px;top:-60px;z-index:10;background:var(--primary);color:var(--on-primary);padding:10px 16px;border-radius:999px;font-weight:500;text-decoration:none}
.skip:focus{top:12px;color:var(--on-primary)}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ===== 页头 / 页脚 ===== */
.site-header{display:flex;align-items:center;justify-content:space-between;gap:8px 16px;flex-wrap:wrap;padding-top:16px;padding-bottom:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--on-surface);padding:4px 0}
.brand img{width:36px;height:36px;border-radius:9px}
.wordmark{font-family:Caveat,cursive;font-weight:700;font-size:32px;line-height:1}
.site-nav{display:flex;gap:2px;flex-wrap:wrap;font-size:15px;font-weight:500}
.site-nav a{text-decoration:none;color:var(--on-surface-var);padding:10px 12px;border-radius:999px}
.site-nav a:hover{background:var(--surface-c);color:var(--on-surface)}
.site-nav a[aria-current="page"]{background:var(--secondary-c);color:var(--on-secondary-c)}
.site-footer{background:var(--surface-low);border-top:1px solid var(--outline-var);font-size:14px;color:var(--on-surface-var)}
.site-footer .wrap{padding-top:40px;padding-bottom:48px;display:flex;flex-direction:column;gap:28px}
.footer-row{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:flex-start}
.footer-nav{display:flex;gap:4px 20px;flex-wrap:wrap;font-size:15px;font-weight:500}
.footer-nav a{text-decoration:none;padding:6px 0}
.footer-nav a:hover{text-decoration:underline}
.lang{display:flex;flex-direction:column;gap:8px}
.lang h2{font-size:13px;font-weight:600;letter-spacing:.04em;color:var(--on-surface-var)}
.lang ul{display:flex;flex-wrap:wrap;gap:6px}
.lang a{display:inline-block;text-decoration:none;color:var(--on-surface);border:1px solid var(--outline-var);border-radius:999px;padding:6px 12px;font-size:14px;line-height:1.3}
.lang a:hover{background:var(--surface-c)}
.lang a[aria-current="true"]{background:var(--secondary-c);color:var(--on-secondary-c);border-color:transparent;font-weight:600}
.footer-meta{display:flex;flex-direction:column;gap:6px}
.footer-meta a{color:var(--primary)}

/* ===== 首屏 ===== */
.hero{padding-top:clamp(8px,3vw,40px);padding-bottom:clamp(40px,6vw,80px)}
.hero-card{background:var(--hero-bg);color:var(--hero-fg);border-radius:var(--r-hero);padding:clamp(24px,5vw,64px);display:grid;grid-template-columns:1fr;gap:clamp(32px,5vw,64px);align-items:center;overflow:hidden}
@media (min-width:860px){.hero-card{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}}
.hero-copy{display:flex;flex-direction:column;gap:20px;min-width:0}
.hero h1{font-size:clamp(34px,5.2vw,68px);line-height:1.15;font-weight:600;letter-spacing:-0.01em}
:lang(de) .hero h1,:lang(fr) .hero h1,:lang(it) .hero h1,:lang(es) .hero h1{font-size:clamp(32px,4.6vw,60px)}
:lang(ja) .hero h1{line-height:1.3}
.hero .lead{font-size:clamp(17px,1.4vw,20px);max-width:30em}
.hero-actions{display:flex;align-items:center;gap:16px 24px;flex-wrap:wrap;margin-top:8px}
/* 官方徽章：不改色、不加效果；高度 ≥ 40px，四周留白 ≥ 高度 1/4（徽章 SVG 自带外框，外面再留 12px） */
.play-badge{display:inline-block;padding:0;margin:-4px 0;line-height:0}
.play-badge img{height:56px;width:auto}
.coming-soon{display:inline-flex;align-items:center;gap:10px;background:var(--surface);color:var(--on-surface);border-radius:999px;padding:12px 22px;font-weight:500;min-height:48px}
.coming-soon::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--primary)}
.hero-link{color:var(--hero-fg);font-weight:500;text-decoration:underline;text-underline-offset:4px;padding:10px 0}
.hero-link:hover{color:var(--hero-fg);text-decoration-thickness:2px}
.hero .fine{font-size:14px}
.hero-visual{position:relative;display:flex;justify-content:center;min-width:0;padding-bottom:96px}
.hero-visual .shot-main{width:min(100%,300px);border-radius:24px;box-shadow:0 24px 60px rgba(var(--shadow),.25)}

/* 首屏动效：打开开关 → 分身出现在主屏幕。默认样式就是「打开后」的静态画面，减少动态效果时停在这里 */
.demo{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:min(100%,340px);background:var(--surface);color:var(--on-surface);border-radius:20px;padding:14px 16px;box-shadow:0 16px 40px rgba(var(--shadow),.22);display:flex;flex-direction:column;gap:12px;font-size:14px;line-height:1.3}
.demo-row{display:flex;align-items:center;gap:12px}
.demo-name{flex:1;min-width:0;display:flex;flex-direction:column}
.demo-name b{font-weight:500;font-size:15px}
.demo-name span{color:var(--on-surface-var);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.demo hr{border:0;height:1px;background:var(--outline-var);margin:0}
.demo-home{display:flex;gap:18px;align-items:flex-start;padding:4px 6px 0}
.demo-app{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:56px;font-size:12px;text-align:center;white-space:nowrap}
.demo-note{margin-left:auto;align-self:center;font-size:12px;color:var(--on-surface-var);text-align:right;max-width:9em}
.switch{position:relative;flex:none;width:52px;height:32px}
.switch .track{position:absolute;inset:0;border-radius:999px;border:2px solid var(--primary);background:var(--primary)}
.switch .knob{position:absolute;left:2px;top:2px;width:24px;height:24px;margin:2px;border-radius:999px;background:var(--on-primary);transform:translateX(20px)}
.switch .tap{position:absolute;left:-8px;top:-8px;width:48px;height:48px;border-radius:999px;background:var(--primary);opacity:0}
@keyframes p-knob{0%,18%{transform:translateX(0);background:var(--outline);width:16px;height:16px;margin:6px}26%,84%{transform:translateX(20px);background:var(--on-primary);width:24px;height:24px;margin:2px}92%,100%{transform:translateX(0);background:var(--outline);width:16px;height:16px;margin:6px}}
@keyframes p-track{0%,18%{background:var(--surface-highest);border-color:var(--outline)}26%,84%{background:var(--primary);border-color:var(--primary)}92%,100%{background:var(--surface-highest);border-color:var(--outline)}}
@keyframes p-clone{0%,30%{opacity:0;transform:scale(.5)}40%,84%{opacity:1;transform:scale(1)}92%,100%{opacity:0;transform:scale(.5)}}
@keyframes p-tap{0%,10%{opacity:0;transform:scale(.4)}16%{opacity:.55;transform:scale(1)}26%,100%{opacity:0;transform:scale(1.6)}}
@keyframes p-label{0%,34%{opacity:0}44%,84%{opacity:1}92%,100%{opacity:0}}
@media (prefers-reduced-motion:no-preference){
  .switch .track{animation:p-track 7s ease-in-out infinite}
  .switch .knob{animation:p-knob 7s ease-in-out infinite}
  .switch .tap{animation:p-tap 7s ease-in-out infinite}
  .demo .is-clone{animation:p-clone 7s ease-in-out infinite}
  .demo-note{animation:p-label 7s ease-in-out infinite}
}

/* 抽象应用图标（演示应用 Loop / Jot / Beacon / Pixa / Stride 的配色） */
.ico{position:relative;flex:none;width:40px;height:40px;border-radius:10px;background:#3B7BF2;display:grid;place-items:center}
.ico::after{content:"";width:24px;height:18px;border-radius:6px;background:#fff}
.ico.jot{background:#F5A742}.ico.jot::after{width:20px;height:20px;border-radius:5px}
.ico.beacon{background:#E34A3F}.ico.beacon::after{width:0;height:0;border-radius:0;background:none;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:16px solid #fff}
.ico.pixa{background:#E05A7E}.ico.pixa::after{width:24px;height:16px;border-radius:4px}
.ico.stride{background:#2FA35F}.ico.stride::after{width:10px;height:22px;border-radius:5px}
.clone{position:relative;flex:none;width:46px;height:46px}
.clone::before{content:"";position:absolute;left:6px;top:6px;width:40px;height:40px;border-radius:10px;background:var(--ghost)}
.clone .ico{position:absolute;left:0;top:0}
.clone::after{content:"";position:absolute;right:-3px;bottom:-3px;width:20px;height:20px;border-radius:50%;background:var(--badge) center/contain no-repeat;box-shadow:0 0 0 2px var(--surface)}

/* ===== 区块 ===== */
.section{padding-bottom:clamp(48px,7vw,96px)}
.section-alt{background:var(--surface-low)}
.section-alt .wrap{padding-top:clamp(48px,7vw,96px);padding-bottom:clamp(48px,7vw,96px)}
.section h2,.section-alt h2{font-size:clamp(26px,3vw,36px);font-weight:600;line-height:1.25;margin-bottom:8px}
.section-alt h2{margin-bottom:32px}
.section .intro{color:var(--on-surface-var);font-size:17px;max-width:40em;margin-bottom:32px}
.pad-top{padding-top:clamp(48px,7vw,96px)}

/* 特性区：1 张宽卡 + 6 张（3 列 × 2 行 / 2 列 × 3 行 / 1 列）+ 1 张宽卡 */
.features{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:700px){.features{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1040px){.features{grid-template-columns:repeat(3,minmax(0,1fr))}}
.card{background:var(--surface-low);border-radius:var(--r-card);padding:clamp(22px,3vw,32px);display:flex;flex-direction:column;gap:12px;overflow:hidden;min-width:0}
.card h3{font-size:22px;font-weight:600;line-height:1.3}
.card p{color:var(--on-surface-var);font-size:16px}
.card .grow{flex:1}
.card-wide{grid-column:1/-1}
.card-split{display:grid;grid-template-columns:1fr;gap:28px;align-items:center}
@media (min-width:700px){.card-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.card-split .card-text{display:flex;flex-direction:column;gap:12px}
.card-tint{background:var(--secondary-c);color:var(--on-secondary-c)}
.card-tint p{color:inherit;max-width:48em}
.card-tint a{color:inherit;font-weight:500}
.card-dashed{border:1px dashed var(--outline);justify-content:center}
.card-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pro{font-size:12px;font-weight:600;letter-spacing:.04em;background:var(--secondary-c);color:var(--on-secondary-c);border-radius:6px;padding:2px 8px}
.shot{max-height:300px;overflow:hidden;border-radius:16px;margin-top:8px;box-shadow:0 8px 24px rgba(var(--shadow),.1)}
.card-split .shot{max-height:360px;margin-top:0;border-radius:20px}
.pair{display:flex;gap:16px 24px;align-items:center;margin-top:8px;flex-wrap:wrap}
.pair-item{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--on-surface-var)}
.checks{display:flex;flex-direction:column;gap:10px;font-size:15px;color:var(--on-surface);margin-top:8px}
.checks li{display:flex;gap:12px;align-items:flex-start}
.checks li::before{content:"";flex:none;width:20px;height:20px;border-radius:50%;border:2px solid var(--on-surface-var);margin-top:2px}
.checks li.warn::before{border-color:var(--error)}
.dots{display:flex;flex-direction:column;gap:8px;font-size:15px;color:var(--on-surface-var);margin-top:4px}
.dots li{display:flex;gap:10px;align-items:baseline}
.dots li::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--primary);transform:translateY(-1px)}

/* 磁贴与小部件示意（按真实画面重画：醒着时 4×1 小部件没有按钮） */
.qs{margin-top:8px;background:#1C2024;border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:14px}
.qs-tile{background:#C9E7E6;color:#051F1F;border-radius:999px;padding:10px 16px 10px 12px;display:flex;align-items:center;gap:12px;font-size:14px;line-height:1.25;max-width:260px}
.qs-tile .ic{flex:none;width:28px;height:28px;border-radius:50%;background:#006A6A;position:relative}
.qs-tile .ic::after{content:"";position:absolute;left:8px;top:7px;width:10px;height:10px;border-radius:50%;background:#C9E7E6;box-shadow:3px 3px 0 #8FC9C8}
.qs-tile b{display:block;font-weight:600}
.qs-tile span{font-size:12px;opacity:.85}
.widget{background:#EFF5F4;border-radius:22px;padding:12px 14px;display:flex;align-items:center;gap:12px;overflow:hidden}
.widget .lead-dot{flex:none;width:14px;height:14px;border-radius:50%;background:#006A6A;box-shadow:3px 3px 0 #A9C7C6;margin-right:2px}
.widget .clone{width:38px;height:38px}
.widget .clone::before{left:5px;top:5px;width:33px;height:33px;border-radius:9px;background:#D7C4FF}
.widget .clone .ico{width:33px;height:33px;border-radius:9px}
.widget .clone .ico::after{transform:scale(.8)}
.widget .clone::after{width:16px;height:16px;right:-2px;bottom:-2px;background-image:url("/assets/icons/badge_clone_light.3be9564715.svg");box-shadow:0 0 0 2px #EFF5F4}
.qs-caption{font-size:12px;color:#C4CBCB}

/* ===== 速览 ===== */
.glance{border:1px solid var(--outline-var);border-radius:var(--r-card);padding:clamp(22px,3vw,36px)}
.glance h2{margin-bottom:16px}
.glance dl{display:grid;grid-template-columns:1fr;gap:0 40px}
@media (min-width:860px){.glance dl{grid-template-columns:repeat(2,minmax(0,1fr))}}
.glance dl>div{display:grid;grid-template-columns:7.5em minmax(0,1fr);gap:12px;padding:12px 0;border-top:1px solid var(--outline-var)}
:lang(de) .glance dl>div,:lang(fr) .glance dl>div,:lang(it) .glance dl>div,:lang(es) .glance dl>div{grid-template-columns:9.5em minmax(0,1fr)}
@media (max-width:479px){.glance dl>div{grid-template-columns:1fr;gap:2px}}
.glance dt{font-weight:600;color:var(--on-surface)}
.glance dd{color:var(--on-surface-var)}

/* ===== 比较 ===== */
.compare th.ours,.compare td.ours{background:var(--secondary-c);color:var(--on-secondary-c)}
.compare tbody th{width:18%}
@media (min-width:640px){.compare td,.compare thead th{width:27%}}
@media (max-width:639px){.compare td.ours{padding:8px 12px;border-radius:10px;margin-left:-12px;margin-right:-12px}.compare td.ours::before{color:inherit}}

/* ===== 三步 ===== */
.steps{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:860px){.steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
.steps li{background:var(--surface);border-radius:var(--r-card);padding:28px;display:flex;flex-direction:column;gap:12px}
.step-n{width:40px;height:40px;border-radius:50%;background:var(--primary);color:var(--on-primary);display:grid;place-items:center;font-weight:600;font-size:18px}
.steps h3{font-size:20px;font-weight:600;line-height:1.3;margin-top:8px}
.steps p{color:var(--on-surface-var)}
.step-links{display:flex;gap:4px 18px;flex-wrap:wrap;margin-top:auto;padding-top:8px;font-size:15px;font-weight:500}
.step-links a{text-decoration:none;padding:6px 0}
.step-links a:hover{text-decoration:underline}

/* ===== 免费与 Pro ===== */
.plans{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:700px){.plans{grid-template-columns:repeat(2,minmax(0,1fr))}}
.plan{border:1px solid var(--outline-var);border-radius:var(--r-card);padding:clamp(22px,3vw,32px);display:flex;flex-direction:column;gap:16px}
.plan h3{font-size:24px;font-weight:600}
.plan ul{display:flex;flex-direction:column;gap:8px}
.plan li{display:flex;gap:12px}
.plan li::before{content:"✓";font-weight:700;color:var(--primary)}
.plan-pro{background:var(--primary);color:var(--on-primary);border-color:transparent}
.plan-pro li::before{color:inherit}
.plan-sub{display:block;font-size:15px;margin-top:2px}
.note{margin-top:20px;color:var(--on-surface-var);font-size:15px;max-width:60em}

/* ===== 使用条件 ===== */
.req{background:var(--warning-c);color:var(--on-warning-c);border-radius:var(--r-hero);padding:clamp(24px,4vw,48px);display:grid;grid-template-columns:1fr;gap:clamp(24px,4vw,48px);scroll-margin-top:16px}
@media (min-width:860px){.req{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)}}
.req h2{margin:0}
.req p{font-size:17px;max-width:24em;margin-top:12px}
.req ul{display:flex;flex-direction:column;gap:16px;line-height:1.55;counter-reset:req}
.req li{display:flex;gap:14px;align-items:flex-start;counter-increment:req}
.req li::before{content:counter(req);flex:none;width:28px;height:28px;border-radius:50%;background:var(--on-warning-c);color:var(--warning-c);display:grid;place-items:center;font-size:14px;font-weight:700}
.req a{color:inherit}

/* ===== 首页常见问题摘录 ===== */
.faq-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px 16px;flex-wrap:wrap;margin-bottom:24px}
.faq-head h2{margin:0}
.faq-head a{font-weight:500;text-decoration:none;padding:6px 0}
.faq-head a:hover{text-decoration:underline}
.faq-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:700px){.faq-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.faq-grid a{text-decoration:none;color:var(--on-surface);background:var(--surface-low);border-radius:18px;padding:20px 22px;font-size:17px;font-weight:500;display:flex;justify-content:space-between;gap:12px}
.faq-grid a::after{content:"→";color:var(--primary)}
.faq-grid a:hover{background:var(--surface-c)}

/* ===== 无障碍 ===== */
:focus-visible{outline:3px solid var(--primary);outline-offset:2px;border-radius:4px}
.hero :focus-visible{outline-color:var(--hero-fg)}
.plan-pro :focus-visible,.req :focus-visible{outline-color:currentColor}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

/* ===== 内页：常见问题 / 隐私政策 / 使用条款 / 404 ===== */
.page{padding-top:clamp(8px,3vw,32px);padding-bottom:clamp(48px,7vw,96px);display:flex;flex-direction:column;gap:clamp(28px,4vw,48px)}
.page-head{background:var(--secondary-c);color:var(--on-secondary-c);border-radius:var(--r-hero);padding:clamp(24px,4vw,56px);display:flex;flex-direction:column;gap:14px}
.page-head h1{font-size:clamp(30px,4vw,52px);font-weight:600;line-height:1.2}
.page-head p{font-size:17px;max-width:46em}
.page-head .small{font-size:14px}
.page-head.plain{background:none;color:inherit;padding:0;max-width:760px;gap:12px}
.page-head .meta{display:flex;gap:6px 24px;flex-wrap:wrap;font-size:15px;color:var(--on-surface-var)}
.page-head .meta strong{color:var(--on-surface);font-weight:600;margin-right:.5em}
.two-col{display:grid;grid-template-columns:1fr;gap:clamp(24px,4vw,48px);align-items:start}
@media (min-width:900px){.two-col{grid-template-columns:240px minmax(0,1fr)}}
.side-nav{display:flex;flex-direction:column;gap:2px;font-size:15px;font-weight:500}
@media (min-width:900px){.side-nav{position:sticky;top:16px;max-height:calc(100vh - 32px);overflow:auto}}
.side-nav a{text-decoration:none;color:var(--on-surface-var);padding:8px 12px;border-radius:10px;display:flex;gap:10px}
.side-nav a:hover{background:var(--surface-c);color:var(--on-surface)}
.side-nav h2{font-size:13px;font-weight:600;letter-spacing:.04em;color:var(--on-surface-var);padding:0 12px 6px}
.side-nav ul{display:flex;flex-direction:column;gap:2px}
@media (max-width:899px){
  .side-nav.groups ul{flex-direction:row;flex-wrap:wrap;gap:8px}
  .side-nav.groups h2{padding:0 0 8px}
  .side-nav.groups a{border:1px solid var(--outline-var);border-radius:999px;padding:6px 12px;font-size:14px}
}
.content{min-width:0;display:flex;flex-direction:column;gap:44px}

/* 常见问题 */
.faq-group{display:flex;flex-direction:column;gap:10px;scroll-margin-top:16px}
.faq-group>h2{font-size:22px;font-weight:600;color:var(--primary);margin-bottom:8px}
.qa{background:var(--surface-low);border-radius:18px;scroll-margin-top:16px}
.qa-key{border:2px solid var(--secondary-c)}
.qa summary{list-style:none;cursor:pointer;padding:18px 22px;font-size:17px;font-weight:500;display:flex;justify-content:space-between;gap:12px;align-items:center;border-radius:18px}
.qa summary::-webkit-details-marker{display:none}
.qa summary h3{font:inherit;margin:0}
.chev{flex:none;width:12px;height:12px;border-right:2px solid var(--primary);border-bottom:2px solid var(--primary);transform:translateY(-3px) rotate(45deg);transition:transform .2s}
.qa[open] .chev{transform:translateY(3px) rotate(225deg)}
.qa-a{padding:0 22px 20px;color:var(--on-surface-var);font-size:16px;display:flex;flex-direction:column;gap:10px}
.qa-a strong{color:var(--on-surface);font-weight:600}
.qa-a .lead{color:var(--on-surface);font-weight:500}
.qa-a .permalink{font-size:14px;align-self:flex-start;text-decoration:none}
.qa-a .permalink:hover{text-decoration:underline}
.bullets{padding-left:20px;list-style:disc;display:flex;flex-direction:column;gap:6px}
ol.bullets{list-style:decimal}
.shizuku-steps{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:640px){.shizuku-steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
.shizuku-steps li{background:var(--surface);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:12px;color:var(--on-surface)}
.ill{height:96px;border-radius:10px;background:var(--surface-c);display:flex;flex-direction:column;justify-content:center;gap:8px;padding:0 16px}
.ill .bar{height:8px;border-radius:4px;background:var(--outline-var)}
.ill .bar.dark{background:var(--on-surface-var)}
.ill .w60{width:60%}.ill .w55{width:55%}.ill .w50{width:50%}.ill .w40{width:40%}.ill .w35{width:35%}
.ill .between{display:flex;justify-content:space-between;align-items:center}
.ill .tog{width:40px;height:24px;border-radius:999px;background:var(--primary);position:relative}
.ill .tog::after{content:"";position:absolute;right:3px;top:3px;width:18px;height:18px;border-radius:50%;background:var(--on-primary)}
.ill-2{align-items:center}
.ill .code{display:flex;gap:4px}
.ill .code span{width:18px;height:26px;border-radius:5px;background:var(--on-surface-var)}
.ill-3{flex-direction:row;align-items:center;gap:12px}
.ill .ok{flex:none;width:28px;height:28px;border-radius:50%;background:var(--success);position:relative}
.ill .ok::after{content:"";position:absolute;left:10px;top:6px;width:6px;height:12px;border-right:3px solid var(--surface);border-bottom:3px solid var(--surface);transform:rotate(45deg)}
.ill .lines{display:flex;flex-direction:column;gap:8px;flex:1}
.faq-feedback{background:var(--secondary-c);color:var(--on-secondary-c);border-radius:var(--r-card);padding:clamp(22px,3vw,32px);display:flex;flex-direction:column;gap:8px;scroll-margin-top:16px}
.faq-feedback h2{font-size:22px;font-weight:600}
.faq-feedback a{color:inherit;font-weight:500}

/* 隐私政策 / 使用条款 */
.toc details{background:var(--surface-low);border-radius:16px}
.toc summary{list-style:none;cursor:pointer;padding:14px 18px;font-size:14px;font-weight:600;color:var(--on-surface-var);letter-spacing:.04em;border-radius:16px}
.toc summary::-webkit-details-marker{display:none}
.toc ol{padding:0 8px 10px;display:flex;flex-direction:column;gap:2px;font-size:14px}
.toc a span{color:var(--primary);font-variant-numeric:tabular-nums;min-width:1.6em}
.prose{max-width:720px;font-size:16px;line-height:1.7;gap:40px}
.prose section{display:flex;flex-direction:column;gap:12px;scroll-margin-top:16px}
.prose h2{font-size:22px;font-weight:600;line-height:1.35}
.prose p,.prose .bullets{color:var(--on-surface-var)}
.prose strong{color:var(--on-surface)}
.prose code{font-size:.92em;background:var(--surface-c);border-radius:4px;padding:1px 5px;overflow-wrap:anywhere}
.prose .intro p{color:var(--on-surface)}
.summary-box{background:var(--primary-c);color:var(--on-primary-c);border-radius:var(--r-card);padding:clamp(22px,3vw,32px)}
.summary-box .bullets,.summary-box p,.summary-box strong{color:inherit}
.prose .address{color:var(--on-surface);font-style:normal}
.prose .last{border-top:1px solid var(--outline-var);padding-top:24px}
/* 第 3 节对照表：宽屏是表格，窄屏每行拆成一块 */
.data-table{width:100%;border-collapse:separate;border-spacing:0;font-size:15px;line-height:1.6;background:var(--surface-low);border-radius:18px;overflow:hidden}
.data-table th,.data-table td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid var(--outline-var)}
.data-table tr:last-child>*{border-bottom:0}
.data-table thead th{background:var(--surface-high);color:var(--on-surface);font-weight:600}
.data-table tbody th{color:var(--on-surface);font-weight:600;width:22%}
.data-table td{color:var(--on-surface-var)}
@media (max-width:639px){
  .data-table,.data-table tbody,.data-table tr,.data-table th,.data-table td{display:block;width:auto}
  .data-table thead{display:none}
  .data-table tr{padding:14px 16px;border-bottom:1px solid var(--outline-var)}
  .data-table tbody th,.data-table td{border:0;padding:0}
  .data-table tbody th{margin-bottom:6px;width:auto}
  .data-table td+td{margin-top:8px}
  .data-table td::before{content:attr(data-label);display:block;font-size:13px;font-weight:600;color:var(--primary)}
}
@media print{.site-header,.site-footer,.side-nav,.skip{display:none}.two-col{display:block}}

/* 404 */
.notfound{min-height:60vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:20px;padding-top:clamp(32px,6vw,80px);padding-bottom:clamp(32px,6vw,80px)}
.ghost-icon{position:relative;width:104px;height:104px;margin-bottom:8px}
.ghost-icon .g{position:absolute;left:12px;top:12px;width:88px;height:88px;border-radius:22px;background:var(--ghost)}
.ghost-icon .o{position:absolute;left:0;top:0;width:88px;height:88px;border-radius:22px;border:2px dashed var(--outline)}
.ghost-icon .b{position:absolute;right:0;bottom:0;width:36px;height:36px;border-radius:50%;background:var(--badge) center/contain no-repeat;box-shadow:0 0 0 3px var(--surface)}
.notfound .code{font-size:14px;font-weight:600;letter-spacing:.08em;color:var(--on-surface-var)}
.notfound h1{font-size:clamp(28px,4vw,44px);font-weight:600;line-height:1.2}
.notfound p{color:var(--on-surface-var);max-width:32em}
.notfound .links{display:flex;gap:12px 20px;flex-wrap:wrap;justify-content:center;align-items:center}
.btn{display:inline-flex;align-items:center;background:var(--primary);color:var(--on-primary);text-decoration:none;font-weight:500;min-height:48px;padding:0 28px;border-radius:999px}
.btn:hover{color:var(--on-primary)}