/* Focus Timer design system — the entry point.
 *
 * Import THIS file and nothing else. Designs receive only this file's transitive @import
 * closure, so anything reachable from here is available and anything else is not.
 *
 * Ported from the Compose Multiplatform app's own theme package
 * (composeApp/src/commonMain/kotlin/com/pasteuri/focustimer/ui/theme/). The Kotlin is the
 * source of truth; this is a faithful port of it, not a parallel design.
 *
 * Theme: dark is the default, because the app's ThemeChoice defaults to DARK and does not
 * follow the OS unless the user picks AUTO. For the light palette set data-theme on the root:
 *
 *     <html data-theme="light">
 */

@import url("./tokens/colors.css");
@import url("./tokens/type.css");
@import url("./tokens/shape.css");
@import url("./components.css");

/* A page that forgets .ft-root borrows the host's background and reads as unstyled. Painting
 * body from the tokens makes the common case correct by default. */
body {
  margin: 0;
  background: var(--ft-c-background);
  color: var(--ft-c-text-primary);
  font-family: var(--ft-font-body);
  -webkit-font-smoothing: antialiased;
}

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