/* Marina Magazine, edition 1.1: "Night water" design system. See F:\Clients\marinamagazine.info\DESIGN.md.
   Type: Bodoni Moda (display, optical sizes) + Schibsted Grotesk (text/UI), self-hosted, OFL (fonts/OFL-*.txt).
   Colour: deep-water darks for covers and the drill desk, chart-paper lights for reading; the three navigation-light
   colours (port red, masthead white, starboard green) are the only accents. No inline styles (CSP style-src 'self'). */
@font-face{font-family:"Bodoni Moda";src:url(fonts/bodoni-moda-opsz.woff2) format("woff2");font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:"Bodoni Moda";src:url(fonts/bodoni-moda-opsz-italic.woff2) format("woff2");font-weight:400 900;font-style:italic;font-display:swap}
@font-face{font-family:"Schibsted Grotesk";src:url(fonts/schibsted-grotesk-wght.woff2) format("woff2");font-weight:400 900;font-style:normal;font-display:swap}

:root{
  --abyss:#061519;--deep:#0b242a;--deep2:#10313a;--hair-d:#24464e;--on-d:#dbe7e3;--on-d2:#a3bab5;
  --foam:#f3f5f0;--chart:#e5ece6;--white:#fcfdfb;--ink:#0e1b1e;--ink2:#4a5c60;--hair:#c8d3ce;
  --teal:#0b5e57;--teal-h:#08463f;--glass:#8fd3c8;--glass-h:#b4e6dd;
  --port:#b42a33;--port-l:#ff7b7b;--stbd:#146c43;--stbd-l:#5be3a0;--mast:#f6efd9;--amber:#f0c25a;--ring:var(--teal);
  --disp:"Bodoni Moda","Didot","Bodoni 72",Georgia,serif;
  --text:"Schibsted Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:ui-monospace,Menlo,Consolas,monospace;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:72px;--s9:112px;
  --shell:1240px;--gut:clamp(20px,4vw,48px)
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--foam);color:var(--ink);font:400 17px/1.65 var(--text);font-feature-settings:"ss01"}
img,svg{max-width:100%}
a{color:var(--teal);text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--teal-h);text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--ring);outline-offset:2px}
/* focus ring: sea-teal on the chart-paper pages (>=6:1), amber inside the dark sections (>=9:1) */
.skip,.mast,.cover,.plan-plus,.issue-head,.desk{--ring:var(--amber)}
.shell{max-width:var(--shell);margin:0 auto;padding:0 var(--gut)}
.skip{position:absolute;left:-999px;top:8px;z-index:20;background:var(--mast);color:var(--abyss);padding:10px 14px;font-weight:700}
.skip:focus{left:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
h1,h2,h3{font-family:var(--disp);font-weight:600;line-height:1.08;letter-spacing:-.01em;margin:0 0 .4em;font-optical-sizing:auto}
h1{font-size:clamp(2.4rem,5.2vw,4rem)}
h2{font-size:clamp(1.6rem,2.6vw,2.15rem);margin-top:1.4em}
h3{font-size:1.3rem}
p{margin:0 0 1em}
.small{font-size:.9rem;color:var(--ink2)}
.lede{font-size:clamp(1.08rem,1.5vw,1.25rem);line-height:1.55;color:var(--ink2);max-width:60ch}
.overline,.kicker{font:600 .74rem/1.4 var(--text);letter-spacing:.16em;text-transform:uppercase;color:var(--glass);margin:0 0 var(--s4);display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.overline-ink,.kicker{color:var(--teal)}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%}
.dot-r{background:var(--port-l)}.dot-w{background:var(--mast)}.dot-g{background:var(--stbd-l)}
.dot+.dot{margin-left:-2px}

/* ---------- masthead ---------- */
.mast{background:var(--abyss);color:var(--on-d)}
.mast-line{border-bottom:1px solid var(--hair-d);font-size:.8rem;color:var(--on-d2)}
.mast-line-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 24px;padding-top:8px;padding-bottom:8px}
.mast-line p{margin:0}
.mast-ed{font-style:italic;font-family:var(--disp);font-size:.92rem;color:var(--on-d2)}
.mast-offer strong{color:var(--amber);font-weight:600}
.mast-offer a{color:var(--mast)}
.mast-chip{display:inline-block;border:1px solid var(--amber);color:var(--amber);border-radius:2px;padding:0 6px;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;margin-right:4px;vertical-align:1px}
.mast-main{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding-top:22px;padding-bottom:18px}
.wordmark{grid-column:2;display:flex;align-items:baseline;gap:12px;color:var(--mast);text-decoration:none}
.wordmark:hover{color:#fff}
.wm-word{font:500 clamp(2rem,4.6vw,3.3rem)/1 var(--disp);letter-spacing:.02em;font-variation-settings:"opsz" 96}
.wm-sub{font:italic 400 clamp(1rem,1.8vw,1.35rem)/1 var(--disp);color:var(--glass)}
.wm-lights{display:flex;gap:5px;align-self:center}
.wm-lights i{display:block;width:9px;height:9px;border-radius:50%}
.l-r{background:var(--port-l)}.l-w{background:var(--mast)}.l-g{background:var(--stbd-l)}
.wm-lights .l-r,.wm-lights .l-g,.wm-lights .l-w{box-shadow:0 0 10px currentColor}
.wm-lights .l-r{color:rgba(255,123,123,.6)}.wm-lights .l-w{color:rgba(246,239,217,.5)}.wm-lights .l-g{color:rgba(91,227,160,.6)}
.mast-log{grid-column:3;justify-self:end;color:var(--abyss);background:var(--glass);text-decoration:none;font-weight:600;font-size:.92rem;padding:8px 16px;border-radius:2px}
.mast-log:hover{background:var(--glass-h);color:var(--abyss)}
.sections{border-top:1px solid var(--hair-d);border-bottom:1px solid var(--hair-d)}
.sections-in{display:flex;justify-content:center;gap:0 4px;overflow-x:auto;scrollbar-width:none;white-space:nowrap}
.sections-in::-webkit-scrollbar{display:none}
.sections a{color:var(--on-d);text-decoration:none;font-size:.9rem;padding:12px 14px;border-bottom:2px solid transparent;flex:none}
.sections a:hover{color:#fff;border-bottom-color:var(--hair-d)}
.sections a[aria-current]{color:#fff;border-bottom-color:var(--glass)}
.sec-no{font-family:var(--disp);font-style:italic;color:var(--glass);margin-right:2px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:10px 20px;border:1.5px solid var(--ink);border-radius:2px;background:transparent;color:var(--ink);font:600 1rem/1.2 var(--text);text-decoration:none;cursor:pointer}
.btn:hover{background:var(--ink);color:var(--foam)}
.btn-main{background:var(--teal);border-color:var(--teal);color:#fff}
.btn-main:hover{background:var(--teal-h);border-color:var(--teal-h);color:#fff}
.btn-ghost{border-color:transparent;color:var(--teal);text-decoration:underline;text-underline-offset:3px;padding-left:8px;padding-right:8px}
.btn-ghost:hover{background:transparent;color:var(--teal-h)}
.btn-danger{background:var(--port);border-color:var(--port);color:#fff}
.btn-danger:hover{background:#8f1f27;border-color:#8f1f27}
.btn-glow{background:var(--glass);border-color:var(--glass);color:var(--abyss)}
.btn-glow:hover{background:var(--glass-h);border-color:var(--glass-h);color:var(--abyss)}
.btn-line{border-color:rgba(219,231,227,.55);color:var(--on-d)}
.btn-line:hover{background:var(--on-d);color:var(--abyss);border-color:var(--on-d)}
.linkish{background:none;border:0;padding:0;font:inherit;color:var(--teal);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.danger{color:var(--port)}
.actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:var(--s4) 0}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin:var(--s6) 0 var(--s4)}
.inline{display:inline}
.page form{margin-bottom:var(--s3)}
.more{margin-top:var(--s5)}
.more a{font-weight:600}

/* ---------- home: cover ---------- */
.cover{background:radial-gradient(120% 90% at 85% 0%,#123a42 0%,var(--abyss) 60%);color:var(--on-d);padding:var(--s8) 0 var(--s6)}
.cover-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--s7);align-items:center}
.cover-h{font-size:clamp(3.2rem,9vw,7.4rem);font-weight:500;line-height:.92;letter-spacing:-.025em;color:var(--mast);margin:0 0 var(--s5);font-variation-settings:"opsz" 96}
.cover-h em{font-style:italic;color:var(--glass)}
.cover-lede{font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.6;max-width:56ch;color:var(--on-d)}
.cover-small{font-size:.88rem;color:var(--on-d2)}
.plate{margin:0;border:1px solid var(--hair-d);background:var(--deep);padding:var(--s4)}
.plate-label{display:flex;justify-content:space-between;font:600 .7rem/1 var(--text);letter-spacing:.16em;text-transform:uppercase;color:var(--on-d2);margin:2px 0 var(--s3)}
.plate .pic{border:0;border-radius:0}
.plate-q{font-family:var(--disp);font-size:1.25rem;line-height:1.35;color:var(--mast);margin:var(--s4) 2px 4px}
.plate-qmark{font-style:italic;color:var(--glass)}
.plate-q a{display:inline-block;font-family:var(--text);font-size:.95rem;font-weight:600;color:var(--glass);margin-left:4px}
.soundings{display:grid;grid-template-columns:repeat(4,1fr);margin:var(--s8) 0 0;border-top:1px solid var(--hair-d)}
.soundings div{padding:var(--s5) var(--s4) 0 0;display:flex;flex-direction:column-reverse;gap:4px}
.soundings div+div{padding-left:var(--s5);border-left:1px solid var(--hair-d)}
.soundings dt{font-size:.85rem;color:var(--on-d2)}
.soundings dd{margin:0;font:600 clamp(2.2rem,4vw,3.2rem)/1 var(--disp);color:var(--mast);font-variant-numeric:lining-nums}

/* ---------- home: bands ---------- */
.contents,.method,.subscribe{padding:var(--s9) 0 0}
.subscribe{padding-bottom:var(--s8)}
.band-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--s5);align-items:end;border-bottom:2px solid var(--ink);padding-bottom:var(--s4);margin-bottom:0}
.band-head .overline{margin:0 0 8px}
.band-h{margin:0;font-size:clamp(1.7rem,3.2vw,2.6rem);font-weight:500;max-width:22ch}
.toc{list-style:none;margin:0;padding:0}
.toc-row{display:grid;grid-template-columns:120px minmax(0,1fr) 300px;gap:var(--s6);align-items:center;padding:var(--s6) 0;border-bottom:1px solid var(--hair)}
.toc-no{font:italic 600 6rem/.8 var(--disp);color:var(--teal);text-align:right;font-variation-settings:"opsz" 96}
.toc-kicker{font:600 .72rem/1.4 var(--text);letter-spacing:.16em;text-transform:uppercase;color:var(--ink2);margin:0 0 6px}
.toc-title{font-size:clamp(1.6rem,2.6vw,2.2rem);margin:0 0 8px;font-weight:600}
.toc-title a{color:var(--ink);text-decoration:none}
.toc-title a:hover{text-decoration:underline;text-decoration-color:var(--teal)}
.toc-dek{color:var(--ink2);max-width:58ch;margin-bottom:8px}
.toc-meta{font-size:.92rem;color:var(--ink2);margin:0}
.toc-meta a{font-weight:600}
.toc-art{display:block}
.toc-art .pic{border:1px solid var(--hair);border-radius:0}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr)}
.step{padding:var(--s6) var(--s6) 0 0}
.step+.step{padding-left:var(--s6);border-left:1px solid var(--hair)}
.step-light{display:block;width:14px;height:14px;border-radius:50%;margin-bottom:var(--s5);outline:1px solid var(--ink);outline-offset:3px}
.step-light.l-r{background:var(--port)}.step-light.l-w{background:var(--white)}.step-light.l-g{background:var(--stbd)}
.step h3{font-size:1.55rem;font-weight:500}
.step p{color:var(--ink2)}
.notice{background:var(--chart);border-top:1px solid var(--hair);padding:var(--s7) 0}
.notice-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--s5)}
.notice-h{margin:0;font-size:1.5rem;font-style:italic;font-weight:500}
.notice p{margin:0;max-width:70ch}

