:root{
  --paper:#FBFAF7; --surface:#FFFFFF; --surface-2:#F3F1EC; --line:#E2DED5;
  --ink:#1B2430; --ink-2:#5A6472; --ink-3:#8B93A1;
  --accent:#2F6F62; --accent-soft:#E4F0EC; --accent-ink:#1E4A41;
  --warm:#C2703D; --warm-soft:#FBEEE4;
  --btn-fg:#FFFFFF;
  --radius:14px; --radius-sm:9px;
  --shadow:0 1px 2px rgba(27,36,48,.05), 0 6px 20px rgba(27,36,48,.06);
  --maxw:44rem;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#14181D; --surface:#1D242B; --surface-2:#232B33; --line:#333D47;
    --ink:#E8E6E1; --ink-2:#A9B2BD; --ink-3:#78828E;
    --accent:#6FBFAB; --accent-soft:#1F3630; --accent-ink:#A8DCCE;
    --warm:#E0925F; --warm-soft:#372620; --btn-fg:#0F1A17;
    --shadow:0 1px 2px rgba(0,0,0,.3), 0 6px 20px rgba(0,0,0,.25);
  }
}
:root[data-theme="dark"]{
  --paper:#14181D; --surface:#1D242B; --surface-2:#232B33; --line:#333D47;
  --ink:#E8E6E1; --ink-2:#A9B2BD; --ink-3:#78828E;
  --accent:#6FBFAB; --accent-soft:#1F3630; --accent-ink:#A8DCCE;
  --warm:#E0925F; --warm-soft:#372620; --btn-fg:#0F1A17;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 6px 20px rgba(0,0,0,.25);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--paper); color:var(--ink);
  font-family:"Be Vietnam Pro", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size:17px; line-height:1.55; -webkit-text-size-adjust:100%; overflow-x:hidden;
}
h1,h2,h3{line-height:1.22; margin:0 0 .4em; font-weight:700; letter-spacing:-.015em}
h1{font-size:1.6rem} h2{font-size:1.26rem} h3{font-size:1.02rem}
p{margin:0 0 .85em}
button{font:inherit; cursor:pointer}
input,textarea{font:inherit; color:inherit}
a{color:var(--accent)}
.wrap{max-width:var(--maxw); margin:0 auto; padding:1.1rem 1.1rem 5rem}
.wide{max-width:70rem}

/* bilingual block */
.bi .en{font-weight:600}
.bi .vi{color:var(--ink-3); font-size:.86em; font-weight:400; margin-top:.05em}
.bi.big .en{font-size:1.3rem; font-weight:700; letter-spacing:-.015em; line-height:1.25}
.bi.big .vi{font-size:.95rem; margin-top:.15em}

.topbar{position:sticky; top:0; z-index:20; background:color-mix(in srgb, var(--paper) 88%, transparent);
  backdrop-filter:saturate(1.4) blur(10px); border-bottom:1px solid var(--line)}
.topbar-in{max-width:var(--maxw); margin:0 auto; padding:.6rem 1.1rem; display:flex; align-items:center; gap:.6rem}
.wide .topbar-in{max-width:70rem}
.brand{font-weight:700; font-size:.95rem; letter-spacing:-.015em}
.brand small{display:block; font-weight:500; font-size:.72rem; color:var(--ink-3)}
.pill{font-size:.7rem; font-weight:600; padding:.22rem .6rem; border-radius:99px;
  background:var(--accent-soft); color:var(--accent-ink); white-space:nowrap; margin-left:auto}
.pill + .pill{margin-left:.35rem}
.pill.warm{background:var(--warm-soft); color:var(--warm)}
.pill.mute{background:var(--surface-2); color:var(--ink-3)}

.rail{display:flex; gap:.3rem; margin:0 0 1.3rem}
.rail div{flex:1; height:5px; border-radius:99px; background:var(--line); transition:background .3s}
.rail div.on{background:var(--accent)}
.rail-label{display:flex; justify-content:space-between; gap:1rem; font-size:.7rem; color:var(--ink-3);
  margin-bottom:.35rem; font-weight:600; text-transform:uppercase; letter-spacing:.05em}
