/* ============================================
   CYSOEditor — Modern Minimal v6
   现代极简风格 · 用户导向 · Aurora 真实主题色
   ============================================ */

:root {
    --bg:           #050810;
    --bg-elev:      #0a0f1a;
    --bg-card:      #0c1220;
    --border:       rgba(255, 255, 255, .05);
    --border-hi:    rgba(255, 255, 255, .12);
    --text:         #f1f5f9;
    --text-sub:     #94a3b8;
    --text-dim:     #64748b;

    /* Aurora 真实主题色 */
    --aurora-cyan:  #32c8dc;
    --aurora-green: #46dca0;
    --aurora-purple:#965ae6;
    --aurora-pink:  #f0a0b4;

    --accent:       var(--aurora-cyan);
    --accent-bright:#5ee0f0;
    --accent-soft:  rgba(50, 200, 220, .1);

    --mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', 'Cascadia Code', monospace;
    --sans: -apple-system, 'Inter', 'PingFang SC', 'Microsoft YaHei', sans-serif;
    --ease: cubic-bezier(.16, 1, .3, 1);
    --ease-out: cubic-bezier(.22, 1, .36, 1);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-font-smoothing:antialiased; }
body { font-family:var(--sans); background:var(--bg); color:var(--text); line-height:1.65; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
::selection { background:rgba(50, 200, 220, .25); color:#fff; }
.container { max-width:1080px; margin:0 auto; padding:0 28px; }

/* ==================== 背景层 ==================== */
.cursor-glow {
    position:fixed; width:520px; height:520px; border-radius:50%;
    background:radial-gradient(circle, rgba(50, 200, 220, .055) 0%, transparent 70%);
    pointer-events:none; z-index:9999;
    transform:translate(-50%,-50%); opacity:0; transition:opacity .4s;
}
@media(hover:hover){ .cursor-glow{opacity:1;} }

.grid-bg {
    position:fixed; inset:0; z-index:0; pointer-events:none;
    background-image:
        linear-gradient(rgba(255, 255, 255, .018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .018) 1px, transparent 1px);
    background-size:72px 72px;
    mask-image:radial-gradient(ellipse 80% 60% at 50% 20%, black 20%, transparent 80%);
    -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 20%, black 20%, transparent 80%);
}

.noise-overlay {
    position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.025;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-size:256px 256px;
}

.ambient-glow {
    position:fixed; top:-260px; left:50%; transform:translateX(-50%);
    width:1100px; height:720px; z-index:0; pointer-events:none;
    background:
        radial-gradient(ellipse at 30% 25%, rgba(70, 220, 160, .07) 0%, transparent 55%),
        radial-gradient(ellipse at 70% 20%, rgba(50, 200, 220, .08) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 75%, rgba(150, 90, 230, .04) 0%, transparent 50%);
    filter:blur(60px);
}

/* ==================== NAV ==================== */
.nav { position:fixed; top:0; left:0; right:0; z-index:100; padding:20px 0; transition:all .5s var(--ease-out); }
.nav-glow {
    position:absolute; inset:0;
    background:radial-gradient(ellipse 600px 180px at 35% -10%, rgba(50, 200, 220, .05), transparent 70%);
    opacity:0; transition:opacity .5s; pointer-events:none;
}
.nav.scrolled .nav-glow{ opacity:1; }
.nav.scrolled{
    padding:12px 0;
    background:rgba(5, 8, 16, .82);
    backdrop-filter:blur(24px) saturate(1.4);
    -webkit-backdrop-filter:blur(24px) saturate(1.4);
    border-bottom:1px solid var(--border);
}
.nav-bottom-line{
    position:absolute; bottom:0; left:30px; right:30px; height:1px;
    background:linear-gradient(90deg, transparent, var(--accent), transparent);
    opacity:0; transition:opacity .5s;
}
.nav.scrolled .nav-bottom-line{ opacity:.35; }

.nav-inner{ position:relative; z-index:1; max-width:1080px; margin:0 auto; padding:0 28px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.nav-brand{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.brand-icon{ width:30px; height:30px; border-radius:8px; transition:transform .35s var(--ease-out); }
.nav-brand:hover .brand-icon{ transform:rotate(-8deg) scale(1.08); }
.brand-name{ font-size:.94rem; font-weight:700; letter-spacing:-.005em; }
.brand-version{
    font-family:var(--mono); font-size:.66rem; font-weight:500;
    color:#fff; letter-spacing:.12em; text-transform:lowercase;
    opacity:.4;
    transition:opacity .3s var(--ease-out);
}
.brand-version:hover{ opacity:.75; }

.nav-group{ display:flex; align-items:center; gap:6px; }
.nav-right{ display:flex; align-items:center; gap:4px; }
.nav-links{ display:flex; gap:2px; }
.nav-links a{
    font-size:.84rem; font-weight:500; color:var(--text-sub); padding:7px 14px; border-radius:8px;
    transition:all .2s var(--ease-out); letter-spacing:.005em;
}
.nav-links a:hover{ color:var(--text); background:rgba(255,255,255,.04); }

/* 语言下拉 */
.lang-dropdown{ position:relative; z-index:200; }
.lang-btn{
    display:flex; align-items:center; gap:6px; padding:7px 12px 7px 11px;
    background:transparent; border:1px solid var(--border); border-radius:9px;
    cursor:pointer; color:var(--text-sub); font-family:var(--sans); font-size:.8rem; font-weight:500;
    transition:all .2s var(--ease-out); white-space:nowrap;
}
.lang-btn:hover{
    border-color:var(--border-hi); color:var(--text); background:rgba(255,255,255,.03);
}
.lang-globe{ width:14px; height:14px; opacity:.6; } .lang-btn:hover .lang-globe{ opacity:.9; }
.lang-arrow{ width:11px; height:11px; transition:transform .3s var(--ease-out); opacity:.5; }
.lang-dropdown.open .lang-arrow{ transform:rotate(180deg); opacity:.8; }
.lang-current{ line-height:1; }

.lang-menu{
    position:absolute; top:calc(100% + 8px); right:0; width:200px;
    background:rgba(10, 15, 26, .96); border:1px solid var(--border-hi); border-radius:12px; padding:6px;
    opacity:0; visibility:hidden; transform:translateY(-8px) scale(.97);
    transition:all .25s var(--ease-out);
    box-shadow:0 20px 50px rgba(0,0,0,.5), 0 0 0 1px rgba(50, 200, 220, .04);
    backdrop-filter:blur(24px) saturate(1.4); z-index:300;
}
.lang-menu::before{
    content:''; position:absolute; top:-6px; right:18px; width:12px; height:12px;
    background:rgba(10, 15, 26, .96); border-left:1px solid var(--border-hi); border-top:1px solid var(--border-hi);
    transform:rotate(45deg);
}
.lang-dropdown.open .lang-menu{ opacity:1; visibility:visible; transform:translateY(0) scale(1); }
.lang-menu-header{ font-family:var(--mono); font-size:.6rem; color:var(--text-dim); text-transform:uppercase; letter-spacing:.15em; padding:10px 12px 4px; }

.lang-opt{
    display:flex; align-items:center; gap:10px; width:100%; padding:10px 12px;
    background:none; border:1px solid transparent; border-radius:9px; cursor:pointer; transition:all .2s;
}
.opt-name{ font-size:.86rem; font-weight:600; }
.opt-sub{ font-size:.7rem; color:var(--text-dim); margin-top:1px; }
.opt-check{ width:15px; height:15px; margin-left:auto; flex-shrink:0; opacity:0; transform:scale(.4) translateX(4px); transition:all .25s var(--ease-out); color:var(--accent-bright); }
.lang-opt:hover{ background:rgba(255,255,255,.03); }
.lang-opt.active .opt-name{ color:var(--accent-bright); }
.lang-opt.active .opt-check{ opacity:1; transform:scale(1) translateX(0); }

/* 汉堡菜单 */
.nav-menu-btn{
    display:none; flex-direction:column; justify-content:center; gap:5px;
    width:34px; height:34px; background:none; border:1px solid var(--border); border-radius:8px; cursor:pointer; padding:0 8px;
}
.nav-menu-btn i{ display:block; height:1.5px; background:var(--text-sub); border-radius:1px; transition:all .3s; }
.nav-menu-btn.active i:nth-child(1){ transform:rotate(45deg) translate(4px,4px); }
.nav-menu-btn.active i:nth-child(2){ opacity:0; }
.nav-menu-btn.active i:nth-child(3){ transform:rotate(-45deg) translate(4px,-4px); }

@media(max-width:720px){
    .nav-links{ display:none; position:absolute; top:calc(100%+8px); left:28px; right:28px; flex-direction:column; background:var(--bg-elev); border:1px solid var(--border); border-radius:12px; padding:8px; backdrop-filter:blur(20px); }
    .nav-links.open{ display:flex; }
    .nav-links a{ padding:11px 14px; }
    .nav-menu-btn{ display:flex; }
}

/* ==================== HERO ==================== */
.hero{
    position:relative; width:100%; min-height:100vh;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center;
    padding:140px 28px 100px; margin:0; z-index:1;
    overflow:hidden;
}
.hero-visual-placeholder{ display:none; }

/* 主界面图片作为背景 - 全宽不缩放 */
.hero-bg-blur{
    position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden;
}
.hero-bg-img{
    position:absolute; inset:0; width:100%; height:100%;
    object-fit:cover; object-position:center;
    filter:blur(12px) saturate(.95) brightness(.75);
    will-change:transform;
}
.hero-bg-overlay{
    position:absolute; inset:0;
    background:
        radial-gradient(ellipse at 50% 30%, rgba(50, 200, 220, .05) 0%, transparent 70%),
        linear-gradient(180deg, rgba(5, 8, 16, .22) 0%, rgba(5, 8, 16, .55) 100%);
}

.hero-bg-shapes{ position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:1; }
.shape{
    position:absolute; border-radius:50%; filter:blur(100px); opacity:.14;
    will-change:transform;
}
.shape-1{ width:420px; height:420px; top:8%; right:8%; background:var(--aurora-green); }
.shape-2{ width:340px; height:340px; bottom:12%; right:32%; background:var(--aurora-purple); }
.shape-3{ width:300px; height:300px; top:50%; left:-3%; background:var(--aurora-cyan); }

.hero-content{ position:relative; z-index:3; width:100%; max-width:760px; margin:0 auto; }

.hero-badge{
    display:inline-flex; align-items:center; gap:6px;
    font-size:.78rem; color:var(--text-sub);
    padding:6px 14px; border-radius:100px; border:1px solid var(--border);
    margin-bottom:32px; background:rgba(255,255,255,.02);
}
.hero-badge svg{ width:13px; height:13px; color:var(--aurora-cyan); }

.hero-title{ margin-bottom:28px; }
.title-row{
    display:flex; align-items:baseline; justify-content:center;
    flex-wrap:wrap; gap:14px;
    font-size:clamp(2.2rem,4.8vw,3.6rem); font-weight:800;
    line-height:1.08; letter-spacing:-.035em; margin-bottom:14px;
    color:var(--text);
}
.title-text{
    background:linear-gradient(135deg, var(--aurora-cyan) 0%, var(--aurora-green) 50%, var(--aurora-purple) 100%);
    -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
    cursor:pointer; outline:none;
    transition:opacity .35s var(--ease-out), transform .25s var(--ease-out), filter .3s var(--ease-out);
    will-change:opacity, transform;
}
.title-text:hover{ filter:brightness(1.15) saturate(1.1); }
.title-text:focus-visible{ filter:brightness(1.2) saturate(1.15); }
.title-version{ display:none; } /* 旧版兼容 */

/* 副标题下方的版本号 - 无框白字 */
.hero-ver{
    display:inline-block;
    margin-top:8px;
    font-family:var(--mono); font-size:.72rem; font-weight:500;
    color:#fff; letter-spacing:.12em; text-transform:lowercase;
    opacity:.5;
    transition:opacity .3s var(--ease-out);
}
.hero-ver:hover{ opacity:.8; }
/* 标语文本切换过渡（hover/focus 效果已在主规则中） */
.title-text.is-swapping{ opacity:0; transform:translateY(4px); }

/* 动态注入内容：空时透明，JS 填充后淡入 */
.title-text:empty,
.title-sub:empty,
.hero-ver:empty,
#heroIntro:empty,
.brand-version:empty{
    opacity:0; pointer-events:none;
}
.title-sub,
.hero-ver,
#heroIntro,
.brand-version{
    transition:opacity .45s var(--ease-out);
}
.title-sub{
    display:block; font-size:clamp(1rem,1.9vw,1.3rem); font-weight:500;
    color:var(--text-sub); letter-spacing:-.005em;
}

.hero-desc{
    font-size:1.02rem; color:var(--text-sub); line-height:1.7; max-width:520px; margin-bottom:36px;
}
.hero-actions{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:36px; }

.btn{
    display:inline-flex; align-items:center; gap:8px;
    font-family:var(--sans); font-size:.9rem; font-weight:600;
    padding:13px 26px; border-radius:10px; cursor:pointer;
    transition:all .25s var(--ease-out); border:none; letter-spacing:.005em;
}
.btn svg{ width:16px; height:16px; flex-shrink:0; }
.btn-primary{
    background:var(--accent); color:#050810;
    box-shadow:0 4px 24px rgba(50, 200, 220, .25), inset 0 1px 0 rgba(255,255,255,.15);
}
.btn-primary:hover{
    transform:translateY(-1px);
    background:var(--accent-bright);
    box-shadow:0 8px 32px rgba(50, 200, 220, .35), inset 0 1px 0 rgba(255,255,255,.2);
}
.btn-ghost{
    background:transparent; color:var(--text-sub); border:1px solid var(--border);
}
.btn-ghost:hover{ color:var(--text); border-color:var(--border-hi); background:rgba(255,255,255,.025); }

/* Hero 元信息 */
.hero-meta{ display:flex; flex-wrap:wrap; gap:20px; }
.meta-item{
    display:flex; align-items:center; gap:6px;
    font-size:.82rem; color:var(--text-sub);
}
.meta-item svg{ width:14px; height:14px; color:var(--aurora-green); flex-shrink:0; }

/* ====== 截图 ====== */
.hero-visual{ position:relative; display:flex; align-items:center; justify-content:center; }
.shot-stage{ position:relative; }
.shot-glow{
    position:absolute; inset:-30px; border-radius:30px; z-index:-1;
    background:radial-gradient(ellipse at center, rgba(50, 200, 220, .15) 0%, transparent 60%);
    filter:blur(40px);
}

.shot-card{
    position:relative; width:560px; max-width:calc(100vw - 56px); border-radius:18px;
    overflow:hidden; background:var(--bg-elev); border:1px solid rgba(255,255,255,.06);
    box-shadow:
        0 24px 60px rgba(0,0,0,.5),
        0 0 0 1px rgba(255,255,255,.02),
        0 0 80px rgba(50, 200, 220, .05),
        inset 0 1px 0 rgba(255,255,255,.04);
    transition:all .5s var(--ease-out);
}
.shot-card:hover{
    transform:translateY(-4px);
    box-shadow:
        0 30px 80px rgba(0,0,0,.55),
        0 0 0 1px rgba(50, 200, 220, .1),
        0 0 100px rgba(70, 220, 160, .07),
        inset 0 1px 0 rgba(255,255,255,.06);
}

.shot-header{
    display:flex; align-items:center; padding:12px 18px; gap:10px;
    background:rgba(0,0,0,.25); border-bottom:1px solid var(--border);
}
.shot-dots{ display:flex; gap:6px; }
.shot-dots i{ display:block; width:10px; height:10px; border-radius:50%; }
.d-red{ background:#ff5f57; } .d-yel{ background:#febc2e; } .d-grn{ background:#28c840; }
.shot-title{ font-size:.72rem; font-family:var(--mono); color:var(--text-sub); flex:1; text-align:center; letter-spacing:.02em; }
.shot-actions{ display:flex; gap:5px; }
.shot-actions i{ width:9px; height:9px; border-radius:2px; background:rgba(255,255,255,.08); }

.shot-body{ line-height:0; position:relative; overflow:hidden; }
.shot-img{ width:100%; display:block; }

@media(max-width:920px){
    .hero-desc{ margin-left:auto; margin-right:auto; }
    .hero-actions{ justify-content:center; }
    .hero-meta{ justify-content:center; }
    .hero-bg-shapes{ display:none; }
}

/* ==================== SECTIONS ==================== */
.section{ position:relative; z-index:1; padding:128px 0; }
.sec-head{ margin-bottom:64px; text-align:center; }
.sec-title{ font-size:clamp(1.8rem,3.8vw,2.6rem); font-weight:800; letter-spacing:-.03em; margin-bottom:14px; }
.sec-desc{ font-size:1.02rem; color:var(--text-sub); max-width:560px; margin:0 auto; line-height:1.7; }

/* Reveal - 重力落下动效 */
.reveal{
    opacity:0; transform:translateY(50px) scale(.95);
    transition:opacity .8s cubic-bezier(.16, 1, .3, 1), transform .8s cubic-bezier(.16, 1, .3, 1);
}
.reveal.visible{ opacity:1; transform:translateY(0) scale(1); }

/* 重要度分级的不同持续时间：越重要越慢（落下更沉稳） */
.reveal[data-tier="1"]{ transition-duration:.95s; }
.reveal[data-tier="2"]{ transition-duration:.8s; }
.reveal[data-tier="3"]{ transition-duration:.65s; }
.reveal[data-tier="4"]{ transition-duration:.5s; }

/* 功能区阶梯延迟（按 DOM 顺序） */
.sec-features .feat-card.reveal:nth-of-type(1){ transition-delay:0s; }
.sec-features .feat-card.reveal:nth-of-type(2){ transition-delay:.08s; }
.sec-features .feat-card.reveal:nth-of-type(3){ transition-delay:.16s; }
.sec-features .feat-card.reveal:nth-of-type(4){ transition-delay:.24s; }
.sec-features .feat-card.reveal:nth-of-type(5){ transition-delay:.32s; }
.sec-features .feat-card.reveal:nth-of-type(6){ transition-delay:.40s; }
.sec-features .feat-card.reveal:nth-of-type(7){ transition-delay:.48s; }
.sec-features .feat-card.reveal:nth-of-type(8){ transition-delay:.56s; }

/* Hero 内容阶梯延迟：tier 1→4 依次落下 */
.hero-content .hero-badge.reveal{ transition-delay:.1s; }
.hero-content .hero-title.reveal{ transition-delay:0s; }
.hero-content .hero-desc.reveal{ transition-delay:.25s; }
.hero-content .hero-actions.reveal{ transition-delay:.4s; }
.hero-content .hero-meta.reveal{ transition-delay:.55s; }

/* CYSO Core 流程节点也按顺序点亮 */
.core-flow .flow-node{ transition:all .5s cubic-bezier(.16, 1, .3, 1); }
.core-flow.reveal{ transition-delay:0s; }
.core-flow .flow-node{ opacity:0; transform:translateY(14px); }
.core-flow.visible .flow-node{ opacity:1; transform:translateY(0); }
.core-flow.visible .flow-node:nth-of-type(1){ transition-delay:.15s; }
.core-flow.visible .flow-node:nth-of-type(3){ transition-delay:.25s; }
.core-flow.visible .flow-node:nth-of-type(5){ transition-delay:.35s; }
.core-flow.visible .flow-node:nth-of-type(7){ transition-delay:.45s; }
.core-flow.visible .flow-node:nth-of-type(9){ transition-delay:.55s; }
.core-flow.visible .flow-outcomes{ opacity:0; animation:fade-up .7s cubic-bezier(.16, 1, .3, 1) .8s forwards; }
.flow-outcomes{ opacity:0; }
@keyframes fade-up{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:translateY(0); } }

@media (prefers-reduced-motion: reduce){
    .reveal, .core-flow .flow-node, .flow-outcomes{ transition-duration:.01ms !important; animation:none !important; }
    .shape{ animation:none; }
}

/* ==================== FEATURES (Bento 布局) ==================== */
.feat-grid{
    display:grid; grid-template-columns:repeat(4, 1fr); grid-auto-rows:minmax(150px, auto); gap:18px;
}
.feat-card{
    display:flex; flex-direction:column;
    background:var(--bg-card); border:1px solid var(--border); border-radius:16px;
    padding:26px 24px; transition:all .35s var(--ease-out);
    position:relative; overflow:hidden;
}
.feat-card::before{
    content:''; position:absolute; top:0; left:0; right:0; height:1px;
    background:linear-gradient(90deg, transparent, var(--accent), transparent);
    opacity:0; transition:opacity .35s;
}
.feat-card:hover{
    border-color:var(--border-hi); transform:translateY(-3px);
    background:linear-gradient(180deg, rgba(50, 200, 220, .02), var(--bg-card));
}
.feat-card:hover::before{ opacity:.6; }

.feat-card-body{ flex:1; display:flex; flex-direction:column; }
.feat-card-xl .feat-card-body{ justify-content:flex-start; }
.feat-card-wide{ flex-direction:row; align-items:flex-start; gap:18px; }
.feat-beauty{ background:linear-gradient(135deg, rgba(50, 200, 220, .04), rgba(150, 90, 230, .04)), var(--bg-card); }

.feat-icon{
    width:44px; height:44px; border-radius:11px;
    background:rgba(50, 200, 220, .08); color:var(--accent-bright);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:16px; transition:all .35s var(--ease-out); flex-shrink:0;
}
.feat-card-wide .feat-icon{ margin-bottom:0; }
.feat-icon svg{ width:22px; height:22px; }
.feat-card:hover .feat-icon{
    background:rgba(50, 200, 220, .14); transform:scale(1.06);
}

.feat-card h3{ font-size:1.02rem; font-weight:700; margin-bottom:6px; letter-spacing:-.005em; }
.feat-card-xl h3{ font-size:1.4rem; margin-bottom:10px; }
.feat-card-wide h3{ font-size:1.05rem; }
.feat-card p{ font-size:.84rem; color:var(--text-sub); line-height:1.6; }
.feat-card-xl p{ font-size:.95rem; max-width:380px; }
.feat-card-wide p{ font-size:.84rem; }

/* CYSO Core 大卡内的 13 项具体权限列表 */
.core-perms{
    display:flex; flex-direction:column; gap:8px; margin-top:20px;
    padding-top:18px; border-top:1px solid var(--border);
}
.cp-row{ display:grid; grid-template-columns:74px 1fr; gap:12px; align-items:center; }
.cp-cat{
    font-size:.74rem; color:var(--text-sub); font-weight:600;
    letter-spacing:.02em; line-height:1.3;
}
.cp-tags{ display:flex; flex-wrap:wrap; gap:5px; }
.cp-tag{
    display:inline-flex; align-items:center;
    padding:3px 9px; font-size:.72rem; font-weight:500;
    background:rgba(50, 200, 220, .07); color:var(--text);
    border:1px solid rgba(50, 200, 220, .14); border-radius:6px;
    letter-spacing:.01em; transition:all .25s var(--ease-out);
}
.feat-core:hover .cp-tag{
    background:rgba(50, 200, 220, .12);
    border-color:rgba(50, 200, 220, .22);
}

/* 三态胶囊 */
.core-pills{
    display:flex; gap:8px; margin-top:18px; flex-wrap:wrap;
}
.core-pill{
    display:inline-flex; align-items:center; gap:6px;
    padding:5px 12px 5px 9px; font-size:.74rem; font-weight:600;
    background:rgba(255,255,255,.02); border:1px solid var(--border); border-radius:100px;
    letter-spacing:.01em;
}
.pd{ width:7px; height:7px; border-radius:50%; }
.pill-allow .pd{ background:var(--aurora-green); box-shadow:0 0 6px rgba(70, 220, 160, .6); }
.pill-ask .pd{ background:#fbbf24; box-shadow:0 0 6px rgba(251, 191, 36, .6); }
.pill-deny .pd{ background:#f87171; box-shadow:0 0 6px rgba(248, 113, 113, .6); }

/* 极光卡片：底部色板 */
.feat-aurora{ justify-content:space-between; }
.aurora-palette{
    display:flex; gap:8px; margin-top:18px;
    padding-top:16px; border-top:1px solid var(--border);
}
.ap-dot{
    width:24px; height:24px; border-radius:50%;
    box-shadow:0 4px 16px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.15);
    transition:transform .35s var(--ease-out);
}
.feat-aurora:hover .ap-dot{ transform:translateY(-2px) scale(1.05); }
.ap-c1{ background:radial-gradient(circle at 30% 30%, #5ee0f0, var(--aurora-cyan)); }
.ap-c2{ background:radial-gradient(circle at 30% 30%, #6cf2bc, var(--aurora-green)); }
.ap-c3{ background:radial-gradient(circle at 30% 30%, #b88aff, var(--aurora-purple)); }
.ap-c4{ background:radial-gradient(circle at 30% 30%, #ffbccc, var(--aurora-pink)); }

/* 重要度布局：不同跨格数形成不规则排列 */
.feat-card-xl{ grid-column:span 2; grid-row:span 2; }   /* 2x2 - 最大 */
.feat-card-wide{ grid-column:span 2; grid-row:span 1; }  /* 2x1 - 宽 */
.feat-card-sm{ grid-column:span 1; grid-row:span 1; }    /* 1x1 - 普通 */
.feat-card-full{ grid-column:span 4; grid-row:span 1; }  /* 4x1 - 全宽 */
.feat-card-full{ flex-direction:row; align-items:center; gap:18px; }
.feat-card-full .feat-icon{ margin-bottom:0; }
.feat-card-full h3{ font-size:1.1rem; margin-bottom:2px; }

/* 美观界面色板 */
.beauty-palette{ display:flex; gap:6px; margin-top:10px; }
.bp-dot{ position:relative; width:14px; height:14px; border-radius:50%; display:inline-block; }
.bp-dot i{ position:absolute; inset:3px; border-radius:50%; background:rgba(255, 255, 255, .25); }
.bp-c1{ background:var(--aurora-cyan); }
.bp-c2{ background:var(--aurora-green); }
.bp-c3{ background:var(--aurora-purple); }
.bp-c4{ background:var(--aurora-pink); }
.bp-c1{ box-shadow:0 0 10px rgba(50, 200, 220, .4); }
.bp-c2{ box-shadow:0 0 10px rgba(70, 220, 160, .4); }
.bp-c3{ box-shadow:0 0 10px rgba(150, 90, 230, .4); }
.bp-c4{ box-shadow:0 0 10px rgba(240, 160, 180, .4); }

@media(max-width:900px){
    .feat-grid{ grid-template-columns:repeat(2, 1fr); }
    .feat-card-xl{ grid-column:span 2; grid-row:span 2; }
    .feat-card-wide{ grid-column:span 2; }
    .feat-card-sm{ grid-column:span 1; }
    .feat-card-full{ grid-column:span 2; }
}
@media(max-width:560px){
    .feat-grid{ grid-template-columns:1fr; }
    .feat-card-xl,
    .feat-card-wide,
    .feat-card-sm,
    .feat-card-full{ grid-column:span 1; grid-row:span 1; }
    .feat-card-wide, .feat-card-full{ flex-direction:column; }
}

/* ==================== CYSO CORE ==================== */
.sec-cysocore{ position:relative; }

/* 数据看板 */
.core-stats{
    display:grid; grid-template-columns:repeat(4, 1fr); gap:1px;
    background:var(--border); border:1px solid var(--border); border-radius:16px;
    overflow:hidden; margin-bottom:48px;
}
.core-stat{
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
    padding:32px 16px; background:var(--bg-card); text-align:center;
    transition:background .35s var(--ease-out);
}
.core-stat:hover{ background:linear-gradient(180deg, rgba(50, 200, 220, .04), var(--bg-card)); }
.stat-num{
    font-family:var(--mono); font-size:2.4rem; font-weight:700;
    line-height:1; letter-spacing:-.02em;
    background:linear-gradient(135deg, var(--aurora-cyan), var(--aurora-green));
    -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.stat-num svg{ width:2.2rem; height:2.2rem; color:var(--aurora-cyan); -webkit-text-fill-color:initial; }
.stat-label{ font-size:.82rem; color:var(--text-sub); letter-spacing:.02em; }
@media(max-width:720px){
    .core-stats{ grid-template-columns:repeat(2, 1fr); border-radius:14px; }
    .stat-num{ font-size:2rem; }
    .core-stat{ padding:24px 12px; }
}

.core-grid{
    display:none; /* 旧样式已被 core-groups 取代 */
}
.core-card{
    display:none;
}

/* 5 大权限分组 - 横向简洁卡片 */
.core-groups{
    display:grid; grid-template-columns:repeat(5, 1fr); gap:14px;
    margin-bottom:48px;
}
.core-group{
    display:flex; align-items:center; gap:14px;
    padding:18px 18px; background:var(--bg-card); border:1px solid var(--border); border-radius:14px;
    transition:all .35s var(--ease-out);
}
.core-group:hover{
    border-color:var(--border-hi); transform:translateY(-2px);
    background:linear-gradient(180deg, rgba(50, 200, 220, .02), var(--bg-card));
}
.cg-icon{
    width:38px; height:38px; border-radius:10px;
    background:rgba(50, 200, 220, .08); color:var(--accent-bright);
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
    transition:all .35s var(--ease-out);
}
.cg-icon svg{ width:19px; height:19px; }
.core-group:hover .cg-icon{ background:rgba(50, 200, 220, .14); transform:scale(1.05); }
.cg-body h3{ font-size:.92rem; font-weight:700; margin-bottom:2px; }
.cg-body p{ font-size:.74rem; color:var(--text-dim); font-family:var(--mono); letter-spacing:.02em; }

@media(max-width:880px){ .core-groups{ grid-template-columns:repeat(3, 1fr); } }
@media(max-width:560px){ .core-groups{ grid-template-columns:repeat(2, 1fr); } .cg-body h3{ font-size:.86rem; } }

/* 决策流程 */
.core-flow{
    padding:36px 32px; background:var(--bg-card); border:1px solid var(--border); border-radius:18px;
    position:relative; overflow:hidden;
}
.core-flow::before{
    content:''; position:absolute; top:0; left:0; right:0; height:1px;
    background:linear-gradient(90deg, transparent, var(--aurora-cyan), transparent);
    opacity:.5;
}
.flow-head{ text-align:center; margin-bottom:32px; }
.flow-head h3{ font-size:1.15rem; font-weight:700; margin-bottom:6px; }
.flow-head p{ font-size:.88rem; color:var(--text-sub); }

.flow-track{
    display:flex; align-items:stretch; justify-content:space-between; gap:8px;
    margin-bottom:32px;
}
.flow-node{
    flex:1; padding:20px 18px;
    background:rgba(50, 200, 220, .03); border:1px solid var(--border); border-radius:12px;
    text-align:center; transition:all .35s var(--ease-out);
}
.flow-node:hover{ border-color:var(--border-hi); background:rgba(50, 200, 220, .06); }
.flow-decision{
    background:linear-gradient(135deg, rgba(50, 200, 220, .08), rgba(70, 220, 160, .05));
    border-color:rgba(50, 200, 220, .25);
}
.fn-num{
    font-family:var(--mono); font-size:.66rem; color:var(--aurora-cyan);
    letter-spacing:.15em; margin-bottom:8px;
}
.fn-t{ font-size:.98rem; font-weight:700; margin-bottom:4px; }
.fn-d{ font-size:.78rem; color:var(--text-sub); }

.flow-arrow{
    width:40px; height:auto; flex-shrink:0; align-self:center;
    color:var(--text-dim); opacity:.5;
}

/* 三种处置结果 */
.flow-outcomes{
    display:grid; grid-template-columns:repeat(3, 1fr); gap:14px;
    padding-top:28px; border-top:1px dashed var(--border);
}
.outcome{
    display:flex; align-items:flex-start; gap:12px;
    padding:16px 18px; background:rgba(255,255,255,.02); border-radius:11px;
    border:1px solid var(--border); transition:all .3s var(--ease-out);
}
.outcome:hover{ border-color:var(--border-hi); }
.oc-dot{
    width:9px; height:9px; border-radius:50%; margin-top:6px; flex-shrink:0;
    box-shadow:0 0 0 3px rgba(255,255,255,.02);
}
.outcome-allow .oc-dot{ background:var(--aurora-green); box-shadow:0 0 12px rgba(70, 220, 160, .5), 0 0 0 3px rgba(70, 220, 160, .08); }
.outcome-ask .oc-dot{ background:#fbbf24; box-shadow:0 0 12px rgba(251, 191, 36, .5), 0 0 0 3px rgba(251, 191, 36, .08); }
.outcome-deny .oc-dot{ background:#f87171; box-shadow:0 0 12px rgba(248, 113, 113, .5), 0 0 0 3px rgba(248, 113, 113, .08); }
.oc-body strong{ display:block; font-size:.92rem; font-weight:700; margin-bottom:3px; }
.oc-body span{ display:block; font-size:.78rem; color:var(--text-sub); line-height:1.5; }

@media(max-width:720px){
    .core-flow{ padding:28px 20px; }
    .flow-track{ flex-direction:column; }
    .flow-arrow{ transform:rotate(90deg); align-self:center; }
    .flow-outcomes{ grid-template-columns:1fr; }
}

/* ==================== DOWNLOAD ==================== */
.dl-area{ display:flex; justify-content:center; }
.dl-card{
    display:flex; align-items:center; gap:20px; width:100%; max-width:480px;
    padding:24px 28px; background:var(--bg-card); border:1px solid var(--border); border-radius:14px;
    transition:all .3s var(--ease-out);
}
.dl-card:hover{
    border-color:var(--border-hi); transform:translateY(-3px);
    box-shadow:0 16px 40px rgba(0,0,0,.3), 0 0 60px -16px rgba(50, 200, 220, .1);
}
.dl-platform{
    width:46px; height:46px; border-radius:11px;
    background:rgba(50, 200, 220, .1); color:var(--accent-bright);
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
    transition:background .3s;
}
.dl-card:hover .dl-platform{ background:rgba(50, 200, 220, .16); }
.dl-platform svg{ width:22px; height:22px; }
.dl-info{ flex:1; }
.dl-info strong{ font-size:1.05rem; font-weight:700; display:block; }
.dl-info span{ font-size:.82rem; color:var(--text-dim); }
.dl-arrow{ color:var(--text-dim); transition:all .3s var(--ease-out); }
.dl-arrow svg{ width:18px; height:18px; }
.dl-card:hover .dl-arrow{ color:var(--accent-bright); transform:translateX(3px); }

.dl-note{ text-align:center; font-size:.84rem; color:var(--text-dim); margin-top:24px; }

@media(max-width:520px){ .dl-card{ flex-direction:column; text-align:center; gap:14px; } }

/* ==================== ABOUT ==================== */
.sec-about{ padding:96px 0 96px; }
.about-wrap{
    max-width:760px; margin:0 auto; text-align:center;
    padding:48px 40px; background:var(--bg-card);
    border:1px solid var(--border); border-radius:20px; position:relative; overflow:hidden;
}
.about-wrap::before{
    content:''; position:absolute; top:0; left:0; right:0; height:1px;
    background:linear-gradient(90deg, transparent, var(--aurora-cyan), var(--aurora-green), transparent);
    opacity:.5;
}
.about-head{ margin-bottom:32px; }
.about-eyebrow{
    display:inline-block; font-family:var(--mono); font-size:.7rem;
    color:var(--aurora-cyan); text-transform:uppercase; letter-spacing:.2em;
    margin-bottom:18px;
}
.about-lead{
    font-size:clamp(1.4rem, 2.8vw, 1.9rem); font-weight:700;
    line-height:1.4; letter-spacing:-.02em; color:var(--text);
}
.about-body{
    display:flex; flex-direction:column; gap:14px;
    font-size:.96rem; color:var(--text-sub); line-height:1.75; text-align:left;
    max-width:600px; margin:0 auto;
}
.about-sign{
    display:flex; align-items:center; justify-content:center; gap:14px;
    margin-top:36px; padding-top:28px;
    border-top:1px solid var(--border);
}
.sig-line{
    flex:1; max-width:80px; height:1px;
    background:linear-gradient(90deg, transparent, var(--border-hi));
}
.sig-line:last-of-type{ background:linear-gradient(90deg, var(--border-hi), transparent); }
.sig-text{ font-family:var(--mono); font-size:.78rem; color:var(--text-dim); letter-spacing:.04em; }

@media(max-width:560px){
    .sec-about{ padding:72px 0 48px; }
    .about-wrap{ padding:36px 24px; }
    .about-sign{ gap:10px; }
    .sig-line{ max-width:40px; }
}

/* ==================== FOOTER ==================== */
.footer{ position:relative; z-index:1; border-top:1px solid var(--border); padding:32px 0; }
.ft-bar{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.ft-brand{ display:flex; align-items:center; gap:10px; }
.ft-icon{ width:22px; height:22px; border-radius:5px; }
.ft-copy{ font-size:.8rem; color:var(--text-dim); }
.ft-links{ display:flex; gap:24px; }
.ft-links a{ font-size:.82rem; color:var(--text-dim); transition:color .2s; }
.ft-links a:hover{ color:var(--text); }

@media(max-width:520px){ .ft-bar{ flex-direction:column; text-align:center; } }

/* ==================== REDUCED MOTION ==================== */
@media(prefers-reduced-motion:reduce){
    *,*::before,*::after{ animation-duration:.001ms!important; transition-duration:.001ms!important; }
    .reveal{opacity:1; transform:none;} .cursor-glow{display:none;}
}
