/* ── 默认（暗色）── */
:root {
    --bg:     #0a1628;
    --bg1:    #0f2040;
    --bg2:    #162952;
    --bg3:    #1d3566;
    --blue:   #2563eb;
    --blue2:  #3b82f6;
    --blue3:  #60a5fa;
    --blue4:  #93c5fd;
    --cyan2:  #22d3ee;
    --t1:     #f0f6ff;
    --t2:     #b8d0ea;
    --t3:     #7090b4;
    --border: rgba(96,165,250,.12);
    --border2:rgba(96,165,250,.22);
    --r-sm:   8px;
    --r-md:   14px;
    --r-lg:   20px;
    --r-xl:   28px;
    --r-full: 9999px;
    --font:   -apple-system,BlinkMacSystemFont,'PingFang SC','Hiragino Sans GB','Microsoft YaHei','微软雅黑',Arial,sans-serif;
    --serif:  'Songti SC','STSong','SimSun','宋体',Georgia,serif;
}

/* ── 亮色变量（参考 QQ / 微信 / Ant Design，白底深字高对比） ── */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) {
        --bg:     #f5f5f5;
        --bg1:    #ffffff;
        --bg2:    #f0f0f0;
        --bg3:    #d9d9d9;
        --blue:   #1677ff;
        --blue2:  #4096ff;
        --blue3:  #1677ff;
        --blue4:  #0958d9;
        --cyan2:  #0891b2;
        --t1:     #1a1a1a;
        --t2:     #595959;
        --t3:     #8c8c8c;
        --border: #e8e8e8;
        --border2:#d9d9d9;
    }
}

[data-theme="light"] {
    --bg:     #f5f5f5;
    --bg1:    #ffffff;
    --bg2:    #f0f0f0;
    --bg3:    #d9d9d9;
    --blue:   #1677ff;
    --blue2:  #4096ff;
    --blue3:  #1677ff;
    --blue4:  #0958d9;
    --cyan2:  #0891b2;
    --t1:     #1a1a1a;
    --t2:     #595959;
    --t3:     #8c8c8c;
    --border: #e8e8e8;
    --border2:#d9d9d9;
}

/* ── 重置 ── */
*,*::before,*::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; scroll-behavior: smooth; -webkit-font-smoothing: antialiased; }
body { background: var(--bg); color: var(--t1); font-family: var(--font); line-height: 1.65; overflow-x: hidden; min-height: 100vh; transition: background .3s, color .3s; }
a    { color: inherit; text-decoration: none; }
button { border: none; background: none; cursor: pointer; font: inherit; }
input, textarea, select { font: inherit; color: var(--t1); background: transparent; border: none; outline: none; }
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-thumb { background: var(--bg3); border-radius: 2px; }
::selection { background: rgba(37,99,235,.3); color: var(--blue4); }

/* ── 星空画布 ── */
#starfield { position: fixed; inset: 0; pointer-events: none; z-index: 0; }

/* ── 布局容器 ── */
.page      { position: relative; z-index: 1; min-height: 100vh; }
.container { max-width: 760px; margin: 0 auto; padding: 0 20px; }
/* ── 底部提示条 ── */
.notif-bar {
    position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%);
    z-index: 200;
    display: inline-flex; align-items: center; gap: 12px;
    padding: 9px 12px 9px 20px;
    background: rgba(8,14,32,.78); backdrop-filter: blur(14px) saturate(1.4);
    border: 1px solid rgba(99,140,255,.16);
    border-radius: 999px;
    box-shadow: 0 6px 28px rgba(0,0,0,.32), 0 1px 0 rgba(99,140,255,.08) inset;
    max-width: min(460px, calc(100vw - 32px));
    animation: notif-in .45s cubic-bezier(.22,1,.36,1) both;
}
.notif-text {
    color: rgba(180,208,255,.8); font-size: .78rem; letter-spacing: .06em;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    transition: opacity .25s ease;
}
.notif-close {
    flex-shrink: 0; width: 22px; height: 22px;
    display: flex; align-items: center; justify-content: center;
    background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.08);
    border-radius: 50%; color: rgba(180,208,255,.5);
    font-size: 1rem; line-height: 1; cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
}
.notif-close:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.2); color: rgba(220,235,255,.9); }
.notif-bar-out { animation: notif-out .38s ease forwards; }
@keyframes notif-in  { from { opacity:0; transform: translateX(-50%) translateY(14px); } to { opacity:1; transform: translateX(-50%) translateY(0); } }
@keyframes notif-out { to   { opacity:0; transform: translateX(-50%) translateY(14px); } }
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .notif-bar {
        background: rgba(240,246,255,.92); border-color: rgba(37,99,235,.14);
        box-shadow: 0 6px 28px rgba(37,99,235,.10), 0 1px 0 rgba(255,255,255,.8) inset;
    }
    :root:not([data-theme="dark"]) .notif-text { color: rgba(30,58,140,.72); }
    :root:not([data-theme="dark"]) .notif-close { background: rgba(37,99,235,.06); border-color: rgba(37,99,235,.12); color: rgba(30,58,140,.45); }
    :root:not([data-theme="dark"]) .notif-close:hover { background: rgba(37,99,235,.14); color: rgba(30,58,140,.9); }
}
[data-theme="light"] .notif-bar {
    background: rgba(240,246,255,.92); border-color: rgba(37,99,235,.14);
    box-shadow: 0 6px 28px rgba(37,99,235,.10), 0 1px 0 rgba(255,255,255,.8) inset;
}
[data-theme="light"] .notif-text { color: rgba(30,58,140,.72); }
[data-theme="light"] .notif-close { background: rgba(37,99,235,.06); border-color: rgba(37,99,235,.12); color: rgba(30,58,140,.45); }
[data-theme="light"] .notif-close:hover { background: rgba(37,99,235,.14); color: rgba(30,58,140,.9); }

/* ── 导航 ── */
nav {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0 40px; height: 60px;
    background: rgba(10,22,40,.88); backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--border);
    position: sticky; top: 0; z-index: 50;
}
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) nav { background: rgba(255,255,255,.92); }
}
[data-theme="light"] nav { background: rgba(255,255,255,.92); }
.logo       { display: flex; align-items: center; }
.logo-img   { display: block; height: 36px; width: auto; object-fit: contain; }

/* 默认暗色：显示 dark logo，隐藏 light logo */
.logo-dark  { display: block; }
.logo-light { display: none; }

