/* Rust Hub hosted Vote page. All layout rules stay inside this page. */
.rh-vote-page{--vote-line:#283239;--vote-muted:#a9bac6;padding:34px 22px 26px;color:#f4f6f7;background:#080b0d}
.rh-vote-page *{box-sizing:border-box}
.rh-vote-page [hidden]{display:none!important}
.rh-vote-page h1,.rh-vote-page h2,.rh-vote-page h3,.rh-vote-page p{margin:0}
.rh-vote-page h1,.rh-vote-page h2,.rh-vote-page h3{font-family:inherit;letter-spacing:-.035em;line-height:1.15;color:#f4f6f7;text-wrap:balance}
.rh-vote-page-heading{margin:0 0 24px}
.rh-vote-page-heading h1{font-size:clamp(30px,3.5vw,44px);font-weight:900}
.rh-vote-page-heading p{margin-top:10px;color:var(--vote-muted);font-size:16px;line-height:1.55}
.rh-vote-kicker,.rh-vote-card-label{display:block;font-size:11px;font-weight:800;line-height:1.5;letter-spacing:.16em;text-transform:uppercase}
.rh-vote-kicker{color:var(--rh-accent,#ef481f)}
.rh-vote-banner{position:relative;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);border:1px solid var(--vote-line);border-radius:10px;background:#090f12;overflow:hidden}
.rh-vote-banner-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:20px;padding:30px;min-width:0;background:linear-gradient(120deg,#0d161b,#090f12)}
.rh-vote-banner h2{max-width:100%;font-size:clamp(25px,3.15vw,43px);font-weight:900;overflow-wrap:anywhere}
.rh-vote-server-detail{display:block;margin-top:10px;font-size:.58em;line-height:1.45;color:#bac7cf;font-weight:650;letter-spacing:-.015em}
.rh-vote-count{display:inline-flex;align-items:center;flex-wrap:wrap;gap:8px;max-width:100%;padding:9px 13px;border:1px solid var(--vote-line);border-radius:30px;background:#0b151b;color:var(--vote-muted);font-size:12px;line-height:1.4}
.rh-vote-count strong{color:#dce5eb;font-weight:700}
.rh-vote-art{min-width:0;display:flex;align-items:center;justify-content:center;background:#060a0c;min-height:290px}
.rh-vote-art img{display:block;width:100%;height:100%;max-height:390px;object-fit:contain}
.rh-vote-page .rh-vote-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:12px 18px;border:1px solid color-mix(in srgb,var(--rh-accent,#ef481f) 78%,white);border-radius:7px;background:var(--rh-accent,#ef481f);color:#fff;font-family:inherit;font-size:13px;font-weight:800;line-height:1.35;text-align:center;text-decoration:none;cursor:pointer;transition:filter .15s,border-color .15s}
.rh-vote-page .rh-vote-button:hover{filter:brightness(1.12);text-decoration:none}
.rh-vote-page .rh-vote-button.is-secondary{background:#0c151a;border-color:#35444e;color:#eaf0f4}
.rh-vote-page .rh-vote-button:focus-visible,.rh-vote-page select:focus-visible{outline:2px solid #e4f0f9;outline-offset:4px}
.rh-vote-page .rh-vote-button:disabled{cursor:default;opacity:.6;filter:none}
.rh-vote-page .rh-vote-change{min-height:40px;padding:9px 14px;font-size:12px}
.rh-vote-panels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}
.rh-vote-card{display:flex;flex-direction:column;min-width:0;padding:24px;border:1px solid var(--vote-line);border-radius:10px;background:linear-gradient(130deg,#101a20,#0a1115)}
.rh-vote-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:29px;margin-bottom:12px}
.rh-vote-card-label{color:#cbd7df;font-size:10px}
.rh-vote-status{display:inline-flex;align-items:center;gap:7px;padding:6px 9px;border:1px solid #285743;border-radius:6px;background:#10281f;color:#8ee6b3;font-size:10px;font-weight:750;line-height:1.4;white-space:nowrap}
.rh-vote-status:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.rh-vote-status.is-cooldown{color:#ffb5c1;border-color:#873743;background:#361820}
.rh-vote-card h3{font-size:clamp(21px,2.2vw,28px);font-weight:850}
.rh-vote-card>p{margin-top:9px;font-size:14px;line-height:1.5;color:var(--vote-muted)}
.rh-vote-clock{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:17px 0 20px}
.rh-vote-clock>div{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:96px;padding:12px 4px;border:1px solid #80333f;border-radius:8px;background:linear-gradient(135deg,#2b141b,#171015)}
.rh-vote-clock strong{font-variant-numeric:tabular-nums;letter-spacing:.02em;font-size:clamp(30px,3.3vw,42px);font-weight:850;line-height:1.1;color:#ffc2cd}
.rh-vote-clock span{margin-top:7px;font-size:10px;line-height:1.3;font-weight:750;letter-spacing:.1em;text-transform:uppercase;color:#ed8297}
.rh-vote-page .rh-vote-button.is-cooldown{color:#ffc2cd;border-color:#8f3b49;background:#441921}
.rh-vote-ready{margin:17px 0 20px;padding:16px 18px;min-height:96px;border:1px solid var(--vote-line);border-radius:8px;background:#0c161c}
.rh-vote-ready>strong{display:block;color:#dbe6ed;font-size:16px;line-height:1.5}
.rh-vote-ready p{margin-top:5px;color:var(--vote-muted);font-size:12px;line-height:1.65}
.rh-vote-coin-row{display:flex;align-items:center;gap:18px;flex:1;margin:0 0 20px;min-height:190px}
.rh-vote-coin-row img{flex:0 0 auto;width:clamp(135px,13.4vw,192px);height:auto;object-fit:contain;filter:drop-shadow(0 10px 16px #0005)}
.rh-vote-coin-row>div{min-width:0}
.rh-vote-coin-row p{margin-top:12px;color:var(--vote-muted);font-size:14px;line-height:1.7}
.rh-vote-page .rh-vote-card-action{margin-top:auto;width:100%;flex-shrink:0}
.rh-vote-guidance{margin-top:16px!important;padding:14px 20px;border:1px solid var(--vote-line);border-radius:8px;background:#0b1318;color:var(--vote-muted);font-size:12px;line-height:1.65;text-align:center}
.rh-vote-page-note{padding:14px 12px 0;color:#8397a6;font-size:10px;line-height:1.6;text-align:center}
.rh-vote-select-form{margin-bottom:16px;padding:18px;border:1px solid #3a4953;border-radius:9px;background:#101b22}
.rh-vote-select-form label{display:block;margin-bottom:10px;color:#dfe8ee;font-size:13px;font-weight:750}
.rh-vote-select-fields{display:flex;gap:12px;align-items:stretch}
.rh-vote-select-fields select{display:block;flex:1;min-width:0;max-width:100%;border:1px solid #3a4953;border-radius:6px;padding:12px;color:#e8eef2;background:#0b1318;font:inherit;font-size:13px}
.rh-vote-empty{display:flex;align-items:center;flex-direction:column;gap:16px;padding:50px 16px;text-align:center}
.rh-vote-empty h1{font-size:32px}
.rh-vote-empty p{color:var(--vote-muted);line-height:1.6}
.rh-vote-empty img{width:144px;height:144px;object-fit:contain}
@media(min-width:901px){.page-vote .rh-site-nav{gap:16px}.page-vote .rh-site-nav a{padding:12px 13px;border:1px solid transparent;border-radius:7px}.page-vote .rh-site-nav a[aria-current="page"]{border-color:color-mix(in srgb,var(--rh-accent) 60%,transparent);background:color-mix(in srgb,var(--rh-accent) 16%,#080b0d)}.page-vote .rh-site-nav a::after{display:none}}
@media(max-width:1060px){.rh-vote-banner-copy{padding:24px}.rh-vote-card{padding:20px}.rh-vote-coin-row{gap:12px}.rh-vote-coin-row img{width:132px}.rh-vote-coin-row h3{font-size:22px}.rh-vote-coin-row p{font-size:13px}}
@media(max-width:820px){.rh-vote-page{padding:28px 18px 22px}.rh-vote-banner{grid-template-columns:1fr 1fr}.rh-vote-banner-copy{padding:22px;gap:16px}.rh-vote-art{min-height:240px}.rh-vote-panels{gap:12px}.rh-vote-card{padding:18px}.rh-vote-card h3{font-size:22px}.rh-vote-card-top{gap:8px}.rh-vote-status{font-size:9px}.rh-vote-coin-row{flex-direction:column;text-align:center;gap:12px;margin-top:4px}.rh-vote-coin-row img{width:124px}.rh-vote-coin-row p{margin-top:8px}.rh-vote-clock{gap:6px}.rh-vote-clock>div{min-height:88px}}
@media(max-width:620px){.rh-vote-page{padding:24px 14px 20px}.rh-vote-page-heading{margin-bottom:20px}.rh-vote-page-heading h1{font-size:31px}.rh-vote-page-heading p{font-size:13px}.rh-vote-banner{grid-template-columns:1fr}.rh-vote-art{grid-row:1;min-height:0;aspect-ratio:16/9}.rh-vote-art img{max-height:none}.rh-vote-banner-copy{padding:22px;gap:14px}.rh-vote-banner h2{font-size:29px}.rh-vote-server-detail{font-size:17px;line-height:1.5;margin-top:6px}.rh-vote-kicker{font-size:10px}.rh-vote-count{font-size:11px;padding:8px 11px}.rh-vote-panels{grid-template-columns:1fr;margin-top:14px;gap:14px}.rh-vote-card{padding:20px}.rh-vote-card h3{font-size:24px}.rh-vote-card-top{margin-bottom:14px}.rh-vote-status{font-size:10px}.rh-vote-clock{gap:8px;margin-top:18px}.rh-vote-clock strong{font-size:37px}.rh-vote-clock>div{min-height:94px}.rh-vote-coin-row{flex-direction:row;text-align:left;gap:16px;margin-top:0;min-height:150px}.rh-vote-coin-row img{width:122px}.rh-vote-coin-row h3{font-size:23px}.rh-vote-coin-row p{font-size:12px}.rh-vote-guidance{text-align:left;padding:14px 16px}.rh-vote-page-note{text-align:left;padding:14px 3px 0}.rh-vote-select-fields{flex-direction:column}.rh-vote-select-fields select{width:100%}}
@media(max-width:360px){.rh-vote-page-heading h1{font-size:28px}.rh-vote-card{padding:16px}.rh-vote-card h3{font-size:21px}.rh-vote-clock strong{font-size:32px}.rh-vote-clock span{font-size:8px}.rh-vote-coin-row{gap:12px}.rh-vote-coin-row img{width:98px}.rh-vote-coin-row h3{font-size:20px}.rh-vote-status{font-size:9px}}
@media(prefers-reduced-motion:reduce){.rh-vote-page .rh-vote-button{transition:none}}

/* Share Appearance's illuminated border toggle, accent and brightness.
   The website template and live preview already maintain these variables. */
.has-panel-glow .rh-vote-page .rh-vote-banner,
.has-panel-glow .rh-vote-page .rh-vote-card,
.has-panel-glow .rh-vote-page .rh-vote-guidance,
.has-panel-glow .rh-vote-page .rh-vote-select-form {
    border-color: var(--rh-panel-edge-color);
    box-shadow: none;
}

/* A continuous server banner, with a soft transition into the actual artwork.
   Keep the image contained: owners may have lettering near its edges. */
.rh-vote-banner {
    --vote-banner-base: #090f12;
    isolation: isolate;
    background: var(--vote-banner-base);
}

.rh-vote-banner-copy {
    position: relative;
    z-index: 1;
    background: transparent;
}

.rh-vote-banner-copy::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background: radial-gradient(
        ellipse at 0% 20%,
        color-mix(in srgb, var(--rh-accent, #ef481f) 12%, transparent),
        transparent 72%
    );
    pointer-events: none;
}

.rh-vote-banner h2 {
    text-shadow: 0 3px 18px #0005;
}

.rh-vote-art {
    position: relative;
    background: var(--vote-banner-base);
}

.rh-vote-art::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        var(--vote-banner-base) 0%,
        rgb(9 15 18 / 80%) 7%,
        rgb(9 15 18 / 28%) 19%,
        rgb(9 15 18 / 0%) 34%
    );
    pointer-events: none;
}

/* On phones the artwork sits above the title, so blend its lower edge. */
@media (max-width: 620px) {
    .rh-vote-art::after {
        background: linear-gradient(
            0deg,
            var(--vote-banner-base) 0%,
            rgb(9 15 18 / 75%) 7%,
            rgb(9 15 18 / 20%) 20%,
            rgb(9 15 18 / 0%) 36%
        );
    }

    .rh-vote-banner-copy::before {
        background: radial-gradient(
            ellipse at 0% 100%,
            color-mix(in srgb, var(--rh-accent, #ef481f) 12%, transparent),
            transparent 72%
        );
    }
}