.rail-label span:last-child{text-transform:none; letter-spacing:0; font-weight:500; text-align:right}

.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.15rem; box-shadow:var(--shadow); margin:0 0 1rem}
.kicker{font-size:.7rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--accent); margin:0 0 .45rem}
.kicker.warm{color:var(--warm)}
.lede{color:var(--ink-2); font-size:.93rem}
.hint{font-size:.83rem; color:var(--ink-3); margin:.4rem 0 0}
.center{text-align:center} .muted{color:var(--ink-3)}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.86rem}
.hidden{display:none !important}

.points{margin-top:1rem; display:flex; flex-direction:column; gap:.7rem}
.point{padding-left:.9rem; border-left:3px solid var(--accent-soft)}
.point .en{font-weight:600}
.point .vi{color:var(--ink-3); font-size:.88em}

.field{margin:0 0 1.05rem}
.field > label{display:flex; align-items:flex-start; gap:.5rem; font-size:.95rem; margin:0 0 .3rem}
.field .sub{font-size:.8rem; color:var(--ink-3); margin:0 0 .4rem}
.qn{flex:none; width:1.5rem; height:1.5rem; border-radius:7px; background:var(--accent-soft); color:var(--accent-ink);
  display:grid; place-items:center; font-size:.75rem; font-weight:700; margin-top:.1rem}
textarea,input[type=text]{width:100%; background:var(--surface-2); border:1.5px solid var(--line);
  border-radius:var(--radius-sm); padding:.65rem .75rem; resize:vertical; transition:border-color .15s,background .15s}
textarea:focus,input[type=text]:focus{outline:none; border-color:var(--accent); background:var(--surface)}
textarea{min-height:4.4rem; line-height:1.45}
textarea.tall{min-height:9rem}

.btn{display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  background:var(--accent); color:var(--btn-fg); border:none; border-radius:var(--radius-sm);
  padding:.78rem 1.3rem; font-weight:600; font-size:1rem; width:100%; transition:filter .15s, transform .06s}
.btn:hover{filter:brightness(1.07)} .btn:active{transform:translateY(1px)}
.btn.ghost{background:var(--surface); color:var(--ink); border:1.5px solid var(--line)}
.btn.ghost:hover{border-color:var(--accent); color:var(--accent)}
.btn.small{width:auto; padding:.4rem .8rem; font-size:.84rem}
.btn-row{display:flex; gap:.5rem; flex-wrap:wrap}
.btn-row .btn{width:auto; flex:1; min-width:7rem}

.choices{display:flex; flex-direction:column; gap:.45rem}
.choice{display:flex; align-items:flex-start; gap:.65rem; text-align:left; width:100%;
  background:var(--surface-2); border:1.5px solid var(--line); border-radius:var(--radius-sm);
  padding:.7rem .8rem; color:var(--ink); font-weight:500; transition:all .15s}
.choice:hover{border-color:var(--accent)}
.choice.sel{background:var(--accent-soft); border-color:var(--accent); color:var(--accent-ink)}
.choice .tick{flex:none; width:1.35rem; height:1.35rem; border-radius:99px; border:1.5px solid var(--line);
  display:grid; place-items:center; font-size:.7rem; font-weight:700; margin-top:.1rem}
.choice.sel .tick{background:var(--accent); border-color:var(--accent); color:var(--surface)}

.slots{border:1px solid var(--line); border-radius:var(--radius-sm); overflow:hidden}
.slot{display:grid; grid-template-columns:8.5rem 1fr; border-bottom:1px solid var(--line)}
.slot:last-child{border-bottom:none}
.slot > .nm{background:var(--surface-2); padding:.6rem .75rem; font-weight:600; font-size:.86rem;
  border-right:1px solid var(--line)}
.slot > .vl{padding:.6rem .75rem; font-size:.92rem; color:var(--ink-2)}
@media(max-width:34rem){
  .slot{grid-template-columns:1fr}
  .slot > .nm{border-right:none; border-bottom:1px solid var(--line); padding:.4rem .75rem}
}

