/* Emergency Kit Plan: the one stylesheet. The printed card with bars, orange colourway (design4, decided 11 Nov 2026).
   White card stock on a soft warm paper, compartments divided by dotted rules, condensed capital labels, one strip of
   a fixed size for every measure. No inline style attribute is used anywhere: fills are SVG attributes. */
@font-face{font-family:"Barlow Condensed";src:url(/assets/fonts/barlow-condensed-latin-500-normal.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(/assets/fonts/barlow-condensed-latin-600-normal.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(/assets/fonts/barlow-condensed-latin-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Figtree";src:url(/assets/fonts/figtree-latin-wght-normal.woff2) format("woff2");font-weight:300 900;font-style:normal;font-display:swap}
:root{
  --stock:#ffffff;--paper:#fcf9f4;--edge:#e3ddd2;
  --slate:#2f3e4c;--quiet:#56646f;--rule:#9aa5ad;--slate-soft:#cbd2d8;
  --teal:#1f7a78;--teal-soft:#9ccbc8;--teal-pale:#e3f0ef;
  --orange:#de6b0a;--orange-deep:#b85500;--orange-soft:#f5b582;
  --mustard:#e9b23a;--mustard-pale:#fcf1d3;
  --label:"Barlow Condensed","Arial Narrow",sans-serif;
  --text:"Figtree",system-ui,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
body{margin:0;background:var(--paper);color:var(--slate);font-family:var(--text);font-size:1.0625rem;line-height:1.45;-webkit-font-smoothing:antialiased}
p,h1,h2,h3,ul,ol,blockquote,fieldset,legend{margin:0;padding:0}
ul{list-style:none}
fieldset{border:0;min-width:0}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
button:disabled{cursor:default}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
:focus-visible{outline:3px solid var(--slate);outline-offset:3px;border-radius:4px}
h1:focus{outline:none}
a{color:var(--teal);font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}
.tap{display:inline-flex;align-items:center;min-height:44px}
.nw{white-space:nowrap}
a[href^="mailto:"]{overflow-wrap:anywhere}

/* the three inks of the card, and the fourth as a fill */
.teal{--ink:var(--teal);--ink-big:var(--teal);--ink-fill:var(--teal)}
.orange{--ink:var(--orange-deep);--ink-big:var(--orange);--ink-fill:var(--orange)}
.slate{--ink:var(--slate);--ink-big:var(--slate);--ink-fill:var(--mustard)}

/* drawings: one even outline, flat fills, knock-outs to white stock */
.o{fill:none;stroke:var(--slate);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.fw{fill:#fff}.ft{fill:var(--teal-soft)}.fT{fill:var(--teal)}.fo{fill:var(--orange-soft)}.fm{fill:var(--mustard)}.fs{fill:var(--slate-soft)}
.ko{fill:#fff}.pw{fill:#fff}.dk{fill:var(--slate)}
.mk-b{fill:#fff;stroke:var(--slate);stroke-width:2}.mk-d{fill:var(--orange)}.mk-l{fill:none;stroke:var(--slate);stroke-width:2;stroke-linecap:round}
.dn-r{fill:none;stroke:var(--slate);stroke-width:1.3;stroke-dasharray:.1 3.62;stroke-linecap:round}.dn-t{fill:none;stroke:var(--slate);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.ic{fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}

/* type */
.lab{display:block;font-family:var(--label);font-weight:600;font-size:.9375rem;letter-spacing:.09em;text-transform:uppercase;line-height:1.2;color:var(--slate)}
.lab-s{font-family:var(--label);font-weight:600;font-size:.875rem;letter-spacing:.08em;text-transform:uppercase;line-height:1.2;color:var(--slate)}
h1{font-size:1.875rem;line-height:1.12;font-weight:700;letter-spacing:-.01em}
.h2{font-size:1.4375rem;line-height:1.2;font-weight:700}
.h3{font-size:1.1875rem;line-height:1.2;font-weight:700}
.hint{font-size:1rem;color:var(--quiet);line-height:1.4}
.tag{display:inline-block;font-family:var(--label);font-weight:600;font-size:.875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--slate);background:var(--mustard-pale);border-radius:4px;padding:2px 6px;margin-right:4px}
.err{margin-top:8px;font-size:1rem;font-weight:600;color:var(--slate);background:var(--mustard-pale);border-left:4px solid var(--orange-deep);border-radius:4px;padding:8px 10px}
.notice{max-width:560px;margin:0 auto 14px;font-size:1rem;background:var(--teal-pale);border-radius:12px;padding:12px 16px}

/* the page frame */
.wrap{max-width:1200px;margin:0 auto;padding:0 12px 30px}
.hd{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 16px;padding:12px 6px 10px}
.brand{display:inline-flex;align-items:center;gap:8px;min-height:44px;text-decoration:none;color:var(--slate)}
.brand svg{width:26px;height:26px;flex:none}
.nav{display:flex;flex-wrap:wrap;gap:0 18px}
.nav a{display:inline-flex;align-items:center;min-height:44px;font-size:1rem}
.nav a[aria-current]{color:var(--slate);text-decoration-thickness:2.5px}
/* build 4: on a phone a "Menu" button takes the place of the links. Its list is the next element, in the flow of the page. */
.menu,.menu-nav{display:none}
.menu-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 12px;border:1.5px solid var(--quiet);border-radius:10px;background:#fff;font-size:1rem;font-weight:600;cursor:pointer;list-style:none;user-select:none}
.menu-btn::-webkit-details-marker{display:none}
.menu-btn svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.menu-nav{flex-basis:100%}
.menu-list a{display:flex;align-items:center;min-height:48px;border-top:2px dotted var(--rule);font-size:1.0625rem}
.menu-list a[aria-current]{color:var(--slate);text-decoration-thickness:2.5px}
@media (max-width:699px){
  .nav-wide{display:none}
  .menu{display:block}
  .menu[open] + .menu-nav{display:block}
}
main{display:block}
.foot{margin-top:34px;padding:18px 6px 0;border-top:2px dotted var(--rule);font-size:1rem}
.foot p{margin-top:8px;color:var(--quiet)}
.foot a{display:inline-flex;align-items:center;min-height:44px}
.foot-links{display:flex;flex-wrap:wrap;gap:0 20px}

/* the paper and the card */
.card{background:var(--stock);border:1px solid var(--edge);border-radius:16px;box-shadow:0 3px 0 var(--edge)}
.card + .card,.card + .tagcard{margin-top:16px}
.card.narrow,.card.panel{max-width:560px;margin-left:auto;margin-right:auto}
.card.panel{margin-top:16px}
.comp{margin:0 18px;padding:18px 0;border-top:2px dotted var(--rule)}
.card > .comp:first-child,.rowA > .comp:first-child,.comp.flush{border-top:0}
.comp.flush{padding-top:0}

/* buttons */
.btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:54px;padding:8px 20px;border:0;border-radius:12px;background:var(--teal);color:#fff;font-size:1.125rem;font-weight:700;text-decoration:none;text-align:center}
.btn2{display:flex;align-items:center;justify-content:center;flex:1;min-height:48px;padding:6px 12px;border:1.5px solid var(--quiet);border-radius:12px;background:#fff;color:var(--slate);font-size:1rem;font-weight:600;text-decoration:none;text-align:center}
.btn2.strong{background:var(--teal);border-color:var(--teal);color:#fff}
.btn2.small{flex:none;min-height:44px}
.linkbtn{display:inline-flex;align-items:center;min-height:44px;padding:0;border:0;background:none;color:var(--teal);font-size:1rem;font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px;text-align:left}
.open{display:inline-flex;align-items:center;justify-content:center;min-width:70px;min-height:44px;padding:0 14px;border:1.5px solid var(--ink);border-radius:22px;color:var(--ink);font-size:1rem;font-weight:600;text-decoration:none}
.acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.acts.wide{max-width:560px;margin:18px auto 0}

/* plus and minus, with a number box between them */
.step{display:flex;align-items:center;gap:2px;flex:none}
.step button{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--quiet);background:#fff;color:var(--slate);display:grid;place-items:center;padding:0}
.step button:disabled{border-color:var(--slate-soft);color:var(--rule)}
.step button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.step .num{width:52px;height:44px;border:0;border-bottom:1.5px solid transparent;border-radius:6px;background:none;padding:0;font-family:var(--label);font-weight:600;font-size:2rem;line-height:1;text-align:center;color:var(--ink-big,var(--slate))}
.step .num:hover,.step .num:focus{border-bottom-color:var(--quiet)}
.step .num.zero{color:var(--slate);font-weight:500}
.step .num:disabled{color:var(--slate);opacity:1;-webkit-text-fill-color:var(--slate)}

/* the strip: a printed bar of one fixed size, inked in from the left, marked into days or items */
.strip{display:block;height:16px;border:1.5px solid var(--slate);border-radius:4px;overflow:hidden;background:#fff}
.strip svg{display:block;width:100%;height:100%}
.strip.tall{height:22px}
.strip.slim{height:11px}
.s-ink{fill:var(--ink-fill)}
.s-mark{stroke:var(--slate);stroke-width:1.25}
.s-end{stroke:var(--slate);stroke-width:1.5}
.scale{display:block;width:100%;height:18px;margin-top:-3px;overflow:visible}
.scale text{font-family:var(--label);font-weight:600;font-size:14px;letter-spacing:.08em;text-transform:uppercase;fill:var(--quiet)}

/* ---------- start ---------- */
.start-head .lede{margin-top:10px}
.pics{display:flex;justify-content:space-between;align-items:center;padding:12px 2px}
.pics svg{width:11%;max-width:36px;height:auto;aspect-ratio:1}
.field .lab{margin-bottom:6px}
.field .lab.second{margin-top:16px}
.select{position:relative}
.select select{appearance:none;-webkit-appearance:none;width:100%;min-height:52px;border:1.5px solid var(--quiet);border-radius:12px;background:#fff;padding:0 44px 0 14px;font-size:1.0625rem;font-weight:600;color:var(--slate)}
.select svg{position:absolute;right:16px;top:50%;width:14px;height:14px;margin-top:-7px;fill:none;stroke:var(--slate);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:54px}
.row .nm{font-size:1.0625rem;font-weight:600}
.more{padding:8px 0 14px}
.more summary{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px;font-weight:600;color:var(--teal);cursor:pointer;list-style:none}
.more summary::-webkit-details-marker{display:none}
.more summary svg{width:14px;height:14px;flex:none;fill:none;stroke:var(--teal);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.more[open] summary svg{transform:rotate(180deg)}
.pickset{margin-top:14px}
.pickset legend{margin-bottom:4px}
.pick{display:flex;align-items:flex-start;gap:12px;min-height:48px;padding:10px 0;cursor:pointer}
.pick input{flex:none;width:24px;height:24px;margin:1px 0 0;accent-color:var(--teal)}
.pick b{display:block;font-weight:600}
.pick small{display:block;font-size:1rem;color:var(--quiet);margin-top:2px}
.pickset.inline{display:flex;flex-wrap:wrap;column-gap:22px}
.pickset.inline legend{width:100%}
.go{padding-bottom:22px}
.go .hint{text-align:center;margin-top:12px}
.quietrow{padding:6px 0;text-align:center}
.ask p{margin-top:8px}

/* ---------- the plan ---------- */
/* The target stamp floats at the top right, so every line of the header runs beside it or under it and never
   behind it. Its margins are wider than the few pixels that its 8 degree turn adds to its box. Do not place it with
   position:absolute: at desktop width the header's text ran under it (Graham, 11 Nov 2026). */
.plan-head{display:flow-root}
.plan-head h1{font-size:2rem}
.plan-head .house{margin-top:10px;font-weight:600}
.plan-head .advice{color:var(--quiet);font-size:1rem;margin-top:2px}
.from{display:inline-block;font-family:var(--label);font-weight:600;font-size:.875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--slate);background:var(--mustard-pale);border-radius:4px;padding:2px 6px;margin-left:4px}
.stamp{float:right;width:86px;height:86px;margin:0 -2px 9px 13px;transform:rotate(-8deg)}
.st0{fill:var(--mustard)}
.st-r{fill:none;stroke:var(--slate);stroke-width:1.6;stroke-dasharray:.1 4.4;stroke-linecap:round}
.st1{font-family:var(--label);font-weight:700;font-size:25px;letter-spacing:.5px;fill:var(--slate)}
.st2{font-family:var(--label);font-weight:700;font-size:14px;letter-spacing:1.6px;fill:var(--slate)}
.sum{font-size:1.1875rem;line-height:1.35;font-weight:600}
.sum .w{color:var(--teal);font-weight:700}
.sum .f{color:var(--orange-deep);font-weight:700}
.gauge{display:grid;grid-template-columns:50px minmax(0,1fr);column-gap:8px;row-gap:8px;align-items:center;margin-top:14px}
.rowN{border-top:0;padding-top:0}
.next{background:var(--mustard-pale);border-radius:12px;padding:16px 16px 18px}
.next .big{font-size:1.375rem;line-height:1.2;font-weight:700;margin-top:4px}
.next .how{margin-top:6px;font-size:1rem}
.next .btn{margin-top:14px}
.listhead{padding:16px 0 2px}
.grp{margin:0 18px;padding:16px 0 18px;border-top:2px dotted var(--rule)}
.tiles .grp:first-child{border-top:0;padding-top:10px}
.g-top{display:grid;grid-template-columns:48px minmax(0,1fr) auto;column-gap:12px;align-items:center}
.pic{width:48px;height:48px}
.grp h3{font-size:1.1875rem;line-height:1.2;font-weight:700;color:var(--ink)}
.grp .strip{margin-top:10px}
.fig{display:flex;align-items:baseline;flex-wrap:wrap;column-gap:6px;font-size:1.0625rem;font-weight:500;line-height:1.1;margin-top:7px}
.fig b{font-family:var(--label);font-weight:600;font-size:2.375rem;line-height:1;color:var(--ink-big)}
.fig .ours{margin-left:auto;align-self:center;display:inline-flex;align-items:center;min-height:44px;margin-top:-6px;margin-bottom:-6px;color:var(--quiet);font-size:1rem;font-weight:500}
.toget{font-size:1rem;line-height:1.4;margin-top:4px}
.toget b{font-weight:600}
.grp .hint{margin-top:6px}
/* A figure and its words, with the stamp of a finished group beside them in a place of its own. */
.figrow{display:flex;align-items:center;justify-content:space-between;gap:10px}
.figrow > div{flex:1;min-width:0}
.done{flex:none;width:54px;height:54px;transform:rotate(-8deg)}
.borrowed{margin-top:10px}
.tagcard .grp{border-top:0;padding-top:10px}
.tag-head{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:16px 0 2px}
.tag-head .hint{width:100%}
.hole{width:16px;height:16px;border-radius:50%;background:var(--paper);border:1.5px solid var(--edge);flex:none}
.kept{max-width:560px;margin:12px auto 0;text-align:center}
.linkbox{width:100%;min-height:48px;margin-top:6px;border:1.5px solid var(--quiet);border-radius:12px;background:var(--paper);padding:0 12px;font-size:1rem}
.panel p{margin-top:8px}
.panel .lab{margin-top:14px}
.status{min-height:24px;font-weight:600}
.plancard + .tagcard{margin-top:16px}
.figures h3,.notes h2{margin-top:0}
.figures .lab{margin-top:22px;padding-top:14px;border-top:2px dotted var(--rule)}
.figures .h2 + .lab{border-top:0;padding-top:0;margin-top:14px}
.calc{margin-top:6px;font-weight:600}
.ours-line{margin-top:8px;font-size:1rem}
.src{margin-top:10px}
blockquote{font-size:1rem;line-height:1.5;border-left:3px solid var(--teal-soft);padding-left:12px}
cite{display:block;font-style:normal;font-size:.9375rem;color:var(--quiet);margin-top:6px;overflow-wrap:anywhere}
cite a{display:inline-block;padding:13px 0;margin:-7px 0;font-size:1rem}
.rd a{display:inline-block;padding:11px 0;margin:-11px 0}
.notes li{padding:12px 0;border-top:2px dotted var(--rule);font-size:1rem}
.notes li:first-child{border-top:0}
.notes ul{margin-top:6px}

/* ---------- group pages ---------- */
.back{padding:6px 0}
.pagehead{display:grid;grid-template-columns:minmax(0,1fr) 22%;column-gap:12px;align-items:center}
.h-page{font-size:2.25rem;color:var(--ink)}
.pagehead .pic{width:100%;height:auto;aspect-ratio:1;max-width:84px;justify-self:end}
.pagehead .strip,.pagehead .figrow,.pagehead .toget,.pagehead .hint{grid-column:1 / -1}
.pagehead .strip{margin-top:14px}
.pagehead .fig{font-size:1.125rem}
.pagehead .fig b{font-size:3.5rem}
.pagehead .hint{margin-top:8px}
.count p{font-size:1rem;line-height:1.45}
.note{background:var(--teal-pale);border-radius:12px;padding:16px 16px 14px}
.note .hint{margin-top:8px}
.note blockquote{margin-top:8px;border-left-color:var(--teal)}
.keep h3{margin-top:20px;padding-bottom:6px;color:var(--ink)}
.keep h3 + .hint{margin:-2px 0 8px}
.keep ul{margin-top:8px}
.slim-bar{position:sticky;top:0;z-index:2;background:#fff;padding:12px 0 10px;border-bottom:2px dotted var(--rule);margin-top:8px}
.slim-bar p{font-size:1rem;font-weight:600;margin-top:6px}
.frow{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:64px;padding:9px 0;border-top:2px dotted var(--rule)}
ul > .frow:first-child{border-top:0}
.frow .nm{display:block;font-size:1.0625rem;font-weight:600;line-height:1.25}
.frow .adds{display:block;font-size:1rem;color:var(--quiet);margin-top:2px}
.add{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:54px;margin-top:18px;border:2px dotted var(--quiet);border-radius:12px;background:#fff;color:var(--slate);font-size:1.0625rem;font-weight:600}
.add svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.addform{margin-top:18px;border:2px dotted var(--quiet);border-radius:12px;padding:16px}
.tf{margin-top:12px}
.tf label{display:block;font-size:1rem;font-weight:600;margin-bottom:4px}
.tf input,.unitbox input{width:100%;min-height:48px;border:1.5px solid var(--quiet);border-radius:12px;background:#fff;padding:0 12px;font-size:1.0625rem;font-weight:600}
[aria-invalid="true"]{border-color:var(--orange-deep) !important;border-width:2.5px !important}
.unitbox{display:flex;align-items:center;gap:10px;margin-top:12px}
.unitbox input{width:104px;flex:none}
.unitbox label{font-size:1.0625rem;font-weight:600}
.unitbox + .hint{margin-top:8px}
.petwater p{font-size:1rem;line-height:1.45;margin-top:6px}
.links{display:grid;border-top:3px dotted var(--rule);margin:0;padding:12px 18px 16px}
.libpick{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.libpick .select{flex:1 1 220px;min-width:0}
.libpick .btn2{flex:none;min-width:90px}
.items .irow,.irow{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:10px;align-items:center;padding:10px 0;border-top:2px dotted var(--rule)}
ul > .irow:first-child{border-top:0}
.tick{display:flex;align-items:center;gap:12px;min-height:48px;cursor:pointer}
.tick input{flex:none;width:26px;height:26px;margin:0;accent-color:var(--teal)}
.irow .nm{font-size:1.0625rem;font-weight:600;line-height:1.25}
.irow .state{font-family:var(--label);font-weight:600;font-size:.9375rem;letter-spacing:.06em;text-transform:uppercase;color:var(--quiet);white-space:nowrap}
.irow.have .state{color:var(--teal)}
.irow .say,.irow .tag,.irow .linkbtn{grid-column:1 / -1}
.irow .tag{justify-self:start;margin-left:38px}
.irow .say{font-size:.9375rem;color:var(--quiet);margin:2px 0 0 38px;overflow-wrap:anywhere}
.irow .linkbtn{margin-left:38px}
.irow.opt{grid-template-columns:minmax(0,1fr) auto}
.irow.opt .say{margin-left:0;grid-column:1 / -1;order:3}
.irow.opt .btn2{grid-row:1;grid-column:2}

/* the water page: the tank, with a wave for its surface */
.tankrow{display:grid;grid-template-columns:48% minmax(0,1fr);column-gap:14px;align-items:center;margin-top:10px}
.tank{display:block;width:100%;height:auto}
.tk-t{font-family:var(--label);font-weight:600;font-size:15px;letter-spacing:.08em;fill:var(--quiet)}
.tankrow .fig{display:block;font-size:1.125rem;line-height:1.2;margin-top:0}
.tankrow .fig b{display:block;font-size:4rem;line-height:.95}
.tankrow .toget{margin-top:8px}
.tankrow .done{margin-top:8px}
.wv{stroke-linejoin:round}
.wv-f{fill:var(--teal-soft);stroke:var(--teal);stroke-width:2.5}
.wv-b{fill:#bfdedb;stroke:none}
.drift{animation:drift 5.5s linear infinite}
.drift-b{animation:drift-b 8s linear infinite}
.tank.go .swell{animation:swell 2.8s cubic-bezier(.3,.6,.3,1) 1}
.hov{transition:transform .9s ease}
.tankbox:hover .hov{transform:scaleY(2.1)}
@keyframes drift{from{transform:translateX(0)}to{transform:translateX(-44px)}}
@keyframes drift-b{from{transform:translateX(-44px)}to{transform:translateX(0)}}
@keyframes swell{0%{transform:scaleY(1)}12%{transform:scaleY(3.4)}45%{transform:scaleY(2)}100%{transform:scaleY(1)}}
@media (prefers-reduced-motion:reduce){.drift,.drift-b,.tank.go .swell{animation:none}.hov{transition:none}.tankbox:hover .hov{transform:none}}

/* ---------- reading pages (about, privacy, disclosure, printable list, 404) ---------- */
.rd{max-width:680px;margin:0 auto}
.rd .comp > * + *{margin-top:12px}
.rd h2{font-size:1.4375rem;line-height:1.2;font-weight:700;margin-top:26px}
.rd ul.dots{list-style:disc;padding-left:22px}
.rd ul.dots li{margin-top:6px}
.plist{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:0 20px}
.plist a{display:inline-flex;align-items:center;min-height:48px}
.intro{max-width:560px;margin:22px auto 0;font-size:1rem}
#app:not([data-view="start"]) ~ .intro{display:none}
.intro h2{font-size:1.1875rem;font-weight:700;margin-top:18px}
.intro p{margin-top:8px}
.meta{font-size:.9375rem;color:var(--quiet)}

/* ---------- paper: the plan as a sheet, on screen and in print ---------- */
.printbar{max-width:210mm;margin:0 auto 14px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;align-items:center}
.printbar .btn{width:auto;min-width:200px}
.printbar .hint{grid-column:1 / -1}
.sheet{max-width:210mm;margin:0 auto;background:#fff;border:1px solid var(--edge);border-radius:6px;padding:5.5%;font-size:.875rem;line-height:1.4;--tint:#e3f0ef;--line:#6f7b85}
.sheet .paper + .paper{margin-top:9mm;padding-top:9mm;border-top:2px dashed var(--rule)}
.sheet .fT,.sheet .ft,.sheet .fo,.sheet .fm,.sheet .fs{fill:var(--tint)}
.sheet .ko{fill:#fff;stroke:var(--slate);stroke-width:1.6;stroke-linejoin:round}
.sheet .pw,.sheet .dk{fill:var(--slate)}
.sheet .lab{font-size:.9375rem}
.sheet .lab-s{font-size:.875rem;color:var(--quiet)}
.sheet .hint{font-size:.875rem;line-height:1.35}
.sheet .kitq{margin:6px 0}
.sheet blockquote{font-size:.875rem;line-height:1.35}
.sheet .tag{font-size:.875rem;background:none;border:1px solid var(--rule);padding:0 4px}
.phead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);column-gap:6%;align-items:end;background:var(--tint);border-radius:11px;padding:13px 19px 15px 23px;break-inside:avoid}
.mast{display:flex;align-items:center;gap:8px}
.mast svg{width:22px;height:22px;flex:none}
.ptitle{font-size:1.875rem;line-height:1.1;font-weight:700;letter-spacing:-.01em;margin-top:6px}
.sheet.blank .ptitle{font-size:1.375rem}
.phead .house,.bag-head .house{font-size:1rem;font-weight:600;margin-top:6px}
.phead .advice{color:var(--quiet)}
.dates{background:#fff;border:2px dotted var(--rule);border-radius:9px;padding:8px 15px 17px}
.wl{display:flex;flex-wrap:wrap;align-items:flex-end;gap:4px 11px;min-height:34px}
.wl .lab{flex:0 1 auto;min-width:0;overflow-wrap:anywhere;padding-bottom:2px}
.wl i{flex:1;min-width:60px;border-bottom:1px solid var(--line)}
.pdate{font-weight:600;padding-bottom:1px}
.sec{margin-top:13px;padding-bottom:6px;border-bottom:2px dotted var(--rule)}
.sheet .strip{height:16px;border-width:1.5px;border-radius:4px}
.sheet .s-ink{fill:var(--teal)}
.g{display:grid;grid-template-columns:45px minmax(0,1fr);column-gap:15px;align-items:start;padding:11px 0;border-bottom:2px dotted var(--rule);break-inside:avoid}
.g .pic{width:45px;height:45px}
.g h3{display:flex;align-items:baseline;justify-content:space-between;gap:11px;font-size:1.0625rem;line-height:1.25;font-weight:700}
.g h3 span{font-size:.875rem;font-weight:500;white-space:nowrap}
.g h3 span b{font-family:var(--label);font-weight:600;font-size:1.4375rem;color:var(--teal)}
.g .strip{margin-top:7px}
.g .hint,.g .amount{margin-top:6px}
.amount{font-weight:600}
.two{display:grid;grid-template-columns:1fr 1fr;column-gap:5%}
.ticks{margin-top:6px}
.ticks li{display:flex;align-items:center;gap:11px;min-height:27px;line-height:1.25;padding:2px 0}
.tb{width:21px;height:21px;flex:none}
.tb-b{fill:#fff;stroke:var(--slate);stroke-width:1.8}
.tb-t{fill:none;stroke:var(--teal);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.opt{font-style:normal;color:var(--quiet)}
.cols{display:grid;grid-template-columns:1fr 1fr 1fr;column-gap:4%;margin-top:9px}
.fl li{display:flex;justify-content:space-between;align-items:flex-end;gap:8px;min-height:27px;line-height:1.2;padding-top:5px}
.fl i{flex:none;width:53px;border-bottom:1px solid var(--line)}
.fl .cnt{margin-left:auto;font-weight:700}
.fl .cnt + i{width:30px}
.calls .wide-line{height:32px;border-bottom:1px solid var(--line)}
.bag-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 23px}
.pfoot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 23px;margin-top:19px;font-size:.875rem;color:var(--quiet)}
.pfoot .lab{flex:0 1 auto;min-width:0;color:var(--quiet)}
.pfoot > :first-child{flex:1 1 240px;min-width:0}

/* preview only: one ink for each group (Graham's review of 11 Nov 2026). The four-ink card is the default. */

/* ---------- build 3: the comparison page and the power-cut planner ---------- */
.rd.wide{max-width:1100px}
.rd.wide .comp > p,.rd.wide .comp > ul,.rd.wide .comp > ol,.rd.wide .comp > h2,.rd.wide .comp > .note,.rd.wide .comp > .toplan,.rd.wide .comp > .notice{max-width:680px}
.rd .notice{margin-left:0}
.lede{font-size:1.1875rem;line-height:1.4}
.sumbox ul{margin-top:8px}
.sumbox li{font-size:1rem}
/* The box "Make it a plan". It has its own class and takes no rule from the planner's .next box: on 11 Nov 2026 the
   planner's three-column desktop rule for .next won over this box's two columns and pushed its button out of the
   box (Graham, on the preview). A part of these two pages never borrows a planner class that sets a layout. */
.toplan{display:grid;gap:12px;background:var(--mustard-pale);border-radius:12px;padding:16px 16px 18px}
.toplan p + p{margin-top:4px}
.cmp-ctl{display:grid;grid-template-columns:1fr;gap:14px;max-width:680px;padding:16px;border:2px dotted var(--quiet);border-radius:12px}
.cmp-ctl .status{font-size:1rem}
ol.rules{list-style:decimal;padding-left:24px}
ol.rules li{margin-top:10px}
.cmp{width:100%;border-collapse:collapse;font-size:1rem;line-height:1.4}
.cmp th,.cmp td{text-align:left;vertical-align:top;font-weight:400}
.cmp thead th{font-family:var(--label);font-weight:600;font-size:.875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--quiet)}
.cmp .gov-h th{font-size:1.25rem;font-weight:700;line-height:1.2}
.cmp td b{font-weight:600}
.cmp .tag{margin:0 0 4px}
.cmp .who,.cmp .read,.cmp .sub{display:block;font-size:.9375rem;color:var(--quiet)}
.cmp .sub{margin-top:2px}
.cmp blockquote{font-size:.9375rem}
.cmp blockquote + blockquote,.cmp .tr + blockquote{margin-top:8px}
.cmp .tr{margin-top:4px;padding-left:15px;font-size:.9375rem;color:var(--quiet)}
.cmp .gov-n td{background:var(--teal-pale);border-radius:12px}
.cmp .gov-n li{margin-top:6px}
.cmp.items tbody th{font-weight:600}
.cmp .own{display:block;margin-top:6px;font-size:.9375rem}
.cmp .own q{quotes:"\201C" "\201D"}
/* a phone, or any narrow column: each row is a block, and each cell carries its own label */
.cmp,.cmp tbody,.cmp tr,.cmp th,.cmp td{display:block}
.cmp thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.cmp tbody.gov{margin-top:22px;padding-top:6px;border-top:2px dotted var(--rule)}
.cmp tbody.gov > tr + tr{margin-top:12px;padding-top:12px;border-top:2px dotted var(--rule)}
.cmp tbody.gov > tr.gov-n{border-top:0;padding-top:0}
.cmp td{padding:6px 0}
.cmp .gov-n td{padding:12px 14px}
.cmp td[data-label]::before,.cmp th[data-label]::before{content:attr(data-label);display:block;font-family:var(--label);font-weight:600;font-size:.875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--quiet)}
.cmp.items tbody tr{padding:12px 0;border-top:2px dotted var(--rule)}
.cmp.items tbody tr:first-child{border-top:0}
.cmp.items tbody th{font-size:1.125rem}
.cmp.items tbody th[data-label]::before{content:none}
@media (min-width:900px){
  .toplan{grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:22px;padding:20px 24px}
  .toplan .btn{width:auto;padding:8px 30px}
  .cmp-ctl{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none}
  .cmp-ctl .status{grid-column:1 / -1}
  .cmp{display:table;margin-top:14px}
  .cmp thead{display:table-header-group;position:static;width:auto;height:auto;clip-path:none}
  .cmp tbody,.cmp tbody.gov{display:table-row-group;margin:0;padding:0;border:0}
  .cmp tr,.cmp tbody.gov > tr + tr{display:table-row;margin:0;padding:0;border:0}
  .cmp th,.cmp td{display:table-cell;padding:12px 16px 12px 0;border-top:2px dotted var(--rule)}
  .cmp thead th{border-top:0;padding-bottom:8px}
  .cmp .gov-h th{padding-top:26px;border-top:2px solid var(--slate)}
  .cmp .gov-n td{border-top:0;padding:12px 14px}
  .cmp td[data-label]::before,.cmp th[data-label]::before{content:none}
  .cmp td:first-child{width:22%}
  .cmp td:nth-child(2){width:14%}
  .cmp td:nth-child(3){width:18%}
  .cmp td:nth-child(4){width:14%}
  .cmp.items tbody tr{padding:0;border:0}
  .cmp.items th[scope="row"]{width:24%;font-size:1rem}
  .cmp.items td:nth-child(2){width:16%}
  .cmp.items td:nth-child(3){width:12%}
  .cmp.items td:nth-child(4){width:auto}
}
/* the planner's dashboard: links to the two other tools */
.moretools .lab{margin-top:0}
.moretools li{padding:4px 0}
.moretools .hint{display:block}
/* the power outage planner: the form, the result with its range bar, and the source rows */
.pw-top{max-width:560px;margin:0 auto 14px;padding:6px 6px 0}
.pw-top .lede{margin-top:10px}
.pw-grid{display:grid;gap:16px}
.pw-grid .card + .card{margin-top:0}
.pw-size{display:grid;grid-template-columns:minmax(0,1fr) 124px;column-gap:12px;align-items:end;margin-top:8px}
.pw-size .tf{margin-top:0}
.pw-size .field .lab{font-family:var(--text);font-size:1rem;font-weight:600;letter-spacing:0;text-transform:none;margin-bottom:4px}
.pw-size .select select{min-height:48px}
.pw-more{padding:2px 0 12px}
.tf .hint,.pw-more > .hint{margin-top:6px}
.pw-dev{border-top:2px dotted var(--rule);padding:4px 0}
.pw-dev .tick{min-height:54px}
.pw-dev .nm{font-size:1.0625rem;font-weight:600}
.pw-result{--ink-fill:var(--teal)}
.pw-wait{margin-top:8px;font-size:1.125rem;font-weight:600}
.pw-bar{margin-top:14px}
.s-rng{fill:var(--teal-soft)}
.s-tgt{stroke:var(--orange-deep);stroke-width:3}
.pw-verdict{margin-top:10px;font-weight:600}
.pw-result .hint{margin-top:8px}
.pw-head{font-size:1.1875rem;line-height:1.35;font-weight:600}
.pw-row{border-top:0;padding-top:0}
.pw-next{background:var(--mustard-pale);border-radius:12px;padding:16px 16px 18px}
.pw-next .big{font-size:1.25rem;line-height:1.2;font-weight:700;margin-top:4px}
.pw-next .how{margin-top:6px;font-size:1rem}
.pw-next .btn{margin-top:14px}
.pw-sum p{margin-top:8px;font-size:1rem}
.pw-sum ul.dots{list-style:disc;padding-left:22px;margin-top:6px;font-size:1rem}
.pw-sum ul.dots li{margin-top:4px}
.pw-notes{margin-top:12px}
.pw-notes li{font-size:1rem;color:var(--quiet);padding:8px 0;border-top:2px dotted var(--rule)}
.pw-med{margin-bottom:16px;background:var(--mustard-pale);border-left:4px solid var(--orange-deep)}
.pw-med p{margin-top:8px}
.pw-src{margin-top:16px}
.pw-c{margin-top:22px;max-width:680px}
.pw-c h3{font-size:1.1875rem;font-weight:700}
.pw-c > p{margin-top:8px}
.pw-rows > li{padding:12px 0;border-top:2px dotted var(--rule)}
.pw-rows > li:first-child{border-top:0}
.pw-rows{max-width:680px}
.ref + .ref,.ref + .ours-line{margin-top:10px}
.ref blockquote + blockquote{margin-top:6px}
@media (min-width:900px){
  .pw-top{max-width:1136px}
  .pw-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;max-width:1136px;margin:0 auto}
  .pw-grid .card.narrow{max-width:none;margin:0}
  /* The result stays in view in its own column while the reader fills the form. It never sits on top of another
     part. It is kept shorter than the window, so it is still whole beside the last box of the form, and a longer
     result scrolls inside its own card, so no line of it is out of reach. */
  .pw-result{position:sticky;top:12px;max-height:min(72vh,640px);overflow-y:auto}
}
@media print{
  .cmp-ctl,.toplan .btn,.pw-acts{display:none !important}
  .rd.wide{max-width:none}
  .card{border:0;box-shadow:none}
  .cmp tbody.gov > tr,.cmp.items tbody tr{break-inside:avoid}
  .cmp .gov-n td,.note,.toplan,.pw-next{background:none;border:1px solid var(--rule)}
}

/* ---------- small phones ---------- */
@media (max-width:379px){
  .comp,.grp{margin-left:14px;margin-right:14px}
  .links{padding-left:14px;padding-right:14px}
  .step .num{width:44px;font-size:1.75rem}
  .sheet{padding:14px}
  .two{grid-template-columns:1fr}
  .cols{grid-template-columns:minmax(0,1fr)}
  .fl li span{min-width:0;overflow-wrap:anywhere}
  .phead{grid-template-columns:1fr;row-gap:10px}
}
@media (max-width:560px){
  .printbar{grid-template-columns:1fr}
  .printbar .btn{width:100%}
}

/* ---------- wide screens: the card opens out, as drawn at 1200 px ---------- */
@media (min-width:900px){
  .wrap{padding:0 32px 46px}
  .card{border-radius:20px;box-shadow:0 4px 0 var(--edge)}
  .rowA{display:grid;grid-template-columns:1fr 1fr}
  .rowA > .comp{margin:0;padding:28px 30px;border-top:0}
  .rowA > .comp + .comp{border-left:2px dotted var(--rule)}
  .plan-head h1{font-size:3.125rem;line-height:1.08;letter-spacing:-.015em}
  .plan-head .house{font-size:1.25rem;margin-top:12px}
  .stamp{width:112px;height:112px;margin:0 4px 11px 18px}
  .covers{display:flex;flex-direction:column;justify-content:center}
  .sum{font-size:1.5625rem;line-height:1.3}
  .gauge{grid-template-columns:64px minmax(0,1fr);column-gap:10px;row-gap:10px;margin-top:20px}
  .strip.tall{height:26px}
  .rowN{margin:0;padding:0 30px 28px}
  .next{border-radius:14px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;column-gap:22px;align-items:center;padding:22px 26px 24px}
  .next .big{font-size:1.75rem;margin-top:0}
  .next .btn{width:auto;margin-top:0;padding:8px 30px;white-space:nowrap}
  .plancard .listhead{margin:0;padding:18px 30px 14px}
  .tiles{display:grid;grid-template-columns:repeat(4,1fr);border-top:2px dotted var(--rule);overflow:hidden;border-radius:0 0 20px 20px}
  .tiles .grp,.tiles .grp:first-child{margin:-2px 0 0 -2px;padding:22px 24px 26px;border-top:2px dotted var(--rule);border-left:2px dotted var(--rule);min-width:0}
  .tiles .g-top{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between}
  .tiles .pic{width:60px;height:60px}
  .tiles h3{width:100%;order:3;margin-top:10px}
  .tiles .fig b{font-size:3rem}
  .tagcard{display:grid;grid-template-columns:1fr 3fr;align-items:center}
  .tagcard .tag-head{margin:0;padding:22px 24px;border:0;align-self:start}
  .tagcard .grp{margin:0;padding:22px 24px 24px;border-left:2px dotted var(--rule)}
}

/* ---------- print: the sheet only, in a flow layout. No fixed page box and no forced page size. ---------- */
@page{margin:12mm}
@media print{
  body{background:#fff;font-size:10.5pt;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .hd,.foot,.printbar,.notice,.noprint,.intro{display:none !important}
  .wrap{max-width:none;padding:0}
  .sheet{max-width:186mm;border:0;border-radius:0;padding:0;font-size:10.5pt}
  .sheet .paper + .paper{margin-top:0;padding-top:0;border-top:0}
  .bagpage{break-before:page}
  .sheet .lab{font-size:11.5pt}
  .sheet .lab-s,.sheet .hint,.sheet blockquote{font-size:10.5pt}
  .ptitle{font-size:23pt}
  .sheet.blank .ptitle{font-size:17pt}
  .g h3{font-size:12.5pt}
  .tb{width:5.5mm;height:5.5mm}
  .ticks li{min-height:7.2mm}
  .fl li{min-height:6.6mm}
  .fl i{width:14mm}
  .calls .wide-line{height:8.5mm}
  .wl i{min-width:35mm}
  .pfoot{font-size:9pt}
  a{color:inherit;text-decoration:none}
}

/* ---------- build 4: the guides, the guides list, the glossary, the contact card ----------
   Every part here has its own class and takes no layout from another page's class. */
.guide{max-width:1100px;margin:0 auto;padding:22px 18px 26px}
.g-head h1{font-size:2rem;line-height:1.1}
.g-crumb{font-family:var(--label);font-weight:600;font-size:.9375rem;letter-spacing:.09em;text-transform:uppercase}
.g-crumb a{display:inline-flex;align-items:center;min-height:44px;color:var(--slate)}
.g-lede{margin-top:10px;font-size:1.1875rem;line-height:1.4;max-width:680px}
.g-head .meta{margin-top:10px;max-width:680px}
.g-answer{margin-top:18px;max-width:760px;background:var(--teal-pale);border-radius:14px;padding:16px 18px 18px}
.g-answer-h{font-family:var(--label);font-weight:600;font-size:1rem;letter-spacing:.09em;text-transform:uppercase;line-height:1.2}
.g-answer p{margin-top:8px;font-size:1.125rem;line-height:1.45}
.g-cols{margin-top:20px}
.g-toc{border-top:2px dotted var(--rule);border-bottom:2px dotted var(--rule);padding:12px 0 8px}
.g-toc-h{font-family:var(--label);font-weight:600;font-size:.9375rem;letter-spacing:.09em;text-transform:uppercase;line-height:1.2}
.g-toc ol{list-style:none;margin:4px 0 0;padding:0}
.g-toc a{display:flex;align-items:center;min-height:44px;font-size:1rem;line-height:1.25}
.g-body{min-width:0;max-width:720px}
.g-sec{margin-top:26px}
.g-sec h2,.g-end h2{font-size:1.5rem;line-height:1.2;font-weight:700}
.g-sec > * + *,.g-end > * + *{margin-top:12px}
.g-list{list-style:disc;padding-left:22px}
.g-list li{margin-top:10px}
.g-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.g-cardlet{border:1.5px solid var(--edge);border-radius:12px;padding:12px 14px 14px;background:var(--paper)}
.g-cardlet h3{font-family:var(--label);font-weight:600;font-size:1.1875rem;letter-spacing:.04em;text-transform:uppercase;line-height:1.15}
.g-cardlet p{margin-top:6px;font-size:1rem}
/* build 6: a guide's tables by country and its source list. On a phone each row is a block and each cell carries its
   label (PLAYBOOK dead end "Stacking a table on a phone"). A guide shows no source quote. */
.gm-wrap{margin-top:14px;border-top:2px solid var(--slate)}
.gm{width:100%;border-collapse:collapse;font-size:1rem;line-height:1.4}
.gm,.gm caption,.gm tbody,.gm tr,.gm th,.gm td{display:block}
.gm caption{text-align:left;padding:10px 0 2px;font-family:var(--label);font-weight:600;font-size:1.0625rem;letter-spacing:.06em;text-transform:uppercase;line-height:1.2;color:var(--slate)}
.gm thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.gm tbody tr{padding:12px 0;border-top:2px dotted var(--rule)}
.gm tbody tr:first-child{border-top:0}
.gm tbody th{text-align:left;font-size:1.125rem;font-weight:700}
.gm td{padding:6px 0 0;overflow-wrap:anywhere}
.gm td[data-label]::before{content:attr(data-label);display:block;font-family:var(--label);font-weight:600;font-size:.875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--quiet)}
.gm td[data-empty]{display:none}
.gm td[data-none]{color:var(--quiet)}
.gm tbody tr[data-mine]{background:var(--teal-pale);padding-left:10px;padding-right:10px}
.gm-note{font-size:.9375rem;color:var(--quiet)}
.g-src{margin-top:30px;border-top:2px solid var(--slate);padding-top:14px}
.g-src h2{font-size:1.5rem;line-height:1.2;font-weight:700}
.g-src h3{margin-top:14px;font-family:var(--label);font-weight:600;font-size:1rem;letter-spacing:.08em;text-transform:uppercase;line-height:1.2;color:var(--slate)}
.g-src p{margin-top:6px;font-size:.9375rem;color:var(--quiet)}
.g-src ul{list-style:disc;padding-left:22px}
.g-src li{margin-top:8px;font-size:.9375rem;line-height:1.4;overflow-wrap:anywhere}
.g-src li a{padding:10px 0}
@media print,(min-width:700px){
  .gm{display:table}
  .gm caption{display:table-caption}
  .gm thead{display:table-header-group;position:static;width:auto;height:auto;clip-path:none}
  .gm tbody{display:table-row-group}
  .gm tr,.gm tbody tr,.gm tbody tr[data-mine]{display:table-row;padding:0}
  .gm th,.gm td,.gm td[data-empty]{display:table-cell;padding:10px 14px 10px 0;border-top:2px dotted var(--rule);vertical-align:top;text-align:left}
  .gm thead th{border-top:0;padding-bottom:6px;font-family:var(--label);font-weight:600;font-size:.875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--quiet)}
  .gm tbody th{font-size:1rem;width:17%}
  .gm td:nth-child(2){width:20%}
  .gm td[data-label]::before{content:none}
  .gm tr[data-mine] th,.gm tr[data-mine] td{background:var(--teal-pale)}
  .gm tr[data-mine] th{padding-left:8px}
}
.g-end{margin-top:30px;background:var(--mustard-pale);border-radius:14px;padding:18px 18px 20px}
.g-acts{display:flex;flex-wrap:wrap;gap:10px}
.g-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:8px 20px;border-radius:12px;background:var(--teal);color:#fff;font-size:1.0625rem;font-weight:700;text-decoration:none;text-align:center}
.g-btn.g-btn-quiet{background:#fff;color:var(--slate);border:1.5px solid var(--quiet);font-weight:600}
.g-err{margin-top:22px;font-size:.9375rem;color:var(--quiet)}
.g-err a{display:inline-block;padding:11px 0;margin:-11px 0}
.g-index{max-width:760px;margin:0 auto}
.g-index .g-lede{margin-top:10px}
.g-ix{margin-top:8px}
.g-ix li{padding:6px 0 12px;border-top:2px dotted var(--rule)}
.g-ix li:first-child{border-top:0}
.g-ix a{display:inline-flex;align-items:center;min-height:44px;font-size:1.1875rem}
.g-ix p{font-size:1rem;color:var(--quiet)}
.g-ix-h{margin-top:22px;font-family:var(--label);font-weight:600;font-size:1rem;letter-spacing:.09em;text-transform:uppercase}
.gl h2{scroll-margin-top:12px}
.gl-ix{font-size:1rem;line-height:2.4}
.gl-q{font-size:1rem;line-height:1.5;border-left:4px solid var(--teal-soft);padding-left:12px;overflow-wrap:anywhere}
.gl-q footer{margin-top:6px;font-size:.9375rem;color:var(--quiet)}
.gl-see{font-size:1rem}
.glink{max-width:560px;margin:14px auto 0;font-size:1rem}
.g-more{max-width:1100px;margin:16px auto 0;padding:14px 18px 12px}
.g-more-h{font-family:var(--label);font-weight:600;font-size:.9375rem;letter-spacing:.09em;text-transform:uppercase;line-height:1.2}
.g-more ul{display:flex;flex-wrap:wrap;gap:0 22px;margin-top:2px}
.g-more a{font-size:1rem}
.ev-src h3{font-family:var(--label);font-weight:600;font-size:.9375rem;letter-spacing:.08em;text-transform:uppercase;line-height:1.2;color:var(--quiet)}
.ev-src ul{list-style:disc;padding-left:22px}
.ev-src li{margin-top:6px;font-size:.9375rem;line-height:1.4;color:var(--quiet);overflow-wrap:anywhere}
.ev-src li a{padding:10px 0}
.ev-when{font-family:var(--label);font-weight:600;font-size:1rem;letter-spacing:.07em;text-transform:uppercase;color:var(--quiet)}
.ev + .ev{border-top:2px dotted var(--rule);padding-top:22px}
/* the blank contact card: paper, lines to write on */
.cc-sheet{font-size:.9375rem}
.cc-title{font-family:var(--label);font-weight:700;font-size:1.75rem;letter-spacing:.04em;text-transform:uppercase;line-height:1.1}
.cc-sub{margin-top:4px;color:var(--quiet)}
.cc-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-top:14px}
.cc-box{border:1.5px solid var(--line);border-radius:6px;padding:10px 12px 12px;break-inside:avoid}
.cc-box h2{font-family:var(--label);font-weight:600;font-size:1.0625rem;letter-spacing:.08em;text-transform:uppercase;line-height:1.2}
.cc-note{font-size:.875rem;color:var(--quiet);margin-top:2px}
.cc-row{display:block;margin-top:8px}
.cc-lab{display:block;font-size:.875rem;color:var(--slate)}
.cc-line{display:block;border-bottom:1.5px solid var(--line);height:26px}
.cc-foot{margin-top:14px;font-size:.875rem;color:var(--quiet)}
@media (min-width:700px){
  .cc-grid{grid-template-columns:1fr 1fr}
}
@media (min-width:900px){
  .guide{padding:34px 40px 40px}
  .g-head h1{font-size:2.875rem;line-height:1.06;letter-spacing:-.015em}
  .g-cols{display:grid;grid-template-columns:240px minmax(0,720px);column-gap:44px;align-items:start}
  .g-toc{border-bottom:0}
  .g-body > .g-sec:first-child{margin-top:0}
}
@media print{
  .g-toc,.g-acts,.cc-bar{display:none !important}
  .guide{padding:0;border:0;box-shadow:none}
  .gm tr{break-inside:avoid}
  .cc-grid{grid-template-columns:1fr 1fr;gap:5mm}
  .cc-row{min-height:9mm}
}