:root{--azul:#0d3577;--azul2:#1b55b8;--bg:#eef2f8;--card:#fff;--txt:#14213d;--mut:#6b7a99;--line:#dbe3f0}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--txt);padding-bottom:env(safe-area-inset-bottom)}
.top{background:var(--azul);padding:22px 16px 56px;text-align:center}
.top img{max-height:64px;max-width:70%}
.top .brand{color:#fff;font-size:26px;font-weight:800;letter-spacing:.3px}
.top p{color:#b9c8e8;margin:6px 0 0;font-size:14px}
.wrap{max-width:480px;margin:-36px auto 32px;padding:0 14px}
.card{background:var(--card);border-radius:16px;padding:18px;box-shadow:0 6px 24px rgba(13,53,119,.12);margin-bottom:14px}
label{display:block;font-size:13px;font-weight:600;color:var(--mut);margin:14px 0 6px}
label:first-child{margin-top:0}
input,select{width:100%;padding:13px 12px;border:1.5px solid var(--line);border-radius:10px;font-size:16px;background:#fff;color:var(--txt)}
input:focus,select:focus{outline:none;border-color:var(--azul2);box-shadow:0 0 0 3px rgba(27,85,184,.15)}
.row{display:flex;gap:10px}.row>div{flex:1}
.res{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.res div{background:#f5f8fd;border-radius:12px;padding:12px}
.res small{display:block;color:var(--mut);font-size:12px}
.res b{font-size:18px}
.res .big{grid-column:1/3;background:var(--azul);color:#fff}
.res .big small{color:#b9c8e8}.res .big b{font-size:28px}
pre{white-space:pre-wrap;word-break:break-word;font-family:inherit;background:#f5f8fd;border-radius:12px;padding:14px;margin:0 0 12px;font-size:15px;line-height:1.5}
.btn{display:block;width:100%;padding:14px;border:0;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;margin-top:10px;text-align:center;text-decoration:none}
.btn.copy{background:var(--azul);color:#fff}.btn.wa{background:#25d366;color:#fff}.btn.sec{background:#e4ebf7;color:var(--azul)}
.btn:focus-visible{outline:3px solid var(--azul2);outline-offset:2px}
.err{color:#c0392b;font-size:14px;margin-top:8px}
.msg-ok{background:#e6f6ed;color:#116b3a;padding:10px 12px;border-radius:10px;margin-bottom:12px;font-size:14px}
.admin{max-width:760px;margin:20px auto;padding:0 14px}
.admin h1{font-size:20px;margin:0}
.bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;gap:10px;flex-wrap:wrap}
.bar a{color:var(--azul);font-weight:600;text-decoration:none;font-size:14px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.grid label{margin:0 0 4px}
.suffix{position:relative}.suffix input{padding-right:30px}.suffix span{position:absolute;right:11px;top:50%;transform:translateY(-50%);color:var(--mut)}