/* ================================================================
   一念千界 官网复刻 · 全站共享样式表（assets/site.css）
   ----------------------------------------------------------------
   【修改指南】
   1. 想换配色 / 字体 / 圆角 / 阴影 → 只改「第 1 节 · 主题变量」
   2. 各页面样式按页面名分节（见下方目录），改哪页搜哪页
   3. 字体文件在 assets/fonts/，本地加载失败时回退原站 CDN
   4. 页面 HTML 与本文件注释一一对应，改哪里搜哪里
   ================================================================ */

/* ============================================================
   1. 主题变量 —— 整站配色 / 字体 / 圆角 / 阴影，改这里即可全站换肤
   ============================================================ */
:root {
  --bg: oklch(96.5% .018 89.4);            /* 页面底色（宣纸米黄） */
  --surface: oklch(100% 0 0);              /* 卡片表面色 */
  --surface-ink: oklch(98% .012 86);       /* 深色按钮上的文字色 */
  --fg: oklch(23.4% .036 42.5);            /* 主文字色（墨色） */
  --muted: oklch(42.3% .025 48.1);         /* 次要文字色 */
  --border: oklch(23.4% .036 42.5/.12);    /* 边框色 */
  --border-soft: oklch(23.4% .036 42.5/.08);
  --accent: oklch(51.6% .202 25.9);        /* 强调色（朱红） */
  --spirit: oklch(82.4% .168 90.3);        /* 辅助金色 */
  --success: oklch(52% .12 150);
  --warn: oklch(67% .15 78);
  --danger: oklch(50% .2 25);
  --font-display: "Ma Shan Zheng", "STKaiti", "KaiTi", cursive;          /* 标题毛笔字体 */
  --font-body: "LXGW WenKai", "Songti SC", "Noto Serif SC", serif;       /* 正文字体 */
  --font-mono-family: "JetBrains Mono", "SFMono-Regular", ui-monospace, Menlo, monospace;
  --shadow-soft: 0 20px 70px oklch(23.4% .036 42.5/.12);
  --shadow-tight: 0 12px 36px oklch(23.4% .036 42.5/.11);
  --shadow-card: 0 18px 52px oklch(23.4% .036 42.5/.1);
  --radius: 8px;                           /* 卡片圆角 */
  --radius-sm: 4px;                        /* 按钮圆角 */
  --max: 1180px;                           /* 内容最大宽度 */
}

/* ============================================================
   2. Tailwind 框架基础变量（一般不需要改动）
   ============================================================ */
:root,:host{--color-white:#fff;--spacing:.25rem;--container-3xl:48rem;--container-4xl:56rem;--container-6xl:72rem;--container-7xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--text-5xl:3rem;--text-5xl--line-height:1;--text-7xl:4.5rem;--text-7xl--line-height:1;--font-weight-semibold:600;--leading-tight:1.25;--radius-sm:.25rem;--blur-md:12px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-body);--default-mono-font-family:var(--font-mono-family);--color-paper:oklch(96.5% .018 89.4);--color-ink:oklch(23.4% .036 42.5);--color-ink-secondary:oklch(42.3% .025 48.1);--color-crimson:oklch(51.6% .202 25.9);--color-ink-muted:oklch(42.3% .025 48.1/.72)}

/* ============================================================
   3. 网页字体（本地 assets/fonts/ 优先，失败回退原站 CDN，离线回退系统楷体）
   ============================================================ */

@font-face { font-family: "LXGW WenKai"; src: url("fonts/LXGWWenKaiLite-Regular.ttf") format("truetype"), url(https://lxd-waimao.oss-cn-hangzhou.aliyuncs.com/daoyou/fonts/LXGWWenKaiLite-Regular.ttf) format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Ma Shan Zheng"; src: url("fonts/MaShanZheng-Regular.ttf") format("truetype"), url(https://lxd-waimao.oss-cn-hangzhou.aliyuncs.com/daoyou/fonts/MaShanZheng-Regular.ttf) format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }

/* ============================================================
   4. 浏览器样式重置（Tailwind Preflight，一般不需要改动）
   ============================================================ */
@layer base { *,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important} }

/* ============================================================
   5. 浏览器兼容性声明（不需要改动）
   ============================================================ */
@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial}}

/* ============================================================
   6. 全局基础样式（body 背景 / 文字色 / 链接 / 表单 / 焦点）
   ============================================================ */

/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
@layer properties {
  @supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;
  --tw-border-style:solid;
  --tw-leading:initial;
  --tw-font-weight:initial;
  --tw-tracking:initial;
  --tw-shadow:0 0 #0000;
  --tw-shadow-color:initial;
  --tw-shadow-alpha:100%;
  --tw-inset-shadow:0 0 #0000;
  --tw-inset-shadow-color:initial;
  --tw-inset-shadow-alpha:100%;
  --tw-ring-color:initial;
  --tw-ring-shadow:0 0 #0000;
  --tw-inset-ring-color:initial;
  --tw-inset-ring-shadow:0 0 #0000;
  --tw-ring-inset:initial;
  --tw-ring-offset-width:0px;
  --tw-ring-offset-color:#fff;
  --tw-ring-offset-shadow:0 0 #0000;
  --tw-blur:initial;
  --tw-brightness:initial;
  --tw-contrast:initial;
  --tw-grayscale:initial;
  --tw-hue-rotate:initial;
  --tw-invert:initial;
  --tw-opacity:initial;
  --tw-saturate:initial;
  --tw-sepia:initial;
  --tw-drop-shadow:initial;
  --tw-drop-shadow-color:initial;
  --tw-drop-shadow-alpha:100%;
  --tw-drop-shadow-size:initial;
  --tw-backdrop-blur:initial;
  --tw-backdrop-brightness:initial;
  --tw-backdrop-contrast:initial;
  --tw-backdrop-grayscale:initial;
  --tw-backdrop-hue-rotate:initial;
  --tw-backdrop-invert:initial;
  --tw-backdrop-opacity:initial;
  --tw-backdrop-saturate:initial;
  --tw-backdrop-sepia:initial;
  --tw-duration:initial}};
}

*,:after,:before,::backdrop {
  box-sizing:border-box;
  border:0 solid;
  margin:0;
  padding:0;
}

::file-selector-button {
  box-sizing:border-box;
  border:0 solid;
  margin:0;
  padding:0;
}

html,:host {
  -webkit-text-size-adjust:100%;
  tab-size:4;
  line-height:1.5;
  font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
  font-feature-settings:var(--default-font-feature-settings,normal);
  font-variation-settings:var(--default-font-variation-settings,normal);
  -webkit-tap-highlight-color:transparent;
}

abbr:where([title]) { text-decoration:underline dotted; }

code,kbd,samp,pre {
  font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
  font-feature-settings:var(--default-mono-font-feature-settings,normal);
  font-variation-settings:var(--default-mono-font-variation-settings,normal);
  font-size:1em;
}

* { box-sizing:border-box; }

html {
  scroll-behavior:smooth;
  background:var(--bg);
}

body {
  min-height:100vh;
  color:var(--fg);
  font-family:var(--font-body);
  background:radial-gradient(circle at 10% -10%, oklch(82.4% .168 90.3/.16), transparent 32rem), radial-gradient(circle at 78% 10%, oklch(51.6% .202 25.9/.035), transparent 34rem), linear-gradient(180deg, oklch(98% .01 90), var(--bg) 22rem), var(--bg);
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricprecision;
  margin:0;
  font-size:16px;
  line-height:1.6;
}

a {
  color:inherit;
  text-decoration:none;
}

img {
  max-width:100%;
  display:block;
}

button,input,textarea,select { font:inherit; }

a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible {
  outline-offset:3px;
  outline:3px solid oklch(51.6% .202 25.9/.42);
}

input:not([type]),input[type=date],input[type=datetime-local],input[type=email],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],textarea,select {
  border-radius:var(--radius);
  width:100%;
  min-height:104px;
  color:var(--fg);
  background:oklch(100% 0 0/.76);
  border:1px solid oklch(23.4% .036 42.5/.18);
  outline:none;
  padding:14px;
}

input:not([type]):focus,input[type=date]:focus,input[type=datetime-local]:focus,input[type=email]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=time]:focus,input[type=url]:focus,input[type=week]:focus,textarea:focus,select:focus {
  border-color:var(--accent);
  outline:none;
  box-shadow:0 0 0 3px oklch(51.6% .202 25.9/.12);
}

