:root{--bg-primary:#0d1b2a;--bg-secondary:#1b2838;--bg-tertiary:#243447;--bg-card:#1e3044;--accent-blue:#00b4d8;--accent-blue-dim:rgba(0,180,216,0.15);--accent-warm:#f77f00;--accent-warm-dim:rgba(247,127,0,0.15);--accent-green:#2ec4b6;--accent-green-dim:rgba(46,196,182,0.15);--accent-red:#ef233c;--accent-red-dim:rgba(239,35,60,0.15);--accent-gold:#ffd60a;--text-primary:#e0e1dd;--text-secondary:#8d99ae;--text-on-accent:#0d1b2a;--border-color:rgba(141,153,174,0.2);--border-accent:rgba(0,180,216,0.3);--font-display:"Archivo Black",sans-serif;--font-body:"Space Grotesk",sans-serif;--title-size:clamp(1.5rem,4.5vw,3.2rem);--h2-size:clamp(1.2rem,3vw,2rem);--h3-size:clamp(0.95rem,2vw,1.4rem);--body-size:clamp(0.7rem,1.3vw,1rem);--small-size:clamp(0.6rem,0.9vw,0.8rem);--tag-size:clamp(0.55rem,0.8vw,0.7rem);--slide-padding:clamp(1.5rem,4vw,4rem);--content-gap:clamp(0.5rem,1.5vw,1.5rem);--element-gap:clamp(0.3rem,0.8vw,0.8rem);--ease-out-expo:cubic-bezier(0.16,1,0.3,1);--duration-normal:0.6s;--hook-color:#ef233c;--disorient-color:#f77f00;--rebuild-color:#00b4d8;--empower-color:#2ec4b6;--confirm-color:#ffd60a}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow-x:hidden;font-family:var(--font-body);background:var(--bg-primary);color:var(--text-primary)}
html{scroll-snap-type:y mandatory;scroll-behavior:smooth}
.slide{width:100vw;height:100vh;height:100dvh;overflow:hidden;scroll-snap-align:start;display:flex;flex-direction:column;position:relative;background:var(--bg-primary)}
.slide-content{flex:1;display:flex;flex-direction:column;justify-content:center;max-height:100%;overflow:hidden;padding:var(--slide-padding)}
h1{font-family:var(--font-display);font-size:var(--title-size);line-height:1.1;letter-spacing:-0.02em}
h2{font-family:var(--font-display);font-size:var(--h2-size);line-height:1.2;letter-spacing:-0.01em}
h3{font-family:var(--font-body);font-weight:600;font-size:var(--h3-size);line-height:1.3}
p,li,td,th{font-size:var(--body-size);line-height:1.5}
.card,.container,.content-box{max-width:min(95vw,1100px);max-height:min(82vh,720px)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:clamp(0.5rem,1.2vw,1rem)}
img,.image-container{max-width:100%;max-height:min(50vh,400px);object-fit:contain}
.section-badge{display:inline-block;font-family:var(--font-body);font-size:var(--tag-size);font-weight:600;text-transform:uppercase;letter-spacing:0.1em;padding:clamp(2px,0.3vw,6px) clamp(8px,1vw,16px);border-radius:4px;margin-bottom:var(--element-gap)}
.badge-hook{background:var(--accent-red-dim);color:var(--accent-red)}
.badge-disorient{background:var(--accent-warm-dim);color:var(--accent-warm)}
.badge-rebuild{background:var(--accent-blue-dim);color:var(--accent-blue)}
.badge-empower{background:var(--accent-green-dim);color:var(--accent-green)}
.badge-confirm{background:rgba(255,214,10,0.15);color:var(--accent-gold)}
.slide-num{position:absolute;top:clamp(0.8rem,2vw,1.5rem);left:clamp(1rem,3vw,2.5rem);font-family:var(--font-display);font-size:clamp(0.7rem,1vw,0.9rem);color:var(--text-secondary);opacity:0.5}
.section-bar{position:absolute;bottom:0;left:0;width:100%;height:3px}
.section-bar .fill{height:100%;transition:width 0.5s var(--ease-out-expo)}
.info-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:8px;padding:clamp(0.8rem,1.5vw,1.5rem);position:relative;overflow:hidden}
.term-card{background:var(--bg-card);border:1px solid var(--border-accent);border-radius:12px;padding:clamp(1rem,2vw,2rem);position:relative}
.term-header{display:flex;align-items:baseline;gap:clamp(0.5rem,1vw,1rem);margin-bottom:var(--element-gap);flex-wrap:wrap}
.term-en{font-family:var(--font-display);font-size:var(--h2-size);color:var(--accent-blue)}
.term-vi{font-size:var(--body-size);color:var(--text-secondary);font-style:italic}
.term-row{display:flex;gap:clamp(0.5rem,1vw,1rem);margin-bottom:clamp(0.3rem,0.5vw,0.5rem);flex-wrap:wrap}
.term-label{font-weight:600;color:var(--accent-blue);min-width:clamp(60px,8vw,100px);font-size:var(--small-size);text-transform:uppercase;letter-spacing:0.05em}
.term-value{color:var(--text-primary);font-size:var(--body-size);flex:1}
.comparison-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(0.8rem,1.5vw,1.5rem)}
.fee-table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--small-size)}
.fee-table th{background:var(--bg-tertiary);padding:clamp(4px,0.5vw,8px) clamp(6px,0.8vw,12px);text-align:left;font-weight:600;color:var(--accent-blue);border-bottom:2px solid var(--accent-blue);font-size:var(--tag-size);text-transform:uppercase;letter-spacing:0.05em}
.fee-table td{padding:clamp(3px,0.4vw,6px) clamp(6px,0.8vw,12px);border-bottom:1px solid var(--border-color);color:var(--text-primary)}
.fee-table tr:hover td{background:rgba(0,180,216,0.05)}
.fee-table .tip{color:var(--accent-warm);font-size:var(--tag-size)}
.red-line-item{display:flex;align-items:flex-start;gap:clamp(0.5rem,1vw,1rem);padding:clamp(0.5rem,1vw,1rem) 0;border-bottom:1px solid rgba(239,35,60,0.15)}
.red-line-num{font-family:var(--font-display);font-size:var(--h2-size);color:var(--accent-red);min-width:clamp(25px,3vw,40px)}
.red-line-text{flex:1}
.red-line-rule{font-weight:600;color:var(--text-primary);font-size:var(--body-size)}
.red-line-why{color:var(--text-secondary);font-size:var(--small-size);margin-top:2px}
.process-flow{display:flex;flex-wrap:wrap;gap:clamp(0.3rem,0.6vw,0.6rem);align-items:center;justify-content:center}
.process-step{display:flex;align-items:center;gap:clamp(0.2rem,0.4vw,0.4rem);background:var(--bg-card);border:1px solid var(--border-color);border-radius:6px;padding:clamp(4px,0.5vw,8px) clamp(8px,1vw,14px);font-size:var(--small-size);font-weight:500;transition:all 0.3s var(--ease-out-expo)}
.process-step.highlight{border-color:var(--accent-warm);background:var(--accent-warm-dim);color:var(--accent-warm)}
.process-arrow{color:var(--text-secondary);font-size:var(--small-size);opacity:0.4}
.traffic-light-container{display:flex;gap:clamp(1rem,2vw,2.5rem);justify-content:center;align-items:stretch}
.traffic-light-item{flex:1;max-width:min(280px,30vw);text-align:center;border-radius:12px;padding:clamp(0.8rem,1.5vw,1.5rem);background:var(--bg-card);border:2px solid transparent;transition:border-color 0.5s,box-shadow 0.5s}
.traffic-light-item.green{border-color:var(--accent-green);box-shadow:0 0 20px rgba(46,196,182,0.2)}
.traffic-light-item.yellow{border-color:var(--accent-warm);box-shadow:0 0 20px rgba(247,127,0,0.2)}
.traffic-light-item.red{border-color:var(--accent-red);box-shadow:0 0 20px rgba(239,35,60,0.2)}
.tl-icon{width:clamp(36px,5vw,56px);height:clamp(36px,5vw,56px);border-radius:50%;margin:0 auto clamp(0.5rem,1vw,1rem);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:clamp(1rem,2vw,1.5rem);color:#fff}
.tl-icon.gi{background:var(--accent-green);box-shadow:0 0 15px rgba(46,196,182,0.5)}
.tl-icon.yi{background:var(--accent-warm);box-shadow:0 0 15px rgba(247,127,0,0.5)}
.tl-icon.ri{background:var(--accent-red);box-shadow:0 0 15px rgba(239,35,60,0.5)}
.tl-name{font-weight:700;font-size:var(--h3-size);margin-bottom:clamp(0.2rem,0.4vw,0.5rem)}
.tl-meaning{color:var(--text-secondary);font-size:var(--small-size);margin-bottom:clamp(0.3rem,0.5vw,0.6rem)}
.tl-action{font-size:var(--tag-size);color:var(--text-primary);background:rgba(255,255,255,0.05);border-radius:4px;padding:clamp(3px,0.3vw,6px) clamp(6px,0.5vw,10px)}
.script-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:10px;padding:clamp(0.8rem,1.5vw,1.5rem);font-size:var(--body-size);white-space:pre-line;line-height:1.6;max-height:min(55vh,450px);overflow-y:auto}
.script-card::-webkit-scrollbar{width:4px}
.script-card::-webkit-scrollbar-thumb{background:var(--accent-blue-dim);border-radius:2px}
.risk-table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--small-size)}
.risk-table th{background:var(--accent-red-dim);padding:clamp(4px,0.5vw,8px) clamp(6px,0.8vw,12px);text-align:left;font-weight:600;color:var(--accent-red);font-size:var(--tag-size);text-transform:uppercase;letter-spacing:0.05em}
.risk-table td{padding:clamp(3px,0.4vw,6px) clamp(6px,0.8vw,12px);border-bottom:1px solid var(--border-color)}
.risk-table .no-quote{color:var(--accent-red);font-weight:600}
.error-item{display:flex;gap:clamp(0.5rem,1vw,1rem);padding:clamp(0.4rem,0.8vw,0.8rem) 0;border-bottom:1px solid var(--border-color);align-items:flex-start}
.error-num{font-family:var(--font-display);font-size:var(--h3-size);color:var(--accent-warm);min-width:clamp(24px,3vw,36px)}
.error-text{flex:1}
.error-name{font-weight:600;font-size:var(--body-size)}
.error-consequence{color:var(--accent-red);font-size:var(--small-size);margin-top:2px}
.case-card{background:var(--bg-card);border:1px solid var(--border-accent);border-radius:10px;padding:clamp(0.8rem,1.5vw,1.5rem);cursor:pointer;transition:border-color 0.3s,box-shadow 0.3s}
.case-card:hover{border-color:var(--accent-blue);box-shadow:0 4px 20px rgba(0,180,216,0.15)}
.case-title{font-weight:700;font-size:var(--h3-size);color:var(--accent-blue);margin-bottom:clamp(0.3rem,0.5vw,0.5rem)}
.case-info{color:var(--text-secondary);font-size:var(--small-size);font-style:italic;margin-bottom:clamp(0.3rem,0.5vw,0.5rem)}
.case-detail{display:none;margin-top:clamp(0.5rem,0.8vw,0.8rem)}
.case-card.expanded .case-detail{display:block}
.case-detail-label{font-weight:600;color:var(--accent-warm);font-size:var(--small-size);text-transform:uppercase;letter-spacing:0.05em;margin-top:clamp(0.3rem,0.5vw,0.5rem);margin-bottom:2px}
.case-detail-text{font-size:var(--small-size);color:var(--text-primary);line-height:1.5}
.case-toggle{font-size:var(--tag-size);color:var(--accent-blue);margin-top:clamp(0.3rem,0.5vw,0.5rem)}
.case-card.expanded .case-toggle::after{content:' 收起 ▲'}
.case-card:not(.expanded) .case-toggle::after{content:' 点击展开 ▼'}
.template-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:clamp(0.5rem,1vw,1rem)}
.template-item{background:var(--bg-card);border:1px solid var(--border-color);border-radius:8px;padding:clamp(0.6rem,1vw,1rem);transition:border-color 0.3s,transform 0.2s}
.template-item:hover{border-color:var(--accent-blue);transform:translateY(-2px)}
.template-id{font-family:var(--font-display);font-size:var(--h3-size);color:var(--accent-blue)}
.template-name{font-weight:600;font-size:var(--body-size);margin:clamp(2px,0.3vw,4px) 0}
.template-fields{font-size:var(--tag-size);color:var(--text-secondary);line-height:1.4}
.cover-bg{position:absolute;inset:0;background:radial-gradient(ellipse at 20% 80%,rgba(0,180,216,0.12) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(46,196,182,0.08) 0%,transparent 50%),radial-gradient(ellipse at 50% 50%,rgba(0,180,216,0.04) 0%,transparent 70%),var(--bg-primary)}
.cover-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(0,180,216,0.04) 1px,transparent 1px),linear-gradient(90deg,rgba(0,180,216,0.04) 1px,transparent 1px);background-size:60px 60px}
.split-layout{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1rem,2vw,2rem);align-items:center}
.split-wrong{border-left:4px solid var(--accent-red);padding-left:clamp(0.5rem,1vw,1rem)}
.split-right{border-left:4px solid var(--accent-green);padding-left:clamp(0.5rem,1vw,1rem)}
.statement-headline{font-family:var(--font-display);font-size:clamp(1.3rem,3.5vw,2.8rem);line-height:1.15;color:var(--text-primary);max-width:900px}
.layer-stack{display:flex;flex-direction:column;gap:clamp(2px,0.3vw,4px);max-width:700px;margin:0 auto}
.layer-bar{height:clamp(28px,4vh,42px);border-radius:4px;display:flex;align-items:center;padding:0 clamp(8px,1vw,14px);font-weight:600;font-size:var(--small-size);color:var(--text-on-accent);transform:scaleX(0);transform-origin:left;transition:transform 0.5s var(--ease-out-expo)}
.slide.visible .layer-bar{transform:scaleX(1)}
.layer-bar.highlight-layer{box-shadow:0 0 0 3px var(--accent-red),0 0 20px rgba(239,35,60,0.3);z-index:1}
.formula-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(0.6rem,1vw,1rem)}
.formula-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:8px;padding:clamp(0.6rem,1vw,1rem)}
.formula-name{font-weight:700;color:var(--accent-blue);font-size:var(--body-size);margin-bottom:clamp(0.2rem,0.3vw,0.4rem)}
.formula-expr{font-family:'Space Grotesk',monospace;font-size:var(--small-size);color:var(--text-primary);line-height:1.5;margin-bottom:clamp(0.2rem,0.3vw,0.4rem)}
.formula-tip{font-size:var(--tag-size);color:var(--accent-warm)}
.compare-table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--small-size)}
.compare-table th{background:var(--bg-tertiary);padding:clamp(4px,0.5vw,8px) clamp(4px,0.6vw,10px);text-align:center;font-weight:600;color:var(--accent-blue);font-size:var(--tag-size);text-transform:uppercase;letter-spacing:0.03em;border-bottom:2px solid var(--accent-blue);position:sticky;top:0}
.compare-table td{padding:clamp(3px,0.4vw,6px) clamp(4px,0.6vw,10px);text-align:center;border-bottom:1px solid var(--border-color);font-size:var(--small-size)}
.compare-table td:first-child{font-weight:700;color:var(--accent-blue);text-align:left}
.compare-table .seller{background:rgba(0,180,216,0.1);color:var(--accent-blue)}
.compare-table .buyer{background:rgba(247,127,0,0.08);color:var(--accent-warm)}
.compare-table .opportunity{background:rgba(46,196,182,0.08);color:var(--accent-green);font-weight:600}
.path-diagram{display:flex;flex-direction:column;gap:var(--element-gap)}
.path-step{display:flex;align-items:center;gap:clamp(0.3rem,0.5vw,0.5rem);font-size:var(--small-size);font-weight:500}
.path-dot{width:clamp(8px,1vw,12px);height:clamp(8px,1vw,12px);border-radius:50%;flex-shrink:0}
.path-dot.wrong{background:var(--accent-red)}
.path-dot.right{background:var(--accent-green)}
.path-arrow{color:var(--text-secondary);font-size:var(--tag-size)}
.checklist-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:clamp(0.5rem,1vw,1rem)}
.checklist-category{background:var(--bg-card);border:1px solid var(--border-color);border-radius:8px;padding:clamp(0.6rem,1vw,1rem)}
.checklist-cat-name{font-weight:700;color:var(--accent-blue);font-size:var(--body-size);margin-bottom:clamp(0.3rem,0.5vw,0.5rem);border-bottom:1px solid var(--border-color);padding-bottom:clamp(2px,0.3vw,4px)}
.checklist-item{font-size:var(--small-size);color:var(--text-primary);padding:clamp(1px,0.2vw,3px) 0;display:flex;align-items:flex-start;gap:clamp(4px,0.4vw,6px)}
.checklist-item::before{content:'□';color:var(--accent-blue);flex-shrink:0}
.checklist-q{font-size:var(--tag-size);color:var(--text-secondary);font-style:italic;margin-top:1px;padding-left:clamp(12px,1.5vw,18px)}
.ability-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(0.5rem,1vw,1rem)}
.ability-item{background:var(--bg-card);border:1px solid var(--border-color);border-radius:10px;padding:clamp(0.6rem,1.2vw,1.2rem);text-align:center;transition:border-color 0.3s,transform 0.2s}
.ability-item:hover{border-color:var(--accent-blue);transform:translateY(-2px)}
.ability-icon{font-size:clamp(1.5rem,3vw,2.5rem);margin-bottom:clamp(0.3rem,0.5vw,0.5rem)}
.ability-name{font-weight:700;font-size:var(--body-size);margin-bottom:clamp(0.2rem,0.3vw,0.3rem)}
.ability-desc{font-size:var(--tag-size);color:var(--text-secondary);line-height:1.4}
.transport-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr));gap:clamp(0.5rem,1vw,1rem)}
.transport-item{background:var(--bg-card);border:1px solid var(--border-color);border-radius:8px;padding:clamp(0.6rem,1.2vw,1.2rem);text-align:center;transition:border-color 0.3s}
.transport-item:hover{border-color:var(--accent-blue)}
.transport-icon{font-size:clamp(1.5rem,3vw,2.2rem);margin-bottom:clamp(0.3rem,0.4vw,0.5rem)}
.transport-name{font-weight:600;font-size:var(--body-size);margin-bottom:clamp(0.1rem,0.2vw,0.2rem)}
.transport-when{font-size:var(--tag-size);color:var(--text-secondary)}
.dual-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(0.5rem,1vw,1rem)}
.dual-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:8px;padding:clamp(0.6rem,1vw,1rem)}
.dual-card-title{font-weight:700;font-size:var(--h3-size);margin-bottom:clamp(0.3rem,0.5vw,0.5rem)}
.dual-card-label{font-size:var(--tag-size);color:var(--accent-blue);text-transform:uppercase;letter-spacing:0.05em;margin-top:clamp(0.3rem,0.5vw,0.5rem);margin-bottom:2px}
.dual-card-text{font-size:var(--small-size);color:var(--text-primary);line-height:1.4}
.dual-card-tip{font-size:var(--tag-size);color:var(--accent-warm);margin-top:clamp(0.3rem,0.5vw,0.5rem)}
.three-col-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(0.5rem,1vw,1rem)}
.accident-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:8px;padding:clamp(0.6rem,1.2vw,1.2rem);border-top:3px solid var(--accent-red)}
.accident-name{font-weight:700;font-size:var(--body-size);color:var(--accent-red);margin-bottom:clamp(0.3rem,0.5vw,0.5rem)}
.accident-story{font-size:var(--small-size);color:var(--text-secondary);line-height:1.4;margin-bottom:clamp(0.3rem,0.5vw,0.5rem)}
.accident-result{font-size:var(--tag-size);color:var(--accent-warm);font-weight:600}
.exam-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:clamp(0.4rem,0.8vw,0.8rem)}
.exam-item{background:var(--bg-card);border:1px solid var(--border-color);border-radius:6px;padding:clamp(0.5rem,0.8vw,0.8rem);text-align:center}
.exam-type{font-weight:600;font-size:var(--body-size);color:var(--accent-blue)}
.exam-purpose{font-size:var(--tag-size);color:var(--text-secondary);margin-top:2px}
.wechat-msg{background:var(--bg-card);border-radius:12px;padding:clamp(0.8rem,1.5vw,1.5rem);max-width:500px;margin:0 auto}
.wechat-bubble{background:var(--accent-green-dim);border-radius:12px 12px 12px 2px;padding:clamp(0.5rem,0.8vw,0.8rem) clamp(0.8rem,1vw,1rem);font-size:var(--body-size);margin-bottom:var(--element-gap);transform:translateY(20px);opacity:0;transition:all 0.5s var(--ease-out-expo)}
.slide.visible .wechat-bubble{transform:translateY(0);opacity:1}
.option-list{display:flex;flex-direction:column;gap:clamp(0.3rem,0.5vw,0.5rem)}
.option-item{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:6px;padding:clamp(0.3rem,0.5vw,0.5rem) clamp(0.5rem,0.8vw,0.8rem);font-size:var(--small-size);display:flex;align-items:flex-start;gap:clamp(0.3rem,0.4vw,0.4rem);transform:translateX(-20px);opacity:0;transition:all 0.4s var(--ease-out-expo)}
.slide.visible .option-item{transform:translateX(0);opacity:1}
.slide.visible .option-item:nth-child(1){transition-delay:0.3s}
.slide.visible .option-item:nth-child(2){transition-delay:0.5s}
.slide.visible .option-item:nth-child(3){transition-delay:0.7s}
.option-letter{font-weight:700;color:var(--accent-warm);flex-shrink:0}
.punchline{text-align:center;font-family:var(--font-display);font-size:var(--h3-size);color:var(--accent-red);margin-top:var(--element-gap);opacity:0;transition:opacity 0.5s 1s var(--ease-out-expo)}
.slide.visible .punchline{opacity:1}
.container-types{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(0.4rem,0.8vw,0.8rem)}
.container-type-card{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:6px;padding:clamp(0.4rem,0.8vw,0.8rem);text-align:center}
.container-type-name{font-family:var(--font-display);font-size:var(--h3-size);color:var(--accent-blue)}
.container-type-use{font-size:var(--tag-size);color:var(--text-secondary);margin:2px 0}
.container-type-tip{font-size:var(--tag-size);color:var(--accent-warm)}
.fcl-flow{display:flex;flex-wrap:wrap;gap:clamp(2px,0.3vw,4px);align-items:center;justify-content:center;margin:var(--element-gap) 0}
.fcl-step{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:4px;padding:clamp(2px,0.3vw,4px) clamp(4px,0.5vw,8px);font-size:var(--tag-size);font-weight:500;opacity:0.4;transition:all 0.3s var(--ease-out-expo)}
.slide.visible .fcl-step{opacity:1;border-color:var(--accent-blue);background:var(--accent-blue-dim);color:var(--accent-blue)}
.slide.visible .fcl-step:nth-child(1){transition-delay:0.1s}.slide.visible .fcl-step:nth-child(3){transition-delay:0.2s}
.slide.visible .fcl-step:nth-child(5){transition-delay:0.3s}.slide.visible .fcl-step:nth-child(7){transition-delay:0.4s}
.slide.visible .fcl-step:nth-child(9){transition-delay:0.5s}.slide.visible .fcl-step:nth-child(11){transition-delay:0.6s}
.slide.visible .fcl-step:nth-child(13){transition-delay:0.7s}.slide.visible .fcl-step:nth-child(15){transition-delay:0.8s}
.slide.visible .fcl-step:nth-child(17){transition-delay:0.9s}.slide.visible .fcl-step:nth-child(19){transition-delay:1.0s}
.slide.visible .fcl-step:nth-child(21){transition-delay:1.1s}
.fcl-arrow{color:var(--text-secondary);font-size:var(--tag-size);opacity:0.3}
.cbm-formula{background:var(--accent-blue-dim);border:1px solid var(--accent-blue);border-radius:8px;padding:clamp(0.5rem,1vw,1rem);text-align:center;font-family:'Space Grotesk',monospace;font-size:var(--h3-size);color:var(--accent-blue);margin:var(--element-gap) 0}
.weight-formula{display:flex;align-items:center;justify-content:center;gap:clamp(0.5rem,1vw,1rem);margin:var(--element-gap) 0;flex-wrap:wrap}
.weight-box{background:var(--bg-card);border:2px solid var(--border-color);border-radius:8px;padding:clamp(0.5rem,1vw,1rem);text-align:center;min-width:clamp(80px,12vw,160px)}
.weight-box.actual{border-color:var(--accent-blue)}
.weight-box.volume{border-color:var(--accent-warm)}
.weight-label{font-size:var(--tag-size);color:var(--text-secondary);text-transform:uppercase}
.weight-value{font-family:var(--font-display);font-size:var(--h2-size)}
.weight-vs{font-family:var(--font-display);font-size:var(--h3-size);color:var(--accent-red)}
.bridge{text-align:center;font-weight:700;font-size:var(--h3-size);color:var(--accent-gold);padding:clamp(0.5rem,1vw,1rem);background:rgba(255,214,10,0.08);border-radius:8px;margin-top:var(--content-gap)}
.closing-cta{font-family:var(--font-display);font-size:clamp(1.2rem,3vw,2.2rem);color:var(--accent-blue);text-align:center;margin-top:var(--content-gap)}
.red-alert-banner{background:var(--accent-red-dim);border:1px solid var(--accent-red);border-radius:6px;padding:clamp(0.4rem,0.6vw,0.6rem) clamp(0.6rem,1vw,1rem);font-size:var(--small-size);color:var(--accent-red);font-weight:600;text-align:center;margin-top:var(--element-gap)}
.tri-lang{font-size:var(--tag-size);color:var(--text-secondary)}
.tri-lang .vi{color:var(--accent-green)}
.misunderstanding-list li{color:var(--accent-red);font-size:var(--small-size);text-decoration:line-through;opacity:0.7}
.dual-script-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(0.5rem,1vw,1rem)}
.progress-bar{position:fixed;top:0;left:0;height:3px;background:var(--accent-blue);z-index:1000;transition:width 0.3s}
.nav-dots{position:fixed;right:clamp(8px,1vw,16px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:clamp(3px,0.4vw,5px);z-index:1000}
.nav-dot{width:clamp(6px,0.6vw,8px);height:clamp(6px,0.6vw,8px);border-radius:50%;background:var(--text-secondary);opacity:0.3;cursor:pointer;transition:all 0.3s;border:none;padding:0}
.nav-dot.active{background:var(--accent-blue);opacity:1;transform:scale(1.4)}
.nav-dot:hover{opacity:0.7}
.reveal{opacity:0;transform:translateY(20px);transition:opacity var(--duration-normal) var(--ease-out-expo),transform var(--duration-normal) var(--ease-out-expo)}
.slide.visible .reveal{opacity:1;transform:translateY(0)}
.reveal:nth-child(2){transition-delay:0.1s}.reveal:nth-child(3){transition-delay:0.15s}
.reveal:nth-child(4){transition-delay:0.2s}.reveal:nth-child(5){transition-delay:0.25s}
.keyboard-hint{position:fixed;bottom:clamp(8px,1.5vw,16px);left:50%;transform:translateX(-50%);font-size:var(--tag-size);color:var(--text-secondary);opacity:0.4;z-index:1000;pointer-events:none;transition:opacity 0.5s}
@media(max-width:800px){.ability-grid{grid-template-columns:repeat(2,1fr)}.three-col-grid{grid-template-columns:1fr}}
@media(max-width:700px){.comparison-grid,.split-layout,.dual-card-grid,.dual-script-grid,.formula-grid{grid-template-columns:1fr}}
@media(max-width:600px){.ability-grid{grid-template-columns:1fr}.container-types{grid-template-columns:1fr}.grid{grid-template-columns:1fr}}
@media(max-height:700px){:root{--slide-padding:clamp(0.75rem,3vw,2rem);--content-gap:clamp(0.4rem,1.5vw,1rem);--title-size:clamp(1.25rem,4.5vw,2.5rem);--h2-size:clamp(1rem,3vw,1.75rem)}}
@media(max-height:600px){:root{--slide-padding:clamp(0.5rem,2.5vw,1.5rem);--content-gap:clamp(0.3rem,1vw,0.75rem);--title-size:clamp(1.1rem,4vw,2rem);--body-size:clamp(0.7rem,1.2vw,0.95rem)}.nav-dots,.keyboard-hint{display:none}}
@media(max-height:500px){:root{--slide-padding:clamp(0.4rem,2vw,1rem);--title-size:clamp(1rem,3.5vw,1.5rem);--h2-size:clamp(0.9rem,2.5vw,1.25rem);--body-size:clamp(0.65rem,1vw,0.85rem)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;transition-duration:0.2s!important}html{scroll-behavior:auto}}
@media print{html{scroll-snap-type:none}.slide{height:100vh;page-break-after:always;page-break-inside:avoid;break-after:page;overflow:hidden}.progress-bar,.nav-dots,.keyboard-hint{display:none!important}.reveal{opacity:1!important;transform:none!important}.layer-bar{transform:scaleX(1)!important}.wechat-bubble{transform:none!important;opacity:1!important}.option-item{transform:none!important;opacity:1!important}.fcl-step{opacity:1!important}.punchline{opacity:1!important}.case-detail{display:block!important}}