/* ---------- plans ---------- */
.plans{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);margin:var(--s6) 0 0;border:1px solid var(--ink)}
.plan{padding:var(--s6) var(--s6) var(--s5)}
.plan-free{background:var(--white)}
.plan-plus{background:var(--abyss);color:var(--on-d)}
.plan-name{font-size:.78rem;font-family:var(--text);font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin:0 0 var(--s3);color:var(--ink2)}
.plan-plus .plan-name{color:var(--glass)}
.amount{margin:0 0 6px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.amt{font:500 clamp(3rem,6vw,4.6rem)/1 var(--disp);font-variant-numeric:lining-nums;letter-spacing:-.02em}
.plan-plus .amt{color:var(--mast)}
.per{font-size:1rem;color:var(--on-d2)}
.alt{margin:0 0 var(--s4);color:var(--on-d)}
.alt strong{color:var(--mast)}
.plan-list{list-style:none;padding:0;margin:var(--s4) 0}
.plan-list li{padding:10px 0 10px 26px;border-top:1px solid var(--hair);position:relative}
.plan-plus .plan-list li{border-top-color:var(--hair-d)}
.plan-list li::before{content:"";position:absolute;left:2px;top:19px;width:9px;height:9px;border-radius:50%;background:var(--stbd)}
.plan-plus .plan-list li::before{background:var(--glass)}
.free-box{border-left:3px solid var(--amber);padding:8px 0 8px 14px;margin:var(--s4) 0 0;color:var(--mast);font-weight:600;font-size:.95rem}
.page .plans{margin-top:var(--s5)}

/* ---------- price line (point of use) ---------- */
.price-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;margin:var(--s5) 0;padding:12px 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);font-size:.95rem}
.pl-tag{font:600 .7rem/1.4 var(--text);letter-spacing:.16em;text-transform:uppercase;color:var(--teal)}
.free{color:var(--stbd);font-weight:700}
.desk .price-line,.issue-head .price-line{border-color:var(--hair-d);color:var(--on-d)}
.desk .pl-tag,.issue-head .pl-tag{color:var(--glass)}
.desk .free,.issue-head .free{color:var(--amber)}
.desk .price-line a,.issue-head .price-line a{color:var(--glass)}
.tag{display:inline-block;font:700 .66rem/1.5 var(--text);letter-spacing:.14em;text-transform:uppercase;border:1px solid currentColor;color:var(--teal);padding:1px 7px;border-radius:2px;vertical-align:middle}
.tag-free{color:var(--stbd)}
.issue-head .tag{color:var(--amber)}.issue-head .tag-free{color:var(--stbd-l)}

