:root{--bg:oklch(97% .005 250);--surface:oklch(100% 0 0);--ink:oklch(25% .025 250);--muted:oklch(44% .025 250);--accent:oklch(43% .13 250);--line:oklch(65% .015 250);--selected:oklch(95% .03 250);--error:oklch(43% .16 25)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif}header{background:var(--surface);border-bottom:1px solid var(--line)}.wrap{max-width:680px;margin:auto;padding:20px}header .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px}header span{color:var(--muted);font-size:14px}.intro{margin:20px 0 28px}h1{font-size:30px;line-height:1.35;margin:0 0 10px}h2{font-size:23px;line-height:1.4;margin:0 0 12px}h3{font-size:22px;margin:12px 0}p{color:var(--muted);margin:8px 0 18px}section{background:var(--surface);padding:26px;border-radius:12px;border:1px solid var(--line)}[hidden]{display:none!important}label{display:block;margin:16px 0 0}input:not([type=radio]):not([type=checkbox]){display:block;width:100%;height:50px;padding:10px 12px;border:1px solid var(--line);border-radius:6px;background:var(--surface);font:inherit;color:var(--ink);margin-top:6px}button{border:0;border-radius:6px;min-height:48px;padding:12px 20px;font:inherit;font-weight:600;line-height:1.4;background:var(--accent);color:white;cursor:pointer}form>button{width:100%;margin-top:24px}button:hover{filter:brightness(.94)}button:disabled{opacity:.55;cursor:wait}.secondary{border:1px solid var(--line);background:var(--surface);color:var(--ink)}:focus-visible{outline:3px solid var(--accent);outline-offset:3px}fieldset{margin:24px 0 0;padding:16px 0 24px;border:0;border-bottom:1px solid var(--line)}legend{font-size:16px;color:var(--muted)}.choices{display:flex;gap:12px}.choices label{flex:1;margin:0;border:1px solid var(--line);border-radius:6px;padding:14px;cursor:pointer}.choices label:has(:checked),#candidates label:has(:checked){background:var(--selected);border-color:var(--accent)}input[type=radio],input[type=checkbox]{accent-color:var(--accent);width:20px;height:20px;vertical-align:middle;margin-right:10px}#candidates label{padding:14px;border:1px solid var(--line);border-radius:6px;margin-top:10px;cursor:pointer}.section-title,.actions{display:flex;justify-content:space-between;gap:12px;align-items:center}.section-title h2{margin:0}.section-title button{font-size:14px;padding:8px 12px}.actions{margin-top:24px;flex-wrap:wrap}.actions button{flex:1}dt{font-weight:600;margin-top:20px}dd{margin:6px 0 20px;color:var(--muted)}#notice:empty{display:none}#notice{color:var(--error);padding:14px;border:1px solid currentColor;border-radius:6px;background:var(--surface)}.footnote{font-size:14px;margin:24px 0} @media(max-width:440px){.wrap{padding:16px}section{padding:20px}h1{font-size:27px}.choices label{padding:12px}.actions button{flex-basis:100%}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

/* Center titles within the available screen width, including small phones. */
h1,h2,h3,legend{text-align:center;overflow-wrap:anywhere}
legend{width:100%}
header .wrap{flex-direction:column;justify-content:center;gap:4px;padding-top:12px;padding-bottom:12px;text-align:center}
.intro{text-align:center}
.section-title{flex-direction:column;gap:12px}
.section-title h2{width:100%}
.section-title button{align-self:flex-end}
fieldset{min-inline-size:0}
#success-panel{text-align:center}
#success-panel>button{width:100%}
@media(max-width:440px){
  .wrap{padding-left:12px;padding-right:12px}
  section{padding:20px 16px}
  .intro{margin-top:16px;margin-bottom:24px}
  .intro p{font-size:16px}
  .choices{gap:10px}
  .choices label{display:flex;align-items:center;justify-content:center;padding:12px 6px}
  input[type=radio],input[type=checkbox]{flex-shrink:0}
}

/* Six committee candidates: three rows, two people per row. */
#candidates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#candidates label{display:flex;align-items:center;margin:0;min-height:56px;padding:12px 10px;overflow-wrap:anywhere}
#candidates input{margin:0 8px 0 0}

select{display:block;width:100%;min-width:0;min-height:50px;margin-top:6px;padding:10px 12px;border:1px solid var(--line);border-radius:6px;background:var(--surface);font:inherit;color:var(--ink)}

/* Refined mobile voting surface, preserving centered titles and two columns. */
:root{--bg:oklch(97% .006 250);--accent:oklch(42% .12 250);--selected:oklch(94% .04 250)}
header{background:var(--accent);color:white;border-bottom:0}
header .wrap{padding-top:16px;padding-bottom:16px}
header strong{font-size:19px;font-weight:650}
header span{color:white;font-size:13px;border:1px solid oklch(76% .05 250);border-radius:999px;padding:2px 12px}
.intro{margin:28px 0 24px}.intro h1{font-size:28px;font-weight:750}.intro p{font-size:15px;line-height:1.7}
section{border-color:oklch(80% .018 250);padding:28px;border-radius:12px}
h2{font-weight:700}h3{font-size:26px;font-weight:700}
input:not([type=radio]):not([type=checkbox]),select{background:oklch(99% .003 250);min-height:52px}
input:focus,select:focus{border-color:var(--accent)}
button{min-height:52px;transition:background-color .16s ease,transform .16s ease}
button:active:not(:disabled){transform:translateY(1px)}button:disabled{cursor:not-allowed}
.choices label,#candidates label{transition:background-color .16s ease,border-color .16s ease;min-height:58px}
.choices label:has(:checked),#candidates label:has(:checked){font-weight:650;border-color:var(--accent)}
legend{font-weight:600;color:var(--accent)}
#selection-count{text-align:center;font-size:15px;color:var(--accent);margin:16px 0 0}
#success-panel h2{color:var(--accent);margin-top:8px}
#notice{line-height:1.6;font-size:15px}
.footnote{text-align:center;font-size:13px;line-height:1.7}
@media(max-width:440px){section{padding:22px 16px}.intro{margin-top:22px}.intro h1{font-size:26px}h2{font-size:22px}#login-form>label{font-size:16px}#candidates label{justify-content:center;padding:12px 6px}}
@media(prefers-reduced-motion:reduce){button,.choices label,#candidates label{transition:none}}

#notice.notice-info{color:var(--accent);border-color:oklch(76% .04 250);background:oklch(96% .02 250)}
