/**
 * VesselNow IO — layout / font tokens (colour tokens: vesselnow-themes.css).
 */
:root {
  --radius: 10px;
  --radius-sm: 6px;
  --radius-lg: 16px;
  --topbar-h: 88px;
  --panel-pad: 18px 20px;
  --panel-pad-sm: 14px 16px;
  --panel-list-pad: 12px 14px;
  --vn-z-topbar: 45;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --font-data: "Source Code Pro", ui-monospace, monospace;
  --font-ui: "Source Sans 3", system-ui, -apple-system, sans-serif;
  --font-display: "Archivo", "Source Sans 3", system-ui, -apple-system, sans-serif;

  /* Portal / ops shell layout */
  --side: 248px;
  --side-rail: 72px;
  --wrap: 1180px;
  /* Three-tier shell: phone ≤860 · tablet 861–1180 · desktop ≥1181 */
  --vn-shell-phone: 860px;
  --vn-shell-tablet: 1180px;

  /* Portal chrome stacking (single source — do not hardcode z-index on .side / tabs) */
  --vn-z-content: 1;
  --vn-z-overlay: 55;
  --vn-z-tabs: 50;
  --vn-z-drawer: 60;
  --vn-z-sheet: 70;
  --vn-z-modal: 10000;
  --vn-mobile-nav-h: 72px;
  --vn-mobile-nav-clearance: calc(var(--vn-mobile-nav-h) + env(safe-area-inset-bottom, 0px));

  /* Legacy theme aliases (style.css, older components) */
  --vn-radius: var(--radius-lg);
  --vn-font: var(--font-ui);
  --vn-font-heading: var(--font-display);
  --vn-font-body: var(--font-ui);
  --vn-font-mono: var(--font-data);

  /* Marketing palette names (values come from active theme) */
  --blue-500: #1b6ca8;
  --blue-400: #2279d4;
  --blue-300: #4a9fef;
  --silver-100: #e8edf5;
  --silver-200: #c5d0e0;
  --silver-300: #9aabbe;
  --accent-blue: #152e58;
  --btn-primary-bg: var(--accent, var(--blue-500));
  --btn-primary-fg: #ffffff;
  --btn-primary-hover: var(--blue-400);

  /* Semantic aliases aligned with VesselUI (themes may override) */
  --vn-crit: #ef4444;
  --vn-warn: #f59e0b;
  --vn-ok: #1ea85c;
}