input::placeholder,textarea::placeholder { color:oklch(42.3% .025 48.1/.58); }

h1,h2,h3,h4,h5,h6 { text-wrap:pretty; }

/* ============================================================
   7. 通用组件：页面外壳 / 导航 / 按钮 / 卡片 / 标题装饰 / 页脚
   ============================================================ */

.site-shell {
  background-color:#0000;
  background-image:none;
  min-height:100vh;
  position:relative;
  overflow-x:clip;
}

.site-shell:before {
  content:"";
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(90deg,oklch(23.4% .036 42.5/.025),#0000 42%,oklch(51.6% .202 25.9/.014)),radial-gradient(circle at 70% 38%,oklch(82.4% .168 90.3/.12),#0000 28rem);
  position:fixed;
  inset:0;
}

.content-link,.article-body a,.content-back-link,.timeline-content>a,.post-list h2 a,.text-ink-secondary a,.text-ink-muted a,.footer-link,.post-card h2 a,.timeline-item>a {
  color:inherit;
  text-underline-offset:.22em;
  text-decoration:underline 1px dashed oklch(23.4% .036 42.5/.34);
  transition:color .2s,text-decoration-color .2s;
}

.content-link:hover,.article-body a:hover,.content-back-link:hover,.timeline-content>a:hover,.post-list h2 a:hover,.text-ink-secondary a:hover,.text-ink-muted a:hover,.footer-link:hover,.post-card h2 a:hover,.timeline-item>a:hover {
  color:var(--accent);
  text-decoration-color:currentColor;
}

.nav-glass {
  -webkit-backdrop-filter:blur(18px);
  background:oklch(96.5% .018 89.4/.9);
  border-bottom:1px solid oklch(23.4% .036 42.5/.08);
}

.site-header { padding:1rem 0; }

.site-header.is-scrolled { box-shadow:0 8px 26px oklch(23.4% .036 42.5/.08); }

.site-header-cta {
  border:1px solid var(--fg);
  border-radius:var(--radius-sm);
  min-height:42px;
  color:var(--surface-ink);
  background:var(--fg);
  letter-spacing:.02em;
  justify-content:center;
  align-items:center;
  padding:0 1rem;
  font-size:.94rem;
  transition:transform .2s,box-shadow .2s,background .2s,color .2s,border-color .2s;
  display:inline-flex;
}

.site-header-cta:hover {
  color:var(--surface-ink);
  background:var(--accent);
  border-color:var(--accent);
  transform:translateY(-2px);
  box-shadow:0 12px 28px oklch(23.4% .036 42.5/.16);
}

.site-search-link {
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  min-height:42px;
  color:var(--fg);
  white-space:nowrap;
  background:oklch(100% 0 0/.38);
  align-items:center;
  gap:.45rem;
  padding:0 .7rem;
  font-size:.92rem;
  transition:border-color .2s,color .2s,background .2s;
  display:inline-flex;
}

.site-search-link svg {
  width:1.1rem;
  height:1.1rem;
}

.site-search-link:hover,.site-search-link[aria-current=page] {
  border-color:var(--accent);
  color:var(--accent);
  background:oklch(100% 0 0/.7);
}

.nav-link {
  color:var(--muted);
  font-family:var(--font-body);
  letter-spacing:.01em;
  white-space:nowrap;
  font-size:.95rem;
  text-decoration:none;
  transition:color .2s;
  position:relative;
}

.nav-link:hover,.nav-link[aria-current=page] { color:var(--fg); }

.nav-link:after {
  content:"";
  background:var(--accent);
  transform-origin:50%;
  height:1px;
  transition:transform .22s;
  position:absolute;
  bottom:-.4rem;
  left:0;
  right:0;
  transform:scaleX(0);
}

.nav-link:hover:after { transform:scaleX(1); }

.site-mobile-menu {
  border-color:var(--border-soft);
  box-shadow:var(--shadow-tight);
  background:oklch(96.5% .018 89.4/.96);
}

.site-mobile-cta {
  width:100%;
  min-height:48px;
  display:flex;
}

.ink-wash-bg,.home-band { background:0 0; }

.section-heading { color:var(--fg); }

.section-title-decorated {
  letter-spacing:0;
  display:inline-block;
  position:relative;
}

.section-title-decorated:before,.section-title-decorated:after {
  content:"";
  background:linear-gradient(90deg,#0000,oklch(23.4% .036 42.5/.36),#0000);
  width:56px;
  height:1px;
  position:absolute;
  top:50%;
}

.section-title-decorated:before {
  margin-right:20px;
  right:100%;
}

.section-title-decorated:after {
  margin-left:20px;
  left:100%;
}

.cta-button,.cta-button-secondary {
  border-radius:var(--radius-sm);
  min-height:44px;
  font-family:var(--font-body);
  letter-spacing:.02em;
  justify-content:center;
  align-items:center;
  transition:transform .2s,box-shadow .2s,background .2s,color .2s,border-color .2s;
  display:inline-flex;
}

.cta-button {
  border:1px solid var(--accent);
  color:var(--surface-ink);
  background:linear-gradient(135deg, var(--accent), oklch(43% .18 27));
  padding:.95rem 2.4rem;
  position:relative;
  overflow:hidden;
  box-shadow:0 16px 38px oklch(51.6% .202 25.9/.24);
}

.cta-button:before {
  content:"";
  border-radius:inherit;
  pointer-events:none;
  border:1px solid oklch(100% 0 0/.24);
  position:absolute;
  inset:0;
}

.cta-button:hover {
  transform:translateY(-2px);
  box-shadow:0 18px 44px oklch(23.4% .036 42.5/.18);
}

.cta-button-secondary {
  color:var(--fg);
  background:oklch(100% 0 0/.42);
  border:1px solid oklch(23.4% .036 42.5/.35);
  padding:.88rem 2.2rem;
}

.cta-button-secondary:hover {
  border-color:var(--fg);
  background:oklch(100% 0 0/.66);
  transform:translateY(-2px);
  box-shadow:0 12px 28px oklch(23.4% .036 42.5/.12);
}

.ancient-border,.content-card,.info-card,.home-step-card,.home-media-card,.version-feature-card {
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow-card);
  backdrop-filter:blur(10px);
  background:oklch(100% 0 0/.62);
}

.info-card h3,.home-step-card h3,.home-media-card h3,.content-card h3,.post-card h2,.timeline-item>a { font-family:var(--font-body); }

.content-card { border-color:var(--border-soft); }

.content-back-link {
  color:var(--muted);
  margin-bottom:1rem;
  transition:color .2s;
  display:inline-flex;
}

.content-back-link:hover { color:var(--accent); }

.article-header { padding:2rem; }

.article-title {
  color:var(--fg);
  margin-top:1rem;
  font-size:clamp(2.5rem,6vw,4rem);
  line-height:1.05;
}

.article-description {
  color:var(--muted);
  margin-top:1rem;
  font-size:1rem;
  line-height:1.9;
}

.article-body {
  color:var(--fg);
  margin-top:1.5rem;
  padding:2rem;
  line-height:1.95;
}

.article-body h2,.article-body h3,.article-body h4 {
  color:var(--fg);
  font-family:var(--font-body);
  margin-top:2rem;
  margin-bottom:.8rem;
  font-weight:600;
}

.article-body h2 { font-size:1.7rem; }

.article-body h3 { font-size:1.35rem; }

.article-body p,.article-body ul,.article-body ol,.article-body blockquote { margin-top:1rem; }

.article-body img {
  border:1px solid var(--border);
  border-radius:var(--radius);
  width:100%;
  box-shadow:var(--shadow-tight);
  margin:1.5rem 0;
}

.article-body table {
  border-collapse:collapse;
  width:100%;
  margin:1.5rem 0;
  display:block;
  overflow-x:auto;
}

.article-body th,.article-body td {
  border-bottom:1px solid var(--border);
  text-align:left;
  vertical-align:top;
  min-width:8rem;
  padding:.7rem .85rem;
}

.article-body th {
  background:oklch(23.4% .036 42.5/.05);
  font-weight:600;
}

.article-body ul,.article-body ol { padding-left:1.4rem; }

.article-body li+li { margin-top:.55rem; }

.article-body hr {
  border:0;
  border-top:1px dashed oklch(23.4% .036 42.5/.18);
  margin:2rem 0;
}

.article-body code {
  border-radius:var(--radius-sm);
  font-family:var(--font-mono-family);
  background:oklch(23.4% .036 42.5/.08);
  padding:.15rem .4rem;
  font-size:.9em;
}

.article-body pre {
  border-radius:var(--radius);
  color:var(--surface-ink);
  background:oklch(23.4% .036 42.5/.92);
  margin-top:1rem;
  padding:1rem;
  overflow-x:auto;
}

.article-body pre code {
  background:0 0;
  padding:0;
}

.media-gallery { padding:7rem 1.25rem; }

.media-gallery-inner {
  max-width:1280px;
  margin:0 auto;
}

.media-gallery-heading {
  justify-content:space-between;
  align-items:end;
  gap:2rem;
  display:flex;
}

.media-gallery-heading>p {
  max-width:34ch;
  color:var(--muted);
  margin:0;
  line-height:1.8;
}

.media-gallery-filters {
  flex-wrap:wrap;
  gap:.45rem;
  margin:2.5rem 0 1.5rem;
  display:flex;
}

.media-gallery-filter {
  border:1px solid var(--border);
  color:var(--fg);
  cursor:pointer;
  background:0 0;
  padding:.45rem .8rem;
  font-size:.86rem;
}

.media-gallery-filter:hover,.media-gallery-filter.is-active {
  border-color:var(--fg);
  color:#fff;
  background:var(--fg);
}

.media-gallery-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:2rem 1.5rem;
  display:grid;
}

