body { font-family: var(--font-sans); background: #F3F5F7; }
.font-monospace, .mono { font-family: var(--font-mono); }
.login-split { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); background: #F3F5F7; }
.login-brand { background: #161A20; color: #fff; padding: 48px; display: flex; flex-direction: column; justify-content: space-between; min-height: 100vh; }
.login-brand h1 { font-size: 32px; font-weight: 600; letter-spacing: -.02em; margin: 0 0 12px; max-width: 420px; }
.login-form { display: flex; align-items: center; justify-content: center; padding: 32px; }
.login-form form { width: 100%; max-width: 380px; }
.muted { color: #9AA4B2; }
.eyebrow { font-family: var(--font-mono); font-size: 12px; color: #5B6676; }
a.info-box { color: inherit; text-decoration: none; cursor: pointer; }
a.info-box.active { outline: 2px solid #1D4CC0; outline-offset: -1px; }
.info-box-number { font-family: var(--font-mono); font-weight: 600; font-size: 20px; letter-spacing: -.02em; line-height: 1.25; }
.wyniki { background: #161A20; color: #fff; border-radius: 6px; }
.wyniki .liczba { font-family: var(--font-mono); font-size: 36px; font-weight: 600; letter-spacing: -.02em; line-height: 1.2; }
.wyniki .plus { color: #7FD9A0; font-size: 13px; }
.pasek { background: #E8ECF1; height: 16px; border-radius: 2px; }
.pasek > span { display: block; height: 100%; border-radius: 2px; background: #1D4CC0; }
.wiek-wiersz { display: grid; grid-template-columns: 110px minmax(0, 1fr) 120px; align-items: center; gap: 12px; }
.etap-wiersz { display: grid; grid-template-columns: 84px minmax(0, 1fr) 48px; align-items: center; gap: 12px; }
.app-footer { font-size: 12px; color: #5B6676; border-top: 1px solid #D5DBE3; padding: .75rem 1rem; }
.btn-link-plain { background: none; border: 0; color: #1D4CC0; padding: 0; }
.sort-link { color: inherit; text-decoration: none; white-space: nowrap; }
.sort-link.aktywny { color: #1D4CC0; }
.archiwum-dzien { border: 1px solid #D5DBE3; border-radius: 4px; padding: 10px 14px; display: flex; align-items: center; gap: 10px; background: #fff; color: inherit; text-decoration: none; }
.archiwum-dzien:hover { border-color: #1D4CC0; }
.map-row { height: 48px; margin-bottom: 12px; border: 1px solid #D5DBE3; border-radius: 4px; background: #fff; padding: 0 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.map-row.zrodlo { background: #F8FAFC; }
@keyframes ra-reveal { from { max-width: 0; } to { max-width: 12ch; } }
@keyframes ra-brl { from { transform: translateX(14px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes ra-brr { from { transform: translateX(-14px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes ra-dot {
  0%, 40% { background: #D9A21B; box-shadow: 0 0 0 0 rgba(217, 162, 27, 0); }
  50% { background: #D9A21B; box-shadow: 0 0 0 5px rgba(217, 162, 27, .35); }
  58%, 92% { background: #2E9E5B; box-shadow: 0 0 0 0 rgba(46, 158, 91, 0); }
  100% { background: #D9A21B; box-shadow: 0 0 0 0 rgba(217, 162, 27, 0); }
}
.ra-logo { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); letter-spacing: -.01em; color: #fff; }
.ra-logo .ra-name { display: inline-block; overflow: hidden; white-space: nowrap; animation: ra-reveal 1.1s steps(11, end) .5s both; }
.ra-logo .ra-l { animation: ra-brl .6s cubic-bezier(.2, 0, 0, 1) both; }
.ra-logo .ra-r { animation: ra-brr .6s cubic-bezier(.2, 0, 0, 1) both; }
.ra-logo .ra-dot { width: 8px; height: 8px; border-radius: 50%; background: #D9A21B; flex: none; animation: ra-dot 6s ease-in-out 1.8s infinite; }
#chart-host { position: relative; min-height: 280px; }
#chart-tip { position: absolute; top: 12px; background: #161A20; color: #fff; border-radius: 2px; padding: 8px 12px; font-size: 12px; pointer-events: none; white-space: nowrap; display: none; z-index: 2; }
@media (prefers-reduced-motion: reduce) {
  .ra-logo * { animation: none !important; }
  .ra-logo .ra-name { max-width: none; }
}
@media (max-width: 900px) {
  .login-split { grid-template-columns: 1fr; }
  .login-brand { min-height: auto; gap: 32px; }
}
