/* ==========================================================================
   兰潇个人网站 — 工程图纸风 × 编辑排版
   参考 sac-ai.com：超大衬线标题、细线框、十字定位、大字编号、SPEC 参数
   ========================================================================== */

/* --- 1. 设计变量 --- */
:root {
    /* 默认：主人修改的工程图纸人文风 */
    --paper: #F5F2EC;          /* 米白纸面 */
    --ink: #16130E;            /* 深墨 */
    --ink-2: #6E675C;          /* 次级墨 */
    --ink-3: #A89F92;          /* 淡墨 */
    --accent: #D94F2B;         /* 朱砂橙红 */
    --line: #DDD6CA;           /* 细线 */
    --card: #FBF9F4;           /* 卡片 */
}

/* 高大上科技版独立作用域 (cyber.html) */
html.cyber-page,
.cyber-body {
    --paper: #080C14;          /* 钛金夜空黑 */
    --ink: #FFFFFF;            /* 极光白 */
    --ink-2: #94A3B8;          /* 科技灰 */
    --ink-3: #475569;          /* 幽暗灰 */
    --accent: #00E5FF;         /* 全息电光蓝 */
    --line: rgba(0, 229, 255, 0.18); /* 霓虹细线 */
    --card: rgba(13, 20, 38, 0.7);   /* 毛玻璃暗黑卡片 */
    background-color: #080C14 !important;
    color: #FFFFFF !important;
}

:root {
    /* 字体 */
    --serif: 'Noto Serif SC', 'Songti SC', 'STSong', serif;
    --sans: 'Inter', 'Noto Sans SC', 'PingFang SC', sans-serif;
    --mono: 'JetBrains Mono', 'Fira Code', Consolas, monospace;

    /* 8px 间距 */
    --s1: 8px; --s2: 16px; --s3: 24px; --s4: 32px;
    --s6: 48px; --s8: 64px; --s12: 96px; --s16: 128px;

    /* 字号 */
    --t-xs: .75rem; --t-sm: .875rem; --t-base: 1rem;
    --t-lg: 1.125rem; --t-xl: 1.25rem; --t-2xl: 1.5rem;
    --t-3xl: 2rem; --t-4xl: 3rem; --t-5xl: 4.5rem; --t-6xl: 7rem;

    --ease: cubic-bezier(.16,1,.3,1);
    --tr: all .45s var(--ease);
}

/* 风格切换按钮组件 */
.theme-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    font-family: var(--mono);
    font-size: var(--t-xs);
    font-weight: 500;
    color: var(--ink);
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 99px;
    cursor: pointer;
    transition: var(--tr);
    user-select: none;
    margin-left: 12px;
}

.theme-btn:hover {
    color: var(--accent);
    border-color: var(--accent);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.theme-btn-icon {
    font-size: 0.9rem;
}

/* --- 2. 基础 --- */
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:96px; }
body {
    background:var(--paper);
    color:var(--ink);
    font-family:var(--sans);
    font-size:var(--t-base);
    line-height:1.7;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
    transition: background 0.5s var(--ease), color 0.5s var(--ease);
}
    font-family:var(--sans);
    font-size:var(--t-base);
    line-height:1.7;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
}
::selection { background:var(--accent); color:var(--paper); }
a { color:inherit; text-decoration:none; }

/* --- 3. 十字定位标记（工程图纸角标） --- */
.cross {
    position:absolute;
    width:14px; height:14px;
    pointer-events:none;
    z-index:2;
}
.cross::before,.cross::after {
    content:''; position:absolute; background:var(--ink-3);
}
.cross::before { left:50%; top:0; width:1px; height:100%; transform:translateX(-.5px); }
.cross::after  { top:50%; left:0; height:1px; width:100%; transform:translateY(-.5px); }
.cross-tl { top:-7px; left:-7px; }
.cross-tr { top:-7px; right:-7px; }
.cross-bl { bottom:-7px; left:-7px; }
.cross-br { bottom:-7px; right:-7px; }

