*{box-sizing:border-box}body{margin:0;background:#f2f4f7;font-family:Arial,Helvetica,sans-serif;color:#202124}
header{background:#1769e0;color:#fff;text-align:center;padding:18px 12px}h1{font-size:24px;margin:0 0 9px}.pill{display:inline-block;background:rgba(255,255,255,.18);padding:6px 12px;border-radius:99px;font-size:13px}
main{max-width:760px;margin:auto;padding:16px}.tabs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
button{border:0;border-radius:10px;padding:14px 16px;font-weight:700;font-size:16px;cursor:pointer}.tab{background:#e4e8ee}.tab.active{background:#1769e0;color:#fff}
.card{background:#fff;border-radius:16px;padding:16px;margin-bottom:15px;box-shadow:0 2px 10px rgba(0,0,0,.08)}h2{text-align:center;font-size:20px}
.camera-wrap{position:relative;background:#000;border-radius:15px;overflow:hidden;aspect-ratio:4/3}.camera-wrap video,.camera-wrap canvas{position:absolute;width:100%;height:100%;object-fit:cover;inset:0}.camera-wrap video{transform:scaleX(-1)}.camera-wrap canvas{pointer-events:none;transform:scaleX(-1)}
.face-guide{position:absolute;width:52%;height:76%;border:4px solid rgba(255,255,255,.78);border-radius:50%;left:24%;top:12%;pointer-events:none}
.status{text-align:center;font-weight:700;padding:12px}.loading{color:#e37400}.ready{color:#137333}.error{color:#c5221f}
.camera-actions{display:grid;grid-template-columns:1fr auto;gap:8px}.camera-actions select{min-width:0}
input,select{width:100%;padding:13px;border:1px solid #c8ccd0;border-radius:9px;font-size:16px;margin:7px 0 12px;background:#fff}
label{font-weight:700}.primary{width:100%;background:#1769e0;color:#fff}.green{background:#188038}.secondary{background:#e8eaed;color:#202124}.result{text-align:center;padding:18px;min-height:80px;font-size:18px}.small-result{min-height:55px}.name{font-size:27px;font-weight:800;color:#137333}.success{color:#137333;font-size:21px;font-weight:800}.warn{color:#e37400}.bad{color:#c5221f}.hint{color:#5f6368;line-height:1.45;font-size:14px}.hidden{display:none!important}details summary{cursor:pointer;font-weight:800}
@media(max-width:600px){h1{font-size:20px}main{padding:10px}.card{padding:11px}.camera-actions{grid-template-columns:1fr}.tabs button{font-size:14px;padding:12px 8px}}
