/* Armasourcing Docs — Forest v2 on cream paper (Obsidian-publish style layout) */
:root {
  /* cream paper canvas (Eli-requested, 2026-08-08) */
  --bg-page:#FFFCF0; --bg-panel:#F7F4E7; --bg-card:#FFFFFF; --bg-soft:#F4F1E3; --bg-hover:#F1EDDE;
  --line:#E9E5D5; --line-2:#DBD6C3;
  --ink:#1B1917; --ink-dim:#57534A; --mute:#9C968A;
  /* brand: forest green family (unchanged) */
  --green-900:#173F3A; --green-700:#1B4D47; --green-500:#2E6E64;
  --green-300:#7FAEA4; --green-100:#DCE8E3; --green-soft:rgba(27,77,71,.08);
  --gold:#F5C842; --gold-ink:#9A7400; --gold-soft:rgba(245,200,66,.16);
  --good:#16A34A; --good-soft:#E7F6EC; --warn:#D9920A; --warn-soft:#FBF3DC;
  --bad:#E5484D; --bad-soft:#FDECEC; --info:#3B82F6; --info-soft:#EAF2FE;
  --r-sm:10px; --r-md:16px; --r-lg:22px;
  --sh-sm:0 1px 2px rgba(27,25,23,.04);
  --sh-md:0 4px 12px -4px rgba(27,25,23,.08);
  --accent:var(--green-700); --accent-strong:var(--green-500); --accent-soft:var(--green-soft);
  --text-on-accent:#FFFFFF; --border:var(--line); --border-strong:var(--line-2);
  --surface-glass: rgba(255,252,240,.8); --glass-blur:12px;
  --glass-edge: inset 0 1px 0 rgba(255,255,255,.65);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0; background:var(--bg-page); color:var(--ink);
  font-family:'Plus Jakarta Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  letter-spacing:-.005em; font-size:15px; line-height:1.65;
}
a { color:var(--green-700); text-decoration:none; }
a:hover { text-decoration:underline; }
:focus-visible { outline:2px solid var(--green-500); outline-offset:2px; }
.mono { font-family:ui-monospace, Consolas, monospace; font-size:12px; color:var(--ink-dim); }

/* topbar */
.topbar { position:sticky; top:0; z-index:50; display:flex; align-items:center; gap:18px; padding:10px 22px; }
.glass {
  background:var(--surface-glass);
  backdrop-filter:blur(var(--glass-blur)); -webkit-backdrop-filter:blur(var(--glass-blur));
  border-bottom:1px solid var(--line); box-shadow:var(--glass-edge);
}
@media (prefers-reduced-transparency: reduce) { .glass { background:var(--bg-page); backdrop-filter:none; -webkit-backdrop-filter:none; } }
.brand { display:flex; align-items:center; gap:10px; }
.brand:hover { text-decoration:none; }
.brand img { display:block; border-radius:8px; }
.brand-txt { display:flex; flex-direction:column; line-height:1.15; }
.brand-txt b { font-size:15px; font-weight:800; color:var(--ink); }
.brand-txt i { font-style:normal; font-size:9px; font-weight:800; letter-spacing:1.3px; text-transform:uppercase; color:var(--mute); }
.topsearch { flex:1; max-width:420px; margin-left:auto; }
.topsearch input, .hero-search input, .f-input {
  width:100%; padding:9px 13px; border-radius:10px; font-size:13px;
  border:1px solid var(--line-2); background:var(--bg-card); font-family:inherit; color:var(--ink);
}
.topsearch input:focus, .hero-search input:focus, .f-input:focus {
  border-color:var(--green-500); box-shadow:0 0 0 3px var(--green-soft); outline:none;
}
.topnav { display:flex; align-items:center; gap:14px; }
.toplink { font-size:13px; font-weight:600; color:var(--ink-dim); }

/* buttons */
.btn-primary {
  display:inline-block; background:var(--green-700); color:#fff; font-weight:700; border:0;
  padding:10px 18px; border-radius:11px; font-size:12.5px; cursor:pointer; font-family:inherit;
}
.btn-primary:hover { background:var(--green-900); text-decoration:none; }
.btn-secondary {
  display:inline-block; background:var(--bg-card); color:var(--ink); font-weight:700; border:1px solid var(--line-2);
  padding:10px 18px; border-radius:11px; font-size:12.5px; cursor:pointer; font-family:inherit;
}
.btn-secondary:hover { background:var(--bg-hover); text-decoration:none; }
.btn-invert {
  display:inline-block; background:#fff; color:var(--green-700); font-weight:800; border:0;
  padding:12px 22px; border-radius:11px; font-size:13px;
}
.btn-invert:hover { text-decoration:none; }
.btn-mini {
  display:inline-block; background:var(--bg-card); color:var(--ink-dim); font-weight:700; border:1px solid var(--line);
  padding:4px 10px; border-radius:8px; font-size:11px; cursor:pointer; font-family:inherit;
}
.btn-mini:hover { background:var(--bg-hover); text-decoration:none; }
.btn-danger { color:var(--bad); border-color:var(--bad-soft); }
.inline-form { display:inline; }

