:root {
  --night: #070a0e;
  --night-soft: #10151b;
  --ink: #151513;
  --paper: #f4f0e7;
  --paper-light: #fbf9f3;
  --muted: #706d65;
  --gold: #c8973e;
  --gold-bright: #e7bc64;
  --cyan: #8ad9df;
  --line: rgba(24, 23, 19, .16);
  --serif: "Songti SC", "STSong", "Noto Serif CJK SC", Georgia, serif;
  --sans: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: #e9e4d8;
  background:
    radial-gradient(circle at 50% -5%, rgba(200,151,62,.17), transparent 25rem),
    linear-gradient(180deg, #06090d, #0b0f14 30%, #05070a);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
button { font: inherit; }
img { display: block; max-width: 100%; }

.reading-progress {
  position: fixed;
  z-index: 50;
  width: 0;
  height: 3px;
  inset: 0 auto auto 0;
  background: linear-gradient(90deg, var(--gold), #f3dca1, var(--cyan));
  box-shadow: 0 0 16px rgba(231,188,100,.65);
}

.insight-nav {
  width: min(1180px, calc(100% - 48px));
  min-height: 88px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.insight-brand { display: inline-flex; align-items: center; gap: 13px; color: #f7f1e4; text-decoration: none; }
.brand-mark {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(231,188,100,.7);
  color: var(--gold-bright);
  font-family: var(--serif);
  font-size: 22px;
  transform: rotate(-4deg);
}
.insight-brand b, .insight-brand small { display: block; }
.insight-brand b { font-size: 15px; letter-spacing: .18em; }
.insight-brand small { margin-top: 3px; color: #8f8c85; font-size: 9px; letter-spacing: .08em; }
.insight-nav nav { display: flex; gap: 28px; }
.insight-nav nav a { color: #aaa69e; text-decoration: none; font-size: 12px; }
.insight-nav nav a:hover { color: var(--gold-bright); }

.copy-dock {
  position: fixed;
  z-index: 30;
  width: 210px;
  top: 130px;
  right: max(18px, calc((100vw - 1240px) / 2));
  padding: 18px;
  border: 1px solid rgba(231,188,100,.25);
  background: rgba(10,14,18,.88);
  box-shadow: 0 24px 60px rgba(0,0,0,.28);
  backdrop-filter: blur(18px);
}
.copy-dock small { color: var(--gold-bright); font-size: 8px; letter-spacing: .18em; }
.copy-dock strong { display: block; margin: 5px 0 15px; font-size: 12px; }
.copy-dock button, .end-actions button {
  width: 100%;
  min-height: 44px;
  padding: 0 13px;
  border: 1px solid var(--gold);
  color: #17140e;
  background: var(--gold-bright);
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  transition: transform .2s ease, filter .2s ease;
}
.copy-dock button:hover, .end-actions button:hover { transform: translateY(-2px); filter: brightness(1.08); }
.copy-dock .dock-secondary { margin-top: 8px; color: #d5d0c6; background: transparent; border-color: rgba(255,255,255,.18); }
.copy-dock p { min-height: 28px; margin: 10px 0 0; color: #8f8c85; font-size: 10px; line-height: 1.45; }

.page-shell { width: min(920px, calc(100% - 44px)); margin: 34px auto 90px; transition: max-width .25s ease; }
.wechat-article {
  position: relative;
  color: var(--ink);
  background: var(--paper-light);
  box-shadow: 0 45px 110px rgba(0,0,0,.42);
  overflow: hidden;
}
.wechat-article::before {
  content: "";
  position: absolute;
  z-index: 2;
  width: 1px;
  inset: 0 auto 0 35px;
  background: rgba(200,151,62,.2);
  pointer-events: none;
}

.article-header { padding: 86px 96px 64px; background: var(--paper-light); }
.issue-line { margin: 0 0 45px; display: flex; justify-content: space-between; gap: 20px; color: #8b6b31; font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.article-header h1 { margin: 0; font-family: var(--serif); font-size: clamp(43px, 6.4vw, 72px); font-weight: 800; line-height: 1.17; letter-spacing: -.055em; }
.article-header h1 em { color: #8d6423; font-style: normal; }
.article-deck { max-width: 690px; margin: 34px 0 0; color: #555149; font-family: var(--serif); font-size: 19px; font-weight: 600; line-height: 1.85; }
.article-meta { margin-top: 40px; padding-top: 17px; display: flex; flex-wrap: wrap; gap: 11px 20px; border-top: 1px solid var(--line); color: #878278; font-size: 10px; letter-spacing: .04em; }
.article-meta .verification { color: #8b6b31; }

figure { margin: 0; }
.hero-figure img, .wide-figure img { width: 100%; height: auto; }
.hero-figure figcaption, .wide-figure figcaption { padding: 12px 30px 14px; color: #8c887f; background: #ebe5d9; font-size: 10px; line-height: 1.6; text-align: center; }

.article-content > section { padding: 86px 118px; }
.article-content > section + section { border-top: 1px solid var(--line); }
.article-content p { margin: 0 0 24px; font-family: var(--serif); font-size: 17px; line-height: 2.05; text-align: justify; }
.article-content p:last-child { margin-bottom: 0; }
.article-content strong { font-weight: 800; }
.article-content a { color: #865d1c; text-decoration-color: rgba(134,93,28,.35); text-underline-offset: 4px; }
.dropcap::first-letter { float: left; margin: 10px 10px 0 0; color: #9a6d24; font-size: 62px; font-weight: 800; line-height: .8; }
.section-kicker { margin-bottom: 18px !important; color: #9a6d24; font-family: var(--sans) !important; font-size: 10px !important; font-weight: 900; letter-spacing: .17em; text-align: left !important; text-transform: uppercase; }
.article-content h2 { margin: 0 0 42px; font-family: var(--serif); font-size: clamp(31px, 4.3vw, 45px); line-height: 1.42; letter-spacing: -.035em; }
.article-content h3 { font-family: var(--serif); }

.thesis { margin: 50px 0; padding: 37px 42px 35px; border: 0; color: #f4ecdb; background: #11161c; box-shadow: 9px 9px 0 #c89a49; }
.thesis p { margin: 0 0 10px; color: var(--cyan); font-family: var(--sans); font-size: 10px; font-weight: 900; letter-spacing: .18em; }
.thesis strong { display: block; font-family: var(--serif); font-size: 25px; line-height: 1.65; }
.thesis span { display: block; margin-top: 16px; color: #9d9a93; font-family: var(--serif); font-size: 14px; line-height: 1.8; }

.metric-grid { margin: 43px 0 35px; display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--ink); }
.metric-grid article { min-height: 205px; padding: 27px; }
.metric-grid article:nth-child(odd) { border-right: 1px solid var(--ink); }
.metric-grid article:nth-child(-n+2) { border-bottom: 1px solid var(--ink); }
.metric-grid small { display: block; min-height: 30px; color: #777166; font-size: 9px; font-weight: 800; letter-spacing: .06em; }
.metric-grid strong { display: block; margin: 11px 0 6px; color: #8d6423; font-size: 36px; letter-spacing: -.06em; }
.metric-grid sup { font-size: 16px; }
.metric-grid p { margin: 0; color: #625e56; font-family: var(--sans); font-size: 11px; line-height: 1.7; text-align: left; }
.source-note, .caveat, .method-note { padding-left: 16px; border-left: 2px solid var(--gold); color: #777168; font-family: var(--sans) !important; font-size: 11px !important; line-height: 1.8 !important; text-align: left !important; }
.caveat { margin-top: 28px !important; padding: 16px 18px; border: 1px solid #d8cbb2; background: #f1eadc; }

.case-pair { margin-top: 42px; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.case-pair article { padding: 30px; border: 1px solid #d8d0c1; background: #f6f1e7; }
.case-pair span, .life-grid small, .judgment-list span { color: #9a6d24; font-size: 9px; font-weight: 900; letter-spacing: .1em; }
.case-pair h3 { min-height: 68px; margin: 13px 0 15px; font-size: 20px; line-height: 1.55; }
.case-pair p { margin: 0 0 16px; color: #5e5a52; font-family: var(--sans); font-size: 12px; line-height: 1.85; text-align: left; }
.case-pair a { font-size: 11px; font-weight: 800; }

.wide-figure { border-block: 1px solid var(--line); }
.lens-comparison { margin: 42px 0 32px; display: grid; grid-template-columns: 1fr 46px 1fr; align-items: stretch; }
.lens-comparison article { padding: 34px 28px; color: #eee7d8; background: #11161b; }
.lens-comparison > div { display: grid; place-items: center; color: #946b29; background: #e6ddce; font-size: 21px; font-weight: 900; }
.lens-comparison small { color: #9b978f; font-size: 9px; letter-spacing: .1em; }
.lens-comparison strong { display: block; margin: 13px 0; color: var(--gold-bright); font-size: 40px; }
.lens-comparison p { margin: 0; color: #bbb7ae; font-family: var(--sans); font-size: 11px; line-height: 1.8; text-align: left; }
.reality-check { margin: 45px 0 30px; padding: 36px; border: 1px solid #b38a47; background: #eee7da; }
.reality-check h3 { margin: 0 0 24px; font-size: 23px; }
.reality-check div { padding: 13px 0; display: flex; justify-content: space-between; gap: 22px; border-top: 1px solid rgba(21,21,19,.14); font-size: 11px; }
.reality-check div b { text-align: right; }
.reality-check > p { margin: 22px 0 0; font-size: 14px; line-height: 1.8; text-align: left; }

.unknowns { margin-top: 40px; padding: 38px 40px; color: #eee7da; background: #172026; }
.unknowns h3 { margin: 0 0 23px; color: var(--gold-bright); font-size: 23px; }
.unknowns ol { margin: 0; padding-left: 20px; }
.unknowns li { margin-bottom: 15px; padding-left: 8px; color: #c8c4bb; font-family: var(--serif); font-size: 14px; line-height: 1.8; }
.unknowns li:last-child { margin-bottom: 0; }

.article-content .dark-section { color: #ece6da; background: #0e1318; border-top: 0; }
.dark-section .section-kicker { color: var(--cyan); }
.dark-section p { color: #cfcbc2; }
.dark-section blockquote { margin: 42px 0; padding: 28px 31px; border-left: 3px solid var(--gold-bright); background: rgba(255,255,255,.045); }
.dark-section blockquote strong, .dark-section blockquote span { display: block; }
.dark-section blockquote strong { font-family: var(--serif); font-size: 24px; line-height: 1.65; }
.dark-section blockquote span { margin-top: 10px; color: #8eaaa9; font-size: 12px; }
.dark-section a { color: #f0cb7b; }

.impact-list { margin: 42px 0; padding: 0; list-style: none; border-top: 1px solid var(--ink); }
.impact-list li { min-height: 105px; padding: 23px 0; display: grid; grid-template-columns: 80px 1fr; gap: 20px; align-items: start; border-bottom: 1px solid var(--ink); }
.impact-list span { width: fit-content; padding: 6px 9px; color: #fff; background: #1c242a; font-size: 9px; font-weight: 800; }
.impact-list p { margin: 0; font-size: 15px; line-height: 1.85; text-align: left; }
.life-grid { margin-top: 45px; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: #bcb3a2; border: 1px solid #bcb3a2; }
.life-grid article { min-height: 250px; padding: 31px; background: #f7f3ea; }
.life-grid h3 { margin: 13px 0 15px; font-size: 21px; line-height: 1.55; }
.life-grid p { margin: 0; color: #5f5a51; font-family: var(--sans); font-size: 12px; line-height: 1.85; text-align: left; }
.value-formula { margin-top: 45px; padding: 40px 30px; color: #ede6d7; background: #11171c; text-align: center; }
.value-formula small { color: #91ced2; font-size: 9px; letter-spacing: .15em; }
.value-formula p { margin: 18px 0 8px; font-family: var(--sans); font-size: 20px; text-align: center; }
.value-formula b { color: var(--gold-bright); }
.value-formula span { color: #918e87; font-size: 11px; }

.judgment-list { border-top: 1px solid var(--ink); }
.judgment-list article { padding: 35px 0; display: grid; grid-template-columns: 75px 1fr; column-gap: 22px; border-bottom: 1px solid var(--ink); }
.judgment-list span { padding-top: 5px; }
.judgment-list h3 { margin: 0 0 13px; font-size: 23px; line-height: 1.6; }
.judgment-list p { grid-column: 2; margin: 0; color: #5f5b53; font-size: 14px; line-height: 1.9; }

.action-table { margin: 42px 0; border: 1px solid var(--ink); }
.action-table article { min-height: 105px; padding: 23px 25px; display: grid; grid-template-columns: 105px 1fr; gap: 24px; align-items: start; border-bottom: 1px solid var(--ink); }
.action-table article:last-child { border-bottom: 0; }
.action-table span { color: #91651e; font-size: 13px; font-weight: 900; }
.action-table p { margin: 0; font-family: var(--sans); font-size: 12px; line-height: 1.85; text-align: left; }

.article-content .outlook { padding-top: 100px; padding-bottom: 105px; color: #f1eadc; background: linear-gradient(145deg, #10161b, #06090c); }
.outlook p { color: #d4cfc5; }
.closing-hook { margin: 50px 0 0; padding: 42px; border: 1px solid rgba(231,188,100,.45); background: rgba(255,255,255,.035); text-align: center; }
.closing-hook p { margin: 0 0 9px; color: #918f8b; font-family: var(--sans); font-size: 11px; text-align: center; }
.closing-hook strong { display: block; margin-bottom: 24px; color: var(--gold-bright); font-family: var(--serif); font-size: 25px; line-height: 1.65; }
.closing-hook strong:last-child { margin-bottom: 0; }
.closing-sign { margin-top: 28px !important; color: var(--gold-bright) !important; font-size: 13px !important; text-align: right !important; }

.sources { background: #eee8dd; }
.sources ol { margin: 0; padding: 0; list-style: none; }
.sources li { padding: 16px 0; border-top: 1px solid rgba(21,21,19,.14); }
.sources li a { display: block; overflow-wrap: anywhere; font-family: var(--serif); font-size: 14px; font-weight: 800; line-height: 1.6; }
.sources li span { display: block; margin-top: 5px; color: #777168; font-size: 10px; }
.sources .method-note { margin-top: 30px; }

.article-footer { padding: 45px 95px; display: flex; align-items: center; gap: 22px; color: #eee7d9; background: #080b0e; }
.footer-seal { width: 58px; height: 58px; flex: 0 0 58px; display: grid; place-items: center; border: 1px solid var(--gold); color: var(--gold-bright); font-family: var(--serif); font-size: 15px; transform: rotate(-4deg); }
.article-footer strong { font-family: var(--serif); font-size: 18px; }
.article-footer p { max-width: 560px; margin: 7px 0 0; color: #8f8c86; font-size: 11px; line-height: 1.7; }

.end-actions { margin: 30px auto 0; padding: 24px; display: grid; grid-template-columns: 1fr 180px 150px; align-items: center; gap: 16px; border: 1px solid rgba(255,255,255,.12); background: #0d1115; }
.end-actions p { margin: 0; color: #98958e; font-size: 11px; }
.end-actions a { text-align: center; color: var(--gold-bright); font-size: 11px; }
.toast { position: fixed; z-index: 60; left: 50%; bottom: 28px; padding: 12px 18px; color: #12100c; background: var(--gold-bright); box-shadow: 0 12px 35px rgba(0,0,0,.32); font-size: 12px; font-weight: 800; opacity: 0; pointer-events: none; transform: translate(-50%, 12px); transition: opacity .2s ease, transform .2s ease; }
.toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

body.preview-mode .page-shell { max-width: 720px; }
body.preview-mode .copy-dock { opacity: .35; }

@media (max-width: 1380px) {
  .copy-dock { position: static; width: min(920px, calc(100% - 44px)); margin: 15px auto 24px; display: grid; grid-template-columns: 1fr 200px 120px; align-items: center; gap: 10px; }
  .copy-dock div strong { margin-bottom: 0; }
  .copy-dock .dock-secondary { margin-top: 0; }
  .copy-dock p { display: none; }
}

@media (max-width: 760px) {
  .insight-nav { width: calc(100% - 30px); min-height: 74px; }
  .insight-nav nav a:first-child { display: none; }
  .copy-dock { width: calc(100% - 30px); grid-template-columns: 1fr 1fr; }
  .copy-dock > div { grid-column: 1 / -1; }
  .page-shell { width: calc(100% - 20px); margin-top: 20px; }
  .wechat-article::before { left: 16px; }
  .article-header { padding: 58px 31px 45px; }
  .issue-line { margin-bottom: 30px; }
  .article-header h1 { font-size: 42px; }
  .article-deck { margin-top: 27px; font-size: 16px; line-height: 1.75; }
  .article-content > section { padding: 65px 31px; }
  .article-content p { font-size: 16px; line-height: 1.95; }
  .article-content h2 { margin-bottom: 32px; font-size: 31px; }
  .thesis { margin: 40px 0; padding: 29px 24px; box-shadow: 6px 6px 0 #c89a49; }
  .thesis strong { font-size: 21px; }
  .metric-grid, .case-pair, .life-grid { grid-template-columns: 1fr; }
  .metric-grid article { min-height: 170px; }
  .metric-grid article:nth-child(odd) { border-right: 0; }
  .metric-grid article:not(:last-child) { border-bottom: 1px solid var(--ink); }
  .case-pair h3 { min-height: 0; }
  .lens-comparison { grid-template-columns: 1fr; }
  .lens-comparison > div { min-height: 42px; }
  .reality-check { padding: 29px 23px; }
  .reality-check div { flex-direction: column; gap: 6px; }
  .reality-check div b { text-align: left; }
  .unknowns { padding: 31px 25px; }
  .impact-list li { grid-template-columns: 62px 1fr; gap: 13px; }
  .life-grid article { min-height: auto; }
  .value-formula { padding: 32px 19px; }
  .value-formula p { font-size: 17px; line-height: 1.8; }
  .judgment-list article { grid-template-columns: 1fr; }
  .judgment-list p { grid-column: auto; }
  .judgment-list h3 { margin-top: 9px; }
  .action-table article { grid-template-columns: 1fr; gap: 8px; }
  .closing-hook { padding: 31px 20px; }
  .closing-hook strong { font-size: 21px; }
  .article-footer { padding: 38px 31px; align-items: flex-start; }
  .end-actions { grid-template-columns: 1fr; }
}

@media print {
  body { color: #111; background: #fff; }
  .web-only, .reading-progress { display: none !important; }
  .page-shell { width: 100%; margin: 0; }
  .wechat-article { box-shadow: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
}
