/* Outdoor Unc — field guide.
   Agency signage and topographic map, not newsprint. Colour carries meaning
   and appears nowhere decorative: orange closes things, green opens them. */

:root{
  --bg:#fcfcfa;
  --bg-alt:#f2f3f0;
  --ink:#14171a;
  --ink-2:#3b4147;
  --meta:#6b7278;
  --meta-2:#8b9197;
  --rule:#d9dcde;
  --rule-2:#e6e8e9;
  --rule-strong:#14171a;

  --closed:#d24a0b;   /* blaze orange — hunter safety, trail marker, closure */
  --open:#2f6b45;     /* in season, reopened, go */
  --advisory:#a8761a; /* conditions, caution, changed rules */
  --notice:#6b7278;   /* dates and deadlines, no hazard */

  --contour:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='14' viewBox='0 0 160 14'><path d='M0 11 Q40 3 80 11 T160 11' fill='none' stroke='%23d9dcde' stroke-width='1'/><path d='M0 5 Q40 -3 80 5 T160 5' fill='none' stroke='%23e6e8e9' stroke-width='1'/></svg>");

  --display:"Barlow Condensed","Arial Narrow",Helvetica,sans-serif;
  --ui:"Barlow","Helvetica Neue",Helvetica,Arial,sans-serif;
  --serif:"Source Serif 4",Georgia,"Times New Roman",serif;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#101315; --bg-alt:#191d20; --ink:#eef1f2; --ink-2:#c6cbcf;
    --meta:#939a9f; --meta-2:#787f84; --rule:#2c3236; --rule-2:#232829;
    --rule-strong:#eef1f2;
    --closed:#f2743c; --open:#6fbf8f; --advisory:#d9a94a; --notice:#939a9f;
    --contour:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='14' viewBox='0 0 160 14'><path d='M0 11 Q40 3 80 11 T160 11' fill='none' stroke='%232c3236' stroke-width='1'/><path d='M0 5 Q40 -3 80 5 T160 5' fill='none' stroke='%23232829' stroke-width='1'/></svg>");
  }
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--serif);font-size:17px;line-height:1.58;
  padding:0 clamp(14px,3vw,32px) 72px;-webkit-font-smoothing:antialiased;
}
.sheet{max-width:1180px;margin:0 auto}
.skip{position:absolute;left:-9999px}
.skip:focus{position:static;display:inline-block;padding:8px;background:var(--ink);color:var(--bg)}

a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--closed);outline-offset:2px}

/* ---------- masthead: a trailhead sign ---------- */
.folio{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:baseline;gap:4px 20px;
  padding:12px 0;font-family:var(--ui);font-size:11.5px;font-weight:500;
  color:var(--meta);letter-spacing:.02em;
}
.folio>:first-child{justify-self:start;text-align:left}
.folio>:nth-child(2){justify-self:center;text-align:center}
.folio>:last-child{justify-self:end;text-align:right}
@media (max-width:620px){
  .folio{grid-template-columns:1fr;justify-items:center;gap:3px}
  .folio>*{justify-self:center !important;text-align:center !important}
}
.folio b{font-weight:600;color:var(--ink)}
.folio a{color:var(--meta)}

.plate{border-top:3px solid var(--ink);padding:20px 0 0;text-align:center}
.nameplate{
  font-family:var(--display);font-weight:800;text-transform:uppercase;
  font-size:clamp(40px,10vw,96px);line-height:.92;margin:0;letter-spacing:.005em;
}
.nameplate a:hover{text-decoration:none}
.creed{
  margin:8px auto 0;font-family:var(--ui);font-size:12.5px;font-weight:500;
  color:var(--meta);max-width:56ch;letter-spacing:.015em;
}
.plate::after{
  content:"";display:block;height:14px;margin-top:16px;
  background-image:var(--contour);background-repeat:repeat-x;
}

nav.nav{
  display:flex;flex-wrap:wrap;justify-content:center;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  margin:0 0 28px;
}
nav.nav a{
  font-family:var(--display);font-size:16px;font-weight:600;text-transform:uppercase;
  letter-spacing:.035em;color:var(--ink-2);padding:11px 13px;
}
nav.nav a:hover{color:var(--closed);text-decoration:none}
nav.nav a[aria-current="page"]{color:var(--ink);box-shadow:inset 0 -3px 0 var(--closed)}

