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

:root {
  --pink: #e8175d;
  --pink-rgb: 232,23,93;
  --pink-muted: #971040;
  --pink-soft: #f9a8c0;
  --bg: #000000;
  --text: #ffffff;
  --muted: #a0a0a0;
  --scrollbar-thumb: rgba(var(--pink-rgb),0.55);
  --scrollbar-thumb-hover: rgba(var(--pink-rgb),0.85);
  --scrollbar-track: rgba(255,255,255,0.04);

  --ui-blur:         blur(20px);
  --ui-blur-heavy:   blur(28px);
  --ui-blur-overlay: blur(6px);

  --panel-bg:      rgba(10,10,10,0.82);
  --panel-bg-dark: rgba(10,10,10,0.92);
  --overlay-bg:    rgba(0,0,0,0.75);
  --surface-1:     rgba(255,255,255,0.02);
  --surface-2:     rgba(255,255,255,0.04);
  --surface-3:     rgba(255,255,255,0.07);
  --surface-4:     rgba(255,255,255,0.1);
  --border-subtle: rgba(255,255,255,0.07);
  --border-light:  rgba(255,255,255,0.11);

  --ui-danger:      #f28b82;
  --ui-danger-rgb:  242,139,130;
  --ui-success:     #7ec986;
  --ui-success-rgb: 126,201,134;
  --ui-warn:        #f5c542;
  --ui-warn-rgb:    245,197,66;
  --ui-star:        #f5c542;

  --row-0:      #c49de8; --row-0-rgb:     196,157,232;
  --row-1:      #fba865; --row-1-rgb:     251,168,101;
  --row-2:      #f28b82; --row-2-rgb:     242,139,130;
  --row-3:      #fcd96b; --row-3-rgb:     252,217,107;
  --row-4:      #5ed3d7; --row-4-rgb:     94,211,215;
  --row-5:      #f472b6; --row-5-rgb:     244,114,182;
  --row-6:      #7ab3f8; --row-6-rgb:     122,179,248;
  --row-7:      #7ec986; --row-7-rgb:     126,201,134;

  --ui-accent-rgb: 232,23,93;
  --ui-shadow-rgb:  12,12,14;
}

* {
  scrollbar-width: thin;
  scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: var(--scrollbar-track);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover);
}

::-webkit-scrollbar-corner {
  background: transparent;
}

html, body {
  height: 100%;
}

body {
  background-color: var(--bg);
  color: var(--text);
  font-family: -apple-system, "Segoe UI", system-ui, sans-serif;
  line-height: 1.6;
}