/* ---------- generic page ---------- */
.page{max-width:calc(760px + 2 * var(--gut));margin:0 auto;padding:var(--s7) var(--gut) var(--s8)}
.page-wide{max-width:var(--shell)}
.page>h1:first-child,.page-head h1{font-weight:500;letter-spacing:-.02em;padding-bottom:var(--s4);border-bottom:2px solid var(--ink);margin-bottom:var(--s5)}
.page-head{margin-bottom:var(--s6)}
.prose h2{font-weight:500;padding-top:var(--s4);border-top:1px solid var(--hair)}
.prose li{margin:.35em 0}
.prose p,.prose li{max-width:68ch}
.note{border:1px solid var(--hair);border-left:3px solid var(--teal);background:var(--white);padding:12px 16px;margin:var(--s4) 0}
.note-err{border-left-color:var(--port);color:#7e1b22;background:#fdf3f2}
.note-main{border-left-color:var(--amber);background:#fbf6e6}
.desk .note{background:var(--deep);color:var(--on-d);border-color:var(--hair-d)}
.desk .note-err{border-left-color:var(--port-l)}
code{font-family:var(--mono);font-size:.88em;background:var(--chart);padding:1px 5px}

/* ---------- forms ---------- */
fieldset{border:0;padding:0;margin:0 0 var(--s3);min-width:0}
label{display:block;font-size:.95rem;font-weight:600}
input,select{display:block;width:100%;margin-top:6px;font:16px var(--text);padding:11px 12px;border:1.5px solid #8a9a96;border-radius:2px;background:#fff;color:var(--ink);min-width:0}
input:focus{outline:3px solid var(--ring);outline-offset:1px;border-color:var(--ink)}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:400;margin:10px 0}
.check input{width:auto;margin-top:5px;flex:none}

/* ---------- issues index ---------- */
.posters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s7) var(--s6)}
.poster{display:flex;flex-direction:column;border-top:2px solid var(--ink)}
.poster-art{display:block;margin-top:var(--s5)}
.poster-art .pic{border:1px solid var(--hair);border-radius:0}
.poster-body{position:relative;padding-top:var(--s5)}
.poster-no{position:absolute;right:0;top:var(--s3);margin:0;font:italic 600 4.5rem/1 var(--disp);color:var(--teal)}
.poster-title{margin:0 0 10px;font-size:clamp(1.7rem,2.6vw,2.3rem);font-weight:600;padding-right:70px}
.poster-title a{color:var(--ink);text-decoration:none}
.poster-title a:hover{text-decoration:underline}
.poster-links{display:flex;gap:18px;font-weight:600}

