:root{
  --bg:#0f1724; --card:#0f2b39; --accent:#4fb0d9; --text:#e6f6fb; --muted:#9bb6c7;
}
*{box-sizing:border-box}
html,body,#app{height:100%;margin:0}
body{background:linear-gradient(180deg,#08101a,#0f1724);color:var(--text);
     font-family:Inter,ui-sans-serif,system-ui,Segoe UI,Roboto,Arial;}
.header{max-width:1100px;margin:0 auto;padding:18px}
.header h1{margin:0;color:var(--accent);font-weight:600}
.container{max-width:1100px;margin:0 auto;padding:18px}
.card{background:linear-gradient(180deg,rgba(15,43,57,.85),rgba(11,28,36,.85));
      border:1px solid rgba(79,176,217,.08);border-radius:14px;padding:16px;box-shadow:0 8px 30px rgba(0,0,0,.5)}
.grid{display:grid;gap:12px}
a{color:var(--accent)}
button{background:var(--accent);color:#062333;border:none;border-radius:8px;padding:8px 12px;cursor:pointer}
input,textarea{width:100%;background:#0b1f2a;border:1px solid rgba(79,176,217,.2);border-radius:8px;color:var(--text);padding:10px;margin:.3rem 0}
.badge{display:inline-block;background:#0a2230;border:1px solid rgba(79,176,217,.3);
       border-radius:999px;padding:2px 8px;font-size:.8rem;color:var(--muted)}
