@font-face {
  font-family: "Roboto";
  src: url("fonts/roboto-400.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: "Roboto";
  src: url("fonts/roboto-500.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 500;
}

@font-face {
  font-family: "Roboto";
  src: url("fonts/roboto-700.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 700;
}

/* Diffusion visual tokens; active/focus deliberately omit Charge. */
:root {
  font-synthesis: none;
  --font-display: "Roboto", system-ui, sans-serif;
  --font-ui: "Roboto", system-ui, sans-serif;
  --info: #4da6ff;
  --warning: #ff6835;
  --error: #ff5b7c;
  --success: #00e5a0;
  --focus: var(--info);
  --radius: 3px;
  color-scheme: dark;
  --bg: #000;
  --surface: #0e0f0f;
  --raised: #1a1b1b;
  --inset: #2a2b2b;
  --text: #fff;
  --muted: #ffffffad;
  --faint: #ffffff8f;
  --line: #ffffff24;
  --line-soft: #ffffff14;
  --hover: #ffffff0f;
  --active: #fff;
  --on-active: #000;
  --link: #8ac5ff;
}
:root[data-dx-theme="light"] {
  color-scheme: light;
  --bg: #f4f5f6;
  --surface: #fff;
  --raised: #fff;
  --inset: #e9ebed;
  --text: #0e0f0f;
  --muted: #555b60;
  --faint: #6b7176;
  --line: #00000024;
  --line-soft: #00000014;
  --hover: #0000000a;
  --active: #0e0f0f;
  --on-active: #fff;
  --link: #1d4ed8;
}
html {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-ui);
  scrollbar-gutter: stable;
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
button,
input,
select {
  font: inherit;
}
:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}
.theme-button {
  width: 30px;
  height: 30px;
  min-height: 30px;
  border: 1px solid var(--text);
  border-radius: 50%;
  padding: 0;
  background: transparent;
  color: var(--text);
  display: inline-grid;
  place-items: center;
  cursor: pointer;
}
.theme-glyph {
  width: 17px;
  height: 17px;
  background: currentColor;
  mask: center/contain no-repeat url("icons/dx-theme-sun.svg");
  transition: rotate 300ms cubic-bezier(0.16, 1, 0.3, 1);
}
[data-dx-theme="dark"] .theme-glyph {
  mask-image: url("icons/dx-theme-moon.svg");
}
.theme-button:hover .theme-glyph,
.theme-button:focus-visible .theme-glyph {
  rotate: 45deg;
}
::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}
::view-transition-old(root) {
  z-index: 0;
}
::view-transition-new(root) {
  z-index: 1;
}
html.theme-wipe::view-transition-new(root) {
  animation: theme-reveal 750ms cubic-bezier(0.65, 0, 0.35, 1) both;
}
@keyframes theme-reveal {
  from {
    clip-path: circle(0 at var(--theme-x) var(--theme-y));
  }
  to {
    clip-path: circle(var(--theme-r) at var(--theme-x) var(--theme-y));
  }
}
.auth-screen {
  min-height: 100dvh;
  padding: 24px;
  display: grid;
  place-items: center;
}
.auth-panel {
  width: min(560px, 100%);
  padding: 48px;
  border: 1px solid var(--line);
  background: var(--surface);
}
.auth-panel h1 {
  font: 400 48px/1.15 var(--font-display);
  margin: 0 0 24px;
}
.auth-panel p {
  color: var(--muted);
  margin: 0 0 24px;
  line-height: 1.6;
}
.auth-label {
  font: 700 12px var(--font-ui);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 24px;
}
.auth-action {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  border: 0;
  border-radius: 999px;
  background: var(--active);
  color: var(--on-active);
  text-decoration: none;
  font: 700 12px var(--font-ui);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.auth-controls {
  position: fixed;
  top: 17px;
  right: 24px;
}
@media (max-width: 600px) {
  .auth-panel {
    padding: 32px 24px;
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}