/* ---------- issue article ---------- */
.story{display:grid;grid-template-columns:[full-start] minmax(0,1fr) [wide-start] minmax(0,7rem) [main-start] min(41rem,calc(100% - 2 * var(--gut))) [main-end] minmax(0,7rem) [wide-end] minmax(0,1fr) [full-end];padding-bottom:var(--s8);font-size:1.08rem;line-height:1.72}
.story>*{grid-column:main}
.story>.issue-head{grid-column:full}
.story>.inline-pic,.story>.pair{grid-column:wide}
.story>h2{font-weight:500;margin-top:1.5em;padding-top:var(--s4);border-top:1px solid var(--hair)}
.story ul{padding-left:1.1em}
.story li{margin:.4em 0}
.story li::marker{color:var(--teal)}
.story>.issue-head+p::first-letter{float:left;font:500 4.6em/.82 var(--disp);margin:.06em .1em 0 0;color:var(--teal)}
.issue-head{background:var(--abyss);color:var(--on-d);margin-bottom:var(--s7)}
.issue-head-in{max-width:var(--shell);margin:0 auto;padding:var(--s8) var(--gut) var(--s6);display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s7);align-items:start}
.issue-no{margin:0;font:italic 600 clamp(5rem,13vw,11rem)/.8 var(--disp);color:var(--glass);font-variation-settings:"opsz" 96}
.issue-no-word{font-size:.32em;vertical-align:.9em;color:var(--on-d2)}
.issue-title{font-size:clamp(2.6rem,6.4vw,5.2rem);font-weight:500;color:var(--mast);line-height:.98;letter-spacing:-.02em}
.issue-dek{font-size:1.2rem;color:var(--on-d);max-width:52ch}
.issue-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.inline-pic{margin:var(--s6) 0;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--s5);align-items:end}
.inline-pic .cardpic{grid-column:1}
.inline-pic figcaption{font-family:var(--disp);font-style:italic;font-size:1.05rem;line-height:1.45;color:var(--ink2);border-top:2px solid var(--teal);padding-top:var(--s3)}
.inline-pic figcaption.sr{border:0;padding:0}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);margin:var(--s6) 0}
.cardpic{margin:0}
.pic{display:block;width:100%;height:auto;border:1px solid var(--hair)}
.story-end{margin-top:var(--s6)}
.byline{border:1px solid var(--hair);background:var(--white);padding:var(--s4) var(--s5);margin:var(--s5) 0;font-size:.92rem;line-height:1.6;color:var(--ink2)}
.byline strong{display:block;font:600 .72rem/1.4 var(--text);letter-spacing:.16em;text-transform:uppercase;color:var(--teal);margin-bottom:4px}
.byline p{margin:0}
.sources h2{font-size:1.3rem;font-weight:500;margin-top:var(--s5)}
.sources ul{padding-left:1.1em;font-size:.95rem}

