/* Field Ops v2 components: shell (screen, app bar, tab bar, banner, avatar, brand). Tokens only. */

/* ── Screen frame ─────────────────────────────────────────────────────────── */
/* The app is a phone column. If it is ever opened on a wider screen (iPad, a desktop by mistake) it stays one
   centred phone-width column instead of stretching: max-width, never a desktop breakpoint. */
.fld-screen { min-height: 100dvh; max-width: var(--fld-column); margin-inline: auto; padding: 0 var(--fld-gutter); padding-top: var(--fld-safe-top); }
.fld-screen--tabs { padding-bottom: calc(var(--fld-tabbar-h) + var(--fld-safe-bottom) + 2rem); }
/* A pinned action bar on a screen with a tab bar (Start scanning) sits ABOVE the tab bar, never under it. The axe colour-contrast scan found the Scan tab label drawn over the
   button: the bar was pinned to the bottom of the screen and the tab bar floats on top of that. iPhone: the floating bar (its safe-area gap, its height) and the raised Scan button above it. */
.fld-screen--tabs .fld-actionbar { bottom: calc(var(--fld-safe-bottom) + .75rem + var(--fld-tabbar-h) + .5rem); padding-bottom: .75rem; background: var(--fld-bg); -webkit-backdrop-filter: none; backdrop-filter: none; }   /* solid: list text must not show through (board 7) */
:root[data-platform="android"] .fld-screen--tabs .fld-actionbar { bottom: calc(var(--fld-safe-bottom) + var(--fld-tabbar-h)); }
/* A sheet is not a tab screen: a pinned bar inside a sheet sits at the sheet's own bottom edge, even where the sheet is drawn inside the screen (the catalogue). The rule above reached into sheets and
   floated their buttons about 130 px up, over the fields (found on the dark contact sheet). */
:root[data-platform] dialog.fld-sheet .fld-actionbar { bottom: 0; padding-bottom: calc(var(--fld-safe-bottom) + .75rem); }   /* (:root[data-platform] outranks the Android rule above) */
.fld-screen--bleed { padding: 0; }
.fld-screen--auth { display: flex; flex-direction: column; gap: 1rem; padding-top: calc(var(--fld-safe-top) + 1.25rem); padding-bottom: calc(var(--fld-safe-bottom) + .75rem); }
/* State pages: logo at the top, the focal group centred a little above true centre, Powered by at the foot. */
.fld-screen--state { display: flex; flex-direction: column; gap: 1rem; padding-top: calc(var(--fld-safe-top) + 1.25rem); padding-bottom: calc(var(--fld-safe-bottom) + .75rem); }
.fld-statebody { flex: 1; display: flex; flex-direction: column; justify-content: center; }
.fld-statebody > .fld-empty { min-height: 0; margin-bottom: 8dvh; }
/* Sign-in family: header and fields at the top, the primary action pinned at the bottom (thumb zone), powered-by last. */
.fld-authhead { display: flex; flex-direction: column; gap: .5rem; padding-bottom: .5rem; }
.fld-authhead .fld-brand { margin-bottom: .25rem; }   /* v3: the larger title needs the room; Sign in fits one iPhone 15 screen */
.fld-authhead__title { font-family: var(--fld-num); font-weight: 700; font-size: 1.75rem; line-height: 1.2; letter-spacing: -.01em; }   /* 28 / 700 on both phones (owner 2026-10-14: 34 / 800 read too bulky; HIG Title 1 = 28) */
.fld-authhead__sub { color: var(--fld-ink2); font-size: .9375rem; line-height: 1.4; }   /* 15 (HIG Subheadline): one short line under the title */
.fld-screen--auth > .fld-form { flex: 1; }
/* The title block comes first, the form's error right under it, then the fields (owner 2026-10-14: an error never sits above the
   title). The error is role="alert", so a screen reader announces it at once whatever its place. */
.fld-screen--auth > .fld-form > .fld-authtext { order: -1; }
/* Decision P1-9: the fields group sits in the middle of the free space between the title and the pinned action (two auto margins share
   the space equally); with the keyboard open there is no free space and it simply stays under the title. */