.media-gallery-grid figure {
  border-top:1px solid var(--border);
  min-width:0;
  margin:0;
  padding-top:.8rem;
}

.media-gallery-grid figure[hidden] { display:none; }

.media-gallery-frame {
  background:#e6e4dd;
  justify-content:center;
  align-items:center;
  height:260px;
  display:flex;
  overflow:hidden;
}

.media-gallery-frame img {
  object-fit:contain;
  max-width:100%;
  max-height:100%;
}

.media-gallery-grid figcaption {
  gap:.35rem;
  padding:1rem .1rem;
  display:grid;
}

.media-gallery-grid figcaption strong { font-size:1.2rem; }

.media-gallery-grid figcaption span {
  color:var(--muted);
  font-size:.88rem;
  line-height:1.7;
}

/* ============================================================
   8. 布局工具类（页面 HTML 里用到的原子类，一般不需要改动）
   ============================================================ */

:where(select:is([multiple],[size])) optgroup { font-weight:bolder; }

:where(select:is([multiple],[size])) optgroup option { padding-inline-start:20px; }

.absolute { position:absolute; }

.fixed { position:fixed; }

.relative { position:relative; }

.inset-0 { inset:calc(var(--spacing) * 0); }

.top-0 { top:calc(var(--spacing) * 0); }

.top-full { top:100%; }

.right-0 { right:calc(var(--spacing) * 0); }

.left-0 { left:calc(var(--spacing) * 0); }

.z-50 { z-index:50; }

.mx-auto { margin-inline:auto; }

.mt-3 { margin-top:calc(var(--spacing) * 3); }

.mt-4 { margin-top:calc(var(--spacing) * 4); }

.mt-5 { margin-top:calc(var(--spacing) * 5); }

.mt-6 { margin-top:calc(var(--spacing) * 6); }

.mt-7 { margin-top:calc(var(--spacing) * 7); }

.mt-8 { margin-top:calc(var(--spacing) * 8); }

.mt-9 { margin-top:calc(var(--spacing) * 9); }

.mt-10 { margin-top:calc(var(--spacing) * 10); }

.mt-14 { margin-top:calc(var(--spacing) * 14); }

.mb-2 { margin-bottom:calc(var(--spacing) * 2); }

.mb-12 { margin-bottom:calc(var(--spacing) * 12); }

.flex { display:flex; }

.grid { display:grid; }

.hidden { display:none; }

.h-6 { height:calc(var(--spacing) * 6); }

.h-8 { height:calc(var(--spacing) * 8); }

.h-full { height:100%; }

.w-6 { width:calc(var(--spacing) * 6); }

.w-8 { width:calc(var(--spacing) * 8); }

.w-full { width:100%; }

.max-w-3xl { max-width:var(--container-3xl); }

.max-w-4xl { max-width:var(--container-4xl); }

.max-w-6xl { max-width:var(--container-6xl); }

.max-w-7xl { max-width:var(--container-7xl); }

.shrink-0 { flex-shrink:0; }

.flex-col { flex-direction:column; }

.flex-wrap { flex-wrap:wrap; }

.items-center { align-items:center; }

.justify-between { justify-content:space-between; }

.justify-center { justify-content:center; }

.gap-2 { gap:calc(var(--spacing) * 2); }

.gap-3 { gap:calc(var(--spacing) * 3); }

.gap-4 { gap:calc(var(--spacing) * 4); }

.gap-5 { gap:calc(var(--spacing) * 5); }

.gap-6 { gap:calc(var(--spacing) * 6); }

:where(.space-y-4>:not(:last-child)) {
  --tw-space-y-reverse:0;
  margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
  margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
}

.overflow-hidden { overflow:hidden; }

.rounded { border-radius:.25rem; }

.border {
  border-style:var(--tw-border-style);
  border-width:1px;
}

.border-t {
  border-top-style:var(--tw-border-style);
  border-top-width:1px;
}

.border-b {
  border-bottom-style:var(--tw-border-style);
  border-bottom-width:1px;
}

.border-ink\/10 { border-color:#2c18101a; }

.bg-white\/50 { background-color:#ffffff80; }

.object-contain { object-fit:contain; }

.p-2 { padding:calc(var(--spacing) * 2); }

.p-4 { padding:calc(var(--spacing) * 4); }

.p-6 { padding:calc(var(--spacing) * 6); }

.px-4 { padding-inline:calc(var(--spacing) * 4); }

.px-6 { padding-inline:calc(var(--spacing) * 6); }

.py-2 { padding-block:calc(var(--spacing) * 2); }

.py-3 { padding-block:calc(var(--spacing) * 3); }

.py-4 { padding-block:calc(var(--spacing) * 4); }

.py-10 { padding-block:calc(var(--spacing) * 10); }

.py-16 { padding-block:calc(var(--spacing) * 16); }

.py-20 { padding-block:calc(var(--spacing) * 20); }

.pt-2 { padding-top:calc(var(--spacing) * 2); }

.pt-32 { padding-top:calc(var(--spacing) * 32); }

.pb-12 { padding-bottom:calc(var(--spacing) * 12); }

.pb-14 { padding-bottom:calc(var(--spacing) * 14); }

.pb-20 { padding-bottom:calc(var(--spacing) * 20); }

.text-center { text-align:center; }

.font-heading { font-family:var(--font-display); }

.text-2xl {
  font-size:var(--text-2xl);
  line-height:var(--tw-leading,var(--text-2xl--line-height));
}

.text-3xl {
  font-size:var(--text-3xl);
  line-height:var(--tw-leading,var(--text-3xl--line-height));
}

.text-4xl {
  font-size:var(--text-4xl);
  line-height:var(--tw-leading,var(--text-4xl--line-height));
}

.text-5xl {
  font-size:var(--text-5xl);
  line-height:var(--tw-leading,var(--text-5xl--line-height));
}

.text-base {
  font-size:var(--text-base);
  line-height:var(--tw-leading,var(--text-base--line-height));
}

.text-lg {
  font-size:var(--text-lg);
  line-height:var(--tw-leading,var(--text-lg--line-height));
}

.text-sm {
  font-size:var(--text-sm);
  line-height:var(--tw-leading,var(--text-sm--line-height));
}

.text-xl {
  font-size:var(--text-xl);
  line-height:var(--tw-leading,var(--text-xl--line-height));
}

.text-xs {
  font-size:var(--text-xs);
  line-height:var(--tw-leading,var(--text-xs--line-height));
}

.leading-7 {
  --tw-leading:calc(var(--spacing) * 7);
  line-height:calc(var(--spacing) * 7);
}

.leading-8 {
  --tw-leading:calc(var(--spacing) * 8);
  line-height:calc(var(--spacing) * 8);
}

.leading-tight {
  --tw-leading:var(--leading-tight);
  line-height:var(--leading-tight);
}

.font-semibold {
  --tw-font-weight:var(--font-weight-semibold);
  font-weight:var(--font-weight-semibold);
}

.text-crimson { color:var(--color-crimson); }

.text-ink { color:var(--color-ink); }

.text-ink-muted { color:var(--color-ink-muted); }

.text-ink-secondary { color:var(--color-ink-secondary); }

.no-underline { text-decoration-line:none; }

.shadow-lg {
  --tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);
  box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}

.backdrop-blur-md {
  --tw-backdrop-blur:blur(var(--blur-md));
  backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
}

.transition-all {
  transition-property:all;
  transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));
  transition-duration:var(--tw-duration,var(--default-transition-duration));
}

