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

[hidden] { display: none !important; }

html, body { height: 100%; }

body {
  margin: 0;
  background: var(--bg-0);
  color: var(--fg);
  font-family: var(--f-ui);
  font-size: var(--fs-13);
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}

button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; padding: 0; text-align: inherit; }
button:disabled { cursor: not-allowed; }
input, textarea, select { font: inherit; color: inherit; }
a { color: var(--accent); text-decoration: none; }
img { max-width: 100%; }
h1, h2, h3, h4 { margin: 0; font-weight: 700; }
p { margin: 0; }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: var(--r-4); }

/* Wraps dialogs to keep Tab inside them (elements.js); it adds no box of its own. */
focus-trap { display: contents; }

::selection { background: var(--accent-soft); }

/* One scrollbar style for the whole app. Standard properties are inherited, so every scroll area matches.
   Hide a scrollbar with the .no-scrollbar utility, never with per-component rules. */
:root { scrollbar-color: var(--scroll-thumb) var(--scroll-track); }
* { scrollbar-width: thin; }

/* Icons from the sprite */
.i { width: 16px; height: 16px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.i.s { width: 14px; height: 14px; }
.i.xs { width: 12px; height: 12px; }
.i.lg { width: 20px; height: 20px; }

kbd {
  font-family: var(--f-mono);
  font-size: var(--fs-10-5);
  color: var(--fg-2);
  background: var(--bg-4);
  border: 1px solid var(--line-2);
  border-bottom-width: 2px;
  border-radius: var(--r-5);
  padding: 0 5px;
  line-height: 17px;
  display: inline-block;
  min-width: 18px;
  text-align: center;
}

.mono { font-family: var(--f-mono); font-variant-numeric: tabular-nums; }
.muted { color: var(--fg-3); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition: none !important; }
}
}