
[hidden] { display: none !important; }
:root {
  --text-xs: clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);
  --text-sm: clamp(0.875rem, 0.84rem + 0.18vw, 0.9375rem);
  --text-base: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
  --text-lg: clamp(1.125rem, 1.02rem + 0.5vw, 1.375rem);
  --text-xl: clamp(1.375rem, 1.15rem + 1vw, 1.875rem);
  --text-2xl: clamp(1.5rem, 1.1rem + 1.7vw, 2.25rem);

  --space-1: .25rem;  --space-2: .5rem;   --space-3: .75rem;
  --space-4: 1rem;    --space-5: 1.25rem; --space-6: 1.5rem;
  --space-8: 2rem;    --space-10: 2.5rem; --space-12: 3rem;
  --space-16: 4rem;   --space-20: 5rem;   --space-24: 6rem;

  --radius-sm: .375rem; --radius-md: .5rem; --radius-lg: .75rem;
  --radius-xl: 1rem; --radius-full: 9999px;

  --content-wide: 1180px;
  --transition: 180ms cubic-bezier(.16,1,.3,1);

  --font-display: 'Cabinet Grotesk', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  --font-body: 'Satoshi', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
}

:root, [data-theme='light'] {
  --color-bg: #f6f6f4;
  --color-surface: #ffffff;
  --color-surface-2: #fbfbfa;
  --color-surface-offset: #eeeeec;
  --color-divider: #e2e2df;
  --color-border: #d5d5d1;

  --color-text: #17181a;
  --color-text-muted: #63666b;
  --color-text-faint: #9a9da2;
  --color-text-inverse: #f7f7f5;

  --color-ink: #14202e;
  --color-ink-2: #1d2d3f;
  --color-on-ink: #e9edf2;
  --color-on-ink-muted: #a3b1c0;

  --color-accent: #c2410c;
  --color-accent-hover: #9a330a;
  --color-accent-soft: #fbeae1;

  --color-mgr: #1f5f6b;
  --color-mgr-soft: #dfeced;

  --shadow-sm: 0 1px 2px rgba(20,32,46,.06);
  --shadow-md: 0 4px 14px rgba(20,32,46,.08);
  --shadow-lg: 0 18px 44px rgba(20,32,46,.14);
}

