/* Vote page clean background + unified style */
.vote-page {
    position: relative;
    z-index: 1;
    padding: var(--zcp-page-top-gap) 0 110px !important;
    margin: 0 auto;
    background: none !important;
    color: var(--portal-text, var(--t1, #ffffff));
}

/* Remove the global zcp-page image background on Vote only */
.vote-page::before {
    content: '' !important;
    position: fixed !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        radial-gradient(circle at 50% 0%, rgba(182,122,53,.14), transparent 34%),
        radial-gradient(circle at 60% 30%, rgba(182,122,53,.08), transparent 36%),
        radial-gradient(circle at 18% 8%, rgba(182,122,53,.10), transparent 34%),
        linear-gradient(180deg, #0B0B0C 0%, #0B0B0C 42%, #0B0B0C 100%) !important;
    opacity: 1 !important;
    z-index: -2 !important;
}

.vote-page::after {
    content: '' !important;
    position: fixed !important;
    inset: 0 !important;
    height: auto !important;
    pointer-events: none !important;
    background:
        linear-gradient(90deg, transparent, rgba(182,122,53,.07), transparent),
        linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.38)) !important;
    opacity: .45 !important;
    z-index: -1 !important;
    animation: none !important;
}

.vote-page .zcp-wrap {
    width: min(1180px, calc(100% - 56px));
    max-width: 1180px;
}

.vote-page .zcp-breadcrumb {
    width: 100%;
    margin: 0 0 20px;
    color: var(--portal-dim, var(--t3, #B8B2AA));
}

.vote-hero {
    width: 100%;
    min-height: auto !important;
    margin: 0 auto 44px;
    padding: 54px 34px 42px !important;
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
    gap: 22px;
    align-items: center;
    border: 1px solid rgba(182,122,53,.18) !important;
    border-radius: 30px;
    background:
        linear-gradient(135deg, rgba(182,122,53,.12), rgba(182,122,53,.07) 58%, rgba(112,69,31, .80)),
        rgba(112,69,31, .82) !important;
    box-shadow: 0 32px 90px rgba(0, 0, 0, .45) !important;
    overflow: hidden;
}

.vote-hero::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.045), transparent) !important;
    opacity: .55 !important;
    pointer-events: none !important;
}

.vote-hero::after {
    display: none !important;
}

.vote-hero .zcp-eyebrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 8px 17px;
    border: 1px solid rgba(182,122,53,.38) !important;
    border-radius: 999px;
    background: rgba(182,122,53,.075) !important;
    color: var(--g4, #D09A55) !important;
    font: 800 11px/1.2 'Cinzel', serif;
    letter-spacing: 3px;
    text-transform: uppercase;
    box-shadow: none !important;
}