/* ---------- drill desk ---------- */
.desk{background:var(--abyss);color:var(--on-d);padding:var(--s6) 0 var(--s7);min-height:70vh}
.desk a:not(.btn){color:var(--glass)}
.desk-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--s3) var(--s5);margin-bottom:var(--s5)}
.desk-top .overline{margin:0}
.desk-prog{appearance:none;-webkit-appearance:none;width:220px;max-width:100%;height:4px;border:0;background:var(--hair-d);color:var(--glass)}
.desk-prog::-webkit-progress-bar{background:var(--hair-d)}
.desk-prog::-webkit-progress-value{background:var(--glass)}
.desk-prog::-moz-progress-bar{background:var(--glass)}
.drill{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:var(--s7);align-items:start}
.drill-art .pic{border:1px solid var(--hair-d)}
.q{font-size:clamp(1.6rem,2.6vw,2.2rem);font-weight:500;color:var(--mast);line-height:1.2;margin:0 0 var(--s5)}
.answers{margin:0}
.ans{position:relative;display:flex;gap:14px;align-items:center;font-weight:500;font-size:1.02rem;line-height:1.4;background:var(--deep);border:1px solid var(--hair-d);border-radius:2px;padding:14px 16px;margin:0 0 10px;cursor:pointer;color:var(--on-d)}
.ans:hover{border-color:var(--glass)}
.ans input{position:absolute;opacity:0;width:1px;height:1px;margin:0;left:18px;top:50%}
.ans-l{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;border:1px solid var(--on-d2);font:italic 500 1.05rem/1 var(--disp);color:var(--mast)}
.ans:focus-within{outline:3px solid var(--ring);outline-offset:2px}
.ans:has(input:checked){border-color:var(--glass);background:var(--deep2)}
.ans:has(input:checked) .ans-l{background:var(--glass);border-color:var(--glass);color:var(--abyss)}
.verdict{border-left:4px solid;padding:var(--s3) var(--s5);margin:0 0 var(--s5);background:var(--deep)}
.verdict p{margin:.3em 0}
.v-word{font:italic 500 2.2rem/1.1 var(--disp)}
.v-right{border-color:var(--stbd-l)}.v-right .v-word{color:var(--stbd-l)}
.v-wrong{border-color:var(--port-l)}.v-wrong .v-word{color:var(--port-l)}
.cite{font-size:.92rem;color:var(--on-d2);border-left:1px solid var(--hair-d);padding-left:12px}
.desk .small{color:var(--on-d2)}
.desk>.shell>.price-line{margin-top:var(--s7)}