/* --- 4. 导航 --- */
.nav {
    position:fixed; inset:0 0 auto 0; z-index:100;
    display:flex; align-items:center; justify-content:space-between;
    height:72px;
    padding:0 var(--s6);
    background:rgba(245,242,236,.85);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    border-bottom:1px solid transparent;
    transition:border-color .3s ease;
}
.nav.scrolled { border-bottom-color:var(--line); }
.nav-logo {
    font-family:var(--serif);
    font-size:var(--t-xl);
    font-weight:900;
    letter-spacing:.02em;
}
.nav-links {
    display:flex; gap:var(--s4);
    position:absolute; left:50%; transform:translateX(-50%);
}
.nav-links a {
    font-family:var(--mono);
    font-size:var(--t-xs);
    font-weight:500;
    letter-spacing:.18em;
    color:var(--ink-2);
    padding:4px 0;
    position:relative;
    transition:color .3s ease;
}
.nav-links a::after {
    content:''; position:absolute; bottom:0; left:0;
    width:0; height:1px; background:var(--ink);
    transition:width .35s var(--ease);
}
.nav-links a:hover { color:var(--ink); }
.nav-links a:hover::after { width:100%; }
.nav-badge {
    font-family:var(--mono);
    font-size:var(--t-xs);
    font-weight:500;
    letter-spacing:.1em;
    color:var(--ink);
}
.nav-badge i {
    font-style:normal;
    color:var(--accent);
    margin-left:2px;
}
.nav-badge::after {
    content:''; display:inline-block;
    width:6px; height:6px; border-radius:50%;
    background:var(--accent);
    margin-left:8px;
    animation:pulse 2s infinite;
}

/* 移动端菜单（默认隐藏） */
.menu-btn, .mobile-menu { display:none; }
.menu-toggle {
    position:absolute;
    opacity:0;
    width:0; height:0;
    pointer-events:none;
}
@keyframes pulse {
    0%,100% { opacity:1; } 50% { opacity:.25; }
}

/* --- 5. 按钮 --- */
.btn {
    display:inline-flex; align-items:center; gap:var(--s1);
    padding:14px var(--s3);
    font-size:var(--t-sm);
    font-weight:500;
    letter-spacing:.04em;
    border:1px solid var(--ink);
    cursor:pointer;
    transition:var(--tr);
}
.btn span { transition:transform .35s var(--ease); }
.btn:hover span { transform:translateX(4px); }
.btn-solid { background:var(--ink); color:var(--paper); }
.btn-solid:hover { background:var(--accent); border-color:var(--accent); }
.btn-ghost { background:transparent; color:var(--ink); }
.btn-ghost:hover { background:var(--ink); color:var(--paper); }

/* --- 6. HERO --- */
.hero {
    min-height:100vh;
    display:flex; align-items:center;
    padding:120px var(--s6) var(--s8);
}
.hero-inner {
    position:relative;
    width:100%; max-width:1280px;
    margin:0 auto;
    display:grid;
    grid-template-columns:1fr 1fr .9fr;
    gap:var(--s6);
    align-items:end;
    border:1px solid var(--line);
    padding:var(--s8);
    background:var(--card);
}
.hero-title {
    font-family:var(--serif);
    font-size:clamp(3.5rem, 8.5vw, 6rem);
    font-weight:900;
    line-height:.95;
    letter-spacing:-.03em;
}
.hero-dot { color:var(--accent); }
.hero-meta { padding-bottom:var(--s2); }
.hero-line {
    display:flex; align-items:center; gap:var(--s1);
    font-family:var(--mono);
    font-size:var(--t-xs);
    letter-spacing:.15em;
    text-transform:uppercase;
    color:var(--ink-2);
    margin-bottom:var(--s3);
}
.hero-line .dot {
    width:8px; height:8px; border-radius:50%;
    background:var(--accent);
    animation:pulse 2s infinite;
}
.hero-sub {
    font-size:var(--t-xl);
    font-weight:400;
    color:var(--ink);
    line-height:1.6;
}
.hero-actions {
    display:flex; gap:var(--s2);
    margin-top:var(--s4);
}

/* Hero 点绘肖像 */
.hero-portrait {
    position:relative;
    margin:0;
}
.hero-portrait img {
    display:block;
    width:100%;
    height:auto;
    mix-blend-mode:multiply;
    filter:contrast(1.02);
}
.portrait-caption {
    font-family:var(--mono);
    font-size:10px;
    letter-spacing:.2em;
    color:var(--ink-3);
    margin-top:var(--s1);
    text-align:right;
}