.slotbox{border:2px dashed var(--warm); background:var(--warm-soft); border-radius:var(--radius-sm);
  padding:.9rem; text-align:center; color:var(--warm); font-size:.86rem; font-weight:600}
.slotbox b{display:block; font-size:.68rem; text-transform:uppercase; letter-spacing:.09em; margin-bottom:.25rem; opacity:.8}
.slotbox .sub{font-weight:400; font-size:.8rem; opacity:.8; margin-top:.2rem}

.waiting{display:grid; place-items:center; min-height:52vh; text-align:center}
.dot{display:inline-block; width:.5rem; height:.5rem; border-radius:99px; background:var(--accent); animation:blink 1.4s infinite}
.dot:nth-child(2){animation-delay:.2s} .dot:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,60%,100%{opacity:.25} 30%{opacity:1}}

.timer{font-size:5.5rem; font-weight:700; letter-spacing:-.03em; text-align:center; font-variant-numeric:tabular-nums}

/* wall */
.wall{padding:2rem 2.4rem; min-height:100vh}
.wall h1{font-size:2.7rem; margin-bottom:.1rem}
.wall .sub{font-size:1.1rem; color:var(--ink-3); margin-bottom:1.5rem}
.wall .points.big .en{font-size:1.55rem; line-height:1.3}
.wall .points.big .vi{font-size:1.1rem; margin-top:.15rem}
.wall .points.big .point{border-left-width:4px; padding-left:1.1rem}
.grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(15rem,1fr)); gap:.65rem}
.note{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm);
  padding:.7rem .85rem; box-shadow:var(--shadow); animation:pop .35s ease-out}
.note .who{font-size:.7rem; font-weight:700; color:var(--accent); text-transform:uppercase; letter-spacing:.05em}
.note .txt{font-size:.94rem; margin-top:.15rem}
@keyframes pop{from{opacity:0; transform:translateY(8px) scale(.98)} to{opacity:1; transform:none}}
.bigcount{font-size:4.6rem; font-weight:700; line-height:1; letter-spacing:-.03em}
.bars{display:flex; flex-direction:column; gap:.55rem; margin-top:.8rem}
.bar{display:grid; grid-template-columns:14rem 1fr 3rem; align-items:center; gap:.7rem; font-size:1rem}
.bar .track{height:1.9rem; background:var(--surface-2); border-radius:6px; overflow:hidden}
.bar .fill{height:100%; background:var(--accent); border-radius:6px; transition:width .5s cubic-bezier(.2,.8,.2,1)}
.sixgrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(16rem,1fr)); gap:.7rem; margin-top:.5rem}
.sixcell{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm); padding:.85rem 1rem; box-shadow:var(--shadow)}
.sixcell .n{font-size:.7rem; font-weight:700; color:var(--accent)}
.sixcell .en{font-size:1.15rem; font-weight:600; line-height:1.25}
.sixcell .vi{font-size:.92rem; color:var(--ink-3)}

/* console */
.stagelist{display:flex; flex-direction:column; gap:.25rem}
.stagebtn{display:flex; align-items:center; gap:.65rem; width:100%; text-align:left;
  background:var(--surface); border:1.5px solid var(--line); border-radius:var(--radius-sm);
  padding:.5rem .75rem; color:var(--ink); font-size:.9rem; font-weight:500}
.stagebtn:hover{border-color:var(--accent)}
.stagebtn.cur{background:var(--accent-soft); border-color:var(--accent); color:var(--accent-ink); font-weight:700}
.stagebtn.do{border-left:4px solid var(--warm)}
.stagebtn small{display:block; font-weight:400; font-size:.72rem; color:var(--ink-3)}
.stagebtn .n{flex:none; width:1.6rem; height:1.6rem; border-radius:6px; background:var(--surface-2);
  display:grid; place-items:center; font-size:.7rem; font-weight:700; color:var(--ink-3)}