.crumbs{
  font-family:var(--ui);font-size:11px;font-weight:600;text-transform:uppercase;
  letter-spacing:.08em;color:var(--meta);margin:0 0 18px;
}
.crumbs a{color:var(--meta)}

/* ---------- grid ---------- */
.grid{display:grid;grid-template-columns:minmax(0,2.7fr) 1px minmax(0,1fr);gap:0 28px;align-items:start}
.grid-3{grid-template-columns:minmax(0,1fr) 1px minmax(0,2.4fr) 1px minmax(0,1.05fr)}
.gutter{background:var(--rule);width:1px;min-height:240px;align-self:stretch}
.grid-3>.gutter{align-self:start;height:100%}
@media (max-width:900px){
  .grid,.grid-3{grid-template-columns:1fr;gap:0}
  .gutter{display:none}
  .rail{border-top:1px solid var(--rule);padding-top:22px;margin-top:28px}
}

.banner{
  font-family:var(--display);font-size:17px;font-weight:700;text-transform:uppercase;
  letter-spacing:.045em;color:var(--ink);
  border-top:2px solid var(--rule-strong);padding:7px 0 0;margin:0 0 16px;
  display:flex;justify-content:space-between;align-items:baseline;gap:10px;
}
.banner span{
  font-family:var(--ui);font-weight:500;text-transform:none;letter-spacing:.01em;
  font-size:11.5px;color:var(--meta);
}

.viewhead{border-bottom:1px solid var(--rule);padding-bottom:14px;margin:0 0 26px}
.viewhead h1{
  font-family:var(--display);font-size:clamp(32px,4.4vw,48px);font-weight:800;
  text-transform:uppercase;margin:0;line-height:1;letter-spacing:.01em;
}
.viewhead p{margin:9px 0 0;font-family:var(--ui);font-size:12.5px;color:var(--meta)}

/* ---------- status band: the whole point ---------- */
.status{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;
  border-left:5px solid var(--notice);background:var(--bg-alt);
  padding:9px 13px;margin:0 0 14px;font-family:var(--ui);
}
.status .state{
  font-family:var(--display);font-size:17px;font-weight:800;text-transform:uppercase;
  letter-spacing:.06em;color:var(--notice);line-height:1;
}
.status .what{font-size:14px;font-weight:600;color:var(--ink)}
.status .detail{font-size:13px;color:var(--meta)}
.status .checked{
  font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;
  color:var(--meta-2);margin-left:auto;white-space:nowrap;
}
.status[data-state="closed"]{border-left-color:var(--closed)}
.status[data-state="closed"] .state{color:var(--closed)}
.status[data-state="open"]{border-left-color:var(--open)}
.status[data-state="open"] .state{color:var(--open)}
.status[data-state="advisory"]{border-left-color:var(--advisory)}
.status[data-state="advisory"] .state{color:var(--advisory)}
.status-lg{padding:13px 16px;margin-bottom:18px}
.status-lg .state{font-size:22px}
.status-lg .what{font-size:16px}

/* the "right now" board */
.board{margin:0;padding:0;list-style:none}
.board li{border-bottom:1px solid var(--rule);padding:9px 0}
.board a{display:block;font-family:var(--ui);font-size:14px;line-height:1.3;color:var(--ink)}
.board .chip{
  display:inline-block;font-family:var(--display);font-size:12px;font-weight:800;
  text-transform:uppercase;letter-spacing:.06em;color:var(--notice);
  border-left:3px solid var(--notice);padding-left:6px;margin-right:7px;
}
.board li[data-state="closed"] .chip{color:var(--closed);border-left-color:var(--closed)}
.board li[data-state="open"] .chip{color:var(--open);border-left-color:var(--open)}
.board li[data-state="advisory"] .chip{color:var(--advisory);border-left-color:var(--advisory)}
.board .when{display:block;font-size:11px;color:var(--meta-2);margin-top:3px}

/* ---------- headlines ---------- */
h1.head,h2.head,h3.head{
  font-family:var(--display);font-weight:700;line-height:1.02;
  margin:0 0 9px;letter-spacing:.005em;color:var(--ink);
}
h1.head{font-size:clamp(34px,4.8vw,52px)}
h2.head{font-size:clamp(26px,3.2vw,36px)}
h3.head{font-size:23px;line-height:1.06}
h2.head a:hover,h3.head a:hover{text-decoration:underline;text-underline-offset:3px}