[data-theme='dark'] {
  --color-bg: #131416;
  --color-surface: #1a1c1f;
  --color-surface-2: #1f2225;
  --color-surface-offset: #191b1e;
  --color-divider: #26292d;
  --color-border: #383c41;

  --color-text: #d6d8da;
  --color-text-muted: #8d9298;
  --color-text-faint: #63686e;
  --color-text-inverse: #17181a;

  --color-ink: #0f171f;
  --color-ink-2: #17222e;
  --color-on-ink: #dde4ec;
  --color-on-ink-muted: #8e9daf;

  --color-accent: #f07a3d;
  --color-accent-hover: #ff9057;
  --color-accent-soft: #33221a;

  --color-mgr: #66b3bf;
  --color-mgr-soft: #1d2f32;

  --shadow-sm: 0 1px 2px rgba(0,0,0,.3);
  --shadow-md: 0 4px 14px rgba(0,0,0,.36);
  --shadow-lg: 0 18px 44px rgba(0,0,0,.46);
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html {
  -webkit-text-size-adjust:none; text-size-adjust:none;
  -webkit-font-smoothing:antialiased; scroll-behavior:smooth;
  scroll-padding-top: 70px;
}
body {
  min-height:100dvh; line-height:1.7;
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text);
  background: var(--color-bg);
}
img,svg { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
ul,ol { list-style:none; }
button { font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
:focus-visible { outline:2px solid var(--color-accent); outline-offset:3px; border-radius:4px; }

.skip { position:absolute; left:-9999px; }
.skip:focus { left:var(--space-4); top:var(--space-4); z-index:99; background:var(--color-surface); padding:var(--space-3) var(--space-4); border-radius:var(--radius-md); }

.shell { width:100%; max-width:var(--content-wide); margin-inline:auto; padding-inline:clamp(var(--space-5),4vw,var(--space-10)); }

.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2);
  flex-direction:column;
  font-size:var(--text-sm); font-weight:700; letter-spacing:.01em;
  border-radius:var(--radius-md); transition:var(--transition);
  padding:var(--space-3) var(--space-5); line-height:1.35; text-align:center;
}
.btn-note { display:block; font-size:var(--text-xs); font-weight:500; opacity:.78; letter-spacing:0; }
.btn-lg { padding:var(--space-4) var(--space-8); font-size:var(--text-base); }
.btn-primary { background:var(--color-accent); color:#fff; box-shadow:var(--shadow-md); }
.btn-primary:hover { background:var(--color-accent-hover); transform:translateY(-1px); }
[data-theme='dark'] .btn-primary { color:#1a1006; }
.btn-quiet { border:1px solid rgba(255,255,255,.28); color:var(--color-on-ink); }
.btn-quiet:hover { border-color:rgba(255,255,255,.6); background:rgba(255,255,255,.06); }

.icon-btn {
  display:inline-grid; place-items:center; width:44px; height:44px;
  border-radius:var(--radius-md); border:1px solid var(--color-border);
  color:var(--color-text-muted); transition:var(--transition);
}
.icon-btn:hover { color:var(--color-text); border-color:var(--color-text-muted); }

.site-header {
  position:sticky; top:0; z-index:40;
  background:color-mix(in srgb, var(--color-bg) 88%, transparent);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--color-divider);
}
.header-inner { display:flex; align-items:center; gap:var(--space-6); min-height:70px; }
.brand { display:flex; align-items:center; gap:var(--space-2); flex-shrink:0; color:var(--color-text); }
.brand-logo { width:auto; height:30px; border-radius:6px; }
.brand-text { font-family:var(--font-display); font-weight:800; font-size:var(--text-lg); letter-spacing:.01em; white-space:nowrap; }

.nav { margin-inline:auto; }
.nav-list { display:flex; align-items:center; gap:var(--space-1); }
.nav-list a {
  display:flex; flex-direction:column; gap:1px;
  padding:var(--space-2) var(--space-3); border-radius:var(--radius-md);
  transition:var(--transition); position:relative;
}
.nav-list a:hover { background:var(--color-surface-offset); }
.nav-label { font-size:var(--text-sm); font-weight:700; white-space:nowrap; }
.nav-sub { font-size:var(--text-xs); color:var(--color-text-faint); white-space:nowrap; }
.nav-list a.is-manager .nav-label { color:var(--color-mgr); }
.nav-list a.active { color:var(--color-accent); }
.nav-list a.active::after {
  content:''; position:absolute; left:var(--space-3); right:var(--space-3); bottom:1px;
  height:2px; border-radius:2px; background:var(--color-accent);
}
.nav-foot { display:none; }

.header-actions { display:flex; align-items:center; gap:var(--space-2); flex-shrink:0; }
.nav-toggle { display:none; }

.hero {
  background:
    radial-gradient(1100px 460px at 12% -10%, rgba(194,65,12,.20), transparent 62%),
    linear-gradient(170deg, var(--color-ink-2), var(--color-ink) 65%);
  color:var(--color-on-ink);
  padding-block: clamp(var(--space-12), 6vw, var(--space-24));
  border-bottom:1px solid var(--color-divider);
}
.hero-grid {
  display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1.08fr);
  gap:clamp(var(--space-6), 4vw, var(--space-12)); align-items:start;
}
.hero-en {
  font-size:var(--text-xs); font-weight:700; letter-spacing:.3em;
  color:var(--color-accent); margin-bottom:var(--space-3);
}
.eyebrow {
  display:inline-block; font-size:var(--text-xs); font-weight:700; letter-spacing:.08em;
  color:var(--color-on-ink-muted); border:1px solid rgba(255,255,255,.2);
  padding:var(--space-1) var(--space-3); border-radius:var(--radius-full);
  margin-bottom:var(--space-6);
}
.hero-title {
  font-family:var(--font-display); font-weight:800;
  font-size:var(--text-2xl); line-height:1.32; letter-spacing:.005em;
  margin-bottom:var(--space-5); max-width:24ch;
}
.hero-title em {
  font-style:normal; color:var(--color-accent);
  background:linear-gradient(transparent 62%, rgba(194,65,12,.28) 62%);
}
[data-theme='dark'] .hero-title em { background:linear-gradient(transparent 62%, rgba(240,122,61,.22) 62%); }
.hero-lede {
  font-size:var(--text-base); color:var(--color-on-ink-muted);
  max-width:52ch; text-wrap:pretty;
}

