:root { color-scheme: dark; --ink:#fff8e9; --muted:#d7c9d7; --purple:#24102f; --orange:#ff8a24; --lime:#c7ee63; --line:#65456d; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:radial-gradient(circle at 50% -10%,#64205e 0,#24102f 35rem,#120817 100%); font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.08; background-image:repeating-linear-gradient(135deg,transparent 0 24px,#fff 25px 26px); }
.hero { max-width:70rem; margin:auto; padding:3.5rem 1rem 2rem; text-align:center; }
.eyebrow { margin:0 0 .6rem; color:var(--lime); font-size:.78rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
h1 { margin:.1rem 0 .6rem; font-family:Georgia,serif; font-size:clamp(2.2rem,8vw,5rem); line-height:.95; text-wrap:balance; }
.intro { color:var(--muted); font-size:clamp(1rem,3vw,1.25rem); }
.status { display:inline-flex; padding:.65rem 1rem; border:1px solid var(--line); border-radius:999px; background:#130b19aa; color:var(--lime); font-weight:750; }
main { width:min(100% - 1.5rem,76rem); margin:0 auto 8rem; }
fieldset { margin:0; padding:0; border:0; }
.voter-name { display:grid; grid-template-columns:minmax(13rem,1fr) minmax(15rem,1fr); gap:1rem; align-items:end; max-width:48rem; margin:0 auto 1.25rem; padding:1rem; border:1px solid var(--line); border-radius:1rem; background:#211329; }
.voter-name label { display:grid; gap:.3rem; }
.voter-name label span,.admin-note { color:var(--muted); font-size:.88rem; }
.voter-name input { width:100%; padding:.8rem; border:1px solid var(--line); border-radius:.5rem; background:#120817; color:var(--ink); font:inherit; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr)); gap:1rem; }
.card { position:relative; display:block; overflow:hidden; border:2px solid #5e4267; border-radius:1rem; background:#211329; box-shadow:0 10px 30px #0006; cursor:pointer; transition:.16s ease; }
.card:hover { transform:translateY(-2px); border-color:#9d72aa; }
.card:has(input:checked) { border-color:var(--orange); box-shadow:0 0 0 3px #ff8a2435,0 12px 35px #0008; }
.card input { position:absolute; opacity:0; }
.image-wrap { display:block; aspect-ratio:1/1; background:#100b14; }
.image-wrap img { width:100%; height:100%; display:block; object-fit:cover; }
.card-copy { display:flex; gap:.8rem; align-items:center; min-height:4.6rem; padding:.85rem 1rem; }
.number { flex:0 0 auto; font:800 1.3rem/1 Georgia,serif; color:var(--orange); }
.name { font-size:1rem; overflow-wrap:anywhere; }
.check { position:absolute; top:.7rem; right:.7rem; display:grid; place-items:center; width:2rem; height:2rem; border-radius:50%; background:var(--orange); color:#1a0b10; font-weight:900; opacity:0; transform:scale(.7); transition:.16s ease; }
.card:has(input:checked) .check { opacity:1; transform:scale(1); }
.submit-bar { position:fixed; z-index:5; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; gap:1rem; padding:.8rem max(1rem,calc((100% - 70rem)/2)); border-top:1px solid var(--line); background:#170b1df2; backdrop-filter:blur(14px); }
.submit-bar p { flex:1; margin:0; color:var(--muted); }
button { border:0; border-radius:999px; padding:.85rem 1.25rem; background:var(--orange); color:#1a0b10; font:800 1rem/1 inherit; cursor:pointer; }
button:disabled { opacity:.45; cursor:not-allowed; }
.notice { max-width:42rem; margin:2rem auto; padding:2rem; border:1px solid var(--line); border-radius:1rem; background:#211329; text-align:center; font-size:1.15rem; }
.admin-shell { max-width:48rem; padding:3rem 0; }
.admin-shell h1 { font-size:clamp(2rem,8vw,4rem); }
.admin-login { display:flex; gap:.8rem; align-items:end; flex-wrap:wrap; padding:1rem; border:1px solid var(--line); border-radius:1rem; background:#211329; }
.admin-login label { flex:1 1 18rem; display:grid; gap:.4rem; color:var(--muted); }
input[type=password] { width:100%; padding:.8rem; border:1px solid var(--line); border-radius:.5rem; background:#120817; color:var(--ink); font:inherit; }
.results-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:1rem; }
table { width:100%; border-collapse:collapse; background:#211329; }
th,td { padding:.8rem 1rem; border-bottom:1px solid var(--line); text-align:left; }
th:last-child,td:last-child { text-align:right; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:36rem) { .hero { padding-top:2.4rem; } .voter-name { grid-template-columns:1fr; } .grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; } .card-copy { align-items:flex-start; min-height:5.2rem; padding:.7rem; gap:.5rem; flex-direction:column; } .image-wrap { aspect-ratio:4/5; } .submit-bar { align-items:stretch; flex-direction:column; gap:.55rem; } .submit-bar p { font-size:.88rem; } button { width:100%; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }