:root {
  --bg: #141719;
  --bg-2: #191d20;
  --panel: rgba(35, 41, 45, .64);
  --panel-solid: #20262a;
  --border: rgba(225, 237, 247, .1);
  --border-strong: rgba(225, 237, 247, .21);
  --muted: #acb6bf;
  --faint: #929fa9;
  --good: #78dbb0;
  --blue: #83baff;
  --bad: #ff9c95;
}
body { background: var(--bg); }
button, input, select, textarea { font-family: var(--font); }
button { transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease; }
button:active:not(:disabled) { translate: 0 1px; }
.sidebar { background: rgba(26,31,34,.88); box-shadow: inset -1px 0 rgba(255,255,255,.02); backdrop-filter: blur(24px); }
.brand { min-height: 46px; }
.brand-name { font-size: 23px; font-weight: 800; }
.brand-subtitle { display: none; }
.brand-mark { background: #daa520; box-shadow: inset 0 1px rgba(255,255,255,.4), 0 4px 14px #0003; }
.nav { overflow-y: auto; min-height: 0; scrollbar-width: thin; }
.nav-button { min-height: 40px; font-size: 12px; font-weight: 550; }
.nav-button:hover { background: #ffffff07; }
.nav-button.active { background: #daa52016; box-shadow: inset 2px 0 var(--accent), inset 0 1px #ffffff04; }
.nav-button svg, .settings-button svg { width: 19px; height: 19px; flex-shrink: 0; }
.topbar { background: rgba(20,24,27,.82); backdrop-filter: blur(28px) saturate(115%); box-shadow: 0 6px 20px #0000000a; }
.primary-button { background: #daa520; border-color: #edbe48; box-shadow: inset 0 1px #fff4, 0 3px 12px #0002; }
.primary-button:hover { background: #e8b73a; box-shadow: inset 0 1px #fff5, 0 3px 16px #daa52018; }
.ghost-button, .icon-button { background: rgba(232,242,248,.03); box-shadow: inset 0 1px #ffffff05; }
.ghost-button:hover, .icon-button:hover { border-color: var(--border-strong); background: #ffffff0a; }
.summary-grid, .data-grid, .itr-register-card, .access-card, .project-card, .planning-proposal-card {
  background: rgba(37,44,48,.58); border-color: var(--border); box-shadow: inset 0 1px rgba(255,255,255,.04);
  backdrop-filter: blur(16px) saturate(110%);
}
.summary-grid, .data-grid, .itr-register-card, .access-card, .project-card, .planning-proposal-card {
  background-image: linear-gradient(125deg, rgba(239,248,255,.025), transparent 55%);
}
.grid-header { background: #ffffff03; }
.grid-row:hover { transition: background-color 160ms ease; }
.input-shell, .select-shell, .toggle-pill { background: rgba(30,36,40,.75); }
.input-shell input, .select-shell select { background: transparent; }
.tabs { gap: 4px; }
.tab { border-radius: 5px; }
.badge { border-color: #ffffff10; }
.modal, .auth-card { background: rgba(31,37,41,.93); backdrop-filter: blur(30px) saturate(115%); box-shadow: inset 0 1px #ffffff10, 0 30px 100px #0007; }
.modal-backdrop { backdrop-filter: blur(8px); }
.view.active { animation: lf-enter 220ms ease-out; }
.auth-card { animation: lf-enter 260ms ease-out; }
body[data-section="planning2"] .topbar [data-sync-1c], body[data-section="planning2"] .topbar [data-add-employee] { display: none; }
body[data-section="planning2"] .topbar h2 { font-size: 24px; }
@keyframes lf-enter { from { opacity: .4; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@media (min-width: 1800px) { .view { padding-inline: 32px; } .topbar { padding-inline: 32px; } }
@media (max-width: 860px) { .sidebar { z-index: 35; } body[data-section="planning2"] .topbar h2 { font-size: 19px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }