:root{
  --bg:#0a0e14; --panel:#0f141d; --panel2:#111823; --border:#1f2b3a; --border2:#2b3b50;
  --text:#c7d4e0; --muted:#6b7d92; --dim:#47586c;
  --accent:#36d0c4; --accent2:#5ef0e4; --accent-soft:rgba(54,208,196,.12);
  --ok:#49d17a; --warn:#e8b64a; --err:#f06a5e; --red-soft:rgba(240,106,94,.12);
  --radius:4px; --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}
*{box-sizing:border-box;}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--mono);font-size:14px;line-height:1.5;
  background-image:linear-gradient(rgba(54,208,196,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(54,208,196,.025) 1px,transparent 1px);
  background-size:38px 38px;}
a{color:var(--accent);text-decoration:none;}
a:hover{color:var(--accent2);}
::selection{background:var(--accent-soft);}

/* topbar */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 18px;border-bottom:1px solid var(--border);background:rgba(10,14,20,.9);position:sticky;top:0;z-index:50;backdrop-filter:blur(6px);flex-wrap:wrap;}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--text);}
.brand .dot{width:9px;height:9px;border-radius:2px;background:var(--accent);box-shadow:0 0 10px var(--accent);}
.brand small{color:var(--dim);font-weight:400;letter-spacing:0;text-transform:none;}
.nav{display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.nav a{padding:6px 12px;border:1px solid transparent;border-radius:var(--radius);color:var(--muted);text-transform:uppercase;font-size:12px;letter-spacing:.5px;}
.nav a:hover,.nav a.active{color:var(--text);border-color:var(--border2);background:var(--panel);}
.chip{font-size:11px;padding:4px 10px;border-radius:20px;border:1px solid var(--border2);color:var(--muted);text-transform:uppercase;letter-spacing:.5px;}
.chip.ok{color:var(--ok);border-color:rgba(73,209,122,.4);}
.chip.err{color:var(--err);border-color:rgba(240,106,94,.4);}

.container{max-width:1080px;margin:0 auto;padding:26px 18px 70px;}

/* panels */
.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:16px;}
.panel-h{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--border);color:var(--muted);text-transform:uppercase;font-size:12px;letter-spacing:1px;}
.panel-h .tag{color:var(--dim);font-size:11px;}
.panel-b{padding:16px;}
.grid{display:grid;gap:16px;}
.grid.c2{grid-template-columns:1fr 1fr;}
.grid.c3{grid-template-columns:repeat(3,1fr);}
@media(max-width:760px){.grid.c2,.grid.c3{grid-template-columns:1fr;}}

