/* playcapitalium.com · 站点样式
   方向 A「招股说明书」（docs/施工中设计稿/04·美术与发行/官网（整体稿·2026-10-15）/04·官网设计方案（研究稿）.md）。
   单一视觉：纸面米白＋墨绿雕版线，不随系统明暗切换（有意为之）。
   字体全部自托管（构建时按页面用字截取），不连外部字体服务，所以不需要征求 Cookie／隐私同意。 */
:root {
  --paper: #F2E8D5;
  --paper-deep: #E8DCC3;
  --ink: #1F2B23;
  --green: #183828;
  --green-soft: #3D5E4C;
  --gold: #B8893E;
  --brick: #9C4630;
  --wood: #1D2620;
  --cream-hi: #F0D79B;
  --f-text: "Cap Text", "Songti SC", "Noto Serif CJK SC", "Source Han Serif", Georgia, serif;
  --f-sc: "Cap SC", "Cap Text", Georgia, serif;
  --f-italic: "Cap Italic", "Cap Text", Georgia, serif;
  --measure: 34em;
  --track-title: .3em;    /* 中日韩标题拉开字距；西文页面改小 */
  --track-head: .06em;
  color-scheme: light;
}
html[data-script="latin"] { --measure: 36em; --track-title: .06em; --track-head: .01em; }
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0; background: var(--paper); color: var(--ink);
  font: 400 17px/1.85 var(--f-text); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .3 0 0 0 0 .25 0 0 0 0 .15 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
html[data-script="latin"] body { font-size: 19px; line-height: 1.65; }
a { color: inherit; }
img { max-width: 100%; height: auto; display: block; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.sc { font-family: var(--f-sc); font-weight: 600; letter-spacing: .16em; text-transform: lowercase; }
.wrap { max-width: 1200px; margin: 0 auto; padding-inline: clamp(16px, 4vw, 40px); }
.skip { position: absolute; left: -9999px; top: 8px; z-index: 50; background: var(--green); color: var(--cream-hi); padding: 8px 14px; }
.skip:focus { left: 8px; }

/* ── 顶栏 ── */
.nav { position: absolute; inset: 0 0 auto 0; z-index: 5; padding-top: env(safe-area-inset-top, 0px); }
.nav .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 64px; }
.brand { font-family: var(--f-sc); font-weight: 600; font-size: 18px; letter-spacing: .32em; text-decoration: none; color: var(--green); text-transform: lowercase; }
.nav ul { display: flex; gap: 28px; list-style: none; margin: 0; padding: 0; font-size: 14px; letter-spacing: .1em; }
.nav ul a, .nav .lang { text-decoration: none; color: var(--green); }
.nav ul a:hover, .nav .lang:hover { color: var(--brick); }
.nav .lang { font-size: 13px; letter-spacing: .06em; }
.nav.solid { position: static; border-bottom: 1px solid rgba(24,56,40,.18); }
@media (max-width: 860px) { .nav ul { display: none; } }

