/* branded.css — tokens + web fonts for The Park Buffalo CUSTOM surfaces. Shipped from the RCL at: _content/Agilis.Shared/branded.css Reference it once from each host app's . Mud components do NOT need this (they read the MudTheme); only the hand-built brand components below use these variables + fonts. */ @import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700&family=Roboto:wght@400;500;700&family=Saira+Condensed:wght@600;700;800&display=swap'); :root { --pb-navy: #22285B; --pb-accent: #E66025; --pb-green: #1F8A5B; --pb-ink: #22285B; --pb-muted: #6B7088; --pb-faint: #8A8FA6; --pb-line: #E7E9F1; --pb-track: #E4E6EF; --pb-surface:#FFFFFF; --pb-canvas: #F3F4F8; --pb-display: 'Saira Condensed', sans-serif; --pb-body: 'Archivo', sans-serif; --pb-radius-brand: 16px; /* CUSTOM brand cards */ --pb-radius-mud: 4px; /* matches MudBlazor */ } @keyframes pb-pulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .35; transform: scale(.7); } } /* Sign-in brand panel — the custom left half of the Admin sign-in screen. The form on the right is MudBlazor + the scoped SignIn.razor.css. */ .pb-signin { display: flex; min-height: 100vh; } .pb-signin__brand { position: relative; flex: 1.15; overflow: hidden; background: var(--pb-navy, #22285B); padding: 56px 56px 44px; display: flex; flex-direction: column; justify-content: space-between; } .pb-signin__stripes { position: absolute; inset: 0; background: repeating-linear-gradient(135deg, rgba(255,255,255,.025), rgba(255,255,255,.025) 2px, transparent 2px, transparent 16px); } .pb-signin__glow { position: absolute; right: -120px; top: -120px; width: 380px; height: 380px; border-radius: 50%; background: radial-gradient(circle, rgba(230,96,37,.32), transparent 70%); } .pb-signin__logo { position: relative; font: 800 24px var(--pb-display, 'Saira Condensed'), sans-serif; color: #fff; } .pb-signin__logo span { color: var(--pb-accent, #E66025); letter-spacing: .12em; } .pb-signin__pitch { position: relative; } .pb-signin__eyebrow { font: 700 13px var(--pb-display, 'Saira Condensed'), sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--pb-accent, #E66025); } .pb-signin__headline { margin: 14px 0 0; font: 800 64px var(--pb-display, 'Saira Condensed'), sans-serif; line-height: .98; letter-spacing: -.01em; color: #fff; } .pb-signin__lede { margin: 20px 0 0; max-width: 440px; font: 400 17px var(--pb-body, 'Archivo'), sans-serif; line-height: 1.55; color: #B7BBD2; } .pb-signin__stats { position: relative; display: flex; gap: 36px; } .pb-signin__stats b { display: block; font: 700 30px var(--pb-display, 'Saira Condensed'), sans-serif; color: #fff; } .pb-signin__stats span { font: 500 12px var(--pb-body, 'Archivo'), sans-serif; color: #9095B0; } .pb-signin__form { flex: .85; background: #fff; display: flex; align-items: center; justify-content: center; padding: 56px; } .pb-signin__formInner { width: 100%; max-width: 380px; } @media (max-width: 900px) { .pb-signin__brand { display: none; } }