/* ============================================================ * "FRUTIGER AERO" — glossy translucent aqua-blue glass, c.2007. * COLD RUN under PM-010 reskin-readiness rules: this file is allowed * to contain ONLY (1) the variant class on , (2) token value * overrides, and (3) the two universal FLOOR rules (background + text) * with new values. NO component-specific CSS, NO specificity duels, * NO per-component overrides. Anything the floor can't reach is LOGGED * in frutiger-aero.LOG.md, not fixed here. * * Floor :not() chain uses ONLY type selectors (svg/img/...) so it stays * low-specificity — same shape as the CRT floor, only the VALUES differ. * ============================================================ */ @import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800&display=swap'); /* ---- aqua glass palette (token values only) ---- */ .jgn-variant-fa { --fa-canvas: #C2E4F5; /* aqua sky — r=194 so it is NOT near-white (probe floor) */ --fa-surface: #C6E5F6; /* glass panel — r=198 (sub-200): aqua, not near-white once floor is gone */ --fa-ink: #0B2B3F; /* deep teal-navy text (~12:1 on canvas) */ --fa-ink-dim: #245068; /* secondary (~5.4:1 on canvas, AA) */ --fa-line: #6FB6D8; /* aqua hairline */ --fa-aqua: #2E9BD6; /* primary aqua accent */ --fa-glass: rgba(255,255,255,.55); --fa-glow: 0 6px 18px rgba(46,155,214,.30), inset 0 1px 0 rgba(255,255,255,.8); --fa-sans: 'Nunito','Frutiger','Myriad Pro','Segoe UI',system-ui,sans-serif; /* canonical semantic tokens */ --color-canvas: var(--fa-canvas); --color-surface: var(--fa-surface); --color-ink: var(--fa-ink); --color-ink-dim: var(--fa-ink-dim); --color-ink-muted: var(--fa-ink-dim); --color-line: var(--fa-line); --color-hover-surface: #B5DDF2; /* r=181: deeper aqua hover, sub-200 */ --color-surface-raised: var(--fa-surface); --color-surface-sunken: #B5DDF2; --color-surface-cool: var(--fa-surface); --color-surface-cool-2: #BFE2F4; --color-accent: #DD5100; /* JARGAN brand accent preserved across reskins */ --color-accent-aa: #BD4500; --color-accent-strong: #BD4500; --color-on-accent: #ffffff; --color-invert-bg: var(--fa-aqua); --color-invert-ink: #ffffff; --color-status-success: #1E9E5A; --color-status-warning: #C77800; --color-status-error: #D63B2F; --color-status-info: var(--fa-aqua); --color-accent-rgb: 221, 81, 0; /* brand Traffic Orange preserved as itself (PM-010 tokenize) */ --color-indigo: #6366F1; /* keep indigo as real color (Frutiger preserves color) */ --color-platform-blog: #14B8A6; /* keep teal */ --font-display: var(--fa-sans); --font-prose: var(--fa-sans); --font-ui: var(--fa-sans); /* bubbly rounded corners */ --radius-none: 0; --radius-sm: 8px; --radius-md: 14px; --radius-lg: 20px; --radius-xl: 28px; --radius-pill: 999px; --radius-2xl: 32px; --ed-border-radius: 14px; /* soft glossy drop shadows */ --shadow-none: none; --shadow-sm: var(--fa-glow); --shadow-md: var(--fa-glow); --shadow-lg: 0 12px 32px rgba(46,155,214,.32); --shadow-xl: 0 16px 44px rgba(46,155,214,.36); --shadow-hover: 0 12px 32px rgba(46,155,214,.4); --shadow-card: var(--fa-glow); --shadow-card-sm: var(--fa-glow); --shadow-hover-transform: translateY(-2px); --border-grid: 1px solid var(--fa-line); --border-section: 1px solid var(--fa-line); /* Bootstrap surfaces */ --bs-body-bg: var(--fa-canvas); --bs-body-color: var(--fa-ink); --bs-secondary-bg: var(--fa-surface); --bs-secondary-color: var(--fa-ink-dim); --bs-tertiary-bg: #BFE2F4; /* r=191 sub-200 aqua tertiary */ --bs-tertiary-color: var(--fa-ink-dim); --bs-emphasis-color: var(--fa-ink); --bs-border-color: var(--fa-line); --bs-border-color-translucent: rgba(111,182,216,.5); --bs-link-color: var(--fa-aqua); --bs-link-hover-color: #1B7FB5; --bs-card-bg: var(--fa-surface); --bs-card-color: var(--fa-ink); --bs-card-border-color: var(--fa-line); --bs-card-cap-bg: #BFE2F4; /* r=191 sub-200 aqua tertiary */ --bs-heading-color: var(--fa-ink); --bs-emphasis-color-rgb: 11,43,63; /* Bootstrap status palette — floor removed, so map each --bs-* explicitly. success reads green, danger reads red, warning amber, info/primary aqua. */ /* deep aqua (not --fa-aqua) so Bootstrap's WHITE badge/button text passes AA: white on #166A98 ≈ 5.9:1; white on #2E9BD6 was 2.9:1 (failed). */ --bs-primary: #166A98; --bs-primary-rgb: 22,106,152; --bs-success: #1E9E5A; --bs-success-rgb: 30,158,90; --bs-warning: #C77800; --bs-warning-rgb: 199,120,0; --bs-info: #166A98; --bs-info-rgb: 22,106,152; --bs-danger: #D63B2F; --bs-danger-rgb: 214,59,47; /* .bg-light / .bg-white utilities resolve --bs-light-rgb — recolor to aqua glass */ --bs-light: var(--fa-surface); --bs-light-rgb: 198,229,246; --bs-white: var(--fa-surface); --bs-white-rgb: 198,229,246; /* themes.css component-surface var layer — the app's own per-component surface tokens (Phase 1A: remap the whole layer once so glass/panel/card/strip/badge surfaces recolor to aqua instead of bleeding white). Variant-scoped → default theme untouched. Glass rgbs use r<=200 so the translucent fill is aqua, not white. */ --body-bg: var(--fa-canvas); --surface-bg: var(--fa-surface); --surface-muted-bg: #BFE2F4; --glass-panel-bg: rgba(180, 221, 240, 0.75); --glass-card-bg: rgba(180, 221, 240, 0.6); --glass-card-bg-hover: rgba(180, 221, 240, 0.85); --auth-panel-bg: rgba(180, 221, 240, 0.85); --input-bg: var(--fa-surface); --input-bg-focus: var(--fa-surface); --pack-card-bg: var(--fa-surface); --voice-badge-bg: #C6D9F0; --kpi-strip-bg: var(--fa-surface); --card-footer-bg: #BFE2F4; } /* ---- base canvas: light aqua gradient + glossy sans ---- */ html.jgn-variant-fa, html.jgn-variant-fa body { background: linear-gradient(180deg, #EAF7FE 0%, var(--fa-canvas) 55%, #9FD2EC 100%) !important; color: var(--fa-ink); font-family: var(--fa-sans) !important; } /* ============================================================ * FLOOR DELETED (PM-010 Phase 3). The universal `*:not(...)` background + * text floors are GONE. Surfaces and text now come entirely from the * structural tokens (--color-canvas / --color-surface / --color-ink ...) * mapped above, which the app's components read. Any surface that still * renders white is a component hardcoding #fff instead of a token — that is * tokenized at the source, not papered over with a floor. * ============================================================ */