:root{
  --bg:#0a0a0b;
  --card:#121214;
  --muted:#a1a1aa;
  --primary:#fbbf24;
  --primary-2:#facc15;
  --border:#242428;
  --text:#e5e7eb;
  --error:#ef4444;
  --ok:#22c55e;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Arial, Helvetica, "Apple Color Emoji", "Segoe UI Emoji";
  background: radial-gradient(1200px 800px at 50% -20%, rgba(250,204,21,.08), transparent 60%), var(--bg);
  color: var(--text);
}
.wrap{max-width:760px;margin:0 auto;padding:32px 16px}
.head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;margin-bottom:16px}
.logo{width:64px;height:64px;border-radius:16px;border:1px solid var(--border);background:#000;object-fit:contain}
h1{margin:0;font-size:28px;letter-spacing:.3px}
h1 span{background:linear-gradient(90deg,#fde68a,#f59e0b);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{margin:0;color:var(--muted)}
.card{
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,.02)), var(--card);
  border:1px solid var(--border);
  border-radius:16px;
  padding:20px;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}
.grid{display:grid;grid-template-columns:1fr;gap:10px}
.grid-wide{margin-top:6px}
@media (min-width:560px){.grid{grid-template-columns:repeat(3,1fr)}.grid-wide{grid-template-columns:1fr 1fr}}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  width:100%;padding:12px 14px;
  border-radius:10px;border:1px solid var(--border);
  background:#1b1b1f;color:var(--text);
  font-weight:600;cursor:pointer;transition:transform .03s ease, background .15s ease;
}
.btn:hover{background:#202026}
.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--primary);color:#111; border-color: #eab308}
.btn.primary:hover{background:var(--primary-2)}
.btn.outline{background:transparent}
.ico{width:18px;height:18px;object-fit:contain}
.or{display:flex;justify-content:center;margin:12px 0;color:var(--muted)}
.or span{display:inline-block;padding:2px 8px;border:1px dashed var(--border);border-radius:999px}
.status{margin-top:10px;font-size:14px;color:var(--muted);min-height:20px;white-space:pre-wrap}
.error{margin-top:8px;color:var(--error)}
.details{margin-top:14px;color:var(--muted)}
.foot{display:flex;justify-content:center;margin-top:20px}
.link{color:var(--muted);text-decoration:none;border-bottom:1px dotted var(--border)}
.link:hover{color:#fff}