.kicker{
  font-family:var(--ui);font-size:11px;font-weight:700;text-transform:uppercase;
  letter-spacing:.09em;margin:0 0 7px;
}
.kicker a{color:var(--meta)}
.kicker a:hover{color:var(--closed)}

.deck{
  font-family:var(--serif);font-size:16.5px;line-height:1.46;color:var(--meta);
  margin:0 0 13px;font-weight:400;
}
.byline{
  font-family:var(--ui);font-size:11px;font-weight:600;text-transform:uppercase;
  letter-spacing:.08em;color:var(--meta-2);margin:0 0 16px;
}
.byline em{font-style:normal;color:var(--ink-2);font-weight:700}
.byline a{color:var(--meta-2)}

/* ---------- body ---------- */
.copy{font-family:var(--serif)}
.copy p{margin:0 0 1.05em;font-size:18px;line-height:1.66}
.story .copy{max-width:660px}
.story .copy p{font-size:19px;line-height:1.7}
.cols .copy p,.brief .copy p{font-size:16.5px;line-height:1.6}

.dropcaps .copy>p:first-child::first-letter{
  float:left;font-family:var(--display);font-weight:800;
  font-size:3.2em;line-height:.8;padding:.06em .1em 0 0;color:var(--closed);
}
.dropcaps .lead .copy>p:first-child::first-letter{font-size:3.7em}
.dropcaps .cols .copy>p:first-child::first-letter{font-size:2.7em}
/* briefs and teasers sit in narrow measures: same cap, scaled down */
.dropcaps .brief .copy>p:first-child::first-letter,
.dropcaps .copy.flat>p:first-child::first-letter{font-size:2.5em}

article{margin:0 0 34px;scroll-margin-top:20px}
article.brief{border-top:1px solid var(--rule);padding-top:14px;margin-bottom:18px}
article.brief h3.head{font-size:19px}
.lead{border-bottom:2px solid var(--rule);padding-bottom:26px;margin-bottom:26px}

.art{margin:0 0 16px}
.art svg,.art img,.art video{width:100%;height:auto;display:block;background:transparent}
.art figcaption{
  font-family:var(--ui);font-size:12px;line-height:1.45;color:var(--meta-2);padding-top:7px;
}
.art .credit{font-weight:700;text-transform:uppercase;font-size:10.5px;letter-spacing:.07em}

.sources-head{
  font-family:var(--display);font-size:14px;font-weight:700;text-transform:uppercase;
  letter-spacing:.06em;color:var(--meta);margin:22px 0 6px;
  border-top:1px solid var(--rule);padding-top:12px;
}
.sources{margin:0;padding:0;list-style:none;font-family:var(--ui);font-size:13px;line-height:1.6}
.sources li{display:inline;color:var(--meta)}
.sources li+li::before{content:" · ";color:var(--rule)}
.sources a{color:var(--meta)}
.sources a:hover{color:var(--closed)}

.broadsheet{margin-top:36px;padding-top:26px;border-top:3px solid var(--rule-strong)}
.cols{columns:3;column-gap:28px;column-rule:1px solid var(--rule)}
.cols>article{break-inside:avoid-column;margin-bottom:26px}
@media (max-width:980px){.cols{columns:2}}
@media (max-width:620px){.cols{columns:1}}

.rail{font-size:15px}
.toc a{
  display:block;border-bottom:1px solid var(--rule);padding:11px 0;
  font-family:var(--display);font-size:19px;font-weight:600;line-height:1.08;color:var(--ink);
}
.toc a:hover{color:var(--closed);text-decoration:none}
.toc .tocd{
  display:block;font-family:var(--ui);font-size:10.5px;font-weight:600;
  text-transform:uppercase;letter-spacing:.08em;color:var(--meta-2);margin-top:5px;
}

.issues a{
  display:block;border-bottom:1px solid var(--rule);padding:10px 0;
  font-family:var(--ui);font-size:13.5px;color:var(--ink-2);
}
.issues a:hover{color:var(--closed)}
.issues .count{float:right;color:var(--meta-2);font-size:11px;font-weight:600}