/* shell: nav tree | content | outline */
.shell { display:flex; max-width:1360px; margin:0 auto; align-items:flex-start; }
.side {
  width:264px; flex:none; padding:20px 12px 40px 18px;
  position:sticky; top:57px; max-height:calc(100vh - 57px); overflow-y:auto;
  border-right:1px solid var(--line);
}
.side-group { margin-bottom:4px; }
.side-group > details > summary { list-style:none; cursor:pointer; }
.side-group > details > summary::-webkit-details-marker { display:none; }
.side-h {
  display:flex; align-items:center; gap:7px; font-size:12.5px; font-weight:800;
  color:var(--ink); padding:7px 10px; border-radius:9px;
}
.side-h:hover { background:var(--bg-hover); text-decoration:none; }
.side-h .tw { flex:none; font-size:9px; color:var(--mute); transition:transform .15s; }
details[open] > summary .tw { transform:rotate(90deg); }
.side-kids { padding:1px 0 6px; }
.side-link {
  display:block; font-size:13px; font-weight:500; color:var(--ink-dim);
  padding:5.5px 10px 5.5px 26px; border-radius:9px;
  border-left:1px solid var(--line); margin-left:14px; border-radius:0 9px 9px 0;
}
.side-link:hover { background:var(--bg-hover); color:var(--ink); text-decoration:none; }
.side-link.on { background:var(--green-soft); color:var(--green-700); font-weight:700; border-left-color:var(--green-500); }
.content { flex:1; min-width:0; padding:30px 40px 48px; max-width:820px; margin:0 auto; }

/* outline (on this page) */
.outline {
  width:220px; flex:none; position:sticky; top:57px; max-height:calc(100vh - 57px);
  overflow-y:auto; padding:26px 18px 40px 6px; font-size:12.5px;
}
.outline-h { font-size:9px; font-weight:800; letter-spacing:1.3px; text-transform:uppercase; color:var(--mute); margin:0 0 8px 12px; }
.outline a {
  display:block; color:var(--ink-dim); font-weight:500; padding:4px 12px;
  border-left:1px solid var(--line); line-height:1.4;
}
.outline a:hover { color:var(--green-700); text-decoration:none; }
.outline a.lv3 { padding-left:24px; font-size:11.5px; color:var(--mute); }
.outline a.on { color:var(--green-700); font-weight:700; border-left-color:var(--green-500); }

/* hero + sections */
.eyebrow { font-size:11px; font-weight:800; letter-spacing:1px; text-transform:uppercase; color:var(--green-700); margin-bottom:6px; }
.hero { padding:20px 0 8px; }
.hero-sm { padding:8px 0 4px; }
.hero h1 { font-size:31px; font-weight:800; margin:0 0 8px; letter-spacing:-.5px; }
.hero .sub { color:var(--ink-dim); max-width:640px; margin:0 0 18px; }
.hero-search { display:flex; gap:10px; max-width:560px; margin-bottom:8px; }
.sec { margin-top:30px; }
.sec-label { font-size:11px; font-weight:800; letter-spacing:1px; text-transform:uppercase; color:var(--mute); }
.sec-title { font-size:20px; font-weight:800; margin:4px 0 14px; }

/* cards */
.card {
  background:var(--bg-card); border:1px solid var(--line); border-radius:var(--r-md);
  box-shadow:var(--sh-sm); padding:18px;
}
.grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:14px; }
.cat-card { display:block; color:var(--ink); }
.cat-card:hover { text-decoration:none; border-color:var(--green-300); }
.cat-icon { font-size:22px; margin-bottom:8px; }
.cat-name { font-size:15px; font-weight:800; margin-bottom:4px; }
.cat-desc { font-size:12.5px; color:var(--ink-dim); margin-bottom:10px; min-height:36px; }
.cat-count { display:inline-block; background:var(--green-soft); color:var(--green-700); font-size:10.5px; font-weight:700; padding:3px 11px; border-radius:99px; }

/* lists */
.list { display:flex; flex-direction:column; gap:8px; }
.row {
  display:flex; align-items:center; gap:14px; background:var(--bg-card);
  border:1px solid var(--line); border-radius:var(--r-sm); padding:12px 16px; color:var(--ink);
}
.row:hover { text-decoration:none; background:var(--bg-hover); }
.row-lg { padding:15px 18px; }
.row-main { display:flex; flex-direction:column; gap:2px; min-width:0; }
.row-cat { font-size:10px; font-weight:800; letter-spacing:.8px; text-transform:uppercase; color:var(--mute); }
.row-title { font-size:14px; font-weight:700; }
.row-sum { font-size:12.5px; color:var(--ink-dim); }
.row-date { margin-left:auto; flex:none; font-size:12px; color:var(--mute); font-variant-numeric:tabular-nums; }
.empty { color:var(--mute); padding:22px; text-align:center; background:var(--bg-soft); border-radius:var(--r-sm); }