/* ── 首屏 ── */
.hero { position: relative; overflow: hidden; background: #EBDDBF; }
.hero picture img { width: 100%; height: clamp(600px, 58vw, 940px); object-fit: cover; object-position: 50% 70%; }
.hero::after { content: ""; position: absolute; inset: auto 0 0 0; height: 22%; background: linear-gradient(to bottom, transparent, var(--paper)); }
.hero-copy { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; padding-top: clamp(72px, 7vw, 120px); text-align: center; z-index: 2; }
.hero h1 { margin: 0; }
.logo { width: min(760px, 78vw); filter: drop-shadow(0 8px 24px rgba(40,30,10,.18)); animation: rise 1.4s cubic-bezier(.2,.8,.2,1) both; }
.tagline { margin: clamp(10px, 1.4vw, 20px) 0 0; max-width: 30em; font-size: clamp(16px, 1.6vw, 21px); font-weight: 600; letter-spacing: calc(var(--track-title) * .7); color: var(--green); text-wrap: balance; animation: rise 1.4s .25s cubic-bezier(.2,.8,.2,1) both; }
html[data-script="latin"] .tagline { font-style: italic; font-weight: 500; font-size: clamp(18px, 1.8vw, 24px); }
.hero-actions { display: flex; flex-direction: column; align-items: center; animation: rise 1.4s .4s cubic-bezier(.2,.8,.2,1) both; }
.cta { display: inline-flex; align-items: center; justify-content: center; gap: 12px; margin-top: clamp(18px, 2.2vw, 30px); padding: 15px 30px; background: var(--green); color: #F3E3B5; text-decoration: none;
  font-weight: 600; font-size: 16px; letter-spacing: .16em; border: 1px solid var(--green); box-shadow: inset 0 0 0 3px var(--green), inset 0 0 0 4px var(--gold); transition: background .2s; }
html[data-script="latin"] .cta { letter-spacing: .06em; font-size: 17px; }
.cta:hover { background: #0f2a1d; }
.cta svg { width: 18px; height: 18px; flex: none; }
.hero-meta { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; row-gap: 4px; margin: 14px 0 0; padding: 6px 14px; font-size: 13px; font-weight: 600; letter-spacing: .08em; color: var(--green);
  background: rgba(242,232,213,.9); border-block: 1px solid rgba(169,129,58,.55); }   /* 压在画上：衬一条纸色票带 */
.hero-meta span { white-space: nowrap; }
.hero-meta > span + span::before { content: "·"; margin: 0 .7em; color: var(--gold); }
/* Demo 倒计时：数字放在细线小框里，像票根上的号码 */
.countdown { display: inline-flex; align-items: baseline; gap: 3px; }
.countdown b { margin-right: 6px; letter-spacing: .1em; }
.cd-num { display: inline-block; min-width: 1.9em; padding: 1px 5px; text-align: center; font-variant-numeric: tabular-nums; font-weight: 700;
  border: 1px solid rgba(24,56,40,.45); background: var(--paper); }
.cd-unit { margin: 0 6px 0 3px; font-weight: 600; }
.countdown.live b { color: var(--brick); margin-right: 0; }
@keyframes rise { from { opacity: 0; transform: translateY(14px); } }
@media (max-width: 720px) {
  .hero picture img { height: min(150vw, 820px); object-position: 50% 100%; }
  .hero::after { height: 34%; }
  .hero-copy { padding-top: 84px; }
  .tagline { letter-spacing: .1em; max-width: 16em; }
  .hero-actions { position: absolute; left: 16px; right: 16px; bottom: 22px; }
  .hero-actions .cta { width: 100%; }
  .hero-meta { flex-direction: column; font-size: 12px; }
  .hero-meta > span + span::before { content: none; }
}

/* ── 说明书扉页 ── */
.title-page { text-align: center; padding-block: clamp(40px, 6vw, 80px) clamp(32px, 5vw, 64px); }
.rule { display: flex; align-items: center; gap: 14px; justify-content: center; color: var(--green); }
.rule::before, .rule::after { content: ""; height: 4px; width: min(220px, 26vw); border-block: 1px solid currentColor; opacity: .55; }
.rule i { width: 9px; height: 9px; transform: rotate(45deg); border: 1px solid var(--gold); background: var(--green); flex: none; }
.title-page .sc { display: block; margin: 22px 0 8px; font-size: 15px; color: var(--brick); }
.title-page h2 { margin: 22px 0 0; font-size: clamp(30px, 4vw, 48px); line-height: 1.25; font-weight: 900; letter-spacing: var(--track-title); color: var(--green); text-wrap: balance; }
.title-page .sc + h2 { margin-top: 0; }
.title-page p { max-width: var(--measure); margin: 22px auto 26px; text-align: left; text-wrap: pretty; }

/* ── 章节：文字一栏、截图一栏，左右交错 ── */
.chapter { padding-block: clamp(48px, 7vw, 104px); }
.chapter .wrap { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.chapter.flip .wrap { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.chapter.flip .text { order: 2; }
.text { min-width: 0; }
.num { display: flex; align-items: baseline; gap: 14px; color: var(--brick); margin-bottom: 10px; }
.num b { font-weight: 600; font-size: 15px; letter-spacing: .24em; }
html[data-script="latin"] .num b { font-family: var(--f-sc); text-transform: lowercase; letter-spacing: .14em; font-size: 17px; }
.num em { font: italic 500 22px var(--f-italic); color: var(--gold); }
.text h2 { margin: 0 0 16px; font-size: clamp(26px, 3vw, 38px); line-height: 1.3; font-weight: 900; letter-spacing: var(--track-head); color: var(--green); text-wrap: balance; }
html[data-script="latin"] .text h2 { font-weight: 700; }
.text p { margin: 0 0 14px; max-width: var(--measure); text-wrap: pretty; }
.text ul { margin: 6px 0 0; padding: 0; list-style: none; max-width: var(--measure); }
.text li { padding: 9px 0 9px 22px; border-top: 1px solid rgba(24,56,40,.16); position: relative; }
.text li::before { content: ""; position: absolute; left: 2px; top: 1.15em; width: 6px; height: 6px; transform: rotate(45deg); background: var(--gold); }
figure { margin: 0; min-width: 0; }
.plate { position: relative; background: var(--paper-deep); padding: 10px; border: 1px solid rgba(24,56,40,.4);
  box-shadow: 0 0 0 4px var(--paper), 0 0 0 5px rgba(24,56,40,.28), 0 30px 60px -30px rgba(30,25,10,.45); }
.plate img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; background: #d9ccb0; }
.stack { display: grid; gap: 22px; }
figcaption { display: flex; gap: 10px; margin-top: 14px; font-size: 14px; line-height: 1.6; color: var(--green-soft); letter-spacing: .03em; }
figcaption b { color: var(--brick); font-weight: 600; white-space: nowrap; }
@media (min-width: 1100px) {
  .chapter:not(.flip) figure { margin-right: calc((1200px - 100vw) / 4); }
  .chapter.flip figure { margin-left: calc((1200px - 100vw) / 4); }
}
@media (max-width: 860px) {
  .chapter .wrap, .chapter.flip .wrap { grid-template-columns: 1fr; }
  .chapter.flip .text { order: 0; }
}
.chapter.dark { background: var(--wood); color: #E8DCC0; background-image: linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px); background-size: 100% 6px; }
.chapter.dark .text h2 { color: var(--cream-hi); }
.chapter.dark .num { color: #D9917A; }
.chapter.dark .text li { border-color: rgba(240,215,155,.18); }
.chapter.dark .plate { background: #15201A; border-color: rgba(240,215,155,.35); box-shadow: 0 0 0 4px var(--wood), 0 0 0 5px rgba(240,215,155,.25), 0 30px 60px -30px rgba(0,0,0,.7); }
.chapter.dark figcaption { color: rgba(232,220,192,.75); }
.chapter.dark figcaption b { color: #D9917A; }

/* ── 附图 ── */
.plates { padding-block: clamp(40px, 6vw, 90px); }
.section-head { text-align: center; margin-bottom: 34px; }
.section-head .sc { color: var(--brick); font-size: 14px; }
.section-head h2 { margin: 6px 0 0; font-size: clamp(24px, 2.6vw, 32px); font-weight: 900; letter-spacing: var(--track-title); color: var(--green); }
html[data-script="latin"] .section-head h2 { font-weight: 700; }
.grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.grid figure:first-child { grid-column: span 2; grid-row: span 2; }
.grid .plate { padding: 7px; }
.zoom { all: unset; cursor: zoom-in; display: block; }
.zoom:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
@media (max-width: 860px) { .grid { grid-template-columns: 1fr; } .grid figure:first-child { grid-column: auto; grid-row: auto; } }

/* ── 要项一览 ── */
.facts { padding-block: clamp(40px, 6vw, 80px); }
.box { max-width: 780px; margin: 0 auto; padding: clamp(24px, 4vw, 44px); border: 1px solid rgba(24,56,40,.45); box-shadow: inset 0 0 0 5px var(--paper), inset 0 0 0 6px rgba(24,56,40,.3); }
.box h2 { text-align: center; margin: 0 0 22px; font-size: 24px; font-weight: 900; letter-spacing: var(--track-title); color: var(--green); }
html[data-script="latin"] .box h2 { font-weight: 700; }
.facts dl { margin: 0; }
.row { display: flex; align-items: baseline; gap: 10px; padding: 7px 0; }
.row dt { white-space: nowrap; color: var(--green-soft); letter-spacing: .1em; }
.row .dots { flex: 1; border-bottom: 1px dotted rgba(24,56,40,.45); transform: translateY(-5px); min-width: 20px; }
.row dd { margin: 0; text-align: right; font-weight: 600; max-width: 70%; }
.row dd a { text-decoration-color: rgba(24,56,40,.35); text-underline-offset: 3px; }
.row .pending { color: var(--brick); font-weight: 400; }
@media (max-width: 560px) { .row { flex-wrap: wrap; } .row .dots { display: none; } .row dd { text-align: left; width: 100%; max-width: none; } }

/* ── 认购凭证 ── */
.subscribe { padding-block: clamp(30px, 5vw, 70px) clamp(60px, 8vw, 120px); }
.voucher { position: relative; max-width: 980px; margin: 0 auto; aspect-ratio: 3 / 2; background: var(--voucher-bg) center / contain no-repeat; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 12% 16%; }
.voucher .sc { color: var(--brick); font-size: 14px; }
.voucher h2 { margin: 8px 0 6px; font-size: clamp(22px, 3vw, 40px); font-weight: 900; letter-spacing: var(--track-title); color: var(--green); }
html[data-script="latin"] .voucher h2 { font-weight: 700; }
.voucher p { margin: 0 0 4px; max-width: 30em; font-size: clamp(13px, 1.4vw, 16px); line-height: 1.6; color: var(--green-soft); }
.voucher .url { margin-top: 14px; font: 500 14px var(--f-italic); letter-spacing: .04em; color: var(--green-soft); user-select: all; }
.seal { position: absolute; right: 21%; bottom: 19%; width: clamp(64px, 9vw, 108px); transform: rotate(-12deg); opacity: .95; }
.seal.stamp { animation: stamp .5s cubic-bezier(.3,1.6,.5,1) both; }
@keyframes stamp { from { transform: scale(2.2) rotate(-30deg); opacity: 0; } }
@media (max-width: 760px) {
  .voucher { aspect-ratio: auto; background: none; border: 1px solid var(--green); box-shadow: inset 0 0 0 5px var(--paper), inset 0 0 0 6px var(--gold); padding: 44px 22px 104px; }
  .voucher .cta { width: 100%; }
  .seal { right: 18px; bottom: 16px; width: 64px; }
}

/* ── 媒体资料页 ── */
.press-page { padding-block: clamp(32px, 5vw, 64px) clamp(48px, 7vw, 96px); }
.press-page .lead { max-width: var(--measure); margin: 0 auto 40px; text-align: center; color: var(--green-soft); }
.press-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 64px); align-items: start; }
@media (max-width: 900px) { .press-grid { grid-template-columns: 1fr; } }
.press-grid .box { max-width: none; }
/* 媒体资料页的要项栏较窄：标签在上、内容在下，长值不被挤成多行 */
.press-grid .row { flex-direction: column; gap: 0; padding: 8px 0; border-bottom: 1px dotted rgba(24,56,40,.3); }
.press-grid .row .dots { display: none; }
.press-grid .row dt { font-size: 13px; }
.press-grid .row dd { text-align: left; max-width: none; }
.press-grid h3 { margin: 0 0 12px; font-size: 20px; font-weight: 900; color: var(--green); letter-spacing: var(--track-head); }
html[data-script="latin"] .press-grid h3 { font-weight: 700; }
/* ── 隐私政策等长文 ── */
.doc-page { padding-block: 0 clamp(48px, 7vw, 96px); }
.doc { max-width: var(--measure); margin: 0 auto; }
.doc h3 { margin: 40px 0 10px; padding-bottom: 6px; border-bottom: 1px solid rgba(169,129,58,.45); font-size: 21px; font-weight: 700; color: var(--green); }
.doc h4 { margin: 24px 0 6px; font-size: 17px; font-weight: 600; color: var(--brick); }
.doc p { margin: 0 0 12px; text-wrap: pretty; }
.doc ul { margin: 0 0 12px; padding-left: 1.2em; }
.doc li { margin-bottom: 4px; }
/* 开头的「简要说明」做成一块票据框，正文之前先看到要点 */
.doc h3:first-of-type + ul { list-style: none; margin: 0 0 8px; padding: 18px 22px; background: var(--paper-deep); border: 1px solid rgba(169,129,58,.55); box-shadow: inset 0 0 0 3px var(--paper-deep), inset 0 0 0 4px rgba(169,129,58,.35); }
.doc h3:first-of-type + ul li { position: relative; padding-left: 1.3em; margin-bottom: 8px; color: var(--green); font-weight: 600; }
.doc h3:first-of-type + ul li:last-child { margin-bottom: 0; }
.doc h3:first-of-type + ul li::before { content: "◆"; position: absolute; left: 0; top: .1em; font-size: .7em; color: var(--gold); }
.doc > p:first-child { color: var(--green-soft); }
.doc a { overflow-wrap: anywhere; }
.press-text section { margin-bottom: 34px; }
.press-text h4 { margin: 22px 0 6px; font-size: 17px; color: var(--brick); font-weight: 600; }
.press-text p { margin: 0 0 12px; text-wrap: pretty; }
.press-text ul { margin: 0 0 12px; padding-left: 1.2em; }
.downloads { list-style: none; margin: 0; padding: 0; }
.downloads li { border-top: 1px solid rgba(24,56,40,.18); }
.downloads a { display: flex; justify-content: space-between; gap: 16px; padding: 12px 2px; text-decoration: none; color: var(--green); font-weight: 600; }
.downloads a:hover { color: var(--brick); }
.downloads small { font-weight: 400; color: var(--green-soft); white-space: nowrap; }

/* ── 页脚 ── */
footer { background: var(--green); color: #D9CDAE; padding-block: 48px calc(36px + env(safe-area-inset-bottom, 0px)); font-size: 14px; }
footer .wrap { display: grid; grid-template-columns: 1.2fr repeat(3, minmax(0, 1fr)); gap: 28px 40px; }
footer .brand { color: var(--cream-hi); }
footer h3 { margin: 0 0 10px; font-family: var(--f-sc); font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: lowercase; color: var(--cream-hi); }
footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
footer a { text-decoration: none; }
footer a:hover, footer a[aria-current] { color: var(--cream-hi); }
footer .langs { grid-template-columns: repeat(2, minmax(0, max-content)); column-gap: 18px; }
footer small { grid-column: 1 / -1; opacity: .6; font-size: 12.5px; }
@media (max-width: 860px) { footer .wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); } footer a { overflow-wrap: anywhere; } }

/* ── 看大图 ── */
dialog { border: 0; padding: 0; background: transparent; max-width: min(1400px, 94vw); }
dialog::backdrop { background: rgba(14,22,17,.88); }
dialog img { width: 100%; box-shadow: 0 30px 80px rgba(0,0,0,.6); }
dialog form { text-align: right; }
dialog button { background: none; border: 0; color: var(--cream-hi); font: 600 15px var(--f-text); letter-spacing: .2em; padding: 10px 0; cursor: pointer; }

/* ── 语言选择页（根路径） ── */
.choose { min-height: 100vh; display: grid; place-items: center; text-align: center; padding: 40px 16px; }
.choose ul { list-style: none; padding: 0; margin: 24px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 32px; }
.choose a { color: var(--green); font-size: 18px; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .logo, .tagline, .hero-actions { animation: none; }
  .seal.stamp { animation: none; }
}