
.portal-main{position:relative;z-index:1;width:min(1180px, calc(100% - 32px));margin:0 auto;padding:28px 0 42px}
.portal-topbar{
    position:relative;z-index:2;width:min(1180px, calc(100% - 32px));margin:28px auto 0;padding:28px;border-radius:30px;
    border:1px solid var(--portal-line);background:linear-gradient(180deg, rgba(8,18,36,.84), rgba(4,15,34,.90));
    box-shadow:var(--portal-shadow);backdrop-filter:blur(14px)
}
.portal-topbar__brand{display:flex;align-items:center;gap:18px;margin-bottom:24px}
.portal-logo{
    width:88px;height:88px;border-radius:28px;display:flex;align-items:center;justify-content:center;font-size:48px;font-weight:900;color:#fff;
    background:linear-gradient(180deg, #9fc7f6 0%, #7ca8de 100%);
    box-shadow:0 18px 34px rgba(63,122,207,.22), inset 0 1px 0 rgba(255,255,255,.45);flex:0 0 auto
}
.portal-brand-title{font-size:24px;font-weight:800;line-height:1.1;letter-spacing:-0.02em}
.portal-brand-subtitle{margin-top:6px;color:var(--portal-muted);font-size:13px;line-height:1.5}
.page-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:24px;padding:2px 2px 4px}
.page-intro h1{margin:10px 0 10px;font-size:clamp(2rem, 4vw, 3.35rem);line-height:1.02;letter-spacing:-0.03em}
.page-intro p{margin:0;max-width:62ch;color:var(--portal-muted);font-size:1rem}
.eyebrow{
    display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 18px;border-radius:999px;
    border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);font-size:14px;font-weight:900;
    letter-spacing:.10em;text-transform:uppercase;color:#e8f1ff
}
.meta-pill{
    display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 16px;border-radius:999px;
    border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);color:var(--portal-muted);font-size:13px;font-weight:700;white-space:nowrap
}
.portal-empty,.empty-state{
    margin-top:24px;padding:28px 24px;border-radius:20px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);
    box-shadow:0 12px 28px rgba(0,0,0,0.12)
}
.portal-empty h2,.empty-state h2{margin:0 0 10px;font-size:28px}
.portal-empty p,.empty-state p{margin:0;color:var(--portal-muted);line-height:1.7;font-size:16px}
.premium-login__card{
    position:relative;z-index:1;padding:30px;border-radius:30px;border:1px solid rgba(255,255,255,.10);
    background:linear-gradient(180deg, rgba(8,18,36,.86), rgba(5,16,34,.92));box-shadow:var(--portal-shadow);backdrop-filter:blur(14px)
}
.premium-login__top{margin-bottom:20px}
.premium-login__crest{margin-bottom:18px}
.premium-login__crest-icon{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:20px;background:linear-gradient(180deg, #9fc7f6 0%, #7ca8de 100%);color:#fff;font-size:28px;font-weight:900}
.premium-login__eyebrow{display:inline-flex;align-items:center;min-height:36px;padding:8px 14px;border-radius:999px;background:rgba(79,141,255,.14);border:1px solid rgba(79,141,255,.24);font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#d7e7ff}
.premium-login__top h1{margin:16px 0 10px;font-size:42px;line-height:1.02;letter-spacing:-.04em}
.premium-login__lead{margin:0;color:var(--portal-muted);line-height:1.7;font-size:16px}
.premium-login__form{margin-top:20px}
.premium-login__alert{margin-bottom:16px}
.premium-login__footer{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:20px;color:var(--portal-muted);font-size:13px;line-height:1.6}
html[data-theme="light"] .portal-topbar,
html[data-theme="light"] .premium-login__card,
body.light .portal-topbar,
body.light .premium-login__card{
    background:rgba(255,255,255,.80);border-color:rgba(69,120,188,.12);
    box-shadow:0 16px 34px rgba(48,88,135,.10), inset 0 1px 0 rgba(255,255,255,.62)
}
html[data-theme="light"] .portal-brand-title, html[data-theme="light"] .page-intro h1, html[data-theme="light"] .premium-login__top h1,
body.light .portal-brand-title, body.light .page-intro h1, body.light .premium-login__top h1{color:#17365a}
html[data-theme="light"] .portal-brand-subtitle, html[data-theme="light"] .page-intro p, html[data-theme="light"] .meta-pill,
html[data-theme="light"] .premium-login__lead, html[data-theme="light"] .premium-login__footer,
body.light .portal-brand-subtitle, body.light .page-intro p, body.light .meta-pill,
body.light .premium-login__lead, body.light .premium-login__footer{color:#4a698a}
html[data-theme="light"] .eyebrow, html[data-theme="light"] .meta-pill,
body.light .eyebrow, body.light .meta-pill{background:rgba(255,255,255,.88);border-color:rgba(69,120,188,.12);color:#294c73}
html[data-theme="light"] .portal-empty, html[data-theme="light"] .empty-state,
body.light .portal-empty, body.light .empty-state{background:rgba(255,255,255,.78);border-color:rgba(69,120,188,.12)}
html[data-theme="light"] .portal-empty p, html[data-theme="light"] .empty-state p,
body.light .portal-empty p, body.light .empty-state p{color:#4a698a}
@media (max-width:920px){
  .portal-topbar{padding:22px;border-radius:26px}
  .page-intro{flex-direction:column;align-items:stretch}
}
@media (max-width:700px){
  .portal-main{width:min(100% - 16px, 1180px);padding:18px 0 28px}
  .portal-topbar{width:min(100% - 16px, 1180px);margin:16px auto 0;padding:18px;border-radius:24px}
  .portal-topbar__brand{gap:14px;align-items:flex-start}
  .portal-logo{width:56px;height:56px;border-radius:18px;font-size:30px}
  .portal-brand-title{font-size:18px}
  .portal-brand-subtitle{font-size:12px}
  .page-intro h1{font-size:clamp(1.9rem, 8vw, 2.6rem)}
  .premium-login__card{padding:22px 18px;border-radius:24px}
  .premium-login__top h1{font-size:34px}
  .premium-login__footer{flex-direction:column}
}
