/* HM-183 Tank Inspector — the palette already set by the app's privacy page:
   DOT placard navy, steel blue, and the amber/red of an overdue test. */
@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@500;600;700&family=Inter:wght@300;400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root {
  /* Surfaces */
  --color-bg:             #f5f7fa;
  --color-bg-deep:        #0d2c50;
  --color-bg-deeper:      #071a30;
  --color-surface:        #ffffff;
  --color-surface-sunken: #e8edf4;
  --color-border:         #dbe2ec;

  /* Brand */
  --color-ink:            #0d2c50;
  --color-steel:          #19508a;
  --color-steel-bright:   #6fb2ee;
  --color-amber:          #9a5a00;
  --color-amber-bright:   #ffb84f;
  --color-alert:          #b3282d;
  --color-ok:             #157347;

  /* Text */
  --color-text:           #14202d;
  --color-text-secondary: #3d4f60;
  --color-text-muted:     #64788d;
  --color-text-invert:    #eef3fa;

  /* Typography */
  --font-display: 'Inter Tight', system-ui, sans-serif;
  --font-ui:      'Inter', system-ui, -apple-system, sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, SFMono-Regular, monospace;

  /* Type scale */
  --text-hero:       clamp(2.125rem, 5vw, 3.375rem);
  --text-display-lg: clamp(1.625rem, 3.2vw, 2.25rem);
  --text-display-md: 1.3125rem;
  --text-body-lg:    1.125rem;
  --text-body-md:    1rem;
  --text-label:      0.75rem;

  /* Spacing */
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1.25rem;
  --space-lg: 2rem;
  --space-xl: 3.5rem;
  --space-2xl: 5.5rem;

  /* Shape */
  --radius:    12px;
  --radius-lg: 18px;
  --shadow:    0 1px 2px rgba(13, 44, 80, 0.05), 0 8px 24px rgba(13, 44, 80, 0.07);
  --shadow-lg: 0 2px 4px rgba(13, 44, 80, 0.06), 0 20px 50px rgba(13, 44, 80, 0.16);
  --maxw:      1080px;
}