.pulse ol{list-style:none;margin:0;padding:0}
.pulse li{border-bottom:1px solid var(--rule);padding:11px 0;display:flex;gap:12px;align-items:baseline}
.pulse .n{font-family:var(--display);font-weight:800;font-size:16px;color:var(--closed);min-width:1.6em;text-align:right}
.pulse a{font-family:var(--display);font-weight:600;font-size:18px;line-height:1.1}
.pulse .quiet{font-family:var(--ui);font-size:13px;color:var(--meta-2)}

/* ---------- comments ---------- */
.talk{margin-top:48px;border-top:3px solid var(--rule-strong);padding-top:24px;max-width:660px}
.talk h2{font-family:var(--display);font-size:20px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin:0 0 8px}
.talk h2 span{font-family:var(--ui);font-size:12px;color:var(--meta-2);font-weight:500;text-transform:none;letter-spacing:0}
.talk .rules{font-family:var(--ui);font-size:13px;color:var(--meta);margin:0 0 22px;line-height:1.5}

.cform{background:var(--bg-alt);border-left:5px solid var(--rule);padding:18px;margin:0 0 28px}
.cform label{
  display:block;font-family:var(--ui);font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:.08em;color:var(--meta);margin:0 0 6px;
}
.cform input,.cform textarea{
  width:100%;padding:10px 11px;border:1px solid var(--rule);background:var(--bg);
  color:var(--ink);font-family:var(--serif);font-size:16px;border-radius:0;
}
.cform textarea{min-height:110px;resize:vertical;line-height:1.55}
.cform .row{margin-bottom:14px}
.cform .hp{position:absolute;left:-9999px}
.cform button{
  padding:11px 24px;border:0;background:var(--closed);color:#fff;
  font-family:var(--display);font-size:17px;font-weight:700;text-transform:uppercase;
  letter-spacing:.05em;cursor:pointer;border-radius:0;
}
.cform button:hover:not(:disabled){opacity:.85}
.cform button:disabled{opacity:.45;cursor:default}
.cform .note{font-family:var(--ui);font-size:12.5px;color:var(--meta);margin:12px 0 0}
.cform .note.err{color:var(--closed);font-weight:600}

.clist{margin:0;padding:0;list-style:none}
.clist li{border-top:1px solid var(--rule);padding:16px 0}
.clist li.reply{margin-left:28px;border-left:3px solid var(--rule);padding-left:16px;border-top:0}
.cmeta{font-family:var(--ui);font-size:11.5px;color:var(--meta-2);margin:0 0 6px}
.cmeta b{color:var(--ink);font-weight:700}
.cbody{margin:0;font-family:var(--serif);font-size:17px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}
.creply{
  background:none;border:0;padding:0;margin-top:8px;font-family:var(--ui);
  font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;
  color:var(--meta);cursor:pointer;
}
.creply:hover{color:var(--closed)}
.cempty{font-family:var(--ui);font-size:14px;color:var(--meta-2)}

.colophon{
  margin-top:56px;border-top:3px solid var(--rule-strong);padding-top:22px;
  font-family:var(--ui);font-size:12.5px;line-height:1.6;color:var(--meta);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px 34px;
}
.colophon b{
  font-family:var(--display);color:var(--ink);font-size:15px;font-weight:700;
  text-transform:uppercase;letter-spacing:.05em;display:block;margin-bottom:5px;
}
.colophon a{color:var(--meta)}
.colophon a:hover{color:var(--closed)}

/* legacy tokens used by inline artwork */
:root{
  --paper:var(--bg); --paper-2:var(--bg-alt);
  --ink-soft:var(--ink-2); --ink-faint:var(--meta-2);
  --rule-hair:var(--rule); --blaze:var(--closed);
  --moss:var(--open); --shade:rgba(0,0,0,.035);
}
@media (prefers-color-scheme: dark){ :root{ --shade:rgba(255,255,255,.05); } }

/* watch & read desk */
.desk-item{border-bottom:1px solid var(--rule);padding:0 0 14px;margin:0 0 14px}
.desk-item:last-of-type{border-bottom:0}
.desk-item>a{font-family:var(--display);font-weight:600;font-size:19px;line-height:1.08;display:block;margin-bottom:5px;color:var(--ink)}
.desk-item>a:hover{color:var(--closed);text-decoration:none}
.desk-item p{margin:0;font-family:var(--ui);font-size:13px;color:var(--meta);line-height:1.5}
.desk-item .src{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--meta-2);margin-bottom:3px}

