/* 主站样式 · 与首启向导同一设计语言(星宇晨) */
:root{
--bgimg:url('assets/bg_light.jpg');--ov:0;--topbg:linear-gradient(to bottom,rgba(234,241,255,.92),rgba(22,100,255,.10));
--card:rgba(255,255,255,.84);--ink:#1f2733;--sub:#667085;--line:#e4e9f2;--pri:#1664ff;--pri-soft:#eaf1ff;--ok:#12b76a;--radius:14px;--sh:0 1px 3px rgba(16,24,40,.06)}
.dark{--bgimg:url('assets/bg_dark.jpg');--ov:.35;--topbg:linear-gradient(to bottom,rgba(20,32,54,.92),rgba(22,100,255,.30));
--card:rgba(24,32,46,.78);--ink:#e6ebf5;--sub:#8b95a8;--line:rgba(255,255,255,.09);--pri:#4d8bff;--pri-soft:#1c2b45;--ok:#2fd389;--sh:0 1px 4px rgba(0,0,0,.4)}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"PingFang SC","Microsoft YaHei",sans-serif;font-size:17px;
background:var(--bgimg) center/cover fixed;position:relative;color:var(--ink);line-height:1.7}
body::before{content:"";position:fixed;inset:0;background:#fff;opacity:calc(var(--ov)*.6);pointer-events:none}
.dark body::before,body.dark::before{background:#0b1220}
.wrap{max-width:960px;margin:0 auto;padding:0 20px 60px;position:relative;z-index:1}
.top{position:sticky;top:0;z-index:2;background:var(--topbg);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top .in{max-width:960px;margin:0 auto;padding:10px 20px;display:flex;align-items:center;gap:14px}
.top img.logo{width:44px;height:44px;border-radius:11px;object-fit:cover;background:#fff;box-shadow:0 1px 4px rgba(16,24,40,.14);flex:none}
.top .name{font-weight:700;font-size:1.15rem}
.top .name small{display:block;font-weight:400;color:var(--sub);font-size:.78rem}
.top nav{margin-left:auto;display:flex;gap:4px}
.top nav a{color:var(--ink);text-decoration:none;padding:8px 15px;border-radius:9px;font-size:1rem}
.top nav a.on,.top nav a:hover{background:var(--pri-soft);color:var(--pri);font-weight:600}
.tbtn{margin-left:8px;background:var(--card);border:1px solid var(--line);color:var(--ink);border-radius:9px;padding:7px 12px;cursor:pointer;font-size:.85rem}
h1{font-size:1.9rem;margin:.5em 0 .2em}
h2{font-size:1.2rem;margin-top:1.8em;border-left:4px solid var(--pri);padding-left:10px}
.sub{color:var(--sub);font-size:1rem;line-height:1.7}
.hero{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--sh);padding:26px;margin:20px 0;backdrop-filter:blur(4px)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--sh);padding:18px;font-size:1rem;line-height:1.6}
.tag{display:inline-block;font-size:.75rem;background:var(--pri-soft);color:var(--pri);border-radius:99px;padding:2px 10px;margin-bottom:8px}
.btn{display:inline-block;background:var(--pri);color:#fff;font-weight:700;text-decoration:none;border-radius:9px;padding:10px 22px;margin:8px 8px 0 0;border:none;cursor:pointer;font-size:.95rem}
.btn.ghost{background:transparent;border:1px solid var(--pri);color:var(--pri)}
table{width:100%;border-collapse:collapse;font-size:1rem;background:var(--card);border-radius:var(--radius);overflow:hidden}
td,th{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left}
th{color:var(--sub);font-weight:600;background:var(--pri-soft)}
.tabs{display:flex;gap:8px;margin:16px 0}
.tab{padding:8px 16px;border-radius:9px;background:var(--card);border:1px solid var(--line);cursor:pointer;color:var(--sub)}
.tab.on{color:var(--pri);background:var(--pri-soft);border-color:var(--pri);font-weight:700}
.pane{display:none;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--sh);padding:18px}
.pane.on{display:block}
input[type=text],input[type=email]{width:100%;background:var(--card);border:1px solid var(--line);color:var(--ink);border-radius:9px;padding:10px 12px}
.log,.chat{background:rgba(10,15,26,.85);border:1px solid var(--line);border-radius:10px;padding:14px;font-family:ui-monospace,Consolas,monospace;font-size:.85rem;white-space:pre-wrap;min-height:100px;color:var(--ok)}
.chat b{color:#4d8bff}
label{display:block;margin:14px 0 4px;font-size:.9rem;color:var(--sub)}
.res{margin-top:18px;background:var(--pri-soft);border:1px solid var(--line);border-radius:10px;padding:14px;font-size:.9rem;display:none}
.res .code{font-family:ui-monospace,Consolas,monospace;font-size:1.2rem;color:var(--ok);letter-spacing:2px;margin-top:6px;word-break:break-all}
.res.err{color:#c53030}
.foot{margin-top:3em;text-align:center;color:var(--sub);font-size:.95rem}

/* 四特色 · 醒目大字 */
.quad{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:6px 0}
@media(max-width:720px){.quad{grid-template-columns:repeat(2,1fr)}}
.q{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--sh);padding:20px 14px;text-align:center;position:relative;overflow:hidden}
.q::before{content:attr(data-n);position:absolute;top:8px;left:12px;font-size:.85rem;font-weight:800;color:var(--pri);opacity:.85}
.q .big{font-size:1.75rem;font-weight:800;letter-spacing:.04em;color:var(--pri);line-height:1.2;margin-top:6px}
.dark .q .big{color:#7db2ff}
.q .cap{color:var(--sub);font-size:1rem;margin-top:8px;line-height:1.55}
.quad-label{font-size:.8rem;letter-spacing:.28em;color:var(--sub);text-transform:uppercase;margin:22px 0 4px}

.free-note{color:var(--ok);font-weight:700;font-size:1.05rem}
.dark .free-note{color:#2fd389}

/* 霞鹜975圆体 · 只用于大标题/大特色词/品牌名(外圆不细, 开源可商用) */
@font-face{font-family:'975Yuan';src:url('/assets/975yuan-700.ttf') format('truetype');font-weight:700;font-display:swap}
h1,.q .big,.top .name{font-family:'975Yuan',system-ui,-apple-system,sans-serif;font-weight:700}

/* 手机端(≤720px): 顶栏/Tab/输入/按钮 适配 */
@media(max-width:720px){
 .top .in{padding:8px 12px;flex-wrap:wrap;gap:8px}
 .top .name small{display:none}
 .top img.logo{width:36px;height:36px}
 .top nav a{padding:6px 10px;font-size:.95rem}
 .wrap{padding:0 12px 50px}
 .hero{padding:18px}
 .hero .btn{display:block;margin:8px auto 0;min-width:180px}
 .hero a.btn.ghost{margin-top:10px}
 .tabs{flex-wrap:wrap;gap:8px}
 .tab{flex:1 1 100%;text-align:center}
 .tab+.tab{border-top:1px solid var(--line)}
 .chat input,.chat input[type=text]{width:100%}
 .card{font-size:.95rem}
 h1{font-size:2rem}
 h2{font-size:1.35rem}
}