/* --- 7. 通用 section --- */
section { padding:var(--s12) var(--s6); }
.section-head {
    max-width:1200px; margin:0 auto var(--s8);
    display:flex; align-items:end; justify-content:space-between;
    gap:var(--s4);
}
.section-title {
    font-family:var(--serif);
    font-size:clamp(3rem, 8vw, var(--t-5xl));
    font-weight:900;
    line-height:1;
    letter-spacing:-.03em;
}
.title-thin { font-weight:400; font-style:italic; }
.section-note {
    font-family:var(--mono);
    font-size:var(--t-xs);
    letter-spacing:.15em;
    color:var(--ink-3);
    white-space:nowrap;
    padding-bottom:var(--s1);
}

/* --- 8. ABOUT --- */
.about-grid {
    max-width:1200px; margin:0 auto;
    display:grid;
    grid-template-columns:1fr 1.1fr;
    gap:var(--s8);
}
.about-bio {
    font-size:var(--t-lg);
    color:var(--ink);
    line-height:1.9;
}
.about-bio + .about-bio { margin-top:var(--s1); color:var(--ink-2); }

/* SPEC 参数卡 */
.spec-card {
    position:relative;
    margin-top:var(--s6);
    border:1px solid var(--ink);
    background:var(--card);
    padding:var(--s4);
    font-family:var(--mono);
}
.spec-card::before {
    content:'';
    position:absolute;
    inset:var(--s1);
    border:1px solid var(--line);
    pointer-events:none;
}
.spec-head {
    display:flex; justify-content:space-between;
    font-size:var(--t-xs);
    letter-spacing:.12em;
    color:var(--ink-2);
    padding-bottom:var(--s2);
    border-bottom:1px dashed var(--line);
    margin-bottom:var(--s3);
}
.spec-tag { color:var(--accent); font-weight:500; }
.spec-body {
    display:grid; grid-template-columns:1fr 1fr;
    gap:var(--s3);
    padding-bottom:var(--s3);
    border-bottom:1px dashed var(--line);
}
.spec-line {
    font-size:var(--t-xs);
    letter-spacing:.06em;
    color:var(--ink-2);
    line-height:2.1;
    white-space:pre;
}
.spec-line b { color:var(--ink); font-weight:500; }
.spec-foot {
    display:flex; justify-content:space-between;
    padding-top:var(--s3);
    font-size:10px;
    letter-spacing:.1em;
    color:var(--ink-3);
    line-height:1.8;
}
.spec-foot b { color:var(--ink); font-weight:500; }

/* 圆形 tab */
.tabs {
    display:flex; gap:var(--s4);
    justify-content:flex-end;
    margin-bottom:var(--s4);
}
.tab-item {
    width:88px; height:88px;
    border:1px solid var(--line);
    border-radius:50%;
    display:flex; flex-direction:column;
    align-items:center; justify-content:center;
    font-family:var(--serif);
    font-size:var(--t-xl);
    font-weight:600;
    color:var(--ink-3);
    background:transparent;
    transition:var(--tr);
    cursor:pointer;
    appearance:none;
    -webkit-appearance:none;
    padding:0;
}
.tab-item i {
    font-family:var(--mono);
    font-style:normal;
    font-size:9px;
    letter-spacing:.2em;
    margin-top:2px;
}
.tab-item.active, .tab-item:hover {
    border-color:var(--accent);
    color:var(--ink);
}
.tab-item.active i, .tab-item:hover i { color:var(--accent); }

