@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap');

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

html, body {
  height: 100%;
  background: var(--bg-base, #0d1117);
  color: var(--text-primary, #e6edf3);
  font-family: var(--font-sans);
  font-size: var(--fs-base, 12px);
  line-height: 1.3;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--status-info); text-decoration: none; }
a:hover { text-decoration: underline; }

button, input, select, textarea {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

button { cursor: pointer; border: none; background: none; }

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
select,
textarea {
  background: var(--sl-surface-2);
  border: 1px solid var(--sl-border);
  color: var(--sl-text);
  border-radius: var(--sl-radius);
}

.hidden { display: none !important; }

.sl-brand-directive { font-weight: 300; letter-spacing: 0.5px; color: #fff; }
.sl-brand-cad, .sl-brand-roster { font-weight: 700; color: #fff; }
.sl-brand-dot { color: var(--sl-accent); margin: 0 1px; }