/* Participant pages only. Admin and master controls keep their existing theme. */
body.voter-portal {
    --color-primary: #087ca7;
    --color-primary-dark: #075477;
    --color-primary-light: #32b8d4;
    --color-accent: #7ce0e9;
    --color-accent-light: #c8f8f5;
    --color-bg: #0b557d;
    --color-card-bg: rgba(233, 249, 255, .58);
    --color-border: rgba(255, 255, 255, .8);
    --color-text-main: #15374a;
    --color-text-muted: #496c7b;
    --color-male: #075d9a;
    --color-male-bg: rgba(196, 233, 251, .82);
    --color-female: #0b7f8f;
    --color-female-bg: rgba(199, 247, 240, .82);
    --radius-sm: 12px;
    --radius-md: 18px;
    --radius-lg: 26px;
    --shadow-sm: 0 8px 26px rgba(22, 91, 123, .08);
    --shadow-md: 0 14px 34px rgba(18, 83, 115, .15);
    --shadow-lg: 0 24px 60px rgba(10, 69, 100, .22);
    min-height: 100vh;
    background: #2a91b1;
}

body.voter-portal::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: radial-gradient(circle at 15% 18%, rgba(85, 214, 234, .78) 0, transparent 33%),
        radial-gradient(circle at 88% 58%, rgba(11, 162, 198, .78) 0, transparent 34%),
        radial-gradient(ellipse at 52% 47%, #b1e9ef 0, #59bfd7 39%, transparent 72%),
        linear-gradient(155deg, #06345e 0%, #0b6b93 53%, #073b68 100%);
}

.voter-portal > .container {
    position: relative;
    z-index: 1;
}

.voter-portal .ambient-jellyfish {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.ambient-jellyfish img {
    position: absolute;
    bottom: -180px;
    left: var(--x);
    width: var(--size);
    height: auto;
    opacity: .8;
    animation: jellyfish-rise var(--duration) linear infinite;
    animation-delay: var(--delay);
    will-change: transform;
}

@keyframes jellyfish-rise {
    from { transform: translate3d(0, 0, 0) rotate(-5deg) scale(1); }
    25% { transform: translate3d(24px, -30vh, 0) rotate(6deg) scale(1.07, .95); }
    50% { transform: translate3d(-12px, -60vh, 0) rotate(-5deg) scale(1); }
    75% { transform: translate3d(20px, -90vh, 0) rotate(6deg) scale(1.07, .95); }
    to { transform: translate3d(0, -125vh, 0) rotate(-5deg) scale(1); }
}

.voter-portal .header {
    padding: 1.5rem 0 1.25rem;
}


.voter-portal .event-brand { margin: 0 auto 1rem; text-align: center; }
.voter-portal .brand-logo {
    width: min(100%, 320px);
    margin: 0 auto .6rem;
    padding: 8px;
    border-radius: 18px;
    background: #fff url('../img/white-satin-background.webp') center / cover no-repeat;
    box-shadow: var(--shadow-md);
}
.voter-portal .brand-logo img { display: block; width: 100%; height: auto; }
.voter-portal .category-sponsor-logo {
    display: block; width: 110px; max-width: 100%; height: auto;
    margin: .6rem auto 0;
}

.voter-portal .event-title,
.voter-portal .modal-title {
    letter-spacing: -.025em;
}

.voter-portal .event-title { color: #fff; text-shadow: 0 2px 12px rgba(3, 39, 67, .32); }
.voter-portal .modal-title { color: var(--color-primary-dark); }

.voter-portal .event-title {
    font-size: clamp(1.7rem, 7vw, 2.4rem);
    line-height: 1.15;
    font-family: Impact, "Arial Narrow", "Segoe UI", sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .025em;
}

.voter-portal .event-subtitle { color: #e6faff; text-shadow: 0 1px 5px rgba(2, 40, 66, .27); }
.voter-portal .portal-footer { color: #fff; font-weight: 600; text-shadow: 0 1px 4px rgba(2, 40, 66, .7); }
.voter-portal .header a,
.voter-portal .header #btn_open_rules { color: #fff !important; }

.voter-portal .event-eyebrow {
    display: inline-block;
    margin-bottom: .65rem;
    padding: .25rem .8rem;
    border: 1px solid rgba(8, 124, 167, .23);
    border-radius: 999px;
    background: rgba(255,255,255,.64);
    color: var(--color-primary-dark);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.voter-portal .event-tagline {
    margin: .45rem 0 .25rem;
    color: #fff;
    text-shadow: 0 1px 5px rgba(2, 40, 66, .27);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.2rem, 4.5vw, 1.55rem);
    font-weight: 700;
}

.voter-portal .sponsor-credit { display: block; margin-top: .2rem; font-size: .8em; }

.voter-portal .card,
.voter-portal .modal-card {
    background: linear-gradient(135deg, rgba(255, 255, 255, .62), rgba(217, 246, 253, .44));
    border: 1px solid rgba(255,255,255,.72);
    box-shadow: 0 18px 50px rgba(3, 45, 79, .24), inset 0 1px 1px rgba(255,255,255,.82);
    backdrop-filter: blur(24px) saturate(140%);
    -webkit-backdrop-filter: blur(24px) saturate(140%);
}

.voter-portal .card { padding: clamp(1.25rem, 5vw, 2rem); }

.voter-portal .form-input {
    min-height: 52px;
    border: 1px solid #afd5e4;
    background: rgba(255,255,255,.87);
    color: var(--color-text-main);
}

.voter-portal .form-input:focus,
.voter-portal .btn:focus-visible,
.voter-portal .model-card:focus-visible {
    outline: 3px solid #075477;
    outline-offset: 2px;
    box-shadow: 0 0 0 5px rgba(89, 205, 224, .24);
}

.voter-portal .btn-primary {
    background: linear-gradient(115deg, #075b87, #099abb 55%, #35c6cd);
    box-shadow: 0 9px 20px rgba(8, 117, 154, .24);
    color: #fff;
}

.voter-portal .btn-primary:hover { background: linear-gradient(115deg, #074a6d, #087fa5 58%, #20abb6); }
.voter-portal #btn_review,
.voter-portal #btn_modal_confirm {
    background: #b5091b;
    border: 2px solid #ffbb19;
    color: #fff;
    box-shadow: 0 9px 20px rgba(109, 4, 18, .25);
}
.voter-portal #btn_review:hover:not(:disabled),
.voter-portal #btn_modal_confirm:hover:not(:disabled) { background: #8e0715; }
.voter-portal #btn_review:disabled { opacity: .62; box-shadow: none; }
.voter-portal .btn-secondary { background: rgba(231, 248, 253, .9); color: var(--color-primary-dark); }
.voter-portal .btn-secondary:hover { background: #d4f1f9; }

.voter-portal .category-header {
    border: 1px solid rgba(255,255,255,.8);
    border-left: 5px solid currentColor;
    box-shadow: var(--shadow-sm);
    gap: .5rem;
}

.voter-portal .wallet-badge { background: rgba(255,255,255,.82); }

.voter-portal .model-card {
    border: 1px solid rgba(255,255,255,.9);
    background: rgba(255,255,255,.8);
    box-shadow: var(--shadow-sm);
}

.voter-portal .model-card.selected {
    border: 2px solid var(--color-primary);
    box-shadow: 0 0 0 3px rgba(8,124,167,.2), var(--shadow-md);
}

.voter-portal .model-number-tag { background: rgba(4, 65, 98, .82); }
.voter-portal .model-name { white-space: normal; overflow: visible; }
.voter-portal .model-university {
    margin-top: .25rem;
    color: #496c7b;
    font-size: .76rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
}
.voter-portal .btn-select-model { background: rgba(235,249,253,.92); color: var(--color-primary-dark); }
.voter-portal .model-card.selected .btn-select-model,
.voter-portal .model-card.selected .model-photo-wrapper::after { background: var(--color-primary); color: #fff; }

.voter-portal .bottom-bar {
    background: rgba(222, 247, 253, .74);
    border-top: 1px solid rgba(255,255,255,.9);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.voter-portal .modal-overlay { background: rgba(8, 46, 70, .46); }
.voter-portal .impact-bar-fill,
.voter-portal .countdown-bar { background: linear-gradient(90deg, #0b81ae, #52d7dc); }

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .voter-portal .card,
    .voter-portal .modal-card { background: rgba(239, 251, 255, .94); }
}

@media (max-width: 420px) {
    .ambient-jellyfish img:nth-child(n+4) { display: none; }
    .voter-portal .category-header { flex-wrap: wrap; }
    .voter-portal .model-grid { gap: .7rem; }
    .voter-portal .bottom-bar-inner { gap: .5rem; }
    .voter-portal .bottom-tally { min-width: 0; }
    .voter-portal .bottom-tally strong { display: inline-block; max-width: 145px; overflow: hidden; text-overflow: ellipsis; vertical-align: bottom; white-space: nowrap; }
}

@media (prefers-reduced-motion: reduce) {
    .ambient-jellyfish img { animation: none; display: none; }
    .voter-portal .btn,
    .voter-portal .model-card { transition: none; }
}
