/* Beatty Outpost site chrome (tokens, masthead, nav) — extracted from the live homepage stylesheet 2026-09-07 for /read/. */
:root{
  --paper:#F6EFE1;
  --paper-deep:#EFE5D0;
  --paper-card:#FBF6EA;
  --ink:#22242B;
  --ink-soft:#4A4C55;
  --ink-faint:#75767E;
  --red:#A6231C;
  --red-deep:#7E1812;
  --navy:#1E3A5F;
  --navy-deep:#152C4A;
  --gold:#C29A3B;
  --gold-bright:#D9B254;
  --sunset:#C9622B;
  --rule:rgba(34,36,43,.28);
  --rule-soft:rgba(34,36,43,.14);
  --slab:'Bitter',Georgia,serif;
  --franklin:'Libre Franklin',Helvetica,Arial,sans-serif;
  --serif:'Source Serif 4',Georgia,serif;
  --s1:.25rem; --s2:.5rem; --s3:.75rem; --s4:1rem; --s5:1.5rem;
  --s6:2rem;  --s7:3rem;  --s8:4.5rem;
  --maxw:1180px;
}
html{scroll-behavior:smooth}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--serif);
  font-size:1.0625rem;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:2000;
  opacity:.05;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--s5)}
.topbar{
  background:var(--navy);color:#EDE6D4;
  font-family:var(--franklin);font-size:.74rem;font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;
}
.topbar .wrap{
  display:flex;align-items:center;justify-content:space-between;
  gap:var(--s4);padding-top:.45rem;padding-bottom:.45rem;
}
.topbar .star{color:var(--gold-bright);margin:0 .45em}
.topbar-mid{text-align:center}
.topbar-right{text-align:right}
html{scroll-behavior:smooth}
@media(max-width:920px){.topbar-mid{display:none}}
@media(max-width:760px){.topbar .wrap{font-size:.68rem;flex-wrap:wrap;justify-content:center;text-align:center;gap:.15rem .9rem}.topbar-right{text-align:center}}
.masthead{
  border-bottom:3px double var(--rule);
  background:
    linear-gradient(180deg,rgba(194,154,59,.07),rgba(194,154,59,0) 55%),
    var(--paper);
}
.masthead-img{
  margin:0 auto;max-width:min(920px,100%);height:auto;display:block;
}
.masthead-folio{
  display:flex;justify-content:space-between;align-items:baseline;
  max-width:920px;margin:.65rem auto 0;
  font-family:var(--franklin);font-size:.74rem;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);
  border-top:1px solid var(--rule-soft);padding-top:.5rem;
}
@media(max-width:920px){.masthead-folio{flex-direction:column;gap:.2rem;text-align:center;align-items:center}}
.nav{
  position:sticky;top:0;z-index:900;
  background:var(--paper);
  border-bottom:1px solid var(--rule);
  box-shadow:0 1px 0 rgba(255,255,255,.5);
}
.nav .wrap{display:flex;align-items:stretch;justify-content:center;gap:0}
.nav a.navlink{
  font-family:var(--franklin);font-weight:700;font-size:.83rem;
  letter-spacing:.1em;text-transform:uppercase;text-decoration:none;
  padding:.85rem 1.1rem;color:var(--ink);
  border-left:1px solid var(--rule-soft);
  position:relative;transition:color .18s;
}
.nav a.navlink:last-of-type{border-right:1px solid var(--rule-soft)}
.nav a.navlink::after{
  content:"";position:absolute;left:14%;right:14%;bottom:0;height:3px;
  background:var(--red);transform:scaleX(0);transform-origin:center;
  transition:transform .22s cubic-bezier(.2,.7,.3,1);
}
.nav a.navlink:hover{color:var(--red)}
.nav a.navlink:hover::after{transform:scaleX(1)}
.nav-drop{position:relative;display:flex;align-items:stretch}
.nav-drop>a.navlink:last-of-type{border-right:none}
.nav-drop .caret{font-size:.55rem;margin-left:.4rem;align-self:center;color:var(--ink-faint);transition:color .18s}
.nav-drop>.navlink:hover .caret{color:var(--red)}
.nav-drop-menu{
  position:absolute;top:100%;left:0;min-width:240px;display:none;
  flex-direction:column;background:var(--paper);
  border:1px solid var(--rule);border-top:3px solid var(--red);
  box-shadow:4px 4px 0 rgba(31,42,68,.18);z-index:950;
}
.nav-drop:hover .nav-drop-menu,.nav-drop:focus-within .nav-drop-menu{display:flex}
.nav-drop-menu a{
  font-family:var(--franklin);font-weight:700;font-size:.78rem;
  letter-spacing:.08em;text-transform:uppercase;text-decoration:none;
  color:var(--ink);padding:.75rem 1rem;border-bottom:1px solid var(--rule-soft);
  transition:color .18s, background .18s;
}
.nav-drop-menu a:last-child{border-bottom:none}
.nav-drop-menu a:hover{color:var(--red);background:rgba(178,34,52,.06)}
.nav .advertise{
  margin-left:var(--s4);align-self:center;
  font-family:var(--franklin);font-weight:800;font-size:.8rem;
  letter-spacing:.12em;text-transform:uppercase;text-decoration:none;
  background:var(--red);color:#FBF3E2;padding:.55rem 1.15rem;
  border:1px solid var(--red-deep);box-shadow:3px 3px 0 var(--navy);
  transition:transform .15s, box-shadow .15s, background .15s;
}
.nav .advertise:hover{background:var(--red-deep);transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--navy)}
.nav .advertise:active{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--navy)}
.nav-toggle{display:none}
@media(max-width:920px){.nav .wrap{flex-wrap:wrap;justify-content:space-between;padding-top:.4rem;padding-bottom:.4rem}.nav-toggle{
    display:inline-flex;align-items:center;gap:.5rem;
    font-family:var(--franklin);font-weight:800;font-size:.8rem;letter-spacing:.12em;
    text-transform:uppercase;background:none;border:1px solid var(--rule);
    padding:.5rem .9rem;cursor:pointer;color:var(--ink);
  }.nav-links{
    display:none;flex-basis:100%;flex-direction:column;border-top:1px solid var(--rule-soft);
    margin-top:.4rem;
  }.nav-links.open{display:flex}.nav a.navlink{border-left:none;border-bottom:1px solid var(--rule-soft);text-align:center}.nav a.navlink:last-of-type{border-right:none}.nav-drop{flex-direction:column}.nav-drop>.navlink{display:none}.nav-drop-menu{position:static;display:flex;min-width:0;border:none;border-top:none;box-shadow:none}.nav-drop-menu a{text-align:center;padding:.85rem 1.1rem;font-size:.83rem;letter-spacing:.1em;border-bottom:1px solid var(--rule-soft)}.nav .advertise{margin-left:0}}
.topbar-fb{color:#EDE6D4;text-decoration:none;font-weight:700;white-space:nowrap}
.topbar-fb:hover{color:var(--gold-bright)}