/* ════════════════════════════════════════════════════════════════
   COMPANION HEALTH — BRAND OPERATING SYSTEM (CH-BOS) v1.0
   The constitutional source of truth. Institutional manual system.
   Imports the canonical tokens + local brand fonts, then layers the
   document architecture: masthead, fixed volume index, clause typography.
   ════════════════════════════════════════════════════════════════ */
@import url('../colors_and_type.css');

:root{
  --bos-paper:#F4F2EB;
  --bos-paper-2:#ECEAE1;
  --bos-ink:#0A140C;
  --bos-ink-soft:#22341F;
  --bos-line:rgba(10,20,12,0.12);
  --bos-line-soft:rgba(10,20,12,0.07);
  --bos-green:#0E3E15;
  --bos-sage:#B1DAB9;
  --bos-steel:#B5CFD5;
  --bos-plum:#3E1033;
  --bos-black:#060C07;
  --bos-nav-w:300px;
  --bos-col:760px;
  --f-display:'Faire Octave','EB Garamond',Georgia,serif;
  --f-body:'Suisse Intl','Inter Tight',Helvetica,sans-serif;
  --f-mono:'Suisse Intl Mono','JetBrains Mono',monospace;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--f-body);
  background:var(--bos-paper);
  color:var(--bos-ink);
  font-size:16px;line-height:1.6;font-weight:400;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
::selection{background:var(--bos-sage);color:var(--bos-green);}
img{max-width:100%;display:block;}
.bos-menu-btn{display:none;}

/* ───────────────── LAYOUT ───────────────── */
.bos{display:grid;grid-template-columns:var(--bos-nav-w) 1fr;}

/* ───────────────── SIDEBAR / INDEX ───────────────── */
.bos-nav{
  position:sticky;top:0;height:100vh;overflow-y:auto;
  background:var(--bos-black);color:#fff;
  padding:34px 0 40px;
  border-right:1px solid rgba(177,218,185,0.14);
  scrollbar-width:thin;scrollbar-color:rgba(177,218,185,0.3) transparent;
}
.bos-nav::-webkit-scrollbar{width:7px;}
.bos-nav::-webkit-scrollbar-thumb{background:rgba(177,218,185,0.25);border-radius:4px;}
.bos-masthead{padding:0 26px 26px;border-bottom:1px solid rgba(177,218,185,0.14);margin-bottom:18px;}
.bos-masthead .mark{height:26px;margin-bottom:20px;opacity:0.96;}
.bos-masthead .doc-id{font-family:var(--f-mono);font-size:9.5px;letter-spacing:0.22em;text-transform:uppercase;color:var(--bos-sage);margin-bottom:10px;}
.bos-masthead .doc-title{font-family:var(--f-display);font-size:21px;line-height:1.08;letter-spacing:-0.01em;color:#fff;}
.bos-masthead .doc-sub{font-family:var(--f-mono);font-size:9px;letter-spacing:0.14em;text-transform:uppercase;color:rgba(255,255,255,0.42);margin-top:12px;line-height:1.7;}
.bos-masthead .doc-status{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font-family:var(--f-mono);font-size:9px;letter-spacing:0.16em;text-transform:uppercase;color:var(--bos-sage);}
.bos-masthead .doc-status::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--bos-sage);box-shadow:0 0 0 0 rgba(177,218,185,0.5);animation:bos-pulse 3s ease-out infinite;}
@keyframes bos-pulse{0%{box-shadow:0 0 0 0 rgba(177,218,185,0.4);}70%,100%{box-shadow:0 0 0 7px rgba(177,218,185,0);}}

