/* Ramp Day (cedarpointmarina.org). Own design system: "galvanized steel + taillight".
   Type: Pathway Extreme (variable width/weight; condensed heavy for display, normal for text) + Share Tech Mono for readouts.
   References studied: Ford towing pages (spec numerals), Caterpillar spec sheets (ruled tables), Michelin guides (call-outs), the window sticker. */
@font-face { font-family: "Pathway Extreme"; font-style: normal; font-display: swap; font-weight: 100 900; font-stretch: 75% 100%;
  src: url(/assets/fonts/pathway-extreme-latin-standard.woff2) format("woff2-variations"), url(/assets/fonts/pathway-extreme-latin-standard.woff2) format("woff2"); }
@font-face { font-family: "Share Tech Mono"; font-style: normal; font-display: swap; font-weight: 400;
  src: url(/assets/fonts/share-tech-mono-latin-400.woff2) format("woff2"); }

:root {
  --steel-0: #EEF1F2; --steel-1: #DDE3E6; --steel-2: #C5CED3; --zinc: #8C979E;
  --ink: #12191D; --ink-2: #3C474E; --mute: #56636B; --white: #FFFFFF;
  --night: #0E1519; --night-2: #18232A; --night-3: #243440; --on-night: #E8EDEF; --on-night-2: #A9B6BD;
  --red: #C8102E; --red-d: #9B0B22; --amber: #E8890C; --amber-d: #8F5200; --green: #1D7A46; --lake: #2C6E7F;
  --yard-lot: #2A3338; --yard-line: #E9EEF0; --yard-water: #2C6E7F; --yard-ramp: #8B979D; --yard-truck: #C8102E; --yard-trailer: #B9C3C8; --yard-boat: #F4F6F7; --yard-goal: #E8890C;
  --sans: "Pathway Extreme", "Arial Narrow", Arial, sans-serif;
  --mono: "Share Tech Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;
  --wrap: 1240px; --gut: clamp(18px, 4vw, 40px);
  --r: 3px;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--sans); font-stretch: 100%; font-size: 17px; line-height: 1.6; color: var(--ink); background: var(--white); font-optical-sizing: auto; }
img, svg { max-width: 100%; }
a { color: inherit; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); }
.mono { font-family: var(--mono); letter-spacing: .02em; }
.vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--amber); color: var(--night); padding: 8px 14px; z-index: 50; font-weight: 700; }
.skip:focus { left: 8px; }
:focus-visible { outline: 3px solid var(--amber); outline-offset: 2px; }
.small { font-size: 14px; line-height: 1.5; color: var(--mute); }
.num { text-align: right; }
.noprint { }