.fld-authtext { display: flex; flex-direction: column; gap: .5rem; }
.fld-screen--auth > .fld-form:has(.fld-field--otp) > .fld-authtext { padding-inline: 0; }   /* code boxes have no card: one left edge */
.fld-form:has(.fld-field--otp) .fld-form__group:has(> .fld-field--otp:only-child) .fld-field__label { padding-inline: 0; }
.fld-screen--auth .fld-switchrow .fld-list__title { font-weight: 500; }   /* sign-in family: quieter option rows (owner 2026-10-14) */
.fld-authicon { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; margin-bottom: .5rem; border-radius: 1rem; background: var(--fld-ink); color: var(--fld-bg); }
.fld-authicon .fld-i { width: 1.625rem; height: 1.625rem; }
.fld-screen--auth > .fld-form > .fld-authtext { margin-top: auto; padding-inline: 1rem; }   /* P1-10: same left edge as the field labels (the group's own padding, 1rem) */
.fld-screen--auth > .fld-form > .fld-actionbar { margin-top: auto; background: var(--fld-bg); -webkit-backdrop-filter: none; backdrop-filter: none; }   /* v3: the button sits on the page, no bar */
.fld-authhead .fld-logo { margin-bottom: .25rem; }
/* v3 board 3, Android sign-in family: M3 filled fields straight on the page (no card), labels in body size, regular weight. */
.fld-screen--auth > .fld-powered { padding-top: 0; min-height: 2.25rem; }
:root[data-platform="android"] .fld-screen--auth .fld-form__group { background: transparent; padding: 0; border-radius: 0; }
:root[data-platform="android"] .fld-screen--auth > .fld-form > .fld-authtext { padding-inline: 0; }
:root[data-platform="android"] .fld-screen--auth .fld-field__label { font-size: var(--fld-fs-body); font-weight: 400; }
.fld-content { display: flex; flex-direction: column; gap: 1rem; padding-bottom: 1rem; }
/* Pull to refresh (decision P6-13): a round chip that follows the pull and spins while a screen refreshes in place. js/components.js moves it with the CSSOM. */
.fld-ptr { position: fixed; z-index: 60; top: calc(var(--fld-safe-top) + .5rem); left: 50%; margin-left: -1.125rem; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--fld-surface);
  box-shadow: 0 .125rem .5rem var(--fld-knob-shadow); display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; }
.fld-ptr__spin { width: 1.25rem; height: 1.25rem; border-radius: 50%; border: 2.5px solid var(--fld-line); border-top-color: var(--fld-brand); }
.fld-ptr.is-loading .fld-ptr__spin { animation: fld-spin .7s linear infinite; }
@media (prefers-reduced-motion: reduce) { .fld-ptr.is-loading .fld-ptr__spin { animation: none; border-top-color: var(--fld-brand); border-right-color: var(--fld-brand); } }

/* Section label (decision P6-24): sentence case, 13 / 14 px, secondary ink. In a column with a gap (the page, a sheet) it sits close to its own group: the gap is the space
   above it, a negative bottom margin pulls it to about 6 px from its card. */
.fld-section-label { font-size: var(--fld-fs-sub); font-weight: 600; color: var(--fld-ink2); margin: 1.25rem .25rem .5rem; }
.fld-content > .fld-section-label { margin: .25rem .25rem -.625rem; }

/* ── App bar ──────────────────────────────────────────────────────────────── */
/* Tab root: large title + event subtitle + avatar; a compact glass bar fades in when the title scrolls away. */
.fld-appbar { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; padding: .5rem 0 .5rem; }
.fld-appbar__text { min-width: 0; flex: 1; }
.fld-appbar__title { font-family: var(--fld-num); font-weight: 700; font-size: var(--fld-fs-title); line-height: 1.1; letter-spacing: 0; }
:root[data-platform="android"] .fld-appbar__title { font-weight: 600; }
.fld-appbar__sub { display: inline-flex; align-items: center; gap: .375rem; min-height: var(--fld-tap); margin-top: -.25rem; padding: 0; border: 0; background: transparent; color: var(--fld-ink2); font-size: var(--fld-fs-sub); font-weight: 600; text-align: left; max-width: 100%; }
.fld-appbar__sub-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fld-appbar__sub .fld-i { width: .875rem; height: .875rem; flex: none; }
.fld-appbar__sentinel { height: 1px; margin-top: -1px; }

