/* The Guest List. The page is the form: ruled paper, lettered sections, typed
   values, and one section that was never printed. Lit, never moody. */
@font-face{font-family:"Newsreader";src:url(/assets/fonts/newsreader-latin-opsz-normal.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Newsreader";src:url(/assets/fonts/newsreader-latin-opsz-italic.woff2) format("woff2");font-weight:200 800;font-style:italic;font-display:swap}
@font-face{font-family:"Newsreader";src:url(/assets/fonts/newsreader-latin-ext-opsz-normal.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Plex Mono";src:url(/assets/fonts/IBMPlexMono-400-latin.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/assets/fonts/IBMPlexMono-500-latin.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/assets/fonts/IBMPlexMono-600-latin.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Plex Sans";src:url(/assets/fonts/IBMPlexSans-400-latin.woff2) format("woff2");font-weight:400;font-display:swap}

:root{
  color-scheme:light;
  --paper:#f4f2ea;      /* form stock */
  --paper-2:#ebe8dc;    /* inset boxes */
  --rule:#b9b4a2;       /* every printed hairline */
  --rule-2:#d6d2c3;
  --ink:#14181f;        /* printed text */
  --ink-2:#3b4250;
  --muted:#6a6f78;
  --typed:#1c3a6e;      /* the filled-in values: ballpoint navy */
  --rope:#7d1a2c;       /* the velvet rope: the room, and only the room */
  --rope-2:#a3283f;
  --brass:#a07a2c;
  --lib:#c8102e; --cpc:#1a4d8f; --ndp:#e66a00; --bq:#1aa3d9;
  --col:700px; --wide:1060px;
  --mono:"Plex Mono",ui-monospace,Menlo,monospace;
  --sans:"Plex Sans",system-ui,sans-serif;
  --serif:"Newsreader",Georgia,serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 19px/1.62 var(--serif);font-optical-sizing:auto;
  background-image:repeating-linear-gradient(0deg,transparent 0 31px,rgba(30,40,60,.035) 31px 32px)}
a{color:var(--typed);text-underline-offset:.18em}
a:hover{color:var(--rope)}
:focus-visible{outline:3px solid var(--brass);outline-offset:3px}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:50}
.wrap{max-width:var(--wide);margin:0 auto;padding:0 24px}
.col{max-width:var(--col);margin:0 auto}
q{quotes:"\201C" "\201D"}

/* masthead: the form's own header strip */
.mast{border-bottom:2px solid var(--ink);background:var(--paper)}
.mast .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:14px;padding-bottom:12px;font:500 12px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.mast .brand{font:600 15px/1 var(--mono);letter-spacing:.08em;color:var(--ink);text-decoration:none}
.mast .brand i{font-style:normal;color:var(--rope)}
.mast a.lang{padding:10px 8px;margin:-10px -8px;text-decoration:none;color:var(--ink-2)}

/* hero: the guest list itself, with every line blank */
.hero{padding:48px 0 28px;border-bottom:1px solid var(--rule)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:40px;align-items:start}
.kicker{font:600 12px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--rope);margin:0 0 22px}
h1{font:600 clamp(40px,6.4vw,74px)/.98 var(--serif);letter-spacing:-.025em;margin:0 0 24px}
h1 em{font-style:italic;font-weight:400;color:var(--rope)}
.deck{font-size:clamp(19px,2.2vw,23px);line-height:1.45;color:var(--ink-2);margin:0 0 26px;max-width:36em}
.listen{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin:0 0 26px}
.listen p{margin:0;font:500 13px/1.3 var(--mono);letter-spacing:.04em;color:var(--ink-2)}
.listen-btn{display:inline-flex;align-items:center;gap:.7em;min-height:52px;padding:0 24px;border:0;border-radius:2px;background:var(--rope);color:#fff;font:600 15px/1 var(--mono);letter-spacing:.06em;cursor:pointer;box-shadow:0 2px 0 #4b0f1a}
.listen-btn:hover{background:var(--rope-2)}
.listen-btn .len{opacity:.8;font-weight:500}
.listen-btn svg{width:14px;height:14px}
.hmeta{display:flex;flex-wrap:wrap;gap:10px 36px;margin:0;padding:16px 0 0;border-top:1px solid var(--rule);font:500 11px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.hmeta b{display:block;margin-top:4px;font:400 15px/1.35 var(--serif);letter-spacing:0;text-transform:none;color:var(--ink)}
.hero-art{margin:0;position:relative}
.hero-art img{display:block;width:100%;height:auto;border:1px solid var(--rule);box-shadow:0 18px 40px -22px rgba(20,24,31,.45)}
.hero-art figcaption{margin-top:10px;font:400 12px/1.45 var(--mono);color:var(--muted)}

/* sections */
main>section{padding:72px 0 40px;border-bottom:1px solid var(--rule-2);scroll-margin-top:16px}
.marker{display:flex;align-items:center;gap:14px;font:600 12px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--rope);margin:0 0 18px}
.marker::after{content:"";flex:1;height:1px;background:var(--rule)}
h2{font:600 clamp(30px,4.2vw,46px)/1.05 var(--serif);letter-spacing:-.02em;margin:0 0 28px}
h2 em{font-style:italic;font-weight:400;color:var(--rope)}
h3{font:600 23px/1.2 var(--serif);margin:0 0 10px}
h4{font:600 13px/1.2 var(--mono);letter-spacing:.12em;text-transform:uppercase;margin:0 0 8px;color:var(--rope)}
p{margin:0 0 18px}
.lead{font-size:22px;line-height:1.5}
.aside{font-size:16px;color:var(--ink-2);border-left:3px solid var(--rule);padding-left:14px}
.rule-note{margin:28px 0 0;padding:16px 18px;background:var(--paper-2);border:1px solid var(--rule);font-size:16px}
.rule-note b{font:600 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--rope);display:block;margin-bottom:6px}

/* the form */
.form{margin:26px 0 30px;border:2px solid var(--ink);background:#fbfaf5}
.fsec{display:grid;grid-template-columns:44px minmax(0,13em) minmax(0,1fr);gap:0 14px;align-items:baseline;padding:13px 14px;border-top:1px solid var(--rule)}
.fsec:first-child{border-top:0}
.fl{font:600 18px/1 var(--mono);color:var(--ink)}
.fn{font:600 13px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.fv{font:400 15px/1.4 var(--mono);color:var(--typed)}
.fsec.h{background:rgba(125,26,44,.07);border-top:2px solid var(--rope);box-shadow:inset 4px 0 0 var(--rope)}
.fsec.h .fl,.fsec.h .fn{color:var(--rope)}
.lg-g{display:block;font-weight:500;color:var(--muted);font-size:12px}

/* the ledger */
.ledger{margin:26px 0 30px;border:2px solid var(--ink);background:#fbfaf5}
.lg-ctl{padding:16px;border-bottom:1px solid var(--rule);display:grid;gap:14px}
.lg-q span{display:block;font:600 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px}
.lg-q input{width:100%;min-height:48px;padding:10px 14px;border:1px solid var(--ink);border-radius:0;background:#fff;font:400 17px/1.2 var(--mono);color:var(--typed)}
.lg-f{display:flex;flex-wrap:wrap;gap:8px}
.lg-f button{min-height:40px;padding:0 14px;border:1px solid var(--rule);background:var(--paper);font:500 13px/1 var(--mono);color:var(--ink);cursor:pointer}
.lg-f button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.lg-count{margin:0;padding:10px 16px;font:500 12px/1 var(--mono);letter-spacing:.08em;color:var(--muted);border-bottom:1px solid var(--rule-2)}
.lg-list{list-style:none;margin:0;padding:0}
.lg-list li{border-bottom:1px solid var(--rule-2)}
.lg-list a{display:grid;grid-template-columns:7.2em minmax(0,1fr) auto;gap:4px 14px;padding:12px 16px;text-decoration:none;color:var(--ink)}
.lg-list a:hover{background:#fff}
.lg-d{font:500 13px/1.4 var(--mono);color:var(--muted)}
.lg-s{font:600 17px/1.3 var(--serif)}
.lg-s small{display:block;font:400 14px/1.4 var(--mono);color:var(--ink-2);margin-top:2px}
.lg-p{font:600 13px/1.4 var(--mono);color:var(--typed);text-align:right;white-space:nowrap}
.lg-tag{display:inline-block;margin:4px 6px 0 0;padding:2px 7px;font:600 11px/1.4 var(--mono);letter-spacing:.04em;border:1px solid currentColor}
.lg-tag.priv{color:var(--rope)}.lg-tag.blank{color:var(--brass)}.lg-tag.cap{color:var(--typed)}
.party{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:1px;background:var(--muted)}
.party.Liberal{background:var(--lib)}.party.Conservative{background:var(--cpc)}.party.NDP{background:var(--ndp)}.party.Bloc{background:var(--bq)}
.lg-more{display:block;width:100%;min-height:52px;border:0;border-top:1px solid var(--rule);background:var(--paper-2);font:600 14px/1 var(--mono);cursor:pointer}
.lg-empty{padding:18px 16px;font:400 15px/1.4 var(--mono);color:var(--muted)}

.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border:1px solid var(--rule);margin:0 0 28px;background:#fbfaf5}
.stats div{padding:16px;border-left:1px solid var(--rule)}
.stats div:first-child{border-left:0}
.stats b{display:block;font:600 34px/1 var(--serif);color:var(--rope)}
.stats span{display:block;margin-top:8px;font:400 13px/1.35 var(--mono);color:var(--ink-2)}

/* figures */
.fig{margin:26px 0 30px;padding:16px;border:1px solid var(--rule);background:#fbfaf5}
.fig figcaption{font:600 12px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
.bars{display:grid;gap:10px}
.brow{display:grid;grid-template-columns:10.5em minmax(0,1fr) 4.2em;gap:10px;align-items:center;font:400 13px/1.3 var(--mono)}
.btrack{height:22px;background:var(--paper-2);border:1px solid var(--rule-2);display:flex}
.bseg{height:100%}
.bval{text-align:right;font-weight:600;color:var(--ink);white-space:nowrap}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:12px;font:400 12px/1.3 var(--mono);color:var(--ink-2)}
.legend i{display:inline-block;width:11px;height:11px;margin-right:6px;vertical-align:-1px}

/* calculator */
.calc{margin:26px 0 30px;border:2px solid var(--ink);background:#fbfaf5;padding:16px}
.calc-h{font:600 12px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;margin:0 0 10px}
.calc-row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px dotted var(--rule);font:400 15px/1.3 var(--mono)}
.calc-row b{color:var(--typed);white-space:nowrap}
.calc-row.tot{border-bottom:2px solid var(--ink);font-weight:600}
.calc-row.tot b{color:var(--rope);font-size:18px}
.calc-note{margin:12px 0 0;font-size:15px;color:var(--ink-2)}

.case{border-top:2px solid var(--ink);padding:18px 0 6px}
.compare{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:8px 0 28px}
.compare div{border:1px solid var(--rule);background:#fbfaf5;padding:16px}
.compare p{font-size:16px;margin:0}
.asks{padding-left:1.3em}
.asks li{margin:0 0 14px;padding-left:4px}
.asks b{font-family:var(--mono);font-size:15px;letter-spacing:.02em}

/* back matter */
.back{padding:56px 0 40px}
.back h2{font-size:30px}
.src{padding-left:1.2em;font-size:16px}
.src li{margin-bottom:8px}
.back .method{font-size:16px;color:var(--ink-2)}
.circulate{padding:48px 0 56px;border-top:2px solid var(--ink);background:var(--paper-2)}
.sh-grid{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.sh-grid a,.sh-grid button{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--ink);background:#fff;font:500 14px/1 var(--mono);color:var(--ink);text-decoration:none;cursor:pointer}
.sh-strip{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.sh-tile{background:#fff;border:1px solid var(--rule)}
.sh-tile img{display:block;width:100%;height:auto}
.sh-tile-foot{padding:12px}
.sh-tile-cap{margin:0 0 10px;font-size:15px;line-height:1.4}
.sh-tile-cap b{font-family:var(--mono);color:var(--rope);margin-right:8px}
.sh-tile-acts{display:flex;flex-wrap:wrap;gap:6px}
.sh-tile-acts a,.sh-tile-acts button{min-height:36px;display:inline-flex;align-items:center;padding:0 10px;border:1px solid var(--rule);background:var(--paper);font:500 12px/1 var(--mono);color:var(--ink);text-decoration:none;cursor:pointer}
.sh-toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:10px 16px;font:500 13px/1.3 var(--mono);z-index:80}
footer.foot{padding:24px 0 120px;font:400 13px/1.5 var(--mono);color:var(--muted);border-top:1px solid var(--rule)}

/* narrator skin: the shared player's behaviour, this property's look */
.narr{position:fixed;left:0;right:0;bottom:0;z-index:40;pointer-events:none}
.narr[hidden]{display:none}
.narr-pill{pointer-events:auto;position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 18px;border:0;background:var(--rope);color:#fff;font:600 14px/1 var(--mono);box-shadow:0 8px 24px -10px rgba(0,0,0,.5);cursor:pointer}
.narr-pill .meta{opacity:.8;font-weight:500}
.narr[data-state="open"] .narr-pill{display:none}
.narr-bar{pointer-events:auto;display:none;background:var(--ink);color:#fff;padding:0 0 env(safe-area-inset-bottom)}
.narr[data-state="open"] .narr-bar{display:block}
.narr-track{position:relative;height:6px;background:#2d3440;cursor:pointer}
.narr-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--brass)}
.narr-mark{position:absolute;top:0;bottom:0;width:2px;background:#5b6474}
.narr-controls{display:flex;align-items:center;gap:10px;max-width:var(--wide);margin:0 auto;padding:10px 16px}
.narr-play{flex:none;width:46px;height:46px;border:0;border-radius:50%;background:var(--rope);color:#fff;display:grid;place-items:center;cursor:pointer}
.narr-meta{flex:1;min-width:0}
.narr-label{margin:0;font:600 14px/1.3 var(--mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.narr-sub{margin:2px 0 0;font:400 13px/1.35 var(--serif);color:#c9ced8;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.narr-btn{flex:none;min-height:40px;padding:0 12px;border:1px solid #4a5363;background:transparent;color:#fff;font:500 12px/1 var(--mono);cursor:pointer}
.narr-follow[data-on="1"]{border-color:var(--brass);color:#f3d48a}
.narr-speaking{background:rgba(160,122,44,.16);box-shadow:-10px 0 0 rgba(160,122,44,.16),10px 0 0 rgba(160,122,44,.16)}

@media (max-width:860px){
  .hero-grid{grid-template-columns:1fr;gap:24px}
  .hero-art{order:2}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stats div:nth-child(3){border-left:0}
  .stats div:nth-child(n+3){border-top:1px solid var(--rule)}
  .compare{grid-template-columns:1fr}
}
@media (max-width:560px){
  body{font-size:18px}
  .wrap{padding:0 16px}
  .lead{font-size:20px}
  main>section{padding:54px 0 30px}
  .fsec{grid-template-columns:30px minmax(0,1fr);}
  .fsec .fv{grid-column:2}
  .lg-list a{grid-template-columns:minmax(0,1fr) auto}
  .lg-d{grid-column:1 / -1}
  .brow{grid-template-columns:7.4em minmax(0,1fr) 3.9em;font-size:12px}
  .narr-rate{display:none}
  .mast .wrap{font-size:11px}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media print{.narr,.circulate,.listen{display:none}}