.sample-table-wrap { overflow-x:auto; margin-bottom:var(--space-3); }
.sample-table { width:100%; border-collapse:collapse; font-size:var(--text-xs); line-height:1.5; }
.sample-table th, .sample-table td {
  border:1px solid var(--color-border); padding:var(--space-2) var(--space-3);
  text-align:left; white-space:nowrap;
}
.sample-table th { background:var(--color-surface-offset); color:var(--color-text-muted); font-weight:700; }
.sample-table td { color:var(--color-text); }
.table-note { font-size:var(--text-xs); color:var(--color-text-faint); line-height:1.6; }

.task-card {
  background:var(--color-surface); color:var(--color-text);
  border:1px solid var(--color-border); border-radius:var(--radius-xl);
  padding:clamp(var(--space-5), 2.4vw, var(--space-8));
  box-shadow:var(--shadow-lg);
}
.task-head { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-3); margin-bottom:var(--space-4); }
.tag {
  font-size:var(--text-xs); font-weight:700; letter-spacing:.03em;
  padding:2px var(--space-2); border-radius:var(--radius-sm);
}
.tag-l1 { background:var(--color-accent-soft); color:var(--color-accent); }
.tag-l2 { background:var(--color-mgr-soft); color:var(--color-mgr); }
.task-meta { font-size:var(--text-xs); color:var(--color-text-muted); }
.task-title {
  font-size:var(--text-lg); font-weight:700; line-height:1.5;
  margin-bottom:var(--space-5); text-wrap:pretty;
}

.stepper { background:var(--color-surface); border-bottom:1px solid var(--color-divider); }
.stepper-inner { display:flex; gap:var(--space-2); padding-block:var(--space-3); overflow-x:auto; }
.step {
  display:flex; align-items:center; gap:var(--space-2);
  padding:var(--space-2) var(--space-4); border-radius:var(--radius-md);
  color:var(--color-text-muted); font-size:var(--text-sm); font-weight:700;
  white-space:nowrap; border:1px solid transparent; transition:var(--transition);
}
.step:hover { background:var(--color-surface-offset); }
.step-no { font-size:var(--text-xs); color:var(--color-text-faint); font-weight:700; }
.step.is-active {
  color:var(--color-accent); background:var(--color-accent-soft);
  border-color:rgba(194,65,12,.25);
}
.step.is-active .step-no { color:var(--color-accent); }

.section { padding-block: clamp(var(--space-10), 4vw, var(--space-16)); }
.section-offset { background:var(--color-surface-offset); border-block:1px solid var(--color-divider); }
.kicker {
  font-size:var(--text-xs); font-weight:700; letter-spacing:.02em;
  color:var(--color-accent); margin-bottom:var(--space-3);
}
.kicker-en {
  display:inline-block; font-size:10px; letter-spacing:.24em;
  opacity:.72; margin-right:8px; font-weight:700; vertical-align:1px;
}
.section-title {
  font-family:var(--font-display); font-weight:800;
  font-size:var(--text-xl); line-height:1.35; margin-bottom:var(--space-3);
  text-wrap:balance;
}
.section-lede { font-size:var(--text-base); color:var(--color-text-muted); margin-bottom:var(--space-6); }

