@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap');
:root{--bg:#f6f8fb;--white:#fff;--text:#172033;--muted:#667085;--line:#e5e9f0;--blue:#3157d5;--green:#16845b}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif}
header{height:72px;background:#fff;border-bottom:1px solid var(--line);padding:0 6vw;display:flex;align-items:center;gap:12px}header b{font-size:15px}header small{color:var(--muted);font-size:11px}
main{width:min(1120px,92vw);margin:auto}.screen{display:none;padding:55px 0 80px}.screen.active{display:block}
.hero{text-align:center;max-width:760px;margin:30px auto 45px}.hero span,.screen>span,.heading span{font-size:11px;font-weight:800;letter-spacing:.13em;color:var(--blue)}
h1{font-size:clamp(35px,5vw,56px);line-height:1.05;letter-spacing:-.04em;margin:14px 0}.hero h1{color:var(--text)}p{color:var(--muted);line-height:1.7}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.grid article,.box,.panel,.candidate{background:var(--white);border:1px solid var(--line);border-radius:22px;box-shadow:0 15px 45px #1a27440d}
.grid article{padding:32px}.grid i{font-style:normal;font-size:34px;display:block;margin-bottom:18px}.grid label{font-size:10px;font-weight:800;color:var(--muted);letter-spacing:.12em}.grid h2{font-size:30px;margin:8px 0}.grid p{min-height:70px}
button{border:0;border-radius:11px;padding:13px 18px;background:var(--blue);color:#fff;font-weight:700;cursor:pointer}button:hover{opacity:.9}.soon{text-align:center;color:#98a1b2;font-size:11px;margin-top:18px}
.back{background:none;color:var(--muted);padding:0;margin-bottom:30px}.box{max-width:560px;margin:30px auto;padding:30px}.box label{display:block;font-size:12px;font-weight:700;margin:18px 0 7px}.box label:first-child{margin-top:0}.box select{width:100%;padding:14px;border:1px solid var(--line);border-radius:10px;background:#fff}.box button{width:100%;margin-top:24px}
.heading{display:flex;justify-content:space-between;align-items:end;gap:20px}.heading h1{font-size:42px}.heading>b{background:#e9f7f0;color:var(--green);padding:9px 14px;border-radius:30px;font-size:10px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:25px 0}.stat{background:#fff;border:1px solid var(--line);border-radius:15px;padding:16px}.stat small{display:block;color:var(--muted);font-size:10px}.stat strong{display:block;margin-top:5px;font-size:20px}
.candidate{display:grid;grid-template-columns:45px 1fr 180px 110px;gap:15px;align-items:center;padding:15px 18px;margin:9px 0;cursor:pointer;box-shadow:none}.candidate:hover{border-color:#aebcf0}.pos{font-size:19px;font-weight:800;color:#a0a8b7}.name strong{display:block}.name small{color:var(--muted);font-size:10px}.votes{text-align:right;font-weight:800;font-size:13px}.bar{height:7px;background:#edf0f5;border-radius:10px;margin-top:7px;overflow:hidden}.bar i{display:block;height:100%;background:var(--blue)}.status{text-align:right;font-size:10px;font-weight:800}.elected{color:var(--green)}
.detail-hero{background:#172033;color:#fff;border-radius:24px;padding:32px;margin-bottom:20px}.detail-hero span{color:#b9c6ff;font-size:10px;font-weight:800}.detail-hero h1{font-size:44px;margin:8px 0}.detail-hero p{color:#c6ccda}.pill{display:inline-block;background:#fff;color:var(--green);padding:9px 14px;border-radius:30px;font-size:10px;font-weight:800}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.panel{padding:24px}.full{grid-column:1/-1}.panel h2{margin:0 0 16px;font-size:20px}.big{font-size:42px;font-weight:800}.formula{background:#f7f8fb;border:1px solid var(--line);border-radius:13px;padding:16px;margin:12px 0;line-height:1.8;font-family:monospace}.answer{color:var(--blue);font-weight:800}.progress{height:12px;background:#edf0f5;border-radius:20px;overflow:hidden}.progress i{display:block;height:100%;background:var(--blue)}.compare{margin:17px 0}.compare-head{display:flex;justify-content:space-between;font-size:11px;font-weight:700}.conclusion{background:#edf2ff;border-radius:15px;padding:18px;line-height:1.7}
@media(max-width:760px){.grid,.detail-grid{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}.candidate{grid-template-columns:35px 1fr}.votes,.status{text-align:left;grid-column:2}.heading{display:block}.heading>b{display:inline-block;margin-top:10px}}