/* ---------- header */
.hd { background: var(--night); color: var(--on-night); border-bottom: 1px solid #000; position: relative; z-index: 5; }
.hd__in { display: flex; align-items: center; gap: 28px; min-height: 76px; }
.logo { display: flex; align-items: center; gap: 12px; text-decoration: none; flex: none; }
.logo__mark { width: 40px; height: 40px; }
.logo__bg { fill: var(--red); }
.logo__ramp { stroke: var(--white); stroke-width: 3.2; stroke-linecap: round; fill: none; }
.logo__water { stroke: #7FB3C1; stroke-width: 3; stroke-linecap: round; }
.logo__ball { fill: var(--white); }
.logo__post { stroke: var(--white); stroke-width: 3; fill: none; stroke-linecap: round; }
.logo__txt { display: flex; flex-direction: column; line-height: 1; }
.logo__name { font-stretch: 75%; font-weight: 850; font-size: 26px; letter-spacing: .01em; text-transform: uppercase; }
.logo__sub { font-family: var(--mono); font-size: 11.5px; color: var(--on-night-2); margin-top: 5px; letter-spacing: .06em; }
.hd__nav { display: flex; gap: 4px; margin-left: 8px; }
.hd__nav a { text-decoration: none; padding: 8px 12px; font-weight: 600; font-size: 15.5px; color: var(--on-night-2); border-bottom: 2px solid transparent; }
.hd__nav a:hover { color: var(--white); }
.hd__nav a[aria-current="page"] { color: var(--white); border-bottom-color: var(--red); }
.hd__end { margin-left: auto; display: flex; align-items: center; gap: 14px; }
.pricetag { display: grid; grid-template-columns: auto auto; column-gap: 8px; align-items: baseline; text-decoration: none; border: 1px solid var(--night-3); border-left: 4px solid var(--amber); padding: 6px 12px; background: var(--night-2); }
.pricetag__k { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .1em; color: var(--on-night-2); }
.pricetag__v { font-weight: 800; font-stretch: 85%; font-size: 16px; color: var(--white); }
.pricetag__s { grid-column: 1 / -1; font-size: 12.5px; color: var(--on-night-2); }
.pricetag__s em { font-style: normal; color: var(--amber); font-weight: 600; }
.pricetag:hover { border-color: var(--amber); }
.hd__book { text-decoration: none; font-weight: 700; padding: 10px 16px; border: 1px solid var(--on-night-2); color: var(--white); border-radius: var(--r); white-space: nowrap; }
.hd__book:hover, .hd__book.is-on { background: var(--white); color: var(--night); }

/* ---------- buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: inherit; font-weight: 700; font-size: 16px; line-height: 1.2; padding: 12px 20px; border-radius: var(--r); border: 2px solid transparent; text-decoration: none; cursor: pointer; letter-spacing: .01em; }
.btn--lg { padding: 15px 26px; font-size: 17px; }
.btn--sm { padding: 7px 12px; font-size: 14px; }
.btn--red { background: var(--red); color: var(--white); }
.btn--red:hover { background: var(--red-d); }
.btn--ink { background: var(--ink); color: var(--white); }
.btn--ink:hover { background: var(--night-3); }
.btn--line { background: transparent; color: var(--ink); border-color: var(--ink); }
.btn--line:hover { background: var(--ink); color: var(--white); }
.btn--ghostlight { background: transparent; color: var(--white); border-color: rgba(255,255,255,.55); }
.btn--ghostlight:hover { border-color: var(--white); background: rgba(255,255,255,.08); }
.btn--quiet { background: transparent; color: var(--ink-2); border-color: var(--steel-2); }
.btn--quiet:hover { border-color: var(--ink-2); }
.textlink { color: var(--red-d); font-weight: 700; text-underline-offset: 3px; }
.cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.inline { display: inline; }

/* ---------- type */
.h2 { font-stretch: 75%; font-weight: 820; font-size: clamp(30px, 4vw, 48px); line-height: 1.02; letter-spacing: -.005em; margin: 0 0 16px; }
.h2--light { color: var(--white); }
.h3 { font-stretch: 85%; font-weight: 760; font-size: 22px; line-height: 1.15; margin: 0 0 10px; }
.body { font-size: 18px; color: var(--ink-2); max-width: 64ch; margin: 0 0 18px; }
.body--light { color: var(--on-night-2); }
.src { font-family: var(--mono); font-size: 13px; color: var(--mute); }

/* ---------- bands */
.band { padding: clamp(48px, 7vw, 96px) 0; }
.band--tight { padding: 32px 0; }
.band--steel { background: var(--steel-0); }
.band--night { background: var(--night); color: var(--on-night); }
.band--rule { border-top: 1px solid var(--steel-1); padding: 48px 0; }

/* ---------- hero */
.hero { background: linear-gradient(180deg, #F7F4EE 0%, #EDE8DF 100%); color: var(--ink); position: relative; overflow: hidden; border-bottom: 1px solid var(--steel-2); }
.hero__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 5vw, 80px); align-items: center; padding-top: clamp(40px, 6vw, 88px); padding-bottom: clamp(24px, 3vw, 40px); }
.hero__k { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; font-size: 15px; font-weight: 600; color: var(--lake); }
.hero__rule { width: 56px; height: 10px; background: repeating-linear-gradient(90deg, var(--lake) 0 2px, transparent 2px 8px); border-bottom: 2px solid var(--lake); }
.hero__h { margin: 0; font-weight: 640; font-stretch: 100%; font-size: clamp(40px, 5.2vw, 74px); line-height: 1.02; letter-spacing: -.025em; color: var(--ink); max-width: 13ch; }
.hero__lead { font-size: clamp(18px, 1.5vw, 20px); color: var(--ink-2); max-width: 54ch; margin: 22px 0 30px; }
.hero__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; }
.hero__alt { font-weight: 700; color: var(--ink); text-decoration: none; border-bottom: 2px solid var(--lake); padding: 4px 0; }
.hero__alt:hover { color: var(--lake); }
.ticket { position: relative; background: #FFFEFA; border: 1px solid #D9D2C4; box-shadow: 0 1px 0 #D9D2C4, 0 18px 40px -22px rgba(18,25,29,.45); padding: 26px 26px 20px; transform: rotate(1.2deg); }
.ticket::before, .ticket::after { content: ""; position: absolute; left: 0; right: 0; height: 10px; background: radial-gradient(circle at 6px 5px, #EDE8DF 4px, transparent 4.5px) 0 0 / 12px 10px repeat-x; }
.ticket::before { top: -5px; } .ticket::after { bottom: -5px; }
.ticket__h { display: flex; justify-content: space-between; margin: 0 0 12px; padding-bottom: 10px; border-bottom: 1px dashed var(--zinc); font-size: 13px; text-transform: uppercase; letter-spacing: .14em; color: var(--mute); }
.ticket__l { margin: 0; }
.ticket__l > div { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px dotted var(--steel-2); }
.ticket__l dt { color: var(--ink-2); font-size: 15px; }
.ticket__l dd { margin: 0; font-size: 17px; }
.ticket__weak { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 16px 0 0; font-size: 17px; }
.ticket__weak .mono { font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: var(--mute); }
.ticket__stamp { font-family: var(--mono); font-size: 15px; text-transform: uppercase; padding: 2px 10px; border: 2px solid currentColor; transform: rotate(-4deg); }
.ticket__stamp--over { color: var(--red); } .ticket__stamp--close { color: var(--amber-d); } .ticket__stamp--ok { color: var(--green); }
.ticket__do { margin: 10px 0 0; font-weight: 700; color: var(--red-d); }
.ticket__price { margin: 16px 0 0; padding-top: 12px; border-top: 1px dashed var(--zinc); font-size: 14px; color: var(--ink-2); }
.hero__art { line-height: 0; }
.hero__art svg { width: 100%; height: clamp(200px, 26vw, 340px); display: block; }
.hs-0 { stop-color: #EDE8DF; } .hs-1 { stop-color: #D7E3E6; }
.h-sun { fill: #F2C14E; opacity: .9; }
.h-shore { fill: #9FB4A3; }
.h-ramp { fill: #B9B3A8; } .h-rampedge { stroke: #8E887D; stroke-width: 3; } .h-grooves { stroke: #9C968B; stroke-width: 2; stroke-dasharray: 3 14; }
.h-truck path { fill: #C8102E; } .h-truck .h-glass, .h-glass { fill: #12191D; }
.h-tire { fill: #1B2328; } .h-hub { fill: #9AA6AD; }
.h-steel { fill: #C5CED3; } .h-red { fill: #E8EDEF; } .h-frame { stroke: #C5CED3; stroke-width: 7; fill: none; }
.h-boat { fill: #FFFFFF; stroke: #3C474E; stroke-width: 2; } .h-trim { stroke: #2C6E7F; stroke-width: 5; } .h-motor { fill: #24313A; }
.h-chain { stroke: none; } .h-taillight { fill: #FF5A3C; }
.hw-0 { stop-color: #4F8E9C; } .hw-1 { stop-color: #2C6E7F; }
.h-ripple { stroke: rgba(255,255,255,.35); stroke-width: 2; stroke-linecap: round; }
.specrow { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; border-top: 2px solid var(--ink); }
.specrow > div { padding: 22px 20px 30px 0; border-right: 1px solid var(--steel-2); }
.specrow > div + div { padding-left: 22px; }
.specrow > div:last-child { border-right: 0; }
.specrow dt { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: var(--mute); }
.specrow dd { margin: 4px 0 2px; font-size: clamp(34px, 4vw, 52px); line-height: 1; color: var(--ink); }
.specrow p { margin: 0; font-size: 14px; color: var(--ink-2); }

/* ---------- the chain (home) */
.split { display: grid; grid-template-columns: 5fr 7fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
.links { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; counter-reset: l; }
.links__i { position: relative; display: grid; grid-template-columns: 44px 1fr; grid-template-rows: auto auto; column-gap: 12px; padding: 16px 18px; background: var(--white); border: 2px solid var(--ink); border-radius: 28px; margin: 0 0 -2px; }
.links__i:nth-child(odd) { margin-right: -2px; }
.links__n { grid-row: 1 / 3; align-self: center; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--steel-1); font-size: 15px; }
.links__name { font-weight: 760; font-stretch: 88%; font-size: 18px; line-height: 1.2; }
.links__where { font-size: 14px; color: var(--mute); }
.links__i:last-child { border-color: var(--red); }
.links__i:last-child .links__n { background: var(--red); color: var(--white); }

/* ---------- worked example */
.exhead { display: grid; grid-template-columns: 1fr auto; gap: 8px 40px; align-items: end; margin-bottom: 26px; }
.exhead .h2 { grid-column: 1 / -1; }
.exhead .body { margin: 0; }

/* chain table */
.chainx { overflow-x: auto; border-top: 3px solid var(--ink); }
.chainx__t { width: 100%; border-collapse: collapse; font-size: 15.5px; min-width: 720px; }
.chainx__t th, .chainx__t td { padding: 12px 10px; border-bottom: 1px solid var(--steel-1); vertical-align: middle; text-align: left; }
.chainx__t thead th { font-family: var(--mono); font-weight: 400; font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: var(--mute); border-bottom: 1px solid var(--steel-2); }
.chainx__t .num { text-align: right; white-space: nowrap; }
.chainx__l { font-weight: 700; }
.chainx__src { display: block; font-family: var(--mono); font-size: 12px; color: var(--mute); font-weight: 400; }
.chainx__wk { display: inline-block; font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; background: var(--ink); color: var(--white); padding: 1px 6px; margin-left: 4px; vertical-align: 2px; }
.chainx__what { color: var(--mute); font-size: 14px; }
.chainx__barh { width: 34%; }
.chainx__bar { white-space: nowrap; }
.chainx__pct { display: inline-block; width: 46px; text-align: right; margin-left: 8px; }
.is-weak { background: #FFF6EA; }
.meter { display: inline-block; position: relative; width: calc(100% - 140px); min-width: 90px; height: 10px; background: var(--steel-1); vertical-align: middle; }
.meter__fill { position: absolute; left: 0; top: 0; bottom: 0; background: var(--green); }
.is-close .meter__fill { background: var(--amber); }
.is-over .meter__fill { background: var(--red); }
.meter__line { position: absolute; left: 90%; top: -4px; bottom: -4px; border-left: 2px dotted var(--ink-2); }
.flag { display: inline-block; font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; padding: 2px 7px; margin-left: 6px; border: 1.5px solid currentColor; }
.flag--ok { color: var(--green); } .flag--close { color: var(--amber-d); } .flag--over { color: var(--white); background: var(--red); border-color: var(--red); }

/* ---------- ramp run teaser (home) */
.runhead { max-width: 760px; margin-bottom: 36px; }
.run { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); border-top: 2px solid var(--amber); }
.run__st { padding: 18px 16px 0 0; position: relative; }
.run__st::before { content: ""; position: absolute; top: -8px; left: 0; width: 14px; height: 14px; border-radius: 50%; background: var(--night); border: 2px solid var(--amber); }
.run__when { margin: 6px 0 2px; font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: var(--amber); }
.run__t { margin: 0 0 8px; font-stretch: 80%; font-weight: 800; font-size: 22px; color: var(--white); }
.run__first { margin: 0 0 8px; font-size: 14.5px; color: var(--on-night-2); }
.run__n { margin: 0; font-size: 13px; color: var(--on-night); }

/* ---------- yard teaser */
.yardteaser { display: grid; grid-template-columns: 1fr 1.3fr; gap: clamp(28px, 5vw, 72px); align-items: center; }
.yardteaser__art { width: 100%; height: auto; border: 2px solid var(--ink); }
.yt-lot { fill: #2A3338; } .yt-wfill { fill: #2C6E7F; } .yt-water { stroke: #9CC3CE; stroke-width: 2; }
.yt-lane { stroke: #E9EEF0; stroke-width: 3; } .yt-path { stroke: #E8890C; stroke-width: 2; stroke-dasharray: 6 6; fill: none; }
.yt-trailer { fill: #F4F6F7; } .yt-truck { fill: #C8102E; }

/* ---------- window sticker (pricing) */
.sticker { border: 2px solid var(--ink); background: var(--white); margin-top: 28px; max-width: 980px; }
.sticker__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 14px 20px; background: var(--ink); color: var(--white); }
.sticker__brand { margin: 0; font-stretch: 75%; font-weight: 850; text-transform: uppercase; font-size: 22px; }
.sticker__doc { margin: 0; font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .14em; color: var(--on-night-2); }
.sticker__grid { display: grid; grid-template-columns: 1fr 1fr 260px; }
.sticker__col { padding: 20px; border-right: 1px solid var(--steel-2); }
.sticker__h { margin: 0 0 12px; font-family: var(--mono); font-weight: 400; font-size: 13px; text-transform: uppercase; letter-spacing: .12em; color: var(--mute); display: flex; justify-content: space-between; border-bottom: 1px solid var(--ink); padding-bottom: 8px; }
.sticker__h span { color: var(--ink); }
.sticker__list { list-style: none; margin: 0; padding: 0; }
.sticker__list li { padding: 7px 0 7px 22px; border-bottom: 1px dotted var(--steel-2); position: relative; font-size: 15.5px; }
.sticker__list li::before { content: ""; position: absolute; left: 2px; top: 15px; width: 9px; height: 9px; background: var(--ink); }
.sticker__col--opt .sticker__list li::before { background: var(--red); }
.sticker__total { padding: 20px; background: var(--steel-0); }
.sticker__k { margin: 0; font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: var(--mute); }
.sticker__v { margin: 0 0 14px; font-stretch: 75%; font-weight: 880; font-size: 48px; line-height: 1; }
.sticker__fine { margin: 0; font-size: 13px; color: var(--mute); }
.sticker__pv { margin: 0; padding: 14px 20px; border-top: 2px dashed var(--amber); background: #FFF6EA; font-size: 15px; }

/* ---------- sources strip */
.sources__l { list-style: none; padding: 0; margin: 12px 0 18px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 36px; }
.sources__l li { font-size: 15px; color: var(--ink-2); padding-left: 14px; border-left: 3px solid var(--steel-2); }

/* ---------- tool pages */
.toolhead { background: var(--night); color: var(--on-night); padding: clamp(32px, 5vw, 60px) 0 clamp(28px, 4vw, 44px); border-bottom: 4px solid var(--red); }
.toolhead__in { display: flex; gap: 24px; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; }
.toolhead__k { margin: 0 0 10px; font-size: 13px; text-transform: uppercase; letter-spacing: .14em; color: var(--amber); }
.toolhead__k a { color: inherit; }
.toolhead__h { margin: 0; font-stretch: 75%; font-weight: 860; font-size: clamp(36px, 5.4vw, 66px); line-height: .98; color: var(--white); max-width: 22ch; }
.toolhead__lead { margin: 14px 0 0; color: var(--on-night-2); font-size: 18px; max-width: 62ch; }
.toolhead__act { display: flex; gap: 10px; flex-wrap: wrap; }
.toolhead .btn--line { color: var(--white); border-color: rgba(255,255,255,.6); }
.toolhead .btn--line:hover { background: var(--white); color: var(--night); }
.toolhead .cta { margin-top: 20px; }

.note { padding: 12px 16px; border-left: 4px solid var(--zinc); background: var(--steel-0); margin: 16px 0; font-size: 15.5px; }
.note--ok { border-left-color: var(--green); background: #EAF5EF; }
.note--warn { border-left-color: var(--red); background: #FCECEE; }
.verdict { display: grid; grid-template-columns: 240px 1fr; gap: 8px 24px; align-items: center; padding: 18px 22px; border: 2px solid var(--ink); margin-bottom: 24px; }
.verdict__k { margin: 0; font-size: 14px; text-transform: uppercase; letter-spacing: .1em; font-weight: 400; }
.verdict__t { margin: 0; font-size: 18px; }
.verdict--over { border-color: var(--red); } .verdict--over .verdict__k { color: var(--red); }
.verdict--close { border-color: var(--amber); } .verdict--close .verdict__k { color: var(--amber-d); }
.verdict__pro { grid-column: 2; margin: 0; font-size: 15.5px; color: var(--ink-2); }
.verdict--ok { border-color: var(--green); } .verdict--ok .verdict__k { color: var(--green); }
.drawing { margin: 0 0 24px; background: var(--steel-0); border: 1px solid var(--steel-1); }
.drawing figcaption { font-size: 13px; color: var(--mute); padding: 8px 14px; border-top: 1px solid var(--steel-1); }
.elev { display: block; width: 100%; height: auto; }
.elev__grid { stroke: #DCE2E5; stroke-width: 1; }
.elev__ground { stroke: var(--ink); stroke-width: 2; }
.elev__veh path { fill: #8C979E; } .elev__veh .elev__glass { fill: #3C474E; } .elev__veh .elev__line { stroke: #6E7A81; stroke-width: 2; fill: none; }
.elev__tire { fill: var(--ink); } .elev__hub { fill: var(--steel-2); }
.elev__steel { fill: var(--ink-2); } .elev__frame { stroke: var(--ink-2); stroke-width: 7; fill: none; } .elev__fender { stroke: var(--ink-2); stroke-width: 4; fill: none; }
.elev__boat path { fill: var(--white); stroke: var(--ink-2); stroke-width: 2; } .elev__boat .elev__trim { stroke: var(--lake); stroke-width: 5; fill: none; } .elev__boat .elev__glass { fill: #3C474E; stroke: none; }
.elev__boat .elev__motor { fill: var(--ink-2); stroke: none; } .elev__boat .elev__line { stroke: var(--ink-2); stroke-width: 3; fill: none; }
.elev__load path { stroke: var(--ink); stroke-width: 2.5; fill: none; }
.elev__k { font-family: var(--mono); font-size: 14px; fill: var(--mute); }
.elev__v { font-family: var(--sans); font-stretch: 80%; font-weight: 800; font-size: 26px; fill: var(--ink); }
.elev__weak circle { fill: none; stroke-width: 4; stroke-dasharray: 6 4; } .elev__weak path { stroke-width: 2; stroke-dasharray: 3 3; }
.elev__weak text { font-family: var(--mono); font-size: 14px; }
.elev__weak--over circle, .elev__weak--over path { stroke: var(--red); } .elev__weak--over text { fill: var(--red); }
.elev__weak--close circle, .elev__weak--close path { stroke: var(--amber); } .elev__weak--close text { fill: var(--amber-d); }
.elev__weak--ok circle, .elev__weak--ok path { stroke: var(--green); } .elev__weak--ok text { fill: var(--green); }
.readouts { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0 0 30px; border: 1px solid var(--steel-2); }
.readouts > div { padding: 16px 18px; border-right: 1px solid var(--steel-2); }
.readouts > div:last-child { border-right: 0; }
.readouts dt { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: var(--mute); }
.readouts dd { margin: 4px 0; font-size: 30px; line-height: 1.1; }
.readouts p { margin: 0; font-size: 13.5px; color: var(--mute); }
.sect { margin-top: 30px; }
.cols2 { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.loadt { width: 100%; border-collapse: collapse; font-size: 15.5px; }
.loadt th, .loadt td { padding: 9px 0; border-bottom: 1px solid var(--steel-1); text-align: left; font-weight: 400; }
.loadt td { text-align: right; }
.loadt tfoot th, .loadt tfoot td { border-top: 2px solid var(--ink); border-bottom: 0; font-weight: 700; }
.tongue { font-size: 16px; padding: 14px 16px; border-left: 4px solid var(--zinc); background: var(--steel-0); }
.tongue .mono { font-size: 24px; display: block; }
.tongue--low, .tongue--high { border-left-color: var(--red); }
.tongue--boat, .tongue--deq, .tongue--between { border-left-color: var(--green); }
.law { list-style: none; padding: 0; margin: 0; }
.law li { padding: 10px 0 10px 14px; border-left: 3px solid var(--steel-2); margin-bottom: 8px; font-size: 15px; }
.law li.is-flag { border-left-color: var(--red); }
.law__c { display: block; font-size: 12.5px; color: var(--mute); }
.saverow { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-top: 36px; padding: 22px 24px; border: 2px solid var(--ink); background: var(--white); flex-wrap: wrap; }
.saverow .small { max-width: 70ch; margin: 0; }

/* form */
.rigform .h2 { margin-bottom: 24px; }
.grp { border: 0; border-top: 2px solid var(--ink); margin: 0 0 26px; padding: 14px 0 0; }
.grp legend { font-stretch: 85%; font-weight: 760; font-size: 20px; padding: 0 12px 0 0; }
.grp__n { color: var(--red); margin-right: 8px; font-size: 16px; }
.grp__opt { font-family: var(--mono); font-size: 12px; font-weight: 400; color: var(--mute); margin-left: 8px; text-transform: uppercase; letter-spacing: .08em; }
.grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px 22px; }
.fld { display: flex; flex-direction: column; gap: 5px; margin-bottom: 4px; }
.fld label { font-weight: 650; font-size: 14.5px; }
.fld__box { display: flex; align-items: stretch; background: var(--white); border: 1.5px solid var(--zinc); border-radius: var(--r); }
.fld__box:focus-within { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(232,137,12,.35); }
.fld__box input, .fld__box select { flex: 1; min-width: 0; border: 0; background: transparent; font: inherit; font-size: 16.5px; padding: 10px 12px; color: var(--ink); }
.fld__box input:focus, .fld__box select:focus { outline: none; }
.fld__u { font-family: var(--mono); font-size: 13px; color: var(--mute); display: flex; align-items: center; padding: 0 12px; border-left: 1px solid var(--steel-1); background: var(--steel-0); }
.fld__h { font-size: 13px; color: var(--mute); }
.fld__e { font-size: 13px; color: var(--red-d); font-weight: 600; }
.fld--bad .fld__box { border-color: var(--red); }
.fld textarea { font: inherit; font-size: 16px; padding: 10px 12px; border: 1.5px solid var(--zinc); border-radius: var(--r); resize: vertical; min-height: 140px; }
.rigform__go { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; padding-top: 6px; }
.check { display: flex; gap: 10px; align-items: center; margin: 10px 0 16px; }

/* ramp run */
.opts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px 28px; align-items: end; }
.opts__g { border: 0; padding: 0; margin: 0; min-width: 0; }
.opts__g legend { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: var(--mute); margin-bottom: 6px; }
.opts > .btn { justify-self: start; }
.seg { display: flex; flex-wrap: wrap; gap: 6px; }
.seg__o { position: relative; }
.seg__o input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.seg__o span { display: block; padding: 7px 12px; border: 1.5px solid var(--steel-2); background: var(--white); font-size: 14.5px; font-weight: 600; border-radius: 40px; }
.seg__o input:checked + span { background: var(--ink); border-color: var(--ink); color: var(--white); }
.seg__o input:focus-visible + span { outline: 3px solid var(--amber); outline-offset: 2px; }
.seg--dark .seg__o span { background: transparent; color: var(--on-night); border-color: var(--night-3); }
.seg--dark .seg__o input:checked + span { background: var(--amber); color: var(--night); border-color: var(--amber); }
.stages { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.stage { display: grid; grid-template-columns: 300px 1fr; gap: 28px; padding: 26px 0; border-top: 2px solid var(--ink); }
.stage__h { display: flex; gap: 16px; align-items: flex-start; position: sticky; top: 12px; align-self: start; }
.stage__n { font-size: 40px; line-height: 1; color: var(--red); }
.stage__when { margin: 0; font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: var(--mute); }
.stage__t { margin: 2px 0 0; font-stretch: 75%; font-weight: 840; font-size: 32px; line-height: 1; }
.stage.is-done .stage__n { color: var(--green); }
.steps { list-style: none; margin: 0; padding: 0; }
.steps__i { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; padding: 11px 0; border-bottom: 1px solid var(--steel-1); }
.steps__i label { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; flex: 1; }
.steps__c { width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--green); flex: none; }
.steps__txt { font-size: 16.5px; }
.steps__i.is-done .steps__txt { color: var(--mute); text-decoration: line-through; text-decoration-color: var(--zinc); }
.tagsrc { flex: none; font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; padding: 2px 7px; border: 1px solid var(--steel-2); color: var(--mute); white-space: nowrap; }
.tagsrc--ohcm { border-color: var(--lake); color: var(--lake); }
.tagsrc--site { border-style: dashed; }
.tagsrc--own { border-color: var(--red); color: var(--red-d); }
.ownbox { margin-top: 28px; border-top: 1px solid var(--steel-2); padding-top: 14px; }

/* backing yard */
.yard { display: grid; grid-template-columns: 1fr 320px; gap: 28px; align-items: start; }
.yard__stage { position: relative; }
.yard__cv { display: block; width: 100%; height: auto; aspect-ratio: 45 / 28; background: #2A3338; border: 1px solid var(--night-3); touch-action: none; }
.yard__msg { margin: 10px 0 0; color: var(--amber); font-size: 15px; min-height: 1.6em; }
.yard__ctl { color: var(--on-night); }
.yard__lanes { border: 0; padding: 0; margin: 0 0 18px; }
.yard__lanes legend, .wheel__l { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: var(--on-night-2); margin-bottom: 8px; display: block; }
.wheel input[type="range"] { width: 100%; accent-color: var(--amber); }
.wheel__b { display: flex; gap: 6px; margin: 8px 0 18px; }
.pedals { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pedals .btn { user-select: none; -webkit-user-select: none; touch-action: none; padding-left: 8px; padding-right: 8px; }
.yard__reset { margin-top: 10px; color: var(--on-night-2); border-color: var(--night-3); }
.yard__stats { display: grid; grid-template-columns: repeat(3, 1fr); margin: 18px 0 0; border-top: 1px solid var(--night-3); }
.yard__stats div { padding: 10px 0; }
.yard__stats dt { font-size: 11px; text-transform: uppercase; letter-spacing: .1em; color: var(--on-night-2); }
.yard__stats dd { margin: 2px 0 0; font-size: 22px; color: var(--white); }
.yard__keys { color: var(--on-night-2); }

/* book */
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.panel { background: var(--white); border: 1px solid var(--steel-2); border-top: 4px solid var(--ink); padding: 22px 24px; }
.panel.narrow { max-width: 620px; }
.keylink { margin-bottom: 24px; border-top-color: var(--amber); }
.keylink__row { display: flex; gap: 8px; }
.keylink__row input { flex: 1; min-width: 0; font-family: var(--mono); font-size: 14px; padding: 10px; border: 1.5px solid var(--zinc); border-radius: var(--r); }
.rigs { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--ink); }
.rigs__i { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--steel-2); flex-wrap: wrap; }
.rigs__t { margin: 0; font-stretch: 85%; font-weight: 760; font-size: 22px; }
.rigs__t a { text-decoration: none; }
.rigs__t a:hover { text-decoration: underline; }
.rigs__m { margin: 2px 0 0; font-size: 14px; color: var(--mute); }
.rigs__act, .actions { display: flex; gap: 8px; flex-wrap: wrap; }
.passrow { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: 26px; padding: 18px 22px; background: var(--white); border: 2px solid var(--ink); flex-wrap: wrap; }
.passrow .small { margin: 0; }
.bookfoot { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 28px; }
.tix { width: 100%; border-collapse: collapse; font-size: 15px; margin-bottom: 18px; }
.tix th, .tix td { padding: 8px 6px; border-bottom: 1px solid var(--steel-1); text-align: left; }
.tix thead th { font-family: var(--mono); font-weight: 400; font-size: 11.5px; text-transform: uppercase; letter-spacing: .08em; color: var(--mute); }
.tix .num { text-align: right; }
.tixform { border-top: 1px solid var(--steel-2); padding-top: 14px; }
.tixform .btn { margin: 8px 0 6px; }

/* prose pages */
.prose { max-width: 820px; }
.prose p, .prose li { font-size: 17.5px; color: var(--ink-2); }
.prose .h2 { margin-top: 44px; font-size: clamp(28px, 3vw, 38px); }
.prose .h2:first-child { margin-top: 0; }
.gloss { display: grid; grid-template-columns: 110px 1fr; gap: 0; border-top: 2px solid var(--ink); margin: 0 0 18px; }
.gloss dt, .gloss dd { padding: 12px 0; border-bottom: 1px solid var(--steel-1); margin: 0; }
.gloss dt { font-family: var(--mono); font-size: 16px; color: var(--red-d); }
.plain { border-collapse: collapse; min-width: 320px; margin: 8px 0; }
.plain th, .plain td { border-bottom: 1px solid var(--steel-1); padding: 8px 14px 8px 0; text-align: left; }
.plain .num { text-align: right; }
.faq { max-width: 820px; margin-top: 44px; }
.faq dl { margin: 0; border-top: 2px solid var(--ink); }
.faq dt { font-weight: 760; font-size: 18px; padding-top: 14px; }
.faq dd { margin: 4px 0 0; padding-bottom: 14px; border-bottom: 1px solid var(--steel-1); color: var(--ink-2); }

/* glovebox card */
.printbar { background: var(--steel-0); border-bottom: 1px solid var(--steel-1); }
.printbar__in { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-top: 14px; padding-bottom: 14px; flex-wrap: wrap; }
.printbar__in p { margin: 0; }
.cards { padding-top: 28px; padding-bottom: 48px; display: grid; gap: 28px; }
.gcard { border: 2px solid var(--ink); padding: 0; background: var(--white); break-inside: avoid; max-width: 980px; }
.gcard__h { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; background: var(--ink); color: var(--white); padding: 14px 18px; flex-wrap: wrap; }
.gcard__brand { margin: 0; font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: var(--on-night-2); }
.gcard__t { margin: 2px 0 0; font-stretch: 75%; font-weight: 850; font-size: 30px; line-height: 1.05; }
.gcard__v { margin: 0; font-family: var(--mono); font-size: 14px; padding: 4px 10px; border: 1.5px solid var(--white); }
.gcard__v--over { background: var(--red); border-color: var(--red); } .gcard__v--close { background: var(--amber); color: var(--night); border-color: var(--amber); }
.gcard__warn { padding: 10px 18px; border-bottom: 1px solid var(--steel-2); border-left: 6px solid var(--ink); }
.gcard__warn--over { border-left-color: var(--red); background: #FBEAEC; } .gcard__warn--close { border-left-color: var(--amber); background: #FDF3E4; }
.gcard__warn p { margin: 2px 0; font-size: 14.5px; }
.gcard__vt strong { color: var(--red-d); text-transform: uppercase; letter-spacing: .04em; }
.gcard__law .mono { font-size: 12.5px; margin-right: 4px; }
.gcard__pro { color: var(--ink-2); font-size: 13.5px !important; }
.gcard__draw { border-bottom: 1px solid var(--steel-2); }
.gcard__cols { display: grid; grid-template-columns: 1fr 1.3fr; }
.gcard__t2 { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.gcard__t2 + .gcard__t2 { border-left: 1px solid var(--steel-2); }
.gcard__t2 caption { text-align: left; font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: var(--mute); padding: 10px 14px 4px; }
.gcard__t2 th, .gcard__t2 td { padding: 6px 14px; border-bottom: 1px solid var(--steel-1); text-align: left; font-weight: 400; }
.gcard__t2 td { text-align: right; }
.gcard__t2 tr.is-over th { color: var(--red-d); font-weight: 700; }
.gcard__foot { margin: 0; padding: 10px 14px; font-size: 12px; color: var(--mute); border-top: 1px solid var(--steel-2); }

/* footer */
.ft { background: var(--night); color: var(--on-night-2); padding: 56px 0 0; margin-top: 0; }
.ft__in { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 40px; }
.ft__name { margin: 0 0 8px; font-stretch: 75%; font-weight: 850; font-size: 26px; text-transform: uppercase; color: var(--white); }
.ft__ind { margin: 0 0 10px; color: var(--on-night); font-size: 15px; }
.ft__note { margin: 0; font-size: 14px; max-width: 60ch; }
.ft__nav { display: flex; flex-direction: column; gap: 6px; }
.ft__h { margin: 0 0 4px; font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: var(--amber); }
.ft__nav a { color: var(--on-night); text-decoration: none; font-size: 15px; }
.ft__nav a:hover { text-decoration: underline; }
.ft__base { display: flex; justify-content: space-between; gap: 16px; margin-top: 40px; padding-top: 18px; padding-bottom: 22px; border-top: 1px solid var(--night-3); font-size: 14px; }
.ft__base p { margin: 0; }
.ft__base a { color: var(--white); }

/* phone: sticky "Check my rig" */
.fab { display: none; }

@media (max-width: 1100px) {
  .hd__in { flex-wrap: wrap; gap: 10px 18px; padding-top: 12px; padding-bottom: 0; }
  .hd__nav { order: 3; width: calc(100% + 2 * var(--gut)); margin: 0 calc(-1 * var(--gut)); padding: 0 var(--gut); overflow-x: auto; border-top: 1px solid var(--night-3); scrollbar-width: none; }
  .hd__nav a { padding: 12px 10px; white-space: nowrap; }
  .run { grid-template-columns: repeat(3, 1fr); row-gap: 28px; }
  .sticker__grid { grid-template-columns: 1fr 1fr; }
  .sticker__total { grid-column: 1 / -1; display: grid; grid-template-columns: auto auto; column-gap: 24px; justify-content: start; }
  .sticker__fine { grid-column: 1 / -1; }
  .yard { grid-template-columns: 1fr; }
  .opts { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  body { font-size: 16px; }
  .hd__in { min-height: 0; }
  .logo__name { font-size: 22px; }
  .logo__sub { display: none; }
  .hd__end { display: contents; }
  .hd__book { order: 1; margin-left: auto; }
  .hd__nav { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0 6px; overflow: visible; }
  .hd__nav a { padding: 11px 0; font-size: 14px; }
  .pricetag { order: 4; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; width: calc(100% + 2 * var(--gut)); margin: 0 calc(-1 * var(--gut)); padding: 7px var(--gut); border: 0; border-top: 1px solid var(--night-3); border-left: 4px solid var(--amber); }
  .pricetag__s { font-size: 12.5px; }
  .hero__grid { grid-template-columns: 1fr; }
  .ticket { transform: none; }
  .verdict__pro { grid-column: auto; }
  .hd__book { padding: 8px 10px; font-size: 14px; }
  .hero__art { margin-top: 10px; }
  .specrow { grid-template-columns: 1fr 1fr; }
  .specrow > div { padding: 16px 12px 18px 0; }
  .specrow > div:nth-child(2) { border-right: 0; }
  .specrow > div:nth-child(3) { padding-left: 0; }
  .specrow > div:nth-child(n+3) { border-top: 1px solid var(--steel-2); }
  .split, .yardteaser, .cols2, .duo, .exhead { grid-template-columns: 1fr; }
  .links { grid-template-columns: 1fr; }
  .links__i:nth-child(odd) { margin-right: 0; }
  .run { grid-template-columns: 1fr; border-top: 0; border-left: 2px solid var(--amber); padding-left: 18px; }
  .run__st { padding: 0 0 4px; }
  .run__st::before { left: -27px; top: 4px; }
  .sticker__grid { grid-template-columns: 1fr; }
  .sticker__col { border-right: 0; border-bottom: 1px solid var(--steel-2); }
  .sticker__total { grid-template-columns: 1fr 1fr; }
  .sources__l { grid-template-columns: 1fr; }
  .verdict { grid-template-columns: 1fr; }
  .readouts { grid-template-columns: 1fr 1fr; }
  .readouts > div:nth-child(2) { border-right: 0; }
  .readouts > div:nth-child(n+3) { border-top: 1px solid var(--steel-2); }
  .readouts dd { font-size: 24px; }
  .grid3 { grid-template-columns: 1fr; }
  .opts { grid-template-columns: 1fr; }
  .stage { grid-template-columns: 1fr; gap: 10px; }
  .stage__h { position: static; }
  .steps__i { flex-direction: column; gap: 6px; }
  .tagsrc { margin-left: 34px; white-space: normal; }
  .gcard__cols { grid-template-columns: 1fr; }
  .gcard__t2 + .gcard__t2 { border-left: 0; }
  .ft__in { grid-template-columns: 1fr 1fr; }
  .ft__lead { grid-column: 1 / -1; }
  .gloss { grid-template-columns: 80px 1fr; }
  .hero__art svg { height: 190px; }
  .chainx__t { min-width: 0; }
  .chainx__t thead { display: none; }
  .chainx__t tr { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--steel-1); }
  .chainx__t th, .chainx__t td { border: 0; padding: 2px 0; }
  .chainx__t th { grid-column: 1 / -1; }
  .chainx__t .chainx__what { display: none; }
  .chainx__t td.num { text-align: left; font-size: 14px; }
  .chainx__t td.num::before { content: attr(data-l); display: block; font-size: 10.5px; text-transform: uppercase; letter-spacing: .1em; color: var(--mute); }
  .chainx__t .chainx__bar { grid-column: 1 / -1; padding-top: 6px; }
  .is-weak { padding-left: 8px !important; padding-right: 8px !important; }
  .fab { display: block; position: fixed; left: 50%; transform: translateX(-50%); bottom: 14px; z-index: 20; background: var(--red); color: var(--white); text-decoration: none; font-weight: 800; padding: 13px 26px; border-radius: 40px; box-shadow: 0 8px 22px rgba(14,21,25,.35); white-space: nowrap; }
  .ft { padding-bottom: 64px; }
  .keylink__row { flex-direction: column; }
  .tix { font-size: 13.5px; }
}

/* print: the card, the run, nothing else */
@media print {
  .hd, .ft, .fab, .noprint, .skip, .toolhead__act { display: none !important; }
  body { font-size: 12pt; }
  .toolhead { background: none; color: var(--ink); border-bottom: 2px solid var(--ink); padding: 0 0 8px; }
  .toolhead__h { color: var(--ink); font-size: 24pt; }
  .toolhead__lead, .toolhead__k { color: var(--ink-2); }
  .band { padding: 12px 0; }
  .stage { grid-template-columns: 160px 1fr; padding: 10px 0; break-inside: avoid; }
  .stage__t { font-size: 18pt; }
  .cards { padding: 0; }
  .gcard { break-inside: avoid; margin-bottom: 12px; }
  .gcard__h { background: none; color: var(--ink); border-bottom: 2px solid var(--ink); }
  .gcard__brand { color: var(--ink-2); }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }
/* meter widths (no inline styles: CSP) */
.meter__fill--0 { width: 0%; } .meter__fill--1 { width: 1%; } .meter__fill--2 { width: 2%; } .meter__fill--3 { width: 3%; } .meter__fill--4 { width: 4%; } .meter__fill--5 { width: 5%; } .meter__fill--6 { width: 6%; } .meter__fill--7 { width: 7%; } .meter__fill--8 { width: 8%; } .meter__fill--9 { width: 9%; } .meter__fill--10 { width: 10%; } .meter__fill--11 { width: 11%; } .meter__fill--12 { width: 12%; } .meter__fill--13 { width: 13%; } .meter__fill--14 { width: 14%; } .meter__fill--15 { width: 15%; } .meter__fill--16 { width: 16%; } .meter__fill--17 { width: 17%; } .meter__fill--18 { width: 18%; } .meter__fill--19 { width: 19%; } .meter__fill--20 { width: 20%; } .meter__fill--21 { width: 21%; } .meter__fill--22 { width: 22%; } .meter__fill--23 { width: 23%; } .meter__fill--24 { width: 24%; } .meter__fill--25 { width: 25%; } .meter__fill--26 { width: 26%; } .meter__fill--27 { width: 27%; } .meter__fill--28 { width: 28%; } .meter__fill--29 { width: 29%; } .meter__fill--30 { width: 30%; } .meter__fill--31 { width: 31%; } .meter__fill--32 { width: 32%; } .meter__fill--33 { width: 33%; } .meter__fill--34 { width: 34%; } .meter__fill--35 { width: 35%; } .meter__fill--36 { width: 36%; } .meter__fill--37 { width: 37%; } .meter__fill--38 { width: 38%; } .meter__fill--39 { width: 39%; } .meter__fill--40 { width: 40%; } .meter__fill--41 { width: 41%; } .meter__fill--42 { width: 42%; } .meter__fill--43 { width: 43%; } .meter__fill--44 { width: 44%; } .meter__fill--45 { width: 45%; } .meter__fill--46 { width: 46%; } .meter__fill--47 { width: 47%; } .meter__fill--48 { width: 48%; } .meter__fill--49 { width: 49%; } .meter__fill--50 { width: 50%; } .meter__fill--51 { width: 51%; } .meter__fill--52 { width: 52%; } .meter__fill--53 { width: 53%; } .meter__fill--54 { width: 54%; } .meter__fill--55 { width: 55%; } .meter__fill--56 { width: 56%; } .meter__fill--57 { width: 57%; } .meter__fill--58 { width: 58%; } .meter__fill--59 { width: 59%; } .meter__fill--60 { width: 60%; } .meter__fill--61 { width: 61%; } .meter__fill--62 { width: 62%; } .meter__fill--63 { width: 63%; } .meter__fill--64 { width: 64%; } .meter__fill--65 { width: 65%; } .meter__fill--66 { width: 66%; } .meter__fill--67 { width: 67%; } .meter__fill--68 { width: 68%; } .meter__fill--69 { width: 69%; } .meter__fill--70 { width: 70%; } .meter__fill--71 { width: 71%; } .meter__fill--72 { width: 72%; } .meter__fill--73 { width: 73%; } .meter__fill--74 { width: 74%; } .meter__fill--75 { width: 75%; } .meter__fill--76 { width: 76%; } .meter__fill--77 { width: 77%; } .meter__fill--78 { width: 78%; } .meter__fill--79 { width: 79%; } .meter__fill--80 { width: 80%; } .meter__fill--81 { width: 81%; } .meter__fill--82 { width: 82%; } .meter__fill--83 { width: 83%; } .meter__fill--84 { width: 84%; } .meter__fill--85 { width: 85%; } .meter__fill--86 { width: 86%; } .meter__fill--87 { width: 87%; } .meter__fill--88 { width: 88%; } .meter__fill--89 { width: 89%; } .meter__fill--90 { width: 90%; } .meter__fill--91 { width: 91%; } .meter__fill--92 { width: 92%; } .meter__fill--93 { width: 93%; } .meter__fill--94 { width: 94%; } .meter__fill--95 { width: 95%; } .meter__fill--96 { width: 96%; } .meter__fill--97 { width: 97%; } .meter__fill--98 { width: 98%; } .meter__fill--99 { width: 99%; } .meter__fill--100 { width: 100%; }
/* ---------- v1.1.0: AdEngine banner (adengine.us) ----------
   One labelled slot between </main> and the dark footer, on the public pages only (the controllers opt in). The label, the
   reserved height and the space around the banner are on the <ins>, so when tag.js (or ae-size.js) hides a slot it cannot fill,
   the label and the space go with it, and the wrapper collapses too. 110px = 16px label + 4px gap + 90px banner; 270px on phones
   (300x250). The footer has no top margin, so the space below is the <ins>'s own; a page that ends on a white band already has
   its padding above, a page that ends on a tinted band (Rig Check's steel band) gets a top margin. vertical-align:top on the link
   keeps the line box at the banner's height. display stays in this file and is never !important: tag.js hides with style.display. */
.ae-slot { padding: 0 var(--gut); }
.ae-slot:has(> ins.adengine[style*="none"]) { display: none; }
.ae-slot ins.adengine { display: block; max-width: 728px; min-height: 110px; margin: 0 auto clamp(40px, 6vw, 64px); text-align: center; text-decoration: none; }
main:has(> :is(.band--steel, .band--night):last-child) + .ae-slot ins.adengine { margin-top: clamp(40px, 6vw, 64px); }
.ae-slot ins.adengine::before { content: "Advertisement"; display: block; margin-bottom: 4px; font: 400 12px/16px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--mute); }
.ae-slot ins.adengine a { display: inline-block; vertical-align: top; }
@media (max-width: 767px) { .ae-slot ins.adengine { max-width: 300px; min-height: 270px; } }
@media print { .ae-slot { display: none; } }