/* 模板: 同一套内容/交互, 换皮。html[data-theme] = neon(默认, 出海匠风) | apple | linear | stripe */

/* ================= 苹果风: 白/黑交替, 超大字, 留白, 蓝色胶囊 ================= */
html[data-theme="apple"] {
  --bg: #fbfbfd; --bg2: #ffffff; --panel: #ffffff; --ink: #1d1d1f; --mute: #6e6e73; --dim: #86868b;
  --line: rgba(0, 0, 0, .08); --line2: rgba(0, 0, 0, .12);
  --a1: #0071e3; --a2: #2997ff; --a3: #5e5ce6; --grad: linear-gradient(120deg, #0071e3, #5e5ce6); --ink2: #3a3a3c;
}
html[data-theme="apple"] body { font-family: -apple-system, "SF Pro Display", "SF Pro Text", "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif; letter-spacing: -.01em; }
html[data-theme="apple"] .aurora, html[data-theme="apple"] .gridbg, html[data-theme="apple"] .cursor-light, html[data-theme="apple"] #stars { display: none; }
html[data-theme="apple"] .grad { animation: none; background: linear-gradient(90deg, #0071e3, #5e5ce6 60%, #bf5af2); -webkit-background-clip: text; background-clip: text; }
html[data-theme="apple"] .eyebrow { color: #bf5af2; letter-spacing: .02em; text-transform: none; font-size: 15px; font-weight: 600; }
html[data-theme="apple"] .hero h1, html[data-theme="apple"] .head h2, html[data-theme="apple"] .page-hero h1 { font-weight: 700; letter-spacing: -.035em; }
html[data-theme="apple"] .hero h1 { font-size: clamp(48px, 8.4vw, 96px); }
html[data-theme="apple"] .head h2 { font-size: clamp(36px, 5.6vw, 64px); }
html[data-theme="apple"] .btn.primary { background: #0071e3; box-shadow: none; }
html[data-theme="apple"] .btn.primary::after { display: none; }
html[data-theme="apple"] .btn.primary:hover { background: #0077ed; box-shadow: none; }
html[data-theme="apple"] .btn.ghost { background: transparent; border: 0; color: #0066cc; backdrop-filter: none; }
html[data-theme="apple"] .btn.ghost:hover { text-decoration: underline; background: transparent; }
html[data-theme="apple"] .top.scrolled .bar, html[data-theme="apple"] .bar { background: rgba(251, 251, 253, .8); border-color: transparent; border-radius: 0; max-width: none; height: 52px; backdrop-filter: saturate(180%) blur(20px); box-shadow: 0 1px 0 rgba(0, 0, 0, .06); }
html[data-theme="apple"] .top { top: 0; padding: 0; }
html[data-theme="apple"] .nav a { color: #1d1d1f; opacity: .8; } html[data-theme="apple"] .nav a:hover { background: none; opacity: 1; }
html[data-theme="apple"] .nav a.on::after { background: #1d1d1f; }
html[data-theme="apple"] .brand { background: transparent; }
html[data-theme="apple"] .hero .tag, html[data-theme="apple"] .agent, html[data-theme="apple"] .badge, html[data-theme="apple"] .tabs button, html[data-theme="apple"] .marquee .chip { background: #fff; border-color: rgba(0, 0, 0, .08); color: #1d1d1f; box-shadow: 0 2px 10px rgba(0, 0, 0, .04); }
html[data-theme="apple"] .agent:hover, html[data-theme="apple"] .agent.on, html[data-theme="apple"] .tabs button.on { background: #1d1d1f; color: #fff; border-color: #1d1d1f; box-shadow: none; }
html[data-theme="apple"] .ask { background: #fff; border-color: rgba(0, 0, 0, .1); box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .25); }
html[data-theme="apple"] .ask::before { display: none; }
html[data-theme="apple"] .ask .typed { color: #1d1d1f; }
html[data-theme="apple"] .ask .go { background: #0071e3; color: #fff; }
html[data-theme="apple"] .caret { background: #0071e3; }
/* 产品大屏: 不倾斜, 跟着滚动从 0.82 放大到 1(苹果产品页那种) */
html[data-theme="apple"] .window { transform: scale(var(--sc2, .82)); }
html[data-theme="apple"] .window::before { display: none; }
html[data-theme="apple"] .window .rim { background: #1d1d1f; padding: 10px; border-radius: 30px; }
html[data-theme="apple"] .window .inner { border-radius: 20px; }
html[data-theme="apple"] .chrome { background: #f5f5f7; border-color: rgba(0, 0, 0, .06); }
html[data-theme="apple"] .chat { background: rgba(255, 255, 255, .88); color: #1d1d1f; border-color: rgba(0, 0, 0, .08); }
html[data-theme="apple"] .msg.bot { background: #f5f5f7; color: #1d1d1f; } html[data-theme="apple"] .msg.tool { color: #6e6e73; border-color: rgba(0, 0, 0, .12); }
html[data-theme="apple"] .msg.card { background: #f0faf4; border-color: #b7e4c7; color: #1d4d33; } html[data-theme="apple"] .msg.card b { color: #0b3d21; }
/* 区块黑白交替 */
html[data-theme="apple"] main > section.dark { background: #000; color: #f5f5f7; --ink: #f5f5f7; --ink2: #d2d2d7; --mute: #a1a1a6; --dim: #86868b; --line: rgba(255, 255, 255, .1); --line2: rgba(255, 255, 255, .16); }
html[data-theme="apple"] main > section.dark.wrap { max-width: none; padding-left: max(24px, calc((100vw - 1200px) / 2 + 24px)); padding-right: max(24px, calc((100vw - 1200px) / 2 + 24px)); }
html[data-theme="apple"] .spot { background: #fff; border-color: transparent; box-shadow: 0 4px 24px rgba(0, 0, 0, .06); border-radius: 28px; }
html[data-theme="apple"] main > section.dark .spot { background: #1d1d1f; box-shadow: none; }
html[data-theme="apple"] .spot::before { background: radial-gradient(420px circle at var(--x, -999px) var(--y, -999px), rgba(0, 113, 227, .08), transparent 40%); }
html[data-theme="apple"] .spot::after { display: none; }
html[data-theme="apple"] .demo { background: #f5f5f7; border-color: transparent; box-shadow: 0 30px 80px -40px rgba(0, 0, 0, .3); }
html[data-theme="apple"] .float { background: rgba(255, 255, 255, .92); border-color: rgba(0, 0, 0, .06); color: #1d1d1f; }
html[data-theme="apple"] .rule .line, html[data-theme="apple"] .item, html[data-theme="apple"] .kpi, html[data-theme="apple"] .chart { background: #fff; border-color: rgba(0, 0, 0, .06); }
html[data-theme="apple"] .rule .kw { color: #0071e3; } html[data-theme="apple"] .rule .act { color: #bf5af2; }
html[data-theme="apple"] .cond { border-color: rgba(0, 0, 0, .08); }
html[data-theme="apple"] .cond.ok { color: #1d4d33; background: #f0faf4; }
html[data-theme="apple"] .item .th { background: linear-gradient(135deg, #d2d2d7, #e8e8ed); }
html[data-theme="apple"] .vs .good { background: #fff; }
html[data-theme="apple"] .ring { background: #1d1d1f; color: #f5f5f7; --ink: #f5f5f7; --ink2: #d2d2d7; --mute: #a1a1a6; } html[data-theme="apple"] .ring::before { background: none; }
html[data-theme="apple"] .ring .spot { background: #2c2c2e; box-shadow: none; }
html[data-theme="apple"] .switch .opt.on { background: #fff; border-color: transparent; box-shadow: 0 4px 24px rgba(0, 0, 0, .08); }
html[data-theme="apple"] .switch .opt { border-color: transparent; }
html[data-theme="apple"] .prod .tag { background: #f5f5f7; color: #1d1d1f; }
html[data-theme="apple"] main > section.dark .prod .tag { background: #2c2c2e; color: #f5f5f7; }
html[data-theme="apple"] .menu, html[data-theme="apple"] .mnav { background: rgba(255, 255, 255, .96); border-color: rgba(0, 0, 0, .08); color: #1d1d1f; }
html[data-theme="apple"] footer { background: #f5f5f7; border-color: rgba(0, 0, 0, .08); }
html[data-theme="apple"] .foot h4 { color: #1d1d1f; }
html[data-theme="apple"] .notice { background: #f5f0ff; border-color: #d9c8ff; }
html[data-theme="apple"] .pic { background: #fff; border-color: transparent; box-shadow: 0 20px 60px -30px rgba(0, 0, 0, .25); }
html[data-theme="apple"] [data-reveal] { filter: none; transform: translateY(40px); transition-duration: 1.1s; }
html[data-theme="apple"] [data-reveal].in { transform: none; }
html[data-theme="apple"] .burger { border-color: rgba(0, 0, 0, .15); color: #1d1d1f; }

/* ================= Linear / Vercel 风: 纯黑, 细线网格, 光束, 等宽字 ================= */
html[data-theme="linear"] {
  --bg: #000; --bg2: #050505; --panel: #0a0a0a; --ink: #ededed; --mute: #8f8f8f; --dim: #5e5e5e;
  --line: rgba(255, 255, 255, .07); --line2: rgba(255, 255, 255, .12); --ink2: #c9c9c9;
  --a1: #ffffff; --a2: #a5b4fc; --a3: #67e8f9; --grad: linear-gradient(120deg, #fff, #a5b4fc 50%, #67e8f9);
}
html[data-theme="linear"] body { font-family: "Inter", "Geist", -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; }
html[data-theme="linear"] .aurora i { background: #1e1b4b !important; opacity: .35; }
html[data-theme="linear"] .aurora i:nth-child(n+2) { display: none; }
html[data-theme="linear"] .gridbg { background-size: 48px 48px; opacity: .9; mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, #000 20%, transparent 70%); }
html[data-theme="linear"] .cursor-light { background: radial-gradient(500px circle at var(--mx) var(--my), rgba(165, 180, 252, .07), transparent 45%); }
html[data-theme="linear"] .eyebrow { color: #a5b4fc; font-family: ui-monospace, "Geist Mono", Consolas, monospace; letter-spacing: .08em; font-weight: 500; }
html[data-theme="linear"] .hero h1, html[data-theme="linear"] .head h2, html[data-theme="linear"] .page-hero h1 { background: linear-gradient(180deg, #fff 30%, rgba(255, 255, 255, .55)); -webkit-background-clip: text; background-clip: text; color: transparent; font-weight: 600; letter-spacing: -.04em; }
html[data-theme="linear"] .head h2 .grad, html[data-theme="linear"] .hero h1 .grad { -webkit-text-fill-color: transparent; }
html[data-theme="linear"] .btn { border-radius: 10px; }
html[data-theme="linear"] .btn.primary { background: #ededed; color: #000; box-shadow: 0 0 0 1px rgba(255, 255, 255, .2), 0 8px 30px -10px rgba(165, 180, 252, .6); }
html[data-theme="linear"] .btn.primary::after { background: linear-gradient(110deg, transparent 30%, rgba(165, 180, 252, .5) 50%, transparent 70%); }
html[data-theme="linear"] .btn.ghost { border-radius: 10px; background: #0a0a0a; }
html[data-theme="linear"] .spot { background: #0a0a0a; border-color: var(--line2); border-radius: 14px; }
html[data-theme="linear"] .spot::after { background: radial-gradient(260px circle at var(--x, -999px) var(--y, -999px), rgba(165, 180, 252, .9), transparent 45%); }
html[data-theme="linear"] .spot::before { background: radial-gradient(380px circle at var(--x, -999px) var(--y, -999px), rgba(165, 180, 252, .08), transparent 40%); }
html[data-theme="linear"] .ask, html[data-theme="linear"] .demo, html[data-theme="linear"] .float, html[data-theme="linear"] .chat, html[data-theme="linear"] .menu { border-radius: 14px; background: rgba(10, 10, 10, .9); }
html[data-theme="linear"] .ask::before { background: conic-gradient(from var(--ang, 0deg), transparent 0 70%, #a5b4fc, #67e8f9, transparent 95%); }
html[data-theme="linear"] .ask .go { border-radius: 8px; }
html[data-theme="linear"] .agent, html[data-theme="linear"] .tabs button, html[data-theme="linear"] .hero .tag, html[data-theme="linear"] .badge, html[data-theme="linear"] .marquee .chip { border-radius: 8px; font-family: ui-monospace, "Geist Mono", Consolas, monospace; font-size: 12px; }
html[data-theme="linear"] .agent .av, html[data-theme="linear"] .hero .tag b, html[data-theme="linear"] .badge .av { background: #1f1f1f; border: 1px solid var(--line2); border-radius: 6px; }
html[data-theme="linear"] .agent:hover, html[data-theme="linear"] .agent.on, html[data-theme="linear"] .tabs button.on { background: #111; border-color: rgba(165, 180, 252, .5); box-shadow: 0 0 20px -6px rgba(165, 180, 252, .6); }
html[data-theme="linear"] .window .rim { background: linear-gradient(180deg, rgba(255, 255, 255, .25), rgba(255, 255, 255, .02)); border-radius: 14px; }
html[data-theme="linear"] .window .inner, html[data-theme="linear"] .window { border-radius: 13px; }
html[data-theme="linear"] .window::before { background: radial-gradient(closest-side, rgba(165, 180, 252, .35), transparent); }
/* 光束: 首屏顶上一道竖光 */
html[data-theme="linear"] .hero::before { content: ""; position: absolute; left: 50%; top: 0; width: 1px; height: 140px; background: linear-gradient(180deg, transparent, #a5b4fc, transparent); box-shadow: 0 0 30px 6px rgba(165, 180, 252, .35); animation: beam 3.2s ease-in-out infinite; }
@keyframes beam { 0%, 100% { opacity: .3; transform: scaleY(.6); } 50% { opacity: 1; transform: scaleY(1); } }
html[data-theme="linear"] .ring { border-radius: 16px; background: #0a0a0a; }
html[data-theme="linear"] .ring::before { background: conic-gradient(from var(--ang, 0deg), transparent 0 75%, #a5b4fc, #67e8f9, transparent); }
html[data-theme="linear"] .checks li::before { background: #a5b4fc; }
html[data-theme="linear"] .msg.me { background: #ededed; color: #000; }
html[data-theme="linear"] .bento .ico { background: #111; border-color: var(--line2); border-radius: 10px; }
html[data-theme="linear"] .vs .good { background: linear-gradient(160deg, rgba(165, 180, 252, .08), transparent); }

/* ================= Stripe 风: 浅色 + 流动彩色渐变 + 斜切色带 + 柔和阴影 ================= */
html[data-theme="stripe"] {
  --bg: #f6f9fc; --bg2: #ffffff; --panel: #ffffff; --ink: #0a2540; --mute: #425466; --dim: #8898aa;
  --line: rgba(10, 37, 64, .08); --line2: rgba(10, 37, 64, .12);
  --ink2: #31445a; --a1: #635bff; --a2: #a960ee; --a3: #ff6aa1; --grad: linear-gradient(120deg, #635bff, #a960ee 45%, #ff6aa1 80%, #ffcb57);
}
html[data-theme="stripe"] body { font-family: "Sohne", -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; }
html[data-theme="stripe"] .aurora, html[data-theme="stripe"] .gridbg, html[data-theme="stripe"] .cursor-light, html[data-theme="stripe"] #stars { display: none; }
/* 首屏斜切的流动渐变色带 */
html[data-theme="stripe"] .hero::before { content: ""; position: absolute; left: -10vw; right: -10vw; top: -40px; height: 760px; z-index: -1; transform: skewY(-8deg); transform-origin: 0 0; background: linear-gradient(120deg, #635bff, #a960ee, #ff6aa1, #ffcb57, #80e9ff, #635bff); background-size: 300% 300%; animation: mesh 14s ease-in-out infinite; }
@keyframes mesh { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
html[data-theme="stripe"] .hero h1, html[data-theme="stripe"] .hero .sub, html[data-theme="stripe"] .hero .eyebrow { color: #fff; text-shadow: 0 2px 30px rgba(10, 37, 64, .25); }
html[data-theme="stripe"] .hero .metrics b, html[data-theme="stripe"] .hero .metrics span { color: #0a2540; }
html[data-theme="stripe"] .eyebrow { color: #635bff; }
html[data-theme="stripe"] .grad { animation: none; }
html[data-theme="stripe"] .hero .tag { background: rgba(255, 255, 255, .25); border-color: rgba(255, 255, 255, .4); color: #fff; }
html[data-theme="stripe"] .ask { background: #fff; border-color: transparent; box-shadow: 0 50px 100px -20px rgba(50, 50, 93, .25), 0 30px 60px -30px rgba(0, 0, 0, .3); }
html[data-theme="stripe"] .ask::before { display: none; }
html[data-theme="stripe"] .ask .typed { color: #0a2540; }
html[data-theme="stripe"] .ask .go { background: #635bff; color: #fff; }
html[data-theme="stripe"] .agent { background: #fff; border-color: transparent; color: #0a2540; box-shadow: 0 6px 16px -6px rgba(50, 50, 93, .25); }
html[data-theme="stripe"] .agent:hover, html[data-theme="stripe"] .agent.on { background: #0a2540; color: #fff; }
html[data-theme="stripe"] .btn.primary { background: #635bff; box-shadow: 0 13px 27px -5px rgba(50, 50, 93, .25), 0 8px 16px -8px rgba(0, 0, 0, .3); }
html[data-theme="stripe"] .btn.ghost { background: #fff; color: #0a2540; border-color: transparent; box-shadow: 0 6px 16px -6px rgba(50, 50, 93, .25); }
html[data-theme="stripe"] .top.scrolled .bar { background: rgba(255, 255, 255, .85); border-color: transparent; box-shadow: 0 10px 30px -12px rgba(50, 50, 93, .25); }
html[data-theme="stripe"] .top:not(.scrolled) .nav a { color: #fff; }
html[data-theme="stripe"] .top.scrolled .nav a { color: #0a2540; }
html[data-theme="stripe"] .nav a.on::after { background: #fff; } html[data-theme="stripe"] .top.scrolled .nav a.on::after { background: #635bff; }
html[data-theme="stripe"] .spot { background: #fff; border-color: transparent; border-radius: 16px; box-shadow: 0 30px 60px -12px rgba(50, 50, 93, .18), 0 18px 36px -18px rgba(0, 0, 0, .2); }
html[data-theme="stripe"] .spot::after { display: none; }
html[data-theme="stripe"] .spot::before { background: radial-gradient(420px circle at var(--x, -999px) var(--y, -999px), rgba(99, 91, 255, .07), transparent 40%); }
html[data-theme="stripe"] .tabs button { background: #fff; border-color: transparent; color: #0a2540; box-shadow: 0 6px 16px -6px rgba(50, 50, 93, .2); }
html[data-theme="stripe"] .tabs button.on { background: #0a2540; color: #fff; }
html[data-theme="stripe"] .window .rim { background: #fff; padding: 6px; border-radius: 18px; box-shadow: 0 50px 100px -20px rgba(50, 50, 93, .3), 0 30px 60px -30px rgba(0, 0, 0, .35); }
html[data-theme="stripe"] .window::before { display: none; }
html[data-theme="stripe"] .chrome { background: #f6f9fc; border-color: var(--line); }
html[data-theme="stripe"] .chat, html[data-theme="stripe"] .float, html[data-theme="stripe"] .menu, html[data-theme="stripe"] .mnav { background: rgba(255, 255, 255, .95); color: #0a2540; border-color: transparent; box-shadow: 0 30px 60px -12px rgba(50, 50, 93, .3); }
html[data-theme="stripe"] .msg.bot { background: #f6f9fc; color: #0a2540; } html[data-theme="stripe"] .msg.tool { color: #425466; border-color: var(--line2); }
html[data-theme="stripe"] .msg.card { background: #effaf4; border-color: #b6ead0; color: #0e4429; } html[data-theme="stripe"] .msg.card b { color: #0a2540; }
html[data-theme="stripe"] .demo { background: #fff; border-color: transparent; box-shadow: 0 50px 100px -20px rgba(50, 50, 93, .25), 0 30px 60px -30px rgba(0, 0, 0, .3); }
html[data-theme="stripe"] .rule .line, html[data-theme="stripe"] .item, html[data-theme="stripe"] .kpi, html[data-theme="stripe"] .chart { background: #f6f9fc; border-color: transparent; }
html[data-theme="stripe"] .rule .kw { color: #635bff; } html[data-theme="stripe"] .rule .act { color: #e5427c; }
html[data-theme="stripe"] .cond { border-color: var(--line2); } html[data-theme="stripe"] .cond.ok { color: #0e4429; }
html[data-theme="stripe"] .item .th { background: linear-gradient(135deg, #c7d2fe, #fbcfe8); }
html[data-theme="stripe"] .ring { background: #0a2540; color: #fff; --mute: #adbdcc; --ink: #fff; --ink2: #d6e0ea; }
html[data-theme="stripe"] .ring .spot { background: #12345a; box-shadow: none; color: #fff; }
html[data-theme="stripe"] .vs .good { background: linear-gradient(160deg, #fff, #f1efff); }
html[data-theme="stripe"] .switch .opt { background: #fff; border-color: transparent; box-shadow: 0 6px 16px -6px rgba(50, 50, 93, .2); }
html[data-theme="stripe"] .switch .opt.on { background: #0a2540; color: #fff; --mute: #adbdcc; }
html[data-theme="stripe"] .pic { background: #fff; border-color: transparent; box-shadow: 0 30px 60px -12px rgba(50, 50, 93, .2); }
html[data-theme="stripe"] .prod .tag { background: #f1efff; color: #635bff; }
html[data-theme="stripe"] .marquee .chip, html[data-theme="stripe"] .badge { background: #fff; border-color: transparent; color: #0a2540; box-shadow: 0 6px 16px -6px rgba(50, 50, 93, .2); }
html[data-theme="stripe"] footer { background: #fff; }
html[data-theme="stripe"] .foot h4 { color: #635bff; }
html[data-theme="stripe"] .notice { background: #f1efff; border-color: #d3ceff; }
html[data-theme="stripe"] .burger { color: #fff; border-color: rgba(255, 255, 255, .5); }
html[data-theme="stripe"] .page-hero h1 { color: #0a2540; }

/* ================= 模板切换器(只在预览里出现) ================= */
.theme-dock { position: fixed; z-index: 60; left: 50%; bottom: 18px; transform: translateX(-50%); display: flex; gap: 4px; padding: 5px; border-radius: 999px; background: rgba(15, 13, 34, .82); border: 1px solid rgba(255, 255, 255, .14); backdrop-filter: blur(16px); box-shadow: 0 20px 50px -15px rgba(0, 0, 0, .6); font: 600 12.5px/1 -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; }
.theme-dock span { padding: 9px 6px 9px 12px; color: rgba(255, 255, 255, .55); }
.theme-dock button { height: 32px; padding: 0 14px; border-radius: 999px; border: 0; background: transparent; color: rgba(255, 255, 255, .85); font: inherit; cursor: pointer; transition: background .2s, color .2s, transform .35s cubic-bezier(.34, 1.56, .64, 1); }
.theme-dock button:hover { background: rgba(255, 255, 255, .08); }
.theme-dock button:active { transform: scale(.92); }
.theme-dock button.on { background: #fff; color: #120f29; }
@media (max-width: 600px) { .theme-dock span { display: none; } .theme-dock button { padding: 0 10px; } }