.vote-hero .zcp-title {
    max-width: 760px;
    margin: 22px 0 16px;
    font-family: 'Cinzel', serif;
    font-weight: 900;
    font-size: clamp(42px, 5.2vw, 74px);
    line-height: .95;
    letter-spacing: .03em;
    color: var(--g4, #D09A55) !important;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    filter: none !important;
    text-shadow: 0 10px 34px rgba(0,0,0,.5);
    animation: none !important;
}

.vote-hero .zcp-subtitle {
    max-width: 720px;
    color: var(--portal-dim, var(--t2, #B8B2AA));
    font-size: 18px;
    line-height: 1.55;
    font-weight: 600;
}

.vote-hero .zcp-hero-actions {
    margin-top: 28px;
}

.vote-hero .zcp-hero-panel {
    border: 1px solid rgba(182,122,53,.16) !important;
    border-radius: 22px;
    background: rgba(0,0,0,.22) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 18px 44px rgba(0,0,0,.25) !important;
    padding: 20px;
}

.vote-hero .zcp-stat-row {
    gap: 12px;
}

.vote-hero .zcp-stat {
    border: 1px solid rgba(182,122,53,.14) !important;
    border-radius: 17px;
    background: rgba(0,0,0,.20) !important;
    padding: 15px 14px;
    text-align: center;
}

.vote-hero .zcp-stat b {
    color: var(--g4, #D09A55) !important;
    font-family: 'Cinzel', serif;
    font-size: 26px;
    font-weight: 900;
}

.vote-hero .zcp-stat span {
    margin-top: 5px;
    display: block;
    color: var(--portal-dim, var(--t3, #B8B2AA)) !important;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.vote-page .zcp-section {
    margin-top: 32px;
}

.vote-page .zcp-section-head {
    margin-bottom: 18px;
}

.vote-page .zcp-card,
.vote-page .zcp-pack,
.vote-page .zcp-note {
    border-radius: 22px !important;
}

.vote-page .zcp-btn.primary,
.vote-page .zcp-btn.ghost {
    border-radius: 999px;
}

.vote-page .zcp-grid.three {
    gap: 18px;
}

@media (max-width: 900px) {
    .vote-page {
        padding: var(--zcp-page-top-gap-mobile) 0 80px !important;
    }

    .vote-page .zcp-wrap {
        width: min(100% - 32px, 1180px);
    }

    .vote-hero {
        grid-template-columns: 1fr;
        text-align: center;
        padding: 42px 22px 34px !important;
    }

    .vote-hero .zcp-hero-actions {
        justify-content: center;
    }
}

@media (max-width: 560px) {
    .vote-page .zcp-wrap {
        width: min(100% - 22px, 1180px);
    }

    .vote-hero .zcp-stat-row {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   Vote page — shop card feeling / red-black cleanup
   UI only. No PHP/order/vote logic changed.
   ========================================================= */
.vote-page{
    color:#f7f7f7 !important;
}

.vote-page::before{
    background:
        radial-gradient(circle at 50% 0%, rgba(182,122,53,.16), transparent 34%),
        radial-gradient(circle at 78% 18%, rgba(182,122,53,.10), transparent 32%),
        linear-gradient(180deg, #0B0B0C 0%, #0B0B0C 45%, #0B0B0C 100%) !important;
}

.vote-page::after{
    background:
        radial-gradient(circle at 50% 8%, rgba(182,122,53,.10), transparent 35%),
        linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.42)) !important;
    opacity:.55 !important;
}

.vote-page .zcp-breadcrumb,
.vote-page .zcp-breadcrumb a,
.vote-page .zcp-section-note,
.vote-page p,
.vote-page span,
.vote-page time{
    color:rgba(255,255,255,.76) !important;
}

.vote-page .zcp-hero.vote-hero{
    border:1px solid rgba(208,154,85,.24) !important;
    background:
        linear-gradient(135deg, rgba(182,122,53,.24), rgba(18, 18, 22, .84) 46%, rgba(112,69,31, .92)),
        #70451F !important;
    box-shadow:0 28px 80px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.045) !important;
}

.vote-page .zcp-hero.vote-hero::before{
    background:linear-gradient(90deg, rgba(208,154,85,.08), transparent 42%, rgba(255,255,255,.035)) !important;
    opacity:.55 !important;
}

.vote-page .zcp-eyebrow,
.vote-page .zcp-section-kicker,
.vote-page .zcp-badge,
.vote-page .zcp-type{
    border:1px solid rgba(208,154,85,.28) !important;
    background:rgba(208,154,85,.12) !important;
    color:#ffffff !important;
    box-shadow:none !important;
    text-shadow:none !important;
}

.vote-page .zcp-title,
.vote-page .zcp-section-title,
.vote-page h1,
.vote-page h2,
.vote-page h3,
.vote-page .zcp-card h3,
.vote-page .zcp-pack h3,
.vote-page .zcp-note h3{
    color:#ffffff !important;
    background:none !important;
    -webkit-background-clip:initial !important;
    background-clip:initial !important;
    text-shadow:0 10px 30px rgba(0,0,0,.45) !important;
}

.vote-page .zcp-subtitle{
    color:rgba(255,255,255,.78) !important;
}

.vote-page .zcp-hero-panel,
.vote-page .zcp-stat,
.vote-page .zcp-card,
.vote-page .zcp-pack,
.vote-page .zcp-note,
.vote-page .zcp-alert,
.vote-page .zcp-empty{
    border:1px solid rgba(255, 255, 255, .10) !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.014)),
        #121316 !important;
    box-shadow:0 20px 55px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.045) !important;
}

.vote-page .zcp-card,
.vote-page .zcp-pack,
.vote-page .zcp-note{
    transition:border-color .22s ease, transform .22s ease, box-shadow .22s ease, background .22s ease !important;
}

.vote-page .zcp-card:hover,
.vote-page .zcp-pack:hover,
.vote-page .zcp-note:hover{
    transform:translateY(-3px) !important;
    border-color:rgba(208,154,85,.30) !important;
    background:
        linear-gradient(160deg, rgba(208,154,85,.085), transparent 36%),
        linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.014)),
        #121316 !important;
    box-shadow:0 26px 70px rgba(0,0,0,.38), 0 0 0 1px rgba(208,154,85,.05) !important;
}

.vote-page .zcp-stat b,
.vote-page .zcp-cp,
.vote-page strong,
.vote-page b{
    color:#D09A55 !important;
}

.vote-page .zcp-stat span{
    color:rgba(255,255,255,.62) !important;
}

.vote-page .zcp-vote-card .zcp-cp{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin:18px 0 16px;
    padding:14px 16px;
    border-radius:14px;
    background:rgba(255,255,255,.045) !important;
    border:1px solid rgba(255,255,255,.055) !important;
    color:#D09A55 !important;
    font-weight:900 !important;
}

.vote-page .zcp-btn.primary,
.vote-page button.zcp-btn.primary,
.vote-page a.zcp-btn.primary{
    border:1px solid rgba(255,255,255,.12) !important;
    background:linear-gradient(180deg, #D09A55, #B67A35) !important;
    color:#ffffff !important;
    box-shadow:0 14px 30px rgba(182,122,53,.30), inset 0 1px 0 rgba(255,255,255,.18) !important;
    text-shadow:none !important;
}

.vote-page .zcp-btn.primary:hover,
.vote-page button.zcp-btn.primary:hover,
.vote-page a.zcp-btn.primary:hover{
    background:linear-gradient(180deg, #D09A55, #B67A35) !important;
    box-shadow:0 18px 42px rgba(182,122,53,.38), inset 0 1px 0 rgba(255,255,255,.22) !important;
}

.vote-page .zcp-btn.ghost,
.vote-page button.zcp-btn.ghost,
.vote-page a.zcp-btn.ghost{
    border:1px solid rgba(208,154,85,.28) !important;
    background:rgba(208,154,85,.08) !important;
    color:#ffffff !important;
    box-shadow:none !important;
}

.vote-page .zcp-btn.ghost:hover,
.vote-page button.zcp-btn.ghost:hover,
.vote-page a.zcp-btn.ghost:hover{
    border-color:rgba(208,154,85,.42) !important;
    background:rgba(208,154,85,.14) !important;
}

.vote-page .zcp-btn[disabled],
.vote-page button[disabled]{
    opacity:.62 !important;
    cursor:not-allowed !important;
}

.vote-page .zcp-section-head{
    border-bottom:1px solid rgba(208,154,85,.22) !important;
    padding-bottom:16px !important;
}

.vote-page .zcp-grid.three .zcp-vote-card{
    min-height:260px;
    display:flex;
    flex-direction:column;
}

.vote-page .zcp-vote-card form,
.vote-page .zcp-vote-card .zcp-btn{
    margin-top:auto;
}

.vote-page .zcp-note{
    align-items:center;
}

.vote-page .zcp-alert.success{
    border-color:rgba(77, 220, 132, .25) !important;
    color:#ffffff !important;
}

.vote-page .zcp-alert.error{
    border-color:rgba(208,154,85,.35) !important;
    color:#ffffff !important;
}

@media (max-width: 900px){
    .vote-page .zcp-grid.three .zcp-vote-card{
        min-height:0;
    }
}


/* =========================================================
   GoldenConquer V3 — final dark-charcoal vote source of truth
   Keep bronze as accent only; never as a large page surface.
   ========================================================= */
body:has(.vote-page){
  background:
    radial-gradient(900px 440px at 18% 12%, rgba(208,154,85,.10), transparent 62%),
    radial-gradient(760px 420px at 84% 20%, rgba(182,122,53,.06), transparent 64%),
    linear-gradient(180deg, #09090a 0%, #0b0b0c 48%, #09090a 100%) !important;
}
.vote-page::before{
  background:
    radial-gradient(circle at 50% 0%, rgba(208,154,85,.09), transparent 36%),
    radial-gradient(circle at 16% 16%, rgba(182,122,53,.05), transparent 30%),
    linear-gradient(180deg, #09090a 0%, #0b0b0c 48%, #09090a 100%) !important;
}
.vote-page::after{
  background:linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.34)) !important;
  opacity:.42 !important;
}
.vote-page .zcp-hero.vote-hero{
  border-color:rgba(208,154,85,.16) !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(208,154,85,.08), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.028), rgba(255,255,255,.008)),
    rgba(16,16,18,.97) !important;
  box-shadow:0 24px 70px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
.vote-page .zcp-hero-panel,
.vote-page .zcp-stat,
.vote-page .zcp-card,
.vote-page .zcp-pack,
.vote-page .zcp-note,
.vote-page .zcp-alert,
.vote-page .zcp-empty,
.vote-page .zcp-vote-card{
  border-color:rgba(208,154,85,.14) !important;
  background:
    linear-gradient(160deg, rgba(208,154,85,.045), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.028), rgba(255,255,255,.008)),
    rgba(16,16,18,.96) !important;
  box-shadow:0 22px 60px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
.vote-page .zcp-eyebrow,
.vote-page .zcp-section-kicker,
.vote-page .zcp-badge,
.vote-page .zcp-type{
  color:#d09a55 !important;
  border-color:rgba(208,154,85,.22) !important;
  background:rgba(208,154,85,.07) !important;
  box-shadow:none !important;
}
.vote-page .zcp-title,
.vote-page .zcp-section-title,
.vote-page h1,
.vote-page h2,
.vote-page h3,
.vote-page .zcp-card h3,
.vote-page .zcp-pack h3,
.vote-page .zcp-note h3{
  color:#ffffff !important;
  background:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  text-shadow:0 8px 26px rgba(0,0,0,.42) !important;
}
.vote-page .zcp-subtitle,
.vote-page .zcp-section-note,
.vote-page p,
.vote-page time,
.vote-page .zcp-stat span{
  color:rgba(255,255,255,.72) !important;
}
.vote-page .zcp-stat b,
.vote-page .zcp-cp,
.vote-page strong,
.vote-page b{
  color:#d09a55 !important;
}
.vote-page .zcp-vote-card .zcp-cp{
  background:rgba(208,154,85,.045) !important;
  border-color:rgba(208,154,85,.12) !important;
  color:#d09a55 !important;
}
.vote-page .zcp-btn.primary,
.vote-page button.zcp-btn.primary,
.vote-page a.zcp-btn.primary{
  border-color:rgba(208,154,85,.26) !important;
  background:linear-gradient(180deg, #d09a55 0%, #b67a35 100%) !important;
  color:#ffffff !important;
  box-shadow:0 14px 30px rgba(182,122,53,.22), inset 0 1px 0 rgba(255,255,255,.14) !important;
}
.vote-page .zcp-btn.ghost,
.vote-page button.zcp-btn.ghost,
.vote-page a.zcp-btn.ghost{
  border-color:rgba(208,154,85,.16) !important;
  background:rgba(208,154,85,.045) !important;
  color:#ffffff !important;
  box-shadow:none !important;
}
.vote-page .zcp-card:hover,
.vote-page .zcp-pack:hover,
.vote-page .zcp-note:hover{
  transform:translateY(-3px) !important;
  border-color:rgba(208,154,85,.22) !important;
  background:
    linear-gradient(160deg, rgba(208,154,85,.065), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.032), rgba(255,255,255,.010)),
    rgba(16,16,18,.97) !important;
  box-shadow:0 26px 70px rgba(0,0,0,.38) !important;
}

