/* FieldOps · brand ramp + liquid-glass material tokens.
   The JLCS signature gradient (logo royal -> logo sky) and the recipe for every
   surface that floats above content (sidebar, menus, modals, toasts). The glass
   needs the colorful canvas beneath it to read. */
:root {
  /* brand gradients */
  --fo-grad: linear-gradient(135deg, #0b3f9e 0%, #2f6cc9 55%, #7db8ef 100%); /* @kind color */
  --fo-grad-text: linear-gradient(90deg, #0b3f9e, #3d7ad1);

  /* liquid glass */
  --fo-glass-top: rgba(255, 255, 255, 0.5);
  --fo-glass-bottom: rgba(255, 255, 255, 0.22);
  --fo-glass-blur: 34px;
  --fo-glass-sat: 210%;
  --fo-glass-bright: 1.08; /* @kind other */
  --fo-glass-border: rgba(255, 255, 255, 0.8);
  --fo-glass-rim:
    inset 0 1.5px 0 rgba(255, 255, 255, 1),
    inset 0 -1px 0 rgba(255, 255, 255, 0.5),
    inset 1.5px 0 0 rgba(255, 255, 255, 0.55),
    inset -1.5px 0 0 rgba(255, 255, 255, 0.55),
    inset 0 0 0 1px rgba(255, 255, 255, 0.25),
    inset 0 0 36px rgba(255, 255, 255, 0.35); /* @kind shadow */
  --fo-glass-shadow:
    0 1px 1px rgba(15, 35, 70, 0.05),
    0 2px 4px rgba(15, 35, 70, 0.04),
    0 8px 16px -4px rgba(15, 35, 70, 0.08),
    0 20px 40px -10px rgba(15, 35, 70, 0.14),
    0 40px 80px -20px rgba(15, 35, 70, 0.2);
}