:root{--navy:#182d42;--ink:#283e53;--muted:#708296;--line:#c9d4df;--blue:#275e8f;--danger:#ae3f48;--ok:#39754e;font-family:"Segoe UI",Arial,sans-serif;font-size:13px;color:var(--ink);background:#dce4eb}
*{box-sizing:border-box}body{margin:0;min-height:100dvh}button,input{font:inherit}[hidden]{display:none!important}button:focus-visible,input:focus-visible{outline:2px solid #6a92b8;outline-offset:2px}
.bg{position:fixed;inset:0;z-index:0;background:#dbe3eb}.bg__image{position:absolute;inset:0;background:url("/static/aero-chart-bg.png") center/cover no-repeat;filter:grayscale(1);opacity:.14}.bg__grid{position:absolute;inset:0;background:linear-gradient(90deg,#c8d4df38 1px,transparent 1px),linear-gradient(#c8d4df38 1px,transparent 1px);background-size:64px 64px}.bg__vignette{position:absolute;inset:0;background:#edf2f64f}
.stage{position:relative;z-index:1;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:25px}.panel{width:100%;max-width:438px;background:#fff;border:1px solid #a5b6c6;border-radius:4px;box-shadow:0 8px 32px #16324b1f;overflow:hidden}.panel__head{padding:18px 22px 14px;background:var(--navy);color:#ecf2f7;border-bottom:1px solid #13283b}.brand{display:flex;align-items:center;gap:13px}.brand__logo{object-fit:contain;width:90px;height:52px}.brand__divider{width:1px;height:39px;background:#4c6072;flex-shrink:0}.brand__text h1{margin:0;font-size:16px;font-weight:600;line-height:1.45;letter-spacing:0;text-transform:none}.brand__version{font-size:8px;font-weight:500;letter-spacing:.8px;margin:5px 0 0;color:#99b0c4}.steps{display:flex;align-items:center;gap:10px;list-style:none;padding:0;margin:20px 0 0}.steps__item{display:flex;align-items:center;gap:6px;color:#7d95aa;font-size:9px;font-weight:500;white-space:nowrap;text-transform:uppercase;letter-spacing:.35px}.steps__item.is-active{color:#ecf4fb}.steps__num{display:inline-grid;place-items:center;width:21px;height:20px;border:1px solid #486075;background:#223c54;border-radius:2px;font-size:9px;font-variant-numeric:tabular-nums}.is-active .steps__num{background:#3d6284;border-color:#6f93b4;color:#fff}.steps__line{height:1px;background:#445a6e;flex:1}
.step{display:none;padding:22px}.step.is-active{display:block}.step__intro{margin-bottom:20px}.tag{display:block;font-size:8px;font-weight:600;letter-spacing:.6px;color:#7e91a3;margin-bottom:9px}.step__intro h2{font-size:17px;font-weight:600;margin:0 0 8px;letter-spacing:-.2px}.step__intro p{font-size:11px;line-height:1.8;color:#718397;margin:0}.callsign{color:#3f607e;font-weight:600}.field{display:block;margin-bottom:15px}.field__label{display:block;font-size:10px;font-weight:600;color:#53697e;margin-bottom:7px}.field input{width:100%;height:35px;border:1px solid #aebdcb;border-radius:3px;background:#fbfcfd;color:#294357;padding:7px 10px;font-size:12px}.field input:focus{background:white;border-color:#557fa5;outline:2px solid #d8e6f2;outline-offset:0}.field input::placeholder{color:#9aa8b5}.field__hint{display:block;min-height:14px;font-size:10px;color:var(--danger);margin-top:5px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:33px;padding:7px 12px;font-size:11px;font-weight:600;border:1px solid #b3c1cd;border-radius:3px;background:#f7f9fb;color:#536c82;cursor:pointer}.btn--primary{width:100%;background:var(--blue);border-color:#1f507d;color:white}.btn--primary:hover{background:#1c4b74}.btn--primary svg{width:14px;height:14px}.btn--ghost{background:#fff;border-color:#bdcbd6;color:#44627d}.btn--link{border-color:transparent;background:none;color:#6e8498;padding-left:0;padding-right:0}.btn:disabled{opacity:.5;cursor:wait}.scanner{position:relative;aspect-ratio:4/3;background:#16283a;border:1px solid #9eafbf;border-radius:3px;overflow:hidden;margin:15px 0 12px}.scanner video{position:absolute;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.scanner__hud{position:absolute;inset:0;pointer-events:none;display:grid;place-items:center}.reticle{position:relative;width:60%;height:76%;display:block}.reticle__c{position:absolute;width:16px;height:16px;border:2px solid #d4e4ef}.reticle__c--tl{top:0;left:0;border-right:0;border-bottom:0}.reticle__c--tr{top:0;right:0;border-left:0;border-bottom:0}.reticle__c--bl{bottom:0;left:0;border-right:0;border-top:0}.reticle__c--br{bottom:0;right:0;border-left:0;border-top:0}.scanner[data-state="detected"] .reticle__c{border-color:#9ecaa8}.scanner[data-state="error"] .reticle__c{border-color:#d29d9d}.scanner__readout{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;gap:7px;background:#172c40d9;color:#cfdfed;padding:8px 10px;font-size:9px}.dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#9bb5ca}.scanner[data-state="detected"] .dot{background:#a1c8a8}.scanner[data-state="error"] .dot{background:#db929b}.face-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.face-actions #back-btn{margin-left:auto}.auth-message{font-size:10px;line-height:1.8;margin:12px 0 0;color:#71869a;min-height:0}.auth-message:empty{display:none}.auth-message.is-error{color:var(--danger)}.auth-message.is-ok{color:var(--ok)}.auth-message.is-busy{color:#50789b}
.panel__foot{padding:11px 22px;border-top:1px solid #d5dfe8;background:#f3f6f9;display:flex;justify-content:space-between;gap:10px;color:#8495a4;font-size:8px;letter-spacing:.15px}.mono{font-variant-numeric:tabular-nums}.powered-by{position:fixed;bottom:17px;right:20px;z-index:1;display:flex;align-items:center;gap:8px;background:#20384e;color:#acbfd0;border:1px solid #3a536a;border-radius:3px;font-size:8px;padding:7px 11px}.powered-by img{height:18px;width:auto}.powered-by__name{font-size:9px;color:#d1dde6;font-weight:500}
@media(max-width:520px){.stage{padding:16px 14px 73px;align-items:center}.panel{max-width:395px}.panel__head{padding:16px 18px 13px}.brand{gap:11px}.brand__logo{width:75px;height:45px}.brand__text h1{font-size:14px}.brand__version{font-size:7px}.brand__divider{height:35px}.step{padding:19px 18px}.step__intro{margin-bottom:16px}.step__intro h2{font-size:16px}.panel__foot{padding:10px 18px;font-size:7px}.steps{margin-top:17px;gap:7px}.steps__item{font-size:8px}.powered-by{right:14px;bottom:14px;padding:6px 9px}.scanner{aspect-ratio:4/3}.field input{font-size:16px;height:38px}}
