/* V101 charcoal-gold magazine stack */
:root { --ink:#171714; --ink-2:#23231f; --paper:#f2efe6; --muted:#bcb7aa; --gold:#d4ac55; --gold-2:#f0d48f; --line:rgba(212,172,85,.34); --safe:#9fb59d; --shadow:0 24px 70px rgba(0,0,0,.24); --radius:18px; }
* { box-sizing:border-box; }
html { color-scheme:dark; scroll-behavior:smooth; overflow-x:hidden; }
body { margin:0; min-width:0; overflow-x:hidden; background:var(--ink); color:var(--paper); font-family:ui-serif, Georgia, "Noto Serif SC", "Songti SC", serif; line-height:1.75; }
a { color:inherit; text-underline-offset:.2em; text-decoration-color:var(--line); }
a:hover, a:focus-visible { color:var(--gold-2); }
button, input { font:inherit; }
button, summary, a { -webkit-tap-highlight-color:transparent; }
img { display:block; max-width:100%; height:auto; }
.skip-link { position:fixed; top:.5rem; left:.5rem; z-index:99; padding:.7rem 1rem; background:var(--gold); color:var(--ink); transform:translateY(-180%); }
.skip-link:focus { transform:none; }
.site-header { position:relative; z-index:10; border-bottom:1px solid var(--line); background:rgba(23,23,20,.96); }
.header-inner { width:min(1380px, calc(100% - 32px)); margin:auto; display:grid; grid-template-columns:minmax(230px,.85fr) minmax(0,2fr); gap:28px; align-items:end; padding:18px 0 0; }
.brand { display:flex; gap:12px; align-items:center; text-decoration:none; padding-bottom:16px; min-width:0; }
.brand-index { display:grid; place-items:center; width:46px; aspect-ratio:1; border:1px solid var(--gold); color:var(--gold-2); font:700 .9rem/1 ui-monospace, monospace; }
.brand span:last-child { min-width:0; }
.brand b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.98rem; }
.brand small { display:block; color:var(--muted); font-size:.72rem; letter-spacing:.05em; }
.site-tabs { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); }
.site-tabs a { padding:14px 10px 17px; border-left:1px solid var(--line); text-align:center; text-decoration:none; color:var(--muted); font-size:.84rem; }
.site-tabs a:hover, .site-tabs a:focus-visible { background:var(--ink-2); color:var(--gold-2); }
.mobile-index { display:none; }
main { width:min(1380px, calc(100% - 32px)); margin:auto; }
.hero, .page-lead { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr); gap:clamp(26px,5vw,78px); align-items:center; min-height:620px; padding:clamp(52px,8vw,116px) 0; border-bottom:1px solid var(--line); }
.page-lead { min-height:520px; }
.eyebrow, .card-index, .footer-kicker { margin:0 0 14px; color:var(--gold); font:700 .72rem/1.4 ui-monospace, SFMono-Regular, monospace; letter-spacing:.16em; text-transform:uppercase; }
.breadcrumbs { display:flex; flex-wrap:wrap; gap:8px 18px; color:var(--muted); font-size:.78rem; margin-bottom:18px; }
.breadcrumbs > * + *::before { content:"/"; margin-right:18px; color:var(--gold); }
h1, h2, h3 { line-height:1.15; text-wrap:balance; }
h1 { margin:0; max-width:18ch; font-size:clamp(2.45rem,7vw,6.7rem); letter-spacing:-.055em; }
.page-lead h1 { font-size:clamp(2.3rem,5.2vw,5.5rem); }
h2 { font-size:clamp(1.65rem,3.3vw,3.4rem); letter-spacing:-.03em; }
h3 { font-size:clamp(1.08rem,1.65vw,1.45rem); }
.lede { max-width:64ch; margin:30px 0 0; color:#d9d5ca; font-size:clamp(1.02rem,1.5vw,1.22rem); }
.status-line { margin:28px 0 0; padding:14px 16px; border-left:3px solid var(--safe); background:rgba(159,181,157,.08); color:#c9d4c8; font-size:.88rem; }
.status-line span { color:var(--safe); font-weight:700; margin-right:.5rem; }
.search-visual, .secondary-visual, .article-visual { margin:0; padding:clamp(12px,2vw,24px); border:1px solid var(--line); background:linear-gradient(145deg,#20201d,#11110f); box-shadow:var(--shadow); }
figure figcaption { margin-top:12px; color:var(--muted); font-size:.78rem; }
.stack-section, .mission-panel { padding:clamp(58px,8vw,116px) 0; border-bottom:1px solid var(--line); }
.mission-panel { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(30px,7vw,110px); }
.mission-panel h2, .section-heading h2 { margin:.2rem 0 1rem; }
.mission-copy { columns:2 260px; column-gap:42px; color:#d4d0c6; }
.mission-copy p { margin-top:0; }
.section-heading { display:grid; grid-template-columns:minmax(110px,.35fr) minmax(0,.8fr) minmax(220px,.85fr); gap:24px; align-items:end; margin-bottom:44px; }
.section-heading > * { margin-top:0; margin-bottom:0; }
.section-heading > p:last-child { color:var(--muted); }
.offset-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; align-items:start; }
.offset-grid > :nth-child(3n+2) { margin-top:34px; }
.offset-grid > :nth-child(3n) { margin-top:68px; }
.index-card, .channel-card, .tool-card, .faq-list article, .callout { min-width:0; padding:clamp(22px,3vw,38px); border:1px solid var(--line); background:var(--ink-2); box-shadow:0 14px 35px rgba(0,0,0,.13); }
.index-card h3, .channel-card h3, .tool-card h3 { margin:.25rem 0 1rem; }
.index-card p, .channel-card p, .tool-card p { color:#d0ccc2; }
.card-note { display:inline-block; margin-top:12px; color:var(--safe); font-size:.76rem; }
.prompt { border-top:1px solid var(--line); padding-top:14px; }
.filter-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:-14px 0 30px; }
.filter-tabs button, .local-tool button { border:1px solid var(--line); background:transparent; color:var(--paper); padding:10px 16px; cursor:pointer; }
.filter-tabs button[aria-pressed="true"], .filter-tabs button:hover, .local-tool button:hover { background:var(--gold); color:var(--ink); }
.index-card[hidden] { display:none; }
.split-section { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,.8fr); gap:clamp(36px,7vw,100px); align-items:center; }
.tag-cloud { display:flex; flex-wrap:wrap; gap:9px; margin-top:26px; }
.tag-chip { display:inline-block; padding:7px 12px; border:1px solid var(--line); border-radius:999px; text-decoration:none; color:var(--gold-2); font-size:.82rem; }
.faq-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.prose-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(24px,5vw,64px); color:#d4d0c6; }
.article-body { width:min(900px,100%); margin:0 auto; padding:clamp(60px,9vw,122px) 0; }
.article-body section { margin:0 0 72px; }
.article-body p { font-size:1.04rem; }
.article-meta { padding-bottom:18px; border-bottom:1px solid var(--line); color:var(--muted); font-size:.82rem !important; }
.number-list { list-style:none; padding:0; display:grid; gap:12px; }
.number-list li { display:grid; grid-template-columns:52px 1fr; gap:16px; padding:18px; border:1px solid var(--line); background:var(--ink-2); }
.number-list b { color:var(--gold); font-family:ui-monospace,monospace; }
.callout { margin:18px 0; }
.article-visual { margin:72px 0 0; }
.local-tool { width:min(760px,100%); display:grid; gap:12px; }
.check-row { display:block; cursor:pointer; }
.check-row input { position:absolute; opacity:0; pointer-events:none; }
.check-row span { display:grid; grid-template-columns:52px 1fr; gap:14px; padding:18px; border:1px solid var(--line); background:var(--ink-2); }
.check-row b { color:var(--gold); font-family:ui-monospace,monospace; }
.check-row input:checked + span { border-color:var(--safe); background:rgba(159,181,157,.12); }
.check-row input:focus-visible + span { outline:2px solid var(--gold-2); outline-offset:2px; }
.local-tool button { justify-self:start; margin-top:14px; }
.local-tool output { min-height:52px; padding:14px 16px; border-left:3px solid var(--safe); color:#ced9cd; }
.site-footer { width:min(1380px, calc(100% - 32px)); margin:auto; padding:64px 0 24px; }
.footer-grid { display:grid; grid-template-columns:1.1fr .9fr 1.2fr; gap:38px; }
.footer-grid nav { display:flex; flex-direction:column; align-items:flex-start; gap:8px; }
.footer-grid p { margin-top:0; color:var(--muted); }
.fineprint { border-top:1px solid var(--line); padding-top:18px; margin-top:42px; color:#8f8c83; font-size:.75rem; }
@media (max-width: 980px) {
  .header-inner { grid-template-columns:1fr; padding-bottom:0; }
  .brand { padding-bottom:0; }
  .hero, .page-lead { grid-template-columns:1fr; min-height:0; }
  .search-visual { width:min(700px,100%); }
  .section-heading { grid-template-columns:1fr 1.6fr; }
  .section-heading > p:last-child { grid-column:2; }
  .offset-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .offset-grid > :nth-child(n) { margin-top:0; }
  .offset-grid > :nth-child(even) { margin-top:28px; }
  .split-section, .mission-panel { grid-template-columns:1fr; }
  .faq-list { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 720px) {
  .header-inner, main, .site-footer { width:min(100% - 24px, 1380px); }
  .site-tabs { display:none; }
  .mobile-index { display:block; border-top:1px solid var(--line); }
  .mobile-index summary { padding:13px 0; color:var(--gold-2); cursor:pointer; }
  .mobile-index nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); padding-bottom:14px; }
  .mobile-index a { padding:9px 0; color:var(--muted); }
  .hero, .page-lead { padding:48px 0; gap:32px; }
  h1, .page-lead h1 { font-size:clamp(2.25rem,13vw,4.4rem); overflow-wrap:anywhere; }
  .section-heading { grid-template-columns:1fr; margin-bottom:28px; }
  .section-heading > p:last-child { grid-column:auto; }
  .offset-grid, .prose-grid, .footer-grid { grid-template-columns:1fr; }
  .offset-grid > :nth-child(n) { margin-top:0; }
  .mission-copy { columns:1; }
  .stack-section, .mission-panel { padding:58px 0; }
  .article-body section { margin-bottom:50px; }
  .breadcrumbs { font-size:.72rem; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } *, *::before, *::after { animation:none !important; transition:none !important; } }