:root {
  color-scheme: light; --pine-950:#102a24; --pine-800:#17463a; --pine-650:#266452;
  --pine-100:#dcebe5; --paper:#f6f2e8; --card:#fffdf7; --amber:#d89222; --amber-soft:#f3d69a;
  --ink:#17211d; --muted:#5c6963; --line:#c8d4cb; --shadow:0 18px 45px rgba(16,42,36,.12);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--paper); }
body { margin:0; color:var(--ink); background:radial-gradient(circle at 8% 0%,rgba(216,146,34,.12),transparent 28rem),var(--paper); font-family:system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; line-height:1.75; overflow-wrap:anywhere; }
a { color:var(--pine-800); text-underline-offset:.18em; }
a:hover { color:#9a5d00; }
.site-header { position:sticky; top:0; z-index:10; border-bottom:1px solid rgba(200,212,203,.8); background:rgba(246,242,232,.94); backdrop-filter:blur(14px); }
.header-inner { width:min(1180px,calc(100% - 32px)); margin:auto; min-height:70px; display:flex; align-items:center; gap:28px; }
.wordmark { flex:none; text-decoration:none; font-weight:800; letter-spacing:.04em; color:var(--pine-950); }
.wordmark span { display:inline-grid; place-items:center; width:34px; height:34px; margin-right:9px; border-radius:50%; background:var(--amber); color:#fff; font-size:.72rem; }
.desktop-tabs { display:flex; gap:4px; overflow-x:auto; scrollbar-width:none; }
.desktop-tabs a { flex:none; padding:8px 13px; border-radius:999px; text-decoration:none; font-size:.9rem; }
.desktop-tabs a:hover { background:var(--pine-100); }
.mobile-tabs { display:none; margin-left:auto; position:relative; }
.mobile-tabs summary { cursor:pointer; font-weight:700; color:var(--pine-950); }
.mobile-tabs nav { position:absolute; right:0; top:38px; width:min(290px,calc(100vw - 32px)); padding:12px; display:grid; background:var(--card); border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow); }
.mobile-tabs a { padding:8px 10px; text-decoration:none; }
main { width:min(1180px,calc(100% - 32px)); margin:auto; }
.crumb { display:flex; gap:8px; align-items:center; padding:24px 0 0; color:var(--muted); font-size:.88rem; }
.hero { position:relative; display:grid; grid-template-columns:minmax(0,1.6fr) minmax(260px,.8fr); gap:24px; margin:36px 0 30px; padding:clamp(28px,5vw,72px); border-radius:32px; overflow:hidden; color:#fff; background:linear-gradient(135deg,var(--pine-950),var(--pine-800)); box-shadow:var(--shadow); }
.hero::after { content:""; position:absolute; width:260px; aspect-ratio:1; border:42px solid rgba(243,214,154,.18); border-radius:50%; right:-72px; top:-80px; }
.hero-copy,.source-panel { position:relative; z-index:1; min-width:0; }
.hero h1 { max-width:18ch; margin:.2em 0; font-size:clamp(2.25rem,6vw,5.6rem); line-height:1.04; letter-spacing:-.045em; }
.hero-inner h1 { font-size:clamp(2rem,4.8vw,4.2rem); }
.eyebrow { margin:0 0 12px; color:var(--amber); font-size:.78rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.lead { max-width:62ch; font-size:clamp(1rem,1.5vw,1.2rem); color:#e6f2ed; }
.source-panel { align-self:end; padding:22px; border:1px solid rgba(255,255,255,.2); border-radius:20px; background:rgba(255,255,255,.09); }
.panel-label { display:block; margin-bottom:12px; color:var(--amber-soft); font-size:.7rem; font-weight:800; letter-spacing:.14em; }
.source-panel p { margin:.55em 0 0; color:#d9e8e2; font-size:.92rem; }
.home-files,.channel-index,.directory,.tool-panel { margin:28px 0 56px; padding:clamp(22px,4vw,44px); border:1px solid var(--line); border-radius:26px; background:rgba(255,253,247,.82); }
h2 { margin:.15em 0 .65em; color:var(--pine-950); font-size:clamp(1.5rem,3vw,2.35rem); line-height:1.2; }
h3 { margin:.15em 0 .45em; line-height:1.3; }
.file-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.file-card { min-width:0; padding:20px; border:1px solid var(--line); border-radius:18px; background:var(--card); }
.file-no { display:block; color:var(--amber); font-weight:900; font-variant-numeric:tabular-nums; }
.file-card p { color:var(--muted); font-size:.94rem; }
.card-link { display:inline-block; font-weight:700; }
.timeline { position:relative; margin:54px auto; max-width:920px; }
.timeline::before { content:""; position:absolute; left:28px; top:14px; bottom:14px; width:2px; background:linear-gradient(var(--amber),var(--pine-650)); }
.timeline-step { position:relative; display:grid; grid-template-columns:58px minmax(0,1fr); gap:24px; margin:0 0 22px; }
.step-mark { z-index:1; display:grid; place-items:center; width:58px; height:58px; border-radius:18px; background:var(--pine-950); color:var(--amber-soft); font-weight:900; }
.step-body { min-width:0; padding:22px 26px; border:1px solid var(--line); border-radius:20px; background:var(--card); box-shadow:0 8px 28px rgba(16,42,36,.06); }
.step-body p { color:#36443e; }
.step-body li { margin:.45em 0; }
.related { margin:64px 0 78px; }
.directory-group { margin:10px 0; border:1px solid var(--line); border-radius:14px; background:#fff; }
.directory-group summary { cursor:pointer; padding:15px 18px; font-weight:800; }
.directory-group div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:0 18px 18px; }
.directory-group a { padding:7px 9px; border-left:3px solid var(--amber-soft); text-decoration:none; }
.tool-panel label { display:block; margin:10px 0; padding:12px; border-radius:12px; background:var(--pine-100); }
.tool-panel input { margin-right:10px; }
.tool-panel pre { padding:18px; white-space:pre-wrap; border-radius:14px; background:var(--pine-950); color:#eef8f4; }
button { appearance:none; border:0; border-radius:999px; padding:11px 18px; background:var(--amber); color:#1d241f; font:inherit; font-weight:800; cursor:pointer; }
.tool-status { color:var(--muted); }
.site-footer { padding:44px max(16px,calc((100% - 1180px)/2)); color:#dcebe5; background:var(--pine-950); }
.site-footer nav { display:flex; flex-wrap:wrap; gap:14px; margin:18px 0; }
.site-footer a { color:#f3d69a; }
.site-footer p { max-width:72ch; }
.fineprint { color:#a9bbb4; font-size:.86rem; }
@media (max-width:900px) {
  .desktop-tabs { display:none; } .mobile-tabs { display:block; }
  .hero { grid-template-columns:1fr; } .source-panel { max-width:540px; }
  .file-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:560px) {
  .header-inner,main { width:min(100% - 24px,1180px); }
  .hero { margin-top:24px; padding:24px 20px; border-radius:22px; }
  .file-grid,.directory-group div { grid-template-columns:1fr; }
  .home-files,.channel-index,.directory,.tool-panel { padding:20px 16px; border-radius:20px; }
  .timeline::before { left:20px; }
  .timeline-step { grid-template-columns:42px minmax(0,1fr); gap:10px; }
  .step-mark { width:42px; height:42px; border-radius:13px; font-size:.78rem; }
  .step-body { padding:18px 16px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }