/* Color-only dialog finish. Geometry, form contracts, assets and status icons stay in their owning styles. */
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog {
    --gold-dialog-surface: linear-gradient(134deg, #3F3F3F 0px, #101010 5%, rgba(28,28,28,.68) 30%, rgba(0,0,0,.45) 50%, rgba(41,41,41,.59) 70%, #101010 95%, #3F3F3F);
    background: rgba(0,0,0,.6);
    color: var(--gold-text, #fff);
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .pop_login_box,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .pop_join_box,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .modal-container {
    background: var(--gold-dialog-surface);
    background-color: #101010;
    border-color: #212121;
}

/* Full-screen signup overlays already supply their own dimming layer. */
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog[data-ho-dialog="join"],
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog[data-ho-dialog="anonymous"],
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog[data-ho-dialog="join"] > .pop_join_box,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog[data-ho-dialog="anonymous"] > .pop_join_box {
    background: transparent;
    border-color: transparent;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .modal-overlay {
    background: rgba(0,0,0,.6);
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .modal-header {
    border-color: #3F3F3F;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .pop_login_sub_ttl,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-captcha label {
    color: #999;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .form-label,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .pop_join_info {
    color: var(--gold-text, #fff);
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .out_login_ip,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-captcha input,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .pop_join_box.join_form_one .ip_code,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .form-input {
    background: rgba(50,50,50,.9);
    border-color: #555;
    color: #fff;
    caret-color: #FEC65E;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog input::placeholder,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog textarea::placeholder {
    color: #999;
    opacity: 1;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .form-input option {
    background: #262626;
    color: #fff;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .out_login_ip:focus,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-captcha input:focus,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .pop_join_box.join_form_one .ip_code:focus,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .form-input:focus {
    background: rgba(50,50,50,.9);
    border-color: var(--gold-edge, #DBBA7A);
    box-shadow: none;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog input[readonly] {
    background: #262626;
    color: #CCC;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .input-icon {
    color: #CAA257;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .help-text:not(.error):not(.success) {
    color: #B5B5B5;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog input:focus-visible,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog select:focus-visible,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog a:focus-visible {
    outline-color: #FEC65E;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog input:disabled,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog select:disabled {
    background: #333;
    border-color: #555;
    color: #AAA;
    box-shadow: none;
    text-shadow: none;
}

/* Announcement artwork retains its own colors. */
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-announcements .pop_blind_box {
    background: rgba(0,0,0,.6);
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-announcements .popup_box,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-announcements .popup_content {
    background: #101010;
    border-color: #212121;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-announcements .popup_btn_box {
    background: linear-gradient(134deg, #3F3F3F 0px, #101010 5%, rgba(28,28,28,.68) 30%, rgba(0,0,0,.45) 50%, rgba(41,41,41,.59) 70%, #101010 95%, #3F3F3F);
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-announcements .popup_title {
    color: #FFE9A5;
}

/* SweetAlert's error, warning and success icon palettes remain semantic. */
body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-container.swal2-backdrop-show {
    background: rgba(0,0,0,.6);
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-popup {
    background: linear-gradient(134deg, #3F3F3F 0px, #101010 5%, rgba(28,28,28,.68) 30%, rgba(0,0,0,.45) 50%, rgba(41,41,41,.59) 70%, #101010 95%, #3F3F3F);
    color: #fff;
    box-shadow: inset 0 0 0 1px #212121, 0 15px 40px rgba(0,0,0,.5);
    /* The global transition would make non-animated alerts wait for an event that never fires. */
    transition: none;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-title,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-html-container {
    color: #fff;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-loader {
    border-color: #DBBA7A transparent #DBBA7A transparent;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-input,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-textarea,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-select {
    background: rgba(50,50,50,.9);
    border-color: #555;
    color: #fff;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-input::placeholder,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-textarea::placeholder {
    color: #999;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-input:focus,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-textarea:focus,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-select:focus {
    border-color: #DBBA7A;
    box-shadow: 0 0 0 3px rgba(219,186,122,.3);
}

/* Dialog actions keep one fixed metal surface while their base colors ease between states. */
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog :is(.pop_login_btn, .submit-btn, .ip_sm, .btn_mid, .btn_pop_join, .reference-check-button, .close_login_pop, .close_join_pop, .close-btn, .sns_info_btn.tele),
body:is(.reference-body, .gold-typography, [data-gold-typography]) .lb-transfer-dialog button:first-child,
body:is(.reference-body, .gold-typography, [data-gold-typography]) :is(.reference-announcements button, .swal2-styled, .swal2-close, .lb-transfer-dialog button) {
    background: var(--dialog-control-surface, var(--gold-action-surface)) var(--dialog-control-base, var(--gold-action-base));
    border-color: var(--dialog-control-border, var(--gold-action-border));
    color: var(--dialog-control-ink, var(--gold-action-ink));
    text-shadow: none;
    box-shadow: var(--dialog-control-shadow, var(--gold-small-shadow));
    transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease, color 180ms ease, transform 300ms ease;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .pop_join_box.join_form_one .ip_sm,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-join-sms .btn_mid,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-announcements .btn_close_all_popup,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-confirm,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .lb-transfer-dialog button:first-child {
    font-weight: 700;
}

/* Compact verification retains the established small-button finish. */
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-join-sms .btn_mid {
    --dialog-control-surface: var(--gold-small-surface);
    --dialog-control-base: var(--gold-small-base);
    --dialog-control-hover: var(--gold-small-hover);
    --dialog-control-active: var(--gold-small-active);
    --dialog-control-border: var(--gold-small-border);
    --dialog-control-hover-border: var(--gold-small-hover-border);
    --dialog-control-ink: var(--gold-small-ink);
}

/* Secondary actions and recovery directions remain warm charcoal. */
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .btn_pop_join,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-anonymous-choice,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-cancel,
body:is(.reference-body, .gold-typography, [data-gold-typography]) .lb-transfer-dialog button:not(:first-child) {
    --dialog-control-surface: linear-gradient(110deg, rgba(255,238,202,.04), rgba(0,0,0,.08));
    --dialog-control-base: var(--gold-control-dark);
    --dialog-control-hover: var(--gold-control-dark-hover);
    --dialog-control-active: var(--gold-control-dark-active);
    --dialog-control-border: var(--gold-control-dark-border);
    --dialog-control-hover-border: var(--gold-action-hover-border);
    --dialog-control-ink: var(--gold-control-light-ink);
    --dialog-control-shadow: inset 0 1px 0 rgba(255,241,207,.06), 0 1px 3px rgba(0,0,0,.25);
    --dialog-control-hover-shadow: inset 0 1px 0 rgba(255,241,207,.12), 0 2px 4px rgba(0,0,0,.25);
    --dialog-control-disabled-base: #29251f;
    --dialog-control-disabled-ink: #9c9180;
}

/* Icon and dismiss controls keep their transparent resting surface. */
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog :is(.reference-check-button, .close_login_pop, .close_join_pop, .close-btn),
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-announcements :is(.btn_one_day, .btn_close),
body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-close {
    --dialog-control-surface: none;
    --dialog-control-base: transparent;
    --dialog-control-hover: var(--gold-control-dark-hover);
    --dialog-control-active: var(--gold-control-dark-active);
    --dialog-control-border: transparent;
    --dialog-control-hover-border: transparent;
    --dialog-control-ink: var(--gold-control-light-ink);
    --dialog-control-shadow: none;
    --dialog-control-hover-shadow: inset 0 0 0 1px rgba(219,190,137,.28);
    --dialog-control-disabled-base: transparent;
    --dialog-control-disabled-ink: #887e6e;
    --dialog-control-disabled-border: transparent;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-check-button {
    --dialog-control-ink: #c9ad79;
    --dialog-control-hover-ink: #efdab5;
}

/* Telegram and destructive SweetAlert actions retain their semantic hues. */
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .sns_info_btn.tele {
    --dialog-control-surface: linear-gradient(110deg, rgba(255,255,255,.07), rgba(0,0,0,.08));
    --dialog-control-base: #337fbd;
    --dialog-control-hover: #428ecb;
    --dialog-control-active: #286da5;
    --dialog-control-border: #316ea0;
    --dialog-control-hover-border: #70a4cc;
    --dialog-control-ink: #fff;
    --dialog-control-disabled-base: #36576c;
    --dialog-control-disabled-border: #355061;
    --dialog-control-disabled-ink: #aebfca;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .swal2-deny {
    --dialog-control-surface: linear-gradient(110deg, rgba(255,231,210,.08), rgba(0,0,0,.10));
    --dialog-control-base: #854643;
    --dialog-control-hover: #985552;
    --dialog-control-active: #6e3633;
    --dialog-control-border: #78413c;
    --dialog-control-hover-border: #b07268;
    --dialog-control-ink: #fff0e5;
    --dialog-control-disabled-base: #574541;
    --dialog-control-disabled-border: #634e46;
    --dialog-control-disabled-ink: #b7a49b;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog :is(.pop_login_btn, .submit-btn, .ip_sm, .btn_mid, .btn_pop_join, .reference-check-button, .close_login_pop, .close_join_pop, .close-btn, .sns_info_btn.tele):is(:hover, :focus-visible):not(:disabled):not([aria-disabled="true"]),
body:is(.reference-body, .gold-typography, [data-gold-typography]) :is(.reference-announcements button, .swal2-styled, .swal2-close, .lb-transfer-dialog button):is(:hover, :focus-visible):not(:disabled):not([aria-disabled="true"]) {
    background: var(--dialog-control-surface, var(--gold-action-surface)) var(--dialog-control-hover, var(--gold-action-hover));
    border-color: var(--dialog-control-hover-border, var(--gold-action-hover-border));
    color: var(--dialog-control-hover-ink, var(--dialog-control-ink, var(--gold-action-ink)));
    text-shadow: none;
    box-shadow: var(--dialog-control-hover-shadow, inset 0 1px 0 rgba(255,247,224,.34), 0 2px 4px rgba(0,0,0,.25));
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog :is(.pop_login_btn, .submit-btn, .ip_sm, .btn_mid, .btn_pop_join, .reference-check-button, .close_login_pop, .close_join_pop, .close-btn, .sns_info_btn.tele):active:not(:disabled):not([aria-disabled="true"]),
body:is(.reference-body, .gold-typography, [data-gold-typography]) :is(.reference-announcements button, .swal2-styled, .swal2-close, .lb-transfer-dialog button):active:not(:disabled):not([aria-disabled="true"]) {
    background: var(--dialog-control-surface, var(--gold-action-surface)) var(--dialog-control-active, var(--gold-action-active));
    border-color: var(--dialog-control-border, var(--gold-action-border));
    color: var(--dialog-control-ink, var(--gold-action-ink));
    box-shadow: inset 0 2px 3px rgba(34,24,12,.28);
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog :is(button, .sns_info_btn.tele):focus-visible,
body:is(.reference-body, .gold-typography, [data-gold-typography]) :is(.reference-announcements button, .swal2-styled, .swal2-close, .lb-transfer-dialog button):focus-visible {
    outline: 2px solid #ead3a8;
    outline-offset: 2px;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog :is(.pop_login_btn, .submit-btn, .ip_sm, .btn_mid, .btn_pop_join, .reference-check-button, .close_login_pop, .close_join_pop, .close-btn, .sns_info_btn.tele):is(:disabled, [aria-disabled="true"]),
body:is(.reference-body, .gold-typography, [data-gold-typography]) :is(.reference-announcements button, .swal2-styled, .swal2-close, .lb-transfer-dialog button):is(:disabled, [aria-disabled="true"]) {
    background: var(--dialog-control-surface, var(--gold-action-surface)) var(--dialog-control-disabled-base, #897b61);
    border-color: var(--dialog-control-disabled-border, #6e624e);
    color: var(--dialog-control-disabled-ink, #393126);
    text-shadow: none;
    opacity: 1;
    box-shadow: none;
    cursor: not-allowed;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .lb-transfer-dialog button span {
    color: inherit;
}

/* Recolor the server image without changing its challenge, noise or geometry. */
body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-captcha #captchaImg {
    filter: grayscale(1) sepia(1) saturate(1.2);
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-anonymous-choice[hidden] {
    display: none;
}

@media screen and (max-width: 767px) {
    body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .pop_join_box.join_form_one .reference-anonymous-choice:not([hidden]) {
        display: block;
        margin: 8px auto;
        color: var(--gold-control-light-ink);
    }
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-captcha #captchaImgWrap {
    transition: box-shadow 180ms ease;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-captcha #captchaImgWrap:is(:hover, :focus-visible):not(:disabled):not([aria-disabled="true"]) {
    box-shadow: 0 0 0 2px rgba(234,211,168,.65);
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-captcha #captchaImgWrap:active:not(:disabled):not([aria-disabled="true"]) {
    box-shadow: 0 0 0 2px #a88a58;
}

body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-captcha #captchaImgWrap:is(:disabled, [aria-disabled="true"]) {
    opacity: .55;
    box-shadow: none;
    cursor: not-allowed;
}

@media (prefers-reduced-motion: reduce) {
    body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog :is(button, .sns_info_btn.tele),
    body:is(.reference-body, .gold-typography, [data-gold-typography]) .reference-dialog .reference-captcha #captchaImgWrap,
    body:is(.reference-body, .gold-typography, [data-gold-typography]) :is(.reference-announcements button, .swal2-styled, .swal2-close, .lb-transfer-dialog button) {
        transition: none;
    }
}