.task-list { display:grid; gap:var(--space-6); }
.task-card .task-steps { display:grid; gap:var(--space-4); margin-bottom:var(--space-5); }
.task-steps li { display:flex; gap:var(--space-3); align-items:flex-start; }
.step-n {
  flex-shrink:0; width:22px; height:22px; border-radius:var(--radius-full);
  background:var(--color-surface-offset); color:var(--color-text-muted);
  font-size:var(--text-xs); font-weight:700; display:grid; place-items:center; margin-top:3px;
}
.task-steps b { font-size:var(--text-sm); font-weight:700; }
.task-steps p { font-size:var(--text-sm); color:var(--color-text-muted); line-height:1.6; text-wrap:pretty; }

.prompt-block {
  border:1px solid var(--color-border); border-radius:var(--radius-md);
  overflow:hidden; background:var(--color-surface-2); margin-bottom:var(--space-4);
}
.prompt-bar {
  display:flex; align-items:center; justify-content:space-between; gap:var(--space-3);
  padding:var(--space-2) var(--space-3);
  background:var(--color-surface-offset); border-bottom:1px solid var(--color-divider);
  font-size:var(--text-xs); font-weight:700; color:var(--color-text-muted);
}
.lang-switch { display:flex; align-items:center; gap:var(--space-2); }
.lang-btn {
  font-size:var(--text-xs); font-weight:700; color:var(--color-text-muted);
  border:1px solid var(--color-border); border-radius:var(--radius-sm);
  padding:2px var(--space-2); transition:var(--transition);
  background:var(--color-surface-2);
}
.lang-btn:hover { color:var(--color-accent); border-color:var(--color-accent); }
.lang-btn.is-active { color:var(--color-accent); border-color:currentColor; background:var(--color-accent-soft); }
.copy-btn {
  font-size:var(--text-xs); font-weight:700; color:var(--color-accent);
  border:1px solid currentColor; border-radius:var(--radius-sm);
  padding:1px var(--space-2); transition:var(--transition);
}
.copy-btn:hover { background:var(--color-accent-soft); }
.prompt-block code {
  display:block; padding:var(--space-3);
  font-family:var(--font-body); font-size:var(--text-sm);
  line-height:1.65; color:var(--color-text); word-break:break-word;
}
.prompt-block i { font-style:normal; color:var(--color-accent); font-weight:700; }

.prompt-models {
  display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-2);
  padding:var(--space-2) var(--space-3);
  background:var(--color-surface-2); border-top:1px solid var(--color-divider);
}
.pm-label { font-size:var(--text-xs); color:var(--color-text-faint); font-weight:700; margin-right:var(--space-1); }
.model-btn {
  font-size:var(--text-xs); font-weight:700; color:var(--color-text-muted);
  border:1px solid var(--color-border); border-radius:var(--radius-sm);
  padding:2px var(--space-2); background:var(--color-surface);
  transition:var(--transition);
}
.model-btn:hover { color:var(--color-accent); border-color:var(--color-accent); }

.task-foot {
  border-top:1px dashed var(--color-divider); padding-top:var(--space-3);
  display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); flex-wrap:wrap;
}
.ok { font-size:var(--text-xs); color:var(--color-mgr); font-weight:700; }
.sop-btn {
  font-size:var(--text-xs); font-weight:700; color:var(--color-mgr);
  border:1px solid currentColor; border-radius:var(--radius-sm);
  padding:2px var(--space-2); transition:var(--transition); white-space:nowrap;
}
.sop-btn:hover { background:var(--color-mgr-soft); }

.fit-note {
  font-size:var(--text-xs); color:var(--color-text-muted);
  margin:calc(var(--space-2) * -1) 0 var(--space-4); line-height:1.7;
}
.fit-note b { color:var(--color-accent); font-weight:700; }