.fld-appbar-compact { position: fixed; z-index: 30; inset: 0 0 auto 0; max-width: var(--fld-column); margin-inline: auto; padding: calc(var(--fld-safe-top) + .5rem) var(--fld-gutter) .5rem; background: var(--fld-glass); -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4); border-bottom: 1px solid var(--fld-line); opacity: 0; pointer-events: none; transition: opacity 180ms; text-align: center; }
:root[data-platform="android"] .fld-appbar-compact { text-align: left; }
.fld-appbar-compact.is-on { opacity: 1; pointer-events: auto; }
.fld-appbar-compact__title { display: block; font-weight: 600; font-size: var(--fld-fs-body); line-height: 1.2; }
.fld-appbar-compact__sub { display: block; font-size: var(--fld-fs-sub); color: var(--fld-ink2); line-height: 1.2; }

/* Pushed screen: back, title, one action */
.fld-appbar--pushed { align-items: center; position: sticky; top: 0; z-index: 20; margin: 0 calc(var(--fld-gutter) * -1); padding: calc(var(--fld-safe-top) * 0 + .25rem) var(--fld-gutter); min-height: 3.25rem; background: var(--fld-glass); -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4); border-bottom: 1px solid var(--fld-line); }
.fld-appbar--pushed .fld-appbar__text { text-align: center; }
:root[data-platform="android"] .fld-appbar--pushed .fld-appbar__text { text-align: left; }
.fld-appbar--pushed .fld-appbar__title { font-family: var(--fld-font); font-size: var(--fld-fs-body); font-weight: 600; }
.fld-appbar__slot { width: var(--fld-tap); height: var(--fld-tap); flex: none; display: grid; place-items: center; }

/* Scanner bar: transparent over the camera */
.fld-appbar--scan { position: absolute; z-index: 5; inset: 0 0 auto 0; padding: calc(var(--fld-safe-top) + .5rem) .75rem 0; align-items: center; color: var(--fld-white); }
.fld-appbar--scan .fld-appbar__text { text-align: center; }
.fld-appbar--scan .fld-appbar__title { font-family: var(--fld-font); font-size: var(--fld-fs-body); font-weight: 600; }
.fld-appbar--scan .fld-appbar__subline { font-size: var(--fld-fs-cap); opacity: .8; }

/* ── Avatar ───────────────────────────────────────────────────────────────── */
.fld-avatar { position: relative; width: var(--fld-tap); height: var(--fld-tap); flex: none; display: grid; place-items: center; border: 0; border-radius: 50%; background: var(--fld-surface2); color: var(--fld-ink); font-weight: 700; font-size: var(--fld-fs-sub); }
.fld-avatar--sm { width: 2.25rem; height: 2.25rem; }
/* The app bar's account button: the person's first name with a greeting for the time of day, in a tonal button shape with a down chevron (the same "opens a sheet" cue as the event line).
   Apple's Buttons page: a button needs a visible style and space to tell it from content, and always a press state. The chevron turns while its sheet is open (200 ms, state, not decoration). */
