:root {
  --admin-primary: #0f172a;
  --admin-primary-hover: #1e293b;
  --admin-accent: #2563eb;
  --admin-accent-hover: #1d4ed8;
  --admin-danger: #dc2626;
  --admin-success: #16a34a;
  --admin-warning: #d97706;

  --admin-bg: #f8fafc;
  --admin-surface: #ffffff;
  --admin-border: #e2e8f0;

  --admin-text: #0f172a;
  --admin-text-muted: #64748b;

  --admin-sidebar-w: 240px;
  --admin-topbar-h: 56px;
  --admin-radius: 8px;
  --admin-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

html, body { height: 100%; margin: 0; font-family: system-ui, -apple-system, sans-serif; }

.admin-shell { display: grid; grid-template-columns: var(--admin-sidebar-w) 1fr; min-height: 100vh; }
.admin-shell__main { display: flex; flex-direction: column; }

.admin-sidebar { background: var(--admin-primary); color: #fff; padding: 16px 0; }
.admin-sidebar__brand { padding: 0 20px 20px; font-weight: 700; font-size: 18px; }
.admin-sidebar__item { display: block; padding: 10px 20px; color: #cbd5e1; text-decoration: none; }
.admin-sidebar__item:hover, .admin-sidebar__item--active { background: var(--admin-primary-hover); color: #fff; }
.admin-sidebar__group { font-size: 11px; text-transform: uppercase; color: #64748b; padding: 16px 20px 6px; letter-spacing: 0.05em; }

.admin-topbar { height: var(--admin-topbar-h); border-bottom: 1px solid var(--admin-border); background: var(--admin-surface); display: flex; align-items: center; padding: 0 24px; gap: 16px; }

.admin-content { padding: 24px; flex: 1; }

.admin-card { background: var(--admin-surface); border: 1px solid var(--admin-border); border-radius: var(--admin-radius); padding: 20px; box-shadow: var(--admin-shadow); }

.admin-btn { padding: 8px 16px; border-radius: var(--admin-radius); border: none; cursor: pointer; font-weight: 500; }
.admin-btn--primary { background: var(--admin-accent); color: #fff; }
.admin-btn--primary:hover { background: var(--admin-accent-hover); }
.admin-btn--ghost { background: transparent; color: var(--admin-text); border: 1px solid var(--admin-border); }

.admin-login { display: grid; place-items: center; min-height: 100vh; background: var(--admin-bg); }
.admin-login__card { width: 100%; max-width: 400px; padding: 32px; }
.admin-login__title { font-size: 24px; font-weight: 700; margin: 0 0 8px; }
.admin-login__sub { color: var(--admin-text-muted); margin: 0 0 24px; font-size: 14px; }
.admin-login__input { width: 100%; padding: 10px 12px; border: 1px solid var(--admin-border); border-radius: var(--admin-radius); margin-bottom: 12px; font-size: 14px; }
.admin-login__btn { width: 100%; padding: 12px; font-size: 14px; margin-bottom: 8px; }