@font-face {
  font-family: "Lococo Inter";
  src: url("../assets/fonts/inter-400.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Lococo Inter";
  src: url("../assets/fonts/inter-600.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Lococo Inter";
  src: url("../assets/fonts/inter-700.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

/* Windows has no system Inter: alias the plain "Inter" stacks used by older modules to the bundled files so Mac and Windows render the same face. */
@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/inter-400.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/inter-600.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/inter-700.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

/* Shared visual contract: professional portal, network admin and price lists.
   Layout and commercial state remain owned by their respective modules. */
:root {
  --lococo-font-sans: "Lococo Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --lococo-text-xs: 0.75rem;
  --lococo-text-sm: 0.75rem;
  --lococo-text-md: 0.875rem;
  --lococo-text-lg: 1rem;
  --lococo-title-sm: 1.125rem;
  --lococo-title-md: 1.25rem;
  --lococo-title-lg: 1.5rem;
  --lococo-leading-tight: 1.2;
  --lococo-leading-copy: 1.5;
  --lococo-space-1: 4px;
  --lococo-space-2: 8px;
  --lococo-space-3: 12px;
  --lococo-space-4: 16px;
  --lococo-space-5: 20px;
  --lococo-space-6: 24px;
  --lococo-control-sm: 34px;
  --lococo-control-md: 40px;
  --lococo-control-lg: 48px;
  --lococo-touch-target: 44px;
  --lococo-radius-card: 10px;
  --lococo-border-width: 1px;
  --lococo-line-strong: #c8d2dd;
  --lococo-field-line: #d9e2ec;
  --lococo-surface: #ffffff;
  --lococo-success: #19875f;
  --lococo-warning: #a96a00;
  --lococo-danger: #b83b4b;
  --lococo-motion-fast: 150ms;
  --lococo-motion-panel: 220ms;
  --lococo-layer-sticky: 20;
  --lococo-layer-drawer: 40;
  --lococo-layer-modal: 60;

  --lococo-ink: #102b4e;
  --lococo-muted: #64748b;
  --lococo-line: #dce3eb;
  --lococo-soft: #f6f8fa;
  --lococo-selected: #edf3fa;
  --lococo-focus: #6488b7;
  --lococo-radius-control: 8px;
  --lococo-radius-panel: 12px;
}
.lococo-icon { display: inline-block; flex-shrink: 0; vertical-align: middle; pointer-events: none; }
:where(.professional-experience, #professionalAccessContainer, .professional-access-editor, .pricing-workbench, .pw-surface) :is(button, summary) {
  -webkit-tap-highlight-color: transparent;
}
:where(.professional-experience, #professionalAccessContainer, .professional-access-editor, .pricing-workbench, .pw-surface) :is(input, select, textarea) {
  accent-color: var(--lococo-ink);
}
@media (prefers-reduced-motion: reduce) {
  :where(.professional-experience, #professionalAccessContainer, .professional-access-editor, .pricing-workbench, .pw-surface) :is(button, summary, input, select, textarea) { transition: none; }
}

/* Low-density screens (Windows 100-150% on 1080p panels). Retina keeps its look. */
@media (max-resolution: 1.99dppx) {
  :root { --lococo-field-line: #b9c5d3; --lococo-line: #c9d3df; --lococo-line-strong: #aebccb; }
  * { scrollbar-width: thin; scrollbar-color: #9fb0c3 transparent; }
}