:root {
  color-scheme: light;
  --z-page: #ffffff;
  --z-sidebar: #f7f7f8;
  --z-surface: #ffffff;
  --z-surface-subtle: #f7f7f7;
  --z-surface-hover: #f1f1f1;
  --z-text: #171717;
  --z-text-secondary: #5f5f5f;
  --z-text-tertiary: #8a8a8a;
  --z-line: #e6e6e6;
  --z-line-strong: #d8d8d8;
  --z-control: #eeeeee;
  --z-accent: #171717;
  --z-action-start: #a85f6d;
  --z-action-mid: #7863a8;
  --z-action-end: #4f6fbd;
  --z-action-gradient: linear-gradient(118deg, var(--z-action-start) 0%, var(--z-action-mid) 52%, var(--z-action-end) 100%);
  --z-action-gradient-hover: linear-gradient(118deg, #965361 0%, #6e599d 52%, #4563ac 100%);
  --z-action-shadow: 0 5px 15px rgba(91, 84, 159, 0.2), 0 1px 3px rgba(168, 95, 109, 0.12);
  --z-danger: #c23838;
  --z-radius-sm: 6px;
  --z-radius-md: 9px;
  --z-radius-lg: 12px;
  --z-shadow-menu: 0 12px 34px rgba(0, 0, 0, 0.11), 0 2px 7px rgba(0, 0, 0, 0.04);
  --z-shadow-float: 0 16px 42px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.03);
  --z-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

*, *::before, *::after { box-sizing: border-box; }

html body [hidden] { display: none !important; }

html {
  background: var(--z-page);
  color: var(--z-text);
  font-family: "Google Sans", "Segoe UI", Arial, sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

body {
  margin: 0;
  background: var(--z-page);
  color: var(--z-text);
  -webkit-font-smoothing: antialiased;
}

button, input, textarea, select { font: inherit; letter-spacing: 0; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { text-underline-offset: 3px; }

button:focus, input:focus, textarea:focus, select:focus { outline: none; }
:where(button, a, input, textarea, select):focus-visible {
  outline: 2px solid rgba(23, 23, 23, 0.58);
  outline-offset: 2px;
}

::selection { background: #dcdcdc; color: #111; }

* { scrollbar-width: thin; scrollbar-color: #c8c8c8 transparent; }
*::-webkit-scrollbar { width: 7px; height: 7px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { border: 2px solid transparent; border-radius: 10px; background: #c8c8c8; background-clip: padding-box; }
*::-webkit-scrollbar-thumb:hover { background: #a9a9a9; background-clip: padding-box; }

.material-symbols-rounded {
  font-variation-settings: "FILL" 0, "wght" 380, "GRAD" 0, "opsz" 20;
}

@media (prefers-reduced-motion: no-preference) {
  button, a, input, textarea, select { transition: background-color 150ms var(--z-ease), border-color 150ms var(--z-ease), color 150ms var(--z-ease), opacity 150ms var(--z-ease), transform 180ms var(--z-ease); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
}
 