/* legal notice under a status band */
.legalnote{
  font-family:var(--ui);font-size:11.5px;line-height:1.45;color:var(--meta-2);
  margin:-8px 0 16px;padding:0 0 0 13px;border-left:1px solid var(--rule);max-width:66ch;
}
.legalnote a{color:var(--meta);text-decoration:underline;text-underline-offset:2px}
.legalnote a:hover{color:var(--closed)}

/* published correction */
.correction{
  font-family:var(--ui);font-size:13px;line-height:1.55;color:var(--ink-2);
  border-left:4px solid var(--advisory);background:var(--bg-alt);
  padding:11px 14px;margin:20px 0 0;max-width:66ch;
}
.correction b{color:var(--advisory);font-weight:700}

/* where a status applies */
.status .where{
  font-family:var(--ui);font-size:12.5px;font-weight:600;color:var(--meta-2);
  text-transform:uppercase;letter-spacing:.05em;
}
.status-lg .where{font-size:13.5px}
.board .where{
  display:block;font-family:var(--ui);font-size:11px;font-weight:600;
  color:var(--meta-2);text-transform:uppercase;letter-spacing:.06em;margin-top:3px;
}

/* conditions record */
.status .record{
  font-family:var(--ui);font-size:10.5px;font-weight:700;text-transform:uppercase;
  letter-spacing:.08em;color:var(--meta-2);border-bottom:1px solid var(--rule);
  margin-left:auto;white-space:nowrap;
}
.status .record:hover{color:var(--closed);text-decoration:none}
.status .checked + .record{margin-left:12px}
.timeline{list-style:none;margin:0;padding:0}
.timeline li{
  border-left:4px solid var(--notice);padding:10px 0 10px 14px;margin:0 0 10px;
  background:var(--bg-alt);
}
.timeline li[data-state="closed"]{border-left-color:var(--closed)}
.timeline li[data-state="open"]{border-left-color:var(--open)}
.timeline li[data-state="advisory"]{border-left-color:var(--advisory)}
.timeline .tstate{
  font-family:var(--display);font-size:14px;font-weight:800;text-transform:uppercase;
  letter-spacing:.06em;color:var(--notice);margin-right:10px;
}
.timeline li[data-state="closed"] .tstate{color:var(--closed)}
.timeline li[data-state="open"] .tstate{color:var(--open)}
.timeline li[data-state="advisory"] .tstate{color:var(--advisory)}
.timeline time{font-family:var(--ui);font-size:11.5px;font-weight:600;color:var(--meta-2);text-transform:uppercase;letter-spacing:.05em}
.timeline a{display:block;font-family:var(--display);font-size:20px;font-weight:600;line-height:1.1;margin-top:5px}
.timeline a:hover{color:var(--closed);text-decoration:none}
.timeline .tdetail{display:block;font-family:var(--ui);font-size:12.5px;color:var(--meta);margin-top:4px}

/* masthead logo */
.plate-link{display:block;text-decoration:none}
.plate-link:hover{text-decoration:none}
svg.logo{width:min(100%,560px);height:auto;display:block;margin:0 auto}
@media (max-width:520px){svg.logo{width:100%}}

/* contact form */
.cform.contact{max-width:640px}
.cform select{
  width:100%;padding:10px 11px;border:1px solid var(--rule);background:var(--bg);
  color:var(--ink);font-family:var(--ui);font-size:15px;border-radius:0;
}
.cform .row.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:560px){.cform .row.two{grid-template-columns:1fr}}
.cform .hint{
  margin:8px 0 0;font-family:var(--ui);font-size:12.5px;line-height:1.5;color:var(--meta);
  border-left:3px solid var(--rule);padding-left:10px;
}
.cform .note.ok{color:var(--open);font-weight:600}
.plainlist{list-style:none;margin:0;padding:0}
.plainlist li{
  border-bottom:1px solid var(--rule);padding:9px 0;
  font-family:var(--ui);font-size:13.5px;line-height:1.5;color:var(--meta);
}
.plainlist li:last-child{border-bottom:0}