.fld-avatar--name { width: auto; height: auto; min-width: var(--fld-tap); min-height: var(--fld-tap); max-width: 48%; padding: .25rem .625rem .25rem .875rem; gap: .5rem; border-radius: var(--fld-r-ctl); background: var(--fld-surface2); display: flex; flex-direction: row; align-items: center; justify-content: flex-end; text-align: right; line-height: 1.2; transition: background-color 120ms var(--fld-ease); }
.fld-avatar--name:active { background: color-mix(in srgb, var(--fld-ink) 12%, var(--fld-surface2)); }
.fld-avatar__who { display: flex; flex-direction: column; align-items: flex-end; min-width: 0; }
.fld-avatar__hi { font-size: var(--fld-fs-cap); font-weight: 500; color: var(--fld-ink2); white-space: nowrap; }
.fld-avatar__name { max-width: 100%; font-size: var(--fld-fs-body); font-weight: 700; color: var(--fld-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fld-avatar__chev { width: .875rem; height: .875rem; flex: none; color: var(--fld-ink2); transition: transform 200ms var(--fld-ease); }
.fld-avatar--name[aria-expanded="true"] .fld-avatar__chev, .fld-appbar__sub[aria-expanded="true"] .fld-i:last-child { transform: rotate(180deg); }
.fld-avatar--name .fld-avatar__pip { top: -.25rem; right: -.25rem; }
.fld-appbar { container: fldbar / inline-size; }
/* A branded tab-root bar: the logo on the left and the account button on the right share the top row, the large title and the event line follow under them. */
.fld-appbar--branded { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "brand acct" "text text"; align-items: center; row-gap: .25rem; }
.fld-appbar--branded > .fld-appbar__brand { grid-area: brand; min-width: 0; }
.fld-appbar--branded > .fld-appbar__text { grid-area: text; }
.fld-appbar--branded > .fld-avatar { grid-area: acct; justify-self: end; }
.fld-appbar--branded > .fld-avatar--name { max-width: 12rem; }   /* a percentage here is circular in the auto column: the button shrank to 48% of its own track and the greeting spilled out of it */
.fld-appbar__brand .fld-logo { width: min(100%, 9.5rem); }   /* v3: the logo stays on tab roots, a little smaller so the title leads */
/* at the largest text sizes the bar has no room for the greeting line and a roomy button: the name and chevron stay, tighter */
@container fldbar (max-width: 16rem) { .fld-avatar__hi { display: none; } .fld-avatar--name { padding: .25rem .5rem .25rem .5rem; gap: .25rem; } .fld-avatar__name { font-size: var(--fld-fs-sub); } }
.fld-avatar__pip { position: absolute; top: .125rem; right: .125rem; width: .75rem; height: .75rem; border-radius: 50%; background: var(--fld-hold); border: 2px solid var(--fld-bg); }

/* ── Tab bar ──────────────────────────────────────────────────────────────── */
.fld-tabbar { position: fixed; z-index: 35; display: flex; align-items: center; view-transition-name: fld-tabbar; }
.fld-tabbar__tabs { flex: 1; min-width: 0; height: 100%; display: flex; justify-content: space-around; align-items: center; }
.fld-tab { position: relative; flex: 1; min-width: 0; min-height: 3.5rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .1875rem; border: 0; background: transparent; color: var(--fld-ink2); font-size: min(var(--fld-fs-cap), .875rem, 14px); font-weight: 500; text-decoration: none; padding: .375rem 0;   /* 500 = HIG tab bar Medium and M3 label-medium; the active tab changes colour only (owner 2026-10-14: no bulky labels) */ transition: background-color var(--fld-dur-press) var(--fld-ease), color var(--fld-dur-press) var(--fld-ease); }   /* tab labels stop growing at 14 px, like the system bars */
.fld-tab .fld-i { width: min(1.625rem, 32px); height: min(1.625rem, 32px); }
.fld-tab[aria-current="page"] { color: var(--fld-brand); }
.fld-tab__badge { position: absolute; top: .25rem; left: calc(50% + .375rem); }
.fld-tab--scan { flex: none; color: var(--fld-onfab); font-weight: 600; }
.fld-tab--scan .fld-tab__fab { display: grid; place-items: center; color: var(--fld-fab-icon); }
.fld-tab--scan:active { transform: scale(.96); }
.fld-tab--scan[aria-current="page"] { color: var(--fld-onfab); }   /* the label never takes the brand colour on the Scan button's own fill */
/* iPhone (iOS 26 shape): floating glass capsule with a tinted lozenge under the active tab; Scan is the separate round button at the trailing end. */
:root:not([data-platform="android"]) .fld-tabbar { left: .875rem; right: .875rem; max-width: calc(var(--fld-column) - 1.75rem); margin-inline: auto; bottom: calc(var(--fld-safe-bottom) + .75rem); height: var(--fld-tabbar-h); gap: .625rem; }
:root:not([data-platform="android"]) .fld-tabbar__tabs { padding: 0 .375rem; border-radius: 2.0625rem; background: var(--fld-bar); border: 1px solid var(--fld-line); box-shadow: var(--fld-shadow); }   /* solid (board 1; 2026-10-14: list text showed through the glass) */
:root:not([data-platform="android"]) .fld-tabbar { justify-content: center; }
:root:not([data-platform="android"]) .fld-tabbar__tabs { flex: 0 1 auto; }   /* the capsule fits its tabs (iOS 26), so a one- or two-tab bar is not stretched across the screen */
:root:not([data-platform="android"]) .fld-tab { flex: 0 1 5.5rem; min-width: 4rem; min-height: 3.375rem; border-radius: 1.6875rem; }
:root:not([data-platform="android"]) .fld-tabbar__tabs .fld-tab[aria-current="page"] { background: color-mix(in srgb, var(--fld-brand) 11%, transparent); }
:root:not([data-platform="android"]) .fld-tab--scan { flex: none; width: var(--fld-tabbar-h); min-width: 0; height: var(--fld-tabbar-h); min-height: 0; padding: 0;   /* flex: none + min-width 0: the tab rule above must not stretch it into an oval */ gap: 0; border-radius: 50%; background: var(--fld-fab); box-shadow: var(--fld-shadow); font-size: min(var(--fld-fs-cap), .75rem, 12px); }
:root:not([data-platform="android"]) .fld-tab--scan .fld-tab__fab .fld-i { width: 1.625rem; height: 1.625rem; }
:root:not([data-platform="android"]) .fld-tab--scan[aria-current="page"] { box-shadow: 0 0 0 3px var(--fld-bg), 0 0 0 5px var(--fld-mark); }
:root:not([data-platform="android"]) .fld-tab__ind { display: contents; }

/* Android (Material 3): docked navigation bar with the indicator pill. Scan sits IN the bar's row, at the trailing end, as a dark
   "Scan" pill (owner 2026-10-14: the Scan button must not float above the bar; replaces the board-1 extended FAB). */
:root[data-platform="android"] .fld-tabbar { left: 0; right: 0; max-width: var(--fld-column); margin-inline: auto; bottom: 0; height: calc(var(--fld-tabbar-h) + var(--fld-safe-bottom)); padding-bottom: var(--fld-safe-bottom); background: var(--fld-nav); }
:root[data-platform="android"] .fld-tab__ind { display: grid; place-items: center; width: 4rem; height: 2rem; border-radius: 1rem; }
:root[data-platform="android"] .fld-tabbar__tabs .fld-tab[aria-current="page"] { color: var(--fld-ink); }
:root[data-platform="android"] .fld-tabbar__tabs .fld-tab[aria-current="page"] .fld-tab__ind { background: color-mix(in srgb, var(--fld-brand) 18%, transparent); color: var(--fld-brand); }
:root[data-platform="android"] .fld-tab--scan { flex: none; align-self: center; flex-direction: row; gap: .5rem; min-height: 3.5rem; margin-inline-end: .75rem; padding: 0 1.125rem 0 .875rem; border-radius: 1.75rem; background: var(--fld-fab); font-size: min(var(--fld-fs-body), 1rem, 18px); font-weight: 500; }
:root[data-platform="android"] .fld-tab--scan .fld-tab__ind { width: auto; height: auto; }
:root[data-platform="android"] .fld-tab--scan .fld-i { width: 1.5rem; height: 1.5rem; }
:root[data-platform="android"] .fld-tab--scan[aria-current="page"] { box-shadow: 0 0 0 2px var(--fld-nav), 0 0 0 4px var(--fld-mark); }
:root[data-platform="android"] .fld-screen--tabs { padding-bottom: calc(var(--fld-tabbar-h) + var(--fld-safe-bottom) + 2rem); }

/* ── Banner (sync, offline, platform view) ────────────────────────────────── */
.fld-banner { display: flex; align-items: center; gap: .5rem; width: 100%; min-height: var(--fld-tap); padding: .5rem .75rem; border: 0; border-radius: .75rem; font-size: var(--fld-fs-sub); font-weight: 600; text-align: left; }
.fld-banner__more { display: none; }
#fld-queuebar { margin: .5rem 0; }
.fld-banner--cam { position: absolute; z-index: 6; left: .75rem; right: .75rem; top: calc(var(--fld-safe-top) + 4.5rem); width: auto; margin: 0; box-shadow: var(--fld-shadow); }
.fld-banner--hold { background: var(--fld-holdbg); color: var(--fld-hold); }
.fld-banner--bad { background: var(--fld-badbg); color: var(--fld-bad); }
.fld-banner--info { background: var(--fld-surface2); color: var(--fld-ink); }
.fld-banner__text { flex: 1; min-width: 0; }
/* SR-022 platform view: view only, on every screen. Under an app bar (decision P6-23, Material puts a banner below the top app bar): in the flow under a tab root's event line,
   pinned under the compact bar once the title has scrolled away (--fld-compact-h is measured by js/components.js); inside a pushed bar, which is pinned itself. A page with no
   app bar (the camera, state pages) keeps the top bar, and that one is hidden whenever an app bar carries its own. */
/* Slim (owner 2026-10-13, "too bulky"): a 36 px strip. Exit keeps its 44 px tap: the button is 44 high with a 5 px transparent border (the visible outline pill is 28, text only on the bar) and pulls into the strip with a negative margin. */
.fld-banner.fld-platformbar { min-height: 2.25rem; padding: 0 .375rem 0 .75rem; gap: .5rem; background: var(--fld-ink); color: var(--fld-bg); }   /* inverse, like the toast: a mode, not a status, so no green, red or amber */
.fld-platformbar .fld-platformbar__form .fld-btn { min-height: var(--fld-tap); margin-block: -.5rem; padding: 0 .5rem; border: .5rem solid transparent; background-clip: padding-box; background-color: transparent; color: var(--fld-bg); box-shadow: inset 0 0 0 1.5px var(--fld-mark); font-size: var(--fld-fs-sub); }
.fld-platformbar--top { position: sticky; top: 0; z-index: 50; border-radius: 0; max-width: var(--fld-column); margin: 0 auto; }
body:has(.fld-platformbar--root, .fld-platformbar--pushed) > .fld-platformbar--top { display: none; }
.fld-platformbar--root { position: sticky; top: var(--fld-compact-h, 0px); z-index: 25; margin: .125rem 0 .5rem; }
.fld-platformbar--pushed { flex: 0 0 100%; width: auto; margin: 0 0 .25rem; }
.fld-appbar--pushed:has(.fld-platformbar--pushed) { flex-wrap: wrap; }
.fld-platformbar__form { margin: 0; flex: none; }
.fld-platformbar__text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }   /* two lines at most, even at the largest text (decision P6-20) */
a.fld-banner { text-decoration: none; }                                  /* a banner that is a link */
.fld-banner .fld-i { width: 1.25rem; height: 1.25rem; flex: none; }      /* its chevron: without a size the sprite fills the row and squeezes the words */
.fld-dot { width: .5rem; height: .5rem; border-radius: 50%; background: var(--fld-ok); flex: none; }
.fld-dot--hold { background: var(--fld-hold); }
.fld-dot--bad { background: var(--fld-bad); }

/* ── Brand and powered-by ─────────────────────────────────────────────────── */
.fld-brand { display: flex; align-items: center; gap: .625rem; }
.fld-brand__emblem { width: 2.375rem; height: 2.375rem; color: var(--fld-mark); flex: none; }
/* Full logo artwork (emblem, wordmark, band line): two images, the theme token shows one. Drawn 20 rem wide at most; the band line
   is part of the artwork, so it is not text and does not follow the text-size setting. */
.fld-logo { width: min(100%, 20rem); }
.fld-logo__img { width: 100%; height: auto; }
.fld-logo__img--day { display: var(--fld-logo-day); }
.fld-logo__img--gate { display: var(--fld-logo-gate); }
.fld-brand__word { font-family: var(--fld-num); font-weight: 700; font-size: 1.375rem; line-height: 1.1; }
.fld-brand__word em { font-style: normal; color: var(--fld-mark); font-size: .86em; font-family: "Noto Sans Devanagari", "Kohinoor Devanagari", var(--fld-font); }
.fld-emblem { display: inline-block; background: currentColor; -webkit-mask: url("/static/images/emblem.png") center / contain no-repeat; mask: url("/static/images/emblem.png") center / contain no-repeat; }
.fld-powered { display: flex; align-items: center; justify-content: center; gap: .5625rem; min-height: 3rem; margin-top: auto; padding-top: 1rem; color: var(--fld-ink2); font-size: var(--fld-fs-sub); font-weight: 600; }
.fld-powered__icon, .fld-powered__word { display: inline-block; height: 1.75rem;   /* owner 2026-10-14: bigger, so the brand reads clearly (was 1.25rem) */ background: var(--fld-ink); -webkit-mask-position: center; mask-position: center; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: contain; mask-size: contain; }
.fld-powered__icon { width: 2.1875rem; -webkit-mask-image: url("/static/images/aimpact-icon.png"); mask-image: url("/static/images/aimpact-icon.png"); }
.fld-powered__word { width: 6.375rem; -webkit-mask-image: url("/static/images/aimpact-word.png"); mask-image: url("/static/images/aimpact-word.png"); }
