/* RV Bulletin site. Built from design/tokens.json by _src/build_site.py. Light only. No green, no red, no fills on any count. */
@font-face{font-family:Besley;src:url(/fonts/besley-800.woff2) format("woff2");font-weight:800;font-style:normal;font-display:swap}

:root{
  color-scheme:light;
  --paper:#FBF5E7;--surface:#F3E8D2;--ink:#3C281A;--muted:#72523A;--band:#B78D3F;
  --button-bg:#3C281A;--button-text:#FBF5E7;
  --display:Besley,Georgia,'Times New Roman',Times,serif;
  --serif:Georgia, 'Times New Roman', Times, serif;--sans:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;--mono:ui-monospace, 'SF Mono', Menlo, Consolas, 'Courier New', monospace;
  --gutter:20px;--measure:640px;--wide:1120px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:12px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 18px/1.6 var(--serif);overflow-x:clip}
a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,label:focus-within{outline:3px solid var(--ink);outline-offset:2px}
img,svg{display:block}
p,ul,ol{margin:0 0 14px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:var(--paper);padding:8px 12px;z-index:9}

/* Width */
.wrap{max-width:var(--wide);margin-inline:auto;padding-inline:var(--gutter)}
.col{max-width:calc(var(--measure) + var(--gutter)*2);margin-inline:auto;padding-inline:var(--gutter)}

/* Masthead: the only gold on the site. The rig stands on the band's ground line. */
.band{background:var(--band);border-bottom:2px solid var(--ink)}
.band-full img{width:100%;max-width:560px;height:auto;margin:0 auto -2px}
.band-slim .col{display:flex;align-items:flex-end;justify-content:space-between;height:68px}
.word{font:800 32px/1 var(--display);color:var(--ink);text-decoration:none;white-space:nowrap;padding-bottom:13px;word-spacing:-.08em}
.word:hover{text-decoration:none}
.word .rv{letter-spacing:-.05em}
.band-slim svg{width:84px;height:42px;margin-bottom:-1px;flex:none}

/* Nav */
.nav{display:flex;gap:22px;font:400 16px/1.2 var(--sans)}
.nav a{display:inline-flex;align-items:center;min-height:44px}
.nav a[aria-current]{font-weight:700;text-decoration:none}

/* Headings */
h1,h2{font-family:var(--display);font-weight:800;margin:0;text-wrap:balance}
h1{font-size:29px;line-height:1.14;letter-spacing:-.005em;margin:6px 0 8px}
.h1-sub{display:block;font:400 16px/1.35 var(--sans);letter-spacing:0;margin-top:5px;text-wrap:wrap}
h2{font-size:27px;line-height:1.18}
h3{font:700 20px/1.3 var(--serif);margin:0 0 6px}

/* Two levels, same as the email. A section opens on the line the rig stands on, full width, 2 px.
   A part break is 5 px with more air; everything under the last one is safe to be light. */
.brk{position:relative;margin-top:64px;padding-top:20px}
.brk::before{content:"";position:absolute;top:0;left:50%;width:100vw;margin-left:-50vw;border-top:2px solid var(--ink)}
.brk>h2{margin-bottom:16px}
.soon{margin-top:36px}
.part{margin-top:104px;padding-top:26px}
.part::before{border-top-width:5px}
.part>h2{font-size:31px}

/* Page openers */
.indep{font:400 15.5px/1.42 var(--sans);color:var(--muted);margin:0 0 12px}
.lead{font:700 20px/1.3 var(--sans);margin:0 0 12px}
.first{line-height:1.5;margin:0 0 10px}
.notice{font:400 17px/1.5 var(--sans);margin:0}
.updated{font:400 15.5px/1.4 var(--sans);color:var(--muted);margin:0 0 18px}
.years{font:400 16px/1.4 var(--sans);margin:12px 0 0}
.years a{display:inline-block;padding:6px 10px 6px 0}
.yr{padding-top:24px;margin-top:24px;border-top:1px solid var(--ink)}
.yr:first-of-type{border-top:0;padding-top:0;margin-top:0}
.yr h3{font:800 23px/1.2 var(--display);margin:0 0 8px}
.more{margin-top:12px!important}
.fields.two{grid-template-columns:1fr 1fr;align-items:end}
.quiet{font:400 16px/1.4 var(--sans);margin:30px 0 0!important}
.fallback{margin:18px 0 26px!important}
.mk{padding:18px 0 14px;border-top:1px solid var(--ink)}
.mk:last-of-type{border-bottom:1px solid var(--ink)}
.mk h3{font:800 21px/1.2 var(--display);margin:0 0 7px}
.mk p{margin:0 0 7px;overflow-wrap:anywhere}

