:root{
 --bg:linear-gradient(135deg,#020617,#0f172a);
 --glass:rgba(255,255,255,.08);
 --border:rgba(255,255,255,.18);
 --primary:#38bdf8;
 --danger:#ef4444;
 --text:#e5e7eb;
 --muted:#94a3b8;
}

*{box-sizing:border-box}

body{
 margin:0;
 font-family:Inter,Segoe UI,sans-serif;
 background:var(--bg);
 color:var(--text);
}

#app{
 max-width:1400px;
 margin:auto;
 padding:40px;
}

.hidden{display:none}

.card{
 background:var(--glass);
 backdrop-filter:blur(18px);
 border:1px solid var(--border);
 border-radius:22px;
 padding:28px;
 margin-bottom:28px;
 box-shadow:0 30px 80px rgba(0,0,0,.55);
}

h1{
 font-size:40px;
 background:linear-gradient(90deg,#38bdf8,#818cf8);
 -webkit-background-clip:text;
 -webkit-text-fill-color:transparent;
}

.subtitle{color:var(--muted)}

input,select,textarea{
 width:100%;
 padding:14px;
 margin:8px 0;
 border-radius:14px;
 background:rgba(255,255,255,.06);
 border:1px solid var(--border);
 color:var(--text);
}

button{
 padding:14px 24px;
 border-radius:18px;
 border:none;
 cursor:pointer;
 font-weight:700;
 background:linear-gradient(135deg,#38bdf8,#818cf8);
}

button.secondary{background:#475569}
button.danger{background:linear-gradient(135deg,#ef4444,#b91c1c)}

.actions{
 display:flex;
 gap:14px;
 flex-wrap:wrap;
 margin:18px 0;
}

.profile{
 display:flex;
 gap:20px;
 align-items:center;
 background:linear-gradient(135deg,#0ea5e9,#6366f1);
}

.profile img{
 width:90px;
 height:90px;
 border-radius:50%;
 border:4px solid #fff;
 object-fit:cover;
}

.summary-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
 gap:18px;
}

table{
 width:100%;
 border-collapse:collapse;
 margin-top:20px;
}

th,td{
 padding:12px;
 border-bottom:1px solid var(--border);
 text-align:left;
}

.leader-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
 gap:18px;
}

.leader-card{
 text-align:center;
 cursor:pointer;
}

.leader-card img{
 width:80px;
 height:80px;
 border-radius:50%;
 border:3px solid var(--primary);
 margin-bottom:10px;
}