/* Go-live card state tints (spec §6.7) — mirrors the vendor Callout tint recipe
   (color-mix over the card bg + ring via --tw-ring-color). Section has no native
   tint API and extraAttributes land on the OUTER wrapper, hence the child
   selector. Dark mode is class-based in this panel — never light-dark(). */
.golive-tint-warning > .fi-section { background-color: color-mix(in oklab, var(--color-white) 90%, var(--warning-400)); --tw-ring-color: color-mix(in oklab, var(--warning-600) 20%, transparent); }
.dark .golive-tint-warning > .fi-section { background-color: color-mix(in oklab, var(--gray-900) 90%, var(--warning-400)); --tw-ring-color: color-mix(in oklab, var(--warning-400) 30%, transparent); }
.golive-tint-success > .fi-section { background-color: color-mix(in oklab, var(--color-white) 90%, var(--success-400)); --tw-ring-color: color-mix(in oklab, var(--success-600) 20%, transparent); }
.dark .golive-tint-success > .fi-section { background-color: color-mix(in oklab, var(--gray-900) 45%, var(--success-600)); --tw-ring-color: color-mix(in oklab, var(--success-400) 30%, transparent); }

/* V3 shell (spec §7.1): the ViewSite header as a card matching section chrome. */
.fi-page.fi-resource-sites.fi-resource-view-record-page .fi-header { border-radius: 1rem; background-color: var(--color-white); padding: calc(var(--spacing) * 6); align-items: flex-start; --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a); --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); --tw-ring-color: color-mix(in oklab, var(--gray-950) 5%, transparent); }
.dark .fi-page.fi-resource-sites.fi-resource-view-record-page .fi-header { background-color: var(--gray-900); --tw-ring-color: color-mix(in oklab, var(--color-white) 10%, transparent); }
/* Back link stays visible on phones (theme hides header breadcrumbs < 40rem). */
.fi-page.fi-resource-sites.fi-resource-view-record-page .fi-header .fi-breadcrumbs { display: block; }
/* Title row: h1 + hook chips inline; Back link + subheading on their own lines. */
.fi-page.fi-resource-sites.fi-resource-view-record-page .fi-header > div:first-child { display: flex; flex-wrap: wrap; align-items: center; column-gap: .75rem; }
.fi-page.fi-resource-sites.fi-resource-view-record-page .fi-header > div:first-child .fi-breadcrumbs,
.fi-page.fi-resource-sites.fi-resource-view-record-page .fi-header > div:first-child .fi-header-subheading { flex-basis: 100%; }
/* Rounder cards on this page (compact would otherwise drop to rounded-lg). */
.fi-page.fi-resource-sites.fi-resource-view-record-page .fi-section:not(.fi-section-not-contained):not(.fi-aside),
.fi-page.fi-resource-sites.fi-resource-view-record-page .fi-section.fi-compact { border-radius: 1rem; }
/* Access card: vertical divider between the two credential columns (lg+ only —
   below that the grid stacks and the border would be a stray edge). */
@media (min-width: 64rem) {
  .mwh-divided-grid > .fi-sc > .fi-grid-col:nth-child(2) { border-inline-start: 1px solid var(--gray-200); padding-inline-start: 1.5rem; }
  .dark .mwh-divided-grid > .fi-sc > .fi-grid-col:nth-child(2) { border-color: color-mix(in oklab, var(--color-white) 10%, transparent); }
}
/* Header links + notes: light/dark tuned (inline primary-400 failed AA on the
   light card — review find). */
.mwh-hdr-link { color: var(--primary-600); text-decoration: none; }
.mwh-hdr-link:hover { text-decoration: underline; }
.dark .mwh-hdr-link { color: var(--primary-400); }
.mwh-hdr-note { font-size: .875rem; color: var(--gray-500); }
.dark .mwh-hdr-note { color: var(--gray-400); }