/* crumbs */
.crumbs { font-size:12.5px; color:var(--mute); margin-bottom:10px; }
.crumbs span { margin:0 6px; }
.crumbs b { color:var(--ink-dim); font-weight:600; }

/* article: flat typographic column on cream */
.doc h1 { font-size:30px; font-weight:800; letter-spacing:-.5px; margin:6px 0 10px; }
.doc-meta { display:flex; align-items:center; gap:12px; margin-bottom:20px; padding-bottom:16px; border-bottom:1px solid var(--line); }
.doc-date { font-size:12.5px; color:var(--mute); }
.doc-edit { font-size:12px; font-weight:700; }
.pill { display:inline-block; padding:3px 11px; border-radius:99px; font-size:10.5px; font-weight:700; letter-spacing:.3px; }
.pill-cat { background:var(--green-soft); color:var(--green-700); }
.pill-good { background:var(--good-soft); color:var(--good); }
.pill-neutral { background:var(--bg-soft); color:var(--mute); }
.doc-body { max-width:740px; font-size:15.5px; line-height:1.7; }
.doc-body h2 { font-size:21px; font-weight:800; margin:30px 0 8px; letter-spacing:-.3px; }
.doc-body h2:first-child { margin-top:0; }
.doc-body h3 { font-size:16.5px; font-weight:700; margin:22px 0 6px; }
.doc-body p { margin:10px 0; }
.doc-body ul, .doc-body ol { padding-left:24px; }
.doc-body li { margin:5px 0; }
.doc-body code { font-family:ui-monospace, Consolas, monospace; font-size:12.5px; background:var(--bg-soft); border:1px solid var(--line); border-radius:5px; padding:1px 5px; }
.doc-body pre { background:var(--bg-soft); border:1px solid var(--line); border-radius:var(--r-sm); padding:14px; overflow-x:auto; }
.doc-body pre code { background:none; border:0; padding:0; }
.doc-body table { border-collapse:collapse; width:100%; margin:12px 0; }
.doc-body th { padding:9px 12px; text-align:left; font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.8px; color:var(--mute); background:var(--bg-soft); }
.doc-body td { padding:10px 12px; font-size:13.5px; border-top:1px solid var(--line); }
.doc-body img { max-width:100%; border-radius:var(--r-sm); border:1px solid var(--line); }
.doc-body blockquote { margin:12px 0; padding:10px 16px; border-left:3px solid var(--green-300); background:var(--bg-soft); border-radius:0 var(--r-sm) var(--r-sm) 0; color:var(--ink-dim); }
.doc-body hr { border:0; border-top:1px solid var(--line); margin:24px 0; }

/* CTA block */
.cta-block {
  margin-top:36px; background:var(--green-700); color:#fff; border-radius:var(--r-lg);
  padding:24px 28px; display:flex; align-items:center; gap:20px; flex-wrap:wrap;
}
.cta-title { font-size:18px; font-weight:800; }
.cta-sub { font-size:13px; opacity:.85; margin-top:2px; }
.cta-block .btn-invert { margin-left:auto; }

/* draft banner */
.draft-banner {
  background:var(--warn-soft); color:var(--gold-ink); border:1px solid rgba(217,146,10,.25);
  border-radius:var(--r-sm); padding:10px 14px; font-size:12.5px; font-weight:600; margin-bottom:14px;
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}

/* admin */
.admin-head { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:16px; flex-wrap:wrap; gap:12px; }
.admin-head h1 { font-size:22px; font-weight:800; margin:0; }
.admin-actions { display:flex; gap:10px; }
.table-card { padding:0; overflow-x:auto; }
.table-card table { border-collapse:collapse; width:100%; }
.table-card th { padding:11px 14px; text-align:left; font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.8px; color:var(--mute); background:var(--bg-soft); }
.table-card td { padding:12px 14px; font-size:13px; border-top:1px solid var(--line); font-variant-numeric:tabular-nums; }
.table-card tr:hover td { background:var(--bg-hover); }
.td-actions { white-space:nowrap; display:flex; gap:6px; align-items:center; }
.f-label { display:block; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:1px; color:var(--mute); margin:14px 0 5px; }
.f-input { display:block; }
select.f-input { appearance:auto; }
.f-body { min-height:380px; line-height:1.5; }
.f-row2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.f-row3 { display:grid; grid-template-columns:1fr 1fr 90px; gap:10px; }
.f-submit { margin-top:18px; }
.login-card { max-width:380px; }
.login-card .btn-primary { margin-top:16px; }

/* footer */
.foot {
  margin-top:44px; padding-top:18px; border-top:1px solid var(--line);
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;
  font-size:12.5px; color:var(--mute);
}
.foot-links { display:flex; gap:16px; }
.foot-links a { color:var(--ink-dim); font-weight:600; }

/* responsive */
@media (max-width: 1150px) { .outline { display:none; } }
@media (max-width: 900px) {
  .side { display:none; }
  .content { padding:20px 16px 36px; }
  .topsearch { display:none; }
  .toplink { display:none; }
  .f-row2 { grid-template-columns:1fr; }
  .cta-block .btn-invert { margin-left:0; }
}
