body { background: #eaf1f8; color: #1e2e42; }
.portal-header { background: #070d36; padding: 1rem; color: white; }
.portal-header a { color: #d0e4ff; }
.portal-brand { display: flex; align-items: center; gap: 1rem; text-decoration: none; font-size: 1.45rem; font-weight: 600; }
.portal-brand img { height: auto; }
.portal-brand small { display: block; font-size: 0.8rem; color: #ffab40; }
.portal-panel, .portal-sidebar { background: white; padding: clamp(1rem, 3vw, 2rem); border-radius: 8px; box-shadow: 0 2px 12px #172c4510; }
.portal-sidebar .nav-link { border-bottom: 1px solid #e7edf5; }
.portal-sidebar .nav-link.active { background: #14254d; color: white; border-radius: 4px; }
.portal-panel { overflow-wrap: anywhere; }
.portal-panel img { max-width: 100%; height: auto; }
.portal-panel table { max-width: 100%; }
.portal-story { overflow-x: auto; }
.portal-story > p { margin-bottom: 1rem; }
.portal-footer { padding: 1rem 2rem; color: #526477; }
.editor-description { min-height: 360px; }

/* Original portal welcome layout. */
.portal-login-page { background: #fff; color: #303030; font-family: Arial, sans-serif; font-size: 0.875rem; }
.login-container { width: min(100% - 2rem, 1170px); margin-inline: auto; }
.login-navbar { background: linear-gradient(#242424, #101010); }
.login-navbar .login-container { min-height: 51px; }
.login-wordmark { color: #999; text-decoration: none; font-size: 1rem; font-weight: 700; }
.login-wordmark strong { color: #fff; }
.login-wordmark small { font-size: 0.75rem; }
.login-home { padding: 1rem 1.25rem; background: #111; color: #fff; text-decoration: none; font-size: 0.75rem; }
.login-wordmark:hover, .login-home:hover { color: white; }
.login-hero { position: relative; }
.login-banner { display: block; width: 100%; height: 320px; object-fit: fill; }
.login-hero-inner { position: absolute; inset: 0; display: flex; align-items: flex-end; padding-bottom: 3.5rem; }
.login-hero-caption { padding: 0.25rem 0.5rem; background: #0008; color: white; }
.login-hero-caption h1 { font-size: clamp(1.5rem, 3vw, 2.5rem); font-weight: 700; margin: 0; }
.login-hero-caption p { font-size: clamp(1rem, 1.8vw, 1.3rem); margin: 0; }
.login-welcome { padding-top: 3.5rem; padding-bottom: 5rem; min-height: 418px; }
.login-welcome h2:not(.login-form-title) { font-size: clamp(1.8rem, 3vw, 2.5rem); font-weight: 700; margin: 0 0 0.5rem; }
.login-welcome p { font-size: 0.8rem; line-height: 1.6; }
.login-welcome-image { display: block; max-width: 100%; width: 211px; height: auto; margin-inline: auto; }
.login-form-title { font-size: 1.3rem; font-weight: 400; border-bottom: 1px solid #ddd; padding-bottom: 0.5rem; margin: 0.5rem 0 1.25rem; }
.login-field { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 0.75rem; align-items: center; margin-bottom: 1.25rem; }
.login-field .form-control { min-width: 0; font-size: 0.875rem; padding: 0.25rem 0.4rem; border-color: #ccc; border-radius: 0 3px 3px 0; }
.login-field .input-group-text { border-radius: 3px 0 0 3px; padding: 0.25rem 0.5rem; }
.login-icon { display: block; width: 14px; height: 14px; background: url("portal-icons.png") no-repeat; }
.login-icon-user { background-position: -168px 0; }
.login-icon-lock { background-position: -287px -24px; }
.login-actions { display: flex; flex-wrap: wrap; gap: 1.5rem; margin-left: 100px; }
.login-button { background: linear-gradient(#5bc0de,#2f96b4); border: 1px solid #2f96b4; color: white; border-radius: 4px; font-size: 0.875rem; padding: 0.25rem 0.75rem; text-shadow: 0 -1px #0004; }
.login-button:hover, .login-button:focus { background: #287f99; color: white; }
.login-help { margin: 1.25rem 0 0 120px; }
.login-switch { margin: 1rem 0 0 100px; }
.login-help a, .login-switch a, .login-footer a { color: #0088cc; text-decoration: none; }
.login-help a:hover, .login-switch a:hover, .login-footer a:hover { text-decoration: underline; }
.login-footer { border-top: 1px solid #ddd; padding-top: 3.5rem; padding-bottom: 2rem; font-size: 0.75rem; }
.login-footer p { margin: 0; }
@media (max-width: 991.98px) {
  .login-banner { height: 260px; object-fit: cover; }
  .login-hero-inner { padding-bottom: 1.5rem; }
  .login-welcome { padding-block: 2rem; }
}
@media (max-width: 575.98px) {
  .login-banner { height: 200px; object-position: 42% center; }
  .login-hero-inner { padding-bottom: 0.75rem; }
  .login-hero-caption { width: 100%; }
  .login-welcome-image { width: 155px; }
  .login-field { grid-template-columns: 1fr; gap: 0.35rem; margin-bottom: 1rem; }
  .login-actions { margin-left: 0; }
  .login-help, .login-switch { margin-left: 0; }
  .login-footer { padding-top: 1.5rem; }
}