/* Record text: system sans. Voice stays Georgia. */
.rig{font:400 17px/1.5 var(--sans)}
.rig p{margin:0 0 12px}
.lede{font:400 17px/1.5 var(--sans);margin:0 0 26px}
.item{padding-bottom:6px}
.item+.item{border-top:1px solid var(--ink);margin-top:30px;padding-top:26px}
.hazard{font:700 20px/1.32 var(--sans);margin:0 0 10px!important}
.rec{font:400 15px/1.5 var(--mono);color:var(--muted);overflow-wrap:anywhere;margin:14px 0 4px!important}
.cred{font:400 15.5px/1.45 var(--sans);color:var(--muted);margin:0 0 4px!important}
.cred+.hazard,.rec+.hazard{margin-top:30px!important}
.cred+p:not(.cred){margin-top:20px}
.n{font-family:var(--mono);font-size:.92em}
.nb{white-space:nowrap}

/* Boxed digits: a count reports, a bar scores. Borders only, so they print. */
.count{display:flex;flex-wrap:wrap;align-items:center;gap:4px 0;margin:16px 0 8px}
.count .g{display:inline-flex;align-items:flex-start;gap:2px;white-space:nowrap}
.count .d{display:block;width:26px;height:36px;border:2px solid var(--ink);font:700 20px/32px var(--mono);text-align:center}
.count .of{font:400 17px/36px var(--sans);padding:0 8px}
.count .c{display:block;height:36px;font:700 20px/44px var(--mono);margin:0 1px}

