:root{
  --bg:#0f172a; --panel:#0b1224; --panel2:#0a1020;
  --text:#e5e7eb; --muted:#94a3b8; --line:rgba(255,255,255,.1);
  --brand:#60a5fa; --brand2:#22d3ee; --accent:#34d399;
  --radius:16px; --shadow:0 12px 40px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:radial-gradient(900px 300px at -10% -10%,rgba(96,165,250,.15),transparent 60%),linear-gradient(180deg,#0b132b,#0f172a);color:var(--text);font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif}
.container{max-width:980px;margin:0 auto;padding:28px}
.card{background:linear-gradient(180deg,var(--panel),var(--panel2));border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px;display:grid;gap:18px}
.header{display:flex;gap:16px;align-items:center}
.logo{width:60px;height:60px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(180deg,#1e293b,#0f172a);border:1px solid var(--line)}
h1{margin:0;font-size:1.8rem;line-height:1.2}
.role{margin:2px 0 0 0;color:var(--muted)}
.slogan{margin:4px 0 0 0;color:var(--brand);font-weight:700}
.grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
@media (max-width:880px){.grid{grid-template-columns:1fr}}
.block{background:linear-gradient(180deg,#0a0f22,#0f172a);border:1px solid var(--line);border-radius:14px;padding:16px}
.block h2{margin:0 0 8px 0;font-size:1.05rem}
.small{font-size:.92rem;color:var(--muted)}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.btn{display:inline-flex;gap:10px;align-items:center;justify-content:center;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:#0b1224;color:var(--text);text-decoration:none;font-weight:700}
.btn.primary{background:linear-gradient(180deg,#2563eb,#1d4ed8);border-color:transparent}
.btn.ghost{background:transparent}
.badge{font-size:.75rem;color:#0b1224;background:#e5e7eb;border-radius:999px;padding:.2em .6em;font-weight:800}
.qrwrap{display:grid;place-items:center;gap:8px}
.qr{background:white;padding:12px;border-radius:12px;border:1px solid #e5e7eb}
.qr img{width:220px;height:auto;display:block}
.rows{display:grid;gap:8px;margin-top:8px}
.row{display:flex;gap:12px;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.footer{color:var(--muted);text-align:center;margin-top:8px;font-size:.92rem}
hr{border:none;border-top:1px solid var(--line);margin:6px 0}