@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',Arial,sans-serif;color:#133d33;background:#f8faf7;font-synthesis:none;--ink:#103d31;--lime:#d8f775}*{box-sizing:border-box}body{margin:0}button,a,input,select{touch-action:manipulation}button,input,select{font:inherit}button,a,label.import-label{cursor:pointer}button{border:0}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #427ad3;outline-offset:4px}button:hover{filter:brightness(.95)}[hidden]{display:none!important}.navigation{max-width:1440px;margin:auto;padding:30px 6%;display:flex;align-items:center;gap:24px;border-bottom:1px solid #dae3db}.brand{font-weight:800;font-size:24px;color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:7px}.brand-light{font-weight:400}.brand-mark{background:var(--ink);color:var(--lime);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;margin-right:6px}.edition{font-size:12px;letter-spacing:2px;margin:auto}.text-button{background:none;color:inherit;font-weight:600;font-size:14px;padding:12px}.hero{max-width:1440px;margin:auto;display:grid;grid-template-columns:1.1fr 1fr;gap:5%;padding:76px 6% 72px}.eyebrow{font-size:12px;letter-spacing:1.6px;font-weight:700;display:flex;align-items:center;gap:10px}.eyebrow>span{width:7px;height:7px;background:#598238;border-radius:50%}h1,h2,h3{font-family:Manrope,Arial,sans-serif}h1{font-size:clamp(42px,4.5vw,72px);letter-spacing:-3px;line-height:1.12;font-weight:500;margin:28px 0}h1 em{font-style:normal;position:relative;box-shadow:inset 0 -16px 0 var(--lime)}.intro{color:#5a6d63;line-height:1.8;max-width:450px;font-size:18px;margin-bottom:30px}.primary{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;background:var(--ink);color:white;padding:20px 25px;border-radius:7px;font-weight:600;min-height:52px}.primary>span{color:var(--lime);font-size:23px}.micro{font-size:12px;color:#52665a;line-height:1.6}.independent{margin-top:45px;border-left:2px solid #80986a;padding-left:14px;font-size:11px;letter-spacing:1.5px;line-height:1.9}.independent span{display:block;font-size:12px;letter-spacing:0;color:#627468}.hero-art{background:#dce8d8;border-radius:12px;min-height:460px;padding:25px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.art-caption{display:flex;justify-content:space-between;font-size:10px;font-weight:700;letter-spacing:1.4px;gap:24px}.mini-machine{display:grid;grid-template-columns:1.3fr 1fr;background:#e9eae2;padding:22px 18px;gap:15px;border-radius:16px;border:2px solid #bec5b8;border-bottom-width:10px;box-shadow:10px 22px 30px #3c54432b;transform:rotate(-5deg);margin:45px -3px}.mini-screen{background:#fbfbf5;border:10px solid #2a322e;min-height:190px;padding:14px;color:#232722}.mini-screen small{font-size:8px}.mini-screen strong{display:block;font-size:19px;margin:14px 0}.mini-digits{display:flex;gap:3px}.mini-digits i{width:19px;height:27px;border:1px solid #51584e}.mini-line{border-top:1px solid #bcc1b6;margin:17px 0 8px}.mini-panel b{display:block;text-align:center;font-size:10px;line-height:1.6;margin-bottom:12px}.mini-panel b span{font-size:8px;font-weight:400}.mini-keys{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:0 7px}.mini-keys i{background:#303833;color:white;text-align:center;border-radius:3px;box-shadow:0 3px 0 #92988f;font-style:normal;font-size:16px;padding:3px}.mini-keys .zero{grid-column:2}.mini-actions{display:flex;gap:4px;margin-top:12px}.mini-actions i{font-size:6px;font-style:normal;background:white;padding:9px 3px;border-radius:2px;flex:1;text-align:center}.mini-actions i:nth-child(2){background:#e98149}.mini-actions i:nth-child(3){background:#54a970}.art-foot{display:flex;justify-content:space-between;align-items:center;font-size:14px;line-height:1.6}.round-check{border:1px solid #7c9274;border-radius:50%;width:48px;height:48px;display:grid;place-items:center;font-size:24px}.learn{padding:55px 6%;max-width:1440px;margin:auto;border-top:1px solid #dae3db;display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:35px}h2{font-size:29px;line-height:1.3;letter-spacing:-1px;font-weight:500}.learn h3{font-size:16px;margin-top:23px}.learn p{font-size:14px;line-height:1.8;color:#617166}.key-label{font-size:10px;font-weight:700;padding:10px 17px;display:inline-block;border-radius:4px;border:1px solid #cdd6c9;box-shadow:0 3px 0 #bdc7b6}.white{background:white}.orange{background:#f1a074}.green{background:#bce4a4}.sequence{background:var(--ink);color:white;padding:50px 6%;display:grid;grid-template-columns:1fr 1.3fr;gap:70px}.sequence>div{justify-self:center}.sequence .eyebrow{color:var(--lime)}.sequence ol{counter-reset:step;list-style:none;padding:0;max-width:650px}.sequence li{counter-increment:step;display:flex;gap:20px;border-bottom:1px solid #ffffff26;padding:15px 0;font-size:15px;align-items:center}.sequence li:before{content:'0' counter(step);color:var(--lime);font-size:12px}.sequence b{margin-left:auto;font-size:12px;font-weight:400;white-space:nowrap;color:#c0d2c8}footer{padding:35px 6%;color:#5e7064;font-size:12px;line-height:1.8;display:flex;gap:40px;align-items:start}footer p{max-width:490px;margin:0}footer a{color:inherit;margin-left:auto;max-width:200px}#simulator{position:fixed;inset:0;background:#e4e9e1;z-index:10;overflow:auto;padding:18px 4%;color:#1c2c23}.sim-top{display:flex;align-items:center;justify-content:space-between;gap:15px}.sim-top>span{font-size:11px;letter-spacing:1.3px}.outline{padding:10px 14px;background:transparent;border:1px solid #a6b3a5;border-radius:5px;color:inherit;font-size:14px;min-height:42px}.toolbar{display:flex;gap:8px}#steps{display:flex;max-width:1200px;margin:22px auto 16px;gap:4px}#steps span{flex:1;background:#d2dacd;color:#465441;padding:10px 6px;font-size:12px;text-align:center;border-radius:3px}#steps span.active{background:var(--ink);color:white}#steps span.done{background:#bcd0ad}.machine{max-width:1200px;margin:auto;background:#eceee3;border:2px solid #b8bdad;border-bottom:9px solid #afb6a6;border-radius:22px;padding:32px;display:grid;grid-template-columns:1.5fr 1fr;gap:40px;box-shadow:0 20px 35px #172b181a}.screen-frame{background:#222722;padding:15px;border-radius:4px}.screen{background:#fafbf5;color:#161c18;min-height:370px;padding:24px;display:flex;flex-direction:column}.screen h2{font-size:28px;font-weight:700;margin:16px 0}.screen small{font-size:12px}.digits{display:flex;gap:5px;margin:12px 0 24px}.digits span{border:1px solid #535a51;width:37px;height:45px;display:grid;place-items:center;font-size:30px}.candidate-info{display:flex;gap:20px;align-items:start}.candidate-info img{width:80px;height:100px;object-fit:cover}.candidate-info strong{display:block;font-size:20px;margin:6px 0}.candidate-info p{margin:4px 0;font-size:14px}.screen-bottom{margin-top:auto;border-top:1px solid #afb4a6;padding-top:10px;font-size:12px;line-height:1.6}.screen .end{font-size:90px;margin:auto;text-align:center}.screen .end small{display:block;font-size:16px;letter-spacing:0}.keypad-panel{display:flex;flex-direction:column;justify-content:center;gap:20px}.machine-brand{text-align:center;font-size:14px;letter-spacing:2px}.machine-brand b{display:block;font-size:22px}.machine-brand small{display:block;font-size:11px;letter-spacing:0;margin-top:5px}.keys{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:0 18px}.keys button{height:55px;background:#303933;color:white;border:1px solid #667061;border-radius:7px;font-size:29px;text-align:left;padding-left:18px;box-shadow:0 4px 0 #959d8d}.keys button:last-child{grid-column:2}.keys button small{font-size:15px;color:#8f998b;margin-left:10px}.keys button:active,.actions button:active{transform:translateY(3px);box-shadow:none}.actions{display:flex;align-items:end;gap:9px}.actions button{flex:1;min-width:0;padding:16px 2px;border-radius:5px;font-size:13px;font-weight:700;border:1px solid #9aa28f;box-shadow:0 4px 0 #a0a792;min-height:54px}.blank{background:white}.correct{background:#ee8846}.confirm{background:#4cbd68!important;min-height:65px!important}.sim-help{max-width:1200px;margin:20px auto;font-size:15px}.sim-help p{font-weight:600;margin:8px 0}.sim-help>span{font-size:12px;color:#50644e}.sim-bottom{max-width:1200px;margin:auto;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#50644e}#record-info{max-width:1200px;margin:auto;font-size:14px;padding:5px}#record-info a{color:var(--ink);font-weight:bold}dialog{width:min(900px,95vw);max-height:90dvh;border:1px solid #c4d0be;border-radius:14px;padding:28px;color:var(--ink);background:#f8faf7}dialog::backdrop{background:#0a2019aa;backdrop-filter:blur(5px)}.dialog-head{display:flex;justify-content:space-between;align-items:start}.dialog-head h2{margin-top:8px}dialog p{font-size:14px;line-height:1.6}dialog label{font-size:14px;display:block}input,select{padding:11px;border:1px solid #b6c3ae;border-radius:4px;background:white;color:#17392b;max-width:100%}#uf{margin-left:15px}.candidate-row{border:1px solid #c9d2c3;padding:15px;margin:15px 0;border-radius:8px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.candidate-row input,.candidate-row select{width:100%;margin-top:5px}.candidate-row .remove{justify-self:end;align-self:end}.dialog-footer{display:flex;justify-content:end;gap:10px;flex-wrap:wrap;margin-top:24px;align-items:center}#config-error{color:#ab321e}.photo-label small{display:block;color:#607157}
@media(min-width:1500px){.sequence{padding-left:calc((100vw - 1268px)/2);padding-right:calc((100vw - 1268px)/2)}}
@media(max-width:900px){.hero{gap:30px;padding-top:45px}h1{font-size:45px;letter-spacing:-2px}.hero-art{padding:20px;min-height:400px}.mini-machine{padding:14px 10px;gap:8px}.mini-screen{padding:8px;border-width:7px}.mini-screen strong{font-size:15px}.mini-keys{margin:0}.learn{grid-template-columns:repeat(3,1fr)}.learn>div{grid-column:1/-1}.learn>div h2 br{display:none}.machine{gap:20px;padding:20px}.screen{padding:16px}.sim-top>span{max-width:160px;text-align:center}.keys{padding:0;gap:9px}.keys button{padding-left:10px}.keys button small{margin-left:5px}.actions button{font-size:11px}.sequence{gap:30px}footer{flex-wrap:wrap}footer a{margin-left:0}}
@media(max-width:600px){.navigation{padding:20px 6%;gap:8px}.brand{font-size:20px}.brand-mark{width:28px;height:28px}.edition{display:none}.navigation .text-button{font-size:12px;margin-left:auto;max-width:115px}.hero{grid-template-columns:1fr;padding:40px 6%;gap:35px}h1{font-size:47px}.intro{font-size:16px}.hero .primary{width:100%}.independent{margin-top:25px}.hero-art{min-height:370px}.mini-machine{max-width:420px;width:100%;align-self:center;margin:36px 0;padding:20px 16px}.mini-screen{min-height:175px;padding:10px}.mini-screen strong{font-size:18px}.mini-keys i{font-size:16px}.learn{grid-template-columns:1fr;gap:26px;padding-top:35px}.learn>div{grid-column:auto}.learn article{border-bottom:1px solid #dce3d7;padding-bottom:15px}.learn h3{margin:15px 0 6px}.learn p{margin:0}.sequence{grid-template-columns:1fr;gap:0}.sequence>div{justify-self:start}.sequence h2 br{display:none}.sequence li{gap:14px;font-size:14px}footer{gap:18px}#simulator{padding:10px 12px}.sim-top{gap:6px;flex-wrap:wrap}.sim-top>span{order:3;max-width:none;width:100%;font-size:10px;margin:8px 0}.outline{font-size:12px;padding:9px}#steps{margin:8px 0;display:grid;grid-template-columns:repeat(3,1fr)}#steps span{font-size:10px;padding:6px 3px}.machine{grid-template-columns:1fr;gap:12px;padding:12px;border-radius:14px}.screen-frame{padding:8px}.screen{min-height:252px;padding:13px}.screen h2{font-size:21px;margin:10px 0}.digits{margin:5px 0 12px}.digits span{width:29px;height:35px;font-size:25px}.candidate-info img{height:68px;width:54px}.candidate-info strong{font-size:16px}.candidate-info p{font-size:12px}.screen-bottom{font-size:10px}.keypad-panel{gap:12px}.machine-brand{display:none}.keys{gap:7px;max-width:290px;width:100%;margin:auto}.keys button{height:43px;font-size:24px}.actions{max-width:350px;width:100%;margin:auto}.actions button{min-height:43px;padding:12px 0}.actions .confirm{min-height:48px!important}.sim-help{margin:12px 0;font-size:13px}.sim-help>span{display:none}.sim-bottom{font-size:10px;gap:12px}.sim-bottom .text-button{font-size:12px}.candidate-row{grid-template-columns:1fr}dialog{padding:20px}.screen .end{font-size:70px}}
@media(prefers-reduced-motion:no-preference){.primary,.keys button,.actions button{transition:filter .15s,transform .1s}}

#choose-state{max-width:570px}#voter-uf{width:100%;margin:10px 0;font-size:16px;min-height:52px}#state-coverage{background:#e4eddc;border-radius:5px;padding:12px;min-height:44px}#state-coverage:empty{display:none}#begin-training{width:100%;justify-content:center}button:disabled{opacity:.45;cursor:not-allowed}.catalogue-box{padding:18px;border:1px solid #c4d3b8;border-radius:8px;background:#eaf1e4;margin:15px 0 25px}.catalogue-box h3{margin-top:0}.catalogue-box a{color:var(--ink);display:inline-block;margin-bottom:18px;font-size:14px}.catalogue-box .import-label{display:block;width:fit-content;background:white}.candidate-info p{overflow-wrap:anywhere}