.transition-colors {
  transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;
  transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));
  transition-duration:var(--tw-duration,var(--default-transition-duration));
}

.transition-opacity {
  transition-property:opacity;
  transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));
  transition-duration:var(--tw-duration,var(--default-transition-duration));
}

.transition-transform {
  transition-property:transform,translate,scale,rotate;
  transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));
  transition-duration:var(--tw-duration,var(--default-transition-duration));
}

.duration-300 {
  --tw-duration:.3s;
  transition-duration:.3s;
}

.font-heading {
  font-family:var(--font-display);
  font-weight:400;
}

.home-step-grid,.info-card-grid,.home-media-grid,.screenshot-masonry,.post-list,.version-highlight-list { display:grid; }

.info-card-meta,.page-eyebrow {
  color:var(--accent);
  font-family:var(--font-mono-family);
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:.72rem;
  font-weight:600;
  display:inline-flex;
}

.page-hero { background:radial-gradient(circle at 16% 18%,oklch(82.4% .168 90.3/.13),#0000 24rem),linear-gradient(oklch(23.4% .036 42.5/.035),#0000 68%); }

.post-badge,.post-tag {
  border-radius:var(--radius-sm);
  font-family:var(--font-body);
  letter-spacing:.04em;
  justify-content:center;
  align-items:center;
  font-size:.78rem;
  display:inline-flex;
}

.post-badge {
  padding:.28rem .7rem;
  font-weight:600;
}

.post-badge-announcement {
  color:oklch(38% .09 54);
  background:oklch(82.4% .168 90.3/.18);
}

.post-badge-update {
  color:oklch(41% .16 25.9);
  background:oklch(51.6% .202 25.9/.12);
}

.post-tag {
  color:var(--muted);
  background:oklch(100% 0 0/.42);
  border:1px solid oklch(23.4% .036 42.5/.12);
  padding:.25rem .65rem;
}

.version-highlight-list {
  color:var(--fg);
  gap:.85rem;
  line-height:1.8;
}

.version-highlight-list li,.article-body blockquote {
  border-left:3px solid var(--accent);
  color:var(--fg);
  background:oklch(96.5% .018 89.4/.74);
  margin-top:16px;
  padding:16px;
}

.version-highlight-list li:first-child { margin-top:0; }

.timeline-date,.post-date {
  color:oklch(42.3% .025 48.1/.74);
  font-family:var(--font-mono-family);
  font-size:.82rem;
}

.content-page-shell { position:relative; }

/* ============================================================
   9.7 「赞助页」页面区块样式（.sponsor-*）
   ============================================================ */

.home-sponsor-inner,.sponsor-hero-inner {
  align-items:center;
  gap:2.5rem;
  display:grid;
  position:relative;
}

.home-sponsor-copy,.sponsor-hero-copy {
  z-index:2;
  position:relative;
}

.home-sponsor-visual,.sponsor-hero-visual {
  min-height:20rem;
  position:relative;
}

.sponsor-hero-visual img {
  opacity:.8;
  filter:drop-shadow(0 28px 45px oklch(23.4% .036 42.5/.1));
  width:clamp(48rem,58vw,62rem);
  max-width:none;
  height:auto;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-57%,-50%);
}

.sponsor-hero-visual:after { content:none; }

.sponsor-hero {
  position:relative;
  overflow:hidden;
}

.sponsor-hero-copy { max-width:36rem; }

.sponsor-section { border-bottom:0; }

.sponsor-section-intro { max-width:50rem; }

.sponsor-detail-grid {
  gap:4rem;
  display:grid;
}

.sponsor-list { border-top:1px solid var(--border); }

.sponsor-list li {
  border-bottom:1px solid var(--border-soft);
  grid-template-columns:2.5rem minmax(0,1fr);
  gap:1rem;
  padding:1.35rem 0;
  display:grid;
}

.sponsor-list-index,.sponsor-list-mark {
  color:var(--accent);
  font-family:var(--font-mono-family);
  letter-spacing:.08em;
  font-size:.76rem;
  font-weight:600;
  line-height:1.9rem;
}

.sponsor-list-mark {
  color:oklch(64% .12 85);
  font-size:1.15rem;
}

.sponsor-list h3 {
  color:var(--fg);
  font-size:1.15rem;
  font-weight:600;
  line-height:1.7;
}

.sponsor-list p {
  color:var(--muted);
  margin-top:.35rem;
  font-size:.92rem;
  line-height:1.8;
}

.sponsor-thanks { background:0 0; }

.sponsor-thanks-inner {
  flex-direction:column;
  align-items:flex-start;
  gap:2rem;
  display:flex;
}

.sponsor-wall { margin-top:2.75rem; }

.sponsor-wall-image {
  width:100%;
  max-width:720px;
  height:auto;
  margin-inline:auto;
  display:block;
}

/* ============================================================
   9.10 「搜索页」页面区块样式（.search-*）
   ============================================================ */

.search-header { margin-bottom:1.5rem; }

.search-panel {
  --pagefind-ui-scale:1;
  --pagefind-ui-primary:var(--accent);
  --pagefind-ui-text:var(--fg);
  --pagefind-ui-background:oklch(100% 0 0/.5);
  --pagefind-ui-border:oklch(23.4% .036 42.5/.14);
  --pagefind-ui-tag:oklch(23.4% .036 42.5/.08);
  --pagefind-ui-border-width:1px;
  --pagefind-ui-border-radius:var(--radius-sm);
  --pagefind-ui-image-border-radius:var(--radius-sm);
  --pagefind-ui-image-box-ratio:3 / 2;
  --pagefind-ui-font:var(--font-body);
  padding:clamp(1rem,3vw,2rem);
}

.search-panel pagefind-input { display:block; }

.search-panel pagefind-summary,.search-panel pagefind-results {
  margin-top:1rem;
  display:block;
}

.search-panel input[type=search],.search-panel .pagefind-ui__search-input {
  border-radius:var(--radius);
  min-height:104px;
  color:var(--fg);
  box-shadow:none;
  background:oklch(100% 0 0/.76);
  border:1px solid oklch(23.4% .036 42.5/.18);
  outline:none;
  padding:14px 4.5rem 14px 3.25rem;
  font-size:1rem;
  font-weight:400;
}

.search-panel input[type=search]:focus,.search-panel .pagefind-ui__search-input:focus {
  border-color:var(--accent);
  box-shadow:0 0 0 3px oklch(51.6% .202 25.9/.12);
}

.search-panel .pagefind-ui__form:before {
  top:43px;
  left:20px;
}

.search-panel .pagefind-ui__search-clear {
  height:56px;
  color:var(--muted);
  background:0 0;
  top:24px;
  right:12px;
}

.search-panel .pagefind-ui__result { border-color:var(--border-soft); }

.search-panel .pagefind-ui__result-title {
  font-family:var(--font-body);
  font-size:1.2rem;
  font-weight:600;
}

.search-panel .pagefind-ui__result-title a:hover { color:var(--accent); }

.search-panel .pagefind-ui__result-excerpt,.search-panel .pagefind-ui__result-url,.search-panel .pagefind-ui__message { color:var(--muted); }

/* ============================================================
   9.1 「首页」页面区块样式（.landing-*）
   ============================================================ */

.landing-kicker {
  color:var(--accent);
  letter-spacing:.12em;
  margin:0 0 1rem;
  font-size:.78rem;
  font-weight:700;
}

.landing-hero {
  background:linear-gradient(150deg,#f8f3e6 0%,#fbf9f2 48%,#f0e9d8 100%);
  padding:9rem max(1.25rem,50vw - 640px) 0;
  overflow:hidden;
}

.landing-hero-inner {
  grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
  align-items:center;
  gap:clamp(2rem,5vw,5rem);
  max-width:1280px;
  margin:0 auto 6rem;
  display:grid;
}

.landing-hero-copy h1,.landing-section-head h2,.landing-sect h2,.landing-ai h2,.landing-current h2,.landing-start h2,.intro-story h2 {
  color:var(--fg);
  font-family:var(--font-display);
  margin:0;
  font-weight:400;
  line-height:1.18;
}

.landing-hero-copy h1 {
  letter-spacing:.01em;
  font-size:clamp(3.6rem,5.7vw,6.4rem);
}

.landing-hero-copy h1 span { color:var(--accent); }

.landing-hero-lede {
  max-width:34rem;
  color:var(--muted);
  margin:1.8rem 0 0;
  font-size:clamp(1.05rem,1.4vw,1.22rem);
  line-height:1.95;
}

.landing-hero-actions,.landing-start-actions {
  flex-wrap:wrap;
  align-items:center;
  gap:1.6rem;
  margin-top:2rem;
  display:flex;
}

.landing-hero-actions .cta-button,.landing-start-actions .cta-button {
  min-height:3.5rem;
  padding:.85rem 1.7rem;
}

.landing-text-link,.landing-inline-cta {
  width:fit-content;
  color:var(--fg);
  border-bottom:1px solid;
  align-items:center;
  gap:.6rem;
  padding:.55rem 0;
  font-weight:700;
  transition:color .2s;
  display:inline-flex;
}

.landing-text-link:hover,.landing-inline-cta:hover { color:var(--accent); }

.landing-hero-note {
  color:var(--muted);
  margin:1.2rem 0 0;
  font-size:.84rem;
}

.landing-hero-media {
  min-width:0;
  padding:0 0 3.5rem 2rem;
  position:relative;
}

.landing-world-frame {
  border:1px solid var(--border);
  background:#e3e4d9;
  margin:0;
  position:relative;
  overflow:hidden;
  box-shadow:0 24px 60px #2d261c26;
}

.landing-world-frame img {
  object-fit:cover;
  width:100%;
  height:clamp(390px,38vw,570px);
}

.landing-world-frame figcaption {
  color:#fff;
  background:linear-gradient(#0000,#15211fc2);
  padding:2.6rem 1.25rem .9rem;
  font-size:.93rem;
  position:absolute;
  bottom:0;
  left:0;
  right:0;
}

.landing-hero-preview {
  background:#f8f3e6;
  border:5px solid #f8f3e6;
  width:min(54%,310px);
  transition:transform .2s;
  display:block;
  position:absolute;
  bottom:0;
  left:0;
  transform:rotate(-3deg);
  box-shadow:0 14px 35px #241d162e;
}

.landing-hero-preview:hover { transform:rotate(0); }

.landing-hero-preview img {
  object-fit:cover;
  object-position:center;
  width:100%;
  height:172px;
}

.landing-hero-preview>span {
  color:var(--muted);
  justify-content:space-between;
  gap:.5rem;
  padding:.45rem .3rem .2rem;
  font-size:.73rem;
  display:flex;
}

.landing-hero-preview strong { color:var(--fg); }

.landing-release-line {
  border-top:1px solid var(--border);
  max-width:1280px;
  color:var(--muted);
  align-items:center;
  gap:1.25rem;
  margin:0 auto;
  padding:1rem 0 1.15rem;
  font-size:.84rem;
  display:flex;
}

.landing-release-line strong {
  color:var(--fg);
  font-size:.93rem;
}

.landing-release-line>span:last-child { margin-left:auto; }

.landing-intro,.landing-play,.landing-current,.landing-start {
  max-width:1280px;
  margin:0 auto;
  padding:clamp(5rem,8vw,8.5rem) 1.25rem;
}

.landing-section-head {
  max-width:760px;
  margin-bottom:3.5rem;
}

.landing-section-head h2,.landing-sect h2,.landing-ai h2,.landing-current h2,.landing-start h2,.intro-story h2 { font-size:clamp(2.7rem,4.2vw,4.5rem); }

.landing-section-head>p:last-child,.landing-sect-copy>p:not(.landing-kicker),.landing-current-top p:last-child,.landing-start p:not(.landing-kicker) {
  max-width:58ch;
  color:var(--muted);
  margin:1.4rem 0 0;
  font-size:1.05rem;
  line-height:1.9;
}

.landing-journey {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(1.5rem,3vw,3.5rem);
  display:grid;
}

.landing-journey article {
  border-top:2px solid var(--fg);
  padding-top:1.4rem;
}

.landing-journey article>span,.landing-play-feature>div:last-child>span {
  color:var(--accent);
  font-family:var(--font-mono-family);
  font-size:.79rem;
}

.landing-journey h3,.landing-play-feature h3 {
  color:var(--fg);
  margin:1rem 0;
  font-size:clamp(1.35rem,1.6vw,1.65rem);
  font-weight:700;
}

.landing-journey p,.landing-play-feature p {
  color:var(--muted);
  margin:0;
  line-height:1.85;
}

.landing-journey a {
  color:var(--accent);
  margin-top:1.4rem;
  font-weight:700;
  display:inline-block;
}

.landing-sect {
  background:#1e2928;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  display:grid;
}

.landing-sect-image {
  min-height:560px;
  position:relative;
}

.landing-sect-image img {
  object-fit:cover;
  width:100%;
  height:100%;
  position:absolute;
  inset:0;
}

.landing-sect-image:after {
  content:"";
  background:linear-gradient(#0000,#000000a6);
  position:absolute;
  inset:50% 0 0;
}

.landing-sect-image span {
  z-index:1;
  color:#fff;
  font-size:.8rem;
  position:absolute;
  bottom:1.5rem;
  left:max(1.25rem,50vw - 640px);
}

.landing-sect-copy {
  align-self:center;
  max-width:680px;
  padding:5rem clamp(2rem,5vw,6rem);
}

.landing-sect-copy h2,.landing-sect-copy>p:not(.landing-kicker),.landing-sect-copy .landing-inline-cta { color:#f4eee1; }

.landing-sect-copy>p:not(.landing-kicker) { opacity:.88; }

.landing-sect-copy .landing-inline-cta { margin-top:1.7rem; }

.landing-play-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.5rem;
  display:grid;
}

.landing-play-feature {
  border-top:1px solid var(--border);
  min-width:0;
  padding-top:1rem;
  display:block;
}

.landing-play-image {
  background:#e8e3d8;
  height:250px;
  overflow:hidden;
}

.landing-play-image img {
  object-fit:cover;
  width:100%;
  height:100%;
  transition:transform .3s;
}

.landing-play-feature:hover img { transform:scale(1.04); }

.landing-play-feature>div:last-child { padding-top:1.4rem; }

.landing-play-feature h3 { margin:.7rem 0; }

.landing-ai {
  background:#e7e4d7;
  grid-template-columns:1fr 1fr;
  gap:clamp(2rem,8vw,8rem);
  padding:clamp(5rem,8vw,8rem) max(1.25rem,50vw - 640px);
  display:grid;
}

.landing-ai>div:last-child { align-self:end; }

.landing-ai>div:last-child p {
  max-width:54ch;
  color:var(--muted);
  margin:0;
  font-size:1.08rem;
  line-height:1.9;
}

.landing-ai a {
  color:var(--accent);
  margin-top:1.4rem;
  font-weight:700;
  display:inline-block;
}

.landing-current { border-bottom:1px solid var(--border); }

.landing-current-top {
  justify-content:space-between;
  align-items:end;
  gap:2rem;
  display:flex;
}

.landing-current-top>div { max-width:690px; }

.landing-current-links {
  grid-template-columns:repeat(4,1fr);
  gap:1rem;
  margin-top:3rem;
  display:grid;
}

.landing-current-links a {
  border-top:1px solid var(--fg);
  color:var(--fg);
  padding:1rem .3rem;
  font-weight:700;
}

.landing-release-note {
  color:var(--muted);
  margin:1rem 0 0;
  font-size:.87rem;
}

.landing-release-note a {
  color:var(--accent);
  text-underline-offset:.2em;
  text-decoration:underline;
}

.landing-start {
  justify-content:space-between;
  align-items:end;
  gap:3rem;
  display:flex;
}

.landing-start>div:first-child { max-width:700px; }

.landing-start-actions {
  flex-direction:column;
  flex-shrink:0;
  align-items:flex-start;
  margin:0;
}

/* ============================================================
   9.2 「了解游戏页」页面区块样式（.intro-*）
   ============================================================ */

.intro-hero {
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  align-items:center;
  gap:clamp(2rem,5vw,5rem);
  max-width:1320px;
  margin:0 auto;
  padding:9rem 1.25rem 6rem;
  display:grid;
}

.intro-hero-copy h1 {
  font-family:var(--font-display);
  margin:0;
  font-size:clamp(3.6rem,5.5vw,6rem);
  font-weight:400;
  line-height:1.2;
}

.intro-hero-copy>p:not(.landing-kicker) {
  max-width:34rem;
  color:var(--muted);
  margin:1.6rem 0 0;
  font-size:1.13rem;
  line-height:1.9;
}

.intro-hero-image {
  border:1px solid var(--border);
  background:#d8ddd6;
  margin:0;
  position:relative;
  overflow:hidden;
}

.intro-hero-image img {
  object-fit:cover;
  width:100%;
  height:490px;
}

.intro-hero-image figcaption {
  color:#fff;
  background:#172423c7;
  padding:.4rem .65rem;
  font-size:.78rem;
  position:absolute;
  bottom:1rem;
  right:1rem;
}

.intro-story {
  background:#e8e6dc;
  grid-template-columns:.8fr 1.2fr;
  gap:clamp(3rem,8vw,8rem);
  padding:7rem max(1.25rem,50vw - 640px);
  display:grid;
}

.intro-story-heading h2,.intro-proof h2,.intro-ai h2,.intro-final h2,.media-gallery-heading h2 {
  font-family:var(--font-display);
  margin:0;
  font-size:clamp(2.7rem,4vw,4.5rem);
  font-weight:400;
  line-height:1.2;
}

.intro-story-heading>p:last-child {
  max-width:35ch;
  color:var(--muted);
  margin:1.4rem 0 0;
  line-height:1.85;
}

.intro-story-steps {
  margin:0;
  padding:0;
  list-style:none;
}

.intro-story-steps li {
  border-top:1px solid var(--border);
  grid-template-columns:3.5rem 1fr;
  gap:1rem;
  padding:1.45rem 0;
  display:grid;
}

.intro-story-steps li>span {
  color:var(--accent);
  font-family:var(--font-mono-family);
  font-size:.88rem;
}

.intro-story-steps h3 {
  margin:0;
  font-size:1.4rem;
  font-weight:700;
}

.intro-story-steps p {
  max-width:56ch;
  color:var(--muted);
  margin:.55rem 0 0;
  line-height:1.85;
}

.intro-story-steps a {
  color:var(--accent);
  margin-top:.75rem;
  font-weight:700;
  display:inline-block;
}

.intro-proof {
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  align-items:center;
  gap:clamp(2rem,6vw,6rem);
  max-width:1280px;
  margin:0 auto;
  padding:7rem 1.25rem;
  display:grid;
}

.intro-proof-copy p:not(.landing-kicker) {
  color:var(--muted);
  margin:1.5rem 0;
  line-height:1.9;
}

.intro-proof figure {
  border:1px solid var(--border);
  background:#e7e2d7;
  margin:0;
}

.intro-proof figure img {
  object-fit:contain;
  width:100%;
  max-height:590px;
}

.intro-proof figcaption {
  color:var(--muted);
  padding:.7rem 1rem;
  font-size:.79rem;
}

.intro-ai {
  color:#f1eee5;
  background:#1e2928;
  grid-template-columns:1fr 1fr;
  gap:5rem;
  padding:6rem max(1.25rem,50vw - 640px);
  display:grid;
}

.intro-ai h2,.intro-ai p:not(.landing-kicker) { color:#f1eee5; }

.intro-ai p:not(.landing-kicker) {
  align-self:end;
  max-width:56ch;
  margin:0;
  font-size:1.08rem;
  line-height:1.9;
}

.intro-final {
  text-align:center;
  background:#e8e6dc;
  padding:7rem 1.25rem;
}

.intro-final>p:not(.landing-kicker) {
  max-width:48ch;
  color:var(--muted);
  margin:1.3rem auto 2rem;
  line-height:1.85;
}

/* ============================================================
   9.3 「玩法指南页」页面区块样式（.guides-*）
   ============================================================ */

.guides-hero,.guides-featured,.guides-directory {
  max-width:1280px;
  margin:0 auto;
  padding-left:1.25rem;
  padding-right:1.25rem;
}

.guides-hero {
  grid-template-columns:1fr 1fr;
  align-items:end;
  gap:5rem;
  padding-top:9rem;
  padding-bottom:6rem;
  display:grid;
}

.guides-hero h1 {
  font-family:var(--font-display);
  margin:0;
  font-size:clamp(3.7rem,5.3vw,5.8rem);
  font-weight:400;
  line-height:1.2;
}

.guides-hero>div:first-child>p:not(.landing-kicker) {
  max-width:52ch;
  color:var(--muted);
  margin:1.3rem 0;
  line-height:1.85;
}

.guides-hero-path {
  color:#eee9dd;
  background:#1e2928;
  padding:1.5rem 2rem;
}

.guides-hero-path>p {
  color:#d6cec0;
  margin:0 0 1rem;
}

.guides-hero-path ol {
  margin:0;
  padding:0;
  list-style:none;
}

.guides-hero-path li { border-top:1px solid #fff3; }

.guides-hero-path a {
  grid-template-columns:2rem minmax(0,.8fr) minmax(0,1.2fr);
  align-items:center;
  gap:.8rem;
  padding:1.15rem 0;
  display:grid;
}

.guides-hero-path a:hover { color:#fff; }

.guides-hero-path a>span:first-child {
  color:#c3b59e;
  font-family:var(--font-mono-family);
  font-size:.76rem;
}

.guides-hero-path a>span:last-child {
  color:#d6cec0;
  font-size:.84rem;
}

.guides-heading {
  justify-content:space-between;
  align-items:end;
  gap:2rem;
  margin-bottom:2rem;
  display:flex;
}

.guides-heading h2,.guides-group-heading h2 {
  font-family:var(--font-display);
  margin:0;
  font-size:clamp(2.6rem,4vw,4.1rem);
  font-weight:400;
}

.guides-heading>p {
  max-width:28ch;
  color:var(--muted);
  margin:0;
  line-height:1.8;
}

.guides-featured { padding-bottom:7rem; }

.guides-featured-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.25rem;
  display:grid;
}

.guides-featured-grid a {
  border-top:1px solid var(--fg);
  padding-top:.8rem;
}

.guides-featured-grid img {
  object-fit:cover;
  background:#e6e4dd;
  width:100%;
  height:230px;
}

.guides-featured-grid a>span {
  color:var(--accent);
  margin:1.2rem 0 .4rem;
  font-size:.78rem;
  font-weight:700;
  display:block;
}

.guides-featured-grid strong {
  font-size:1.36rem;
  display:block;
}

.guides-featured-grid p {
  color:var(--muted);
  margin:.55rem 0 0;
  line-height:1.75;
}

.guides-directory {
  border-top:1px solid var(--border);
  grid-template-columns:190px minmax(0,1fr);
  gap:clamp(2rem,5vw,6rem);
  padding-top:5rem;
  padding-bottom:8rem;
  display:grid;
}

.guides-directory-nav {
  align-self:start;
  gap:.8rem;
  display:grid;
  position:sticky;
  top:6rem;
}

.guides-directory-nav p {
  color:var(--accent);
  margin:0 0 .4rem;
  font-size:.8rem;
  font-weight:700;
}

.guides-directory-nav a { color:var(--muted); }

.guides-directory-nav a:hover { color:var(--accent); }

.guides-list-group {
  margin-bottom:4.5rem;
  scroll-margin-top:7rem;
}

.guides-group-heading { margin-bottom:1.5rem; }

.guides-group-heading .landing-kicker { margin-bottom:.4rem; }

.guides-link-list {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 1.6rem;
  display:grid;
}

.guides-link-list a {
  border-top:1px solid var(--border);
  grid-template-columns:minmax(0,1fr) auto;
  gap:.4rem 1rem;
  padding:1rem 0;
  display:grid;
}

.guides-link-list a:hover strong,.guides-link-list a:hover>span:last-child { color:var(--accent); }

.guides-link-list strong { font-size:1.09rem; }

.guides-link-list a>span:nth-child(2) {
  color:var(--muted);
  grid-row:2;
  font-size:.86rem;
  line-height:1.65;
}

.guides-link-list a>span:last-child { grid-area:1/2; }

/* ============================================================
   9.4 「版本动态页」页面区块样式（.updates-*）
   ============================================================ */

.updates-hero,.updates-current,.updates-lists {
  max-width:1280px;
  margin:0 auto;
  padding-left:1.25rem;
  padding-right:1.25rem;
}

.updates-hero {
  padding-top:9rem;
  padding-bottom:4rem;
}

.updates-hero h1 {
  font-family:var(--font-display);
  margin:0;
  font-size:clamp(3.7rem,5vw,5.8rem);
  font-weight:400;
}

.updates-hero>p:last-child {
  max-width:58ch;
  color:var(--muted);
  margin:1rem 0 0;
  line-height:1.85;
}

.updates-current {
  grid-template-columns:1fr 1fr;
  min-height:390px;
  display:grid;
}

.updates-current>div {
  background:#e8e6dc;
  flex-direction:column;
  align-items:flex-start;
  padding:clamp(2rem,4vw,4rem);
  display:flex;
}

.updates-current h2,.updates-list-heading h2 {
  font-family:var(--font-display);
  margin:0;
  font-size:clamp(2.7rem,3.7vw,4rem);
  font-weight:400;
}

.updates-current p:not(.landing-kicker) {
  max-width:46ch;
  color:var(--muted);
  margin:1rem 0;
  line-height:1.85;
}

.updates-current time {
  color:var(--muted);
  font-size:.83rem;
}

.updates-current .landing-inline-cta { margin-top:auto; }

.updates-current>img {
  object-fit:cover;
  width:100%;
  height:100%;
  min-height:390px;
}

.updates-lists {
  grid-template-columns:1fr;
  padding-top:6rem;
  padding-bottom:6rem;
  display:grid;
}

.updates-list-heading { margin-bottom:1.6rem; }

.updates-rows a {
  border-top:1px solid var(--border);
  gap:.5rem;
  padding:1.1rem 0 1.4rem;
  display:grid;
}

.updates-rows a:hover strong { color:var(--accent); }

.updates-rows time {
  color:var(--accent);
  font-family:var(--font-mono-family);
  font-size:.75rem;
}

.updates-rows strong { font-size:1.18rem; }

.updates-rows span {
  color:var(--muted);
  font-size:.89rem;
  line-height:1.7;
}

/* ============================================================
   9.5 「社区页」页面区块样式（.community-*）
   ============================================================ */

.community-hero,.community-options,.community-end,.support-hero,.support-faq,.support-contact {
  max-width:1280px;
  margin:0 auto;
  padding-left:1.25rem;
  padding-right:1.25rem;
}

.community-hero,.support-hero {
  padding-top:9rem;
  padding-bottom:5rem;
}

.community-hero h1,.support-hero h1 {
  font-family:var(--font-display);
  margin:0;
  font-size:clamp(3.7rem,5.5vw,6rem);
  font-weight:400;
  line-height:1.2;
}

.community-hero>p:last-child,.support-hero>p:not(.landing-kicker) {
  max-width:57ch;
  color:var(--muted);
  margin:1.4rem 0 0;
  font-size:1.08rem;
  line-height:1.85;
}

.community-options {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(1.5rem,3vw,3rem);
  padding-bottom:7rem;
  display:grid;
}

.community-options article {
  border-top:2px solid var(--fg);
  padding-top:1.3rem;
}

.community-options article>span {
  color:var(--accent);
  font-size:.8rem;
  font-weight:700;
}

.community-options h2,.community-end h2,.support-faq h2,.support-contact h2 {
  font-family:var(--font-display);
  margin:.6rem 0 1rem;
  font-size:clamp(2.3rem,3.5vw,3.7rem);
  font-weight:400;
}

.community-options p {
  color:var(--muted);
  line-height:1.85;
}

.community-qq { margin-top:1.5rem; }

.community-qq strong {
  color:var(--fg);
  font-family:var(--font-mono-family);
  font-size:1.2rem;
}

.community-options .landing-inline-cta { margin-top:.6rem; }

.community-end {
  border-top:1px solid var(--border);
  justify-content:space-between;
  align-items:end;
  gap:2rem;
  padding-top:5rem;
  padding-bottom:5rem;
  display:flex;
}

.community-end .landing-kicker { margin-bottom:0; }

/* ============================================================
   9.6 「帮助页」页面区块样式（.support-*）
   ============================================================ */

.support-hero>p a {
  color:var(--accent);
  text-underline-offset:.2em;
  text-decoration:underline;
}

.support-hero .landing-inline-cta { margin-top:1.5rem; }

.support-faq {
  border-top:1px solid var(--border);
  grid-template-columns:.32fr .68fr;
  gap:clamp(2rem,6vw,6rem);
  padding-top:5rem;
  padding-bottom:7rem;
  display:grid;
}

.support-faq-aside {
  align-self:start;
  position:sticky;
  top:6rem;
}

.support-faq-aside nav {
  color:var(--muted);
  gap:.7rem;
  margin-top:2rem;
  display:grid;
}

.support-faq-aside nav a:hover { color:var(--accent); }

.support-faq-main section {
  margin-bottom:2.7rem;
  scroll-margin-top:7rem;
}

.support-faq-main h3 {
  margin:0 0 .7rem;
  font-size:1.2rem;
  font-weight:700;
}

.support-faq-main article {
  border-top:1px solid var(--border);
  padding:1.1rem 0;
}

.support-faq-main h4 {
  margin:0;
  font-size:1.12rem;
  font-weight:700;
}

.support-faq-main p {
  color:var(--muted);
  margin:.5rem 0 0;
  line-height:1.85;
}

.support-contact {
  border-top:1px solid var(--border);
  grid-template-columns:1fr .5fr;
  gap:clamp(2rem,7vw,7rem);
  padding-top:5rem;
  padding-bottom:7rem;
  display:grid;
}

.support-contact p:not(.landing-kicker) {
  max-width:64ch;
  color:var(--muted);
  line-height:1.85;
}

.support-contact-links {
  align-content:start;
  padding-top:1rem;
  display:grid;
}

.support-contact-links a {
  border-top:1px solid var(--border);
  justify-content:space-between;
  gap:1rem;
  padding:.9rem 0;
  display:flex;
}

.support-contact-links a:hover { color:var(--accent); }

/* ============================================================
   10. 响应式断点与无障碍（>=768px 平板 / <=900px 收窄 / <=640px 手机）
   ============================================================ */

@supports (color:color-mix(in lab, red, red)) {
  .border-ink\/10 { border-color:color-mix(in oklab, var(--color-ink) 10%, transparent); }
}

@supports (color:color-mix(in lab, red, red)) {
  .bg-white\/50 { background-color:color-mix(in oklab, var(--color-white) 50%, transparent); }
}

@media (hover:hover) {
  .group-hover\:rotate-12:is(:where(.group):hover *) { rotate:12deg; }
  .hover\:text-crimson:hover { color:var(--color-crimson); }
}

@media (width>=40rem) {
  .sm\:flex-row { flex-direction:row; }
  .sm\:items-center { align-items:center; }
}

@media (width>=48rem) {
  .md\:h-10 { height:calc(var(--spacing) * 10); }
  .md\:w-10 { width:calc(var(--spacing) * 10); }
  .md\:grid-cols-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .md\:flex-row { flex-direction:row; }
  .md\:justify-start { justify-content:flex-start; }
  .md\:py-24 { padding-block:calc(var(--spacing) * 24); }
  .md\:py-28 { padding-block:calc(var(--spacing) * 28); }
  .md\:pt-36 { padding-top:calc(var(--spacing) * 36); }
  .md\:pb-16 { padding-bottom:calc(var(--spacing) * 16); }
  .md\:pb-18 { padding-bottom:calc(var(--spacing) * 18); }
  .md\:pb-28 { padding-bottom:calc(var(--spacing) * 28); }
  .md\:text-left { text-align:left; }
  .md\:text-2xl {
    font-size:var(--text-2xl);
    line-height:var(--tw-leading,var(--text-2xl--line-height));
  }
  .md\:text-4xl {
    font-size:var(--text-4xl);
    line-height:var(--tw-leading,var(--text-4xl--line-height));
  }
  .md\:text-5xl {
    font-size:var(--text-5xl);
    line-height:var(--tw-leading,var(--text-5xl--line-height));
  }
  .md\:text-7xl {
    font-size:var(--text-7xl);
    line-height:var(--tw-leading,var(--text-7xl--line-height));
  }
  .md\:text-base {
    font-size:var(--text-base);
    line-height:var(--tw-leading,var(--text-base--line-height));
  }
  .md\:text-lg {
    font-size:var(--text-lg);
    line-height:var(--tw-leading,var(--text-lg--line-height));
  }
}

@media (width>=64rem) {
  .lg\:block { display:block; }
  .lg\:flex { display:flex; }
  .lg\:hidden { display:none; }
}

@media (width>=80rem) {
  .xl\:inline { display:inline; }
}

@media (width>=768px) {
  .sponsor-hero-inner {
    grid-template-columns:minmax(0,.9fr) minmax(28rem,1.1fr);
    align-items:start;
    min-height:32rem;
  }
  .sponsor-hero-visual {
    pointer-events:none;
    align-self:stretch;
    min-height:30rem;
  }
  .sponsor-detail-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sponsor-thanks-inner {
    flex-direction:row;
    justify-content:space-between;
    align-items:center;
  }
}

@media (width<=767px) {
  .home-sponsor-inner,.sponsor-hero-inner { grid-template-columns:minmax(0,1fr); }
  .sponsor-hero-inner {
    flex-direction:column;
    gap:2rem;
    min-height:0;
    display:flex;
  }
  .sponsor-hero-copy { width:100%; }
  .sponsor-hero-visual {
    order:2;
    width:calc(100% + 4rem);
    min-height:21rem;
    margin:-2rem -2rem -5rem;
    position:relative;
    inset:auto;
  }
  .sponsor-hero-visual img {
    opacity:.78;
    width:48rem;
    top:48%;
    left:52%;
    transform:translate(-52%,-50%);
  }
  .sponsor-hero-visual:after { background:linear-gradient(180deg, var(--bg), transparent 34%); }
}

@media (width<=768px) {
  .section-title-decorated:before,.section-title-decorated:after { width:30px; }
  .section-title-decorated:before { margin-right:10px; }
  .section-title-decorated:after { margin-left:10px; }
  .cta-button {
    padding:.78rem 1.75rem;
    font-size:1rem;
  }
  .cta-button-secondary {
    padding:.72rem 1.6rem;
    font-size:.95rem;
  }
  .article-header,.article-body,.post-card { padding:1.4rem; }
  .article-title { font-size:2.5rem; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,:before,:after {
    scroll-behavior:auto!important;
    transition-duration:.001ms!important;
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
  }
}

@media (width<=900px) {
  .landing-hero { padding-top:7rem; }
  .landing-hero-inner,.landing-sect,.landing-ai { grid-template-columns:1fr; }
  .landing-hero-inner {
    gap:3rem;
    margin-bottom:3rem;
  }
  .landing-hero-media {
    max-width:700px;
    margin:0 auto;
  }
  .landing-sect-image { min-height:430px; }
  .landing-sect-copy {
    max-width:none;
    padding:4rem 1.25rem;
  }
  .landing-play-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .landing-current-links { grid-template-columns:repeat(2,1fr); }
}

@media (width<=640px) {
  .landing-hero { padding-top:7.4rem; }
  .landing-hero-copy h1 { font-size:clamp(3.4rem,14vw,4.7rem); }
  .landing-hero-lede {
    font-size:1rem;
    line-height:1.8;
  }
  .landing-hero-actions {
    flex-direction:column;
    align-items:flex-start;
    gap:.7rem;
  }
  .landing-hero-media { padding:0 0 2rem; }
  .landing-world-frame img { height:290px; }
  .landing-hero-preview {
    width:58%;
    bottom:-.6rem;
    left:-.35rem;
  }
  .landing-hero-preview img { height:100px; }
  .landing-hero-preview>span {
    font-size:.66rem;
    display:block;
  }
  .landing-hero-preview>span>span,.landing-hero-preview strong { display:none; }
  .landing-release-line {
    flex-direction:column;
    align-items:start;
    gap:.2rem;
  }
  .landing-release-line>span:last-child { margin-left:0; }
  .landing-section-head { margin-bottom:2.2rem; }
  .landing-journey,.landing-play-grid,.landing-current-links { grid-template-columns:1fr; }
  .landing-journey { gap:2rem; }
  .landing-play-image { height:220px; }
  .landing-sect-image { min-height:330px; }
  .landing-ai { gap:1.5rem; }
  .landing-current-top,.landing-start {
    flex-direction:column;
    align-items:flex-start;
  }
  .landing-current-links { gap:.2rem; }
}

@media (width<=900px) {
  .intro-hero,.intro-story,.intro-proof,.intro-ai { grid-template-columns:1fr; }
  .intro-hero { padding-top:7rem; }
  .intro-hero-image img { height:380px; }
  .intro-story,.intro-ai { gap:2rem; }
  .media-gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (width<=640px) {
  .intro-hero-copy h1 { font-size:clamp(2.5rem,10.5vw,3.7rem); }
  .intro-hero-image img { height:250px; }
  .intro-story,.intro-proof,.intro-ai,.media-gallery,.intro-final {
    padding-top:4.5rem;
    padding-bottom:4.5rem;
  }
  .intro-story-steps li { grid-template-columns:2.3rem 1fr; }
  .media-gallery-heading {
    flex-direction:column;
    align-items:start;
    gap:.8rem;
  }
  .media-gallery-grid { grid-template-columns:1fr; }
}

@media (width<=900px) {
  .guides-hero {
    grid-template-columns:1fr;
    gap:2.5rem;
    padding-top:7rem;
  }
  .guides-featured-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .guides-directory {
    grid-template-columns:1fr;
    gap:2rem;
  }
  .guides-directory-nav {
    flex-wrap:wrap;
    gap:.7rem 1.2rem;
    display:flex;
    position:static;
  }
  .guides-directory-nav p { width:100%; }
}

@media (width<=640px) {
  .guides-hero h1 { font-size:3.6rem; }
  .guides-hero-path { padding:1.3rem; }
  .guides-hero-path a { grid-template-columns:2rem 1fr; }
  .guides-hero-path a>span:last-child { grid-column:2; }
  .guides-heading {
    flex-direction:column;
    align-items:start;
    gap:.7rem;
  }
  .guides-featured-grid,.guides-link-list { grid-template-columns:1fr; }
  .guides-featured-grid img { height:220px; }
  .guides-featured { padding-bottom:4rem; }
  .guides-directory { padding-top:4rem; }
}

@media (width<=900px) {
  .updates-current,.updates-lists { grid-template-columns:1fr; }
  .updates-current>img {
    height:300px;
    min-height:0;
  }
}

@media (width<=640px) {
  .updates-hero { padding-top:7rem; }
  .updates-hero h1 { font-size:clamp(2.5rem,10.5vw,3.7rem); }
  .updates-lists {
    padding-top:4rem;
    padding-bottom:4rem;
  }
}

@media (width<=900px) {
  .community-options { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .support-faq,.support-contact { grid-template-columns:1fr; }
  .support-faq-aside { position:static; }
  .support-faq-aside nav {
    flex-wrap:wrap;
    gap:.6rem 1rem;
    margin-top:1rem;
    display:flex;
  }
}

@media (width<=640px) {
  .community-hero,.support-hero { padding-top:7rem; }
  .community-hero h1,.support-hero h1 { font-size:clamp(2.5rem,10.5vw,3.7rem); }
  .community-options {
    grid-template-columns:1fr;
    padding-bottom:4rem;
  }
  .community-end {
    flex-direction:column;
    align-items:start;
    padding-top:4rem;
    padding-bottom:4rem;
  }
}