/* ---------- logbook ---------- */
.linkbox{border:1px solid var(--ink);background:var(--white);padding:var(--s4) var(--s5);margin:var(--s4) 0}
.linkbox .row{display:flex;gap:8px;margin-top:8px}
.linkbox input{margin:0;font-family:var(--mono);font-size:.85rem}
.prog{width:100%;border-collapse:collapse;margin:var(--s5) 0;font-size:.98rem}
.prog thead th{font:600 .7rem/1.4 var(--text);letter-spacing:.14em;text-transform:uppercase;color:var(--ink2);border-bottom:2px solid var(--ink)}
.prog th,.prog td{padding:12px 10px;border-bottom:1px solid var(--hair);text-align:left}
.prog tbody th{font:500 1.1rem/1.3 var(--disp)}
.prog td{font-variant-numeric:tabular-nums}
.mist{padding-left:0;list-style:none}
.mist-item{display:grid;grid-template-columns:220px minmax(0,1fr);gap:var(--s5);align-items:start;padding:var(--s5) 0;border-top:1px solid var(--hair)}
.q2{font-family:var(--disp);font-size:1.2rem;margin:0 0 6px}
.decklist{padding-left:1.1em}
.decklist li{margin:8px 0}
.pocket-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--s4)}
.pc{border:1px solid var(--hair);padding:10px;background:#fff;break-inside:avoid}
.pc .pic{border:0}
.pc p{margin:8px 0 0;font-size:.9rem;line-height:1.45}
.pc-q{font-size:.82rem!important;color:var(--ink2)}
.pc-cite{font-size:.76rem!important;color:var(--ink2)}

/* ---------- colophon ---------- */
.colophon{background:var(--foam);border-top:6px double var(--ink);color:var(--ink)}
.colo-in{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.6fr) minmax(0,.6fr) minmax(0,1.5fr);gap:var(--s6);padding-top:var(--s7);padding-bottom:var(--s6)}
.colo-word{font:500 2rem/1 var(--disp);margin:0 0 var(--s3)}
.colo-word em{color:var(--teal)}
.colo-tag{color:var(--ink2);font-size:.95rem;max-width:34ch}
.colo-h{font:700 .7rem/1.4 var(--text);letter-spacing:.16em;text-transform:uppercase;color:var(--ink2);margin:0 0 var(--s3)}
.colo-links{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.colo-links a{color:var(--ink);text-decoration:none;padding:2px 0}
.colo-links a:hover{text-decoration:underline;text-decoration-color:var(--teal)}
.fine{font-size:.88rem;line-height:1.6;color:var(--ink2);margin:0}
.colo-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;background:linear-gradient(var(--hair),var(--hair)) var(--gut) 0/calc(100% - 2 * var(--gut)) 1px no-repeat;padding-top:var(--s4);padding-bottom:var(--s5);font-size:.9rem}
.colo-base p{margin:0}
.powered{font-weight:600}
.colo-ver{color:var(--ink2)}

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .cover-in,.drill{grid-template-columns:1fr;gap:var(--s6)}
  .toc-row{grid-template-columns:80px minmax(0,1fr) 220px;gap:var(--s5)}
  .toc-no{font-size:4.4rem}
  .colo-in{grid-template-columns:1fr 1fr}
  .issue-head-in{grid-template-columns:1fr;gap:var(--s3)}
}
@media (max-width:760px){
  body{font-size:16.5px}
  .mast-main{grid-template-columns:1fr auto;padding-top:16px;padding-bottom:14px}
  .wordmark{grid-column:1;gap:8px}
  .mast-log{grid-column:2;padding:7px 12px;font-size:.85rem}
  .sections-in{justify-content:flex-start;padding-left:calc(var(--gut) - 14px);padding-right:0}
  .cover{padding-top:var(--s7)}
  .soundings{grid-template-columns:1fr 1fr;margin-top:var(--s7)}
  .soundings div,.soundings div+div{padding:var(--s4) var(--s3) var(--s4) 0;border-left:0}
  .soundings div:nth-child(even){padding-left:var(--s4);border-left:1px solid var(--hair-d)}
  .soundings div:nth-child(n+3){border-top:1px solid var(--hair-d)}
  .contents,.method,.subscribe{padding-top:var(--s8)}
  .band-head,.notice-in{grid-template-columns:1fr;gap:var(--s2)}
  .toc-row{grid-template-columns:52px minmax(0,1fr);gap:var(--s4);align-items:start}
  .toc-no{font-size:3.4rem;text-align:left}
  .toc-art{grid-column:2}
  .cover-h{font-size:clamp(3.4rem,17vw,5rem)}
  .steps{grid-template-columns:1fr}
  .step,.step+.step{padding:var(--s5) 0;border-left:0;border-bottom:1px solid var(--hair)}
  .plans{grid-template-columns:1fr}
  .plan{padding:var(--s5)}
  .posters{grid-template-columns:1fr}
  .colo-in{grid-template-columns:1fr 1fr;gap:var(--s5)}
  .colo-brand,.colo-fine{grid-column:1/-1}
  .inline-pic{grid-template-columns:1fr}
  .pair{grid-template-columns:1fr}
  .mist-item{grid-template-columns:1fr}
  .linkbox .row{flex-wrap:wrap}
  .prog th,.prog td{padding:8px 5px;font-size:.88rem}
  .prog tbody th{font-size:.98rem}
  .story>.issue-head+p::first-letter{font-size:3.6em}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media print{
  .mast,.colophon,.noprint,.skip,.price-line,.actions{display:none!important}
  body{background:#fff}
  .page{max-width:none;padding:0}
  .pocket-grid{grid-template-columns:repeat(3,1fr);gap:6px}
  a{text-decoration:none}
}
/* ---------- v1.2.0: AdEngine banner (adengine.us) ----------
   One labelled slot between the main content and the colophon, on the public pages only (the controllers opt in). The
   label and the reserved height are on the <ins>, so when tag.js (or ae-size.js) hides a slot it cannot fill, the label,
   the space and its margins go with it; the wrapper keeps only the shell gutter. 110px = 16px label + 4px gap + 90px
   banner; 270px on phones (300x250). Label in the overline voice (Schibsted Grotesk caps, --ink2: 6:1 on --foam).
   display stays in this file and is never !important: tag.js hides a slot with style.display='none'. */
.ae-slot{max-width:var(--shell);margin:0 auto;padding:0 var(--gut)}
.ae-slot ins.adengine{display:block;max-width:728px;min-height:110px;margin:var(--s6) auto var(--s7);text-align:center;text-decoration:none}
.ae-slot ins.adengine::before{content:"Advertisement";display:block;margin-bottom:4px;font:600 11px/16px var(--text);letter-spacing:.16em;text-transform:uppercase;color:var(--ink2)}
.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}}