/* ProjMa 32.8.0 — Calm Surface
   ═══════════════════════════════════════════════════════════════════════════
   One design language for the whole product, taken from the surface people
   already liked best: the Workspace Hub. Navy for the shell, teal for
   delivery, a single quiet grey ramp, generous radii, hairline borders, and
   shadows that sit rather than shout. Inter carries voice; DM Mono carries
   structure — labels, keys, keyboard hints and data.

   Contract for this file: it never uses !important to set a colour. Colour is
   owned by the palette that the modules and the application bundle emit
   inline (see scripts/apply-calm-palette.mjs). What this layer standardises is
   geometry, rhythm, focus and motion — so that screens painted by different
   modules read as one calm surface instead of a dozen dialects.
   ═════════════════════════════════════════════════════════════════════════ */

:root{
  /* Shell — deep, matte, low-chroma navy. */
  --pm-shell:#0C2438; --pm-shell-deep:#071520; --pm-panel:#123047;
  --pm-field:#091D2E; --pm-card:#143653;

  /* Delivery accent — ProjMa teal, unchanged identity. */
  --pm-teal:#23D4BE; --pm-teal-deep:#0E9B8A; --pm-teal-ink:#04211C; --pm-teal-soft:#9FE8DC;

  /* Daylight blue — calmed from electric to considered. */
  --pm-blue:#3D7CB6; --pm-blue-deep:#1E4F6E;

  /* Ink ramp on the shell. */
  --pm-text:#E8EFF5; --pm-mut:#93A7BA; --pm-dim:#6B7F92;

  /* Paper ramp — cards, overlays, the Hub, anything printed. */
  --pm-paper:#F8FBFD; --pm-paper-2:#F1F7FA; --pm-ink:#10263A; --pm-ink-mut:#73899A;
  --pm-line:#DCE6ED; --pm-line-soft:#E6ECF1; --pm-line-dark:rgba(190,214,232,.14);

  /* Semantics — hue preserved, chroma pulled back. */
  --pm-ok:#0F8A6A; --pm-warn:#C0842E; --pm-risk:#C4514C; --pm-note:#6A63B8;

  /* Geometry and motion. */
  --pm-r-xs:8px; --pm-r-sm:11px; --pm-r-md:14px; --pm-r-lg:18px; --pm-r-xl:22px;
  --pm-ring:0 0 0 3px rgba(35,212,190,.26);
  --pm-lift-1:0 1px 2px rgba(6,20,32,.06),0 6px 18px rgba(6,20,32,.05);
  --pm-lift-2:0 10px 30px rgba(6,20,32,.10);
  --pm-lift-3:0 38px 110px rgba(2,15,25,.44);
  --pm-ease:cubic-bezier(.2,.8,.2,1);
  --pm-font:Inter,system-ui,sans-serif;
  --pm-mono:'DM Mono',ui-monospace,monospace;

  /* One calm focus ring for the entire product. product.css consumes this
     variable, so redefining it here retunes every focusable control at once. */
  --pm-focus:2px solid #0E9B8A;
  --pm-radius:var(--pm-r-md);
  --pm-shadow:var(--pm-lift-2);
}

/* ── voice ──────────────────────────────────────────────────────────────── */
h1,h2,h3{letter-spacing:-.025em;text-wrap:balance}
h4,h5,h6{letter-spacing:-.012em}
/* Data must line up. Anything set in the mono face is data or a label. */
code,kbd,samp,[style*="DM Mono"],[style*="dm mono"]{font-variant-numeric:tabular-nums;font-feature-settings:'tnum'}

/* ── selection and focus ────────────────────────────────────────────────── */
::selection{background:rgba(35,212,190,.24)}
:focus-visible{outline-offset:3px}

/* ── quiet scrollbars everywhere ────────────────────────────────────────── */
*{scrollbar-width:thin;scrollbar-color:rgba(130,152,172,.34) transparent}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(130,152,172,.30);border-radius:99px;border:2.5px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:rgba(130,152,172,.52);border:2.5px solid transparent;background-clip:content-box}

/* ── controls: a shared default, never a forced one ─────────────────────── */
/* No !important — an application screen that has an opinion still wins; every
   control that never had one now inherits the same calm geometry. */
button,[role="button"]{border-radius:var(--pm-r-sm);transition:background .16s var(--pm-ease),border-color .16s var(--pm-ease),box-shadow .18s var(--pm-ease),color .16s var(--pm-ease),transform .12s var(--pm-ease)}
input,select,textarea{border-radius:var(--pm-r-sm);transition:border-color .16s var(--pm-ease),box-shadow .18s var(--pm-ease),background .16s var(--pm-ease)}
input:focus-visible,select:focus-visible,textarea:focus-visible{box-shadow:var(--pm-ring)}
hr{border:0;border-top:1px solid var(--pm-line-dark)}

/* ── overlays and dialogs: one card language ────────────────────────────── */
/* Geometry only. The colour of these panels is emitted by the module that owns
   them and has already been harmonised by the palette pass. */
.print-modal{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.print-modal>div{border-radius:var(--pm-r-lg)!important;box-shadow:var(--pm-lift-3)!important}
.print-modal .modal-body{scrollbar-gutter:stable}
.pm-status,.pm-update,.pm-partner-label{border-radius:var(--pm-r-md);box-shadow:var(--pm-lift-2)}
.pm-skip{border-radius:var(--pm-r-sm);box-shadow:var(--pm-lift-2);font:700 13px/1 var(--pm-font)}

/* ── the public landing shares the same air ─────────────────────────────── */
.pm-marketing-root{--pm-paper:#F7FAFC;--pm-line:rgba(14,34,51,.09)}
.pm-marketing-root .pm-cta{border-radius:var(--pm-r-sm)}
.pm-marketing-root .pm-label{letter-spacing:.16em}

/* ── motion: present, but never demanding ───────────────────────────────── */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ── phones: nothing may crowd the safe area ────────────────────────────── */
@media(max-width:620px){
  :root{--pm-r-lg:16px;--pm-r-xl:20px}
  .print-modal>div{border-radius:var(--pm-r-lg)!important}
}