:root{--color-primary: #c41e3a;--color-primary-dark: #9a1830;--color-accent: #d4a017;--color-bg: #faf8f5;--color-surface: #ffffff;--color-text: #1a1a2e;--color-text-muted: #5c5c6e;--color-border: #e8e4df;--color-xuanhan: #1e6b5c;--color-huizhou: #2c5282;--radius: 12px;--shadow: 0 4px 24px rgba(26, 26, 46, .08);--font: "Noto Sans SC", system-ui, sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font);background:var(--color-bg);color:var(--color-text);line-height:1.6;min-height:100vh}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.container{width:min(1100px,92vw);margin:0 auto}.app-shell{min-height:100vh;display:flex;flex-direction:column}main{flex:1}.site-header{position:sticky;top:0;z-index:100;background:#ffffffeb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border)}.header-inner{display:flex;align-items:center;justify-content:space-between;padding:.85rem 0;gap:1rem}.logo{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:1.1rem}.logo-icon{width:36px;height:36px;background:linear-gradient(135deg,var(--color-primary),var(--color-accent));border-radius:8px;display:grid;place-items:center;color:#fff;font-size:.85rem}.nav-links{display:flex;gap:.25rem;list-style:none;flex-wrap:wrap}.nav-links a{padding:.4rem .75rem;border-radius:8px;font-size:.9rem;color:var(--color-text-muted);transition:background .2s,color .2s}.nav-links a:hover,.nav-links a.active{background:#c41e3a14;color:var(--color-primary)}.menu-toggle{display:none;background:none;border:none;font-size:1.5rem;cursor:pointer;padding:.25rem}@media (max-width: 768px){.menu-toggle{display:block}.nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;padding:.5rem 1rem 1rem;border-bottom:1px solid var(--color-border);box-shadow:var(--shadow)}.nav-links.open{display:flex}}.hero{padding:3.5rem 0 4rem;background:linear-gradient(160deg,#fff5f5,#faf8f5,#f0f7f4);position:relative;overflow:hidden}.hero:before{content:"";position:absolute;top:-50%;right:-20%;width:60%;height:150%;background:radial-gradient(circle,rgba(196,30,58,.06) 0%,transparent 70%);pointer-events:none}.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center}@media (max-width: 768px){.hero-grid{grid-template-columns:1fr}}.hero-badge{display:inline-block;background:#c41e3a1a;color:var(--color-primary);padding:.3rem .75rem;border-radius:999px;font-size:.8rem;font-weight:500;margin-bottom:1rem}.hero h1{font-size:clamp(1.75rem,4vw,2.5rem);line-height:1.25;margin-bottom:1rem}.hero h1 em{font-style:normal;color:var(--color-primary)}.hero-desc{color:var(--color-text-muted);font-size:1.05rem;margin-bottom:1.5rem;max-width:32rem}.hero-actions{display:flex;gap:.75rem;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.65rem 1.25rem;border-radius:10px;font-size:.95rem;font-weight:500;border:none;cursor:pointer;transition:transform .15s,box-shadow .15s;font-family:inherit}.btn:active{transform:scale(.98)}.btn-primary{background:var(--color-primary);color:#fff;box-shadow:0 4px 14px #c41e3a4d}.btn-primary:hover{background:var(--color-primary-dark)}.btn-outline{background:#fff;color:var(--color-text);border:1.5px solid var(--color-border)}.btn-outline:hover{border-color:var(--color-primary);color:var(--color-primary)}.hero-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.stat-card{background:#fff;border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow);border:1px solid var(--color-border)}.stat-card.highlight{border-color:var(--color-primary);background:linear-gradient(135deg,#fff,#fff5f5)}.stat-label{font-size:.8rem;color:var(--color-text-muted);margin-bottom:.25rem}.stat-value{font-size:1.75rem;font-weight:700;color:var(--color-primary)}.stat-sub{font-size:.75rem;color:var(--color-text-muted);margin-top:.25rem}.section{padding:3.5rem 0}.section-header{text-align:center;margin-bottom:2.5rem}.section-header h2{font-size:1.75rem;margin-bottom:.5rem}.section-header p{color:var(--color-text-muted);max-width:36rem;margin:0 auto}.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem}.card{background:var(--color-surface);border-radius:var(--radius);padding:1.5rem;border:1px solid var(--color-border);box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s}.card:hover{transform:translateY(-3px);box-shadow:0 8px 32px #1a1a2e1f}.card-icon{width:48px;height:48px;border-radius:10px;display:grid;place-items:center;font-size:1.4rem;margin-bottom:1rem}.card-icon.red{background:#fde8eb}.card-icon.green{background:#e6f4ef}.card-icon.blue{background:#e8f0fa}.card-icon.gold{background:#fef6e0}.card h3{font-size:1.1rem;margin-bottom:.5rem}.card p{font-size:.9rem;color:var(--color-text-muted);margin-bottom:1rem}.card-link{font-size:.85rem;color:var(--color-primary);font-weight:500}.bar-chart{display:flex;flex-direction:column;gap:.75rem}.bar-row{display:grid;grid-template-columns:minmax(120px,1fr) 1fr auto;gap:.75rem;align-items:center;font-size:.85rem}.bar-label{color:var(--color-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bar-track{height:8px;background:var(--color-border);border-radius:999px;overflow:hidden}.bar-fill{height:100%;border-radius:999px;transition:width .6s ease}.bar-fill.red{background:var(--color-primary)}.bar-fill.blue{background:var(--color-huizhou)}.bar-fill.green{background:var(--color-xuanhan)}.bar-pct{font-weight:600;min-width:3rem;text-align:right}.timeline{position:relative;padding-left:2rem}.timeline:before{content:"";position:absolute;left:.4rem;top:0;bottom:0;width:2px;background:var(--color-border)}.timeline-item{position:relative;padding-bottom:1.5rem}.timeline-item:before{content:"";position:absolute;left:-1.65rem;top:.35rem;width:10px;height:10px;border-radius:50%;background:var(--color-primary);border:2px solid white;box-shadow:0 0 0 2px var(--color-primary)}.timeline-year{font-weight:700;color:var(--color-primary);font-size:.9rem}.timeline-event{font-size:.95rem;margin-top:.15rem}.quiz-box{background:#f8f6f3;border-radius:var(--radius);padding:1.25rem;margin-top:1rem}.quiz-options{display:flex;flex-direction:column;gap:.5rem;margin-top:.75rem}.quiz-option{padding:.6rem 1rem;background:#fff;border:1.5px solid var(--color-border);border-radius:8px;cursor:pointer;font-size:.9rem;text-align:left;font-family:inherit;transition:border-color .2s,background .2s}.quiz-option:hover{border-color:var(--color-primary)}.quiz-option.correct{border-color:#2d8a5e;background:#e8f5ef}.quiz-option.wrong{border-color:#c41e3a;background:#fde8eb}.quiz-feedback{margin-top:.75rem;font-size:.9rem;font-weight:500}.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}@media (max-width: 768px){.compare-grid{grid-template-columns:1fr}}.region-panel{border-radius:var(--radius);padding:1.5rem;border:2px solid var(--color-border)}.region-panel.xuanhan{border-color:var(--color-xuanhan);background:linear-gradient(180deg,#f0faf7,#fff)}.region-panel.huizhou{border-color:var(--color-huizhou);background:linear-gradient(180deg,#f0f5fa,#fff)}.region-tag{display:inline-block;padding:.2rem .6rem;border-radius:6px;font-size:.75rem;font-weight:600;margin-bottom:.75rem}.region-tag.xuanhan{background:#d4ede6;color:var(--color-xuanhan)}.region-tag.huizhou{background:#d6e4f0;color:var(--color-huizhou)}.survey-form{max-width:560px;margin:0 auto}.survey-question{background:#fff;border-radius:var(--radius);padding:1.5rem;margin-bottom:1rem;border:1px solid var(--color-border);box-shadow:var(--shadow)}.survey-question h3{font-size:1rem;margin-bottom:1rem}.survey-options label{display:flex;align-items:center;gap:.6rem;padding:.5rem 0;cursor:pointer;font-size:.9rem}.survey-result{text-align:center;padding:2rem;background:linear-gradient(135deg,#fff5f5,#f0faf7);border-radius:var(--radius);margin-top:1.5rem}.site-footer{background:var(--color-text);color:#fffc;padding:2rem 0;margin-top:3rem;font-size:.85rem}.footer-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.footer-inner a{color:#fff9}.footer-inner a:hover{color:#fff}.footer-beian{margin-top:.75rem;text-align:center;font-size:.8rem}.footer-beian a{color:#fff9;text-decoration:none}.footer-beian a:hover{color:#ffffffe6;text-decoration:underline}.page-header{padding:2.5rem 0 2rem;background:linear-gradient(180deg,#fff 0%,var(--color-bg) 100%);border-bottom:1px solid var(--color-border)}.page-header h1{font-size:1.75rem;margin-bottom:.5rem}.page-header p{color:var(--color-text-muted)}.placeholder-badge{display:inline-flex;align-items:center;gap:.35rem;background:#fef6e0;color:#92600a;padding:.25rem .6rem;border-radius:6px;font-size:.75rem;font-weight:500;margin-top:.5rem}.concept-tag{display:inline-block;background:#1e6b5c1a;color:var(--color-xuanhan);padding:.2rem .6rem;border-radius:6px;font-size:.8rem;font-weight:500;margin-bottom:.75rem}.facts-list{list-style:none;margin:1rem 0}.facts-list li{padding:.4rem 0 .4rem 1.25rem;position:relative;font-size:.9rem;color:var(--color-text-muted)}.facts-list li:before{content:"•";position:absolute;left:0;color:var(--color-xuanhan);font-weight:700}.concept-box{background:#f0faf7;border-left:3px solid var(--color-xuanhan);padding:1rem 1.25rem;border-radius:0 8px 8px 0;margin-top:1rem;font-size:.9rem}.concept-box strong{color:var(--color-xuanhan)}