:root{--c:#1d4ed8;--c2:#1e40af;--ok:#15803d;--warn:#b45309;--bad:#b91c1c;--ink:#0f172a;--mut:#475569;--line:#e2e8f0;--bg:#f8fafc;--r:14px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:#fff}
main{flex:1 0 auto}a{color:var(--c)}img{max-width:100%}
.vh{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.wrap{max-width:1040px;margin:0 auto;padding:0 16px}
header.top{border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:20}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;height:56px;gap:12px}
.logo{font-weight:800;font-size:19px;color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:8px}
.logo i{display:inline-block;width:26px;height:32px;border-radius:6px;background:linear-gradient(160deg,#dbeafe,#93c5fd);position:relative;font-style:normal}
.logo i:after{content:"";position:absolute;left:7px;top:6px;width:12px;height:14px;border-radius:50%;background:#1d4ed8}
nav.links{display:flex;gap:14px;font-size:15px}nav.links a{text-decoration:none;color:var(--mut)}nav.links a:hover{color:var(--c)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:12px;background:var(--c);color:#fff;font-weight:700;font-size:17px;padding:14px 22px;text-decoration:none;cursor:pointer;min-height:52px;transition:background .15s}
.btn:hover{background:var(--c2)}.btn.big{font-size:19px;padding:16px 28px;min-height:58px;width:100%;max-width:420px}
.btn.sec{background:#fff;color:var(--c);border:2px solid var(--c)}.btn.sec:hover{background:#eff6ff}
.btn.ghost{background:transparent;color:var(--mut);border:1px solid var(--line);font-weight:600;font-size:15px;min-height:44px;padding:10px 16px}
.btn[disabled]{opacity:.5;cursor:default}
.hero{padding:36px 0 28px;background:linear-gradient(180deg,#eff6ff,#fff)}
.hero h1{font-size:30px;line-height:1.2;margin:0 0 12px;letter-spacing:-.3px}
.hero p.lead{font-size:18px;color:var(--mut);margin:0 0 20px;max-width:640px}
.hero .grid{display:grid;grid-template-columns:1.5fr .7fr;gap:28px;align-items:center}
.hero .cta{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.small{font-size:14px;color:var(--mut)}.tiny{font-size:12.5px;color:var(--mut)}
.badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}.badges span,.badges a{background:#fff;border:1px solid var(--line);border-radius:99px;padding:6px 12px;font-size:14px;color:var(--ink);text-decoration:none;min-height:36px;display:inline-flex;align-items:center}.badges a:hover{border-color:var(--c);color:var(--c)}
.paybar{display:none}
@media (max-width:859px){.paybar.on{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);border-top:1px solid var(--line);box-shadow:0 -6px 20px rgba(15,23,42,.08)}.paybar .btn{width:100%}}
.shut-wrap{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:13px;color:var(--mut);font-weight:600}
.example.sm svg{width:150px;height:182px}
section.block{padding:30px 0;border-top:1px solid var(--line)}section.block h2{font-size:24px;margin:0 0 16px}section.block h2.mt{margin-top:32px}
.docs{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.doc{display:block;position:relative;padding-right:36px!important;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;text-decoration:none;color:var(--ink);background:#fff;transition:border-color .15s,box-shadow .15s}
.doc:after{content:"";position:absolute;right:16px;top:50%;width:8px;height:8px;border:solid #94a3b8;border-width:2px 2px 0 0;transform:translateY(-50%) rotate(45deg)}.doc:hover:after{border-color:var(--c)}
.doc:hover{border-color:var(--c);box-shadow:0 2px 10px rgba(29,78,216,.12)}.doc b{display:block;font-size:16px}.doc span{font-size:13.5px;color:var(--mut)}
.group-t{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut);margin:18px 0 8px}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;counter-reset:s}
.steps div{background:var(--bg);border-radius:var(--r);padding:16px}.steps div:before{counter-increment:s;content:counter(s);display:flex;width:28px;height:28px;border-radius:50%;background:var(--c);color:#fff;font-weight:700;align-items:center;justify-content:center;margin-bottom:10px}
.steps div b{display:block;margin-bottom:4px}.steps div br{display:none}
.price{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;background:#0f172a;color:#fff;border-radius:18px;padding:22px}
.price .sum{font-size:44px;font-weight:800;line-height:1}.price .sum small{font-size:16px;font-weight:600;opacity:.8}.price ul{margin:0;padding-left:18px}
details.faq{border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin-bottom:8px}details.faq summary{font-weight:700;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px}details.faq summary::-webkit-details-marker{display:none}
details.faq summary:after,details.card>summary:after,details.checks-box>summary:after{content:"";flex:none;width:8px;height:8px;margin:7px 4px 0 0;border:solid #64748b;border-width:0 2px 2px 0;transform:rotate(45deg);transition:transform .15s}
details[open].faq summary:after,details[open].card>summary:after,details[open].checks-box>summary:after{transform:rotate(-135deg);margin-top:11px}
details.card>summary,details.checks-box>summary{list-style:none;display:flex;justify-content:space-between;gap:12px;cursor:pointer}details.card>summary::-webkit-details-marker,details.checks-box>summary::-webkit-details-marker{display:none}
details.faq p{margin:10px 0 2px;color:var(--mut)}
table.req{border-collapse:collapse;width:100%;font-size:15px}table.req td,table.req th{border-bottom:1px solid var(--line);padding:8px 6px;text-align:left;vertical-align:top}
footer.bot{border-top:1px solid var(--line);margin-top:30px;flex-shrink:0;padding:24px 0 40px;background:var(--bg);font-size:14px;color:var(--mut)}
footer.bot .app-foot{display:flex;flex-wrap:wrap;gap:4px 18px;justify-content:center}footer.bot .app-foot a{display:inline;margin:0}
footer.bot .cols{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}footer.bot a{color:var(--mut);display:block;margin:3px 0}
.notice{border-radius:12px;padding:12px 14px;margin:12px 0;font-size:15px}.notice.warn{background:#fffbeb;border:1px solid #fcd34d}.notice.bad{background:#fef2f2;border:1px solid #fca5a5}.notice.ok{background:#f0fdf4;border:1px solid #86efac}.notice.info{background:#eff6ff;border:1px solid #bfdbfe}
.card{border:1px solid var(--line);border-radius:18px;padding:18px;background:#fff}
input[type=email],input[type=text],input[type=number],textarea,select{width:100%;font:inherit;font-size:17px;padding:13px 14px;border:1.5px solid #cbd5e1;border-radius:12px;background:#fff}
input:focus,textarea:focus,select:focus{outline:2px solid #93c5fd;border-color:var(--c)}
label.chk{display:flex;gap:10px;align-items:flex-start;font-size:15px;margin:10px 0;cursor:pointer}label.chk input{width:22px;height:22px;flex:none;margin-top:1px}
.muted{color:var(--mut)}.center{text-align:center}.mt{margin-top:14px}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
/* app */
.app{max-width:560px;margin:0 auto;padding:14px 16px 30px}
.app h1{font-size:22px;margin:6px 0 10px}
.step{display:none}.step.on{display:block}
.cam{position:relative;width:100%;aspect-ratio:3/4;background:#111;border-radius:18px;overflow:hidden;transition:box-shadow .2s}
.cam.lightbox{box-shadow:0 0 0 14px #fff,0 0 0 15px var(--line)}
body.lit{background:#fff}
.cam video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.cam video.mirror{transform:scaleX(-1)}
.cam svg.ov{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hint{position:absolute;left:10px;right:10px;bottom:12px;background:rgba(15,23,42,.78);color:#fff;border-radius:12px;padding:10px 12px;font-size:16px;font-weight:600;text-align:center;min-height:44px}
.hint.good{background:rgba(21,128,61,.88)}
.shutter-row{display:flex;align-items:center;justify-content:space-between;margin-top:14px;gap:10px}
.shutter{width:78px;height:78px;border-radius:50%;border:5px solid #cbd5e1;background:var(--c);cursor:pointer;flex:none;display:flex;align-items:center;justify-content:center;padding:0}
.shutter i{width:30px;height:24px;border-radius:6px;border:3px solid #fff;position:relative}.shutter i:after{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;border-radius:50%;border:3px solid #fff;transform:translate(-50%,-50%)}
.shutter.ready{border-color:#86efac;animation:pulse 1.2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(21,128,61,.6)}70%{box-shadow:0 0 0 16px rgba(21,128,61,0)}100%{box-shadow:0 0 0 0 rgba(21,128,61,0)}}
.side-btn{background:none;border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:14px;color:var(--ink);cursor:pointer;min-height:44px;max-width:130px}
.progress{height:10px;background:var(--line);border-radius:99px;overflow:hidden}.progress i{display:block;height:100%;width:5%;background:var(--c);transition:width .8s}
.pv{display:grid;grid-template-columns:1fr;gap:12px;justify-items:center}.pv img{width:min(78%,330px);border-radius:6px;box-shadow:0 4px 20px rgba(15,23,42,.15);background:#fff}
ul.checks{list-style:none;padding:0;margin:10px 0}ul.checks li{padding:5px 0 5px 28px;position:relative;font-size:15px}
ul.checks li:before{position:absolute;left:0;top:4px;width:20px;height:20px;border-radius:50%;color:#fff;font-size:13px;display:flex;align-items:center;justify-content:center;font-weight:700}
ul.checks li.ok:before{content:"✓";background:var(--ok)}ul.checks li.warn:before{content:"!";background:var(--warn)}ul.checks li.info:before{content:"i";background:#64748b}
.paybox{background:var(--bg);border:1px solid var(--line);border-radius:18px;padding:16px;margin-top:14px}.paybox .pay-h{font-size:18px;font-weight:700}.paybox .pay-h b{color:var(--c)}
.prev-grid{display:grid;gap:8px}.pv p{margin:0}
.checks-box{border:1px solid #bbf7d0;background:#f0fdf4;border-radius:14px;padding:10px 14px;margin-top:6px}.checks-box.warn{border-color:#fcd34d;background:#fffbeb}.checks-box summary{font-weight:600;font-size:15px;align-items:center}
.cs{display:inline-flex!important;width:20px;height:20px;border-radius:50%;color:#fff;font-size:13px;font-weight:700;align-items:center;justify-content:center;margin-right:6px;vertical-align:-3px}.cs.ok{background:var(--ok)}.cs.warn{background:var(--warn)}
.done-grid{display:grid;gap:14px}.done-grid>img{width:120px;border-radius:6px;box-shadow:0 4px 14px rgba(15,23,42,.15);justify-self:center}
#zip{width:100%;max-width:none;margin-top:4px}
.app:has(#st-prev.on),.app:has(#st-done.on){max-width:980px}
@media (min-width:860px){.prev-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start}.pv{position:sticky;top:76px}.pv img{width:min(100%,380px)}.done-grid{grid-template-columns:200px 1fr;gap:28px;align-items:start}.done-grid>img{width:200px}}
.paybox .rails{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.files a{display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:8px;text-decoration:none;color:var(--ink);background:#fff}
.files a b{font-weight:600}.files a span{color:var(--mut);font-size:13px;white-space:nowrap}
.copy{display:flex;gap:6px;align-items:center}.copy code{flex:1;word-break:break-all;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px;font-size:14px}
.hist{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.hist .it{border:1px solid var(--line);border-radius:14px;padding:8px;text-align:center;font-size:13.5px}.hist img{border-radius:6px;width:100%}
.qr{display:grid;grid-template-columns:150px 1fr;gap:16px;align-items:center}.qr .code svg{width:150px;height:150px}
.example{display:flex;justify-content:center}.example svg{width:190px;height:230px}
.fine{display:grid;grid-template-columns:1fr;gap:6px}.fine input[type=range]{width:100%}
.bgopts{display:flex;gap:8px;flex-wrap:wrap}.bgopts label{display:flex;align-items:center;gap:8px;border:1.5px solid var(--line);border-radius:10px;padding:8px 12px;cursor:pointer;position:relative}.bgopts label:has(input:checked){border-color:var(--c);background:#eff6ff;font-weight:600}.bgopts label:has(input:focus-visible){outline:2px solid #93c5fd}
.bgopts i{width:22px;height:22px;border-radius:5px;border:1px solid #94a3b8;display:inline-block}
@media (max-width:760px){.hero .grid{grid-template-columns:1fr}.hero h1{font-size:26px}.steps{grid-template-columns:1fr 1fr}.price{grid-template-columns:1fr}footer.bot .cols{grid-template-columns:1fr}nav.links .hide-m{display:none}.qr{grid-template-columns:1fr}.hero .visual{display:none}}

/* camera state (oYke9yxc): oval white = no face, amber = face found but off, green = in place */
#oval{stroke:#fff;stroke-dasharray:8 6;transition:stroke .25s}#oval.off{stroke:#fbbf24;stroke-dasharray:none}#oval.ok{stroke:#22c55e;stroke-dasharray:none;stroke-width:6}
.hint{transition:background .25s}.hint.warn{background:rgba(146,64,14,.88)}
.cam-tag{position:absolute;left:10px;top:10px;background:rgba(15,23,42,.78);color:#fff;border-radius:10px;padding:6px 10px;font-size:13px;font-weight:600}
.cam-checks{list-style:none;display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:10px 0 0;padding:0}
.cam-checks li{display:flex;align-items:center;gap:6px;font-size:14px;border:1px solid var(--line);border-radius:99px;padding:5px 11px;color:var(--mut)}
.cam-checks li i{width:10px;height:10px;border-radius:50%;background:#cbd5e1;flex:none}
.cam-checks li.ok{color:#15803d;border-color:#86efac}.cam-checks li.ok i{background:#22c55e}
.cam-checks li.bad{color:#92400e;border-color:#fcd34d}.cam-checks li.bad i{background:#f59e0b}
.cam.lightbox+.cam-checks{margin-top:24px}
.legal h3{margin-top:22px}.legal li{margin:6px 0}
.tbl{width:100%;border-collapse:collapse;font-size:15px;margin:10px 0}.tbl th,.tbl td{border:1px solid var(--line);padding:8px;text-align:left;vertical-align:top}.tbl th{background:#f8fafc}
@media (max-width:520px){.tbl{font-size:14px}.tbl th,.tbl td{padding:6px}}
#paybox{scroll-margin-top:72px}
@media (max-width:760px){.steps{grid-template-columns:1fr;gap:10px}.steps div{position:relative;padding:14px 16px 14px 58px}.steps div:before{position:absolute;left:16px;top:14px;margin:0}}
.dgroups .docs{grid-template-columns:1fr}
@media (min-width:761px){.dgroups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 20px;align-items:start}.dgroups>div:last-child{grid-row:span 2}.hero .visual svg{width:250px;height:302px}}
details#other summary{color:var(--c);cursor:pointer;font-size:15px}
.app .btn.big{max-width:none}
@media (max-width:859px){body.pb{padding-bottom:84px}}
@media (max-width:760px){.steps div{padding-top:12px;padding-bottom:12px}}