/* 信号台 */
.signal-head {
    display:flex; align-items:baseline; justify-content:space-between;
    border-bottom:2px solid var(--ink);
    padding-bottom:var(--s2);
}
.signal-head h3 {
    font-family:var(--serif);
    font-size:var(--t-2xl);
    font-weight:700;
}
.signal-status {
    font-family:var(--mono);
    font-size:var(--t-xs);
    letter-spacing:.15em;
    color:var(--accent);
}
.signal-list {
    list-style:none;
    animation:panelIn .45s var(--ease);
}
.signal-list[hidden] { display:none; }
@keyframes panelIn {
    from { opacity:0; transform:translateY(10px); }
    to   { opacity:1; transform:none; }
}
.signal-row {
    display:grid;
    grid-template-columns:1fr auto auto auto;
    align-items:center;
    gap:var(--s3);
    padding:var(--s2) 0;
    border-bottom:1px solid var(--line);
    transition:var(--tr);
}
.signal-row:hover { padding-left:var(--s1); }
.signal-name {
    font-size:var(--t-sm);
    font-weight:500;
}
.signal-num {
    font-family:var(--mono);
    font-size:var(--t-sm);
    font-weight:500;
}
.signal-num i { font-style:normal; font-size:var(--t-xs); color:var(--ink-3); margin-left:2px; }
.signal-bars { display:flex; gap:3px; align-items:end; height:18px; }
.signal-bars i {
    width:5px; background:var(--line);
    border-radius:1px;
}
.signal-bars i:nth-child(1){height:20%} .signal-bars i:nth-child(2){height:40%}
.signal-bars i:nth-child(3){height:60%} .signal-bars i:nth-child(4){height:80%}
.signal-bars i:nth-child(5){height:100%}
.signal-bars[data-level="1"] i:nth-child(-n+1),
.signal-bars[data-level="2"] i:nth-child(-n+2),
.signal-bars[data-level="3"] i:nth-child(-n+3),
.signal-bars[data-level="4"] i:nth-child(-n+4),
.signal-bars[data-level="5"] i:nth-child(-n+5) { background:var(--accent); }
.signal-state {
    font-family:var(--mono);
    font-size:10px;
    letter-spacing:.15em;
    display:flex; align-items:center; gap:6px;
}
.signal-state::before {
    content:''; width:6px; height:6px; border-radius:50%;
}
.signal-state.live { color:var(--accent); }
.signal-state.live::before { background:var(--accent); animation:pulse 2s infinite; }
.signal-state.soon { color:var(--ink-3); }
.signal-state.soon::before { background:var(--ink-3); }

/* --- 9. WORK --- */
.work-grid {
    max-width:1200px; margin:0 auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:var(--s8);
    align-items:start;
}

/* 大图卡 */
.work-feature-frame {
    position:relative;
    border:1px solid var(--ink);
    background:var(--card);
    padding:var(--s1);
    position:sticky; top:110px;
}
.feature-figure {
    margin:0;
    border:1px solid var(--line);
    border-bottom:none;
    overflow:hidden;
}
.feature-figure img {
    display:block;
    width:100%;
    height:auto;
    mix-blend-mode:multiply;
    transition:transform .8s var(--ease);
}
.work-feature-frame:hover .feature-figure img {
    transform:scale(1.03);
}
.feature-visual {
    border:1px solid var(--line);
    border-top:1px dashed var(--line);
    padding:var(--s4);
    display:flex; flex-direction:column;
    background:var(--card);
}
.feature-title {
    font-family:var(--serif);
    font-size:var(--t-2xl);
    font-weight:700;
    line-height:1.3;
    margin-bottom:var(--s2);
}
.feature-desc {
    font-size:var(--t-sm);
    color:var(--ink-2);
    line-height:1.8;
    margin-bottom:var(--s3);
}
.feature-meta {
    font-family:var(--mono);
    font-size:var(--t-xs);
    letter-spacing:.15em;
    color:var(--ink-3);
}
.feature-meta i { margin:0 var(--s1); font-style:normal; }

/* AI 徽章（Work 02 行） */
.ai-badge {
    display:inline-block;
    font-family:var(--mono);
    font-style:normal;
    font-size:9px;
    font-weight:500;
    letter-spacing:.15em;
    color:var(--paper);
    background:var(--accent);
    padding:2px 7px;
    border-radius:2px;
    vertical-align:middle;
    margin-left:var(--s1);
    animation:aiPulse 2.4s infinite;
}
@keyframes aiPulse {
    0%,100% { opacity:1; }
    50% { opacity:.6; }
}
.work-row--ai .work-name { color:var(--accent); }

/* 编号列表 */
.work-list { list-style:none; border-top:1px solid var(--line); }
.work-row {
    display:flex; align-items:center; gap:var(--s3);
    padding:var(--s3) 0;
    border-bottom:1px solid var(--line);
    transition:var(--tr);
    cursor:default;
}
.work-row:hover {
    padding-left:var(--s2);
    background:var(--card);
}
.work-num {
    font-family:var(--serif);
    font-size:var(--t-4xl);
    font-weight:900;
    line-height:1;
    color:transparent;
    -webkit-text-stroke:1px var(--ink-3);
    transition:all .35s var(--ease);
    min-width:64px;
}
.work-row:hover .work-num {
    color:var(--accent);
    -webkit-text-stroke:1px var(--accent);
}
.work-name {
    font-family:var(--serif);
    font-size:var(--t-xl);
    font-weight:700;
    line-height:1.4;
}
.work-meta {
    font-family:var(--mono);
    font-size:var(--t-xs);
    letter-spacing:.08em;
    color:var(--ink-3);
    margin-top:2px;
}

