/* TimeNowTools tokens v1.1.0 — generated from design-tokens.json */
:root {
  color-scheme: light dark;
  --font: Arial, "Helvetica Neue", Helvetica, "Liberation Sans", "Nimbus Sans", sans-serif;
  --c-bg: #FFFFFF;
  --c-surface: #F5F7FA;
  --c-surface-2: #EBEFF5;
  --c-border: #D5DCE6;
  --c-border-strong: #7B879B;
  --c-text: #0F172A;
  --c-text-muted: #475569;
  --c-text-subtle: #5B6B82;
  --c-primary: #1D4ED8;
  --c-primary-hover: #1E40AF;
  --c-on-primary: #FFFFFF;
  --c-primary-soft: #E7EEFD;
  --c-success: #15803D;
  --c-warning: #B45309;
  --c-danger: #B91C1C;
  --c-danger-soft: #FDECEC;
  --c-focus: #1D4ED8;
  --c-ad-bg: #F5F7FA;
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 48px;
  --space-10: 64px;
  --space-11: 80px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --shadow-popover: 0 8px 24px rgba(15,23,42,0.12);
  --size-touch-target-min: 44px;
  --size-input-height: 48px;
  --size-button-height: 48px;
  --size-timer-start-button-height: 56px;
  --size-chip-height: 36px;
  --size-icon-button: 44px;
  --size-icon: 24px;
  --size-icon-small: 20px;
  --size-progress-bar: 8px;
  --size-focus-ring: 3px;
  --size-focus-offset: 2px;
  --motion-press: 120ms ease-out;
  --motion-hover: 160ms ease-out;
  --motion-overlay: 200ms ease-out;
}
@media (prefers-color-scheme: dark) {
 :root:not([data-theme="light"]) {
    --c-bg: #0B1220;
    --c-surface: #121A2B;
    --c-surface-2: #1A2438;
    --c-border: #2C3852;
    --c-border-strong: #6A7896;
    --c-text: #E8EDF5;
    --c-text-muted: #A9B4C6;
    --c-text-subtle: #8C99AE;
    --c-primary: #7FA6FF;
    --c-primary-hover: #A3C0FF;
    --c-on-primary: #0B1220;
    --c-primary-soft: #1B2A4D;
    --c-success: #4ADE80;
    --c-warning: #FBBF24;
    --c-danger: #F87171;
    --c-danger-soft: #3A1518;
    --c-focus: #A3C0FF;
    --c-ad-bg: #121A2B;
    --shadow-popover: 0 8px 24px rgba(0,0,0,0.5);
 }
}
:root[data-theme="dark"] {
  --c-bg: #0B1220;
  --c-surface: #121A2B;
  --c-surface-2: #1A2438;
  --c-border: #2C3852;
  --c-border-strong: #6A7896;
  --c-text: #E8EDF5;
  --c-text-muted: #A9B4C6;
  --c-text-subtle: #8C99AE;
  --c-primary: #7FA6FF;
  --c-primary-hover: #A3C0FF;
  --c-on-primary: #0B1220;
  --c-primary-soft: #1B2A4D;
  --c-success: #4ADE80;
  --c-warning: #FBBF24;
  --c-danger: #F87171;
  --c-danger-soft: #3A1518;
  --c-focus: #A3C0FF;
  --c-ad-bg: #121A2B;
  --shadow-popover: 0 8px 24px rgba(0,0,0,0.5);
}

body { font-family: var(--font); font-weight: 400; background: var(--c-bg); color: var(--c-text); }
.tnum, time, .digits { font-variant-numeric: tabular-nums; }
:focus-visible { outline: var(--size-focus-ring, 3px) solid var(--c-focus); outline-offset: var(--size-focus-offset, 2px); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; } }