.stagebtn.cur .n{background:var(--accent); color:var(--surface)}
.stagebtn .grp{font-size:.62rem; color:var(--ink-3); margin-left:auto; font-weight:700; letter-spacing:.06em}
.divider{font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.09em; color:var(--ink-3); margin:.9rem 0 .3rem}

.chooser{display:grid; gap:.65rem; margin-top:1.3rem}
.chooser a{display:block; text-decoration:none; color:inherit; background:var(--surface);
  border:1.5px solid var(--line); border-radius:var(--radius); padding:.95rem 1.05rem; box-shadow:var(--shadow)}
.chooser a:hover{border-color:var(--accent)}
.chooser b{display:block; font-size:1.02rem}
.chooser span{font-size:.86rem; color:var(--ink-3)}

.filewarn{background:var(--warm-soft); border-bottom:2px solid var(--warm); color:var(--warm);
  padding:.65rem 1.1rem; font-size:.85rem; font-weight:600; text-align:center; line-height:1.4}
.filewarn a{color:inherit; display:block; font-weight:800}

/* all-in-one */
.allbar{position:sticky; top:0; z-index:40; background:var(--surface); border-bottom:1px solid var(--line);
  display:flex; align-items:center; gap:.5rem; padding:.5rem .9rem; flex-wrap:wrap}
.allbar .now{font-weight:700; font-size:.95rem; margin-right:auto}
.allbar .now small{display:block; font-weight:500; color:var(--ink-3); font-size:.72rem}
.allgrid{display:grid; grid-template-columns:19rem 23rem 1fr; gap:1px; background:var(--line); height:calc(100vh - 3.1rem)}
.pane{background:var(--paper); overflow:auto; position:relative}
.pane > .paneh{position:sticky; top:0; z-index:5; background:var(--surface-2); border-bottom:1px solid var(--line);
  font-size:.66rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); padding:.3rem .8rem}
.pane.wallpane{zoom:.6}
@media(max-width:70rem){
  .allgrid{grid-template-columns:1fr; height:auto}
  .pane.wallpane{zoom:.8}
}
@media print{.topbar,.btn,.allbar{display:none}}

/* ── projector: two columns, always filled ─────────────────────────── */
.cols{display:grid;grid-template-columns:1.05fr .95fr;gap:2.2rem;align-items:start;margin-top:.5rem}
.colL,.colR{min-width:0}
.ptitle{margin:0 0 .8rem}
.ptitle .en{font-size:1.05rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent)}
.ptitle .vi{font-size:.95rem;color:var(--ink-3)}
.sixstack{display:flex;flex-direction:column;gap:.5rem}
.sixrow{display:flex;gap:.8rem;align-items:flex-start;background:var(--surface);border:1px solid var(--line);
  border-radius:10px;padding:.6rem .9rem;box-shadow:var(--shadow)}
.sixrow .n{flex:none;width:1.8rem;height:1.8rem;border-radius:7px;background:var(--accent-soft);color:var(--accent-ink);
  display:grid;place-items:center;font-size:.85rem;font-weight:700}
.sixrow .en{font-size:1.12rem;font-weight:600;line-height:1.25}
.sixrow .vi{font-size:.92rem;color:var(--ink-3)}
.bigurl{font-size:1.5rem;font-weight:700;word-break:break-all;letter-spacing:-.01em;margin-bottom:.9rem}
.qrimg{width:min(26vw,320px);background:#fff;padding:14px;border-radius:14px;display:block}
.proofimg{width:100%;border-radius:12px;border:1px solid var(--line);box-shadow:var(--shadow)}
.quote{background:var(--warm-soft);border-left:5px solid var(--warm);border-radius:0 12px 12px 0;
  padding:1rem 1.2rem;font-size:1.15rem;line-height:1.5;white-space:pre-wrap}
.sitewrap{display:flex;flex-direction:column;height:100%}
.siteframe{width:100%;height:min(58vh,620px);border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow)}
.grid.one{grid-template-columns:1fr}
.muted.cap{font-size:1.02rem;margin-top:.3rem}
.note .txt.dim{opacity:.55}
.wall .bigcount{font-size:3.8rem}
.wall .points.big .en{font-size:1.5rem}
@media(max-width:60rem){.cols{grid-template-columns:1fr;gap:1.3rem}}

