:root{
  --bg:#0b1118;
  --panel:#0f141b;
  --muted:#8ea0b3;
  --text:#e7edf5;
  --neon:#33b3ff;      /* neon kék */
  --neon2:#5fe1ff;     /* világosabb kék akcentus */
  --danger:#ff5c7a;
  --radius:16px;
  --shadow:0 8px 24px rgba(0,0,0,.45);
}

@media (prefers-color-scheme: dark){ :root{ color-scheme: dark; } }

*{box-sizing:border-box}
html,body{height:100%}
html{font-size:16px} /* >=16px: ne zoomoljon mobilon a fókuszkor */
body{
  margin:0; background:radial-gradient(1200px 800px at 50% -10%, rgba(51,179,255,.12), transparent 60%), var(--bg);
  color:var(--text); font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Noto Sans",Arial,sans-serif;
}

/* Mobil-első konténer */
.container{
  max-width:640px; margin:calc(env(safe-area-inset-top, 12px) + 18px) auto 24px;
  padding:0 14px;
}

/* Kártya */
.card{
  background:linear-gradient(180deg, rgba(51,179,255,.06), transparent 40%), var(--panel);
  border:1px solid rgba(95,225,255,.18);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:18px 16px;
}

/* Cím neon csíkkal */
.h-title{
  font-weight:700; letter-spacing:.2px; margin:6px 4px 14px;
  font-size:1.4rem;
}
.h-title::after{
  content:""; display:block; height:3px; width:64px; margin-top:8px;
  background:linear-gradient(90deg,var(--neon),transparent);
  border-radius:3px;
}

/* Form elemek – nagy tappable */
label{display:block; margin:12px 6px 6px; color:var(--muted); font-size:.95rem}
.input, select, button{
  width:100%; border-radius:12px; border:1px solid rgba(95,225,255,.25);
  background:#0c1218; color:var(--text);
  padding:14px 14px; font-size:1rem; outline:none;
}
.input:focus, select:focus{ border-color:var(--neon); box-shadow:0 0 0 3px rgba(51,179,255,.25); }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:14px; margin-top:10px; font-weight:600; cursor:pointer; user-select:none;
  background:linear-gradient(180deg, rgba(51,179,255,.20), rgba(51,179,255,.05));
  border:1px solid var(--neon); color:var(--text);
}
.btn:hover{ filter:brightness(1.07) }
.btn:active{ transform:translateY(1px) }

/* Lista táblázat – egyszerű, mobilbarát */
.table{ width:100%; border-collapse:separate; border-spacing:0 8px; margin-top:10px }
.tr{ background:var(--panel); border:1px solid rgba(95,225,255,.18); border-radius:12px; overflow:hidden }
.td{ padding:12px 14px; }
.right{ text-align:right }

/* Fejléc sáv */
.topbar{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-bottom:10px;
}
.badge{
  font-size:.85rem; color:var(--muted); padding:6px 10px; border:1px solid rgba(95,225,255,.18);
  border-radius:999px; background:#0c1218;
}

a{color:var(--neon2); text-decoration:none}
a:focus{ outline:2px solid var(--neon); outline-offset:2px }