.faq-list { display:grid; gap:var(--space-3); }
.faq-item {
  background:var(--color-surface); border:1px solid var(--color-border);
  border-radius:var(--radius-lg); overflow:hidden;
}
.faq-q {
  width:100%; display:flex; align-items:center; justify-content:space-between;
  gap:var(--space-4); padding:var(--space-4) var(--space-5);
  font-size:var(--text-base); font-weight:700; text-align:left;
  transition:var(--transition);
}
.faq-q:hover { background:var(--color-surface-2); }
.faq-icon {
  flex-shrink:0; width:28px; height:28px; border-radius:var(--radius-full);
  border:1px solid var(--color-border); display:grid; place-items:center;
  font-size:var(--text-lg); line-height:1; font-weight:400;
  color:var(--color-accent);
  transition:transform var(--transition), background var(--transition), color var(--transition), border-color var(--transition);
}
.faq-item.is-open .faq-icon {
  transform:rotate(45deg); background:var(--color-accent); color:#fff;
  border-color:var(--color-accent);
}
.faq-a { padding:0 var(--space-5) var(--space-4); font-size:var(--text-sm); color:var(--color-text-muted); line-height:1.75; }

.ref-list { display:grid; gap:var(--space-3); }
.ref-list li { display:flex; align-items:flex-start; gap:var(--space-3); }
.ref-list a {
  font-size:var(--text-sm); font-weight:700; color:var(--color-accent);
  border-bottom:1px solid transparent; transition:var(--transition);
}
.ref-list a:hover { border-color:currentColor; }
.ref-list p { font-size:var(--text-sm); color:var(--color-text-muted); }

.next-step {
  text-align:center; border-top:1px solid var(--color-divider);
  padding-top:var(--space-6); margin-top:var(--space-6);
}
.next-step .kicker { text-align:center; }
.next-step h2 { font-size:var(--text-xl); font-weight:800; margin-bottom:var(--space-3); text-wrap:balance; }
.next-step p:not(.kicker) { font-size:var(--text-base); color:var(--color-text-muted); margin-bottom:var(--space-6); }
.next-step .btn { display:inline-flex; }

.site-footer { background:var(--color-ink); color:var(--color-on-ink); padding-block:var(--space-8); }
.footer-grid { display:grid; grid-template-columns:minmax(0,1.6fr) repeat(2, minmax(0,1fr)); gap:var(--space-8); }
.footer-brand .brand-logo { height:26px; margin-bottom:var(--space-3); border-radius:6px; }
.footer-brand p { font-size:var(--text-sm); color:var(--color-on-ink-muted); max-width:34ch; }
.footer-meta { margin-top:var(--space-3); font-size:var(--text-xs); color:var(--color-on-ink-muted); opacity:.75; }
.footer-col ul { display:grid; gap:var(--space-3); }
.footer-col a { font-size:var(--text-sm); color:var(--color-on-ink-muted); transition:var(--transition); }
.footer-col a:hover { color:var(--color-on-ink); }

.footer-copy {
  margin-top:var(--space-5); padding-top:var(--space-4);
  border-top:1px solid rgba(255,255,255,.12);
  font-size:var(--text-xs); color:var(--color-on-ink-muted); opacity:.72;
  text-align:center;
}

