/* Shared styling for live document viewers — matches the main site's design system. */
:root{
  --ink:#151F38;
  --ink-2:#1E2C4C;
  --paper:#F6F4EE;
  --paper-2:#EFEBE1;
  --brass:#B8863F;
  --brass-light:#D9AE6C;
  --teal:#2F6F62;
  --slate:#5B6478;
  --line:#DAD4C4;
  --line-dark:#33406A;
  --white:#FFFFFF;
  --radius:2px;
}
*{ box-sizing:border-box; }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'IBM Plex Sans', sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

/* ---------- TOP BAR ---------- */
.doc-bar{
  position:sticky; top:0; z-index:50;
  background:rgba(246,244,238,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.doc-bar-inner{
  max-width:1080px; margin:0 auto; padding:14px 32px;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
}
.doc-back{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.78rem; letter-spacing:0.06em;
  text-decoration:none; color:var(--slate);
  transition:color .15s; white-space:nowrap;
}
.doc-back:hover{ color:var(--brass); }
.doc-actions{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.doc-dl{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase;
  text-decoration:none; color:var(--ink);
  border:1px solid var(--line); border-radius:var(--radius);
  padding:8px 14px; background:var(--white);
  transition:border-color .15s, color .15s;
  white-space:nowrap;
}
.doc-dl:hover{ border-color:var(--brass); color:var(--brass); }

/* ---------- HEADER ---------- */
.doc-head{
  background:var(--ink); color:var(--paper);
  padding:56px 0 48px;
  border-bottom:1px solid var(--line-dark);
}
.doc-head .wrap{ max-width:1080px; margin:0 auto; padding:0 32px; }
.doc-eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.74rem; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--brass-light); margin-bottom:14px;
}
.doc-head h1{
  font-family:'Fraunces', serif; font-weight:600;
  font-size:clamp(1.7rem, 3.4vw, 2.5rem);
  line-height:1.15; margin:0 0 14px;
}
.doc-head p{ color:#B9C0D0; max-width:660px; margin:0; }

/* ---------- BODY ---------- */
.doc-body{ max-width:1080px; margin:0 auto; padding:52px 32px 88px; }
.doc-note{
  border-left:2px solid var(--brass);
  background:var(--paper-2);
  padding:16px 20px; margin:0 0 40px;
  font-size:0.92rem; color:var(--slate);
}
.doc-note strong{ color:var(--ink); }

.doc-content h2{
  font-family:'Fraunces', serif; font-weight:600;
  font-size:1.35rem; margin:48px 0 8px;
  padding-bottom:10px; border-bottom:1px solid var(--line);
}
.doc-content h2:first-child{ margin-top:0; }
.doc-content h3{ font-family:'Fraunces', serif; font-weight:600; font-size:1.12rem; margin:32px 0 8px; }
.doc-content p{ margin:0 0 14px; }
.doc-content em{ color:var(--slate); }

/* ---------- TABLES ---------- */
.doc-content table, .sheet table{
  width:100%; border-collapse:collapse;
  margin:16px 0 28px; font-size:0.9rem;
  background:var(--white);
  border:1px solid var(--line);
}
.doc-content th, .sheet th{
  text-align:left; vertical-align:bottom;
  background:var(--paper-2);
  font-family:'IBM Plex Mono', monospace;
  font-size:0.7rem; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--slate); font-weight:500;
  padding:10px 12px; border-bottom:1px solid var(--line);
  white-space:pre-line;
}
.doc-content td, .sheet td{
  padding:10px 12px; border-bottom:1px solid var(--line);
  vertical-align:top;
}
.doc-content tr:last-child td, .sheet tr:last-child td{ border-bottom:none; }
.doc-content td:not(:first-child){ color:var(--slate); }
.doc-content td:empty::after{ content:""; display:block; min-height:1.1em; }

/* ---------- SPREADSHEET VIEW ---------- */
.sheet{ margin:0 0 52px; }
.sheet-title{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.74rem; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--brass); margin-bottom:6px;
}
.sheet h2{
  font-family:'Fraunces', serif; font-weight:600;
  font-size:1.25rem; margin:0 0 4px;
  padding-bottom:10px; border-bottom:1px solid var(--line);
}
.sheet-sub{ font-size:0.9rem; color:var(--slate); margin:10px 0 0; }
.sheet-scroll{ overflow-x:auto; }
.sheet td.num{ text-align:right; font-variant-numeric:tabular-nums; color:var(--slate); }
.sheet tr.banner td{
  background:var(--ink); color:var(--paper);
  font-family:'Fraunces', serif; font-weight:600;
}
.truncated{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem; letter-spacing:0.06em;
  color:var(--slate); padding:12px 0 0;
}

/* ---------- FOOTER ---------- */
.doc-foot{
  background:var(--ink); color:#B9C0D0;
  padding:40px 0; text-align:center;
  font-size:0.88rem;
}
.doc-foot a{ color:var(--brass-light); text-decoration:none; }
.doc-foot a:hover{ text-decoration:underline; }

@media (max-width:640px){
  .doc-bar-inner, .doc-head .wrap{ padding-left:20px; padding-right:20px; }
  .doc-body{ padding:36px 20px 64px; }
  .doc-bar-inner{ flex-wrap:wrap; gap:12px; }
}
@media print{
  .doc-bar, .doc-foot, .doc-note{ display:none; }
  .doc-head{ background:none; color:var(--ink); border-bottom:1px solid var(--line); }
  .doc-head h1{ color:var(--ink); }
  body{ background:var(--white); }
}