/* --- 9.5 BUILD 终端区 --- */
.build {
    position:relative;
}
.build-grid {
    max-width:1200px; margin:0 auto;
    display:grid;
    grid-template-columns:1fr 1.3fr;
    gap:var(--s8);
    align-items:center;
}
.build-sub {
    display:flex; align-items:center; gap:var(--s1);
    font-size:var(--t-lg);
    color:var(--ink-2);
    margin-top:var(--s3);
}
.build-sub .dot {
    width:8px; height:8px; border-radius:50%;
    background:var(--accent);
    animation:pulse 2s infinite;
}

/* git 时间线 */
.git-timeline {
    margin-top:var(--s6);
    font-family:var(--mono);
    font-size:var(--t-xs);
    color:var(--ink-2);
    border-left:1px solid var(--line);
    padding-left:var(--s3);
    display:flex; flex-direction:column; gap:var(--s2);
}
.git-branch { color:var(--accent); letter-spacing:.08em; }
.git-row {
    display:flex; align-items:center; gap:var(--s2);
    position:relative;
}
.git-row i {
    position:absolute; left:calc(-1 * var(--s3) - 4.5px);
    width:8px; height:8px; border-radius:50%;
    background:var(--paper);
    border:1px solid var(--ink-3);
}
.git-row b { font-weight:500; color:var(--ink); min-width:64px; }
.git-row em { font-style:normal; color:var(--ink-3); }
.git-row--head i {
    background:var(--accent);
    border-color:var(--accent);
    box-shadow:0 0 0 3px rgba(217,79,43,.2);
    animation:pulse 2s infinite;
}
.git-row--head em { color:var(--accent); }

/* 终端窗口 */
.build-terminal {
    position:relative;
    border:1px solid var(--ink);
    background:#14110C;
    padding:var(--s1);
    cursor:pointer;
    transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}