/* ── in-app test ───────────────────────────────────────────────────── */
.qblock{margin:0 0 1.3rem;padding:0 0 1.1rem;border-bottom:1px solid var(--line)}
.qblock:last-of-type{border-bottom:none}
.qhead{display:flex;gap:.6rem;align-items:flex-start;margin-bottom:.55rem}
.qhead .qn{margin-top:.15rem}
.choice.tight{padding:.55rem .7rem}
.choice.tight .bi .en{font-weight:500;font-size:.95rem}
.choice.tight .bi .vi{font-size:.82rem}
.choice.tight .tick{width:1.5rem;height:1.5rem;font-size:.75rem}

/* ── projector: one column, large ──────────────────────────────────── */
.wall{padding:2.6rem 3rem}
.wall h1{font-size:4rem;line-height:1.08;margin-bottom:.12em}
.wall .sub{font-size:1.5rem;margin-bottom:2.2rem}
.wall .points{gap:1.6rem;margin-top:0}
.wall .points.big .point{border-left-width:6px;padding-left:1.6rem}
.wall .points.big .en{font-size:2.35rem;line-height:1.28;font-weight:700}
.wall .points.big .vi{font-size:1.5rem;margin-top:.25rem}
.wall .bigcount{font-size:7rem}
.wall .muted.cap{font-size:1.5rem;margin-top:.4rem}
.wall .note .who{font-size:1rem}
.wall .note .txt{font-size:1.35rem;line-height:1.4}
.wall .note{padding:1rem 1.2rem}
.wall .grid{grid-template-columns:repeat(auto-fill,minmax(23rem,1fr));gap:1rem;margin-top:1.4rem}
.wall .bar{grid-template-columns:20rem 1fr 4rem;font-size:1.4rem;gap:1rem}
.wall .bar .track{height:2.6rem}
.wall .sixrow{padding:1rem 1.3rem}
.wall .sixrow .n{width:2.6rem;height:2.6rem;font-size:1.15rem;border-radius:9px}
.wall .sixrow .en{font-size:1.9rem;line-height:1.25}
.wall .sixrow .vi{font-size:1.25rem}
.wall .sixstack{gap:.7rem}
.wall .quote{font-size:1.8rem;line-height:1.45;padding:1.4rem 1.8rem;border-left-width:8px}
.wall .timer{font-size:9rem}
.under{margin-top:2.2rem}
.qrrow{display:flex;gap:3rem;align-items:center;flex-wrap:wrap}
.qrrow .bigurl{font-size:2.6rem;margin:0}
.proofimg.wide{max-width:min(100%,1100px)}
.wall .siteframe{height:min(52vh,560px)}
.cols{display:block}
.credit{font-size:1.05rem;color:var(--ink-3);margin-top:.6rem}
.wall .proofimg.wide{width:100%;max-width:1500px;height:min(34vh,340px);object-fit:cover;border-radius:14px;display:block}

/* ═══ PASS 3 · legibility on a phone and on a projector ═══════════════ */

/* phone — every learner control up a step */
body{font-size:18px}
.bi.big .en{font-size:1.5rem;line-height:1.22}
.bi.big .vi{font-size:1.05rem}
.field > label{font-size:1.06rem;font-weight:600}
.field .sub{font-size:.92rem}
textarea,input[type=text]{font-size:1.06rem;padding:.8rem .9rem}
textarea{min-height:5.4rem}
.lede{font-size:1.02rem}
.hint{font-size:.92rem}
.choice{padding:.85rem .95rem;font-size:1.04rem}
.choice .tick{width:1.6rem;height:1.6rem;font-size:.82rem}
.btn{font-size:1.1rem;padding:.9rem 1.4rem}
.kicker{font-size:.78rem}
.slot > .nm{font-size:.95rem}
.slot > .vl{font-size:1.04rem;color:var(--ink)}
.qblock{margin-bottom:1.7rem}
.choice.tight{padding:.7rem .85rem}
.choice.tight .bi .en{font-size:1.02rem}
.choice.tight .bi .vi{font-size:.88rem}

