/* ============================================================
   FIELD ATLAS · direction 02 · the year as a topographic traverse
   ============================================================ */

:root{
  --paper:      #F3EDDD;
  --paper-deep: #EAE2CC;
  --plate:      #FBF7EB;
  --ink:        #2A2418;
  --mut:        #6B5F4B;
  --mut2:       #7C6E55;
  --line:       #D9CEB2;
  --line-strong:#C7B896;
  --sienna:     #8A6F4E;
  --contour:    rgba(138,110,74,.16);
  --contour-ix: rgba(138,110,74,.30);
  --trail:      #BC4123;
  --now:        #C42313;
  --env:  #3D6B4F;
  --prop: #8F6312;
  --char: #9C4632;
  --key:  #44607A;
  --env-t:  rgba(61,107,79,.11);
  --prop-t: rgba(143,99,18,.11);
  --char-t: rgba(156,70,50,.11);
  --key-t:  rgba(68,96,122,.11);
  --serif: "Instrument Serif", Georgia, serif;
  --sans:  "Archivo", system-ui, sans-serif;
  --mono:  "IBM Plex Mono", ui-monospace, monospace;
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:15px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* subtle paper grain */
body::after{
  content:""; position:fixed; inset:0; z-index:90; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
}

img{ max-width:100%; display:block; }
a{ color:inherit; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
:focus-visible{ outline:2px solid var(--trail); outline-offset:3px; border-radius:1px; }

.mono{ font-family:var(--mono); }
.mono-label{
  font-family:var(--mono); font-size:10px; font-weight:500;
  letter-spacing:.14em; color:var(--mut);
}
.mono-label.dim{ color:var(--mut2); }

/* ---------------- lab chrome ---------------- */
.lab-chrome{
  position:fixed; left:12px; bottom:12px; z-index:80;
  display:flex; gap:7px; align-items:center;
  font-family:var(--mono); font-size:9.5px; letter-spacing:.12em;
  background:rgba(243,237,221,.92); border:1px solid var(--line-strong);
  padding:5px 10px; color:var(--mut);
}
.lab-chrome a{ text-decoration:none; padding:2px 1px; }
.lab-chrome a:hover{ color:var(--trail); text-decoration:underline; text-underline-offset:3px; }

/* ---------------- masthead ---------------- */
.masthead{
  border-bottom:3px double var(--line-strong);
  background:
    linear-gradient(rgba(251,247,235,.55), rgba(243,237,221,0) 70%);
  position:relative;
}
.wrap{ max-width:1280px; margin:0 auto; padding:36px 40px 0; }

.mast-top{
  display:flex; justify-content:space-between; align-items:flex-start; gap:32px;
  padding-bottom:24px;
}
.eyebrow{ margin-bottom:14px; }
.site-title{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(2.9rem, 6.2vw, 4.7rem);
  line-height:.98; letter-spacing:-.01em;
  text-wrap:balance;
}
.site-title .session{
  font-style:italic; color:var(--sienna);
  margin-left:.12em;
}
.mast-sub{
  margin-top:14px; max-width:44ch; color:var(--mut);
  font-size:14.5px; text-wrap:pretty;
}

.mast-now{ display:flex; align-items:center; gap:18px; flex-shrink:0; margin-top:6px; }
.compass{ width:58px; height:58px; color:var(--sienna); overflow:visible; }
.compass-n{ font-family:var(--mono); font-size:9px; fill:var(--sienna); letter-spacing:.1em; }
.now-box{
  display:flex; gap:10px; align-items:flex-start;
  border:1px solid var(--line-strong); background:var(--plate);
  padding:12px 16px;
}
.now-dot{
  width:9px; height:9px; border-radius:50%; background:var(--now);
  margin-top:5px; flex-shrink:0;
  box-shadow:0 0 0 3px rgba(196,35,19,.15);
}
.now-copy{ display:flex; flex-direction:column; }
.now-copy b{ font-size:9.5px; letter-spacing:.18em; color:var(--now); }
.now-date{ font-family:var(--serif); font-style:italic; font-size:21px; line-height:1.15; }
.now-week{ font-size:9.5px; letter-spacing:.1em; color:var(--mut2); margin-top:2px; }

/* ---------------- route tabs ---------------- */
.route-tabs{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:10px;
  padding-bottom:20px;
}
.route-tab{
  text-align:left; border:1px solid var(--line-strong); background:var(--plate);
  padding:13px 16px 12px; display:flex; flex-direction:column; gap:3px;
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
  min-height:44px;
}
.route-tab:hover{ border-color:var(--sienna); transform:translateY(-1px); }
.rt-route{ font-size:10px; letter-spacing:.2em; color:var(--trail); font-weight:600; }
.rt-label{ font-family:var(--serif); font-size:21px; line-height:1.1; }
.rt-days{ font-size:9.5px; letter-spacing:.1em; color:var(--mut2); margin-top:3px; }
.route-tab.active{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.route-tab.active .rt-route{ color:#E8896B; }
.route-tab.active .rt-days{ color:rgba(243,237,221,.62); }

/* ---------------- dispatch (hero: current course) ---------------- */
.dispatch{
  border:2px solid var(--ink); background:var(--plate);
  display:grid; grid-template-columns:300px 1fr;
  margin-bottom:26px; position:relative;
}
.dispatch-cover{ position:relative; border-right:1px solid var(--line-strong); }
.dispatch-cover img{ width:100%; height:100%; object-fit:cover; aspect-ratio:auto; }
.dispatch-cover figcaption{
  position:absolute; left:0; right:0; bottom:0;
  font-family:var(--mono); font-size:9.5px; letter-spacing:.1em;
  color:var(--paper); background:rgba(42,36,24,.82);
  padding:6px 12px;
}
.dispatch-body{ padding:22px 28px 20px; display:flex; flex-direction:column; gap:9px; }
.dispatch-flag{
  display:flex; align-items:center; gap:10px;
  font-family:var(--mono); font-size:10px; font-weight:600; letter-spacing:.18em; color:var(--now);
}
.dispatch-flag::before{
  content:""; width:22px; height:2px; background:var(--now);
}
.dispatch-name{
  font-family:var(--serif); font-style:italic; font-weight:400;
  font-size:clamp(1.9rem, 3.4vw, 2.9rem); line-height:1.02; letter-spacing:-.005em;
  text-wrap:balance;
}
.dispatch-lead{ font-family:var(--mono); font-size:11px; letter-spacing:.1em; color:var(--mut); }
.dispatch-dates{ font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:var(--ink); }
.dispatch-blurb{ color:var(--mut); font-size:14px; max-width:56ch; text-wrap:pretty; }
.dispatch-foot{ display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:auto; padding-top:10px; flex-wrap:wrap; }
.goto-camp{
  font-family:var(--mono); font-size:10.5px; font-weight:600; letter-spacing:.16em;
  color:var(--paper); background:var(--trail);
  padding:12px 18px; transition:background .18s ease;
  min-height:44px;
}
.goto-camp:hover{ background:#9E3218; }

/* ---------------- scale ruler + legend ---------------- */
.scale-legend{
  display:grid; grid-template-columns:1fr 230px; gap:28px;
  border-top:1px solid var(--line); padding:16px 0 22px;
}
.scale-head{ display:flex; justify-content:space-between; margin-bottom:10px; }
.scale-ticks{ display:flex; flex-wrap:wrap; gap:3px 3px; align-items:flex-end; }
.scale-ticks i{
  width:4px; height:15px; border:1px solid var(--sienna); background:transparent;
}
.scale-ticks i.on{ background:var(--sienna); }
.scale-ticks i.ten{ height:20px; }
.scale-fig{ margin-top:10px; color:var(--mut); font-size:13px; }
.scale-fig .serif-fig{
  font-family:var(--serif); font-weight:400; font-size:30px; color:var(--ink);
  line-height:1; vertical-align:-3px; padding:0 1px;
}
.legend{ border-left:1px solid var(--line); padding-left:24px; }
.legend ul{ list-style:none; margin-top:10px; display:flex; flex-direction:column; gap:7px; }
.legend li{ display:flex; align-items:center; gap:10px; font-size:12px; color:var(--mut); }
.lg{ width:14px; height:14px; flex-shrink:0; display:inline-block; position:relative; }
.lg-course{ background:var(--sienna); transform:rotate(45deg) scale(.72); }
.lg-self{ border:1.5px solid var(--sienna); border-radius:50%; transform:scale(.75); }
.lg-hol{ background:repeating-linear-gradient(-45deg, transparent 0 3px, var(--sienna) 3px 4px); opacity:.6; }
.lg-walk{ height:0; border-top:2.5px solid var(--trail); align-self:center; }
.lg-ahead{ height:0; border-top:2px dashed var(--sienna); align-self:center; opacity:.7; }

/* ---------------- traverse (the map) ---------------- */
.traverse{
  position:relative; overflow:hidden;
  background:var(--paper);
}
.layer{ position:absolute; top:0; left:0; pointer-events:none; }
.layer.far{ z-index:1; }
.layer.near{ z-index:2; }
.layer.trailmap{ z-index:4; }
@media (prefers-reduced-motion: no-preference){
  .layer.far, .layer.near{ will-change:transform; }
}

.ct-minor{ fill:none; stroke:var(--contour); stroke-width:1; }
.ct-index{ fill:none; stroke:var(--contour-ix); stroke-width:1.3; }
.grat{ stroke:rgba(138,110,74,.07); stroke-width:1; }
.grat.gh{ stroke:rgba(138,110,74,.11); stroke-dasharray:1 5; }

.mapframe{ fill:none; stroke:var(--sienna); stroke-width:1; opacity:.45; }
.wtick{ stroke:var(--sienna); stroke-width:1; opacity:.4; }
.mapcorner{
  font-family:var(--mono); font-size:9px; letter-spacing:.14em;
  fill:var(--mut2);
}

.trail-base{
  fill:none; stroke:var(--sienna); stroke-width:2;
  stroke-dasharray:1.5 7; stroke-linecap:round; opacity:.6;
}
.trail-walked{
  fill:none; stroke:var(--trail); stroke-width:2.6; stroke-linecap:round;
}
.leader{ fill:none; stroke:var(--sienna); stroke-width:1; stroke-dasharray:2 4; opacity:.55; }
.leader-dot{ fill:var(--sienna); opacity:.6; }

/* hatch band = winter pass closure */
.hatch-band{
  position:absolute; z-index:3;
  background:repeating-linear-gradient(-45deg, transparent 0 7px, rgba(138,110,74,.15) 7px 8px);
  border-top:1px dashed var(--line-strong);
  border-bottom:1px dashed var(--line-strong);
  display:grid; place-items:center;
}
.closure{
  position:relative; z-index:6;
  background:var(--paper); border:1px solid var(--line-strong);
  padding:20px 30px; text-align:center; max-width:320px;
}
@media (min-width:1140px){
  /* sit beside the trail, not across it, so week marks stay legible */
  .closure{ transform:translateX(-185px); }
}
.closure .mono-label{ color:var(--mut2); }
.closure-name{
  font-family:var(--serif); font-style:italic; font-weight:400;
  font-size:31px; line-height:1; margin:8px 0 8px;
}
.closure-dates{ font-size:10.5px; letter-spacing:.1em; color:var(--mut); }
.closure-note{ font-size:12.5px; color:var(--mut2); margin-top:7px; }

/* sheet dividers = semesters */
.sheet{
  position:absolute; left:0; right:0; z-index:6;
  background:var(--paper);
  border-top:3px double var(--line-strong);
  border-bottom:3px double var(--line-strong);
  padding:16px 0;
}
.sheet-core{
  max-width:1280px; margin:0 auto; padding:0 40px;
  display:flex; align-items:center; gap:26px;
}
.sheet-no{
  font-family:var(--serif); font-size:58px; line-height:.9;
  color:var(--sienna); flex-shrink:0;
}
.sheet-info h2{
  font-family:var(--serif); font-weight:400; font-size:27px; line-height:1;
}
.sheet-info .mono-label{ display:block; margin-top:6px; }
.sheet-progress{ margin-left:auto; text-align:right; min-width:220px; }
.sheet-progress .bar{
  height:8px; border:1px solid var(--sienna); background:var(--plate); position:relative;
}
.sheet-progress .bar i{
  position:absolute; inset:1px auto 1px 1px; background:var(--trail); display:block;
}
.sheet-progress .mono-label{ display:block; margin-top:7px; }

/* month engravings */
.month-label{
  position:absolute; z-index:5; left:14px;
  writing-mode:vertical-rl; transform:rotate(180deg) translateY(50%);
  font-family:var(--serif); font-size:27px; letter-spacing:.42em;
  text-transform:uppercase; color:rgba(107,95,75,.62);
  pointer-events:none; white-space:nowrap;
}

/* week ticks */
.wk{
  position:absolute; z-index:7;
  width:44px; height:44px; margin:-22px 0 0 -22px;
  display:grid; place-items:center;
}
span.wk{ cursor:default; }
button.wk{ cursor:pointer; }
.wk i{ display:block; width:9px; height:9px; transition:transform .15s ease; }
.wk.course i{ background:var(--tkc, var(--sienna)); transform:rotate(45deg); }
button.wk:hover i{ transform:rotate(45deg) scale(1.5); }
.wk.t-ENV{ --tkc:var(--env); } .wk.t-PROP{ --tkc:var(--prop); }
.wk.t-CHAR{ --tkc:var(--char); } .wk.t-KEYFRAME{ --tkc:var(--key); }
.wk.self i{ background:var(--paper); border:1.5px solid var(--sienna); border-radius:50%; width:8px; height:8px; }
.wk.hol i{
  background:
    linear-gradient(45deg, transparent 43%, var(--sienna) 45%, var(--sienna) 55%, transparent 57%),
    linear-gradient(-45deg, transparent 43%, var(--sienna) 45%, var(--sienna) 55%, transparent 57%);
  opacity:.65;
}
.wk.past i{ opacity:.5; }
.wk.cur i,
.wk.cur .wnum{
  /* the NOW pin and its plate sit exactly here; keep the button, hide duplicate glyphs */
  opacity:0;
}
.wnum{
  position:absolute; top:31px; left:50%; transform:translateX(-50%);
  font-size:8.5px; letter-spacing:.05em; color:var(--mut2);
  text-shadow:0 0 4px var(--paper), 0 0 4px var(--paper), 0 0 5px var(--paper);
  pointer-events:none;
}

/* self-study run plaques */
.ss-plaque{
  position:absolute; z-index:5; transform:translate(-50%,-50%);
  font-family:var(--mono); font-size:10px; letter-spacing:.16em; color:var(--mut);
  background:var(--paper); border:1px dashed var(--line-strong);
  padding:7px 13px; white-space:nowrap; pointer-events:none;
}

/* trailhead / summit */
.endnode{
  position:absolute; z-index:6; transform:translate(-50%,-50%);
  display:flex; flex-direction:column; align-items:center; gap:7px;
  pointer-events:none;
}
.endnode .en-mark{
  width:13px; height:13px; border-radius:50%;
  border:2.5px solid var(--trail); background:var(--paper);
}
.endnode.summit .en-mark{
  width:0; height:0; border:0; border-left:8px solid transparent;
  border-right:8px solid transparent; border-bottom:14px solid var(--sienna);
  border-radius:0; background:none;
}
.endnode .en-label{
  font-family:var(--mono); font-size:9.5px; letter-spacing:.14em; color:var(--mut);
  background:var(--paper); border:1px solid var(--line-strong); padding:4px 10px;
  white-space:nowrap;
}

/* ---------------- camp cards ---------------- */
.camp{
  position:absolute; z-index:8;
  background:var(--plate); border:1px solid var(--line-strong);
  transition:border-color .18s ease, transform .18s ease;
}
.camp:hover{ border-color:var(--sienna); }
.camp.current{ border:2px solid var(--trail); z-index:9; }
.camp.upcoming{ border-style:dashed; }
.camp.completed .plate img{ filter:saturate(.5) contrast(.96) sepia(.14); opacity:.88; }

.camp-tab{
  position:absolute; top:-11px; left:14px; z-index:2;
  display:flex; gap:12px; align-items:baseline;
  background:var(--ink); color:var(--paper);
  font-size:9px; letter-spacing:.16em; font-weight:500;
  padding:4px 10px;
}
.camp.current .camp-tab{ background:var(--trail); }
.camp-tab .ct-range{ color:rgba(243,237,221,.6); }

.plate{ margin:12px 12px 0; border:1px solid var(--line-strong); position:relative; background:var(--paper-deep); }
.plate .imgwrap{ overflow:hidden; display:block; }
.plate img{ width:100%; aspect-ratio:16/10; object-fit:cover; transition:transform .35s ease, filter .35s ease, opacity .35s ease; }
.camp.hero .plate img{ aspect-ratio:3/2; }
.camp:hover .plate img{ transform:scale(1.025); }
.camp.completed:hover .plate img{ filter:none; opacity:1; }
.plate figcaption{
  font-family:var(--mono); font-size:9px; letter-spacing:.12em; color:var(--mut);
  border-top:1px solid var(--line-strong); padding:5px 9px;
  background:var(--plate);
}

.camp-body{ padding:14px 16px 16px; display:flex; flex-direction:column; gap:8px; }
.camp-meta{ display:flex; align-items:center; gap:10px; }
.type-chip{
  font-family:var(--mono); font-size:9.5px; font-weight:600; letter-spacing:.14em;
  color:var(--plate); background:var(--sienna); padding:3px 8px;
}
.camp.t-ENV .type-chip{ background:var(--env); }
.camp.t-PROP .type-chip{ background:var(--prop); }
.camp.t-CHAR .type-chip{ background:var(--char); }
.camp.t-KEYFRAME .type-chip{ background:var(--key); }
.status{ font-family:var(--mono); font-size:10px; letter-spacing:.08em; color:var(--mut); }
.status.st-current{ color:var(--now); font-weight:600; }
.status.st-upcoming{ color:var(--mut2); }

.camp-name{
  font-family:var(--serif); font-style:italic; font-weight:400;
  font-size:24px; line-height:1.04; letter-spacing:-.004em;
  text-wrap:balance;
}
.camp.hero .camp-name{ font-size:33px; }
.camp-lead{ font-size:10px; letter-spacing:.1em; color:var(--mut); }
.camp-lead .tbd{ color:var(--trail); }
.camp-blurb{ font-size:13px; color:var(--mut); text-wrap:pretty; }

.skills{ list-style:none; display:flex; flex-wrap:wrap; gap:5px; }
.skills li{
  font-family:var(--mono); font-size:8.5px; letter-spacing:.1em; text-transform:uppercase;
  border:1px solid var(--line-strong); color:var(--mut); padding:3px 7px;
  background:var(--paper);
}

.tally{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:2px; }
.tally-ticks{ display:flex; gap:2.5px; }
.tally-ticks i{ width:4px; height:14px; border:1px solid var(--sienna); background:transparent; }
.tally-ticks i.on{ background:var(--sienna); }
.camp.current .tally-ticks i.on,
.dispatch .tally-ticks i.on{ background:var(--trail); border-color:var(--trail); }
.tally-fig{ font-size:9px; letter-spacing:.1em; color:var(--mut); }

.notes{
  align-self:flex-start; margin-top:4px;
  font-family:var(--mono); font-size:10px; font-weight:600; letter-spacing:.16em;
  color:var(--ink); text-decoration:none;
  border-bottom:1px solid var(--line-strong);
  padding:6px 0 4px; display:inline-flex; gap:8px; align-items:center;
  transition:color .15s ease, border-color .15s ease;
}
.notes .arr{ transition:transform .18s ease; }
.notes:hover{ color:var(--trail); border-color:var(--trail); }
.notes:hover .arr{ transform:translateX(3px); }

.camp.pinged{ animation:ping 1.4s ease; }
@keyframes ping{
  0%, 60%{ box-shadow:0 0 0 4px rgba(188,65,35,.35); }
  100%{ box-shadow:0 0 0 4px rgba(188,65,35,0); }
}

/* flag on current camp */
.flag{
  position:absolute; top:-24px; right:16px; width:26px; height:34px; z-index:3;
}
.flag .pole{ position:absolute; left:0; top:0; width:2px; height:34px; background:var(--ink); }
.flag .cloth{
  position:absolute; left:2px; top:1px; width:0; height:0;
  border-top:8px solid transparent; border-bottom:8px solid transparent;
  border-left:20px solid var(--trail);
  transform-origin:left center;
}
@media (prefers-reduced-motion: no-preference){
  .flag .cloth{ animation:wave 2.6s ease-in-out infinite; }
  @keyframes wave{
    0%,100%{ transform:skewY(0deg) scaleX(1); }
    50%{ transform:skewY(-6deg) scaleX(.92); }
  }
}

/* ---------------- NOW marker (pin anchored exactly on the trail point) ---------------- */
.now-marker{ position:absolute; z-index:10; width:0; height:0; pointer-events:none; }
.nm-pin{ position:absolute; left:-7.5px; top:-7.5px; width:15px; height:15px; }
.nm-plate{ position:absolute; left:22px; top:50%; transform:translateY(-50%); }
.now-marker.side-left .nm-plate{ left:auto; right:22px; }
.nm-pin::before{
  content:""; position:absolute; inset:0; border-radius:50%;
  background:var(--now); border:2.5px solid var(--paper);
  box-shadow:0 0 0 1.5px var(--now);
}
@media (prefers-reduced-motion: no-preference){
  .nm-pin::after{
    content:""; position:absolute; inset:-7px; border-radius:50%;
    border:1.5px solid var(--now); opacity:0;
    animation:pulse 2.4s ease-out infinite;
  }
  @keyframes pulse{
    0%{ transform:scale(.5); opacity:.7; }
    70%{ transform:scale(1.25); opacity:0; }
    100%{ opacity:0; }
  }
  .nm-plate{ animation:bob 5s ease-in-out infinite; }
  @keyframes bob{
    0%,100%{ transform:translateY(-50%) rotate(-.5deg); }
    50%{ transform:translateY(-50%) rotate(.6deg); }
  }
}
.nm-plate{
  background:#FFF9F0; border:2px solid var(--now);
  padding:9px 14px; white-space:nowrap;
}
.nm-plate b{
  display:block; font-family:var(--mono); font-size:9px; font-weight:600;
  letter-spacing:.2em; color:var(--now);
}
.nm-plate span{
  display:block; font-family:var(--serif); font-style:italic; font-size:19px; line-height:1.15;
}
.now-marker.side-left .nm-inner{ flex-direction:row-reverse; }

/* ---------------- footer ---------------- */
.atlas-foot{
  border-top:3px double var(--line-strong);
  padding:26px 40px 34px; text-align:center;
}
.atlas-foot .mono{ font-size:9.5px; letter-spacing:.18em; color:var(--mut2); }

/* ---------------- responsive ---------------- */
@media (max-width:1139px){
  .wrap{ padding:30px 18px 0; }
  .mast-top{ flex-direction:column; gap:20px; padding-bottom:22px; }
  .mast-now{ margin-top:0; }
  .route-tabs{ grid-template-columns:1fr; gap:8px; padding-bottom:20px; }
  .route-tab{ flex-direction:row; align-items:baseline; gap:12px; flex-wrap:wrap; }
  .rt-label{ font-size:18px; }
  .rt-days{ margin-left:auto; margin-top:0; }
  .dispatch{ grid-template-columns:1fr; }
  .dispatch-cover{ border-right:0; border-bottom:1px solid var(--line-strong); }
  .dispatch-cover img{ aspect-ratio:16/9; }
  .dispatch-body{ padding:20px 18px 20px; }
  .scale-legend{ grid-template-columns:1fr; gap:18px; padding:16px 0 22px; }
  .legend{ border-left:0; padding-left:0; border-top:1px solid var(--line); padding-top:14px; }
  .legend ul{ flex-direction:row; flex-wrap:wrap; gap:8px 18px; }

  .sheet-core{ padding:0 18px; gap:16px; flex-wrap:wrap; }
  .sheet-no{ font-size:40px; }
  .sheet-info h2{ font-size:21px; }
  .sheet-progress{ min-width:150px; }
  .month-label{ left:2px; font-size:17px; letter-spacing:.3em; }
  .wnum{ display:none; }
  .camp-name{ font-size:21px; }
  .camp.hero .camp-name{ font-size:25px; }
  .plate{ margin:10px 10px 0; }
  .plate img{ aspect-ratio:2/1; }
  .camp.hero .plate img{ aspect-ratio:16/9; }
  .camp-body{ padding:11px 13px 13px; gap:6px; }
  .camp-blurb{ font-size:12.5px; }
  .skills li{ font-size:8px; padding:2px 6px; }
  .closure{ max-width:250px; padding:16px 18px; }
  .closure-name{ font-size:25px; }
  .nm-plate span{ font-size:16px; }
  .atlas-foot{ padding:20px 16px 26px; }
  .atlas-foot .mono{ font-size:8.5px; letter-spacing:.12em; }
}