@media (max-width: 1120px) {
  .nav-label { font-size:var(--text-xs); }
  .nav-sub { display:none; }
  .nav-list a { padding:var(--space-2); }
}
@media (max-width: 920px) {
  .hero-grid { grid-template-columns:1fr; }
  .hero-lede { max-width:none; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .footer-brand { grid-column:1 / -1; }
}
@media (max-width: 780px) {
  .hide-sm { display:none; }
  .stepper-inner {
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 40px), transparent);
    mask-image: linear-gradient(to right, #000 calc(100% - 40px), transparent);
  }
  .nav-toggle { display:inline-grid; }
  .nav {
    position:fixed; inset:70px 0 auto; z-index:39;
    background:var(--color-surface); border-bottom:1px solid var(--color-divider);
    padding:var(--space-4) clamp(var(--space-5),4vw,var(--space-10)) var(--space-6);
    box-shadow:var(--shadow-lg); margin:0;
    display:none;
  }
  .nav.is-open { display:block; }
  .nav-list { flex-direction:column; gap:0; }
  .nav-list li + li { border-top:1px solid var(--color-divider); }
  .nav-list a { padding:var(--space-4) 0; border-radius:0; }
  .nav-list a:hover { background:none; }
  .nav-foot { display:block; margin-top:var(--space-5); }
  .nav-foot .btn { width:100%; }
  .btn-lg { width:100%; }
  .hero-cta { flex-direction:column; align-items:stretch; }
}
@media (max-width: 520px) {
  .task-card { padding:var(--space-4); }
  .footer-grid { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce) {
  * { transition:none !important; animation:none !important; scroll-behavior:auto; }
}
.footer-friends {
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-3);
  margin-top:var(--space-5); padding-top:var(--space-4);
  border-top:1px solid rgba(255,255,255,.12);
  font-size:var(--text-xs); color:var(--color-on-ink-muted);
}
.footer-friends .f-label { font-weight:700; color:var(--color-on-ink); letter-spacing:.05em; }
.footer-friends a { color:var(--color-on-ink-muted); }
.footer-friends a:hover { color:var(--color-on-ink); }
.cat-tabs { display:flex; flex-wrap:wrap; gap:var(--space-2); margin-bottom:var(--space-6); }
.cat-tab {
  padding:var(--space-2) var(--space-4);
  border:1px solid var(--color-divider); border-radius:999px;
  font-size:var(--text-sm); color:var(--color-text-muted);
  transition:var(--transition); background:transparent;
}
.cat-tab:hover { color:var(--color-accent); border-color:var(--color-accent); }
.cat-tab.is-active { color:var(--color-accent); border-color:currentColor; background:var(--color-accent-soft); }
.news-item { transition:var(--transition); }
.news-item[hidden] { display:none; }
/* ===== 新闻详情页 ===== */
.nd-hero { padding: var(--space-10) 0 var(--space-8); background: var(--color-bg); border-bottom: 1px solid var(--color-divider); }
.nd-hero .hero-en { font-size: var(--text-xs); letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-accent); margin-bottom: var(--space-2); }
.nd-hero .eyebrow { margin-bottom: var(--space-3); }
.nd-title { font-family: var(--font-display); font-size: clamp(1.7rem, 3.4vw, 2.5rem); line-height: 1.15; letter-spacing: -0.02em; margin: 0 0 var(--space-4); max-width: var(--content-wide); }
.nd-meta { display: flex; gap: var(--space-2); align-items: center; color: var(--color-text-muted); font-size: var(--text-sm); }
.nd-body { padding: var(--space-10) 0 var(--space-12); }
.nd-article { max-width: var(--content-wide); }
.nd-article p { font-size: 1.06rem; line-height: 1.85; color: var(--color-text); margin: 0 0 1.6em; }
.nd-article p:last-child { margin-bottom: 0; }
.nd-pager { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); flex-wrap: wrap; margin-top: var(--space-8); padding-top: var(--space-6); border-top: 1px solid var(--color-divider); }
.nd-pager-link { font-size: var(--text-sm); color: var(--color-text-muted); text-decoration: none; max-width: 40%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: var(--transition); }
.nd-pager-link:hover { color: var(--color-accent); }
.nd-pager-link.is-disabled { color: var(--color-divider); pointer-events: none; }
.nd-back { font-size: var(--text-sm); padding: var(--space-2) var(--space-4); border: 1px solid var(--color-divider); border-radius: 999px; color: var(--color-text); text-decoration: none; transition: var(--transition); }
.nd-back:hover { border-color: var(--color-accent); color: var(--color-accent); }
