/* Plotroom: the chart table. Old Standard TT (engraved chart lettering) + Alegreya Sans (tabular figures).
   Palette after US Chart No. 1 conventions: buff land, white sea, blue shallows, magenta for lights and plotted work. */
@font-face{font-family:"Old Standard";src:url(fonts/old-standard-tt-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Old Standard";src:url(fonts/old-standard-tt-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Old Standard";src:url(fonts/old-standard-tt-latin-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Alegreya Sans";src:url(fonts/alegreya-sans-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Alegreya Sans";src:url(fonts/alegreya-sans-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Alegreya Sans";src:url(fonts/alegreya-sans-latin-500-normal.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Alegreya Sans";src:url(fonts/alegreya-sans-latin-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}

:root{
  --paper:#f3ecd9; --paper-2:#ebe1c4; --card:#fbf8ef; --sea:#fcfbf6;
  --ink:#182848; --ink-2:#34446b; --ink-3:#5b6684;
  --mag:#a3176f; --mag-2:#7f0f56; --mag-tint:#f6e3ee;
  --land:#e6d3a0; --land-line:#8b7442; --shoal:#cfe2ea; --shoal-2:#a9cad8;
  --graphite:#3f4246; --rule:#cdbf98; --rule-2:#ddd2b3;
  --ok:#24603a; --ok-tint:#e2efe3; --bad:#9d2d1c; --bad-tint:#f6e1dc;
  --serif:"Old Standard", "Times New Roman", serif;
  --sans:"Alegreya Sans", "Segoe UI", system-ui, sans-serif;
  --rail:252px; --measure:68ch;
  --r:3px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:72px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.55 var(--sans);font-variant-numeric:tabular-nums lining-nums;overflow-x:hidden}
img,svg{max-width:100%}
a{color:var(--ink);text-decoration-color:var(--mag);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--mag-2)}
:focus-visible{outline:2px solid var(--mag);outline-offset:2px}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.12;letter-spacing:-.005em;margin:0 0 .5em;color:var(--ink)}
h1{font-size:clamp(2.1rem,1.2rem + 3.2vw,3.7rem)}
h2{font-size:clamp(1.55rem,1.1rem + 1.4vw,2.2rem)}
h3{font-size:1.25rem}
p{margin:0 0 1em}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.6em 1em;z-index:50}
.skip:focus{left:8px;top:8px}
.kicker{font:italic 400 1.02rem/1.3 var(--serif);color:var(--mag);margin:0 0 .6em;letter-spacing:.01em}
.lede{font-size:1.2rem;color:var(--ink-2);max-width:60ch}
.small{font-size:.92rem;color:var(--ink-3)}
.num{font-variant-numeric:tabular-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- shell: rail + column ---------- */
.shell{display:grid;grid-template-columns:var(--rail) minmax(0,1fr);min-height:100vh}
.rail{background:var(--ink);color:#e9e4d4;position:sticky;top:0;height:100vh;overflow-y:auto;padding:22px 18px 26px;display:flex;flex-direction:column;gap:20px;border-right:4px double #0e1a33}
.rail a{color:#efe9d8;text-decoration:none}
.rail a:hover{color:#fff}
.mark{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.mark svg{width:34px;height:34px;flex:none}
.mark span{font:400 1.55rem/1 var(--serif);letter-spacing:.01em}
.rail .mark span{color:#fff}
.rail__tag{font:italic 400 .95rem/1.35 var(--serif);color:#c6bfa9;margin:-8px 0 0}
.rail h2{font:500 .74rem/1 var(--sans);text-transform:uppercase;letter-spacing:.16em;color:#aab0c2;margin:0 0 8px}
.rail ol,.rail ul{list-style:none;margin:0;padding:0}
.rail li a{display:grid;grid-template-columns:24px 1fr auto;align-items:baseline;gap:6px;padding:6px 8px;border-radius:var(--r);font-size:.98rem;line-height:1.25}
.rail ul li a{grid-template-columns:1fr}
.rail li a .n{font:400 .92rem/1 var(--serif);color:#c9a3bb}
.rail li a .tag{font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;border:1px solid #6b7493;color:#c5cadb;padding:1px 5px 0;border-radius:2px}
.rail li a[aria-current="page"],.rail li a:hover{background:#24365e}
.rail li a[aria-current="page"]{box-shadow:inset 3px 0 0 var(--mag)}
.rail__rate{margin-top:auto;border:1px solid #3f5079;padding:12px;border-radius:var(--r);font-size:.9rem;color:#d7d2c2;background:#1d2f55}
.rail__rate b{color:#fff;font-weight:700}
.rail__rate .pv{display:block;color:#f0b9d9;font-weight:700;margin-top:4px}

.col{min-width:0;display:flex;flex-direction:column}
.bar{position:sticky;top:0;z-index:20;background:rgba(243,236,217,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--rule)}
.bar__in{display:flex;align-items:center;gap:16px;padding:10px 32px;min-height:54px}
.bar .mark{display:none}
.bar .mark span{font-size:1.35rem}
.bar__pv{font-size:.92rem;color:var(--ink-2);display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.bar__pv b{font:700 .7rem/1 var(--sans);letter-spacing:.14em;background:var(--mag);color:#fff;padding:4px 7px 3px;border-radius:2px}
.bar__end{margin-left:auto;display:flex;gap:10px;align-items:center}
.index-btn{display:none}
main{flex:1}
.wrap{width:100%;max-width:1180px;padding:0 32px;margin:0 auto}
.narrow{max-width:820px;padding:0 32px;margin:0 auto}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.5em;font:700 1rem/1 var(--sans);letter-spacing:.01em;background:var(--ink);color:#fff;border:1px solid var(--ink);padding:.82em 1.25em .76em;border-radius:var(--r);text-decoration:none;cursor:pointer}
.btn:hover{background:var(--mag-2);border-color:var(--mag-2);color:#fff}
.btn--mag{background:var(--mag);border-color:var(--mag)}
.btn--line{background:transparent;color:var(--ink)}
.btn--line:hover{background:var(--ink);color:#fff}
.btn--small{font-size:.9rem;padding:.55em .9em .5em}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin:1.4em 0 0}
.linkish{background:none;border:0;padding:0;font:inherit;color:var(--ink);text-decoration:underline;text-decoration-color:var(--mag);cursor:pointer}

/* ---------- home ---------- */
.hero{padding:44px 0 36px;border-bottom:1px solid var(--rule)}
.hero__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px;align-items:center}
.hero h1{margin-bottom:.35em}
.hero h1 em{font-style:italic;color:var(--mag)}
.priceline{margin-top:1.1em;font-size:.95rem;color:var(--ink-2);border-left:3px solid var(--mag);padding:.2em 0 .2em .8em}
.table{background:#d9cba3;padding:12px;border-radius:4px;box-shadow:0 1px 0 #b9a877,0 18px 40px -24px rgba(24,40,72,.55)}
.table figure{margin:0;background:var(--sea);border:1px solid #b9a877}
.pan-hint{display:none}
.table figure.pan:focus-visible{outline:3px solid var(--mag);outline-offset:3px}
.table figcaption{font:italic 400 .95rem/1.4 var(--serif);color:var(--ink-2);padding:10px 4px 0}
.chart{display:block;width:100%;height:auto;background:var(--sea);touch-action:none;user-select:none;-webkit-user-select:none}

.notebook{padding:48px 0;background:linear-gradient(var(--paper),var(--paper)) padding-box;border-bottom:1px solid var(--rule)}
.nb{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border:1px solid var(--rule);background:var(--card)}
.nb>div{padding:22px 24px;border-right:1px solid var(--rule-2);background-image:repeating-linear-gradient(var(--card) 0 27px,#e8e0c8 27px 28px)}
.nb>div:last-child{border-right:0}
.nb h3{font-size:1.1rem;margin-bottom:.6em}
.nb h3 .step{font:italic 400 .95rem var(--serif);color:var(--mag);margin-right:.4em}
.nb dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 14px;line-height:1.75}
.nb dt{color:var(--ink-3)}
.nb dd{margin:0;font-weight:700}
.nb .big{font:400 2rem/1.15 var(--serif);color:var(--mag);margin:.2em 0 .3em}
.nb p{line-height:1.75;margin:0 0 .3em}

.section{padding:56px 0;border-bottom:1px solid var(--rule)}
.section__head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:22px}
.section__head p{margin:0;max-width:58ch;color:var(--ink-2)}

.list{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--rule)}
.list th{font:500 .74rem/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);text-align:left;padding:12px 16px;border-bottom:2px solid var(--ink);background:var(--paper-2)}
.list td{padding:14px 16px;border-bottom:1px solid var(--rule-2);vertical-align:top}
.list tr:last-child td{border-bottom:0}
.list td.no{font:400 1.5rem/1 var(--serif);color:var(--mag);width:56px}
.list td a.skill{font:400 1.2rem/1.2 var(--serif);text-decoration:none}
.list td a.skill:hover{text-decoration:underline}
.plan{display:inline-block;font:700 .72rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;padding:5px 7px 4px;border-radius:2px;white-space:nowrap}
.plan--free{background:var(--ok-tint);color:var(--ok)}
.plan--pass{background:var(--mag-tint);color:var(--mag-2)}

.steps4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;counter-reset:s;border-top:2px solid var(--ink)}
.steps4 li{list-style:none;padding:18px 22px 4px 0;counter-increment:s}
.steps4 li::before{content:counter(s, upper-roman) ".";display:block;font:italic 400 1.6rem/1 var(--serif);color:var(--mag);margin-bottom:10px}
.steps4 h3{font-size:1.15rem;margin-bottom:.3em}
.steps4 p{color:var(--ink-2);font-size:.98rem}
ol.steps4{padding:0;margin:0}

/* rate card = chart title cartouche */
.cartouche{border:1px solid var(--ink);outline:1px solid var(--ink);outline-offset:4px;background:var(--card);padding:28px;margin:6px}
.cartouche__t{text-align:center;font:400 .82rem/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--ink-3);margin:0 0 6px}
.cartouche__h{text-align:center;font:400 2rem/1.1 var(--serif);margin:0 0 20px}
.rates{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--rule)}
.rates>div{padding:20px 24px}
.rates>div+div{border-left:1px solid var(--rule)}
.rates h3{margin-bottom:.2em}
.rates .price{font:400 2.3rem/1 var(--serif);margin:.15em 0}
.rates .price small{font:400 1rem var(--sans);color:var(--ink-3)}
.rates ul{padding-left:1.1em;margin:.8em 0 0}
.rates li{margin:.25em 0}
.pvnote{display:inline-block;margin-top:10px;font-weight:700;color:var(--mag-2);background:var(--mag-tint);padding:4px 9px;border-radius:2px}

/* ---------- page heads ---------- */
.pagehead{padding:42px 0 26px;border-bottom:1px solid var(--rule)}
.prose{max-width:var(--measure)}
.prose h2{margin-top:1.4em}
.prose li{margin:.3em 0}
.prose .src{font-size:.94rem;color:var(--ink-2);border-left:2px solid var(--rule);padding-left:.8em}
.body{padding:34px 0 60px}

/* ---------- practice ---------- */
.prob{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,1fr);gap:28px;align-items:start;padding:24px 0 60px}
.prob--nochart{grid-template-columns:minmax(0,1fr) minmax(320px,1fr)}
.prob__chart{position:sticky;top:70px}
.readout{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:.92rem;color:var(--ink-2);padding:8px 2px 0}
.readout output{font-weight:700;color:var(--mag-2)}
.sheet{background:var(--card);border:1px solid var(--rule);border-top:3px solid var(--ink);padding:24px 26px}
.sheet__no{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font:italic 400 1rem var(--serif);color:var(--ink-3);margin-bottom:6px}
.sheet h1{font-size:clamp(1.6rem,1.2rem + 1.2vw,2.15rem)}
.givens{width:100%;border-collapse:collapse;margin:14px 0 18px;font-size:.98rem}
.givens th{text-align:left;font-weight:500;color:var(--ink-3);padding:6px 10px 6px 0;border-bottom:1px solid var(--rule-2);width:42%;vertical-align:top}
.givens td{padding:6px 0;border-bottom:1px solid var(--rule-2);font-weight:700}
.field{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;margin:0 0 12px}
.field label{grid-column:1/-1;font-weight:500}
.field input{font:700 1.2rem/1 var(--sans);width:100%;padding:.55em .6em;border:1px solid var(--ink-3);border-radius:var(--r);background:#fff;color:var(--ink)}
.field input:focus{border-color:var(--mag);outline:2px solid var(--mag-tint)}
.field .unit{font:400 1.05rem var(--serif);color:var(--ink-2);min-width:2.4em}
.field .err{grid-column:1/-1;color:var(--bad);font-size:.92rem}
.field--ok input{border-color:var(--ok);background:var(--ok-tint)}
.field--bad input{border-color:var(--bad);background:var(--bad-tint)}
.checkbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--rule-2)}
.verdict{margin:0 0 16px;padding:14px 16px;border-radius:var(--r);border:1px solid}
.verdict--ok{background:var(--ok-tint);border-color:#9cc1a5;color:var(--ok)}
.verdict--bad{background:var(--bad-tint);border-color:#e0b0a5;color:var(--bad)}
.verdict b{font:400 1.35rem/1.2 var(--serif);display:block}
.res{width:100%;border-collapse:collapse;margin:8px 0 14px;font-size:.95rem}
.res th,.res td{text-align:left;padding:6px 8px 6px 0;border-bottom:1px solid var(--rule-2)}
.res th{font-weight:500;color:var(--ink-3)}
.res .y{color:var(--ok);font-weight:700}
.res .n{color:var(--bad);font-weight:700}
.work{counter-reset:w;padding:0;margin:8px 0 0}
.work li{list-style:none;counter-increment:w;position:relative;padding:0 0 10px 34px}
.work li::before{content:counter(w);position:absolute;left:0;top:0;width:24px;height:24px;border:1px solid var(--mag);color:var(--mag);border-radius:50%;font:400 .9rem/23px var(--serif);text-align:center}
.saved{font-size:.95rem;padding:10px 12px;background:var(--paper-2);border-left:3px solid var(--ink);margin:12px 0}
.pointuse{font-size:.92rem;color:var(--ink-2);margin:16px 0 0;padding:10px 12px;border:1px dashed var(--rule)}
.formula{background:var(--card);border:1px solid var(--rule);padding:24px}
.ladder{display:grid;grid-template-columns:repeat(5,1fr);text-align:center;border:1px solid var(--ink);margin:14px 0}
.ladder div{padding:14px 4px;border-right:1px solid var(--rule)}
.ladder div:last-child{border-right:0}
.ladder b{display:block;font:400 2rem/1 var(--serif);color:var(--mag)}
.ladder span{font-size:.82rem;color:var(--ink-3)}
.tri{display:block;margin:10px auto;max-width:300px}
.tri text{font-family:var(--serif)}
details.more{margin-top:14px}
details.more summary{cursor:pointer;font-weight:500}
.tool-help{font-size:.9rem;color:var(--ink-3);margin:6px 2px 0}

/* chart drawing */
.ch-water{fill:var(--sea)}
.ch-shoal{fill:var(--shoal);stroke:var(--shoal);stroke-width:30;stroke-linejoin:round}
.ch-shoal-dot{fill:var(--shoal)}
.ch-depth{fill:none;stroke:var(--shoal-2);stroke-width:1;stroke-dasharray:6 4}
.ch-land{fill:var(--land);stroke:var(--land-line);stroke-width:1.4;stroke-linejoin:round}
.ch-sound{font:italic 400 11px var(--serif);fill:#5d7480;text-anchor:middle}
.ch-rose line{stroke:var(--mag);stroke-width:1}
.ch-rose-ring{fill:none;stroke:var(--mag);stroke-width:1}
.ch-rose-star{fill:var(--mag);opacity:.85}
.ch-rose-t{font:700 13px var(--serif);fill:var(--mag);text-anchor:middle}
.ch-rose-v{font:400 9.5px var(--sans);fill:var(--mag);text-anchor:middle;letter-spacing:.06em}
.ch-name{font:italic 400 15px var(--serif);fill:var(--ink-2);text-anchor:middle}
.ch-name--big{font-size:22px;letter-spacing:.18em;fill:#4a6a7c}
.ch-name--land{text-anchor:start;font-size:14px;fill:#6b5a2f}
.ch-name--sm{font-size:12px}
.ch-mark circle,.ch-mark path{fill:var(--ink)}
.ch-mark .ch-o{fill:#fff;stroke:var(--ink);stroke-width:1.4}
.ch-mark--light .ch-flare{fill:var(--mag);opacity:.85}
.ch-mark--rock path{fill:#2f2f2f}
.ch-lbl{font:500 10.5px var(--sans);fill:var(--ink);letter-spacing:.04em}
.ch-mark--light .ch-lbl{fill:var(--mag);font-style:italic}
.ch-buoy path{stroke:#222;stroke-width:.8}
.ch-buoy--green path{fill:#2e8b4a}
.ch-buoy--red path{fill:#c8312a}
.ch-buoy--bell path{fill:#c8312a}
.ch-buoy circle{fill:none;stroke:#222;stroke-width:1}
.ch-frame line{stroke:var(--ink);stroke-width:.8}
.ch-neat{fill:none;stroke:var(--ink);stroke-width:1.4}
.ch-scale{font:400 11px var(--sans);fill:var(--ink-2);text-anchor:middle}
.ch-scale--unit{font-style:italic;font-family:var(--serif);font-size:12px}
.ch-cart rect{fill:#fbf6e6;stroke:var(--ink);stroke-width:1}
.ch-cart-t{font:400 13px var(--serif);fill:var(--ink);text-anchor:middle;letter-spacing:.04em}
.ch-cart-s{font:italic 400 11.5px var(--serif);fill:var(--mag-2);text-anchor:middle}
.ch-arrowhead{fill:var(--graphite)}
.ch-arrowhead--cur{fill:#1f6a8a}
.ov{fill:none;stroke:var(--graphite);stroke-width:1.6;stroke-linecap:round}
.ov-dot{fill:var(--graphite);stroke:none}
.ov-ring{fill:none}
.ov-given{stroke:var(--ink)}
.ov-given.ov-dot{fill:var(--ink)}
.ov-lop{stroke:var(--graphite);stroke-dasharray:none}
.ov-track{stroke:var(--graphite);stroke-width:1.8}
.ov-dr{stroke:var(--graphite)}
.ov-cur{stroke:#1f6a8a;stroke-width:2}
.ov-answer{stroke:var(--mag);stroke-width:2.2}
.ov-answer.ov-dot{fill:var(--mag)}
.ov-t{font:italic 400 13px var(--serif);fill:var(--graphite);paint-order:stroke;stroke:var(--sea);stroke-width:3px}
.ov-t.ov-answer{fill:var(--mag);stroke:var(--sea);stroke-width:3px}
.ov-t.ov-cur{fill:#1f6a8a;stroke:var(--sea)}
.ch-tool line{stroke:var(--mag);stroke-width:1.6;stroke-dasharray:5 4}
.ch-tool circle{fill:var(--mag)}
.ch-tool text{font:700 13px var(--sans);fill:var(--mag-2);paint-order:stroke;stroke:#fff;stroke-width:4px}

/* ---------- log ---------- */
.keybox{display:flex;gap:10px;flex-wrap:wrap;align-items:center;background:var(--card);border:1px solid var(--ink);padding:14px 16px;margin:14px 0}
.keybox code{font:700 1rem/1.3 var(--sans);word-break:break-all;color:var(--mag-2)}
.bars{display:grid;gap:10px;margin:12px 0 26px}
.barrow{display:grid;grid-template-columns:minmax(150px,1.1fr) 2fr auto;gap:14px;align-items:center;padding:10px 14px;background:var(--card);border:1px solid var(--rule-2)}
.barrow a{font:400 1.08rem/1.2 var(--serif);text-decoration:none}
.meter{height:10px;background:var(--paper-2);border-radius:5px;overflow:hidden}
.meter i{display:block;height:100%;background:var(--ink)}
.trail{display:flex;gap:3px}
.trail span{width:10px;height:10px;border-radius:50%;background:var(--bad-tint);border:1px solid var(--bad)}
.trail span.ok{background:var(--ok);border-color:var(--ok)}
.w0{width:0}.w10{width:10%}.w20{width:20%}.w30{width:30%}.w40{width:40%}.w50{width:50%}.w60{width:60%}.w70{width:70%}.w80{width:80%}.w90{width:90%}.w100{width:100%}
.stack{display:grid;gap:22px}
form.inline{display:flex;gap:10px;flex-wrap:wrap;align-items:end}
form.inline input[type=text]{font:inherit;padding:.55em .6em;border:1px solid var(--ink-3);border-radius:var(--r);min-width:220px}
.danger{border:1px solid #e0b0a5;background:var(--bad-tint);padding:16px;border-radius:var(--r)}
.danger .btn{background:var(--bad);border-color:var(--bad)}

/* ---------- worksheet ---------- */
.ws-list{counter-reset:q;padding:0;margin:0}
.ws-list>li{list-style:none;counter-increment:q;padding:16px 0 16px 44px;position:relative;border-bottom:1px solid var(--rule-2);break-inside:avoid}
.ws-list>li::before{content:counter(q);position:absolute;left:0;top:14px;font:400 1.6rem var(--serif);color:var(--mag)}
.ws-ans{margin-top:8px;font-size:.95rem;color:var(--ink-3)}
.ws-key{break-before:page;margin-top:36px}
.ws-key td,.ws-key th{font-size:.95rem}

/* ---------- footer ---------- */
.foot{border-top:4px double var(--ink);background:var(--paper-2);padding:34px 0 30px;margin-top:auto}
.foot__grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:28px}
.foot h2{font:500 .74rem/1 var(--sans);text-transform:uppercase;letter-spacing:.16em;color:var(--ink-3);margin:0 0 10px}
.foot ul{list-style:none;padding:0;margin:0}
.foot li{margin:.3em 0}
.foot .mark span{font-size:1.4rem}
.indep{margin-top:24px;padding-top:18px;border-top:1px solid var(--rule);font-size:.9rem;color:var(--ink-2)}
.indep p{margin:0 0 .5em;max-width:90ch}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .shell{grid-template-columns:minmax(0,1fr)}
  .rail{display:none;position:fixed;inset:0;height:auto;z-index:60;width:min(340px,88vw);box-shadow:0 0 0 100vmax rgba(14,26,51,.45)}
  .rail:target,.rail.is-open{display:flex}
  .rail__close{display:inline-flex !important}
  .bar .mark{display:flex}
  .index-btn{display:inline-flex}
  .bar__pv{display:none}
  .bar__in{padding:8px 16px}
  .hero__grid,.prob,.prob--nochart{grid-template-columns:minmax(0,1fr)}
  .prob__chart{position:static}
}
.rail__close{display:none;align-self:flex-end;background:none;border:1px solid #6b7493;color:#fff;padding:4px 10px;border-radius:2px;font:500 .9rem var(--sans);text-decoration:none}
@media (max-width:760px){
  .wrap,.narrow{padding:0 16px}
  body{font-size:1rem}
  .hero{padding:26px 0 26px}
  .table figure.pan{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .table figure.pan .chart{width:760px;max-width:none;touch-action:pan-x pan-y}
  .pan-hint{display:inline}
  .nb{grid-template-columns:minmax(0,1fr)}
  .nb>div{border-right:0;border-bottom:1px solid var(--rule-2)}
  .steps4{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .rates{grid-template-columns:minmax(0,1fr)}
  .rates>div+div{border-left:0;border-top:1px solid var(--rule)}
  .cartouche{padding:18px 14px}
  .foot__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .foot__grid>div:first-child{grid-column:1/-1}
  .list thead{display:none}
  .list tr{display:grid;grid-template-columns:48px 1fr;padding:12px 12px;border-bottom:1px solid var(--rule-2)}
  .list td{border:0;padding:2px 0}
  .list td.no{grid-row:span 3}
  .barrow{grid-template-columns:minmax(0,1fr) auto}
  .barrow .meter{grid-column:1/-1;grid-row:2}
  .sheet{padding:18px 16px}
  .prob{padding-top:14px}
  .checkbar{position:sticky;bottom:0;background:var(--card);margin:16px -16px -18px;padding:12px 16px;border-top:1px solid var(--rule);box-shadow:0 -8px 16px -12px rgba(24,40,72,.4)}
  .section{padding:38px 0}
}
@media print{
  .rail,.bar,.foot .foot__grid,.btns,.noprint,.checkbar{display:none !important}
  .shell{display:block}
  body{background:#fff;font-size:11pt}
  .chart{max-height:6.8in}
  .foot{border:0;background:none;padding:0}
  .sheet{border:0;padding:0}
}
.bar .index-btn{display:none}
@media (min-width:1101px){.shell{background:linear-gradient(to right,var(--ink) var(--rail),transparent 0)}}
@media (max-width:1100px){.bar .index-btn{display:inline-flex}}
@media print{.shell{background:none}}
/* v1.1.0 AdEngine banner (adengine.us). One labelled slot between the main content and the footer, on the public pages only
   (the controllers opt in). The label, the reserved height and the spacing are all 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 page closes up exactly as before. 110px = 16px label
   + 4px gap + 90px banner; 270px on phones (300x250). Pages end with 56-60px of padding (home's last section also draws a
   rule), so the slot keeps a little space above and more below, before the footer's double rule. Label: the footer's small
   spaced capitals (Alegreya Sans) in --ink-3 on buff (4.8:1). display stays in this file and is never !important: tag.js hides
   a slot with style.display='none'. <ins> is underlined by default, so text-decoration is reset. */
.ae-slot{margin:0;padding:0 32px}
.ae-slot ins.adengine{display:block;max-width:728px;min-height:110px;margin:32px auto 48px;text-align:center;text-decoration:none}
.ae-slot ins.adengine::before{content:"Advertisement";display:block;margin-bottom:4px;font:500 11px/16px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.ae-slot ins.adengine a{display:inline-block;vertical-align:top}
.ae-slot:has(> ins.adengine[style*="none"]){display:none}
@media (max-width:767px){.ae-slot{padding:0 16px}.ae-slot ins.adengine{max-width:300px;min-height:270px;margin:24px auto 40px}}
@media print{.ae-slot{display:none}}