/* public/style.css — Premium theme (same as earlier) */
:root{
  --bg: #0f1724;
  --card: rgba(255,255,255,0.04);
  --muted: #9aa4b2;
  --glass: rgba(255,255,255,0.03);
  --accent: #7c3aed;
  --accent-2: #06b6d4;
  --radius: 14px;
  --max-width: 1100px;
  --glass-border: rgba(255,255,255,0.05);
  --easing: cubic-bezier(.2,.9,.3,1);
  --shadow-1: 0 6px 18px rgba(2,6,23,0.6);
  --shadow-2: 0 10px 40px rgba(2,6,23,0.7);
  --text: #e6eef8;
  --muted-2: #9fb1c9;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  background:
    radial-gradient(1200px 600px at 10% 10%, rgba(124,58,237,0.07), transparent 8%),
    radial-gradient(800px 400px at 90% 90%, rgba(6,182,212,0.03), transparent 6%),
    var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.5;
  padding:36px 20px;
}
.container { max-width: var(--max-width); margin: 0 auto; padding: 28px; }
.header { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:28px; }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--text); }
.logo { width:46px; height:46px; border-radius:10px; background: linear-gradient(135deg, var(--accent), var(--accent-2)); box-shadow: 0 4px 18px rgba(124,58,237,0.18); display:flex; align-items:center; justify-content:center; font-weight:800; color:white; }
.brand h1 { font-size:18px; margin:0; letter-spacing:0.2px; }
.brand p { margin:0; font-size:12px; color:var(--muted); }
.card { background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01)); border-radius: var(--radius); padding:20px; box-shadow: var(--shadow-1); border: 1px solid var(--glass-border); }
.form { display:block; }
label { display:block; font-size:13px; color:var(--muted); margin-bottom:6px; }
.input, textarea, select { width:100%; padding:12px 14px; border-radius:10px; background:var(--glass); border: 1px solid rgba(255,255,255,0.03); color:var(--text); outline: none; transition: border .18s var(--easing), transform .18s var(--easing); box-shadow: none; font-size:14px; }
.input:focus, textarea:focus, select:focus { border-color: rgba(124,58,237,0.7); transform: translateY(-1px); box-shadow: 0 6px 22px rgba(2,6,23,0.6); }
textarea { min-height:120px; resize:vertical; }
.btn { display:inline-flex; align-items:center; gap:10px; padding:10px 16px; border-radius:12px; cursor:pointer; border:none; background: linear-gradient(90deg,var(--accent),var(--accent-2)); color:white; font-weight:600; box-shadow: 0 8px 30px rgba(124,58,237,0.18); transition: transform .12s ease, box-shadow .12s ease; }
.btn:active { transform: translateY(1px) scale(.995); box-shadow: 0 6px 20px rgba(2,6,23,0.45); }
.btn.ghost { background: transparent; border: 1px solid rgba(255,255,255,0.06); color:var(--text); }
.table { width:100%; border-collapse:collapse; margin-top:12px; }
.table th, .table td { text-align:left; padding:12px 14px; font-size:14px; border-bottom:1px solid rgba(255,255,255,0.03); color:var(--muted-2); }
.table th { font-size:12px; text-transform:uppercase; color:var(--muted); letter-spacing:0.6px; }
.action-link { color:var(--accent); text-decoration:none; font-weight:600; margin-right:10px; }
.delete-btn { background:transparent; border:none; color:#ff6b6b; cursor:pointer; }
.invite-wrap { display:grid; grid-template-columns: 1fr; gap:20px; align-items:start; }
.invite-hero { border-radius:12px; overflow:hidden; position:relative; min-height:320px; display:flex; align-items:center; justify-content:center; text-align:center; padding:36px; background: linear-gradient(180deg, rgba(0,0,0,0.12), rgba(255,255,255,0.02)); box-shadow: var(--shadow-2); border:1px solid rgba(255,255,255,0.03); }
.invite-hero .title { font-size:36px; line-height:1.02; margin:0 0 6px 0; font-weight:700; color:var(--text); }
.invite-hero .subtitle { margin:0; color:var(--muted-2); font-size:16px; }
.cover { width:100%; height:320px; background-size:cover; background-position:center; border-radius:12px; margin-bottom:6px; box-shadow: 0 18px 40px rgba(2,6,23,0.7); }
.invite-info { display:grid; grid-template-columns: repeat(3,1fr); gap:14px; margin-top:12px; }
.meta-card { background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01)); padding:14px; border-radius:12px; border: 1px solid rgba(255,255,255,0.03); }
.meta-card h4 { margin:0 0 6px 0; color:var(--muted); font-size:12px; }
.meta-card p { margin:0; font-size:15px; color:var(--text); font-weight:600; }
.invite-message { margin-top:18px; font-size:16px; color:var(--muted-2); line-height:1.6; background: linear-gradient(180deg, rgba(255,255,255,0.01), transparent); padding:18px; border-radius:12px; border:1px solid rgba(255,255,255,0.02); }
.grid-2 { display:grid; grid-template-columns: 1fr 360px; gap:20px; }
@media (max-width:900px) { .grid-2 { grid-template-columns: 1fr; } .invite-info { grid-template-columns: 1fr; } .invite-hero { min-height:220px; padding:22px; } }
.kicker { font-size:13px; color:var(--muted); text-transform:uppercase; letter-spacing:1px; }
.small { font-size:13px; color:var(--muted); }
.fade-up { transform: translateY(6px); opacity:0; animation:fadeUp .6s ease forwards; }
@keyframes fadeUp { to { transform:none; opacity:1 } }
.table-wrap { overflow:auto; border-radius:10px; }
.footer { margin-top:28px; color:var(--muted); font-size:13px; text-align:center; }
.mt-8 { margin-top:8px } .mt-12 { margin-top:12px } .mb-12 { margin-bottom:12px }
a { color:var(--accent); text-decoration:none; } a:hover { text-decoration:underline }
.badge { display:inline-block; padding:6px 10px; border-radius:999px; font-size:12px; background: rgba(255,255,255,0.03); color:var(--muted-2); }
.row { display:flex; gap:12px; } .row .col { flex:1; }