.vespera-root { --vr-surface: #fff; --vr-soft: #eef2f4; --vr-line: rgba(20, 31, 43, .12); --vr-text: #172331; --vr-muted: #6e7a87; --vr-calm: #537d8c; --vr-safe: #3d8175; min-height: 65vh; padding: 1.4rem 0 4rem; color: var(--vr-text); }
[data-bs-theme=dark] .vespera-root { --vr-surface: #0e151c; --vr-soft: #151e26; --vr-line: rgba(226, 235, 243, .11); --vr-text: #eff4f7; --vr-muted: #929da8; --vr-calm: #86adba; --vr-safe: #6ab7a9; }
.vespera-root * { box-sizing: border-box; }
.vespera-root a { text-decoration: none; }
.vespera-root-kicker { display: inline-flex; gap: .45rem; align-items: center; color: var(--vr-calm); font-size: .7rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.vespera-content-page__head { min-height: 270px; padding: clamp(2rem, 5vw, 4rem) 0 1.5rem; border-bottom: 1px solid var(--vr-line); }
.vespera-content-page__head h1 { max-width: 920px; margin: .7rem 0 1rem; color: var(--vr-text); font-size: clamp(2.7rem, 6vw, 5.3rem); font-weight: 820; letter-spacing: -.065em; line-height: .96; }
.vespera-content-page__head > div { display: flex; gap: .65rem; align-items: center; color: var(--vr-muted); font-size: .67rem; }
.vespera-content-page__head > div i { width: 3px; height: 3px; border-radius: 50%; background: currentColor; }
.vespera-content-page__layout { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: clamp(1.5rem, 5vw, 5rem); padding-top: 2rem; }
.vespera-content-page__layout > aside { position: sticky; top: 1rem; display: flex; height: 160px; align-items: flex-start; flex-direction: column; padding-top: .2rem; color: var(--vr-muted); border-top: 1px solid var(--vr-line); }
.vespera-content-page__layout > aside span { margin-top: .8rem; font-size: .62rem; font-weight: 800; }
.vespera-content-page__layout > aside i { margin-top: 1.4rem; color: var(--vr-calm); font-size: 1.4rem; }
.vespera-content-page__layout > aside small { margin-top: .35rem; font-size: .62rem; }
.vespera-content-page__body { max-width: 900px; min-height: 360px; color: var(--vr-muted); font-size: .86rem; line-height: 1.85; }
.vespera-content-page__body :is(h1,h2,h3,h4,h5,h6,strong) { color: var(--vr-text); }
.vespera-content-page__body h2 { padding-bottom: .6rem; margin-top: 2rem; border-bottom: 1px solid var(--vr-line); }
.vespera-content-page__body a { color: var(--vr-calm); }
.vespera-content-page__body img { max-width: 100%; height: auto; border-radius: 10px; }
.vespera-content-page__body :is(table,blockquote,pre) { max-width: 100%; }
.vespera-staff__head { display: flex; min-height: 310px; gap: 2rem; align-items: end; justify-content: space-between; padding: clamp(2rem, 5vw, 4rem) 0 1.5rem; border-bottom: 1px solid var(--vr-line); }
.vespera-staff__head h1, .vespera-vote__head h1 { max-width: 770px; margin: .7rem 0 .8rem; color: var(--vr-text); font-size: clamp(2.7rem, 6vw, 5.2rem); font-weight: 820; letter-spacing: -.067em; line-height: .95; }
.vespera-staff__head p, .vespera-vote__head p { max-width: 650px; margin: 0; color: var(--vr-muted); font-size: .84rem; line-height: 1.75; }
.vespera-staff__head dl { display: flex; gap: 1.5rem; margin: 0; }
.vespera-staff__head dl > div { min-width: 90px; padding-top: .8rem; border-top: 1px solid var(--vr-line); }
.vespera-staff__head dt { color: var(--vr-text); font-size: 1.7rem; font-weight: 800; }
.vespera-staff__head dd { margin: .1rem 0 0; color: var(--vr-muted); font-size: .64rem; }
.vespera-staff__directory { margin-top: 2rem; }
.vespera-staff-group { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 1.5rem; padding: 1.5rem 0; border-bottom: 1px solid var(--vr-line); }
.vespera-staff-group > header { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: .6rem; align-items: start; }
.vespera-staff-group > header > span { color: var(--vr-muted); font-size: .64rem; font-weight: 800; }
.vespera-staff-group > header small { color: var(--vr-muted); font-size: .61rem; text-transform: uppercase; }
.vespera-staff-group > header h2 { margin: .2rem 0 0; color: var(--vr-text); font-size: 1.1rem; }
.vespera-staff-group > header > strong { color: var(--vr-calm); font-size: .72rem; }
.vespera-staff-group__members { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 1rem; }
.vespera-staff-group__members > a { display: grid; min-height: 82px; grid-template-columns: 48px minmax(0, 1fr) 20px; gap: .7rem; align-items: center; color: var(--vr-text); border-top: 1px solid var(--vr-line); }
.vespera-staff-group__avatar { position: relative; }
.vespera-staff-group__avatar .avatar { width: 44px; height: 44px; border-radius: 9px !important; }
.vespera-staff-group__avatar > i { position: absolute; right: 0; bottom: 0; width: 9px; height: 9px; border: 2px solid var(--vr-surface); border-radius: 50%; background: var(--vr-safe); }
.vespera-staff-group__members > a > span:nth-child(2) { display: flex; min-width: 0; flex-direction: column; }
.vespera-staff-group__members strong { overflow: hidden; color: var(--vr-text); font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.vespera-staff-group__members small { margin-top: .2rem; color: var(--vr-muted); font-size: .62rem; }
.vespera-staff-group__members > a > i { color: var(--vr-muted); font-size: .9rem; }
.vespera-vote__head { display: flex; min-height: 310px; gap: 2rem; align-items: end; justify-content: space-between; padding: clamp(2rem, 5vw, 4rem) 0 1.5rem; border-bottom: 1px solid var(--vr-line); }
.vespera-vote__count { display: flex; min-width: 130px; align-items: flex-end; flex-direction: column; }
.vespera-vote__count strong { color: var(--vr-text); font-size: 3rem; line-height: 1; }
.vespera-vote__count small { margin-top: .35rem; color: var(--vr-muted); font-size: .63rem; }
.vespera-vote__brief { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 1.5rem; padding: 1.4rem 0; border-bottom: 1px solid var(--vr-line); }
.vespera-vote__brief > span { display: flex; gap: .4rem; color: var(--vr-calm); font-size: .68rem; font-weight: 750; }
.vespera-vote__brief > div { color: var(--vr-muted); font-size: .78rem; line-height: 1.7; }
.vespera-vote__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 1.5rem; border-top: 1px solid var(--vr-line); }
.vespera-vote__links > a { display: grid; min-height: 110px; grid-template-columns: 35px 44px minmax(0, 1fr) auto 24px; gap: .7rem; align-items: center; padding: 0 1rem; color: var(--vr-text); border-bottom: 1px solid var(--vr-line); }
.vespera-vote__links > a:nth-child(odd) { border-right: 1px solid var(--vr-line); }
.vespera-vote__links > a > span { color: var(--vr-muted); font-size: .63rem; font-weight: 800; }
.vespera-vote__links > a > i:first-of-type { color: var(--vr-calm); font-size: 1.4rem; }
.vespera-vote__links strong { overflow: hidden; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.vespera-vote__links small { color: var(--vr-muted); font-size: .61rem; }
.vespera-vote__links > a > i:last-child { color: var(--vr-muted); }
.vespera-vote__note { display: flex; gap: .7rem; align-items: center; padding: 1.2rem 0; margin-top: 1.5rem; color: var(--vr-muted); border-top: 1px solid var(--vr-line); }
.vespera-vote__note > i { color: var(--vr-calm); font-size: 1.2rem; }
.vespera-vote__note > span { display: flex; flex-direction: column; }
.vespera-vote__note strong { color: var(--vr-text); font-size: .7rem; }
.vespera-vote__note small { margin-top: .2rem; font-size: .63rem; }
.vespera-root-empty { display: grid; min-height: 300px; place-items: center; align-content: center; text-align: center; border-bottom: 1px solid var(--vr-line); }
.vespera-root-empty > i { color: var(--vr-calm); font-size: 2rem; }
.vespera-root-empty h2 { margin: .7rem 0 .3rem; color: var(--vr-text); font-size: 1.15rem; }
.vespera-root-empty p { color: var(--vr-muted); font-size: .76rem; }
@media (max-width: 991px) { .vespera-staff-group { grid-template-columns: 1fr; } .vespera-staff-group__members { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .vespera-content-page__layout { grid-template-columns: 1fr; } .vespera-content-page__layout > aside { position: static; height: auto; flex-direction: row; gap: .5rem; align-items: center; padding: .8rem 0; } .vespera-content-page__layout > aside :is(span,i,small) { margin: 0; } .vespera-staff__head, .vespera-vote__head { min-height: 0; align-items: flex-start; flex-direction: column; padding-top: 2rem; } .vespera-staff__head dl { width: 100%; } .vespera-staff__head dl > div { flex: 1; } .vespera-staff-group__members, .vespera-vote__links { grid-template-columns: 1fr; } .vespera-vote__links > a:nth-child(odd) { border-right: 0; } .vespera-vote__brief { grid-template-columns: 1fr; } .vespera-vote__count { align-items: flex-start; } }
@media (max-width: 480px) { .vespera-staff-group__members > a { grid-template-columns: 44px minmax(0, 1fr) 18px; } .vespera-vote__links > a { grid-template-columns: 26px 36px minmax(0, 1fr) 20px; } .vespera-vote__links small { display: none; } }