/* ============================================================================
   /vote: every shareholder-voting page in the Outlined look the owner approved on
   2026-10-27 ("thats perfect"). Ported from the mockup's outlined.css
   (Downloads\shareholder-voting-simple\_build): the boxy look's separation - a dark
   outline round the main box, grey outlines round every row and box, tables with
   full grid lines under a grey header band and a crimson rule, folder tabs joined to
   the page - in Inter, sentence case and small corners. No icons (QR codes are the
   only drawings), no shadows, no glass. Body 17 px, nothing under 15 px.
   The minutes' document and its paper rules add vote-minutes.css. Every media query
   for these pages lives in this file or in vote-minutes.css.
   ========================================================================= */
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;
  src:url("/assets/inter/Inter-latin-var.woff2?v=1") format("woff2")}
:root{
  --crimson:#A12237;--crimson-dk:#7D1A2A;
  --ink:#231F20;--ink2:#3F393B;--mut:#5E5759;
  --hair:#B9B4B5;--shade:#F2EFEF;--paper2:#FAF8F8;--page:#FAF8F8;
  --against:#8A8183;--abstain:#CFC9CA;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{margin:0;padding:0}
body{background:var(--page);color:var(--ink);font:17px/1.5 var(--sans);letter-spacing:-.005em;-webkit-font-smoothing:antialiased}
body.mdl-lock{overflow:hidden}
a{color:var(--crimson)}
p{margin:0 0 10px}
h1,h2,h3,h4{margin:0;font-weight:normal}
button,input,textarea{font:inherit;letter-spacing:inherit}

/* ---- masthead: logo on white over the 3 px crimson rule --------------------------- */
.mast{background:#fff;border-bottom:3px solid var(--crimson)}
.mast-in{max-width:1280px;margin:0 auto;display:flex;align-items:center;gap:18px;padding:12px 24px}
.mast-logo{display:block;height:60px;width:auto;flex:0 0 auto}
.mast .rule{width:2px;align-self:stretch;background:var(--hair);flex:0 0 auto}
.mast .tt{flex:1 1 auto;min-width:0}
.mast .app{font-weight:750;font-size:22px;line-height:1.15;letter-spacing:-.015em}
.mast .mt{margin-top:4px;font-size:17px;color:var(--ink2);overflow-wrap:break-word}
.mast .mt b{color:var(--ink);font-weight:650}
.mast .who{flex:0 0 auto;display:flex;align-items:center;justify-content:flex-end;gap:12px;font-size:16px;color:var(--ink2)}
.mast .who b{font-weight:650;color:var(--ink)}
.mast .who form{display:flex;margin:0}
.mast .mt-change{margin-left:12px;vertical-align:middle}
.mast .conn{flex:0 0 auto}
.link{display:inline;background:none;border:0;padding:0;margin:0;color:var(--crimson);text-decoration:underline;
  text-underline-offset:2px;cursor:pointer;font-weight:600}
.link:hover{color:var(--crimson-dk)}

/* ---- tabs along the top: folder tabs joined to the page ----------------------------- */
.tabs-w{background:var(--page);border-bottom:1px solid var(--hair)}
.tabs{max-width:1280px;margin:0 auto;padding:16px 24px 0;display:flex;flex-wrap:wrap;gap:6px}
.tab{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 22px;margin:0 0 -1px;
  font-weight:650;font-size:17px;color:var(--ink2);text-decoration:none;background:var(--shade);border:1px solid var(--hair);
  border-bottom:0;border-radius:8px 8px 0 0;cursor:pointer}
.tab:hover{color:var(--ink);background:#fff}
.tab.on{color:var(--ink);background:var(--page);border-top:3px solid var(--crimson);cursor:default}

/* ---- the page ---------------------------------------------------------------------- */
.page{max-width:1280px;margin:0 auto;padding:26px 24px 64px}
.h{position:relative;margin:0 0 14px;padding-bottom:8px;border-bottom:2px solid var(--hair);font-weight:750;font-size:24px;
  line-height:1.2;letter-spacing:-.015em;overflow-wrap:break-word}
.h::after{content:"";position:absolute;left:0;bottom:-2px;width:48px;height:2px;background:var(--crimson)}
.lead{font-size:18px;color:var(--ink2);margin:0 0 16px;max-width:60em;overflow-wrap:break-word}
.empty{font-size:18px;color:var(--mut);margin:6px 0 14px}

/* ---- buttons: outlined, small corners, sentence case -------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 18px;margin:0;
  font-weight:650;font-size:17px;line-height:1.2;text-align:center;text-decoration:none;color:var(--ink);background:#fff;
  border:2px solid var(--ink);border-radius:8px;cursor:pointer}
.btn:hover{color:#fff;background:var(--ink)}
.btn.primary{color:#fff;background:var(--crimson);border-color:var(--crimson)}
.btn.primary:hover{background:var(--crimson-dk);border-color:var(--crimson-dk)}
.btn.danger{color:var(--crimson);border-color:var(--crimson)}
.btn.danger:hover{color:#fff;background:var(--crimson)}
.btn.danger-fill{color:#fff;background:var(--crimson);border-color:var(--crimson)}
.btn.danger-fill:hover{background:var(--crimson-dk);border-color:var(--crimson-dk)}
.btn.sm{min-height:44px;padding:8px 14px;font-size:15px}
.btn.big{width:100%;min-height:64px;padding:12px 18px;font-size:21px;font-weight:700;border-radius:10px}
.btn.wide{width:100%;min-height:54px;font-size:18px}
.btn[disabled],.btn[disabled]:hover{color:#8A8385;background:#fff;border-color:var(--hair);cursor:default}
.mast .btn.mbtn{min-height:38px;padding:4px 13px}

/* ---- status words: outlined chips, no icons ------------------------------------------ */
.pill{display:inline-block;padding:3px 10px;font-weight:650;font-size:15px;line-height:1.3;white-space:nowrap;
  color:var(--ink);background:#fff;border:2px solid var(--ink);border-radius:6px}
.pill.red{color:#fff;background:var(--crimson);border-color:var(--crimson)}
.pill.redline{color:var(--crimson);border-color:var(--crimson)}
.pill.ink{color:#fff;background:var(--ink)}
.pill.mut{color:var(--mut);border-color:var(--hair)}
.pill.wrap{white-space:normal;overflow-wrap:break-word}
.pill.plain{background:none;border-color:transparent;padding-left:0;padding-right:0}
.pill.plain.next{color:var(--crimson)}
.pill.plain.mut{color:var(--mut)}

/* ---- the Meeting tab: agenda | now ------------------------------------------------------ */
.meet{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:28px;align-items:start}
.meet.solo{grid-template-columns:minmax(0,720px);justify-content:center}
.agenda{min-width:0}
.ag-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ag{display:grid;grid-template-columns:34px minmax(0,1fr) auto;column-gap:12px;align-items:center;padding:12px 14px;
  background:#fff;border:1px solid var(--hair);border-radius:8px;cursor:pointer}
.ag:hover{background:var(--paper2);border-color:#8A8385}
.ag.cur{border:2px solid var(--ink);padding:11px 13px}
.ag-n{align-self:start;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;
  background:#fff;border:1px solid var(--hair);font-weight:700;font-size:15px;font-variant-numeric:tabular-nums}
.ag.cur .ag-n{background:var(--crimson);border-color:var(--crimson);color:#fff}
.ag-b{min-width:0}
.ag-t{display:block;font-weight:650;font-size:17px;line-height:1.3;overflow-wrap:break-word}
.ag-s{display:block;margin-top:6px}
/* a row's buttons: Start on every motion not voted on yet (any order), and Edit beside it until voting begins. Every
   row of one stage carries the same set, so the groups are one width and line up down the list */
.ag-acts{display:flex;align-items:center;gap:8px}
.ag-add{width:100%;margin-top:12px}

.now{min-width:0;padding:22px 26px 26px;background:#fff;border:2px solid var(--ink);border-radius:12px}
.now-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 14px;margin:0 0 8px}
.of{font-weight:700;font-size:15px;letter-spacing:.07em;text-transform:uppercase;color:var(--mut)}
.mtitle{margin:0 0 12px;font-weight:750;font-size:30px;line-height:1.2;letter-spacing:-.02em;overflow-wrap:break-word}
.wording{margin:0 0 20px;padding:12px 16px;background:var(--shade);border:1px solid var(--hair);border-radius:8px;font-size:18px;
  line-height:1.45;color:var(--ink2);white-space:pre-line;overflow-wrap:break-word}
.big-n{font-weight:800;font-size:46px;line-height:1.05;letter-spacing:-.025em}
.track{position:relative;height:38px;margin:16px 0 14px;background:#fff;border:2px solid var(--ink);border-radius:8px}
.track .fill{position:absolute;left:2px;top:2px;bottom:2px;max-width:calc(100% - 4px);background:var(--ink);border-radius:4px;
  transition:width .6s ease}
.track .q{position:absolute;top:-9px;bottom:-9px;width:4px;margin-left:-2px;border-radius:2px;background:var(--crimson);
  box-shadow:0 0 0 2px #fff}
.count-line{margin:0;font-size:18px}
.ok{color:var(--crimson-dk);font-weight:700}
.waiting{margin:18px 0 0;padding:12px 16px;background:var(--shade);border:1px solid var(--hair);border-radius:8px;font-size:18px;
  line-height:1.5;overflow-wrap:break-word}
.waiting b{margin-right:8px;font-weight:700}
.msg-big{margin:6px 0 8px;font-weight:800;font-size:32px;line-height:1.15;letter-spacing:-.02em}
.msg{font-size:18px}
.last{margin:6px 0 0;font-weight:700;font-size:20px}
.go{display:flex;flex-direction:column;gap:12px;margin-top:26px}
.go:empty{display:none}
.go-next{margin:-4px 0 4px;text-align:center;font-size:17px;color:var(--ink2);overflow-wrap:break-word}
.go-alt{margin:0;text-align:center;font-size:16px}

/* Get ready: three numbered checks. One grid for the whole list, each row a subgrid of it, so the status words
   share a column and the buttons share another at one width. The 0-wide edge tracks + the gap pad the sides. */
.ready{list-style:none;margin:0;padding:0;background:#fff;border:1px solid var(--hair);border-radius:10px;display:grid;
  grid-template-columns:0 34px minmax(0,1fr) max-content max-content 0;column-gap:16px}
.ready li{grid-column:1 / -1;display:grid;grid-template-columns:subgrid;align-items:center;row-gap:8px;padding:14px 0}
.ready li+li{border-top:1px solid var(--hair)}
.ready .rn{grid-column:2}
.ready .rb{grid-column:3}
.ready li>.pill{grid-column:4;justify-self:end}
.ready li>.btn{grid-column:5;width:100%}
.rn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#fff;
  border:1px solid var(--hair);font-weight:700;font-size:15px}
.rb{min-width:0}
.rb b{display:block;font-weight:700;font-size:18px;line-height:1.25}
.rb span{display:block;margin-top:2px;font-size:17px;color:var(--ink2)}

/* the result: an outlined verdict, then an outlined bar per choice */
.verdict{margin:14px 0 22px;padding:14px 12px 18px;text-align:center;color:var(--crimson);background:#fff;
  border:3px solid var(--crimson);border-radius:12px;font-weight:800;font-size:clamp(44px,6vw,80px);line-height:1.05;
  letter-spacing:-.025em;overflow-wrap:break-word}
.verdict.no{color:var(--ink);border-color:var(--ink)}
.verdict.name{font-size:clamp(34px,4.2vw,56px)}
/* an election of several: everyone it put in, each name whole where it fits, in a row that wraps */
.verdict.many{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:4px .8em;margin:10px 0 16px;
  padding:10px 12px 12px;font-size:clamp(24px,2.8vw,40px);line-height:1.15}
.tally{display:flex;flex-direction:column;gap:14px;margin:0 0 12px}
.tl{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 14px;margin:0 0 6px}
.tl .lab{font-weight:700;font-size:18px;overflow-wrap:break-word;min-width:0}
.tl .val{font-size:17px;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--ink2)}
.tr{position:relative;height:28px;background:#fff;border:2px solid var(--ink);border-radius:6px}
.tr .f{position:absolute;left:2px;top:2px;bottom:2px;max-width:calc(100% - 4px);border-radius:3px}
.tr .f.for{background:var(--ink)}
.tr .f.against{background:var(--against)}
.tr .f.abstain{background:var(--abstain)}
.tr .th{position:absolute;top:-7px;bottom:-7px;width:3px;margin-left:-1.5px;border-radius:2px;background:var(--crimson);
  box-shadow:0 0 0 2px #fff}
.tally-note{margin:6px 0 0;font-size:16px;color:var(--ink2)}

/* ---- tables: full grid lines, a grey header band over a crimson rule ----------------------- */
.t{width:100%;border-collapse:separate;border-spacing:0;font-size:17px;margin:0;background:#fff;border:1px solid var(--hair);
  border-radius:8px}
.t th,.t td{padding:10px 12px;text-align:left;vertical-align:middle;border-right:1px solid var(--hair);
  border-bottom:1px solid var(--hair)}
.t th:last-child,.t td:last-child{border-right:0}
.t tbody tr:last-child td{border-bottom:0}
.t th{font-weight:650;font-size:15px;color:var(--ink);background:var(--shade);border-bottom:2px solid var(--crimson)}
.t th:first-child{border-top-left-radius:7px}
.t th:last-child{border-top-right-radius:7px}
.t tbody tr:nth-child(even) td{background:var(--paper2)}
.t .num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.t .acts{width:1%;white-space:nowrap}
.t .acts .btn+.btn{margin-left:8px}
/* one width for row buttons, so Show QR (and the rest) line up down the table */
.t .acts .btn{min-width:7.5em}
/* break-word, not anywhere: a table never squeezes an email below its own width while there is room, so it stays
   whole; only a phone's one-card-a-row layout may break one that is wider than the card */
.t .em{display:block;margin-top:1px;font-size:15px;color:var(--mut);overflow-wrap:break-word}
.t .wrapcell{overflow-wrap:break-word}
.t .namecell b{overflow-wrap:break-word}
/* 1000-1279 px: the register's email column. `anywhere` lets an address that can't fit (57 characters) break
   mid-word instead of running the table past the screen (it ran 52 px past at 1000 px); the minimum keeps a
   real-length address (36 characters) whole, since with `anywhere` alone the auto layout would squeeze this column
   to make room for a long name. From 1280 px up, `break-word` keeps even the long one whole: with `anywhere` there
   the auto layout squeezed it at 1440 too. */
@media (min-width:1000px) and (max-width:1279px){
  .t td.wrapcell{overflow-wrap:anywhere;min-width:320px}
}
.st-ok{font-weight:650}
.st-bad{font-weight:650;color:var(--crimson)}
.st-wait{color:var(--mut)}

/* Voting codes */
.codes-sum{margin:0 0 14px;font-size:20px}
.codes-sum b{font-weight:700}
.codes-sum .bad{color:var(--crimson)}
.sendall{max-width:620px}
.allsent{font-size:18px;font-weight:700;margin:0 0 6px}
/* who is Live: the chip after each name ("Live" filled; "Live · asleep" outlined). A wrapping line, so a chip that
   doesn't fit beside a long name drops under it without an indent and never widens the column. Not `.nm`: the
   masthead hides `.mast .who .nm` on a phone. */
.t .nameline{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px}
.t .nameline b{min-width:0}
.find{display:flex;align-items:center;gap:12px;max-width:620px;margin:20px 0 14px}
.find label{font-weight:650;font-size:17px;white-space:nowrap}
.more{margin:14px 0 0;font-size:17px}

/* Shareholders */
.sumbox{max-width:560px;margin:18px 0 0;padding:12px 18px;background:#fff;border:1px solid var(--ink);border-radius:8px}
.sumbox table{width:100%;border-collapse:collapse;font-size:17px}
.sumbox td{padding:4px 0}
.sumbox .num{text-align:right;font-variant-numeric:tabular-nums;font-weight:650;padding-left:20px}
/* the remove confirm: what changes, now and after */
.chg{width:100%;border-collapse:collapse;margin:8px 0 2px;font-size:17px}
.chg th,.chg td{padding:6px 8px;text-align:left;border-bottom:1px solid var(--hair)}
.chg th{font-weight:650;font-size:15px;color:var(--ink2)}
.chg tr:last-child td{border-bottom:0}
.chg .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}

/* Past meetings */
.mlist .namecell b{display:block}

/* ---- fields ---------------------------------------------------------------------------------- */
.fld{margin:0 0 14px}
.fld label,.fld .lab{display:block;margin:0 0 6px;font-weight:650;font-size:15px;color:var(--ink2)}
.fld .note{margin:6px 0 0;font-size:16px;color:var(--ink2)}
input[type=text],input[type=email],input[type=search],input[type=number],input[type=password],input[type=datetime-local],textarea{
  display:block;width:100%;min-height:48px;padding:10px 12px;font-size:17px;line-height:1.4;color:var(--ink);background:#fff;
  border:2px solid var(--ink);border-radius:8px;-webkit-appearance:none;appearance:none}
textarea{min-height:96px;resize:vertical}
textarea.grow{min-height:48px;resize:none;overflow:hidden;line-height:1.4}
input:focus,textarea:focus{outline:3px solid var(--crimson);outline-offset:-1px}
input[disabled],textarea[disabled]{color:var(--mut);background:var(--shade);border-color:var(--hair)}
.err{margin:0 0 14px;padding:10px 12px;color:var(--crimson-dk);background:#fff;border:2px solid var(--crimson);border-radius:8px;
  font-weight:650;overflow-wrap:break-word}
.okmsg{margin:0 0 14px;padding:10px 12px;background:#fff;border:2px solid var(--ink);border-radius:8px;font-weight:650}
.warn{margin:14px 0 0;padding:12px 14px;background:#fff;border:2px solid var(--crimson);border-radius:8px;overflow-wrap:break-word}
.warn b{display:block;margin-bottom:3px;font-weight:700;color:var(--crimson)}
.warn p{margin:8px 0 0}
.quote{margin:0 0 14px;padding:12px 14px;background:var(--shade);border:1px solid var(--hair);border-radius:8px;
  white-space:pre-line;overflow-wrap:break-word}
.pick3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
/* an election of several's Up to / Exactly: two short choices, side by side at every width */
.pick2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}
.pick3 button,.pick2 button{min-height:62px;padding:8px 10px;color:var(--ink);background:#fff;border:2px solid var(--hair);border-radius:8px;
  cursor:pointer;text-align:center}
.pick3 button b,.pick2 button b{display:block;font-size:17px;font-weight:700}
.pick3 button span,.pick2 button span{display:block;font-size:15px}
.pick3 button.on,.pick2 button.on{color:#fff;background:var(--ink);border-color:var(--ink)}
.pick3 button[disabled]{color:#8A8385;cursor:default}
#f-seats{max-width:160px}
.optrow{display:flex;align-items:flex-start;gap:8px;margin:0 0 8px}
.optrow textarea{flex:1 1 auto;min-width:0}
.moves{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 14px}

/* ---- boxes (dialogs): an outlined card, a grey header band over a crimson rule --------------- */
.mdl{position:fixed;inset:0;z-index:600;display:flex;align-items:center;justify-content:center;padding:24px}
.mdl .scrim{position:absolute;inset:0;background:rgba(35,31,32,.5)}
.panel{position:relative;display:flex;flex-direction:column;width:100%;max-width:600px;max-height:90vh;background:#fff;
  border:2px solid var(--ink);border-radius:12px;outline:none;overflow:hidden}
.panel.wide{max-width:720px}
.ph{padding:14px 20px;background:var(--shade);border-bottom:2px solid var(--crimson)}
.ph h3{font-weight:750;font-size:21px;line-height:1.25;letter-spacing:-.015em;overflow-wrap:break-word}
.pb{padding:18px 20px;overflow:auto;font-size:17px}
.pb>:last-child{margin-bottom:0}
.pf{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;padding:14px 20px;background:var(--paper2);
  border-top:1px solid var(--hair)}
.pf .left{margin-right:auto}
.rec{margin-top:14px}
.rec .t{font-size:16px}

/* QR */
.qr{text-align:center}
.qr-sh{font-size:17px;color:var(--ink2)}
.qr-frame{width:270px;height:270px;margin:6px auto 12px;padding:10px;background:#fff;border:2px solid var(--ink);border-radius:10px}
.qr-frame svg{display:block;width:100%;height:100%}
.qr-ask{font-weight:700;font-size:18px}
.qr-code{display:inline-block;margin:4px 0 6px;padding:8px 14px;font-weight:700;font-size:24px;line-height:1.2;letter-spacing:.08em;
  font-variant-numeric:tabular-nums;color:var(--crimson);border:2px solid var(--crimson);border-radius:8px}
.qr-url{font-size:15px;line-height:1.4;color:var(--mut);word-break:break-all}
.qr-on{margin:0 0 14px}

/* ---- the big screen (projector): the console's overlay, or /vote/admin/present ----------------- */
#present{display:none;position:fixed;inset:0;z-index:300;overflow:auto;background:#fff}
#present.on{display:block}
.vo-admin #present{cursor:pointer}
.pr-in{max-width:1500px;margin:0 auto;padding:clamp(16px,3vh,40px) clamp(16px,4vw,64px) 60px}
.pr-top{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;padding-bottom:12px;border-bottom:3px solid var(--ink)}
.pr-logo{height:clamp(40px,6vh,70px);width:auto}
.pr-of{font-weight:700;font-size:clamp(18px,1.9vw,28px);letter-spacing:.04em;text-transform:uppercase;color:var(--ink2)}
.pr-st{margin-left:auto;padding:8px 18px;font-weight:700;font-size:clamp(17px,1.9vw,28px);color:#fff;background:var(--crimson);
  border:3px solid var(--crimson);border-radius:10px}
.pr-st.ink{background:var(--ink);border-color:var(--ink)}
.pr-st.line{color:var(--ink);background:#fff;border-color:var(--ink)}
.pr-title{margin:clamp(18px,3vh,36px) 0 clamp(12px,2vh,24px);font-weight:800;font-size:clamp(30px,4.2vw,64px);line-height:1.12;
  letter-spacing:-.025em;overflow-wrap:break-word}
.pr-big{font-weight:800;font-size:clamp(44px,6vw,96px);line-height:1;letter-spacing:-.03em}
.pr-track{position:relative;height:clamp(32px,6vh,64px);margin:clamp(14px,3vh,28px) 0;background:#fff;border:3px solid var(--ink);
  border-radius:12px}
.pr-track .fill{position:absolute;left:3px;top:3px;bottom:3px;max-width:calc(100% - 6px);background:var(--ink);border-radius:7px;
  transition:width .6s ease}
.pr-track .q{position:absolute;top:-12px;bottom:-12px;width:6px;margin-left:-3px;border-radius:3px;background:var(--crimson);
  box-shadow:0 0 0 3px #fff}
.pr-line{margin:0 0 12px;font-size:clamp(18px,2.2vw,32px);overflow-wrap:break-word}
.pr-wait{margin:clamp(12px,2vh,24px) 0 0;padding:12px 18px;background:var(--shade);border:1px solid var(--hair);border-radius:10px;
  font-size:clamp(18px,2vw,30px);overflow-wrap:break-word}
.pr-wait b{margin-right:10px;font-weight:800}
.pr-msg{margin:clamp(20px,5vh,60px) 0 10px;font-weight:800;font-size:clamp(36px,5vw,80px);line-height:1.05;letter-spacing:-.025em}
#present .verdict{font-size:clamp(56px,8vw,130px)}
#present .verdict.name{font-size:clamp(40px,5.5vw,90px)}
#present .verdict.many{font-size:clamp(24px,min(3.2vw,5.4vh),56px)}
#present .tl .lab{font-size:clamp(20px,2.2vw,34px)}
#present .tl .val{font-size:clamp(18px,2vw,30px)}
#present .tr{height:clamp(28px,4.6vh,48px);border-width:3px}
#present .tally-note{font-size:clamp(16px,1.6vw,24px)}
/* many rows (an election of several): two columns of compact bars, read down the left then down the right, sized by
   the screen's height, so ten names, an Abstain and the names elected fit a 1280x720 or 1024x768 projector without
   scrolling */
#present .tally.many{display:block;columns:2;column-gap:clamp(20px,3vw,44px)}
#present .tally.many .trow{break-inside:avoid;padding-bottom:clamp(8px,1.4vh,14px)}
#present .tally.many .tl{margin-bottom:3px}
#present .tally.many .tl .lab{font-size:clamp(15px,2.3vh,26px)}
#present .tally.many .tl .val{font-size:clamp(15px,2.1vh,24px)}
#present .tally.many .tr{height:clamp(12px,2.2vh,28px)}
.pr-hint{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);margin:0;padding:10px 20px;font-size:18px;color:#fff;
  background:var(--ink);border-radius:8px;white-space:nowrap;pointer-events:none;animation:pr-fade 4.5s ease forwards}
@keyframes pr-fade{0%,75%{opacity:1}100%{opacity:0}}

/* ---- the phone's bottom bar (the console's one big button) -------------------------------------- */
.bar{display:none}

/* ---- the shareholder's pages: type the code, a dead link, sign in -------------------------------- */
.page.entry{max-width:600px}
.ebox{padding:22px 24px 24px;background:#fff;border:2px solid var(--ink);border-radius:12px}
.ebox .fld{margin-bottom:16px}
.ebox .lead{margin-bottom:18px}
.efoot{margin:18px 0 0;text-align:center;font-size:17px;color:var(--ink2);overflow-wrap:break-word}
.efoot a{font-weight:650}
.code-line{margin:12px 0 18px;text-align:center;font-size:17px;color:var(--ink2)}
/* Check in / Add to this phone: who the code is for, before the one big button */
.eholder{margin:0 0 18px;padding:12px 16px;background:var(--shade);border:1px solid var(--hair);border-radius:8px;font-size:18px;
  color:var(--ink2);overflow-wrap:break-word}
.eholder b{display:block;font-weight:750;font-size:24px;line-height:1.2;color:var(--ink)}
/* Without JS the code box is a plain field. The page's script adds .js, and then the eight boxes show what is
   typed while one real, transparent input takes it. */
.codewrap{position:relative}
.codewrap .codein{text-align:center;letter-spacing:.12em;text-transform:uppercase;font-variant-numeric:tabular-nums;
  font-weight:700;font-size:22px}
.codeboxes{display:none;align-items:center;justify-content:center;gap:6px}
.codewrap.js .codeboxes{display:flex}
.codewrap.js .codein{position:absolute;inset:0;width:100%;height:100%;min-height:0;opacity:0;cursor:text;border:0;
  background:transparent;color:transparent;caret-color:transparent}
.cbox{position:relative;width:34px;height:52px;display:flex;align-items:center;justify-content:center;font-weight:700;
  font-size:24px;font-variant-numeric:tabular-nums;background:#fff;border:2px solid var(--hair);border-radius:8px}
.cbox.on{border-color:var(--ink)}
.codeboxes.bad .cbox.on{color:var(--crimson);border-color:var(--crimson)}
.codeboxes.focus .cbox.cur{border-color:var(--crimson)}
.cbox.cur::after{content:"";position:absolute;left:50%;top:13px;bottom:13px;width:2px;margin-left:-1px;background:var(--crimson);
  animation:caret 1.1s steps(1) infinite}
@keyframes caret{50%{opacity:0}}
.cdash{font-weight:700;font-size:22px;color:var(--mut)}

/* ---- the shareholder's ballot ---------------------------------------------------------------- */
.page.ballot{max-width:760px}
.voter{margin:0 0 14px;font-size:17px;color:var(--ink2);overflow-wrap:break-word}
.voter b{color:var(--ink);font-weight:700}
.meetline{margin:16px 0 0;padding:12px 16px;background:var(--shade);border:1px solid var(--hair);border-radius:8px;font-size:18px;
  overflow-wrap:break-word}
.choices{display:flex;flex-direction:column;gap:10px;margin:0 0 14px}
.choice{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:64px;margin:0;padding:12px 18px;
  font-weight:700;font-size:21px;line-height:1.25;text-align:left;color:var(--ink);background:#fff;border:2px solid var(--hair);
  border-radius:10px;cursor:pointer}
.choice:hover{border-color:var(--ink)}
.choice:disabled{cursor:default}
.choice .ch-l{min-width:0;overflow-wrap:break-word}
/* a tap casts (ballot.js): the vote on its way, and in Change my vote the one already recorded, fill dark and say so.
   In an election of several a tap ticks a name instead (Cast sends them): ticked names fill dark and say Picked, and
   with the seats full the rest wait, greyed */
.choice.busy,.choice.cur,.choice.on{color:#fff;background:var(--ink);border-color:var(--ink)}
.choice.busy::after,.choice.cur::after,.choice.on::after{flex:0 0 auto;font-weight:650;font-size:16px}
.choice.busy::after{content:"Sending\2026"}
.choice.cur::after{content:"Your vote"}
.choice.on::after{content:"Picked"}
.choices.busy .choice:not(.busy){opacity:.55}
.choices.full .choice:disabled{opacity:.55}
.dock-note.picked{font-weight:650;color:var(--ink);overflow-wrap:break-word}
/* a motion the room has just put up ignores taps for a moment: a tap meant for the screen before can't vote on it */
.choices.wait{pointer-events:none}
.allsh{margin:0 0 12px;font-size:17px;color:var(--ink2)}
.allsh b{color:var(--ink);font-weight:700}
.kept{margin:0 0 14px;padding:12px 16px;background:var(--shade);border:1px solid var(--hair);border-radius:8px;font-size:18px;
  overflow-wrap:break-word}
.receipt{margin:6px 0 16px;padding:14px 16px 16px;text-align:center;background:#fff;border:3px solid var(--ink);border-radius:12px}
.rc-lab{font-weight:700;font-size:18px}
.rc-choice{margin:4px 0;font-weight:800;font-size:44px;line-height:1.1;letter-spacing:-.02em;overflow-wrap:break-word}
/* an election of several's receipt: its names, one a line */
.rc-list{margin:6px 0;font-weight:800;font-size:28px;line-height:1.2;letter-spacing:-.01em;overflow-wrap:break-word}
.rc-list span{display:block}
.rc-meta{font-size:17px;color:var(--ink2)}
.mine{margin:14px 0 0;padding:12px 16px;background:var(--shade);border:1px solid var(--hair);border-radius:8px;font-size:18px;
  overflow-wrap:break-word}
.nextup{padding:12px 16px;background:#fff;border:1px solid var(--hair);border-radius:8px;font-size:17px;overflow-wrap:break-word}
.nextup b{display:block;font-weight:700;font-size:18px}
.dock{display:flex;flex-direction:column;gap:12px;margin-top:22px}
.dock-note{margin:0;text-align:center;font-size:17px;color:var(--ink2)}

:focus-visible{outline:3px solid var(--crimson);outline-offset:2px}
input:focus-visible,textarea:focus-visible{outline-offset:-1px}
.codewrap.js .codein:focus-visible{outline:none}

/* ---- a laptop: the agenda column narrows -------------------------------------------------------- */
@media (max-width:999px){
  .meet{grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:20px}
  .now{padding:18px 18px 22px}
  .mtitle{font-size:26px}
  .big-n{font-size:40px}
  .ready{grid-template-columns:0 34px minmax(0,1fr) max-content 0}
  .ready li>.btn{grid-column:3 / span 2;grid-row:2;justify-self:start;width:auto;min-width:10em}
  /* tables fold to one outlined card a row, each figure with its label. Below 1000px, not only on a phone: at an
     iPad's 768px the shareholder and codes tables (name, address, buttons) ran 140px past the screen (2026-10-27). */
  .t.reflow{border:0;background:none;border-radius:0}
  .t.reflow thead{display:none}
  .t.reflow,.t.reflow tbody,.t.reflow tr,.t.reflow td{display:block;width:100%}
  .t.reflow tr{margin:0 0 10px;background:#fff;border:1px solid var(--hair);border-radius:8px}
  .t.reflow td{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 12px;padding:8px 12px;
    border:0;background:none!important;text-align:left;white-space:normal}
  .t.reflow td+td{border-top:1px solid var(--shade)}
  .t.reflow td::before{content:attr(data-label);flex:0 0 auto;font-weight:650;font-size:15px;color:var(--ink2)}
  .t.reflow td.namecell{display:block}
  .t.reflow td.namecell::before{display:none}
  .t.reflow td.acts{justify-content:flex-start;gap:8px}
  .t.reflow td.acts::before{display:none}
  .t.reflow td.acts .btn+.btn{margin-left:0}
  .t.reflow td.acts:empty,.t.reflow td:empty{display:none}
  /* a card is narrower than any table: an address wider than the card may break, rather than push it off the screen */
  .t.reflow .wrapcell,.t.reflow .em{overflow-wrap:anywhere}
}

/* a laptop above a phone: the 300 px agenda column can't hold Edit and Start beside a title, so they move under it */
@media (min-width:761px) and (max-width:999px){
  .ag-acts{grid-column:2 / -1;grid-row:2;margin-top:8px}
}

/* ---- a phone ------------------------------------------------------------------------------------- */
@media (max-width:760px){
  .mast-in{align-items:flex-start;gap:10px;padding:10px 12px}
  .mast-logo{height:42px}
  .mast .rule{display:none}
  .mast .app{font-size:19px}
  .mast .mt{font-size:15px}
  .mast .who{font-size:15px}
  .mast .who .nm{display:none}
  .mast .btn.mbtn{min-height:44px}
  .mast .mt-change{display:flex;width:max-content;margin:6px 0 0}
  .mast .mt b{display:block}
  .mast .mt-sep{display:none}
  .mast .mt-dot{display:none}
  .mast .mt-bit{display:inline-block;margin-right:14px}
  .tabs-w{border-bottom:0}
  .tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:12px 12px 0}
  .tab{min-height:48px;padding:4px 8px;margin:0;font-size:16px;border:1px solid var(--hair);border-radius:8px;text-align:center}
  .tab.on{color:#fff;background:var(--ink);border:1px solid var(--ink)}
  .page{padding:16px 12px 40px}
  .h{font-size:21px}
  .lead{font-size:17px}
  .meet{display:flex;flex-direction:column;gap:24px;align-items:stretch}
  .now{order:1;padding:16px 14px 18px;border-radius:10px}
  .agenda{order:2}
  .mtitle{font-size:24px}
  .wording{font-size:17px}
  .big-n{font-size:36px}
  .msg-big{font-size:28px}
  .btn.big{font-size:20px}
  .go .big{display:none}
  .go .big.keep{display:flex}
  .go{margin-top:20px}
  .bar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:60;background:#fff;border-top:1px solid var(--hair);
    padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
  body.has-bar .page{padding-bottom:calc(104px + env(safe-area-inset-bottom))}   /* the bar grows by the notch inset too */
  .ready{grid-template-columns:0 30px minmax(0,1fr) max-content 0;column-gap:12px}
  .ready li{padding:12px 0}
  .codes-sum{font-size:18px}
  .find{flex-wrap:wrap;gap:6px}
  .find label{width:100%}
  .mdl{padding:0}
  .panel,.panel.wide{max-width:none;height:100%;max-height:none;border:0;border-radius:0}
  .ph{padding:14px}
  .pb{flex:1 1 auto;padding:16px 14px}
  .pf{padding:12px 14px calc(12px + env(safe-area-inset-bottom))}
  .pf .btn{flex:1 1 auto}
  .pf .left{margin-right:0;flex-basis:100%}
  .pick3{grid-template-columns:1fr}
  .qr-frame{width:240px;height:240px}
  .pr-hint{white-space:normal;width:calc(100% - 24px);text-align:center}
  /* a phone can't run the projector: Show on the big screen opens its own window instead (console.js) */
  .vo-admin #present{display:none!important}
  /* the shareholder's pages */
  .ebox{padding:18px 16px 20px;border-radius:10px}
  .cbox{width:32px;height:50px;font-size:22px}
  .codeboxes{gap:5px}
  .rc-choice{font-size:38px}
  /* the ballot's next step rides a bar at the bottom of the screen; ballot.js measures it (--dock-h) */
  .vo-ballot .dock{position:fixed;left:0;right:0;bottom:0;z-index:60;margin:0;background:#fff;border-top:1px solid var(--hair);
    padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
  .vo-ballot .page.ballot{padding-bottom:calc(var(--dock-h,0px) + 24px)}
}
@media (prefers-reduced-motion:reduce){
  .track .fill,.pr-track .fill{transition:none}
  .pr-hint{animation:none;display:none}
  .cbox.cur::after{animation:none}
}