/* hero / headings */
.kicker{color:var(--accent);text-transform:uppercase;letter-spacing:2px;font-size:12px;}
h1,h2,h3{font-weight:700;letter-spacing:.5px;color:#eaf2f7;margin:.2em 0;}
h1{font-size:2rem;text-transform:uppercase;}
.lead{color:var(--muted);max-width:620px;}
.big-num{font-size:3.4rem;font-weight:800;color:var(--border2);line-height:1;}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:var(--radius);border:1px solid var(--border2);background:var(--panel2);color:var(--text);font-family:var(--mono);font-size:13px;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;transition:.15s;}
.btn:hover{border-color:var(--accent);color:var(--accent2);}
.btn-primary{background:var(--accent);border-color:var(--accent);color:#04201d;font-weight:700;}
.btn-primary:hover{background:var(--accent2);color:#04201d;}
.btn-block{width:100%;justify-content:center;}
.btn-lg{padding:13px 22px;font-size:14px;}

/* forms */
label{display:block;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;}
input,select,textarea{width:100%;padding:11px 12px;background:#0b1118;border:1px solid var(--border2);border-radius:var(--radius);color:var(--text);font-family:var(--mono);font-size:14px;margin-bottom:14px;}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft);}
.hint{color:var(--dim);font-size:12px;}

/* table */
table{width:100%;border-collapse:collapse;font-size:13px;}
th,td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--border);}
th{color:var(--muted);text-transform:uppercase;font-size:11px;letter-spacing:.5px;}
tr:hover td{background:var(--panel2);}
.sts{font-size:11px;padding:2px 8px;border-radius:3px;text-transform:uppercase;}
.sts.run{color:var(--ok);background:rgba(73,209,122,.12);}
.sts.stp{color:var(--err);background:var(--red-soft);}
.sts.idl{color:var(--muted);background:var(--panel2);}

/* plans */
.plan{border:1px solid var(--border2);border-radius:var(--radius);padding:20px;background:var(--panel);display:flex;flex-direction:column;gap:10px;position:relative;transition:.15s;}
.plan:hover{border-color:var(--accent);}
.plan .price{font-size:2.2rem;font-weight:800;color:var(--accent2);}
.plan .price small{font-size:.9rem;color:var(--muted);font-weight:400;}
.plan .pname{text-transform:uppercase;letter-spacing:1px;color:var(--muted);}
.plan ul{list-style:none;padding:0;margin:4px 0;color:var(--muted);font-size:13px;}
.plan li::before{content:"› ";color:var(--accent);}

/* alerts */
.alert{padding:11px 14px;border-radius:var(--radius);margin-bottom:14px;font-size:13px;border:1px solid var(--border2);}
.alert.err{color:var(--err);border-color:rgba(240,106,94,.4);background:var(--red-soft);}
.alert.ok{color:var(--ok);border-color:rgba(73,209,122,.4);background:rgba(73,209,122,.1);}
.alert.warn{color:var(--warn);border-color:rgba(232,182,74,.4);background:rgba(232,182,74,.1);}

/* auth card */
.auth{max-width:400px;margin:60px auto;}
.center{text-align:center;}
.muted{color:var(--muted);}
.mono-accent{color:var(--accent);}
.footer{border-top:1px solid var(--border);color:var(--dim);text-align:center;padding:18px;font-size:12px;}

/* MP / pago */
.mp-box{border:1px solid var(--border2);border-radius:var(--radius);padding:16px;background:var(--panel2);}
#mpBrick_container{min-height:60px;margin-top:10px;}
.mp-msg{margin-top:10px;padding:10px 12px;border-radius:var(--radius);font-size:13px;}
.mp-msg.ok{color:var(--ok);background:rgba(73,209,122,.1);border:1px solid rgba(73,209,122,.4);}
.mp-msg.err{color:var(--err);background:var(--red-soft);border:1px solid rgba(240,106,94,.4);}

/* overlay pago */
.pay-ov{position:fixed;inset:0;background:rgba(4,7,11,.9);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;z-index:9999;padding:16px;}
.pay-ov.show{display:flex;animation:fade .3s;}
@keyframes fade{from{opacity:0}to{opacity:1}}
.pay-card{background:var(--panel);border:1px solid var(--accent);border-radius:var(--radius);padding:30px 26px;max-width:360px;width:100%;text-align:center;box-shadow:0 0 50px rgba(54,208,196,.25);animation:pop .45s cubic-bezier(.2,.9,.3,1.3);position:relative;overflow:hidden;}
.pay-card.bad{border-color:var(--err);box-shadow:0 0 50px rgba(240,106,94,.25);}
@keyframes pop{from{opacity:0;transform:translateY(16px) scale(.94)}to{opacity:1;transform:none}}
.pay-ic{width:78px;height:78px;border-radius:50%;margin:0 auto 14px;display:flex;align-items:center;justify-content:center;background:var(--accent);box-shadow:0 0 0 7px var(--accent-soft);animation:popIc .5s cubic-bezier(.2,.9,.3,1.6);}
.pay-card.bad .pay-ic{background:var(--err);box-shadow:0 0 0 7px var(--red-soft);}
@keyframes popIc{0%{transform:scale(0)}60%{transform:scale(1.15)}100%{transform:scale(1)}}
.pay-ic svg{stroke-dasharray:40;stroke-dashoffset:40;animation:draw .5s ease .3s forwards;}
@keyframes draw{to{stroke-dashoffset:0}}
.pay-card h3{font-size:1.3rem;margin:.2em 0;}
.pay-card p{color:var(--muted);font-size:13px;}
.pay-conf{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.pay-conf span{position:absolute;top:-12px;width:8px;height:8px;opacity:0;animation:cf linear forwards;}
@keyframes cf{0%{opacity:1;transform:translateY(-12px) rotate(0)}100%{opacity:0;transform:translateY(420px) rotate(600deg)}}