.build-terminal:hover {
    transform:translateY(-3px);
    box-shadow:0 12px 40px rgba(22,19,14,.18);
}
.term-bar {
    display:flex; align-items:center; gap:6px;
    padding:var(--s2) var(--s2);
    border-bottom:1px solid rgba(245,242,236,.08);
}
.term-bar i {
    width:10px; height:10px; border-radius:50%;
    background:rgba(245,242,236,.15);
}
.term-bar i:first-child { background:rgba(217,79,43,.7); }
.term-title {
    font-family:var(--mono);
    font-size:10px;
    letter-spacing:.1em;
    color:rgba(245,242,236,.35);
    margin-left:auto;
}
.term-body {
    padding:var(--s3) var(--s3) var(--s2);
    min-height:280px;
    font-family:var(--mono);
    font-size:var(--t-xs);
    line-height:2.1;
    color:rgba(245,242,236,.85);
    white-space:pre-wrap;
}
.term-body .t-cmd { color:#F5F2EC; font-weight:500; }
.term-body .t-ok { color:#7DB88A; }
.term-body .t-dim { color:rgba(245,242,236,.4); }
.term-body .t-accent { color:#E8795A; }
.term-caret {
    display:inline-block;
    width:8px; height:15px;
    background:var(--accent);
    vertical-align:-2px;
    animation:caretBlink .9s steps(1) infinite;
}
@keyframes caretBlink {
    50% { opacity:0; }
}
.term-foot {
    display:flex; align-items:center; gap:var(--s2);
    padding:var(--s2) var(--s3) var(--s3);
    border-top:1px solid rgba(245,242,236,.08);
}
.term-ver {
    font-family:var(--mono);
    font-size:10px;
    letter-spacing:.08em;
    color:rgba(245,242,236,.4);
    white-space:nowrap;
}
#compileLabel { color:#E8795A; }
.term-progress {
    flex:1;
    height:3px;
    background:rgba(245,242,236,.1);
    border-radius:2px;
    overflow:hidden;
}
.term-progress i {
    display:block;
    height:100%;
    width:0%;
    background:linear-gradient(90deg, #D94F2B, #E8795A);
    border-radius:2px;
    transition:width .3s ease;
}
.term-pct {
    font-family:var(--mono);
    font-size:10px;
    color:#E8795A;
    min-width:36px;
    text-align:right;
}

/* 测量标尺 */
.build-ruler {
    display:flex; align-items:flex-start; gap:0;
    margin-top:var(--s3);
    position:relative;
    height:28px;
    font-family:var(--mono);
    font-size:9px;
    color:var(--ink-3);
}
.build-ruler i {
    width:1px; height:6px;
    background:var(--ink-3);
    position:absolute; top:0;
}
.build-ruler i:nth-child(1){left:0} .build-ruler i:nth-child(2){left:25%}
.build-ruler i:nth-child(3){left:50%} .build-ruler i:nth-child(4){left:75%}
.build-ruler i:nth-child(5){left:calc(100% - 1px)}
.build-ruler span { position:absolute; top:10px; transform:translateX(-50%); }
.build-ruler span:nth-of-type(1){left:0; transform:none}
.build-ruler span:nth-of-type(2){left:25%}
.build-ruler span:nth-of-type(3){left:50%}
.build-ruler span:nth-of-type(4){left:75%}
.build-ruler span:nth-of-type(5){left:100%; transform:translateX(-100%)}

/* 打字机光标（Hero） */
.typed-caret {
    display:inline-block;
    width:2px; height:1em;
    background:var(--accent);
    vertical-align:-1px;
    margin-left:2px;
    animation:caretBlink 1s steps(1) infinite;
}

/* --- 10. SUBSCRIBE --- */
.subscribe-frame {
    position:relative;
    max-width:1200px; margin:0 auto;
    border:1px solid var(--ink);
    background:var(--card);
    padding:var(--s8);
    display:grid;
    grid-template-columns:1fr auto;
    gap:var(--s8);
    align-items:center;
}
.subscribe-frame::before {
    content:''; position:absolute; inset:var(--s2);
    border:1px solid var(--line);
    pointer-events:none;
}
.overline {
    font-family:var(--mono);
    font-size:var(--t-xs);
    letter-spacing:.25em;
    color:var(--accent);
    margin-bottom:var(--s3);
}
.subscribe-title {
    font-family:var(--serif);
    font-size:clamp(2.5rem,5vw,var(--t-4xl));
    font-weight:900;
    line-height:1.15;
    letter-spacing:-.02em;
    margin-bottom:var(--s3);
}
.subscribe-desc {
    font-size:var(--t-lg);
    color:var(--ink-2);
    margin-bottom:var(--s3);
}
.subscribe-meta {
    font-size:var(--t-sm);
    color:var(--ink-3);
}
.subscribe-meta b { color:var(--accent); font-weight:600; }
.subscribe-qr { text-align:center; }
.qr-box {
    width:150px; height:150px;
    border:1px solid var(--ink);
    background:var(--paper);
    padding:var(--s2);
    display:flex; align-items:center; justify-content:center;
}
.qr-svg { width:100%; height:100%; color:var(--ink); }
.qr-caption {
    font-family:var(--mono);
    font-size:10px;
    letter-spacing:.2em;
    color:var(--ink-3);
    margin-top:var(--s2);
}

/* --- 11. FOOTER --- */
.footer {
    border-top:1px solid var(--line);
    padding:var(--s4) var(--s6);
    display:flex; justify-content:space-between; align-items:center;
    font-family:var(--mono);
    font-size:var(--t-xs);
    letter-spacing:.08em;
    color:var(--ink-3);
}
.footer-links { display:flex; gap:var(--s3); }
.footer-links a:hover { color:var(--accent); }

/* --- 12. 滚动浮现 --- */
.about-grid, .work-grid, .build-grid, .subscribe-frame, .hero-inner {
    opacity:0;
    transform:translateY(28px);
    transition:opacity .9s var(--ease), transform .9s var(--ease);
}
.in .about-grid, .in .work-grid, .in .build-grid, .in .subscribe-frame,
.hero-inner.in {
    opacity:1; transform:none;
}
.hero-inner { transition-delay:.05s; }

/* --- 13. 响应式 --- */
@media (max-width:1000px) {
    .nav { padding:0 var(--s3); }
    section { padding:var(--s8) var(--s3); }
    .hero { padding:110px var(--s3) var(--s6); }
    .hero-inner {
        grid-template-columns:1fr;
        gap:var(--s6);
        padding:var(--s6) var(--s4);
    }
    .hero-portrait { max-width:360px; }
    .about-grid, .work-grid, .build-grid { grid-template-columns:1fr; gap:var(--s6); }
    .work-feature-frame { position:static; }
    .tabs { justify-content:flex-start; }
    .subscribe-frame {
        grid-template-columns:1fr;
        padding:var(--s6) var(--s4);
        text-align:center;
    }
    .subscribe-qr { display:flex; flex-direction:column; align-items:center; }
}
@media (max-width:640px) {
    .nav-links { display:none; }
    .nav-badge { display:none; }

    /* 汉堡按钮 */
    .menu-btn {
        display:flex !important;
        flex-direction:column;
        justify-content:center;
        align-items:flex-end;
        gap:6px;
        width:40px; height:40px;
        cursor:pointer;
        z-index:102;
        position:absolute;
        right:var(--s3);
        top:16px;
    }
    .menu-btn span {
        display:block;
        width:22px; height:2px;
        background:var(--ink);
        transition:transform .35s var(--ease), opacity .3s ease;
    }
    .menu-toggle:checked ~ .menu-btn span:nth-child(1) {
        transform:translateY(4px) rotate(45deg);
    }
    .menu-toggle:checked ~ .menu-btn span:nth-child(2) {
        transform:translateY(-3.5px) rotate(-45deg);
    }

    /* 全屏移动菜单 */
    .mobile-menu {
        display:flex;
        flex-direction:column;
        justify-content:center;
        gap:var(--s4);
        position:fixed;
        inset:0;
        background:var(--paper);
        padding:var(--s6);
        z-index:101;
        opacity:0;
        visibility:hidden;
        transition:opacity .4s var(--ease), visibility 0s .4s;
    }
    .menu-toggle:checked ~ .mobile-menu {
        opacity:1;
        visibility:visible;
        transition:opacity .4s var(--ease);
    }
    .mobile-menu a {
        font-family:var(--serif);
        font-size:var(--t-3xl);
        font-weight:700;
        border-bottom:1px solid var(--line);
        padding-bottom:var(--s2);
        display:flex; align-items:baseline; justify-content:space-between;
        opacity:0;
        transform:translateY(16px);
        transition:opacity .5s var(--ease), transform .5s var(--ease);
    }
    .mobile-menu a i {
        font-family:var(--mono);
        font-style:normal;
        font-size:var(--t-xs);
        font-weight:400;
        letter-spacing:.2em;
        color:var(--ink-3);
    }
    .menu-toggle:checked ~ .mobile-menu a {
        opacity:1; transform:none;
    }
    .menu-toggle:checked ~ .mobile-menu a:nth-child(1) { transition-delay:.08s; }
    .menu-toggle:checked ~ .mobile-menu a:nth-child(2) { transition-delay:.16s; }
    .menu-toggle:checked ~ .mobile-menu a:nth-child(3) { transition-delay:.24s; }
    .menu-toggle:checked ~ .mobile-menu a:nth-child(4) { transition-delay:.32s; }

    /* Hero 内边距修复（十字角标不再被裁） */
    .hero { padding:100px var(--s3) var(--s6); }
    .hero-inner { padding:var(--s6) var(--s3); }

    .hero-actions { flex-wrap:wrap; }
    .section-head { flex-direction:column; align-items:start; gap:var(--s2); }
    .feature-visual { min-height:320px; }
    .feature-num { font-size:4rem; }
    .work-num { font-size:var(--t-3xl); min-width:48px; }
    .signal-row { grid-template-columns:1fr auto auto; }
    .signal-bars { display:none; }
    .footer { flex-direction:column; gap:var(--s2); padding:var(--s4) var(--s3); }
}

/* --- 14. 减少动效 --- */
@media (prefers-reduced-motion: reduce) {
    *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; }
    html { scroll-behavior:auto; }
    .about-grid,.work-grid,.subscribe-frame,.hero-inner { opacity:1; transform:none; }
}
