:root {
    --bg: #0b1020;
    --panel: #111827;
    --panel-2: #182235;
    --panel-3: #0f172a;
    --text: #eef2ff;
    --muted: #9ca7bb;
    --accent: #4ea1ff;
    --accent-2: #7c6cff;
    --danger: #ef6b7a;
    --success: #36d399;
    --border: rgba(255,255,255,.09);
    --shadow: 0 18px 50px rgba(0,0,0,.22);
}
* { box-sizing: border-box; }
html { background: var(--bg); }
body {
    margin:0; font-family:Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif;
    background: radial-gradient(circle at 20% 0%, rgba(78,161,255,.08), transparent 30%),
                linear-gradient(180deg, #0a1020, var(--bg));
    color:var(--text);
}
a { color:#a9d3ff; text-decoration:none; }
a:hover { text-decoration:underline; }
.topbar {
    display:flex; justify-content:space-between; align-items:center; gap:20px;
    padding:15px 24px; border-bottom:1px solid var(--border);
    background:rgba(10,16,32,.88); position:sticky; top:0; z-index:10;
    backdrop-filter:blur(16px);
}
.brand { font-weight:800; letter-spacing:.2px; color:#fff; }
.nav { display:flex; align-items:center; gap:16px; }
.nav-user { color:var(--muted); }
.container { max-width:1320px; margin:0 auto; padding:28px 22px 60px; }
.hero-card,.page-head,.card,.stat-card {
    background:rgba(17,24,39,.9); border:1px solid var(--border); border-radius:18px; box-shadow:var(--shadow);
}
.hero-card { display:flex; justify-content:space-between; gap:24px; align-items:center; padding:28px; }
.page-head { padding:26px; margin-bottom:18px; }
.card { padding:20px; }
.stats-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:16px; }
.stat-card { padding:18px; display:flex; flex-direction:column; gap:6px; }
.stat-label,.eyebrow { color:var(--muted); text-transform:uppercase; letter-spacing:.12em; font-size:12px; }
.muted { color:var(--muted); }
h1,h2 { margin:4px 0 8px; }
h1 { font-size:34px; }
h2 { font-size:20px; }
.button,.button-link {
    display:inline-flex; align-items:center; justify-content:center; min-height:42px;
    border:1px solid rgba(255,255,255,.1); border-radius:12px;
    padding:10px 15px; font:inherit; font-weight:750; cursor:pointer;
    background:linear-gradient(135deg, #4ea1ff, #7c6cff); color:white; text-decoration:none;
}
.button:hover,.button-link:hover { text-decoration:none; filter:brightness(1.05); }
.button.secondary { background:transparent; }
.button.small { min-height:34px; padding:7px 10px; font-size:13px; }
.link-btn { border:0; background:none; color:#a9d3ff; padding:0; cursor:pointer; font:inherit; }
.danger-text { color:var(--danger); }
.toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; gap:18px; margin-bottom:16px; }
.toolbar-group { display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end; }
label { display:grid; gap:7px; color:var(--muted); font-size:13px; }
input,select,textarea {
    width:100%; border:1px solid var(--border); border-radius:11px;
    background:var(--panel-2); color:var(--text); padding:11px 12px; font:inherit;
}
textarea { resize:vertical; }
.workspace-grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:16px; margin-bottom:16px; }
.section-head { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; margin-bottom:14px; }
.compact-form,.preference-form { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.compact-form .button { align-self:end; }
.preference-form { grid-template-columns:repeat(2,minmax(0,1fr)); }
.preference-form .full { grid-column:1/-1; }
.weekday-picker { display:flex; flex-wrap:wrap; gap:8px; }
.weekday-check { display:flex; align-items:center; gap:6px; background:var(--panel-2); border:1px solid var(--border); border-radius:10px; padding:8px 10px; color:var(--text); }
.weekday-check input { width:auto; }
.table-wrap { overflow:auto; margin-top:14px; }
table { width:100%; border-collapse:collapse; min-width:620px; }
th,td { padding:11px 10px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top; }
th { color:var(--muted); font-size:12px; font-weight:700; text-transform:uppercase; }
.shift-list,.coverage-items { display:flex; flex-wrap:wrap; gap:8px; }
.shift-chip { display:flex; flex-direction:column; gap:2px; border:1px solid var(--border); border-radius:10px; padding:8px 10px; background:var(--panel-3); min-width:145px; }
.shift-chip span { color:var(--muted); font-size:12px; }
.coverage-line { min-width:190px; display:grid; grid-template-columns:85px 45px 1fr; align-items:center; gap:8px; }
.mini-meter { height:7px; background:#2b3447; border-radius:999px; overflow:hidden; }
.mini-meter i { display:block; height:100%; background:linear-gradient(90deg, var(--accent), var(--accent-2)); border-radius:inherit; }
.summary-badge { border:1px solid var(--border); background:var(--panel-2); color:#b7d7ff; padding:8px 12px; border-radius:10px; white-space:nowrap; }
.coverage-bar { height:10px; border-radius:999px; background:#20283a; overflow:hidden; margin:0 0 16px; position:relative; }
.coverage-bar::after { content:""; display:block; height:100%; width:var(--coverage,0%); background:linear-gradient(90deg, #36d399, #4ea1ff); }
.alert { margin:0 0 14px; border-radius:12px; padding:12px 14px; }
.alert-success { background:rgba(54,211,153,.09); border:1px solid rgba(54,211,153,.25); }
.alert-error { background:rgba(239,107,122,.1); border:1px solid rgba(239,107,122,.25); }
#schedule-app .card { min-width:0; }
@media (max-width: 980px) {
    .workspace-grid { grid-template-columns:1fr; }
    .compact-form { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .hero-card { flex-direction:column; align-items:flex-start; }
}
@media (max-width: 680px) {
    .container { padding:16px 12px 40px; }
    .topbar { padding:12px 14px; }
    .nav { gap:9px; flex-wrap:wrap; justify-content:flex-end; }
    h1 { font-size:28px; }
    .stats-grid,.compact-form,.preference-form { grid-template-columns:1fr; }
    .preference-form .full { grid-column:auto; }
    .toolbar-group { width:100%; }
}