/* projector — answers readable from the back row */
.wall .note .who{font-size:1.2rem;letter-spacing:.04em}
.wall .note .txt{font-size:1.55rem;line-height:1.4;white-space:pre-wrap;overflow-wrap:anywhere}
.wall .note{padding:1.15rem 1.35rem}
.wall .grid{margin-top:1.5rem;gap:1.1rem}
.wall .grid.n-xl{grid-template-columns:1fr}
.wall .grid.n-xl .txt{font-size:2.1rem}
.wall .grid.n-lg{grid-template-columns:repeat(2,1fr)}
.wall .grid.n-lg .txt{font-size:1.8rem}
.wall .grid.n-md{grid-template-columns:repeat(3,1fr)}
.wall .grid.n-sm{grid-template-columns:repeat(4,1fr)}
.wall .grid.n-sm .txt{font-size:1.25rem}
.note.tap{cursor:pointer;transition:transform .12s,border-color .12s}
.note.tap:hover{transform:translateY(-2px);border-color:var(--accent)}

/* who is in the room, on the join screen */
.joinrow{display:flex;align-items:baseline;gap:1rem;margin-top:1.4rem}
.names{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0 2rem}
.nametag{background:var(--accent-soft);color:var(--accent-ink);border-radius:99px;
  padding:.45rem 1.1rem;font-size:1.5rem;font-weight:600;animation:pop .35s ease-out}

/* one answer, full screen */
.focusbox{cursor:pointer;padding-top:.5rem}
.fwho{font-size:1.6rem;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.06em;margin-bottom:1.4rem}
.flines{display:flex;flex-direction:column;gap:1.3rem}
.fline .flab{font-size:1.15rem;font-weight:700;color:var(--ink-3);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.2rem}
.fline .fval{font-size:2.5rem;line-height:1.3;font-weight:600;overflow-wrap:anywhere}
.fhint{margin-top:2.2rem;font-size:1.05rem;color:var(--ink-3)}

/* ── messages ──────────────────────────────────────────────────────── */
.chatcard{border-color:var(--accent);background:var(--accent-soft)}
.chathead{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-bottom:.7rem}
.msgs{display:flex;flex-direction:column;gap:.55rem}
.msg{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:.7rem .85rem}
.msg.host{border-left:4px solid var(--accent)}
.mwho{font-size:.78rem;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.05em}
.mtxt{font-size:1.04rem;margin-top:.15rem;overflow-wrap:anywhere;white-space:pre-wrap}
.mtxt a{font-weight:600;text-decoration:underline}

/* ── join screen: title, quote, QR, names ──────────────────────────── */
.joinwrap{display:grid;grid-template-columns:1fr auto;gap:3.5rem;align-items:center;margin-top:1.5rem}
.quotebig .qen{font-size:3.1rem;line-height:1.22;font-weight:700;letter-spacing:-.02em;max-width:19ch}
.quotebig .qvi{font-size:1.6rem;line-height:1.35;color:var(--ink-3);margin-top:1.1rem;max-width:26ch}
.qrbig{width:min(30vw,380px);background:#fff;padding:16px;border-radius:16px;display:block}
.joinurl{font-size:1.15rem;font-weight:600;margin-top:.9rem;text-align:center;word-break:break-all;color:var(--ink-2)}
.joinfoot{margin-top:2.6rem;padding-top:1.4rem;border-top:1px solid var(--line)}
.joincount{display:flex;align-items:baseline;gap:.9rem;margin-bottom:.9rem}
.joincount .jn{font-size:3.4rem;font-weight:700;line-height:1;letter-spacing:-.03em}
.joincount .jl{font-size:1.3rem;color:var(--ink-3)}
@media(max-width:62rem){
  .joinwrap{grid-template-columns:1fr;gap:2rem}
  .quotebig .qen{font-size:2.3rem}
  .qrbig{width:min(50vw,300px)}
}