:root {
  --ink:#243b34; --muted:#68776f; --night:#073f35; --night-soft:#115448;
  --paper:#e8eee8; --paper-deep:#dce5dd; --card:#f8f5ec; --line:#cbd5cc;
  --lamp:#dfa24c; --lamp-dark:#9a672a; --lamp-soft:#f2dfba; --sage:#dde8df;
}
* { box-sizing:border-box; min-width:0; }
html { max-width:100%; overflow-x:hidden; scroll-behavior:smooth; }
body {
  margin:0; overflow-x:hidden; color:var(--ink); background:var(--paper);
  font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif; line-height:1.75;
}
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; }
.site-header { position:sticky; top:0; z-index:30; color:#f8f4e9; border-bottom:1px solid rgba(255,255,255,.14); background:rgba(5,58,49,.97); backdrop-filter:blur(12px); }
.nav { width:min(1140px,calc(100% - 48px)); height:76px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:12px; flex:none; }
.brand-mark { width:34px; height:34px; display:grid; place-items:center; border:1px solid #9f825d; border-radius:50%; color:#8a5a25; font-family:"SimSun",serif; }
.brand-copy { display:flex; flex-direction:column; align-items:flex-start; gap:4px; }
.brand-name { color:#fffdf5; font:600 40px/1 "Noto Serif SC","SimSun","STSong",serif; letter-spacing:.12em; }
.brand-subtitle { color:rgba(255,255,255,.62); font-size:7px; font-weight:600; line-height:1; letter-spacing:.22em; white-space:nowrap; }
.nav-links { display:flex; align-items:center; gap:30px; color:rgba(255,255,255,.76); font-size:13px; }
.nav-links a { padding:8px 0; border-bottom:1px solid transparent; }
.nav-links a:hover,.nav-links a.active { color:#bff3d0; border-color:var(--lamp); }
.nav-action { padding:8px 13px; border:1px solid rgba(255,255,255,.34); border-radius:4px; color:#f7f2e8; font-size:12px; flex:none; }
.nav-action:hover { border-color:var(--lamp); color:var(--lamp-soft); }
.container { width:min(1140px,calc(100% - 48px)); margin:auto; }
.breadcrumb { padding-top:32px; color:#879091; font-size:12px; }
.page-hero { padding:56px 0 50px; border-bottom:1px solid var(--line); }
.eyebrow { color:var(--lamp-dark); font-size:11px; letter-spacing:.18em; text-transform:uppercase; }
.page-hero h1 { margin:10px 0 14px; font:500 clamp(38px,5vw,58px)/1.28 "SimSun","STSong",serif; }
.page-hero p { max-width:720px; margin:0; color:var(--muted); font-size:16px; }
.page-hero.dark { position:relative; overflow:hidden; color:#f7f1e8; background:var(--night); border:0; }
.page-hero.dark::after { content:""; position:absolute; right:-8%; bottom:-70%; width:620px; height:360px; border:1px solid rgba(243,223,189,.14); border-radius:50%; box-shadow:0 0 0 35px rgba(243,223,189,.025),0 0 0 70px rgba(243,223,189,.018); }
.page-hero.dark p { color:rgba(255,255,255,.6); }
.page-hero.dark .eyebrow { color:var(--lamp-soft); }
.search-panel { display:flex; gap:10px; max-width:800px; margin-top:30px; padding:9px; border:1px solid #d3cdc2; border-radius:6px; background:var(--card); }
.search-panel input { flex:1; border:0; outline:0; padding:10px 13px; background:transparent; color:var(--ink); }
.button { display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:11px 18px; border:1px solid transparent; border-radius:4px; cursor:pointer; }
.button.primary { background:var(--lamp); color:#17262e; font-weight:700; }
.button.ghost { border-color:#c9c2b7; background:transparent; color:#526064; }
.section { padding:72px 0; }
.section + .section { border-top:1px solid var(--line); }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:28px; margin-bottom:30px; }
.section-head h2 { margin:6px 0 0; font:500 32px/1.4 "SimSun","STSong",serif; }
.section-head p { max-width:480px; margin:0; color:var(--muted); font-size:13px; }
.chips { display:flex; flex-wrap:wrap; gap:8px; }
.chip { padding:6px 10px; border:1px solid #d5d0c7; border-radius:999px; color:#667273; background:rgba(255,255,255,.35); font-size:11px; }
.chip.active { border-color:var(--night); color:#fff; background:var(--night); }
.split { display:grid; grid-template-columns:260px minmax(0,1fr); gap:48px; align-items:start; }
.filters { position:sticky; top:102px; padding:25px; border:1px solid var(--line); background:var(--card); }
.filters h2 { margin:0 0 18px; font:500 21px/1.4 "SimSun",serif; }
.filter-group { padding:17px 0; border-top:1px solid #ebe6dd; }
.filter-group strong { display:block; margin-bottom:10px; font-size:12px; }
.filter-options { display:flex; flex-wrap:wrap; gap:7px; }
.filter-options a { padding:5px 8px; color:#6b7677; background:var(--sage); font-size:11px; }
.filter-options a.active { color:#fff; background:var(--night); }
.result-count { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:18px; color:var(--muted); font-size:12px; }
.result-list { border-top:1px solid var(--line); }
.result-card { display:grid; grid-template-columns:140px 1fr auto; gap:24px; align-items:center; padding:27px 0; border-bottom:1px solid var(--line); }
.result-no { color:#c9c0b2; font:400 30px/1 Georgia,serif; }
.result-card h2 { margin:6px 0 8px; font:500 23px/1.5 "SimSun",serif; }
.result-card p { margin:0; color:var(--muted); font-size:13px; }
.result-card .arrow { color:var(--lamp-dark); font-size:20px; }
.meta { display:flex; flex-wrap:wrap; gap:8px 16px; color:#879091; font-size:11px; }
.topic-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.topic-card { min-height:250px; padding:29px; display:flex; flex-direction:column; justify-content:space-between; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,253,248,.45); transition:.2s; }
.topic-card:hover { background:var(--card); }
.topic-card .number { color:#b18250; font:400 13px Georgia,serif; }
.topic-card h2 { margin:28px 0 10px; font:500 25px/1.45 "SimSun",serif; }
.topic-card p { margin:0; color:var(--muted); font-size:13px; }
.topic-card footer { margin-top:30px; color:#849091; font-size:11px; }
.topic-intro { display:grid; grid-template-columns:1fr 320px; gap:60px; padding:56px 0; }
.topic-intro h1 { margin:8px 0 18px; font:500 clamp(42px,5vw,62px)/1.25 "SimSun",serif; }
.topic-intro p { max-width:700px; color:var(--muted); }
.topic-stats { padding:25px; border:1px solid var(--line); background:var(--card); }
.stat-row { display:flex; justify-content:space-between; padding:12px 0; border-bottom:1px solid #ebe6dd; font-size:12px; }
.stat-row:last-child { border:0; }
.stat-row strong { color:var(--lamp-dark); font:500 18px Georgia,serif; }
.subtopics { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.subtopic { padding:22px; border:1px solid var(--line); background:var(--card); }
.subtopic strong { display:block; margin-bottom:18px; font:500 18px "SimSun",serif; }
.subtopic span { color:var(--muted); font-size:11px; }
.timeline { position:relative; max-width:900px; margin-left:140px; border-left:1px solid #cfc8bc; }
.timeline-group { position:relative; padding:0 0 48px 42px; }
.timeline-group::before { content:""; position:absolute; left:-5px; top:8px; width:9px; height:9px; border-radius:50%; background:var(--lamp); }
.timeline-date { position:absolute; right:calc(100% + 38px); top:0; width:110px; text-align:right; color:#8a9394; font-size:12px; }
.timeline-group h2 { margin:0 0 20px; font:500 24px "SimSun",serif; }
.timeline-item { display:grid; grid-template-columns:1fr auto; gap:20px; padding:18px 0; border-top:1px solid var(--line); }
.timeline-item strong { font:500 17px/1.55 "SimSun",serif; }
.timeline-item small { color:var(--muted); }
.prose-layout { display:grid; grid-template-columns:minmax(0,760px) 260px; gap:80px; align-items:start; }
.prose h2 { margin:48px 0 16px; font:500 30px "SimSun",serif; }
.prose h2:first-child { margin-top:0; }
.prose p { margin:0 0 20px; color:#435257; }
.prose blockquote { margin:30px 0; padding:7px 0 7px 22px; border-left:2px solid var(--lamp); font:500 19px/1.8 "SimSun",serif; }
.principle-list { border-top:1px solid var(--line); }
.principle { display:grid; grid-template-columns:44px 1fr; gap:18px; padding:23px 0; border-bottom:1px solid var(--line); }
.principle span { color:#ad7a42; font-family:Georgia,serif; }
.principle strong { display:block; font:500 19px "SimSun",serif; }
.principle p { margin:7px 0 0; color:var(--muted); font-size:13px; }
.toc { position:sticky; top:104px; padding-left:22px; border-left:1px solid var(--line); }
.toc strong { display:block; margin-bottom:12px; font-size:12px; }
.toc a { display:block; padding:7px 0; color:var(--muted); font-size:12px; }
.form-layout { display:grid; grid-template-columns:minmax(0,700px) 300px; gap:64px; align-items:start; }
.form-card { padding:34px; border:1px solid var(--line); background:var(--card); }
.form-row { margin-bottom:23px; }
.form-row label { display:block; margin-bottom:8px; font-weight:700; font-size:12px; }
.form-row input,.form-row select,.form-row textarea { width:100%; border:1px solid #cbc5bb; border-radius:3px; padding:12px 13px; outline:0; color:var(--ink); background:#fffefa; }
.form-row textarea { min-height:150px; resize:vertical; }
.form-row input:focus,.form-row textarea:focus,.form-row select:focus { border-color:var(--lamp); box-shadow:0 0 0 2px rgba(216,154,74,.12); }
.hint { color:#818b8c; font-size:11px; }
.notice { padding:25px; border:1px solid #d3cabd; background:#eee9df; }
.notice h2 { margin:0 0 12px; font:500 20px "SimSun",serif; }
.notice p,.notice li { color:#667273; font-size:12px; }
.site-footer { border-top:1px solid rgba(255,255,255,.10); background:#043a31; color:rgba(255,255,255,.52); }
.footer-inner { width:min(1140px,calc(100% - 48px)); margin:auto; padding:45px 0; display:grid; grid-template-columns:1fr auto; gap:30px; align-items:end; }
.footer-brand { color:#f2ece2; font:500 23px "SimSun",serif; letter-spacing:.14em; }
.footer-copy { margin-top:8px; font-size:11px; }
.footer-links { display:flex; flex-wrap:wrap; gap:20px; font-size:11px; }
@media(max-width:900px) {
  .split,.topic-intro,.prose-layout,.form-layout { grid-template-columns:1fr; }
  .filters,.toc { position:static; }
  .topic-grid { grid-template-columns:1fr 1fr; }
  .subtopics { grid-template-columns:1fr 1fr; }
  .timeline { margin-left:100px; }
  .topic-stats { max-width:520px; }
}
@media(max-width:620px) {
  body { width:100vw; }
  .nav,.container,.footer-inner { width:calc(100% - 32px); }
  .nav { height:66px; }
  .nav-links { display:none; }
  .nav-action { padding:7px 9px; }
  .page-hero { padding:42px 0 38px; }
  .page-hero h1 { font-size:38px; }
  .search-panel { flex-direction:column; }
  .search-panel .button { width:100%; }
  .section { padding:54px 0; }
  .section-head { align-items:start; flex-direction:column; }
  .split { gap:28px; }
  .filters { padding:20px; }
  .result-card { grid-template-columns:42px 1fr; gap:14px; }
  .result-card .arrow { display:none; }
  .topic-grid,.subtopics,.related-grid { grid-template-columns:1fr; }
  .topic-card { min-height:210px; }
  .topic-intro { gap:28px; padding:42px 0; }
  .topic-intro h1 { font-size:42px; }
  .timeline { margin-left:0; border-left:0; }
  .timeline-group { padding-left:0; }
  .timeline-group::before { display:none; }
  .timeline-date { position:static; width:auto; margin-bottom:7px; text-align:left; }
  .toc { display:none; }
  .form-card { padding:23px; }
  .footer-inner { grid-template-columns:1fr; align-items:start; }
  h1,h2,h3,p,li,dd,dt,strong,span { max-width:100%; white-space:normal; overflow-wrap:anywhere; word-break:break-word; }
}

/* 2026 content system */
.brand-mark.logo-image { width:58px; height:58px; overflow:hidden; border:0; border-radius:0; background:transparent; }
.brand-mark.logo-image img { width:100%; height:100%; display:block; object-fit:contain; transform:none; }
.nav-submit { padding:9px 15px; border-radius:999px; color:#17382f; background:var(--lamp); font-size:12px; font-weight:700; }

.back-to-top { position:fixed; right:26px; bottom:26px; z-index:80; width:58px; height:58px; padding:0; border:1px solid rgba(156,102,45,.34); border-radius:50%; background:#fffdf8; box-shadow:0 9px 28px rgba(11,26,33,.22); cursor:pointer; opacity:0; visibility:hidden; transform:translateY(12px) scale(.92); transition:opacity .22s ease,transform .22s ease,visibility .22s ease,box-shadow .22s ease; }
.back-to-top.show { opacity:1; visibility:visible; transform:translateY(0) scale(1); }
.back-to-top:hover { transform:translateY(-3px) scale(1.02); box-shadow:0 13px 34px rgba(11,26,33,.28); }
.back-to-top img { display:block; width:74%; height:74%; margin:auto; border-radius:0; object-fit:contain; transform:none; }
.back-to-top .top-arrow { position:absolute; top:-3px; right:-3px; width:22px; height:22px; display:grid; place-items:center; border:2px solid #fffdf8; border-radius:50%; color:#17262e; background:var(--lamp); font:bold 15px/1 sans-serif; }
.back-to-top .top-label { position:absolute; right:68px; top:50%; padding:5px 9px; border-radius:3px; color:#fff; background:rgba(23,38,46,.92); font-size:10px; white-space:nowrap; opacity:0; transform:translate(5px,-50%); pointer-events:none; transition:.18s ease; }
.back-to-top:hover .top-label { opacity:1; transform:translate(0,-50%); }

.topic-visual-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.topic-visual-card { position:relative; min-height:380px; overflow:hidden; border-radius:7px; color:#fff; background:#17262e; isolation:isolate; }
.topic-visual-card::before { content:""; position:absolute; inset:0; z-index:-1; background-image:var(--topic-image); background-size:cover; background-position:center; transition:transform .7s ease; }
.topic-visual-card::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(8,19,25,.83),rgba(8,19,25,.38) 58%,rgba(8,19,25,.12)),linear-gradient(0deg,rgba(8,19,25,.72),transparent 64%); }
.topic-visual-card:hover::before { transform:scale(1.025); }
.topic-visual-content { min-height:380px; padding:34px; display:flex; flex-direction:column; justify-content:flex-end; }
.topic-visual-card .number { position:absolute; top:27px; left:31px; color:rgba(243,223,189,.75); font:400 13px Georgia,serif; }
.topic-visual-card h2 { margin:0 0 10px; font:500 34px/1.25 "SimSun","STSong",serif; letter-spacing:.04em; }
.topic-visual-card p { max-width:440px; margin:0; color:rgba(255,255,255,.7); font-size:13px; }
.topic-visual-card footer { margin-top:24px; color:var(--lamp-soft); font-size:11px; letter-spacing:.04em; }

.topic-hero { position:relative; min-height:520px; display:flex; align-items:end; overflow:hidden; color:#fff; background:#17262e var(--topic-image) center/cover no-repeat; }
.topic-hero::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(7,18,24,.87),rgba(7,18,24,.52) 48%,rgba(7,18,24,.12)),linear-gradient(0deg,rgba(7,18,24,.66),transparent 60%); }
.topic-hero-content { position:relative; width:min(1140px,calc(100% - 48px)); margin:0 auto; padding:92px 0 64px; }
.topic-hero .eyebrow { color:var(--lamp-soft); }
.topic-hero h1 { margin:10px 0 14px; font:500 clamp(48px,7vw,78px)/1.16 "SimSun","STSong",serif; letter-spacing:.05em; }
.topic-hero p { max-width:650px; margin:0 0 25px; color:rgba(255,255,255,.74); font:16px/1.85 "SimSun","STSong",serif; }
.topic-hero .chips .chip { border-color:rgba(255,255,255,.25); color:rgba(255,255,255,.75); background:rgba(8,19,25,.34); }
.topic-switcher { padding:14px 0; border-bottom:1px solid var(--line); background:#eeeae2; }
.topic-switcher .container { display:flex; gap:7px; overflow-x:auto; scrollbar-width:none; }
.topic-switcher a { flex:none; padding:7px 12px; border-radius:999px; color:#647174; font-size:11px; }
.topic-switcher a.active { color:#fff; background:var(--night); }

.story-response { margin-top:56px; padding:34px; border:1px solid #d2c9bb; background:#fffdf8; }
.story-response h2 { margin:0 0 8px!important; font-size:28px!important; }
.story-response>p { color:var(--muted); font-size:13px; }
.reaction-row { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin:22px 0 15px; }
.reaction { position:relative; min-width:124px; padding:10px 15px; display:inline-flex; align-items:center; justify-content:center; gap:9px; border:1px solid #d5cabb; border-radius:999px; color:#33443f; background:#fffdf8; cursor:pointer; box-shadow:0 4px 12px rgba(36,52,59,.035); transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease; }
.reaction:hover { transform:translateY(-1px); border-color:#c8a269; box-shadow:0 7px 18px rgba(92,68,30,.08); }
.reaction .reaction-label { font:600 19px/1 "Noto Serif SC","SimSun",serif; }
.reaction .reaction-icon { width:21px; height:21px; flex:none; color:#a46c2d; }
.reaction[data-reaction="sink"] .reaction-icon { color:#416b67; }
.reaction em { min-width:24px; color:#76827e; font:500 14px/1 Georgia,serif; text-align:left; }
.reaction.active[data-reaction="cross"] { border-color:#d09a48; color:#6e471d; background:#fbecd4; box-shadow:0 0 0 3px rgba(216,154,74,.1); }
.reaction.active[data-reaction="sink"] { border-color:#75918e; color:#264d48; background:#e5eeeb; box-shadow:0 0 0 3px rgba(65,107,103,.08); }
.reaction-tooltip { position:absolute; z-index:5; left:50%; bottom:calc(100% + 13px); width:246px; padding:12px 14px; border:1px solid #d5c8b6; border-radius:8px; color:#566360; background:#fffdf8; box-shadow:0 10px 28px rgba(36,52,59,.13); font:12px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif; text-align:left; white-space:normal; opacity:0; visibility:hidden; pointer-events:none; transform:translate(-50%,5px); transition:opacity .16s ease,visibility .16s ease,transform .16s ease; }
.reaction-tooltip::after { content:""; position:absolute; left:50%; top:100%; width:9px; height:9px; border-right:1px solid #d5c8b6; border-bottom:1px solid #d5c8b6; background:#fffdf8; transform:translate(-50%,-5px) rotate(45deg); }
.reaction-tooltip strong { display:block; margin-bottom:2px; color:#213b3a; font:600 15px/1.4 "Noto Serif SC","SimSun",serif; }
.reaction:hover .reaction-tooltip,.reaction:focus-visible .reaction-tooltip { opacity:1; visibility:visible; transform:translate(-50%,0); }
.reaction-note { max-width:600px;color:#7c8885!important; font-size:12px!important; }
.lamp-box { margin-top:26px; padding-top:25px; border-top:1px solid #e3ddd3; }
.lamp-box h3 { margin:0 0 7px; font:500 21px "SimSun",serif; }
.lamp-box textarea { width:100%; min-height:100px; margin:12px 0; padding:13px; resize:vertical; border:1px solid #cbc5bb; background:#fffefa; }
.lamp-box footer { display:flex; justify-content:space-between; align-items:center; gap:18px; color:var(--muted); font-size:11px; }
.lamp-submit-icon { width:18px; height:18px; flex:none; }
.lamp-list { margin-top:24px; border-top:1px solid #e3ddd3; }
.lamp-message { padding:18px 0; border-bottom:1px solid #e8e2d8; color:#49585d; font:15px/1.8 "SimSun",serif; }
.lamp-message small { display:block; margin-top:6px; color:#929a9a; font:10px sans-serif; }

.upload-zone { position:relative; padding:30px; border:1px dashed #bdb3a4; background:#f5f1e9; text-align:center; }
.upload-zone input { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; }
.upload-zone strong { display:block; margin-bottom:5px; font:500 19px "SimSun",serif; }
.consent { display:flex; align-items:flex-start; gap:9px; color:#5e6a6d; font-size:12px; }
.consent input { width:auto!important; margin-top:6px; }
.submit-success { display:none; padding:30px; border:1px solid #b9aa91; background:#f5ead8; }
.submit-success.show { display:block; }
.submit-code { display:inline-block; margin:15px 0; padding:9px 13px; color:#fff; background:var(--night); font:500 17px Georgia,serif; letter-spacing:.08em; }
.process-list { counter-reset:steps; margin:20px 0 0; padding:0; list-style:none; }
.process-list li { position:relative; padding:12px 0 12px 38px; border-top:1px solid #ddd5c8; color:#667273; font-size:12px; }
.process-list li::before { counter-increment:steps; content:counter(steps); position:absolute; left:0; top:10px; width:24px; height:24px; display:grid; place-items:center; border-radius:50%; color:#fff; background:var(--night); font:11px Georgia,serif; }

@media(max-width:760px){
  .back-to-top{right:16px;bottom:18px;width:50px;height:50px}.back-to-top .top-arrow{width:20px;height:20px;font-size:13px}.back-to-top .top-label{display:none}.brand-mark.logo-image{width:42px;height:42px}.brand-name{font-size:29px}.topic-visual-grid{grid-template-columns:1fr}.topic-visual-card,.topic-visual-content{min-height:330px}.topic-visual-content{padding:26px}.topic-hero{min-height:470px}.topic-hero-content{width:calc(100% - 32px);padding-bottom:48px}.reaction-row{gap:8px}.reaction{min-width:116px}.lamp-box footer{align-items:stretch;flex-direction:column}.lamp-box .button{width:100%}
}