/* 亮色模式：显示 light logo，隐藏 dark logo */
[data-theme="light"] .logo-dark  { display: none; }
[data-theme="light"] .logo-light { display: block; }
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .logo-dark  { display: none; }
    :root:not([data-theme="dark"]) .logo-light { display: block; }
}
.nav-links   { display: flex; align-items: center; gap: 4px; }
.nav-a       { padding: 6px 14px; font-size: .82rem; color: var(--t2); border-radius: var(--r-sm); transition: all .2s; display: inline-block; }
.nav-a:hover { background: rgba(96,165,250,.1); color: var(--t1); }
.nav-btn     { padding: 8px 22px; font-size: .82rem; font-weight: 600; background: var(--blue); color: #fff; border-radius: var(--r-full); margin-left: 8px; transition: all .25s; display: inline-block; }
.nav-btn:hover { background: var(--blue2); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(37,99,235,.4); }

/* ── 页脚 ── */
footer { background: rgba(255,255,255,.02); border-top: 1px solid var(--border); padding: 48px 24px 32px; position: relative; z-index: 1; }
@media (prefers-color-scheme: light) { footer { background: rgba(0,0,0,.02); } }
.footer-inner  { max-width: 760px; margin: 0 auto; }
.footer-top    { display: flex; justify-content: space-between; align-items: flex-start; gap: 40px; padding-bottom: 32px; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.footer-brand  { display: flex; flex-direction: column; gap: 14px; min-width: 180px; }
.footer-tagline{ display:flex; flex-direction:column; gap:5px; }
.footer-quote  { font-family:var(--serif); font-size:.82rem; color:var(--t2); font-style:italic; letter-spacing:.04em; }
.footer-slogan { font-family:var(--serif); font-size:.95rem; font-weight:700; color:var(--t1); letter-spacing:.06em; }
.footer-motto  { font-family:var(--serif); font-size:.75rem; color:var(--blue3); letter-spacing:.18em; }
.footer-nav    { display: flex; gap: 40px; flex-wrap: wrap; }
.footer-col    { display: flex; flex-direction: column; gap: 10px; }
.footer-col-head { font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--t1); margin-bottom: 2px; }
.footer-link   { font-size: .8rem; color: var(--t2); transition: color .2s; }
.footer-link:hover { color: var(--blue3); }
.footer-bottom { padding-top: 24px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px; }
.footer-copy   { font-size: .72rem; color: var(--t3); line-height: 1.8; }
.footer-copy a { color: var(--t2); transition: color .2s; }
.footer-copy a:hover { color: var(--blue3); }
.footer-pills  { display: flex; gap: 7px; flex-wrap: wrap; }
.fpill { padding: 3px 11px; background: rgba(255,255,255,.04); border: 1px solid var(--border); border-radius: var(--r-full); font-size: .68rem; color: var(--t3); }

/* ── 主题切换按钮 ── */
.theme-btn {
    width: 34px; height: 34px;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--r-sm);
    border: 1px solid var(--border);
    color: var(--t2);
    cursor: pointer;
    background: transparent;
    transition: all .2s;
    flex-shrink: 0;
}
.theme-btn:hover { background: rgba(96,165,250,.1); color: var(--t1); border-color: var(--border2); }
.theme-btn svg   { width: 16px; height: 16px; }
/* ── Hero ── */
.hero { text-align: center; padding: 72px 20px 48px; max-width: 700px; margin: 0 auto; }
.hero-badge { display: inline-flex; align-items: center; gap: 6px; background: rgba(37,99,235,.15); border: 1px solid rgba(96,165,250,.3); color: var(--blue4); font-size: .72rem; font-weight: 600; letter-spacing: .14em; padding: 5px 16px; border-radius: var(--r-full); margin-bottom: 24px; text-transform: uppercase; }
.hero-badge-dot { width: 6px; height: 6px; background: var(--cyan2); border-radius: 50%; animation: pulse 2s ease-in-out infinite; }
@keyframes pulse { 0%,100% { opacity: .3; } 50% { opacity: 1; } }
.hero h1 { font-family: var(--serif); font-size: clamp(1.9rem,5vw,3.2rem); font-weight: 700; line-height: 1.2; color: var(--t1); margin-bottom: 18px; }
.hero h1 em { font-style: normal; color: var(--blue3); }
.hero-sub { font-size: .95rem; color: var(--t2); line-height: 1.9; margin-bottom: 36px; }
.hero-sub strong { color: var(--t1); font-weight: 500; }
.hero-btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* ── 按钮 ── */
.btn-primary { display: inline-flex; align-items: center; gap: 8px; padding: 14px 40px; background: var(--blue); color: #fff; border-radius: var(--r-full); font-size: .95rem; font-weight: 700; transition: all .25s; }
.btn-primary:hover { background: var(--blue2); transform: translateY(-2px); box-shadow: 0 10px 32px rgba(37,99,235,.4); }
.btn-ghost { display: inline-flex; align-items: center; gap: 8px; padding: 13px 30px; border: 1px solid var(--border2); color: var(--t2); border-radius: var(--r-full); font-size: .9rem; transition: all .25s; }
.btn-ghost:hover { border-color: rgba(96,165,250,.5); color: var(--t1); }

/* ── 统计条 ── */
.stats { display: flex; border: 1px solid var(--border); border-radius: var(--r-lg); overflow: hidden; background: rgba(255,255,255,.02); margin-bottom: 64px; }
.stat { flex: 1; padding: 20px 16px; text-align: center; border-right: 1px solid var(--border); }
.stat:last-child { border-right: none; }
.stat-num   { font-family: monospace; font-size: 1.6rem; font-weight: 700; color: var(--blue3); display: block; }
.stat-label { font-size: .7rem; color: var(--t3); margin-top: 3px; display: block; letter-spacing: .06em; }

/* ── 写信卡片 ── */
.card { background: rgba(255,255,255,.04); backdrop-filter: blur(20px); border: 1px solid var(--border2); border-radius: var(--r-xl); overflow: hidden; margin-bottom: 32px; }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .card { background:#ffffff; box-shadow:0 1px 4px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.04); border-color:rgba(0,0,0,.08); } }
/* ── 称呼行 ── */
.card-top { padding: 24px 28px 16px; }
.greeting-row { display: flex; align-items: center; gap: 8px; }
.g-dear { font-family: var(--serif); font-size: .95rem; color: var(--t1); white-space: nowrap; }
.g-input { flex: 1; min-width: 0; max-width: 160px; font-family: var(--serif); font-size: .95rem; font-weight: 600; color: var(--t1); background: transparent; border: none; border-bottom: 1.5px solid var(--border2); padding: 2px 6px; outline: none; transition: border-color .2s; }
.g-input:focus { border-bottom-color: var(--blue3); }
.r-toggle { width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,.06); border: 1px solid var(--border); color: var(--t3); transition: all .18s; cursor: pointer; flex-shrink: 0; }
.r-toggle:hover, .r-toggle.open { background: rgba(37,99,235,.12); border-color: var(--border2); color: var(--blue4); }
.r-panel { overflow: hidden; max-height: 0; opacity: 0; transition: max-height .28s ease, opacity .22s ease; }
.r-panel.open { max-height: 120px; opacity: 1; padding-top: 12px; }
.word-count { margin-left: auto; font-size: .75rem; color: var(--t3); white-space: nowrap; }
.letter-area { width: 100%; min-height: 220px; border: none; outline: none; resize: none; font-family: var(--serif); font-size: 1rem; line-height: 1.9; color: var(--t1); background: transparent; padding: 20px 28px 12px; display: block; }
.letter-area::placeholder { color: var(--t3); font-style: italic; }

/* ── 写作提示 ── */
.prompts { padding: 0 28px 20px; display: flex; gap: 8px; flex-wrap: wrap; }
.chip { padding: 5px 13px; background: rgba(37,99,235,.1); border: 1px solid rgba(96,165,250,.2); border-radius: var(--r-full); font-size: .75rem; color: var(--t2); cursor: pointer; transition: all .2s; }
.chip:hover { background: rgba(37,99,235,.2); border-color: rgba(96,165,250,.4); color: var(--blue4); }

/* ── 表单分区 ── */
.form-sec { padding: 0 28px 20px; }
.sec-row { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.opt-label { display: block; font-size: .7rem; font-weight: 600; color: var(--t3); letter-spacing: .12em; text-transform: uppercase; margin-bottom: 10px; }
.opt-sub { font-weight: 400; letter-spacing: 0; text-transform: none; opacity: .7; }
.icon-btn { width: 26px; height: 26px; border-radius: 6px; display: flex; align-items: center; justify-content: center; background: transparent; border: 1px solid var(--border); color: var(--t3); cursor: pointer; transition: all .18s; flex-shrink: 0; }
.icon-btn:hover, .icon-btn.active { background: rgba(37,99,235,.12); border-color: var(--border2); color: var(--blue4); }
.pills { display: flex; flex-wrap: wrap; gap: 6px; }
.pill { padding: 7px 18px; border: 1px solid var(--border); border-radius: var(--r-full); font-size: .82rem; color: var(--t2); cursor: pointer; background: transparent; transition: all .2s; }
.pill:hover { border-color: rgba(96,165,250,.4); color: var(--blue4); background: rgba(37,99,235,.06); }
.pill.on { background: var(--blue); border-color: var(--blue); color: #fff; font-weight: 700; }
.date-input { width: 100%; padding: 9px 14px; border: 1.5px solid var(--border); border-radius: var(--r-md); font-size: .88rem; color: var(--t1); background: rgba(255,255,255,.04); outline: none; transition: border-color .2s; color-scheme: dark; }
.date-input:focus { border-color: rgba(96,165,250,.5); }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .date-input { color-scheme: light; } }
[data-theme="light"] .date-input { color-scheme: light; }
.priv-btns { display: flex; gap: 6px; }
.priv-btn { flex: 1; padding: 9px 8px; border: 1px solid var(--border); border-radius: var(--r-sm); font-size: .78rem; color: var(--t2); cursor: pointer; text-align: center; background: rgba(255,255,255,.02); transition: all .18s; }
.priv-btn:hover { border-color: rgba(96,165,250,.4); color: var(--blue4); }
.priv-btn.on { background: rgba(37,99,235,.15); border-color: rgba(96,165,250,.4); color: var(--blue4); font-weight: 600; }
.priv-hint { font-size: .72rem; color: var(--t3); margin-top: 8px; line-height: 1.6; }

/* ── 邮箱、提交 ── */
.email-wrap { padding: 0 28px 20px; display: flex; flex-direction: column; gap: 8px; }
.email-row { position: relative; display: flex; align-items: center; }
.email-row .input { padding-right: 44px; }
.email-clr { position: absolute; right: 10px; width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,.07); border: 1px solid var(--border); color: var(--t3); cursor: pointer; transition: all .15s; }
.email-clr:hover { background: rgba(255,255,255,.16); color: var(--t1); }
.input { width: 100%; padding: 12px 16px; border: 1.5px solid var(--border); border-radius: var(--r-md); font-size: .9rem; color: var(--t1); background: rgba(255,255,255,.04); transition: border-color .2s; }
.input:focus { border-color: rgba(96,165,250,.5); background: rgba(37,99,235,.06); outline: none; }
.input::placeholder { color: var(--t3); }
.input.err { border-color: rgba(248,113,113,.6); }
.ferr { font-size: .73rem; color: #f87171; display: none; }
.ferr.on { display: block; }
.submit-wrap { padding: 0 28px 28px; }
.btn-submit { width: 100%; padding: 15px 24px; background: var(--blue); color: #fff; border: none; border-radius: var(--r-lg); font-size: 1rem; font-weight: 700; cursor: pointer; transition: all .25s; display: flex; align-items: center; justify-content: center; gap: 8px; }
.btn-submit:hover { background: var(--blue2); transform: translateY(-1px); box-shadow: 0 8px 28px rgba(37,99,235,.4); }
.btn-submit:disabled { background: rgba(255,255,255,.08); color: var(--t3); cursor: not-allowed; transform: none; box-shadow: none; }
.submit-note { margin-top: 10px; font-size: .73rem; color: var(--t3); text-align: center; line-height: 1.7; }

/* ── 成功态 ── */
.success { display: none; text-align: center; padding: 44px 32px 40px; position: relative; overflow: hidden; }
.success.on { display: block; animation: suc-in .55s cubic-bezier(.22,1,.36,1) both; }
@keyframes suc-in { from{opacity:0;transform:translateY(20px);} to{opacity:1;transform:none;} }
.card.sent .card-top,
.card.sent .letter-area,
.card.sent .prompts,
.card.sent .form-sec,
.card.sent .email-wrap,
.card.sent .submit-wrap { display: none; }
.suc-glow { position: absolute; top: -60px; left: 50%; transform: translateX(-50%); width: 380px; height: 260px; border-radius: 50%; background: radial-gradient(ellipse, rgba(37,99,235,.08), transparent 68%); pointer-events: none; }
.suc-icon { width: 80px; height: 80px; border-radius: 50%; background: rgba(37,99,235,.1); border: 1px solid rgba(96,165,250,.22); display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; position: relative; z-index: 1; }
[data-theme="light"] .suc-icon { background: rgba(22,119,255,.08); border-color: rgba(22,119,255,.18); }
.suc-title { font-family: var(--serif); font-size: 1.75rem; font-weight: 700; color: var(--t1); margin-bottom: 6px; letter-spacing: .04em; }
.suc-sub { font-size: .84rem; color: var(--t3); margin-bottom: 28px; letter-spacing: .05em; }
.suc-tl { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 16px 20px; border: 1px solid var(--border); border-radius: var(--r-lg); background: rgba(255,255,255,.025); max-width: 360px; margin: 0 auto 18px; }
[data-theme="light"] .suc-tl { background: #f8fafc; border-color: #dde5f0; }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .suc-tl { background: #f8fafc; border-color: #dde5f0; } }
.suc-tl-node { flex: 1; text-align: center; }
.suc-tl-val { font-family: var(--serif); font-size: .92rem; font-weight: 600; color: var(--t1); margin-bottom: 3px; }
.suc-tl-key { font-size: .66rem; color: var(--t3); letter-spacing: .06em; }
.suc-tl-arr { flex-shrink: 0; color: var(--t3); opacity: .45; }
.suc-meta { margin-bottom: 22px; }
.suc-badge { display: inline-flex; align-items: center; padding: 4px 14px; border-radius: var(--r-full); font-size: .74rem; font-weight: 600; background: rgba(37,99,235,.1); border: 1px solid rgba(96,165,250,.22); color: var(--blue4); }
[data-theme="light"] .suc-badge { background: rgba(22,119,255,.08); border-color: rgba(22,119,255,.2); color: var(--blue); }
.suc-code-wrap { background: rgba(255,255,255,.025); border: 1px solid var(--border2); border-radius: var(--r-xl); padding: 22px 24px 18px; margin-bottom: 20px; }
[data-theme="light"] .suc-code-wrap { background: #f8fafc; border-color: #dde5f0; }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .suc-code-wrap { background: #f8fafc; border-color: #dde5f0; } }
.suc-code-lbl { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: .65rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--t3); margin-bottom: 12px; }
.suc-code { font-family: monospace; font-size: .98rem; letter-spacing: 2px; color: var(--blue3); font-weight: 600; word-break: break-all; margin-bottom: 16px; }
[data-theme="light"] .suc-code { color: var(--blue); }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .suc-code { color: var(--blue); } }
.suc-copy-row { margin-bottom: 10px; }
.suc-copy { display: inline-flex; align-items: center; gap: 7px; padding: 9px 22px; background: var(--blue); border: none; border-radius: var(--r-md); font-size: .82rem; font-weight: 600; color: #fff; cursor: pointer; transition: background .2s; }
.suc-copy:hover { background: var(--blue2); }
.suc-copy.copied { background: #059669; }
.suc-code-hint { font-size: .72rem; color: var(--t3); line-height: 1.7; }
.suc-again { margin-top: 4px; padding: 10px 28px; border: 1px solid var(--border2); border-radius: var(--r-lg); font-size: .88rem; color: var(--t2); cursor: pointer; transition: all .2s; background: transparent; }
.suc-again:hover { border-color: rgba(96,165,250,.4); color: var(--blue4); }

/* ── 提取码区 ── */
/* ── 提取页 ── */
.ext-wrap  { max-width: 560px; margin: 0 auto; padding: 60px 20px 80px; position: relative; z-index: 1; min-height: calc(100vh - 260px); }
.ext-hd    { text-align: center; margin-bottom: 36px; }
.ext-hd-icon { margin-bottom: 20px; }
.ext-hd-title { font-family: var(--serif); font-size: clamp(1.4rem,3vw,1.8rem); font-weight: 700; color: var(--t1); margin-bottom: 10px; letter-spacing: .04em; }
.ext-hd-sub   { font-size: .88rem; color: var(--t2); }
.ext-card  { background: rgba(255,255,255,.04); border: 1px solid var(--border2); border-radius: var(--r-xl); padding: 36px 40px; margin-bottom: 12px; }
.ext-label { display: block; font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--t3); margin-bottom: 12px; }
.ext-row   { display: flex; gap: 10px; }
.ext-input { flex: 1; padding: 14px 18px; background: rgba(255,255,255,.04); border: 1.5px solid var(--border2); border-radius: var(--r-md); font-size: .95rem; color: var(--t1); font-family: monospace; letter-spacing: .06em; transition: border-color .2s; }
.ext-input:focus { border-color: var(--blue3); outline: none; background: rgba(37,99,235,.05); }
.ext-input::placeholder { color: var(--t3); font-size: .82rem; letter-spacing: 0; }
.ext-btn   { display: inline-flex; align-items: center; gap: 7px; padding: 14px 24px; background: var(--blue); border: none; border-radius: var(--r-md); font-size: .88rem; font-weight: 700; color: #fff; cursor: pointer; transition: all .2s; white-space: nowrap; }
.ext-btn:hover { background: var(--blue2); }
.ext-btn:disabled { opacity: .6; cursor: not-allowed; }
.ext-hint  { font-size: .75rem; color: var(--t3); margin-top: 10px; line-height: 1.7; }
.ext-err   { font-size: .82rem; color: #f87171; margin-top: 10px; min-height: 1.2em; }

.ext-result { display: none; background: rgba(255,255,255,.04); border: 1px solid var(--border2); border-radius: var(--r-xl); overflow: hidden; margin-top: 24px; }
.ext-result.on { display: block; }
.ext-result-hd { display: flex; align-items: center; justify-content: space-between; padding: 20px 32px 16px; border-bottom: 1px solid var(--border); flex-wrap: wrap; gap: 10px; }
.ext-result-tag { display: inline-flex; align-items: center; gap: 6px; background: rgba(16,185,129,.1); border: 1px solid rgba(52,211,153,.2); color: #34d399; font-size: .7rem; font-weight: 600; letter-spacing: .1em; padding: 4px 12px; border-radius: var(--r-full); }
.ext-result-dates { font-size: .78rem; color: var(--t3); font-family: var(--serif); }
.ext-result-title { font-family: var(--serif); font-size: 1.1rem; font-weight: 700; color: var(--t1); padding: 24px 32px 0; }
.ext-result-body  { font-family: var(--serif); font-size: 1rem; line-height: 2.1; color: var(--t1); white-space: pre-wrap; word-break: break-word; padding: 20px 32px 36px; }

/* light */
[data-theme="light"] .ext-card { background: #fff; border-color: #e8e8e8; box-shadow: 0 2px 12px rgba(0,0,0,.06); }
[data-theme="light"] .ext-input { background: #fff; border-color: #e8e8e8; }
[data-theme="light"] .ext-input:focus { border-color: #1677ff; background: #fff; }
[data-theme="light"] .ext-result { background: #fff; border-color: #e8e8e8; box-shadow: 0 2px 12px rgba(0,0,0,.06); }
[data-theme="light"] .ext-result-hd { border-bottom-color: #e8e8e8; }
:root:not([data-theme="dark"]) .ext-card { background: #fff; border-color: #e8e8e8; box-shadow: 0 2px 12px rgba(0,0,0,.06); }
:root:not([data-theme="dark"]) .ext-input { background: #fff; border-color: #e8e8e8; }
:root:not([data-theme="dark"]) .ext-result { background: #fff; border-color: #e8e8e8; }

@media (max-width: 600px) {
    .ext-card { padding: 24px 20px; }
    .ext-row  { flex-direction: column; }
    .ext-btn  { width: 100%; justify-content: center; }
    .ext-result-hd, .ext-result-title, .ext-result-body { padding-left: 20px; padding-right: 20px; }
}

/* ── 公开信卡片 ── */
.sec-header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 20px; }
.sec-title  { font-family: var(--serif); font-size: 1.05rem; font-weight: 700; color: var(--t1); }
.sec-more   { font-size: .78rem; color: var(--t2); transition: color .2s; }
.sec-more:hover { color: var(--blue3); }
.letters    { display: flex; flex-direction: column; gap: 10px; margin-bottom: 64px; }
.cards-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(280px,1fr)); gap: 16px; margin-bottom: 48px; }
.letter-card { background: rgba(255,255,255,.04); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 20px 24px; cursor: pointer; transition: all .25s; display: block; }
.letter-card:hover { border-color: var(--border2); background: rgba(255,255,255,.06); transform: translateY(-2px); }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .letter-card { background:#ffffff; border-color:rgba(0,0,0,.08); } }
.letter-meta { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.tag        { font-size: .7rem; padding: 3px 10px; border-radius: var(--r-full); background: rgba(255,255,255,.06); color: var(--t2); }
.tag-blue   { background: rgba(37,99,235,.15); color: var(--blue4); border: 1px solid rgba(96,165,250,.2); }
.tag-green  { background: rgba(16,185,129,.1); color: #34d399; border: 1px solid rgba(52,211,153,.2); }
.blur-wrap  { position: relative; overflow: hidden; border-radius: var(--r-sm); padding: 12px 0; }
.blur-text  { font-family: var(--serif); font-size: .9rem; color: var(--t3); filter: blur(4px); user-select: none; line-height: 1.8; }
.blur-mask  { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: .72rem; letter-spacing: .12em; color: var(--t2); background: rgba(10,22,40,.5); border-radius: var(--r-sm); }
.letter-excerpt { font-family: var(--serif); font-size: .9rem; line-height: 1.8; color: var(--t2); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* ── 公开信件广场 ── */
.public-hero { width:100%; line-height:0; }
.public-hero-img { width:100%; aspect-ratio:1626/640; max-height:520px; min-height:200px; object-fit:cover; object-position:center 45%; display:block; }

.pub-container { padding-top:0; padding-bottom:64px; }
.pub-page-hd { padding:28px 0 20px; border-bottom:1px solid var(--border); margin-bottom:28px; }
.pub-page-title { font-family:var(--serif); font-size:clamp(1.3rem,3vw,1.7rem); font-weight:700; color:var(--t1); margin-bottom:5px; }
.pub-page-sub { font-size:.86rem; color:var(--t2); }
.pub-list { display:flex; flex-direction:column; gap:14px; margin-bottom:32px; }

/* Card */
.pub-card { display:block; background:rgba(255,255,255,.04); border:1px solid var(--border); border-radius:var(--r-xl); text-decoration:none; transition:border-color .22s, transform .22s, box-shadow .22s; }
.pub-card:hover { border-color:rgba(96,165,250,.3); transform:translateY(-2px); box-shadow:0 6px 28px rgba(37,99,235,.08); }
.pub-card-inner { padding:20px 26px; }
.pub-card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:10px; }
.pub-card-title { font-family:var(--serif); font-size:1.05rem; font-weight:600; color:var(--t1); line-height:1.5; }
.pub-card-to { color:var(--blue4); }
.pub-likes { display:inline-flex; align-items:center; gap:4px; font-size:.72rem; color:var(--t3); white-space:nowrap; padding:3px 9px; background:rgba(248,113,113,.07); border:1px solid rgba(248,113,113,.14); border-radius:var(--r-full); flex-shrink:0; margin-top:2px; }

/* Timeline */
.pub-tl { display:flex; align-items:center; gap:5px; margin-bottom:12px; font-size:.79rem; flex-wrap:wrap; }
.pub-tl-pre { padding:1px 7px; background:rgba(255,255,255,.05); border:1px solid var(--border); border-radius:var(--r-full); font-size:.68rem; color:var(--t3); letter-spacing:.05em; font-weight:500; flex-shrink:0; }
.pub-tl-from { color:var(--t2); }
.pub-tl-arr { color:var(--t3); opacity:.28; flex-shrink:0; }
.pub-tl-to { color:var(--blue4); font-weight:600; }
.pub-tl-deliver { padding:1px 7px; background:rgba(96,165,250,.1); border:1px solid rgba(96,165,250,.2); border-radius:var(--r-full); font-size:.68rem; color:var(--blue4); letter-spacing:.05em; font-weight:600; flex-shrink:0; }
.pub-tl-span { margin-left:auto; padding:2px 9px; background:rgba(99,102,241,.08); border:1px solid rgba(99,102,241,.14); border-radius:var(--r-full); font-size:.72rem; color:#a5b4fc; white-space:nowrap; flex-shrink:0; }
.pub-tl-span strong { font-weight:700; color:#818cf8; }

.pub-card-excerpt { font-family:var(--serif); font-size:.87rem; line-height:1.85; color:var(--t2); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* ── 分页 ── */
.pagination { display:flex; align-items:center; justify-content:center; gap:6px; padding:16px 0 8px; flex-wrap:wrap; }
.pg-btn { display:inline-flex; align-items:center; justify-content:center; min-width:36px; height:36px; padding:0 10px; border:1px solid var(--border2); border-radius:var(--r-md); font-size:.85rem; color:var(--t2); text-decoration:none; transition:all .2s; }
.pg-btn:not(.pg-disabled):not(.pg-active):hover { border-color:var(--blue); color:var(--blue4); background:rgba(96,165,250,.08); }
.pg-active { background:var(--blue); border-color:var(--blue); color:#fff !important; font-weight:600; }
.pg-disabled { opacity:.32; cursor:default; pointer-events:none; }
.pg-ellipsis { color:var(--t3); padding:0 4px; line-height:36px; font-size:.85rem; }

/* ── Toast ── */
.toast { position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%) translateY(80px); background: var(--bg2); color: var(--t1); border: 1px solid var(--border2); padding: 12px 24px; border-radius: var(--r-lg); font-size: .85rem; z-index: 200; transition: transform .3s ease; white-space: nowrap; pointer-events: none; box-shadow: 0 8px 32px rgba(0,0,0,.4); }
.toast.on { transform: translateX(-50%) translateY(0); }

/* ── 书法标题图片 ── */
.hero-calligraphy {
    display: block;
    width: 100%;
    max-width: 720px;
    height: auto;
    margin: 0 auto 20px;
    mix-blend-mode: screen;        /* 深色背景：白色笔画自然显现 */
    filter: drop-shadow(0 0 20px rgba(96,165,250,.25));  /* 蓝色光晕，融入星空感 */
}

[data-theme="light"] .hero-calligraphy {
    mix-blend-mode: multiply;      /* 亮色背景：白色消失，笔画保留 */
    filter: none;
}

@media (max-width: 600px) {
    .hero-calligraphy {
        max-width: 100%;
    }
}

/* ── 书法署名 ── */
.calligraphy-wrap {
    width: 100%;
    max-width: 720px;
    margin: 0 auto 28px;
}

.hero-calligraphy {
    display: block;
    width: 100%;
    height: auto;
    mix-blend-mode: screen;
    filter: drop-shadow(0 0 20px rgba(96,165,250,.25));
}

[data-theme="light"] .hero-calligraphy {
    mix-blend-mode: multiply;
    filter: none;
}

.calligraphy-credit {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 10px;
    padding-right: 2px;
}

.calligraphy-line {
    flex: 1;
    height: 1px;
    background: linear-gradient(
            to right,
            transparent,
            rgba(96,165,250,.25) 40%,
            rgba(96,165,250,.4)
    );
}

.calligraphy-text {
    font-family: var(--serif);
    font-size: .72rem;
    color: var(--t3);
    letter-spacing: .18em;
    white-space: nowrap;
    transition: color .2s;
    text-decoration: none;
    cursor: pointer;
}

a.calligraphy-text:hover {
    color: var(--blue3);
}

.calligraphy-wrap:hover .calligraphy-text {
    color: var(--t2);
}

[data-theme="light"] .calligraphy-line {
    background: linear-gradient(
            to right,
            transparent,
            rgba(37,99,235,.15) 40%,
            rgba(37,99,235,.25)
    );
}
/* ── 详情页 ── */
.letter-page,
.sealed-page { max-width: 680px; margin: 0 auto; padding: 48px 20px 80px; position: relative; z-index: 1; }
.breadcrumb  { display: flex; align-items: center; gap: 8px; font-size: .78rem; color: var(--t3); margin-bottom: 40px; }
.breadcrumb a { color: var(--t2); transition: color .2s; }
.breadcrumb a:hover { color: var(--blue3); }
.breadcrumb-sep { opacity: .4; }
.letter-envelope { background: rgba(255,255,255,.04); border: 1px solid var(--border2); border-radius: var(--r-xl); overflow: hidden; margin-bottom: 12px; }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .letter-envelope { background:#ffffff; border-color:rgba(0,0,0,.08); } }
.envelope-ribbon { height: 4px; background: linear-gradient(90deg,var(--blue),var(--cyan2),var(--blue2)); }
.envelope-cover  { padding: 40px 48px 36px; border-bottom: 1px solid var(--border); display: flex; gap: 32px; align-items: flex-start; background: linear-gradient(135deg,rgba(37,99,235,.05) 0%,rgba(6,182,212,.02) 100%); }
@media (prefers-color-scheme: light) { .envelope-cover { background: linear-gradient(135deg,rgba(37,99,235,.03) 0%,rgba(6,182,212,.015) 100%); } }
.capsule-icon    { flex-shrink: 0; width: 64px; height: 100px; display: flex; align-items: center; justify-content: center; opacity: .85; }
.envelope-meta   { flex: 1; }
.envelope-tag    { display: inline-flex; align-items: center; gap: 6px; background: rgba(16,185,129,.1); border: 1px solid rgba(52,211,153,.25); color: #34d399; font-size: .7rem; font-weight: 600; letter-spacing: .12em; padding: 5px 14px; border-radius: var(--r-full); margin-bottom: 18px; text-transform: uppercase; box-shadow: 0 0 16px rgba(52,211,153,.08); }
.envelope-title   { font-family: var(--serif); font-size: clamp(1.3rem,3.5vw,1.85rem); font-weight: 700; line-height: 1.35; color: var(--t1); margin-bottom: 0; }
.env-title-to     { color: var(--blue4); }
.env-tl { display:flex; align-items:center; gap:5px; margin-bottom:14px; font-size:.79rem; flex-wrap:wrap; }
.env-tl-pre { padding:1px 7px; background:rgba(255,255,255,.05); border:1px solid var(--border); border-radius:var(--r-full); font-size:.68rem; color:var(--t3); letter-spacing:.05em; font-weight:500; flex-shrink:0; }
.env-tl-from { color:var(--t2); }
.env-tl-arr { color:var(--t3); opacity:.28; flex-shrink:0; }
.env-tl-to { color:var(--blue4); font-weight:600; }
.env-tl-deliver { padding:1px 7px; background:rgba(96,165,250,.1); border:1px solid rgba(96,165,250,.2); border-radius:var(--r-full); font-size:.68rem; color:var(--blue4); letter-spacing:.05em; font-weight:600; flex-shrink:0; }
.env-tl-span { margin-left:auto; padding:2px 9px; background:rgba(99,102,241,.08); border:1px solid rgba(99,102,241,.14); border-radius:var(--r-full); font-size:.72rem; color:#a5b4fc; white-space:nowrap; flex-shrink:0; }
.env-tl-span strong { font-weight:700; color:#818cf8; }
.letter-body-wrap { padding: 40px 48px; }
.letter-salutation{ font-family: var(--serif); font-size: 1rem; color: var(--t2); margin-bottom: 24px; font-style: italic; }
.letter-body      { font-family: var(--serif); font-size: 1.05rem; line-height: 2.1; color: var(--t1); white-space: pre-wrap; word-break: break-word; }
.letter-sign      { margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--border); display: flex; justify-content: flex-end; }
.letter-sign-inner{ text-align: right; }
.letter-sign-from { font-family: var(--serif); font-size: .9rem; color: var(--t2); font-style: italic; margin-bottom: 4px; }
.letter-sign-date { font-size: .8rem; color: var(--t3); }
.letter-actions   { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 32px; }
.like-btn  { display: inline-flex; align-items: center; gap: 8px; padding: 11px 24px; border: 1px solid var(--border2); border-radius: var(--r-full); font-size: .85rem; color: var(--t2); cursor: pointer; transition: all .25s; background: transparent; font-family: var(--font); }
.like-btn:hover { border-color: rgba(239,68,68,.4); color: #f87171; background: rgba(239,68,68,.06); }
.like-btn.liked { border-color: rgba(239,68,68,.5); color: #f87171; background: rgba(239,68,68,.1); }
.like-btn.liked svg { fill: #f87171; stroke: #f87171; }
.share-btn { display: inline-flex; align-items: center; gap: 8px; padding: 11px 24px; border: 1px solid var(--border2); border-radius: var(--r-full); font-size: .85rem; color: var(--t2); cursor: pointer; transition: all .2s; background: transparent; font-family: var(--font); }
.share-btn:hover { border-color: rgba(96,165,250,.4); color: var(--blue4); background: rgba(37,99,235,.08); }
.cta-card { background: rgba(37,99,235,.08); border: 1px solid rgba(96,165,250,.2); border-radius: var(--r-xl); padding: 36px 40px; text-align: center; margin-top: 32px; }
.cta-card h3 { font-family: var(--serif); font-size: 1.1rem; font-weight: 700; color: var(--t1); margin-bottom: 8px; }
.cta-card p  { font-size: .85rem; color: var(--t2); margin-bottom: 20px; line-height: 1.8; }

/* ── 404 / 500 ── */
.nf-page { position:relative; z-index:1; display:flex; align-items:center; justify-content:center; min-height:80vh; padding:40px 20px; }
.nf-inner { text-align:center; max-width:520px; width:100%; }
.nf-code-wrap { display:flex; align-items:center; justify-content:center; gap:16px; margin-bottom:32px; }
.nf-code { font-family:monospace; font-size:clamp(5rem,14vw,8rem); font-weight:700; color:var(--blue3); opacity:.18; line-height:1; user-select:none; letter-spacing:-.02em; }
.nf-capsule { animation:nf-float 3.6s ease-in-out infinite; }
@keyframes nf-float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
.nf-capsule-err svg rect, .nf-capsule-err svg path, .nf-capsule-err svg line { }
.nf-divider { width:48px; height:2px; background:linear-gradient(90deg,transparent,var(--blue3),transparent); margin:0 auto 28px; border-radius:2px; }
.nf-divider-err { background:linear-gradient(90deg,transparent,#f87171,transparent); }
.nf-title { font-family:var(--serif); font-size:clamp(1.2rem,3vw,1.6rem); font-weight:700; color:var(--t1); margin-bottom:14px; letter-spacing:.04em; }
.nf-sub { font-size:.9rem; color:var(--t2); line-height:2; margin-bottom:36px; }
.nf-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:28px; }
.nf-links { display:flex; align-items:center; justify-content:center; gap:10px; font-size:.8rem; color:var(--t3); flex-wrap:wrap; }
.nf-links a { color:var(--t3); transition:color .2s; }
.nf-links a:hover { color:var(--blue3); }
.nf-dot { opacity:.4; }

/* ── 管理后台 ── */
.admin-wrap   { max-width: 1100px; margin: 0 auto; padding: 40px 20px; }
.admin-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 28px; flex-wrap: wrap; gap: 12px; }
.admin-stats  { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; }
.astat        { background: rgba(255,255,255,.04); border: 1px solid var(--border); border-radius: var(--r-md); padding: 16px 20px; text-align: center; min-width: 100px; }
.astat-num    { font-family: monospace; font-size: 1.4rem; font-weight: 700; color: var(--blue3); display: block; }
.astat-label  { font-size: .7rem; color: var(--t3); margin-top: 2px; display: block; }
.tab { padding: 7px 16px; border-radius: var(--r-full); font-size: .8rem; cursor: pointer; border: 1px solid var(--border); color: var(--t2); background: transparent; transition: all .2s; }
.tab:hover, .tab.on { border-color: rgba(96,165,250,.4); color: var(--blue4); background: rgba(37,99,235,.1); }
.table-wrap { overflow-x: auto; background: rgba(255,255,255,.03); border: 1px solid var(--border); border-radius: var(--r-xl); }
table { width: 100%; border-collapse: collapse; font-size: .85rem; }
th { text-align: left; padding: 12px 16px; font-size: .7rem; letter-spacing: .1em; color: var(--t3); border-bottom: 1px solid var(--border); font-weight: 600; }
td { padding: 12px 16px; border-bottom: 1px solid rgba(255,255,255,.04); vertical-align: top; }
tr:last-child td { border-bottom: none; }
tr:hover td { background: rgba(255,255,255,.02); }
.ec   { color: var(--t2); font-size: .82rem; max-width: 260px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.bs   { display: inline-block; padding: 2px 10px; border-radius: var(--r-full); font-size: .7rem; letter-spacing: .06em; }
.s0   { background: rgba(234,179,8,.12);  color: #fbbf24; }
.s1   { background: rgba(16,185,129,.12); color: #34d399; }
.s2   { background: rgba(96,165,250,.12); color: var(--blue4); }
.sm1  { background: rgba(239,68,68,.12);  color: #f87171; }
.act-btns { display: flex; gap: 6px; }
.ab     { padding: 5px 12px; border-radius: var(--r-sm); font-size: .75rem; cursor: pointer; transition: all .2s; border: 1px solid transparent; }
.ab-ok  { background: rgba(16,185,129,.15); color: #34d399; border-color: rgba(52,211,153,.2); }
.ab-ok:hover  { background: rgba(16,185,129,.25); }
.ab-pub { background: rgba(96,165,250,.15); color: var(--blue4); border-color: rgba(96,165,250,.25); }
.ab-pub:hover { background: rgba(96,165,250,.25); }
.ab-no  { background: rgba(239,68,68,.12); color: #f87171; border-color: rgba(248,113,113,.2); }
.ab-no:hover  { background: rgba(239,68,68,.22); }

/* ── 提取页 ── */
.ext-page-hd { text-align: center; margin-bottom: 32px; }
.ext-page-title { font-family: var(--serif); font-size: 1.6rem; font-weight: 700; color: var(--t1); margin-bottom: 10px; }
.ext-page-sub { font-size: .9rem; color: var(--t2); }
.ext-inner { padding: 28px; }
.ext-page-tip { text-align: center; font-size: .75rem; color: var(--t3); margin-top: 16px; }

/* ── 信息页（隐私/条款/FAQ/联系/时间胶囊介绍） ── */
.info-page  { max-width: 740px; margin: 0 auto; padding: 48px 20px 100px; position: relative; z-index: 1; }
.info-h1    { font-family: var(--serif); font-size: clamp(1.7rem,4vw,2.2rem); font-weight: 700; color: var(--t1); margin-bottom: 12px; }
.info-lead  { font-size: .95rem; color: var(--t3); margin-bottom: 48px; }
.info-section       { margin-bottom: 44px; }
.info-section h2    { font-family: var(--serif); font-size: 1.1rem; font-weight: 700; color: var(--t1); margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
.info-section p     { color: var(--t2); font-size: .9rem; line-height: 1.9; margin-bottom: 12px; }
.info-section ul    { color: var(--t2); font-size: .9rem; line-height: 1.9; padding-left: 1.2em; }
.info-section ul li { margin-bottom: 6px; }

/* ── 服务条款页 ── */
.terms-notice { display: flex; gap: 12px; align-items: flex-start; background: rgba(234,179,8,.06); border: 1px solid rgba(234,179,8,.18); border-radius: var(--r-lg); padding: 16px 20px; margin-bottom: 40px; font-size: .85rem; color: var(--t2); line-height: 1.75; }
.terms-notice svg { flex-shrink: 0; color: #fbbf24; margin-top: 2px; }

/* ── 常见问题页 ── */
.faq-group           { margin-bottom: 36px; }
.faq-group-title     { display: flex; align-items: center; gap: 8px; font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--t3); margin-bottom: 4px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
.faq-item            { border-bottom: 1px solid var(--border); }
.faq-item[open] .faq-chevron { transform: rotate(180deg); }
.faq-q               { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 0; font-size: .92rem; font-weight: 600; color: var(--t1); cursor: pointer; list-style: none; user-select: none; }
.faq-q::-webkit-details-marker { display: none; }
.faq-q:hover         { color: var(--blue4); }
.faq-chevron         { flex-shrink: 0; color: var(--t3); transition: transform .2s; }
.faq-a               { padding: 0 0 18px; }
.faq-a p             { font-size: .88rem; color: var(--t2); line-height: 1.9; margin-bottom: 8px; }
.faq-a p:last-child  { margin-bottom: 0; }
.faq-a a             { color: var(--blue4); text-decoration: none; }
.faq-a a:hover       { text-decoration: underline; }
.faq-code            { font-family: monospace; font-size: .83rem; background: rgba(96,165,250,.1); color: var(--blue4); padding: 2px 7px; border-radius: 4px; }
.faq-contact         { display: flex; align-items: center; justify-content: space-between; background: rgba(255,255,255,.03); border: 1px solid var(--border); border-radius: var(--r-xl); padding: 24px 28px; margin-top: 8px; }
@media (prefers-color-scheme: light) { .faq-contact { background: rgba(0,0,0,.02); } }
.faq-contact-text    { font-size: .92rem; color: var(--t2); }

/* ── 时间胶囊介绍页 ── */
.tc-hero-quote       { position: relative; margin: 0 0 44px; padding: 28px 36px; background: rgba(37,99,235,.06); border-left: 3px solid var(--blue); border-radius: 0 var(--r-lg) var(--r-lg) 0; }
@media (prefers-color-scheme: light) { .tc-hero-quote { background: rgba(37,99,235,.04); } }
.tc-quote-mark       { font-family: var(--serif); font-size: 5rem; line-height: 1; color: var(--blue); opacity: .25; position: absolute; top: 4px; left: 16px; pointer-events: none; }
.tc-hero-quote blockquote { font-family: var(--serif); font-size: clamp(1rem,2.5vw,1.15rem); color: var(--t1); line-height: 1.9; margin: 0; padding-left: 24px; font-style: italic; }
.tc-callout          { display: flex; gap: 18px; align-items: flex-start; background: rgba(16,185,129,.06); border: 1px solid rgba(52,211,153,.2); border-radius: var(--r-xl); padding: 24px 28px; margin: -12px 0 36px; }
@media (prefers-color-scheme: light) { .tc-callout { background: rgba(16,185,129,.04); } }
.tc-callout-icon     { flex-shrink: 0; width: 44px; height: 44px; border-radius: var(--r-lg); background: rgba(16,185,129,.12); display: flex; align-items: center; justify-content: center; color: #34d399; }
.tc-callout-title    { font-weight: 700; color: var(--t1); margin-bottom: 8px; font-size: .95rem; }
.tc-callout p        { color: var(--t2); font-size: .88rem; line-height: 1.85; margin: 0; }
.tc-steps            { display: flex; flex-direction: column; gap: 0; margin-bottom: 8px; }
.tc-step             { display: flex; gap: 24px; align-items: flex-start; padding: 24px 0; }
.tc-step-num         { flex-shrink: 0; width: 44px; height: 44px; border-radius: var(--r-full); background: rgba(37,99,235,.1); border: 1px solid rgba(96,165,250,.2); display: flex; align-items: center; justify-content: center; font-family: monospace; font-size: .85rem; font-weight: 700; color: var(--blue4); }
.tc-step-title       { font-weight: 700; color: var(--t1); margin-bottom: 8px; font-size: .97rem; }
.tc-step-desc        { color: var(--t2); font-size: .88rem; line-height: 1.85; margin: 0; }
.tc-step-divider     { height: 1px; background: var(--border); margin: 0 0 0 68px; }
.tc-cta              { background: rgba(37,99,235,.07); border: 1px solid rgba(96,165,250,.2); border-radius: var(--r-xl); padding: 40px; text-align: center; margin-top: 48px; }
@media (prefers-color-scheme: light) { .tc-cta { background: rgba(37,99,235,.04); } }
.tc-cta h3           { font-family: var(--serif); font-size: 1.2rem; font-weight: 700; color: var(--t1); margin-bottom: 8px; }
.tc-cta p            { font-size: .88rem; color: var(--t2); margin-bottom: 22px; }

/* ── 联系页 ── */
.contact-card        { display: flex; align-items: center; gap: 20px; background: rgba(37,99,235,.06); border: 1px solid rgba(96,165,250,.2); border-radius: var(--r-xl); padding: 28px 32px; margin-bottom: 36px; }
@media (prefers-color-scheme: light) { .contact-card { background: rgba(37,99,235,.04); } }
.contact-card-icon   { flex-shrink: 0; width: 56px; height: 56px; border-radius: var(--r-lg); background: rgba(37,99,235,.1); border: 1px solid rgba(96,165,250,.2); display: flex; align-items: center; justify-content: center; color: var(--blue4); }
.contact-card-body   { flex: 1; }
.contact-card-label  { font-size: .7rem; letter-spacing: .1em; color: var(--t3); text-transform: uppercase; margin-bottom: 6px; }
.contact-card-val    { display: block; font-size: 1.05rem; font-weight: 600; color: var(--blue4); text-decoration: none; font-family: monospace; margin-bottom: 6px; transition: color .2s; }
.contact-card-val:hover { color: var(--blue3); }
.contact-card-note   { font-size: .78rem; color: var(--t3); }
.contact-topics      { margin-bottom: 32px; }
.contact-topics-title { font-size: .75rem; letter-spacing: .1em; color: var(--t3); text-transform: uppercase; margin-bottom: 14px; }
.contact-topics-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.contact-topic-item  { display: flex; align-items: center; gap: 8px; background: rgba(255,255,255,.04); border: 1px solid var(--border); border-radius: var(--r-md); padding: 10px 14px; font-size: .82rem; color: var(--t2); }
@media (prefers-color-scheme: light) { .contact-topic-item { background: rgba(0,0,0,.02); } }
.contact-topic-item svg { flex-shrink: 0; color: var(--t3); }
.contact-tip         { display: flex; align-items: flex-start; gap: 10px; background: rgba(234,179,8,.06); border: 1px solid rgba(234,179,8,.15); border-radius: var(--r-lg); padding: 14px 18px; font-size: .82rem; color: var(--t2); line-height: 1.7; }
.contact-tip svg     { flex-shrink: 0; color: #fbbf24; margin-top: 2px; }

/* ── 响应式 ── */
@media (max-width: 600px) {
    nav { padding: 0 16px; }
    .nav-a { display: none; }
    .extract-row { flex-direction: column; }
    .stats { flex-direction: column; }
    .stat { border-right: none; border-bottom: 1px solid var(--border); }
    .stat:last-child { border-bottom: none; }
    .footer-top { flex-direction: column; align-items: center; text-align: center; }
    .footer-brand { align-items: center; }
    .footer-nav { gap: 0; width: 100%; justify-content: space-around; }
    .footer-col { align-items: center; flex: 1; }
    .cards-grid { grid-template-columns: 1fr; }
    .envelope-cover { padding: 28px 20px; flex-direction: column; gap: 16px; }
    .capsule-icon { display: none; }
    .envelope-date-item { padding: 12px 16px; }
    .envelope-date-val { font-size: .92rem; }
    .pub-card-inner { padding:16px 18px; }
    .pub-tl { font-size:.75rem; }
    .contact-topics-grid { grid-template-columns: repeat(2,1fr); }
    .contact-card { flex-direction: column; align-items: flex-start; padding: 22px 20px; }
    .letter-body-wrap { padding: 28px 20px; }
    .sealed-body { padding: 40px 20px; }
    .cta-card { padding: 28px 20px; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ════════════════════════════════════════════════════════════
   亮色模式全量覆盖 — 两套选择器保持一致：手动切换 + 系统偏好
   ════════════════════════════════════════════════════════════ */
.is-light #starfield,
[data-theme="light"] #starfield { opacity:0; }
@media (prefers-color-scheme:light){ :root:not([data-theme="dark"]) #starfield{opacity:0;} }

/* 书法图 */
[data-theme="light"] .hero-calligraphy { mix-blend-mode:multiply; filter:none; }
@media (prefers-color-scheme:light){ :root:not([data-theme="dark"]) .hero-calligraphy{mix-blend-mode:multiply;filter:none;} }

/* 导航 */
[data-theme="light"] nav { background:rgba(255,255,255,.95); box-shadow:0 1px 0 #e8e8e8; }
@media (prefers-color-scheme:light){ :root:not([data-theme="dark"]) nav{background:rgba(255,255,255,.95);box-shadow:0 1px 0 #e8e8e8;} }

/* 页脚 */
[data-theme="light"] footer { background:#fafafa; border-top-color:#e8e8e8; }
@media (prefers-color-scheme:light){ :root:not([data-theme="dark"]) footer{background:#fafafa;border-top-color:#e8e8e8;} }

/* 通知条 */
[data-theme="light"] .notif-bar { background:rgba(255,255,255,.96); border-color:#e8e8e8; box-shadow:0 4px 20px rgba(0,0,0,.1); }
[data-theme="light"] .notif-text { color:#595959; }
[data-theme="light"] .notif-close { background:#f0f0f0; border-color:#e8e8e8; color:#8c8c8c; }
@media (prefers-color-scheme:light){ :root:not([data-theme="dark"]) .notif-bar{background:rgba(255,255,255,.96);border-color:#e8e8e8;box-shadow:0 4px 20px rgba(0,0,0,.1);} :root:not([data-theme="dark"]) .notif-text{color:#595959;} }

/* 写信卡片 */
[data-theme="light"] .card { background:#ffffff; border-color:#e8e8e8; box-shadow:0 2px 8px rgba(0,0,0,.06); backdrop-filter:none; }
[data-theme="light"] .r-toggle { background:#f5f5f5; border-color:#e8e8e8; }
[data-theme="light"] .chip { background:#f0f4ff; border-color:#d0deff; color:#2563eb; }
[data-theme="light"] .chip:hover { background:#dce8ff; }
[data-theme="light"] .pill { background:#ffffff; border-color:#e8e8e8; color:#595959; }
[data-theme="light"] .pill:hover { border-color:#1677ff; color:#1677ff; background:rgba(22,119,255,.04); }
[data-theme="light"] .pill.on { background:#1677ff; border-color:#1677ff; color:#fff; }
[data-theme="light"] .date-input { background:#ffffff; border-color:#e8e8e8; color:#1a1a1a; color-scheme:light; }
[data-theme="light"] .priv-btn { background:#ffffff; border-color:#e8e8e8; color:#595959; }
[data-theme="light"] .priv-btn.on { background:#f0f4ff; border-color:#2563eb; color:#2563eb; }
[data-theme="light"] .input { background:#ffffff; border-color:#e8e8e8; color:#1a1a1a; }
[data-theme="light"] .input:focus { border-color:#2563eb; background:#ffffff; }
[data-theme="light"] .email-clr { background:#f0f0f0; border-color:#e8e8e8; color:#8c8c8c; }
[data-theme="light"] .email-clr:hover { background:#e0e0e0; color:#1a1a1a; }
[data-theme="light"] .btn-submit:disabled { background:#f0f0f0; color:#8c8c8c; }
[data-theme="light"] .icon-btn { border-color:#e8e8e8; color:#8c8c8c; }
[data-theme="light"] .icon-btn:hover, [data-theme="light"] .icon-btn.active { background:#f0f4ff; border-color:#2563eb; color:#2563eb; }

/* 提取 & 信件预览 */
[data-theme="light"] .extract-card { background:#ffffff; border-color:#e8e8e8; }
[data-theme="light"] .extract-input { background:#ffffff; border-color:#e8e8e8; color:#1a1a1a; }
[data-theme="light"] .extract-btn { background:#f5f5f5; border-color:#e8e8e8; color:#1a1a1a; }
[data-theme="light"] .extract-btn:hover { background:#f0f4ff; border-color:#2563eb; color:#2563eb; }
[data-theme="light"] .letter-view { background:#ffffff; border-color:#e8e8e8; }

/* 统计条 */
[data-theme="light"] .stats { background:#ffffff; border-color:#e8e8e8; }
[data-theme="light"] .stat { border-right-color:#e8e8e8; }

/* 公开信卡片 */
[data-theme="light"] .letter-card { background:#ffffff; border-color:#e8e8e8; box-shadow:0 1px 4px rgba(0,0,0,.04); }
[data-theme="light"] .letter-card:hover { background:#fafafa; border-color:#d9d9d9; box-shadow:0 4px 12px rgba(0,0,0,.08); }
[data-theme="light"] .pub-page-hd { border-bottom-color:#e8e8e8; }
[data-theme="light"] .pub-card { background:#ffffff; border-color:#e8e8e8; box-shadow:0 1px 4px rgba(0,0,0,.04); }
[data-theme="light"] .pub-card:hover { border-color:#d0deff; box-shadow:0 6px 24px rgba(37,99,235,.09); }
[data-theme="light"] .pub-tl-pre { background:rgba(0,0,0,.03); border-color:#d9d9d9; color:#8c8c8c; }
[data-theme="light"] .pub-tl-from { color:#595959; }
[data-theme="light"] .pub-tl-to { color:#1677ff; }
[data-theme="light"] .pub-tl-deliver { background:rgba(22,119,255,.06); border-color:rgba(22,119,255,.2); color:#1677ff; }
[data-theme="light"] .pub-tl-span { background:rgba(99,102,241,.06); border-color:rgba(99,102,241,.18); color:#6366f1; }
[data-theme="light"] .pub-tl-span strong { color:#4f46e5; }
[data-theme="light"] .pg-btn { border-color:#e8e8e8; color:#595959; }
[data-theme="light"] .pg-active { background:#1677ff; border-color:#1677ff; }
[data-theme="light"] .tag { background:#f0f0f0; color:#595959; border:1px solid #e8e8e8; }
[data-theme="light"] .tag-blue { background:#f0f4ff; color:#2563eb; border-color:#d0deff; }
[data-theme="light"] .tag-green { background:#f0fff8; color:#059669; border-color:#a7f3d0; }
[data-theme="light"] .blur-mask { background:rgba(245,245,245,.88); color:#595959; }

/* 信件详情 */
[data-theme="light"] .letter-envelope { background:#ffffff; border-color:#e8e8e8; box-shadow:0 2px 12px rgba(0,0,0,.06); }
[data-theme="light"] .envelope-cover { background:#fafafa; border-bottom-color:#e8e8e8; }
[data-theme="light"] .env-tl-pre { background:rgba(0,0,0,.03); border-color:#d9d9d9; color:#8c8c8c; }
[data-theme="light"] .env-tl-from { color:#595959; }
[data-theme="light"] .env-tl-to { color:#1677ff; }
[data-theme="light"] .env-tl-deliver { background:rgba(22,119,255,.06); border-color:rgba(22,119,255,.2); color:#1677ff; }
[data-theme="light"] .env-tl-span { background:rgba(99,102,241,.06); border-color:rgba(99,102,241,.18); color:#6366f1; }
[data-theme="light"] .env-tl-span strong { color:#4f46e5; }
[data-theme="light"] .cta-card { background:#f0f4ff; border-color:#d0deff; }
[data-theme="light"] .like-btn { border-color:#e8e8e8; }
[data-theme="light"] .share-btn { border-color:#e8e8e8; }

/* 书法署名线 */
[data-theme="light"] .calligraphy-line { background:linear-gradient(to right,transparent,#d9d9d9 40%,#c0c0c0); }

/* 内容页通用 */
[data-theme="light"] .info-section h2 { border-bottom-color:#e8e8e8; }

/* 时间胶囊介绍 */
[data-theme="light"] .tc-hero-quote { background:#f0f4ff; border-left-color:#2563eb; }
[data-theme="light"] .tc-callout { background:#f0fff8; border-color:#a7f3d0; }
[data-theme="light"] .tc-cta { background:#f0f4ff; border-color:#d0deff; }
[data-theme="light"] .tc-step-num { background:#f0f4ff; border-color:#d0deff; }
[data-theme="light"] .tc-step-divider { background:#e8e8e8; }

/* 联系页 */
[data-theme="light"] .contact-card { background:#f0f4ff; border-color:#d0deff; }
[data-theme="light"] .contact-card-icon { background:#e0eaff; border-color:#d0deff; }
[data-theme="light"] .contact-topic-item { background:#ffffff; border-color:#e8e8e8; }
[data-theme="light"] .contact-tip { background:#fffbeb; border-color:#fde68a; }

/* FAQ */
[data-theme="light"] .faq-item { border-bottom-color:#e8e8e8; }
[data-theme="light"] .faq-group-title { border-bottom-color:#e8e8e8; }
[data-theme="light"] .faq-contact { background:#ffffff; border-color:#e8e8e8; }
[data-theme="light"] .faq-code { background:#f0f4ff; color:#2563eb; }

/* 条款页 */
[data-theme="light"] .terms-notice { background:#fffbeb; border-color:#fde68a; }

/* 推荐语页 */
[data-theme="light"] .voice-card { background:#ffffff; border-color:#e8e8e8; box-shadow:0 2px 8px rgba(0,0,0,.04); }
[data-theme="light"] .voice-card:hover { border-color:#d0deff; box-shadow:0 6px 20px rgba(37,99,235,.07); }
[data-theme="light"] .vc-foot { border-top-color:#e8e8e8; }
[data-theme="light"] .voices-more { background:#ffffff; border-color:#e8e8e8; }
[data-theme="light"] .voices-more-icon { background:#f0f4ff; border-color:#d0deff; }
[data-theme="light"] .vw-wrap { background:#ffffff; border-color:#e8e8e8; box-shadow:0 4px 24px rgba(0,0,0,.06); }
[data-theme="light"] .vw-author { border-top-color:#e8e8e8; }
[data-theme="light"] .vw-arr { border-color:#e8e8e8; color:#595959; }
[data-theme="light"] .vc-dot { background:#d9d9d9; }
[data-theme="light"] .vw-prog-wrap { background:#e8e8e8; }
[data-theme="light"] .vw-globe-wrap { opacity:.07; color:#2563eb; }

/* 树洞页 */
[data-theme="light"] .th-card { background:#ffffff; border-color:#e8e8e8; box-shadow:0 4px 24px rgba(0,0,0,.07); }
[data-theme="light"] .th-card-footer { border-top-color:#e8e8e8; }

/* @media 同步（系统偏好，未手动切换） */
@media (prefers-color-scheme:light){
    :root:not([data-theme="dark"]) .card{background:#ffffff;border-color:#e8e8e8;box-shadow:0 2px 8px rgba(0,0,0,.06);backdrop-filter:none;}
    :root:not([data-theme="dark"]) .letter-card{background:#ffffff;border-color:#e8e8e8;}
    :root:not([data-theme="dark"]) .pub-card{background:#ffffff;border-color:#e8e8e8;box-shadow:0 1px 4px rgba(0,0,0,.04);}
    :root:not([data-theme="dark"]) .pub-tl-pre{background:rgba(0,0,0,.03);border-color:#d9d9d9;color:#8c8c8c;}
    :root:not([data-theme="dark"]) .pub-tl-from{color:#595959;}
    :root:not([data-theme="dark"]) .pub-tl-deliver{background:rgba(22,119,255,.06);border-color:rgba(22,119,255,.2);color:#1677ff;}
    :root:not([data-theme="dark"]) .pub-tl-span{background:rgba(99,102,241,.06);border-color:rgba(99,102,241,.18);color:#6366f1;}
    :root:not([data-theme="dark"]) .pg-btn{border-color:#e8e8e8;color:#595959;}
    :root:not([data-theme="dark"]) .pg-active{background:#1677ff;border-color:#1677ff;}
    :root:not([data-theme="dark"]) .letter-envelope{background:#ffffff;border-color:#e8e8e8;box-shadow:0 2px 12px rgba(0,0,0,.06);}
    :root:not([data-theme="dark"]) .envelope-cover{background:#fafafa;border-bottom-color:#e8e8e8;}
    :root:not([data-theme="dark"]) .envelope-date-item{background:#ffffff;border-color:#e8e8e8;}
    :root:not([data-theme="dark"]) .envelope-date-open{background:#f0f4ff;border-color:#d0deff;}
    :root:not([data-theme="dark"]) .env-span-badge{background:linear-gradient(135deg,rgba(37,99,235,.06),rgba(124,58,237,.04));border-color:rgba(37,99,235,.18);}
    :root:not([data-theme="dark"]) .cta-card{background:#f0f4ff;border-color:#d0deff;}
    :root:not([data-theme="dark"]) .stats{background:#ffffff;border-color:#e8e8e8;}
    :root:not([data-theme="dark"]) .input{background:#ffffff;border-color:#e8e8e8;}
    :root:not([data-theme="dark"]) .date-input{background:#ffffff;border-color:#e8e8e8;color-scheme:light;}
    :root:not([data-theme="dark"]) .priv-btn{background:#ffffff;border-color:#e8e8e8;}
    :root:not([data-theme="dark"]) .blur-mask{background:rgba(245,245,245,.88);color:#595959;}
    :root:not([data-theme="dark"]) .voice-card{background:#ffffff;border-color:#e8e8e8;box-shadow:0 2px 8px rgba(0,0,0,.04);}
    :root:not([data-theme="dark"]) .vc-foot{border-top-color:#e8e8e8;}
    :root:not([data-theme="dark"]) .th-card{background:#ffffff;border-color:#e8e8e8;}
    :root:not([data-theme="dark"]) .tc-hero-quote{background:#f0f4ff;}
    :root:not([data-theme="dark"]) .tc-callout{background:#f0fff8;border-color:#a7f3d0;}
    :root:not([data-theme="dark"]) .contact-card{background:#f0f4ff;border-color:#d0deff;}
    :root:not([data-theme="dark"]) .contact-topic-item{background:#ffffff;border-color:#e8e8e8;}
}

/* ── 叶根友题字页面 ── */
.callig-page { position: relative; z-index: 1; }

/* 两幅题字展示 */
.callig-works-top {
    max-width: 860px;
    margin: 0 auto;
    padding: 56px 20px 24px;
}
.callig-works-intro {
    text-align: center;
    margin-bottom: 48px;
}
.callig-works-title {
    font-family: var(--serif);
    font-size: clamp(1.6rem, 4vw, 2.2rem);
    font-weight: 700;
    color: var(--t1);
    margin: 10px 0 14px;
    letter-spacing: .06em;
}
.callig-works-sub {
    font-family: var(--serif);
    font-size: 1rem;
    color: var(--t2);
    line-height: 1.9;
    letter-spacing: .04em;
}

/* 单幅作品卡片 */
.callig-work-card {
    margin-bottom: 40px;
}
.callig-work-card:last-child { margin-bottom: 0; }

.callig-work-card-img {
    position: relative;
    width: 100%;
    cursor: zoom-in;
    transition: transform .3s;
}
.callig-work-card-img:hover { transform: translateY(-2px); }

/* 第一幅：透明PNG，无外框，直接展示 */
.callig-work-card-img .callig-img {
    display: block;
    width: 100%;
    height: auto;
    mix-blend-mode: screen;
    filter: drop-shadow(0 0 24px rgba(96,165,250,.2));
}
[data-theme="light"] .callig-work-card-img .callig-img {
    mix-blend-mode: multiply;
    filter: none;
}

/* 第二幅：JPG实景图，带圆角和外框 */
.callig-work-card-img-photo {
    border-radius: var(--r-lg);
    overflow: hidden;
    border: 1px solid var(--border);
    background: rgba(255,255,255,.02);
}
[data-theme="light"] .callig-work-card-img-photo { background: rgba(255,255,255,.6); }
.callig-work-card-img-photo:hover { border-color: var(--border2); }
.callig-work-card-img-photo img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    mix-blend-mode: normal !important;
    filter: none !important;
}

/* 作品标签区（图片下方）*/
.callig-work-card-meta {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 14px;
    margin-top: 18px;
}
.callig-work-card-label {
    display: inline-block;
    font-size: .66rem;
    letter-spacing: .2em;
    color: var(--blue3);
    background: rgba(37,99,235,.1);
    border: 1px solid rgba(96,165,250,.2);
    border-radius: var(--r-full);
    padding: 3px 12px;
    font-weight: 600;
    font-family: var(--serif);
}
.callig-work-card-name {
    font-family: var(--serif);
    font-size: 1rem;
    font-weight: 600;
    color: var(--t1);
    letter-spacing: .08em;
}

.callig-container {
    max-width: 760px;
    margin: 0 auto;
    padding: 72px 20px 80px;
}

/* 引言 */
.callig-quote { text-align: center; padding: 32px 0 56px; }
.callig-quote-mark {
    font-family: Georgia, serif;
    font-size: 6rem;
    color: var(--blue3);
    line-height: .4;
    opacity: .25;
    margin-bottom: 24px;
}
.callig-quote-text {
    font-family: var(--serif);
    font-size: clamp(1.6rem, 3.6vw, 2.4rem);
    font-weight: 700;
    color: var(--t1);
    margin-bottom: 14px;
    letter-spacing: .08em;
}
.callig-quote-sub {
    font-family: var(--serif);
    font-size: 1rem;
    color: var(--t2);
    font-style: italic;
    letter-spacing: .04em;
}

/* 分割线 */
.callig-divider { display: flex; align-items: center; gap: 14px; }
.callig-divider-dot {
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--blue3);
    opacity: .4;
    flex-shrink: 0;
}
.callig-divider-line {
    flex: 1; height: 1px;
    background: linear-gradient(to right,
    rgba(96,165,250,.1), rgba(96,165,250,.3), rgba(96,165,250,.1));
}

/* 人物区 */
.callig-person {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 28px;
    align-items: center;
    margin-top: 56px;
    margin-bottom: 28px;
}
.callig-person-photo {
    width: 140px;
    height: 140px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid var(--border2);
    position: relative;
    cursor: zoom-in;
    transition: transform .3s;
}
.callig-person-photo:hover { transform: scale(1.03); }
.callig-person-photo::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    box-shadow: inset 0 0 40px rgba(37,99,235,.15);
    pointer-events: none;
}
.callig-person-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.callig-person-info .callig-section-label { margin-bottom: 8px; }
.callig-person-info .callig-name {
    font-size: clamp(1.8rem, 4vw, 2.4rem);
    margin-bottom: 10px;
}
.callig-person-title {
    font-family: var(--serif);
    font-size: 1.05rem;
    color: var(--t2);
    margin-bottom: 16px;
    letter-spacing: .06em;
}
.callig-person-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.callig-person-tag {
    display: inline-block;
    font-size: .74rem;
    color: var(--t2);
    background: rgba(255,255,255,.04);
    border: 1px solid var(--border);
    border-radius: var(--r-full);
    padding: 4px 12px;
    letter-spacing: .04em;
    font-family: var(--serif);
}
[data-theme="light"] .callig-person-tag { background: rgba(255,255,255,.6); }

/* 人物信息 */
.callig-section-label {
    font-size: .72rem;
    letter-spacing: .3em;
    color: var(--blue3);
    margin-bottom: 16px;
    font-weight: 600;
    font-family: var(--serif);
}
.callig-name {
    font-family: var(--serif);
    font-size: clamp(2.2rem, 5vw, 3rem);
    font-weight: 700;
    color: var(--t1);
    margin-bottom: 12px;
    letter-spacing: .04em;
}
.callig-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: .85rem;
    color: var(--t2);
    font-family: var(--serif);
    flex-wrap: wrap;
}
.callig-meta-sep { color: var(--t3); }
.callig-intro {
    margin-top: 0;
    margin-bottom: 36px;
    font-family: var(--serif);
    font-size: .95rem;
    color: var(--t2);
    line-height: 2.1;
    text-align: justify;
    padding-left: 16px;
    border-left: 2px solid var(--border2);
}

/* 成就卡片 */
.callig-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-top: 16px;
}
.callig-card {
    background: rgba(255,255,255,.04);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    padding: 24px 20px;
    transition: all .25s;
}
.callig-card:hover {
    border-color: var(--border2);
    background: rgba(255,255,255,.06);
    transform: translateY(-2px);
}
[data-theme="light"] .callig-card { background: rgba(255,255,255,.7); }
.callig-card-num {
    font-family: monospace;
    font-size: 2rem;
    font-weight: 700;
    color: var(--blue3);
    margin-bottom: 8px;
    line-height: 1;
}
.callig-card-unit { font-size: 1rem; color: var(--blue4); margin-left: 2px; }
.callig-card-label {
    font-size: .82rem;
    font-weight: 600;
    color: var(--t1);
    margin-bottom: 10px;
    letter-spacing: .04em;
}
.callig-card-desc {
    font-size: .8rem;
    color: var(--t2);
    line-height: 1.8;
}

/* 重点作品 */
.callig-work-major { }
.callig-work-major-header {
    text-align: center;
    margin-bottom: 32px;
}
.callig-work-major-year {
    display: inline-block;
    font-family: monospace;
    font-size: .75rem;
    font-weight: 600;
    color: var(--blue3);
    background: rgba(37,99,235,.12);
    border: 1px solid rgba(96,165,250,.25);
    border-radius: var(--r-full);
    padding: 4px 14px;
    margin-bottom: 18px;
    letter-spacing: .08em;
}
.callig-work-major-title {
    font-family: var(--serif);
    font-size: clamp(1.6rem, 4vw, 2.2rem);
    font-weight: 700;
    color: var(--t1);
    margin-bottom: 12px;
    letter-spacing: .04em;
}
.callig-work-major-sub {
    font-family: var(--serif);
    font-size: .95rem;
    color: var(--t2);
    letter-spacing: .06em;
}
.callig-work-major-desc {
    font-family: var(--serif);
    font-size: .98rem;
    color: var(--t2);
    line-height: 2;
    margin-bottom: 40px;
    max-width: 620px;
    margin-left: auto;
    margin-right: auto;
}
.callig-work-major-desc p {
    margin-bottom: 16px;
}
.callig-work-major-desc p:last-child { margin-bottom: 0; }
.callig-work-major-desc strong {
    color: var(--t1);
    font-weight: 600;
}

/* 图片画廊 - 2x2 宫格（中国梦）*/
.callig-gallery {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}
.callig-gallery-item {
    position: relative;
    overflow: hidden;
    border-radius: var(--r-md);
    border: 1px solid var(--border);
    background: rgba(255,255,255,.03);
    cursor: zoom-in;
    transition: border-color .2s, transform .3s;
    aspect-ratio: 4 / 3;
}
[data-theme="light"] .callig-gallery-item { background: rgba(255,255,255,.6); }
.callig-gallery-item:hover {
    border-color: var(--border2);
    transform: translateY(-2px);
}
.callig-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    transition: transform .4s;
}
.callig-gallery-item:hover img { transform: scale(1.05); }

/* 单张大图（阿里巴巴）*/
.callig-gallery-single {
    position: relative;
    overflow: hidden;
    border-radius: var(--r-lg);
    border: 1px solid var(--border);
    background: rgba(255,255,255,.03);
    cursor: zoom-in;
    transition: border-color .2s;
}
[data-theme="light"] .callig-gallery-single { background: rgba(255,255,255,.6); }
.callig-gallery-single:hover { border-color: var(--border2); }
.callig-gallery-single img {
    width: 100%;
    height: auto;
    object-fit: contain;
    display: block;
    transition: transform .4s;
}
.callig-gallery-single:hover img { transform: scale(1.02); }

/* 其他作品列表 */
.callig-works {
    margin-top: 24px;
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    overflow: hidden;
    background: rgba(255,255,255,.02);
}
[data-theme="light"] .callig-works { background: rgba(255,255,255,.6); }
.callig-work-item {
    padding: 22px 24px;
    border-bottom: 1px solid var(--border);
    transition: background .2s;
}
.callig-work-item:last-child { border-bottom: none; }
.callig-work-item:hover { background: rgba(255,255,255,.03); }
.callig-work-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}
.callig-work-year {
    font-family: monospace;
    font-size: .72rem;
    font-weight: 600;
    color: var(--blue3);
    background: rgba(37,99,235,.12);
    border: 1px solid rgba(96,165,250,.2);
    border-radius: var(--r-full);
    padding: 2px 10px;
    white-space: nowrap;
    letter-spacing: .04em;
}
.callig-work-title {
    font-family: var(--serif);
    font-size: .92rem;
    font-weight: 600;
    color: var(--t1);
    letter-spacing: .04em;
}
.callig-work-desc {
    font-size: .85rem;
    color: var(--t2);
    line-height: 1.95;
}

/* 故事 */
.callig-story {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-top: 20px;
}
.callig-story p {
    font-family: var(--serif);
    font-size: 1rem;
    color: var(--t2);
    line-height: 2.1;
}
.callig-story-end {
    font-family: var(--serif);
    font-size: 1.15rem !important;
    font-weight: 700;
    color: var(--t1) !important;
    letter-spacing: .12em;
    text-align: center;
    margin-top: 36px !important;
    padding-top: 28px !important;
    border-top: 1px solid var(--border2);
}

/* 2026 节内部小节 */
.about-section-bridge {
    margin-top: 56px;
    padding-top: 40px;
    border-top: 1px solid var(--border);
}
.about-section-bridge .about-section-label {
    margin-bottom: 20px;
}

/* CTA */
.callig-cta {
    text-align: center;
    background: rgba(37,99,235,.08);
    border: 1px solid rgba(96,165,250,.2);
    border-radius: var(--r-xl);
    padding: 52px 40px;
    margin-top: 64px;
}
.callig-cta h3 {
    font-family: var(--serif);
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--t1);
    margin-bottom: 14px;
    letter-spacing: .04em;
}
.callig-cta p {
    font-size: .92rem;
    color: var(--t2);
    margin-bottom: 28px;
    line-height: 1.9;
}

/* 灯箱 Lightbox */
.lightbox {
    position: fixed;
    inset: 0;
    background: rgba(10, 22, 40, .95);
    backdrop-filter: blur(10px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px;
    z-index: 1000;
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s ease;
    cursor: zoom-out;
}
.lightbox.on {
    opacity: 1;
    pointer-events: auto;
}
.lightbox-img {
    max-width: 100%;
    max-height: 85vh;
    object-fit: contain;
    border-radius: var(--r-md);
    box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
    animation: lb-in .35s cubic-bezier(.2, .8, .4, 1);
}
@keyframes lb-in {
    from { transform: scale(.92); opacity: 0; }
    to   { transform: scale(1);   opacity: 1; }
}
.lightbox-caption {
    color: var(--t2);
    font-family: var(--serif);
    font-size: .9rem;
    letter-spacing: .1em;
    margin-top: 20px;
    text-align: center;
}
.lightbox-close {
    position: absolute;
    top: 24px;
    right: 32px;
    font-size: 2rem;
    color: var(--t2);
    cursor: pointer;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .05);
    border: 1px solid var(--border2);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s;
    line-height: 1;
}
.lightbox-close:hover {
    background: rgba(255, 255, 255, .12);
    color: var(--t1);
    transform: rotate(90deg);
}

/* 响应式 */
@media (max-width: 720px) {
    .callig-hero { padding: 36px 14px 12px; }
    .callig-container { padding: 48px 16px 60px; }
    .callig-person {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 24px;
    }
    .callig-person-photo {
        width: 140px;
        height: 140px;
        margin: 0 auto;
    }
    .callig-person-info .callig-meta { justify-content: center; }
    .callig-person-info .callig-intro { text-align: left; }
    .callig-cards { grid-template-columns: 1fr; }
    .callig-gallery { grid-template-columns: 1fr; gap: 10px; }
    .callig-cta { padding: 36px 20px; }
    .callig-work-major-desc { text-align: left; }
    .lightbox { padding: 20px; }
    .lightbox-close { top: 16px; right: 16px; }
}

/* ──────────────────────────────────────────────── */
/* ──             关于梦想网页面                  ── */
/* ──────────────────────────────────────────────── */

.about-page { position: relative; z-index: 1; }

/* Hero */
.about-hero {
    text-align: center;
    padding: 96px 20px 72px;
    max-width: 900px;
    margin: 0 auto;
    position: relative;
}
.about-section-label {
    font-size: .72rem;
    letter-spacing: .3em;
    color: var(--blue3);
    margin-bottom: 28px;
    font-weight: 600;
    font-family: var(--serif);
}
.about-hero-title {
    font-family: var(--serif);
    font-size: clamp(2.4rem, 6vw, 4rem);
    font-weight: 700;
    color: var(--t1);
    line-height: 1.3;
    letter-spacing: .08em;
    margin-bottom: 24px;
}
.about-hero-title em {
    font-style: normal;
    color: var(--blue3);
}
.about-hero-sub {
    font-family: var(--serif);
    font-size: .95rem;
    color: var(--t3);
    letter-spacing: .18em;
}

.about-container {
    max-width: 760px;
    margin: 0 auto;
    padding: 0 20px 80px;
}

/* 分割线 */
.about-divider {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 72px 0;
}
.about-divider-dot {
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--blue3);
    opacity: .4;
    flex-shrink: 0;
}
.about-divider-line {
    flex: 1; height: 1px;
    background: linear-gradient(to right,
    rgba(96,165,250,.1), rgba(96,165,250,.3), rgba(96,165,250,.1));
}

/* 标题 h2 */
.about-h2 {
    font-family: var(--serif);
    font-size: clamp(1.6rem, 3.6vw, 2.2rem);
    font-weight: 700;
    color: var(--t1);
    line-height: 1.4;
    letter-spacing: .06em;
    margin-bottom: 36px;
}

/* 引言区 */
.about-quote-section {
    padding: 48px 0;
    text-align: center;
}
.about-quote {
    max-width: 620px;
    margin: 0 auto;
    border-left: none;
    padding: 0;
    position: relative;
}
.about-quote::before {
    content: '"';
    display: block;
    font-family: Georgia, serif;
    font-size: 5rem;
    color: var(--blue3);
    opacity: .25;
    line-height: .4;
    margin-bottom: 28px;
}
.about-quote-text {
    font-family: var(--serif);
    font-size: clamp(1.3rem, 3vw, 1.8rem);
    font-weight: 700;
    color: var(--t1);
    line-height: 1.7;
    letter-spacing: .1em;
    margin-bottom: 12px;
}
.about-quote-text:last-of-type { margin-bottom: 0; }
.about-quote-footer {
    margin-top: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-family: var(--serif);
    font-size: .85rem;
    color: var(--t2);
    letter-spacing: .1em;
}
.about-quote-sep {
    color: var(--t3);
    opacity: .6;
}

/* 故事正文 */
.about-story { }
.about-story-body {
    max-width: 620px;
    margin: 0 auto;
}
.about-story-body p {
    font-family: var(--serif);
    font-size: 1rem;
    color: var(--t2);
    line-height: 2.1;
    margin-bottom: 18px;
    letter-spacing: .02em;
}
.about-story-body p strong {
    color: var(--t1);
    font-weight: 600;
}
.about-story-body p:last-child { margin-bottom: 0; }

/* 中间强调句 */
.about-pullquote {
    font-family: var(--serif) !important;
    font-size: 1.4rem !important;
    font-weight: 700 !important;
    color: var(--blue3) !important;
    text-align: center;
    padding: 20px 0 !important;
    margin: 24px 0 !important;
    letter-spacing: .15em !important;
    line-height: 1.6 !important;
}

/* 故事结尾 */
.about-story-end {
    font-family: var(--serif) !important;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    color: var(--t1) !important;
    text-align: center;
    letter-spacing: .15em !important;
    margin-top: 32px !important;
    padding-top: 28px;
    border-top: 1px solid var(--border);
}

/* 时间线 */
.about-timeline {
    list-style: none;
    padding: 0;
    margin: 48px auto 0;
    max-width: 620px;
    position: relative;
}
.about-timeline::before {
    content: '';
    position: absolute;
    left: 76px;
    top: 20px;
    bottom: 20px;
    width: 1px;
    background: linear-gradient(to bottom,
    transparent, rgba(96,165,250,.3) 10%, rgba(96,165,250,.3) 90%, transparent);
}
.about-timeline-item {
    position: relative;
    display: grid;
    grid-template-columns: 96px 1fr;
    gap: 28px;
    align-items: flex-start;
    padding: 0 0 40px 0;
}
.about-timeline-item:last-child { padding-bottom: 0; }
.about-timeline-item::before {
    content: '';
    position: absolute;
    left: 72px;
    top: 12px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--blue3);
    border: 2px solid var(--bg);
    box-shadow: 0 0 0 1px rgba(96,165,250,.4);
}
.about-timeline-year {
    font-family: monospace;
    font-size: 1rem;
    font-weight: 700;
    color: var(--blue3);
    letter-spacing: .08em;
    line-height: 1.5;
    text-align: right;
    padding-right: 4px;
}
.about-timeline-content h3 {
    font-family: var(--serif);
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--t1);
    margin-bottom: 8px;
    letter-spacing: .06em;
}
.about-timeline-content p {
    font-family: var(--serif);
    font-size: .92rem;
    color: var(--t2);
    line-height: 1.95;
    letter-spacing: .02em;
}

/* 创始人 */
.about-founder { text-align: left; }
.about-founder-title {
    font-family: var(--serif);
    font-size: 1rem;
    color: var(--t2);
    margin-top: -20px;
    margin-bottom: 32px;
    letter-spacing: .06em;
}
.about-founder-body {
    max-width: 620px;
    border-left: 2px solid var(--blue3);
    padding: 4px 0 4px 24px;
}
.about-founder-body p {
    font-family: var(--serif);
    font-size: 1rem;
    color: var(--t2);
    line-height: 2.1;
    margin-bottom: 16px;
    letter-spacing: .02em;
}
.about-founder-body p:last-child { margin-bottom: 0; }
.about-founder-body p strong {
    color: var(--t1);
    font-weight: 600;
}

/* 使命 */
.about-mission {
    text-align: center;
    padding: 80px 20px;
    margin: 40px 0;
}
.about-mission-line {
    width: 60px;
    height: 1px;
    background: var(--blue3);
    margin: 0 auto 32px;
    opacity: .6;
}
.about-mission-line:last-child {
    margin: 32px auto 0;
}
.about-mission-text {
    font-family: var(--serif);
    font-size: clamp(1.4rem, 3.6vw, 2rem);
    font-weight: 700;
    color: var(--t1);
    line-height: 1.8;
    letter-spacing: .15em;
}

/* 2026 节内部小节 */
.about-section-bridge {
    margin-top: 56px;
    padding-top: 40px;
    border-top: 1px solid var(--border);
}
.about-section-bridge .about-section-label {
    margin-bottom: 20px;
}

/* CTA */
.about-cta {
    text-align: center;
    background: rgba(37,99,235,.08);
    border: 1px solid rgba(96,165,250,.2);
    border-radius: var(--r-xl);
    padding: 56px 40px;
    margin-top: 40px;
}
.about-cta h3 {
    font-family: var(--serif);
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--t1);
    margin-bottom: 12px;
    letter-spacing: .08em;
}
.about-cta p {
    font-size: .95rem;
    color: var(--t2);
    margin-bottom: 28px;
    letter-spacing: .04em;
}

/* 响应式 */
@media (max-width: 680px) {
    .about-hero { padding: 56px 16px 40px; }
    .about-container { padding: 0 16px 60px; }
    .about-divider { margin: 48px 0; }
    .about-timeline::before { left: 52px; }
    .about-timeline-item {
        grid-template-columns: 68px 1fr;
        gap: 20px;
    }
    .about-timeline-item::before { left: 48px; }
    .about-founder-body { padding-left: 16px; }
    .about-cta { padding: 40px 20px; }
    .about-mission { padding: 56px 16px; }
}

/* ── 关于梦想网页面 ── */
.about-page { position: relative; z-index: 1; }

/* Hero */
.about-hero {
    text-align: center;
    padding: 96px 20px 80px;
    max-width: 900px;
    margin: 0 auto;
}
.about-section-label {
    font-size: .72rem;
    letter-spacing: .3em;
    color: var(--blue3);
    margin-bottom: 24px;
    font-weight: 600;
    font-family: var(--serif);
    display: block;
}
.about-hero-title {
    font-family: var(--serif);
    font-size: clamp(2.4rem, 6vw, 4.2rem);
    font-weight: 700;
    color: var(--t1);
    line-height: 1.3;
    letter-spacing: .1em;
    margin-bottom: 24px;
}
.about-hero-title em {
    font-style: normal;
    color: var(--blue3);
}
.about-hero-tagline {
    font-family: var(--serif);
    font-size: 1rem;
    color: var(--t2);
    letter-spacing: .06em;
    line-height: 1.9;
    margin-bottom: 20px;
}
.about-hero-sub {
    font-family: var(--serif);
    font-size: .85rem;
    color: var(--t3);
    letter-spacing: .2em;
}

.about-container {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 20px 80px;
}

/* 分割线 */
.about-divider {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 80px 0;
}
.about-divider-dot {
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--blue3);
    opacity: .4;
    flex-shrink: 0;
}
.about-divider-line {
    flex: 1; height: 1px;
    background: linear-gradient(to right,
    rgba(96,165,250,.1),
    rgba(96,165,250,.35),
    rgba(96,165,250,.1));
}

/* 年份标记 */
.about-era { margin-bottom: 0; }
.about-era-year {
    font-family: monospace;
    font-size: clamp(3rem, 7vw, 5rem);
    font-weight: 700;
    color: var(--blue3);
    opacity: .18;
    letter-spacing: .04em;
    line-height: 1;
    margin-bottom: 32px;
    user-select: none;
}

/* 图文双栏 */
.about-era-body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items: center;
}
.about-era-body-reverse { direction: rtl; }
.about-era-body-reverse > * { direction: ltr; }

/* 图片 */
.about-era-img-wrap { }
.about-era-img {
    width: 100%;
    height: auto;
    border-radius: var(--r-lg);
    display: block;
    border: 1px solid var(--border);
    transition: transform .3s;
    cursor: zoom-in;
}
.about-era-img:hover { transform: scale(1.02); border-color: var(--border2); }
[data-theme="light"] .about-era-img { border-color: var(--border2); }
.about-era-img-caption {
    margin-top: 12px;
    font-size: .72rem;
    color: var(--t3);
    letter-spacing: .1em;
    text-align: center;
    font-family: var(--serif);
}

/* h2 */
.about-h2 {
    font-family: var(--serif);
    font-size: clamp(1.6rem, 3.6vw, 2.2rem);
    font-weight: 700;
    color: var(--t1);
    line-height: 1.4;
    letter-spacing: .06em;
    margin-bottom: 16px;
}

/* 内容区 */
.about-era-source {
    font-family: var(--serif);
    font-size: .85rem;
    color: var(--t3);
    letter-spacing: .12em;
    margin-bottom: 20px;
}
.about-era-source::before { content: '— '; }
.about-era-date {
    font-family: monospace;
    font-size: .85rem;
    color: var(--blue3);
    letter-spacing: .1em;
    margin-bottom: 16px;
}
.about-era-desc {
    font-family: var(--serif);
    font-size: .95rem;
    color: var(--t2);
    line-height: 2;
    letter-spacing: .02em;
}

/* 马云讲话引用 */
.about-speech {
    margin: 28px 0 20px;
    padding: 24px 28px;
    background: rgba(37,99,235,.07);
    border-left: 3px solid var(--blue3);
    border-radius: 0 var(--r-md) var(--r-md) 0;
}
[data-theme="light"] .about-speech { background: rgba(37,99,235,.05); }
.about-speech p {
    font-family: var(--serif);
    font-size: .95rem;
    color: var(--t2);
    line-height: 1.95;
    margin-bottom: 6px;
    letter-spacing: .02em;
}
.about-speech p:last-of-type { margin-bottom: 16px; }
.about-speech p strong {
    color: var(--blue3);
    font-weight: 700;
}
.about-speech footer {
    font-family: var(--serif);
    font-size: .78rem;
    color: var(--t3);
    letter-spacing: .1em;
}
.about-speech footer::before { content: '— '; }

/* 注释小字 */
.about-era-note {
    font-family: var(--serif);
    font-size: .88rem;
    color: var(--blue3);
    letter-spacing: .06em;
    font-style: italic;
    margin-top: 16px;
}

/* 马云全网金句 */
.about-maxim {
    text-align: center;
    padding: 60px 20px;
    max-width: 680px;
    margin: 0 auto;
}
.about-maxim-text {
    font-family: var(--serif);
    font-size: clamp(1.5rem, 3.5vw, 2.2rem);
    font-weight: 700;
    color: var(--t1);
    letter-spacing: .12em;
    line-height: 1.6;
    margin-bottom: 20px;
}
.about-maxim-source {
    font-family: var(--serif);
    font-size: .85rem;
    color: var(--t3);
    letter-spacing: .15em;
}
.about-maxim-source::before { content: '— '; }

/* 居中内容区 */
.about-era-content-center {
    max-width: 680px;
    margin: 0 auto;
}

/* 故事正文 */
.about-story-body {
    max-width: 640px;
    margin: 0 auto 0;
}
.about-story-body p {
    font-family: var(--serif);
    font-size: .98rem;
    color: var(--t2);
    line-height: 2.1;
    margin-bottom: 18px;
    letter-spacing: .02em;
}
.about-story-body p:last-child { margin-bottom: 0; }
.about-story-body strong { color: var(--t1); font-weight: 600; }

/* 顿悟强调句 */
.about-pullquote {
    font-family: var(--serif);
    font-size: clamp(1.1rem, 2.4vw, 1.4rem);
    font-weight: 700;
    color: var(--blue3);
    text-align: center;
    line-height: 1.9;
    letter-spacing: .08em;
    padding: 32px 40px;
    margin: 32px auto;
    max-width: 560px;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    position: relative;
}
.about-pullquote::before,
.about-pullquote::after {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 32px;
    height: 1px;
    background: var(--blue3);
    opacity: .6;
}
.about-pullquote::before { top: -1px; }
.about-pullquote::after  { bottom: -1px; }

/* 日期大卡 */
.about-date-card {
    background: rgba(37,99,235,.08);
    border: 1px solid rgba(96,165,250,.22);
    border-radius: var(--r-xl);
    padding: 36px 40px;
    text-align: center;
    margin: 40px auto;
    max-width: 520px;
}
.about-date-main {
    font-family: monospace;
    font-size: clamp(1.8rem, 4vw, 2.6rem);
    font-weight: 700;
    color: var(--blue3);
    letter-spacing: .06em;
    margin-bottom: 10px;
}
.about-date-sub {
    font-family: var(--serif);
    font-size: 1rem;
    font-weight: 600;
    color: var(--t1);
    letter-spacing: .06em;
    margin-bottom: 16px;
}
.about-date-note {
    font-family: var(--serif);
    font-size: .82rem;
    color: var(--t3);
    line-height: 1.8;
    letter-spacing: .04em;
}

/* 故事结尾 */
.about-story-end {
    font-family: var(--serif) !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    color: var(--t1) !important;
    text-align: center !important;
    letter-spacing: .16em !important;
    margin-top: 36px !important;
    padding-top: 28px !important;
    border-top: 1px solid var(--border) !important;
    margin-bottom: 0 !important;
}

/* 叶根友卡片 */
.about-ygy-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
    background: rgba(255,255,255,.03);
    border: 1px solid var(--border);
    border-radius: var(--r-xl);
    padding: 36px 40px;
    margin-top: 40px;
}
[data-theme="light"] .about-ygy-card { background: rgba(255,255,255,.6); }
.about-ygy-imgs { overflow: hidden; }
.about-ygy-img-main {
    width: 100%;
    height: auto;
    display: block;
    mix-blend-mode: screen;
    filter: drop-shadow(0 0 16px rgba(96,165,250,.2));
}
[data-theme="light"] .about-ygy-img-main {
    mix-blend-mode: multiply;
    filter: none;
}
.about-ygy-name {
    font-family: var(--serif);
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--t1);
    margin-bottom: 12px;
    letter-spacing: .06em;
}
.about-ygy-desc {
    font-family: var(--serif);
    font-size: .88rem;
    color: var(--t2);
    line-height: 1.95;
    margin-bottom: 20px;
}
.about-ygy-link {
    display: inline-block;
    font-size: .85rem;
    color: var(--blue3);
    letter-spacing: .06em;
    font-family: var(--serif);
    transition: all .2s;
}
.about-ygy-link:hover {
    color: var(--blue4);
    letter-spacing: .12em;
}

/* 创始人 */
.about-founder { }
.about-founder-title {
    font-family: var(--serif);
    font-size: .95rem;
    color: var(--t2);
    margin-top: -20px;
    margin-bottom: 32px;
    letter-spacing: .06em;
}
.about-founder-body {
    max-width: 100%;
    border-left: 2px solid var(--blue3);
    padding: 8px 0 8px 28px;
}
.about-founder-body p {
    font-family: var(--serif);
    font-size: 1.05rem;
    color: var(--t2);
    line-height: 2.2;
    margin-bottom: 20px;
    letter-spacing: .03em;
}
.about-founder-body p:last-child { margin-bottom: 0; }
.about-founder-body strong { color: var(--t1); font-weight: 600; }

/* 使命 */
.about-mission {
    text-align: center;
    padding: 80px 20px;
}
.about-mission-inner {
    display: inline-block;
    position: relative;
    padding: 0 52px;
}
.about-mission-inner::before,
.about-mission-inner::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 40px;
    height: 1px;
    background: var(--blue3);
    opacity: .5;
}
.about-mission-inner::before { left: 0; }
.about-mission-inner::after  { right: 0; }
.about-mission-text {
    font-family: var(--serif);
    font-size: clamp(1.4rem, 3.6vw, 2.1rem);
    font-weight: 700;
    color: var(--t1);
    line-height: 2;
    letter-spacing: .18em;
}

/* 2026 节内部小节 */
.about-section-bridge {
    margin-top: 56px;
    padding-top: 40px;
    border-top: 1px solid var(--border);
}
.about-section-bridge .about-section-label {
    margin-bottom: 20px;
}

/* CTA */
.about-cta {
    text-align: center;
    background: rgba(37,99,235,.08);
    border: 1px solid rgba(96,165,250,.2);
    border-radius: var(--r-xl);
    padding: 56px 40px;
}
.about-cta h3 {
    font-family: var(--serif);
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--t1);
    margin-bottom: 12px;
    letter-spacing: .08em;
}
.about-cta p {
    font-size: .95rem;
    color: var(--t2);
    margin-bottom: 28px;
    letter-spacing: .06em;
    font-family: var(--serif);
}

/* 响应式 */
@media (max-width: 760px) {
    .about-hero { padding: 56px 16px 48px; }
    .about-container { padding: 0 16px 60px; }
    .about-divider { margin: 56px 0; }
    .about-era-body,
    .about-era-body-reverse {
        grid-template-columns: 1fr;
        direction: ltr;
        gap: 32px;
    }
    .about-date-card { padding: 28px 20px; }
    .about-ygy-card { grid-template-columns: 1fr; gap: 24px; padding: 24px; }
    .about-founder-body { padding-left: 16px; }
    .about-mission-inner { padding: 0 32px; }
    .about-cta { padding: 40px 20px; }
    .about-speech { padding: 18px 20px; }
}

/* ── 推荐语页 ── */
.voices-page   { max-width: 700px; }
.voices-hd     { text-align: center; margin-bottom: 52px; }
.voices-badge  { display: inline-block; background: rgba(96,165,250,.1); border: 1px solid rgba(96,165,250,.2); color: var(--blue4); font-size: .68rem; font-weight: 700; letter-spacing: .16em; padding: 5px 16px; border-radius: var(--r-full); text-transform: uppercase; margin-bottom: 20px; }
.voices-title  { font-family: var(--serif); font-size: clamp(1.8rem,4vw,2.5rem); font-weight: 700; color: var(--t1); margin-bottom: 12px; }
.voices-sub    { font-size: .9rem; color: var(--t2); line-height: 1.9; }
.voices-list   { display: flex; flex-direction: column; gap: 16px; margin-bottom: 40px; }

/* Voice card */
.voice-card    { background: rgba(255,255,255,.04); border: 1px solid var(--border); border-radius: var(--r-xl); padding: 36px 40px 28px; animation: th-fadein .5s ease both; transition: border-color .25s, transform .22s; }
.voice-card:hover { border-color: var(--border2); transform: translateY(-2px); }
.vc-qmark      { display: block; font-family: Georgia,var(--serif); font-size: 4.4rem; line-height: .75; color: var(--blue4); opacity: .2; user-select: none; margin-bottom: 10px; }
.vc-quote      { font-family: var(--serif); font-size: 1.06rem; line-height: 2.05; color: var(--t1); margin: 0 0 24px; font-style: normal; }
.vc-foot       { display: flex; align-items: center; gap: 13px; padding-top: 20px; border-top: 1px solid var(--border); }
.vc-avatar     { flex-shrink: 0; width: 42px; height: 42px; border-radius: 50%; background: linear-gradient(135deg,#3b82f6,#818cf8); display: flex; align-items: center; justify-content: center; font-family: var(--serif); font-size: 1rem; font-weight: 700; color: #fff; }
.vc-name       { font-size: .92rem; font-weight: 700; color: var(--t1); margin-bottom: 4px; }
.vc-meta       { font-size: .76rem; color: var(--t3); line-height: 1.5; }

.voices-more   { background: rgba(255,255,255,.03); border: 1px solid var(--border); border-radius: var(--r-xl); padding: 28px 32px; margin-bottom: 8px; }
.voices-more-inner{ display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.voices-more-icon { flex-shrink: 0; width: 48px; height: 48px; border-radius: var(--r-lg); background: rgba(96,165,250,.08); border: 1px solid var(--border2); display: flex; align-items: center; justify-content: center; color: var(--blue4); }
.voices-more-title{ font-weight: 700; color: var(--t1); margin-bottom: 4px; font-size: .92rem; }
.voices-more-desc { font-size: .82rem; color: var(--t3); }
.voices-more-btn  { margin-left: auto; padding: 10px 24px; border: 1px solid var(--border2); border-radius: var(--r-full); font-size: .82rem; color: var(--t2); white-space: nowrap; transition: all .2s; }
.voices-more-btn:hover { border-color: rgba(96,165,250,.4); color: var(--blue4); background: rgba(37,99,235,.06); }
@media (max-width: 600px) {
    .voices-grid { grid-template-columns: 1fr; }
    .voices-more-btn { margin-left: 0; }
    .vw-wrap { padding: 36px 22px 28px; }
    .vw-globe-wrap { display: none; }
    .vc-js .vw-track { min-height: 360px; }
    .vw-qmark { font-size: 3.8rem; }
}

/* ── 地球仪轮播 ── */
.vw-wrap { position:relative; background:rgba(255,255,255,.03); border:1px solid var(--border); border-radius:var(--r-xl); padding:52px 64px 36px; margin:0 auto 40px; max-width:720px; overflow:hidden; }

/* Globe decoration */
.vw-globe-wrap { position:absolute; right:-60px; top:50%; transform:translateY(-50%); width:360px; height:360px; opacity:.1; color:var(--blue4); pointer-events:none; perspective:500px; z-index:0; }
.vw-globe-wrap svg { width:100%; height:100%; animation:vw-globe-spin 40s linear infinite; transform-origin:50% 50%; }
@keyframes vw-globe-spin { from{transform:rotateY(0deg)} to{transform:rotateY(360deg)} }

/* Track & slides */
.vw-track { position:relative; z-index:1; }
.vw-slide { padding-bottom:4px; }

/* JS mode: stack slides, show only active */
.vc-js .vw-track { min-height:300px; }
.vc-js .vw-slide { position:absolute; inset:0; opacity:0; pointer-events:none; transform:perspective(900px) rotateY(22deg) translateX(48px) scale(.97); transition:opacity .55s ease, transform .55s cubic-bezier(.4,0,.2,1); }
.vc-js .vw-slide.vw-active { opacity:1; pointer-events:auto; transform:perspective(900px) rotateY(0deg) translateX(0) scale(1); }
.vc-js .vw-slide.vw-out-l { opacity:0; transform:perspective(900px) rotateY(-22deg) translateX(-48px) scale(.96); transition:opacity .35s ease, transform .38s cubic-bezier(.4,0,.2,1); }
.vc-js .vw-slide.vw-out-r { opacity:0; transform:perspective(900px) rotateY(22deg) translateX(48px) scale(.96); transition:opacity .35s ease, transform .38s cubic-bezier(.4,0,.2,1); }
.vc-js .vw-slide.vw-in-r { opacity:0; transform:perspective(900px) rotateY(22deg) translateX(48px) scale(.97); transition:none; }
.vc-js .vw-slide.vw-in-l { opacity:0; transform:perspective(900px) rotateY(-22deg) translateX(-48px) scale(.97); transition:none; }

/* Quote content */
.vw-qmark { font-family:Georgia,var(--serif); font-size:4.8rem; line-height:.72; color:var(--blue4); opacity:.22; user-select:none; margin-bottom:8px; }
.vw-quote { font-family:var(--serif); font-size:clamp(.98rem,2vw,1.16rem); line-height:2.05; color:var(--t1); margin:0 0 28px; font-style:normal; }

/* Author */
.vw-author { display:flex; align-items:center; gap:14px; padding-top:22px; border-top:1px solid var(--border); margin-top:4px; }
.vw-avatar { flex-shrink:0; width:46px; height:46px; border-radius:50%; background:linear-gradient(135deg,#3b82f6,#818cf8); display:flex; align-items:center; justify-content:center; font-size:1.15rem; color:#fff; font-family:var(--serif); font-weight:600; }
.vw-author-name { font-size:.95rem; font-weight:700; color:var(--t1); margin-bottom:5px; }
.vw-author-sub { font-size:.77rem; color:var(--t3); line-height:1.6; }
.vw-org { color:var(--blue4); text-decoration:none; transition:color .2s; }
.vw-org:hover { color:var(--blue3); text-decoration:underline; }
.vw-year { color:var(--t3); }

/* Navigation */
.vw-nav { display:flex; align-items:center; justify-content:center; gap:14px; margin-top:28px; position:relative; z-index:1; }
.vw-arr { width:34px; height:34px; border:1px solid var(--border2); border-radius:50%; background:transparent; color:var(--t2); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .2s; flex-shrink:0; }
.vw-arr:hover { border-color:var(--blue4); color:var(--blue4); background:rgba(96,165,250,.08); }
.vw-dots { display:flex; gap:8px; align-items:center; }
.vc-dot { width:8px; height:8px; border-radius:50%; border:none; background:var(--border2); cursor:pointer; padding:0; transition:all .35s cubic-bezier(.4,0,.2,1); }
.vc-dot.vc-dot-on { background:var(--blue4); width:22px; border-radius:4px; }

/* Progress line */
.vw-prog-wrap { height:2px; background:var(--border); border-radius:1px; overflow:hidden; margin-top:18px; position:relative; z-index:1; }
.vw-prog { height:100%; background:linear-gradient(90deg,var(--blue),#818cf8); width:0; border-radius:1px; }

/* ── 梦想树洞 ── */
.th-page { position: relative; z-index: 1; }

/* Hero */
.th-hero { position: relative; height: 82vh; min-height: 500px; overflow: hidden; }
.th-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.th-hero-overlay { position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,.06) 0%, rgba(0,0,0,.48) 52%, transparent 100%), linear-gradient(to top, var(--bg) 0%, transparent 42%); }
[data-theme="light"] .th-hero-overlay { background: linear-gradient(to bottom, rgba(0,0,0,.06) 0%, rgba(0,0,0,.48) 52%, transparent 100%), linear-gradient(to top, var(--bg) 0%, transparent 8%); }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .th-hero-overlay { background: linear-gradient(to bottom, rgba(0,0,0,.06) 0%, rgba(0,0,0,.48) 52%, transparent 100%), linear-gradient(to top, var(--bg) 0%, transparent 16%); } }
.th-hero-content { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 20px 20px 60px; }
.th-hero-badge { display: inline-block; padding: 5px 18px; background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.26); border-radius: 100px; font-size: .72rem; color: rgba(255,255,255,.9); letter-spacing: .2em; margin-bottom: 22px; backdrop-filter: blur(8px); }
.th-hero-title { font-family: var(--serif); font-size: clamp(2.4rem,7vw,4.2rem); font-weight: 700; color: #fff; letter-spacing: .14em; margin-bottom: 16px; text-shadow: 0 2px 28px rgba(0,0,0,.5); }
.th-hero-sub   { font-family: var(--serif); font-size: clamp(.9rem,2vw,1.1rem); color: rgba(255,255,255,.7); letter-spacing: .08em; text-shadow: 0 1px 10px rgba(0,0,0,.35); max-width: 380px; line-height: 1.9; }
.th-hero-scroll { position: absolute; bottom: 32px; left: 50%; transform: translateX(-50%); opacity: .55; animation: th-scroll-bounce 2.2s ease-in-out infinite; }
@keyframes th-scroll-bounce { 0%,100%{transform:translateX(-50%) translateY(0);} 55%{transform:translateX(-50%) translateY(7px);} }

/* 故事区 */
.th-story { padding: 72px 20px 64px; }
.th-story-inner { max-width: 680px; margin: 0 auto; }

.th-story-quote { text-align: center; margin-bottom: 52px; }
.th-sq-mark { display: block; font-family: Georgia,serif; font-size: 5rem; line-height: .6; color: var(--blue3); opacity: .35; margin-bottom: 12px; }
.th-sq-text { font-family: var(--serif); font-size: clamp(1.15rem,3vw,1.45rem); font-weight: 600; color: var(--t1); line-height: 1.9; letter-spacing: .04em; }

.th-story-body { margin-bottom: 52px; }
.th-sb-p { font-family: var(--serif); font-size: clamp(.9rem,2vw,1rem); color: var(--t2); line-height: 2.4; text-align: center; margin-bottom: 20px; }
.th-sb-p:last-child { margin-bottom: 0; }
.th-sb-p strong { color: var(--t1); font-weight: 600; }

.th-story-items { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.th-si { border: 1px solid var(--border); border-radius: var(--r-lg); padding: 24px 18px; text-align: center; background: rgba(255,255,255,.025); transition: border-color .2s; }
.th-si:hover { border-color: var(--border2); }
[data-theme="light"] .th-si { background: #f8fafc; border-color: #e8edf2; }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .th-si { background: #f8fafc; border-color: #e8edf2; } }
.th-si-icon { width: 44px; height: 44px; border-radius: 12px; background: rgba(96,165,250,.1); display: flex; align-items: center; justify-content: center; margin: 0 auto 14px; color: var(--blue3); }
[data-theme="light"] .th-si-icon { background: rgba(22,119,255,.08); color: var(--blue); }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .th-si-icon { background: rgba(22,119,255,.08); color: var(--blue); } }
.th-si-title { font-size: .88rem; font-weight: 600; color: var(--t1); margin-bottom: 8px; letter-spacing: .02em; }
.th-si-desc { font-size: .76rem; color: var(--t3); line-height: 1.8; }

/* 写入态 */
.th-write { max-width: 640px; margin: 0 auto; padding: 0 20px 0; animation: th-fadein .6s ease both; }
@keyframes th-fadein { from{opacity:0;transform:translateY(16px);} to{opacity:1;transform:none;} }

.th-write-hd { text-align: center; margin-bottom: 28px; }
.th-write-lead { font-family: var(--serif); font-size: clamp(1rem,2.5vw,1.15rem); color: var(--t1); line-height: 1.8; margin-bottom: 8px; font-weight: 500; }
.th-write-sub  { font-family: var(--serif); font-size: .9rem; color: var(--t3); line-height: 1.8; }

.th-card     { width: 100%; background: rgba(255,255,255,.04); border: 1px solid var(--border2); border-radius: var(--r-xl); overflow: hidden; backdrop-filter: blur(20px); box-shadow: 0 12px 48px rgba(0,0,0,.2); }
[data-theme="light"] .th-card { background: #fff; border-color: #e8e8e8; box-shadow: 0 4px 24px rgba(0,0,0,.07); }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .th-card { background: #fff; border-color: #e8e8e8; } }
.th-textarea { width: 100%; min-height: 200px; border: none; outline: none; resize: none; font-family: var(--serif); font-size: 1rem; line-height: 2.1; color: var(--t1); background: transparent; padding: 28px 32px 20px; display: block; }
.th-textarea::placeholder { color: var(--t3); font-style: italic; }
.th-card-footer { display: flex; align-items: center; justify-content: space-between; padding: 12px 20px; border-top: 1px solid var(--border); flex-wrap: wrap; gap: 8px; }
.th-tips     { display: flex; gap: 16px; flex-wrap: wrap; }
.th-tip-item { display: inline-flex; align-items: center; gap: 5px; font-size: .7rem; color: var(--t3); }
.th-count    { font-size: .7rem; color: var(--t3); }
.th-card-action { padding: 16px 20px 20px; display: flex; justify-content: center; }
.th-submit   { display: inline-flex; align-items: center; gap: 8px; padding: 13px 32px; background: linear-gradient(135deg,var(--blue),#6366f1); color: #fff; border: none; border-radius: var(--r-full); font-size: .9rem; font-weight: 600; cursor: pointer; transition: opacity .2s; box-shadow: 0 4px 20px rgba(37,99,235,.3); font-family: var(--serif); letter-spacing: .04em; }
.th-submit:hover { opacity: .88; }

.th-outro    { margin-top: 36px; text-align: center; padding-bottom: 20px; }
.th-outro p  { font-family: var(--serif); font-size: .9rem; color: var(--t3); line-height: 2; }
.th-outro-em { color: var(--t2); font-style: italic; margin-top: 8px; }

/* 发送态 */
.th-sending    { flex-direction: column; align-items: center; gap: 28px; padding: 120px 20px; animation: th-fadein .4s ease both; }
.th-sending-orbs { position: relative; width: 80px; height: 80px; }
.th-orb        { position: absolute; border-radius: 50%; }
.th-orb1       { width: 80px; height: 80px; background: radial-gradient(circle,rgba(99,102,241,.3),transparent 70%); animation: th-orb-pulse 1.8s ease-in-out infinite; }
.th-orb2       { width: 50px; height: 50px; top: 15px; left: 15px; background: radial-gradient(circle,rgba(37,99,235,.4),transparent 70%); animation: th-orb-pulse 1.8s ease-in-out .3s infinite; }
.th-orb3       { width: 24px; height: 24px; top: 28px; left: 28px; background: rgba(96,165,250,.6); border-radius: 50%; animation: th-orb-pulse 1.8s ease-in-out .6s infinite; }
@keyframes th-orb-pulse { 0%,100%{transform:scale(.9);opacity:.6;} 50%{transform:scale(1.1);opacity:1;} }
.th-sending-text { font-family: var(--serif); font-size: 1rem; color: var(--t3); letter-spacing: .2em; }

/* 响应态 */
.th-response   { flex-direction: column; align-items: center; text-align: center; max-width: 480px; width: 100%; margin: 0 auto; padding: 80px 20px 60px; }
.th-resp-in    { animation: th-resp-appear .7s cubic-bezier(.22,1,.36,1) both; }
@keyframes th-resp-appear { from{opacity:0;transform:translateY(24px) scale(.96);} to{opacity:1;transform:none;} }
.th-resp-glow  { position: fixed; top: 40%; left: 50%; transform: translate(-50%,-50%); width: 400px; height: 400px; border-radius: 50%; background: radial-gradient(circle,rgba(239,68,68,.06),transparent 70%); pointer-events: none; }
.th-resp-icon  { width: 72px; height: 72px; border-radius: 50%; background: rgba(239,68,68,.08); border: 1px solid rgba(248,113,113,.2); display: flex; align-items: center; justify-content: center; margin-bottom: 28px; }
.th-resp-title { font-family: var(--serif); font-size: clamp(1.5rem,4vw,2rem); font-weight: 700; color: var(--t1); margin-bottom: 20px; letter-spacing: .04em; }
.th-resp-body  { font-family: var(--serif); font-size: 1rem; color: var(--t2); line-height: 2.3; white-space: pre-line; margin-bottom: 44px; }
.th-resp-actions { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.th-again      { padding: 12px 36px; background: rgba(255,255,255,.06); border: 1px solid var(--border2); border-radius: var(--r-full); font-size: .88rem; color: var(--t2); cursor: pointer; transition: all .2s; }
.th-again:hover { border-color: rgba(96,165,250,.4); color: var(--t1); background: rgba(37,99,235,.08); }
.th-write-letter { font-size: .82rem; color: var(--t3); transition: color .2s; }
.th-write-letter:hover { color: var(--blue3); }

/* 信任声明卡片 */
.th-trust { display: flex; align-items: flex-start; gap: 16px; margin-top: 32px; margin-bottom: 60px; border: 1px solid var(--border); border-radius: var(--r-lg); padding: 20px 24px; background: rgba(255,255,255,.025); }
[data-theme="light"] .th-trust { background: #f8fafc; border-color: #e2e8f0; }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .th-trust { background: #f8fafc; border-color: #e2e8f0; } }
.th-trust-icon { flex-shrink: 0; width: 36px; height: 36px; border-radius: 8px; background: rgba(96,165,250,.1); display: flex; align-items: center; justify-content: center; color: var(--blue3); margin-top: 2px; }
.th-trust-body { flex: 1; min-width: 0; }
.th-trust-label { font-size: .7rem; font-weight: 700; letter-spacing: .15em; color: var(--t2); text-transform: uppercase; margin-bottom: 10px; }
.th-trust-text  { font-size: .78rem; color: var(--t3); line-height: 1.9; margin-bottom: 6px; }
.th-trust-text:last-child { margin-bottom: 0; }

@media (max-width: 600px) {
    .th-hero { height: 72vh; min-height: 420px; }
    .th-story { padding: 48px 16px 44px; }
    .th-story-items { grid-template-columns: 1fr; gap: 12px; }
    .th-si { padding: 18px 16px; text-align: left; display: flex; align-items: flex-start; gap: 14px; }
    .th-si-icon { flex-shrink: 0; margin: 0; }
    .th-write { padding-top: 0; }
    .th-textarea { padding: 20px; min-height: 160px; }
}