:root {
  /* Sky Background Gradients */
  --sky-top: #0e1116;
  --sky-bottom: #0e1116;

  /* Accent: olive base, champagne for text and icons (contrast on dark) */
  --accent: rgba(131, 125, 87, 0.85);
  --accent-bright: #c9b97f;
  --accent-gold: #dccb98;
  --accent-soft: rgba(131, 125, 87, 0.16);
  --accent-glow: rgba(131, 125, 87, 0.35);
  --focus-ring: 0 0 0 2px rgba(201, 185, 127, 0.75);

  /* Surface & Glass Tones */
  --card-bg: #161b23;
  --card-bg-subtle: rgba(255, 255, 255, 0.035);
  --glass-border: rgba(255, 255, 255, 0.08);
  --glass-border-light: rgba(255, 255, 255, 0.14);
  --glass-highlight: rgba(255, 255, 255, 0.1);

  /* Status Colors (No blinking) */
  --status-emerald: #34d399;
  --status-amber: #fbbf24;
  --status-rose: #f87171;

  /* Typography: one family, tabular figures for money */
  --font-ui: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, system-ui, sans-serif;
  --text-main: #f5f3ee;
  --text-sub: #cdd2da;
  --muted: rgba(205, 211, 220, 0.66);

  /* Type scale: nothing below 12px */
  --fs-caption: 12px;
  --fs-small: 13px;
  --fs-body: 14px;
  --fs-title: 17px;
  --fs-section: 15px;
  --fs-hero: 34px;

  /* Safe Area & Metrics */
  --safe-top: max(env(safe-area-inset-top), var(--tg-safe-area-inset-top, 0px));
  --safe-bottom: max(env(safe-area-inset-bottom), var(--tg-safe-area-inset-bottom, 0px));
  --app-max-width: 460px;
  --gutter: 16px;

  /* Radius tiers: controls < tiles < cards < sheets */
  --radius-xs: 8px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 16px;

  /* Motion: a short list of curves and durations. Exits are faster than entrances. */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-press: 120ms;
  --dur-ui: 180ms;
  --dur-enter: 380ms;
  --dur-exit: 200ms;
  --dur-screen: 420ms;
}

/* Reduced motion keeps the end states and drops the movement */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
  }
}

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

html, body {
  height: 100%;
  width: 100%;
  overflow: hidden;
  background: var(--sky-top);
  font-family: var(--font-ui);
  font-size: var(--fs-body);
  line-height: 1.45;
  color: var(--text-main);
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  font-variant-numeric: tabular-nums;
}

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

button:focus-visible, [tabindex]:focus-visible, a:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

/* Custom Scrollbars */
::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.12);
  border-radius: 4px;
}