/* O mesmo azul, tipografia e cartões da home. */
:root { --ink:#090b10; --ink-soft:#606775; --paper:#fff; --line:#e5eaf2; --blue:#005cff; --blue-deep:#0044cb; --blue-soft:#edf4ff; }
body { background:linear-gradient(180deg,#fff 100px,#f7faff 500px); min-height:100vh; }
a { text-decoration:none; }
header.mini { max-width:1180px; min-height:86px; padding:18px 32px; gap:20px; }
.logo { display:inline-flex; align-items:baseline; gap:1px; font-family:'Plus Jakarta Sans',system-ui,sans-serif; font-size:30px; font-weight:800; letter-spacing:-1.8px; color:var(--ink); line-height:1; white-space:nowrap; }
.brand-at { font-size:47px; color:var(--blue); letter-spacing:-4px; margin-right:3px; }
.brand-domain { color:var(--blue); }
.back-link { display:inline-flex; align-items:center; gap:8px; padding:10px 0; }
.back-link:hover { color:var(--blue); }
.wizard-wrap { max-width:620px; padding:32px 24px 40px; }
.wizard-wrap:has(.step[data-step='escolha'].active) { max-width:900px; }
.wizard-wrap:has(.step[data-step='dominio-dns'].active) { max-width:760px; }
.stepper { gap:9px; margin-bottom:28px; }
.step-dot { width:24px; height:5px; border-radius:8px; }
.step-dot.active { transform:none; }
.card { border-radius:22px; padding:36px; box-shadow:0 20px 50px -30px #173d7450; }
.card h2 { font-size:28px; line-height:1.2; letter-spacing:-.8px; }
.card .sub { font-size:14px; line-height:1.75; }
.step-art.green { background:linear-gradient(145deg,#36d793,#0d9865); }
.step-art.purple { background:linear-gradient(145deg,#c375ff,#8729ec); }
.btn-primary { background:var(--blue); color:white; font-family:inherit; padding:16px 20px; transition:background .2s,transform .2s,box-shadow .2s; }
.btn-primary:hover:not(:disabled) { background:var(--blue-deep); transform:translateY(-2px); box-shadow:0 8px 20px #005cff20; }
.btn-secondary { font-family:inherit; }
.btn-secondary:hover { background:var(--blue-soft); color:var(--blue-deep); }
.field { background:white; border-color:#cdd8ec; padding:16px; }
.field-label { display:block; font-size:12px; font-weight:800; margin-top:22px; }
.field-label + .field, .field-label + .addr-preview { margin-top:8px; }
.addr-preview { border-color:#cdd8ec; }
.addr-preview:focus-within { border-color:var(--blue); box-shadow:0 0 0 4px var(--blue-soft); }
.addr-preview input { min-width:0; width:100%; font-family:inherit; padding:16px; }
.addr-preview .suffix { background:white; font-family:inherit; font-size:14px; font-weight:800; padding-left:0; color:var(--blue); max-width:65%; overflow-wrap:anywhere; white-space:normal; }
.choice-intro { margin-bottom:32px; }
.choice-badge { color:var(--blue); background:var(--blue-soft); font-size:12px; }
.choice-intro h2 { font-size:38px; letter-spacing:-1.4px; margin-top:20px; }
.choice-intro .sub { max-width:580px; margin:14px auto 0; line-height:1.7; }
.choice-grid { gap:22px; }
.choice-card { padding:30px; border:1px solid var(--line); border-radius:22px; box-shadow:0 16px 40px -28px #173d7450; }
.choice-card:hover { box-shadow:0 24px 50px -26px #173d7450; }
.choice-icon { width:62px; height:62px; border-radius:18px; margin-bottom:24px; }
.choice-icon.blue { background:linear-gradient(145deg,#32baff,#005cff); color:white; }
.choice-icon.green { background:linear-gradient(145deg,#36d793,#0d9865); color:white; }
.choice-icon svg { width:30px; height:30px; }
.choice-card h3 { font-size:21px; line-height:1.3; }
.choice-desc { line-height:1.75; }
.choice-note { background:#f7faff; border:0; padding:16px; line-height:1.7; }
.choice-cta { border-top:1px solid var(--line); padding-top:20px; justify-content:space-between; color:var(--blue); }
.captcha-box { background:#f7faff; border:1px solid var(--line); }
.captcha-tag { max-width:105px; white-space:normal !important; text-align:center; }
.success-icon { width:76px; height:76px; background:linear-gradient(145deg,#36d793,#0d9865); color:white; box-shadow:0 10px 25px -12px #0d986580; }
.success-icon svg { width:36px; height:36px; }
.dns-scroll { overflow-x:auto; margin-top:18px; border:1px solid var(--line); border-radius:12px; }
table.dns-table { margin-top:0; min-width:480px; }
table.dns-table th { padding:14px 10px; background:#f7faff; }
table.dns-table td { padding:14px 10px; }
.copy-btn { padding:7px 10px; }
.dns-note { font-style:normal; }
.verify-state { line-height:1.6; }
.recovery-chip { background:#f7faff; padding:14px; }
.onboarding-footer { max-width:740px; padding:0 24px 28px; margin:auto; text-align:center; color:var(--ink-soft); font-size:12px; line-height:1.7; }
.onboarding-footer .footer-note { margin:0 0 20px; }
.proto-ribbon { background:transparent; color:var(--ink-soft); font-size:11px; font-weight:500; padding:14px 0 0; border-top:1px solid var(--line); }
.proto-ribbon strong { color:var(--ink-soft); }
.proto-ribbon a { color:var(--blue); }
:focus-visible { outline:3px solid var(--blue); outline-offset:4px; }
@media(max-width:600px) { header.mini { padding:18px 20px; min-height:72px; } .logo { font-size:23px; } .brand-at { font-size:36px; } .back-link { font-size:12px; } .wizard-wrap { padding:24px 20px 32px; } .card { padding:26px 22px; } .card h2 { font-size:25px; } .choice-intro h2 { font-size:30px; } .choice-grid { flex-direction:column; } .choice-card { flex-basis:auto; padding:26px; } .addr-preview .suffix { font-size:12px; padding-right:10px; } .addr-preview input { padding:16px 10px; } }
@media(prefers-reduced-motion:reduce) { *, *::before, *::after { animation:none !important; transition:none !important; } }

body.embedded { background:#fff; min-height:0; }
.embedded header.mini, .embedded .onboarding-footer { display:none; }
.embedded .wizard-wrap { max-width:none; padding:20px 28px 28px; }
.embedded .card { border:0; box-shadow:none; padding:8px 0; }

.embedded .choice-intro h2 { font-size:30px; }
@media(max-width:600px) { .embedded .wizard-wrap { padding:16px 20px 24px; } }

/* Tipografia legível e hierarquia consistente dentro do modal. */
.embedded .wizard-wrap { padding:20px 32px 28px; }
.embedded .card h2 { font-size:28px; letter-spacing:-.6px; line-height:1.3; }
.embedded .card .sub { font-size:16px; line-height:1.65; margin-top:10px; }
.embedded .field-label { font-size:14px; margin-top:20px; }
.embedded .field, .embedded .addr-preview input { font-size:16px; padding:13px 14px; }
.embedded .addr-preview .suffix { font-size:16px; padding:13px 14px 13px 0; }
.embedded .btn-primary { padding:15px 18px; font-size:16px; margin-top:18px; }
.embedded .btn-secondary { font-size:15px; }
.embedded .captcha-box { padding:12px 14px; margin-top:16px; }
.embedded .stepper { margin-bottom:20px; }
.embedded .field-error { font-size:14px; line-height:1.6; }
.embedded .quota-line, .embedded .avail-msg { font-size:14px; }
.embedded .verify-state { font-size:15px; }
.embedded .success-icon { width:60px; height:60px; }
.embedded .sub.mono { font-size:16px !important; overflow-wrap:anywhere; }
@media(max-width:600px) { .embedded .wizard-wrap { padding:18px 20px 24px; } .embedded .card h2 { font-size:25px; } }

.embedded .captcha-box label { font-size:15px; }
.embedded .dns-table { font-size:14px; }
.embedded .dns-val { font-size:13px; }
.embedded .dns-note { font-size:14px; }
.embedded .recovery-chip span { font-size:14px; }

.stepper { display:block; }
.stepper[hidden] { display:none; }
.step-summary { font-size:15px; font-weight:800; color:var(--blue); margin-bottom:18px; }
.wizard-back { display:inline-flex; margin-top:22px; border:0; border-radius:9px; padding:10px 0; background:transparent; color:var(--blue); font-family:inherit; font-size:14px; font-weight:700; cursor:pointer; }
.wizard-back[hidden] { display:none; }
.embedded .stepper { padding-bottom:24px; margin-bottom:24px; border-bottom:1px solid var(--line); }
.step h2:focus { outline:none; }


.password-options { display:flex; align-items:center; gap:9px; margin-top:14px; }
.password-options input { width:18px; height:18px; margin:0; accent-color:var(--blue); cursor:pointer; }
.password-options label { font-size:14px; color:var(--ink-soft); cursor:pointer; }
.password-error:empty { display:none; }
.field[aria-invalid='true'] { border-color:var(--red); }


.step-summary { margin-bottom:0; font-size:14px; }
.embedded .stepper { padding-bottom:12px; margin-bottom:18px; }
@media(max-width:375px) { .embedded .wizard-wrap { padding:12px 16px 18px; } .embedded .card h2 { font-size:23px; } }

.recovery-codes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:22px; }
.recovery-codes code { padding:12px 8px; border:1px solid var(--line); border-radius:9px; background:#f7faff; text-align:center; font-family:'JetBrains Mono',monospace; font-size:14px; user-select:all; }
.recovery-confirm { display:flex; align-items:flex-start; gap:10px; margin-top:20px; }
.recovery-confirm input { width:20px; height:20px; flex-shrink:0; margin:2px 0 0; accent-color:var(--blue); }
.recovery-confirm label { font-size:15px; line-height:1.6; cursor:pointer; }
.recovery-copy-status { font-size:13px; line-height:1.6; color:var(--green-deep); }
@media(max-width:375px) { .recovery-codes { gap:8px; } .recovery-codes code { font-size:12px; } }

.admin-highlight { color:var(--blue); }
.admin-help { margin-top:8px; font-size:13px; }
.admin-help summary { color:var(--blue); cursor:pointer; font-weight:700; width:fit-content; }
.admin-help p { margin:10px 0 0; padding:12px 14px; border-radius:10px; background:var(--blue-soft); color:var(--ink-soft); font-size:14px; line-height:1.65; }

.dns-copy-help { font-size:13px; color:var(--ink-soft); margin-top:16px; }
.dns-table-wrap { margin-top:14px; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.dns-simple-table { width:100%; table-layout:fixed; border-collapse:collapse; }
.dns-simple-table th { text-align:left; padding:10px 6px; font-size:11px; color:var(--ink-soft); background:#f7faff; }
.dns-simple-table th:nth-child(1) { width:17%; }
.dns-simple-table th:nth-child(2) { width:24%; }
.dns-simple-table th:nth-child(3) { width:12%; }
.dns-simple-table th:nth-child(4) { width:47%; }
.dns-simple-table td { padding:8px 4px; border-top:1px solid var(--line); vertical-align:top; font-size:13px; color:var(--ink-soft); }
.dns-copy-value { display:block; width:100%; min-width:0; margin:0; padding:4px 2px; resize:none; border:0; border-radius:4px; background:transparent; color:var(--ink); font-family:monospace; font-size:14px; line-height:1.5; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-all; -webkit-user-select:text; user-select:text; cursor:text; }
.dns-copy-value:focus { outline:2px solid var(--blue); background:var(--blue-soft); }
@media(max-width:600px) { .dns-copy-value { font-size:16px; } }

.dns-simple-table .dns-record-type { font-family:inherit; font-size:12px; font-weight:700; color:var(--ink); padding-top:12px; }

.dns-simple-table td { position:relative; }
.dns-copy-hint { position:absolute; left:2px; right:2px; bottom:2px; z-index:1; padding:4px; border-radius:5px; background:var(--green-deep); color:white; font:600 11px/1.4 'Plus Jakarta Sans',sans-serif; text-align:center; pointer-events:none; }
.dns-copy-hint[hidden] { display:none; }

.dns-simple-table tr.dns-row-ok { outline:2px solid var(--green); outline-offset:-2px; background:#f4fcf7; }
.dns-simple-table tr.dns-row-error { outline:2px solid var(--red); outline-offset:-2px; background:#fff5f4; }
.dns-simple-table tr.dns-row-checking { outline:2px solid var(--blue); outline-offset:-2px; background:var(--blue-soft); }
.dns-row-status { display:block; margin-top:6px; font-size:10px; font-weight:700; line-height:1.5; overflow-wrap:anywhere; }
.dns-row-ok .dns-row-status { color:var(--green-deep); }
.dns-row-error .dns-row-status { color:var(--red); }
.dns-row-checking .dns-row-status { color:var(--blue); }
.dns-row-error { margin:8px 2px 2px; color:var(--red); font-size:12px; line-height:1.6; }
.verify-state.error { color:var(--red); background:var(--red-soft); }


.verify-state[hidden] { display:none; }
