:root{
  --bg:#0b0f18;
  --panel:rgba(255,255,255,0.06);
  --panel2:rgba(255,255,255,0.09);
  --ink:#e9eefc;
  --muted:rgba(233,238,252,0.72);
  --accent:#7c4dff;
  --accent2:#ff4dd8;
  --border:rgba(255,255,255,0.10);
}
*{box-sizing:border-box}
html,body{height:100%; margin:0; font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;}
body{background: radial-gradient(1200px 800px at 20% 10%, rgba(124,77,255,0.25), transparent 55%),
               radial-gradient(900px 600px at 85% 20%, rgba(255,77,216,0.20), transparent 55%),
               var(--bg);
     color:var(--ink);}
a{color:inherit; text-decoration:none}
#app{height:100%;}
.shell{height:100%; display:flex; flex-direction:column;}
.topbar{
  height:56px; display:flex; align-items:center; justify-content:space-between;
  padding:0 16px; border-bottom:1px solid var(--border);
  background: rgba(0,0,0,0.18); backdrop-filter: blur(10px);
}
.brand{display:flex; gap:10px; align-items:center; font-weight:800; letter-spacing:0.4px;}
.pill{border:1px solid var(--border); background:var(--panel); padding:8px 12px; border-radius:999px; color:var(--muted);}
.main{flex:1; display:flex; align-items:center; justify-content:center; padding:18px;}
.card{
  width:min(980px, 92vw);
  border:1px solid var(--border);
  background: linear-gradient(180deg, var(--panel), rgba(0,0,0,0.10));
  border-radius:18px; padding:18px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.45);
}
.grid{display:grid; grid-template-columns: 1.2fr 0.8fr; gap:16px;}
.h1{font-size:40px; margin:0 0 8px;}
.p{color:var(--muted); margin:0 0 14px; line-height:1.4}
.btn{
  display:inline-flex; align-items:center; gap:10px;
  border:1px solid var(--border);
  background: linear-gradient(90deg, rgba(124,77,255,0.35), rgba(255,77,216,0.25));
  padding:10px 14px; border-radius:14px; font-weight:700;
}
.btn2{
  display:inline-flex; align-items:center; gap:10px;
  border:1px solid var(--border);
  background:var(--panel2);
  padding:10px 14px; border-radius:14px; font-weight:700;
}
.row{display:flex; gap:10px; flex-wrap:wrap;}
.small{font-size:13px; color:var(--muted);}
.kbd{font-family: ui-monospace, SFMono-Regular, Menlo, monospace; padding:2px 6px; border:1px solid var(--border); border-radius:8px; background:rgba(0,0,0,0.25);}