.bos-toc{list-style:none;padding:0 14px;}
.bos-toc > li{margin-bottom:1px;}
.bos-toc .vol-link{
  display:grid;grid-template-columns:34px 1fr;align-items:baseline;gap:8px;
  padding:9px 12px;border-radius:3px;text-decoration:none;color:rgba(255,255,255,0.74);
  transition:background 0.15s ease,color 0.15s ease;
}
.bos-toc .vol-link:hover{background:rgba(177,218,185,0.07);color:#fff;}
.bos-toc .vol-link .vn{font-family:var(--f-mono);font-size:10px;letter-spacing:0.1em;color:var(--bos-sage);opacity:0.7;}
.bos-toc .vol-link .vt{font-family:var(--f-body);font-size:13.5px;font-weight:500;letter-spacing:-0.005em;line-height:1.25;}
.bos-toc .vol-link.active{background:rgba(177,218,185,0.12);color:#fff;}
.bos-toc .vol-link.active .vn{opacity:1;color:var(--bos-sage);}
.bos-toc .vol-link.active{box-shadow:inset 2px 0 0 var(--bos-sage);}
.bos-nav .nav-foot{padding:22px 26px 0;margin-top:18px;border-top:1px solid rgba(177,218,185,0.14);font-family:var(--f-mono);font-size:9px;letter-spacing:0.12em;text-transform:uppercase;color:rgba(255,255,255,0.34);line-height:1.9;}

/* ───────────────── CONTENT CANVAS ───────────────── */
.bos-main{min-width:0;background:var(--bos-paper);}
.vol{padding:0 0 0;border-bottom:1px solid var(--bos-line-soft);}
.vol-inner{max-width:var(--bos-col);margin:0 auto;padding:96px 56px 120px;}
.article + .article{margin-top:72px;}

/* ───────────────── VOLUME OPENER ───────────────── */
.vol-open{
  position:relative;background:var(--bos-black);color:#fff;overflow:hidden;
  padding:120px 56px 104px;
}
.vol-open .vo-inner{max-width:var(--bos-col);margin:0 auto;position:relative;z-index:1;}
.vol-open::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(177,218,185,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(177,218,185,0.05) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(ellipse 70% 90% at 78% 40%,#000 20%,transparent 76%);
  mask-image:radial-gradient(ellipse 70% 90% at 78% 40%,#000 20%,transparent 76%);
}
.vol-open .vo-num{font-family:var(--f-mono);font-size:12px;letter-spacing:0.34em;text-transform:uppercase;color:var(--bos-sage);display:flex;align-items:center;gap:14px;margin-bottom:30px;}
.vol-open .vo-num::after{content:"";flex:1;max-width:120px;height:1px;background:rgba(177,218,185,0.25);}
.vol-open .vo-title{font-family:var(--f-display);font-size:clamp(48px,7vw,96px);line-height:0.95;letter-spacing:-0.035em;color:#fff;font-weight:400;}
.vol-open .vo-title em{font-style:italic;color:var(--bos-sage);}
.vol-open .vo-desc{font-family:var(--f-body);font-size:18px;line-height:1.6;color:rgba(255,255,255,0.72);font-weight:300;max-width:54ch;margin-top:32px;}
.vol-open .vo-contents{margin-top:44px;padding-top:26px;border-top:1px solid rgba(177,218,185,0.16);display:flex;flex-wrap:wrap;gap:8px 10px;}
.vol-open .vo-contents .c{font-family:var(--f-mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:rgba(177,218,185,0.78);padding:5px 11px;border:1px solid rgba(177,218,185,0.22);border-radius:2px;}

/* ───────────────── ARTICLE TYPOGRAPHY ───────────────── */
.clause{font-family:var(--f-mono);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--bos-green);display:block;margin-bottom:16px;}
.art-title{font-family:var(--f-display);font-size:clamp(28px,3.4vw,40px);line-height:1.08;letter-spacing:-0.02em;color:var(--bos-ink);font-weight:400;margin-bottom:8px;}
.art-title em{font-style:italic;color:var(--bos-green);}
.art-lead{font-family:var(--f-display);font-size:22px;line-height:1.42;letter-spacing:-0.01em;color:var(--bos-ink-soft);font-weight:400;margin:22px 0 8px;text-wrap:pretty;}
.prose{font-family:var(--f-body);font-size:16px;line-height:1.72;color:#33442f;max-width:64ch;}
.prose + .prose{margin-top:18px;}
.prose strong{font-weight:600;color:var(--bos-ink);}
.prose code,.mono-inline{font-family:var(--f-mono);font-size:0.88em;background:rgba(177,218,185,0.2);color:var(--bos-green);padding:1px 6px;border-radius:2px;}
.sec-mark{font-family:var(--f-mono);font-size:10px;letter-spacing:0.16em;text-transform:uppercase;color:var(--ch-text-muted,#6A8A6E);margin:40px 0 16px;padding-bottom:8px;border-bottom:1px solid var(--bos-line);}

/* pull statement — constitutional voice */
.statement{margin:40px 0;padding:4px 0 4px 28px;border-left:2px solid var(--bos-green);}
.statement p{font-family:var(--f-display);font-size:26px;line-height:1.28;letter-spacing:-0.015em;color:var(--bos-ink);text-wrap:balance;}
.statement .src{font-family:var(--f-mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ch-text-muted,#6A8A6E);margin-top:14px;}

/* definition block */
.def{margin:28px 0;padding:24px 26px;background:#fff;border:1px solid var(--bos-line);border-radius:4px;}
.def .k{font-family:var(--f-mono);font-size:10px;letter-spacing:0.16em;text-transform:uppercase;color:var(--bos-green);margin-bottom:10px;}
.def .v{font-family:var(--f-display);font-size:24px;line-height:1.32;letter-spacing:-0.012em;color:var(--bos-ink);}

/* ───────────────── APPROVED / FORBIDDEN ───────────────── */
.rules{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:28px 0;}
.rules .col{background:#fff;border:1px solid var(--bos-line);border-radius:4px;padding:20px 22px;}
.rules .col h4{font-family:var(--f-mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--bos-line-soft);font-weight:400;}
.rules .approved h4{color:var(--bos-green);}
.rules .forbidden h4{color:var(--ch-risk-hi,#C0392B);}
.rules ul{list-style:none;}
.rules li{font-size:14px;line-height:1.5;color:#33442f;padding:8px 0;border-bottom:1px solid var(--bos-line-soft);display:flex;gap:10px;}
.rules li:last-child{border-bottom:none;}
.rules .approved li::before{content:"✓";color:var(--bos-green);font-weight:600;}
.rules .forbidden li::before{content:"✕";color:var(--ch-risk-hi,#C0392B);font-weight:600;}

/* ───────────────── TOKEN TABLE ───────────────── */
.tbl{width:100%;border-collapse:collapse;margin:24px 0;font-size:14px;}
.tbl th{font-family:var(--f-mono);font-size:9.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ch-text-muted,#6A8A6E);text-align:left;padding:10px 14px;border-bottom:1px solid var(--bos-line);font-weight:400;}
.tbl td{padding:11px 14px;border-bottom:1px solid var(--bos-line-soft);color:#33442f;vertical-align:middle;}
.tbl td.mono,.tbl td .mono{font-family:var(--f-mono);font-size:12.5px;color:var(--bos-green);}
.tbl tr:hover td{background:rgba(177,218,185,0.06);}
.sw{display:inline-block;width:18px;height:18px;border-radius:3px;vertical-align:middle;margin-right:9px;border:1px solid var(--bos-line);}

/* ───────────────── SWATCH GRID ───────────────── */
.swatches{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:24px 0;}
.swatch{height:96px;border-radius:4px;border:1px solid var(--bos-line);display:flex;flex-direction:column;justify-content:flex-end;padding:12px;position:relative;overflow:hidden;}
.swatch .nm{font-size:10px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;line-height:1.3;}
.swatch .hx{font-family:var(--f-mono);font-size:10.5px;opacity:0.82;margin-top:3px;}

/* ───────────────── TYPE SPECIMEN ───────────────── */
.specimen{background:#fff;border:1px solid var(--bos-line);border-radius:4px;padding:30px 32px;margin:24px 0;}
.specimen + .specimen{margin-top:14px;}
.specimen .meta{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px;margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid var(--bos-line-soft);}
.specimen .meta .role{font-family:var(--f-mono);font-size:10px;letter-spacing:0.16em;text-transform:uppercase;color:var(--bos-green);}
.specimen .meta .spec{font-family:var(--f-mono);font-size:10px;letter-spacing:0.08em;color:var(--ch-text-muted,#6A8A6E);}
.specimen .sample-display{font-family:var(--f-display);font-size:46px;line-height:1.04;letter-spacing:-0.025em;color:var(--bos-ink);}
.specimen .sample-body{font-family:var(--f-body);font-size:18px;line-height:1.6;color:var(--bos-ink-soft);font-weight:300;}
.specimen .sample-mono{font-family:var(--f-mono);font-size:15px;letter-spacing:0.02em;color:var(--bos-green);}

/* ───────────────── LOGO WALL ───────────────── */
.logo-wall{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0;}
.logo-cell{border:1px solid var(--bos-line);border-radius:4px;padding:34px 30px;display:flex;align-items:center;justify-content:center;min-height:120px;position:relative;}
.logo-cell.light{background:#fff;}
.logo-cell.dark{background:var(--bos-black);}
.logo-cell.sage{background:var(--bos-sage);}
.logo-cell.plum{background:var(--bos-plum);}
.logo-cell img{max-height:38px;width:auto;}
.logo-cell .tag{position:absolute;top:11px;left:13px;font-family:var(--f-mono);font-size:8.5px;letter-spacing:0.12em;text-transform:uppercase;}
.logo-cell.light .tag{color:var(--ch-text-muted,#6A8A6E);}
.logo-cell.dark .tag,.logo-cell.plum .tag{color:rgba(177,218,185,0.6);}
.logo-cell.sage .tag{color:var(--bos-green);}

/* clear-space / minimum diagram */
.spec-note{font-family:var(--f-mono);font-size:11px;line-height:1.7;color:var(--ch-text-muted,#6A8A6E);margin-top:10px;}

/* ───────────────── DIAGRAM EXHIBIT ───────────────── */
.exhibit{margin:28px 0;background:#FAF9F4;border:1px solid var(--bos-line);border-radius:4px;overflow:hidden;}
.exhibit .ex-bar{display:flex;justify-content:space-between;align-items:center;padding:11px 18px;border-bottom:1px solid var(--bos-line-soft);font-family:var(--f-mono);font-size:10px;letter-spacing:0.12em;text-transform:uppercase;}
.exhibit .ex-bar .id{color:var(--bos-green);}
.exhibit .ex-bar .nm{color:var(--ch-text-muted,#6A8A6E);}
.exhibit img{width:100%;background:var(--bos-paper);}

/* ───────────────── SPECIMEN: COMPONENT FRAMES ───────────────── */
.frame{margin:24px 0;border:1px solid var(--bos-line);border-radius:4px;overflow:hidden;}
.frame .fr-bar{padding:10px 16px;border-bottom:1px solid var(--bos-line-soft);font-family:var(--f-mono);font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ch-text-muted,#6A8A6E);background:#fff;}
.frame .fr-body{padding:28px 30px;background:var(--bos-paper-2);display:flex;flex-wrap:wrap;gap:14px;align-items:center;}
.frame .fr-body.dark{background:var(--bos-black);}
.frame .fr-body.col{flex-direction:column;align-items:stretch;}

/* component recreations */
.k-btn{font-family:var(--f-body);font-size:12px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;padding:10px 24px;border-radius:4px;border:none;cursor:default;}
.k-btn.primary{background:var(--bos-green);color:#fff;}
.k-btn.sage{background:var(--bos-sage);color:var(--bos-green);}
.k-btn.ghost{background:transparent;color:#6A8A6E;border:1px solid var(--bos-line);}
.k-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:2px;font-family:var(--f-body);font-size:10px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;}
.k-badge.low{background:rgba(39,174,96,0.1);color:#27AE60;border:1px solid rgba(39,174,96,0.25);}
.k-badge.mod{background:rgba(230,126,34,0.1);color:#E67E22;border:1px solid rgba(230,126,34,0.25);}
.k-badge.hi{background:rgba(192,57,43,0.1);color:#C0392B;border:1px solid rgba(192,57,43,0.25);}
.k-badge.sage{background:rgba(177,218,185,0.16);color:#0E3E15;border:1px solid rgba(177,218,185,0.4);}
.k-dot{width:7px;height:7px;border-radius:50%;display:inline-block;}

/* signal card recreation */
.k-signal{background:#fff;border:1px solid var(--bos-line);border-radius:4px;padding:18px 20px;width:260px;}
.k-signal .h{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.k-signal .lab{font-family:var(--f-mono);font-size:9px;letter-spacing:0.14em;text-transform:uppercase;color:#6A8A6E;}
.k-signal .score{font-family:var(--f-body);font-size:42px;font-weight:300;color:#C0392B;line-height:1;}
.k-signal .score small{font-size:14px;color:#6A8A6E;}
.k-signal .bar{height:4px;background:#E6E5DF;border-radius:2px;margin:14px 0 10px;overflow:hidden;}
.k-signal .bar i{display:block;height:100%;width:72%;background:#C0392B;border-radius:2px;}
.k-signal .meta{font-family:var(--f-mono);font-size:10px;color:#6A8A6E;letter-spacing:0.04em;}

/* api panel recreation */
.k-api{background:var(--bos-black);border:1px solid rgba(177,218,185,0.14);border-radius:4px;padding:18px 20px;font-family:var(--f-mono);font-size:12px;line-height:1.9;color:rgba(177,218,185,0.72);width:100%;}
.k-api .v{color:var(--bos-sage);}
.k-api .s{color:#D4EEDA;}
.k-api .c{color:rgba(177,218,185,0.4);}

/* topbar recreation */
.k-topbar{width:100%;background:var(--bos-black);border:1px solid rgba(177,218,185,0.14);border-radius:4px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;height:54px;}
.k-topbar .l{display:flex;align-items:center;gap:16px;}
.k-topbar .brand{font-family:var(--f-display);font-size:17px;color:#fff;}
.k-topbar .lens{display:flex;gap:4px;}
.k-topbar .lens span{font-family:var(--f-mono);font-size:9px;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.5);padding:5px 10px;border-radius:2px;}
.k-topbar .lens span.on{background:rgba(177,218,185,0.14);color:var(--bos-sage);}
.k-topbar .r{font-family:var(--f-mono);font-size:9px;letter-spacing:0.14em;text-transform:uppercase;color:var(--bos-sage);display:flex;align-items:center;gap:7px;}
.k-topbar .r::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--bos-sage);}

/* ───────────────── DIAGRAM VOCAB (mini svg specimens) ───────────────── */
.vocab{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0;}
.vocab .v-cell{background:#FAF9F4;border:1px solid var(--bos-line);border-radius:4px;padding:18px;}
.vocab .v-cell .nm{font-family:var(--f-mono);font-size:9.5px;letter-spacing:0.12em;text-transform:uppercase;color:var(--bos-green);margin-bottom:12px;}
.vocab .v-cell svg{width:100%;height:64px;display:block;}
.vocab .v-cell .ds{font-size:11.5px;line-height:1.45;color:#6A8A6E;margin-top:12px;}

/* ───────────────── AMENDMENT LOG ───────────────── */
.ledger{width:100%;border-collapse:collapse;margin:24px 0;font-size:13.5px;}
.ledger th{font-family:var(--f-mono);font-size:9.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ch-text-muted,#6A8A6E);text-align:left;padding:11px 14px;border-bottom:2px solid var(--bos-ink);font-weight:400;}
.ledger td{padding:13px 14px;border-bottom:1px solid var(--bos-line-soft);color:#33442f;vertical-align:top;}
.ledger td.ver{font-family:var(--f-mono);font-size:12px;color:var(--bos-green);white-space:nowrap;}
.ledger td.sev{font-family:var(--f-mono);font-size:9px;letter-spacing:0.1em;text-transform:uppercase;}

/* severity chips */
.sev-chip{display:inline-block;font-family:var(--f-mono);font-size:9px;letter-spacing:0.1em;text-transform:uppercase;padding:3px 9px;border-radius:2px;}
.sev-minor{background:rgba(177,218,185,0.2);color:var(--bos-green);}
.sev-major{background:rgba(230,126,34,0.14);color:#B5651D;}
.sev-const{background:rgba(62,16,51,0.1);color:var(--bos-plum);}

/* ───────────────── PILLAR / FLOW STRIP ───────────────── */
.flowstrip{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:24px 0;}
.flowstrip .node{font-family:var(--f-mono);font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--bos-green);background:#fff;border:1px solid var(--bos-line);border-radius:3px;padding:9px 14px;}
.flowstrip .arr{color:#9AB09E;font-size:14px;}

/* asset inventory grid */
.inventory{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:24px 0;}
.inv-item{background:#fff;border:1px solid var(--bos-line);border-radius:4px;padding:18px 20px;}
.inv-item .it{font-family:var(--f-display);font-size:19px;letter-spacing:-0.01em;color:var(--bos-ink);margin-bottom:4px;}
.inv-item .ip{font-family:var(--f-mono);font-size:10px;letter-spacing:0.04em;color:var(--bos-green);margin-bottom:8px;}
.inv-item .id2{font-size:13px;line-height:1.5;color:#6A8A6E;}
.inv-item .stat{display:inline-block;margin-top:10px;font-family:var(--f-mono);font-size:9px;letter-spacing:0.1em;text-transform:uppercase;color:var(--bos-green);border:1px solid rgba(14,62,21,0.25);border-radius:2px;padding:3px 8px;}

/* ───────────────── FRONT MATTER / COVER ───────────────── */
.bos-cover{position:relative;background:var(--bos-black);color:#fff;overflow:hidden;padding:120px 56px 96px;}
.bos-cover::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(177,218,185,0.055) 1px,transparent 1px),linear-gradient(90deg,rgba(177,218,185,0.055) 1px,transparent 1px);background-size:60px 60px;-webkit-mask-image:radial-gradient(ellipse 80% 80% at 70% 35%,#000 25%,transparent 78%);mask-image:radial-gradient(ellipse 80% 80% at 70% 35%,#000 25%,transparent 78%);}
.bos-cover .cv-inner{max-width:var(--bos-col);margin:0 auto;position:relative;z-index:1;}
.bos-cover .cv-kicker{font-family:var(--f-mono);font-size:12px;letter-spacing:0.3em;text-transform:uppercase;color:var(--bos-sage);margin-bottom:40px;display:flex;align-items:center;gap:14px;}
.bos-cover .cv-kicker::after{content:"";flex:1;max-width:140px;height:1px;background:rgba(177,218,185,0.25);}
.bos-cover h1{font-family:var(--f-display);font-size:clamp(54px,8vw,108px);line-height:0.92;letter-spacing:-0.04em;font-weight:400;}
.bos-cover h1 em{font-style:italic;color:var(--bos-sage);}
.bos-cover .cv-sub{font-family:var(--f-body);font-size:20px;line-height:1.5;color:rgba(255,255,255,0.74);font-weight:300;max-width:48ch;margin-top:34px;}
.bos-cover .cv-meta{margin-top:56px;padding-top:28px;border-top:1px solid rgba(177,218,185,0.18);display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.bos-cover .cv-meta .m .k{font-family:var(--f-mono);font-size:9px;letter-spacing:0.14em;text-transform:uppercase;color:rgba(177,218,185,0.6);margin-bottom:7px;}
.bos-cover .cv-meta .m .v{font-family:var(--f-mono);font-size:13px;color:#fff;letter-spacing:0.02em;}

/* preamble panel */
.preamble{max-width:var(--bos-col);margin:0 auto;padding:80px 56px;}
.preamble .pre-statement{font-family:var(--f-display);font-size:clamp(26px,3vw,34px);line-height:1.3;letter-spacing:-0.016em;color:var(--bos-ink);text-wrap:pretty;}
.preamble .pre-statement em{font-style:italic;color:var(--bos-green);}

/* how to read grid */
.htr{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px;}
.htr .cell{padding:20px 0 0;border-top:2px solid var(--bos-ink);}
.htr .cell .n{font-family:var(--f-mono);font-size:11px;letter-spacing:0.12em;color:var(--bos-green);margin-bottom:10px;}
.htr .cell .h{font-family:var(--f-display);font-size:19px;letter-spacing:-0.01em;color:var(--bos-ink);margin-bottom:8px;}
.htr .cell .d{font-size:13.5px;line-height:1.55;color:#6A8A6E;}

/* ───────────────── BOS CONSTITUTIONAL STATUS (Level 1/2/3) ───────────────── */
.levels{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:28px 0;}
.level{background:#fff;border:1px solid var(--bos-line);border-radius:4px;padding:22px 22px 24px;border-top:3px solid var(--bos-line);position:relative;}
.level.l1{border-top-color:var(--bos-green);}
.level.l2{border-top-color:var(--bos-steel);}
.level.l3{border-top-color:var(--ch-text-light,#9AB09E);}
.level .lv-tag{font-family:var(--f-mono);font-size:9.5px;letter-spacing:0.16em;text-transform:uppercase;color:var(--ch-text-muted,#6A8A6E);margin-bottom:8px;}
.level .lv-name{font-family:var(--f-display);font-size:22px;letter-spacing:-0.012em;color:var(--bos-ink);margin-bottom:14px;}
.level .lv-list{list-style:none;}
.level .lv-list li{font-size:13px;line-height:1.4;color:#33442f;padding:6px 0;border-bottom:1px solid var(--bos-line-soft);}
.level .lv-list li:last-child{border-bottom:none;}
.level .lv-gate{margin-top:16px;font-family:var(--f-mono);font-size:9.5px;letter-spacing:0.1em;text-transform:uppercase;padding:7px 11px;border-radius:2px;display:inline-block;}
.level.l1 .lv-gate{background:rgba(14,62,21,0.1);color:var(--bos-green);}
.level.l2 .lv-gate{background:rgba(181,207,213,0.28);color:#3A5560;}
.level.l3 .lv-gate{background:rgba(154,176,158,0.2);color:#52684f;}

/* ───────────────── THREE LAYERS (Companion / Fetch / Consumers) ───────────────── */
.layers3{display:flex;flex-direction:column;gap:2px;margin:28px 0;border:1px solid var(--bos-line);border-radius:4px;overflow:hidden;}
.layer3{display:grid;grid-template-columns:150px 1fr;gap:24px;padding:24px 26px;background:#fff;align-items:baseline;}
.layer3.companion{background:var(--bos-green);color:#fff;}
.layer3.fetch{background:var(--bos-plum);color:#fff;}
.layer3.consumers{background:var(--bos-paper-2);}
.layer3 .ly-id{font-family:var(--f-mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;opacity:0.7;}
.layer3.companion .ly-id,.layer3.fetch .ly-id{color:var(--bos-sage);opacity:0.9;}
.layer3 .ly-name{font-family:var(--f-display);font-size:26px;letter-spacing:-0.014em;margin-bottom:6px;}
.layer3 .ly-role{font-size:14px;line-height:1.55;}
.layer3.companion .ly-role,.layer3.fetch .ly-role{color:rgba(255,255,255,0.78);}
.layer3.consumers .ly-role{color:#33442f;}

/* ───────────────── FIGURE LIBRARY — figures as products ───────────────── */
.figlib{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:28px 0;}
.figcard{background:#fff;border:1px solid var(--bos-line);border-radius:4px;overflow:hidden;display:flex;flex-direction:column;}
.figcard .fc-img{background:var(--bos-paper);border-bottom:1px solid var(--bos-line-soft);}
.figcard .fc-img img{width:100%;}
.figcard .fc-meta{padding:16px 18px 18px;}
.figcard .fc-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:4px;}
.figcard .fc-id{font-family:var(--f-mono);font-size:11px;letter-spacing:0.1em;color:var(--bos-green);}
.figcard .fc-status{font-family:var(--f-mono);font-size:9px;letter-spacing:0.1em;text-transform:uppercase;padding:3px 8px;border-radius:2px;background:rgba(14,62,21,0.1);color:var(--bos-green);}
.figcard .fc-status.draft{background:rgba(230,126,34,0.14);color:#B5651D;}
.figcard .fc-name{font-family:var(--f-display);font-size:21px;letter-spacing:-0.012em;color:var(--bos-ink);margin-bottom:12px;}
.figcard .fc-rows{display:grid;grid-template-columns:auto 1fr;gap:5px 14px;}
.figcard .fc-rows .k{font-family:var(--f-mono);font-size:9px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ch-text-light,#9AB09E);padding-top:2px;}
.figcard .fc-rows .v{font-family:var(--f-mono);font-size:11px;color:#33442f;line-height:1.6;}
.figcard.placeholder{align-items:center;justify-content:center;border-style:dashed;min-height:200px;background:repeating-linear-gradient(45deg,#fff,#fff 10px,#FAF9F4 10px,#FAF9F4 20px);}
.figcard.placeholder .ph{font-family:var(--f-mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ch-text-light,#9AB09E);text-align:center;padding:28px;line-height:1.8;}

/* ───────────────── REPOSITORY TREE ───────────────── */
.repo{background:var(--bos-black);border:1px solid rgba(177,218,185,0.14);border-radius:4px;padding:26px 28px;margin:28px 0;font-family:var(--f-mono);font-size:13px;line-height:1.95;color:rgba(255,255,255,0.84);overflow-x:auto;}
.repo .dir{color:var(--bos-sage);}
.repo .cmt{color:rgba(177,218,185,0.45);}
.repo .root{color:#fff;font-weight:500;}
.repo-defs{margin-top:24px;}
.repo-defs .rd{display:grid;grid-template-columns:170px 1fr;gap:20px;padding:13px 0;border-bottom:1px solid var(--bos-line-soft);align-items:baseline;}
.repo-defs .rd .p{font-family:var(--f-mono);font-size:12.5px;color:var(--bos-green);}
.repo-defs .rd .w{font-size:14px;line-height:1.5;color:#33442f;}

/* thesis block */
.thesis{margin:28px 0;padding:28px 30px;background:var(--bos-black);color:#fff;border-radius:4px;position:relative;overflow:hidden;}
.thesis .th-k{font-family:var(--f-mono);font-size:10px;letter-spacing:0.18em;text-transform:uppercase;color:var(--bos-sage);margin-bottom:14px;}
.thesis .th-v{font-family:var(--f-display);font-size:27px;line-height:1.28;letter-spacing:-0.014em;color:#fff;text-wrap:pretty;}
.thesis .th-v em{font-style:italic;color:var(--bos-sage);}

/* ───────────────── SIGNAL LAYER ARTIFACT CALLOUT ───────────────── */
.artifact{margin:28px 0;display:grid;grid-template-columns:1fr;gap:0;border:1px solid var(--bos-line);border-radius:4px;overflow:hidden;background:#fff;}
.artifact .af-head{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--bos-line-soft);}
.artifact .af-head .t{font-family:var(--f-display);font-size:20px;letter-spacing:-0.012em;color:var(--bos-ink);}
.artifact .af-head .lvl{font-family:var(--f-mono);font-size:9px;letter-spacing:0.12em;text-transform:uppercase;color:var(--bos-green);border:1px solid rgba(14,62,21,0.25);border-radius:2px;padding:4px 9px;}
.artifact .af-body{padding:18px 20px;font-size:14px;line-height:1.6;color:#33442f;}
.artifact .af-link{display:inline-block;margin-top:12px;font-family:var(--f-mono);font-size:11px;letter-spacing:0.06em;color:var(--bos-green);text-decoration:none;border-bottom:1px solid rgba(14,62,21,0.3);padding-bottom:2px;}
.artifact .af-link:hover{color:var(--bos-ink);}

/* ───────────────── RESPONSIVE ───────────────── */
@media(max-width:1100px){
  :root{--bos-col:100%;}
  .vol-inner,.vol-open,.preamble,.bos-cover{padding-left:40px;padding-right:40px;}
}
@media(max-width:880px){
  .bos{grid-template-columns:1fr;}
  .bos-nav{position:fixed;left:0;top:0;width:84%;max-width:320px;z-index:200;transform:translateX(-100%);transition:transform 0.25s ease;}
  .bos-nav.open{transform:translateX(0);}
  .bos-menu-btn{display:flex;align-items:center;gap:9px;position:fixed;top:14px;left:14px;z-index:210;background:var(--bos-black);color:#fff;border:1px solid rgba(177,218,185,0.3);border-radius:4px;padding:10px 14px;font-family:var(--f-mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;cursor:pointer;}
  .bos-main{padding-top:0;}
  .rules,.htr,.vocab,.swatches,.logo-wall,.inventory,.bos-cover .cv-meta{grid-template-columns:1fr;}
  .vol-inner,.vol-open,.preamble,.bos-cover{padding-left:22px;padding-right:22px;}
  .bos-cover .cv-meta{grid-template-columns:1fr 1fr;}
}

/* ───────────────── PRINT ───────────────── */
@media print{
  .bos{display:block;}
  .bos-nav,.bos-menu-btn{display:none;}
  .bos-main{background:#fff;}
  .vol-open,.bos-cover{-webkit-print-color-adjust:exact;print-color-adjust:exact;page-break-before:always;}
  .swatch,.logo-cell.dark,.logo-cell.sage,.logo-cell.plum,.k-api,.k-topbar,.vol-open,.bos-cover,.sev-chip,.k-badge,.k-btn{-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .vol-inner,.preamble{padding:24px 0;}
  .article{page-break-inside:avoid;}
  body{font-size:11pt;}
  /* mesh demos: freeze + keep whole on the page */
  .mesh-stage,.mesh-cell{break-inside:avoid;page-break-inside:avoid;height:200px;}
  companion-mesh canvas{animation:none !important;}
}

/* ───────────────── VOL 02.5 — INTELLIGENCE MESH DEMOS ───────────────── */
.mesh-stage{position:relative;height:300px;margin:28px 0;border:1px solid var(--bos-line);border-radius:6px;overflow:hidden;background:#060C07;}
.mesh-stage-label{position:absolute;left:18px;bottom:14px;z-index:2;font-family:var(--f-mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:rgba(177,218,185,0.8);}
.mesh-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0;}
.mesh-cell{position:relative;height:220px;border:1px solid var(--bos-line);border-radius:6px;overflow:hidden;background:#060C07;}
.mesh-tag{position:absolute;left:14px;bottom:12px;z-index:2;font-family:var(--f-mono);font-size:9.5px;letter-spacing:0.12em;text-transform:uppercase;color:rgba(177,218,185,0.75);}
.meshgrad-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:24px 0;}
.meshgrad{position:relative;height:130px;border-radius:5px;border:1px solid var(--bos-line);overflow:hidden;}
.meshgrad .mg-l{position:absolute;left:11px;bottom:10px;font-family:var(--f-mono);font-size:10px;letter-spacing:0.12em;text-transform:uppercase;}
@media(max-width:880px){ .mesh-grid,.meshgrad-grid{grid-template-columns:1fr 1fr;} }

/* ═══════════════ v4.0 CONSTITUTIONAL COMPONENTS ═══════════════ */

/* constitutional system map — one diagram that explains the BOS */
.constmap{margin:30px 0;padding:34px 28px;background:var(--bos-black);border-radius:6px;color:#fff;position:relative;overflow:hidden;}
.constmap .cm-root{text-align:center;font-family:var(--f-mono);font-size:11px;letter-spacing:0.24em;text-transform:uppercase;color:var(--bos-sage);padding:9px 0;border:1px solid rgba(177,218,185,0.3);border-radius:3px;max-width:230px;margin:0 auto 6px;}
.constmap .cm-stem{width:1px;height:22px;background:rgba(177,218,185,0.35);margin:0 auto;}
.constmap .cm-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(177,218,185,0.16);border:1px solid rgba(177,218,185,0.16);border-radius:4px;overflow:hidden;}
.constmap .cm-col{background:var(--bos-black);padding:0 0 18px;}
.constmap .cm-col .cm-h{font-family:var(--f-display);font-size:19px;letter-spacing:-0.01em;color:#fff;text-align:center;padding:16px 0 14px;border-bottom:1px solid rgba(177,218,185,0.14);}
.constmap .cm-col .cm-h em{font-style:italic;color:var(--bos-sage);}
.constmap .cm-step{font-family:var(--f-mono);font-size:11px;letter-spacing:0.06em;color:rgba(255,255,255,0.78);text-align:center;padding:11px 8px;border-bottom:1px solid rgba(177,218,185,0.07);}
.constmap .cm-foot{margin-top:18px;text-align:center;font-family:var(--f-mono);font-size:10px;letter-spacing:0.2em;text-transform:uppercase;color:var(--bos-sage);padding-top:16px;border-top:1px solid rgba(177,218,185,0.2);}

/* the Companion Signature — five marks of recognition */
.signature{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;background:var(--bos-line);border:1px solid var(--bos-line);border-radius:5px;overflow:hidden;margin:28px 0;}
.sig-cell{background:#fff;padding:22px 18px;display:flex;flex-direction:column;gap:12px;}
.sig-cell .sig-n{font-family:var(--f-mono);font-size:10px;letter-spacing:0.14em;color:var(--bos-green);}
.sig-cell .sig-viz{height:46px;display:flex;align-items:center;justify-content:center;}
.sig-cell .sig-viz svg{width:100%;height:46px;}
.sig-cell .sig-name{font-family:var(--f-display);font-size:17px;letter-spacing:-0.01em;color:var(--bos-ink);line-height:1.1;}
.sig-cell .sig-d{font-size:11.5px;line-height:1.45;color:#6A8A6E;}
@media(max-width:1150px){ .signature{grid-template-columns:repeat(2,minmax(0,1fr));} .constmap .cm-cols{grid-template-columns:1fr;} }

/* decision framework — five constitutional gates */
.decframe{margin:26px 0;border:2px solid var(--bos-ink);border-radius:6px;overflow:hidden;}
.decframe .df-q{display:grid;grid-template-columns:46px 1fr;gap:0;border-bottom:1px solid var(--bos-line-soft);align-items:center;}
.decframe .df-q:last-child{border-bottom:none;}
.decframe .df-n{font-family:var(--f-mono);font-size:12px;color:var(--bos-green);text-align:center;padding:16px 0;border-right:1px solid var(--bos-line-soft);align-self:stretch;display:flex;align-items:center;justify-content:center;}
.decframe .df-t{font-family:var(--f-display);font-size:19px;letter-spacing:-0.012em;color:var(--bos-ink);padding:14px 18px;}
.decframe .df-rule{background:var(--bos-green);color:#fff;font-family:var(--f-mono);font-size:11px;letter-spacing:0.1em;text-transform:uppercase;padding:14px 18px;text-align:center;}

/* corporate / product architecture tree */
.corptree{margin:28px 0;padding:30px 24px;background:var(--bos-paper-2);border:1px solid var(--bos-line);border-radius:6px;text-align:center;}
.corptree .ct-l1{font-family:var(--f-mono);font-size:10px;letter-spacing:0.16em;text-transform:uppercase;color:var(--ch-text-muted,#6A8A6E);}
.corptree .ct-l2{font-family:var(--f-display);font-size:30px;letter-spacing:-0.02em;color:var(--bos-green);margin:6px 0;}
.corptree .ct-stem{width:1px;height:20px;background:var(--bos-line);margin:4px auto;}
.corptree .ct-children{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:4px;}
.corptree .ct-child{font-family:var(--f-mono);font-size:11px;letter-spacing:0.04em;color:var(--bos-ink);background:#fff;border:1px solid var(--bos-line);border-radius:3px;padding:9px 14px;}
.corptree .ct-child.ghost{color:var(--ch-text-light,#9AB09E);border-style:dashed;}

/* Companion States — the eight-state lifecycle */
.lifecycle{display:flex;flex-wrap:wrap;gap:0;align-items:stretch;margin:24px 0;border:1px solid var(--bos-line);border-radius:5px;overflow:hidden;}
.lifecycle .ls{flex:1 1 0;min-width:118px;background:#fff;padding:16px 14px;border-right:1px solid var(--bos-line-soft);position:relative;}
.lifecycle .ls:last-child{border-right:none;}
.lifecycle .ls .ls-n{font-family:var(--f-mono);font-size:9px;letter-spacing:0.12em;color:var(--ch-text-light,#9AB09E);}
.lifecycle .ls .ls-s{font-family:var(--f-display);font-size:17px;letter-spacing:-0.01em;color:var(--bos-ink);margin-top:6px;}
.lifecycle .ls .ls-d{font-size:11px;line-height:1.4;color:#6A8A6E;margin-top:6px;}
.lifecycle .ls.terminal{background:var(--bos-green);}
.lifecycle .ls.terminal .ls-n{color:rgba(177,218,185,0.7);}
.lifecycle .ls.terminal .ls-s{color:#fff;}
.lifecycle .ls.terminal .ls-d{color:rgba(255,255,255,0.75);}

/* figure metadata table inside figcards */
.figmeta{margin-top:10px;padding-top:10px;border-top:1px solid var(--bos-line-soft);display:grid;grid-template-columns:auto 1fr;gap:3px 12px;}
.figmeta .mk{font-family:var(--f-mono);font-size:8.5px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ch-text-light,#9AB09E);}
.figmeta .mv{font-family:var(--f-mono);font-size:10px;color:#33442f;line-height:1.5;}

/* diagram characteristics — proprietary signature list */
.charlist{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:24px 0;}
.charlist .ch{background:#fff;border:1px solid var(--bos-line);border-radius:4px;padding:15px 17px;}
.charlist .ch .ch-h{font-family:var(--f-mono);font-size:9.5px;letter-spacing:0.12em;text-transform:uppercase;color:var(--bos-green);margin-bottom:5px;}
.charlist .ch .ch-d{font-size:13px;line-height:1.5;color:#33442f;}
@media(max-width:880px){ .charlist{grid-template-columns:1fr;} .lifecycle .ls{min-width:46%;} }