/* The call card: solid rules, no fill, no dashes. Rig, date and URL stay inside a screenshot. */
.call{margin:48px 0 0;padding:20px 0 18px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.call .for{font:700 15.5px/1.3 var(--sans);margin:0 0 12px}
.call .q{font:700 26px/1.28 var(--serif);margin:0 0 14px}
.call .q .n{font-weight:700;font-size:.9em}
.call .then{font:400 17px/1.5 var(--sans);margin:0 0 14px}
.call .tag{font:400 15.5px/1.4 var(--sans);color:var(--muted);margin:0}

/* Gaps for Alex. Solid, never dashed. */
.gap{display:inline;font:400 14.5px/1.5 var(--mono);background:var(--surface);border:1px solid var(--muted);padding:1px 5px;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* Forms */
.box{background:var(--surface);border:2px solid var(--ink);padding:22px 20px 18px}
.box h2{font-size:25px;margin-bottom:10px}
label,.lbl{display:block;font:700 15.5px/1.3 var(--sans);margin:0 0 6px}
select,input[type=email]{display:block;width:100%;height:50px;border:2px solid var(--ink);border-radius:0;background-color:var(--paper);color:var(--ink);font:400 17px/1 var(--sans);padding:0 12px;margin:0;-webkit-appearance:none;appearance:none}
select{background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 20px) 21px,calc(100% - 14px) 21px;background-size:6px 6px;background-repeat:no-repeat;padding-right:34px}
button.go{display:block;width:100%;height:52px;border:2px solid var(--button-bg);border-radius:0;background:var(--button-bg);color:var(--button-text);font:700 17px/1 var(--sans);cursor:pointer}
a.go{display:inline-block;padding:16px 22px;background:var(--button-bg);color:var(--button-text);font:700 17px/1.2 var(--sans);text-decoration:none}
input[type=text]{display:block;width:100%;height:50px;border:2px solid var(--ink);border-radius:0;background:var(--paper);color:var(--ink);font:400 17px/1 var(--sans);padding:0 12px;margin:0}
input[type=email]::placeholder{color:var(--muted)}
.fine{font:400 15.5px/1.45 var(--sans);margin:12px 0 0}

/* Picker */
.fields{display:grid;gap:12px;margin:0 0 18px}
.fields:not(.two){grid-template-columns:1.6fr 1fr}
.fields:not(.two)>div:first-child{grid-column:1/-1}
.fields:not(.two) .unlisted{grid-column:1/-1;grid-row:3}
.fields:not(.two) .f-year{grid-column:2;grid-row:2}
.kinds{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 16px;padding:0;border:0}
.kinds legend{font:700 15.5px/1.3 var(--sans);margin:0 0 6px;padding:0}
.kind{position:relative;display:block;margin:0;padding:10px 10px 8px;border:1px solid var(--ink);background:var(--paper);font:400 15.5px/1.2 var(--sans);cursor:pointer}
.kind svg{width:72px;height:36px;margin-bottom:6px}
.kind input{position:absolute;opacity:0;width:1px;height:1px}
.kind:has(input:checked){outline:2px solid var(--ink);outline-offset:-2px;font-weight:700}
.kind-t{display:flex;align-items:center;min-height:48px}
.note{margin:-6px 0 18px}
.unlisted summary{font:400 16px/1.3 var(--sans);text-decoration:underline;text-underline-offset:3px;cursor:pointer;list-style:none;padding:0 0 4px}
.unlisted summary::-webkit-details-marker{display:none}
.unlisted[open] summary{margin-bottom:10px}
.chassis{display:none;margin:0 0 18px;padding:0;border:0}
.chassis legend{font:700 15.5px/1.3 var(--sans);margin:0 0 6px;padding:0}
.chips{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ask:has(input[value="class-a"]:checked) .ch-a,.ask:has(input[value="class-b"]:checked) .ch-b,.ask:has(input[value="class-c"]:checked) .ch-c{display:block}
.found{font:400 17px/1.45 var(--sans);margin:0 0 14px;padding:10px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.signup-row{display:grid;gap:10px}

/* Home */
.hero{padding-block:6px 8px}
.hero h1{font-size:32px;line-height:1.16;margin:12px 0 14px}
.promise p{margin:0 0 12px}
.promise-line{font:400 21px/1.42 var(--serif);margin:0 0 14px!important}
.grid2{display:grid;gap:44px}
.ex h3{font:700 15.5px/1.3 var(--sans);margin:0 0 12px}
.ex .hazard{font-size:19px}
.subj{font:400 15.5px/1.4 var(--sans);color:var(--muted);margin:0 0 12px!important}
.qa h3{margin-bottom:4px}
.qa p{margin:0}

/* Keep-this-page block and the small print on a tracker page */
.keep p{margin:0 0 10px}
.log{list-style:none;padding:0;margin:0 0 18px}
.log li{padding:0;margin:0 0 9px}
.next{font:700 18px/1.4 var(--sans);margin:16px 0 0}
.small{font:400 15.5px/1.45 var(--sans);color:var(--muted)}
.fix{margin-top:34px}

/* A dated correction sits in the item it corrects, first line. */
.corr{font:400 17px/1.45 var(--sans);border-bottom:1px solid var(--ink);padding:0 0 12px;margin:0 0 16px!important}

/* Past emails */
.row{padding:18px 0;border-top:1px solid var(--ink)}
.row:last-of-type{border-bottom:1px solid var(--ink)}
.when{font:700 15.5px/1.3 var(--sans);margin:0 0 6px}
.row p{margin:0 0 8px}
.ghost i{display:block;height:13px;background:var(--surface);border:1px solid var(--muted);margin:0 0 8px}
.ghost i:nth-child(1){width:44%}
.ghost i:nth-child(2){width:94%}
.ghost i:nth-child(3){width:70%;margin:0}

/* One email on the web */
.issue .parts{font:400 15.5px/1.45 var(--sans);color:var(--muted);margin:0 0 14px}
.issue ul{padding-left:20px}
.issue li{margin-bottom:8px}

/* Footer: the rig parks at the end of the page. */
.foot{margin-top:72px;border-top:2px solid var(--ink);padding-block:0 26px;font:400 15.5px/1.5 var(--sans)}
.foot .parked{width:84px;height:42px;margin:-42px 0 16px}
.foot p{margin:0 0 10px}
.foot .links a{margin-right:16px}

@media (min-width:860px){
  :root{--gutter:32px}
  body{font-size:19px}
  .band-full img{max-width:520px}
  .band-slim .col{height:84px}
  .word{font-size:40px;padding-bottom:17px}
  .band-slim svg{width:112px;height:56px}
  h1{font-size:42px;line-height:1.1;margin:16px 0 12px}
  .h1-sub{font-size:19px;margin-top:8px}
  h2{font-size:31px}
  .brk{margin-top:76px;padding-top:22px}
  .soon{margin-top:44px}
  .part{margin-top:120px;padding-top:30px}
  .part>h2{font-size:36px}
  .call .q{font-size:29px}
  .fields.two{grid-template-columns:1fr 1fr}
  .box{padding:26px 26px 22px}
  .hero{display:grid;grid-template-columns:minmax(0,1fr) 560px;gap:0 64px;align-items:start;padding-block:10px 0}
  .hero h1{font-size:45px;line-height:1.1;margin:18px 0 18px}
  .promise-line{font-size:24px;line-height:1.4;margin:0 0 18px!important}
  .fields:not(.two){grid-template-columns:1.3fr 1.3fr .8fr}
  .fields:not(.two)>div:first-child{grid-column:1}
  .fields:not(.two) .f-year{grid-column:3;grid-row:1}
  .fields:not(.two) .unlisted{grid-column:2/-1;grid-row:2}
  .chips{grid-template-columns:repeat(3,1fr)}
  .kinds{grid-template-columns:repeat(4,1fr)}
  .signup-row{grid-template-columns:1fr auto}
  .signup-row button.go{width:auto;padding:0 22px;height:50px}
  .grid2{grid-template-columns:1fr 1fr;gap:44px 72px}
  .tri{grid-template-columns:1fr 1fr 1fr;gap:44px}
}

/* Step 12: what the generator adds. Same tokens, same type, no new looks. */
.lines{list-style:none;padding:0;margin:0 0 14px}
.lines li{padding:0;margin:0 0 10px}
.lines .n{white-space:nowrap}
.generic{margin-top:18px!important}
/* A folded recall: the row always shows what it is, its years, its ID and any stop instruction. */
.entries{margin-top:30px;border-bottom:1px solid var(--ink)}
.entry{border-top:1px solid var(--ink)}
.entry>summary{padding:14px 0 14px;cursor:pointer;min-height:44px}
.entry>summary::marker{font-size:.9em}
.s-line{font-weight:400}
.s-line b{font-weight:700}
.s-meta{display:block;font:400 15.5px/1.45 var(--sans);color:var(--muted);margin-top:4px}
.s-act{display:block;margin-top:8px}
.entry-body{padding:6px 0 18px}
/* A year row folds to its name and counts; every recall's stop instruction also shows in Recalls on file above it. */
.yr-d>summary{cursor:pointer;min-height:44px}
.yr-d>summary h3{display:inline;margin:0}
.yr-s{display:block;font:400 16px/1.45 var(--sans);margin-top:4px}
.yr-d[open]>summary{margin-bottom:12px}
/* Complaint numbers fold inside a year row: they are all there, and 58 of them don't take over a phone. */
.ids{margin:0 0 12px}
.ids>summary{font:400 15.5px/1.45 var(--sans);color:var(--muted);cursor:pointer;min-height:32px}
.ids .cred{overflow-wrap:anywhere;margin-top:6px!important}
.ids .n{display:inline-block;margin-right:8px}
.lbl{margin:0 0 6px}
.unlisted-off{margin:0 0 18px}
input[type=text]+.fine{margin-top:8px}
.kind.on{outline:2px solid var(--ink);outline-offset:-2px;font-weight:700}
.chassis.on{display:block}
.pick-msg{font-weight:700}
select:disabled{color:var(--muted)}
button.go:disabled{cursor:not-allowed;background:var(--surface);color:var(--muted);border-color:var(--muted)}
/* No print sheet. A print by accident stays readable: every entry open, the masthead small, nothing cut. site.js opens them; this holds with scripts off too. */
@media print{
  details::details-content{content-visibility:visible!important;display:block!important;block-size:auto!important}
  .band-full img{max-width:240px}
  .brk::before{width:100%;left:0;margin-left:0}
  .entry,.yr,.call,.box{break-inside:auto}
}
