/* =========================================================
   L2 HASTE UCP — Emerald Citadel redesign
   Keeps the original AtualStudio PHP/HTML functionality.
   ========================================================= */
:root {
    --haste-bg: #020906;
    --haste-panel: #06140e;
    --haste-panel-2: #091c13;
    --haste-line: rgba(35,255,126,.28);
    --haste-line-soft: rgba(35,255,126,.11);
    --haste-green: #20f477;
    --haste-green-2: #00b957;
    --haste-mint: #b8ffd2;
    --haste-text: #d7e7dc;
    --haste-muted: #789184;
    --haste-danger: #ff4d63;
}

* {
    box-sizing: border-box
}

html,body {
    min-height: 100%;
    margin: 0
}

body {
    color: var(--haste-text)!important;
    font-family: Arial,Helvetica,sans-serif!important;
    background: linear-gradient(180deg,rgba(0,10,6,.20) 0,rgba(1,7,4,.92) 560px,#020704 100%), url('../imgs/haste-ucp-bg.jpg') center top/cover fixed no-repeat, #020704!important;
}

body:before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -1;
    background-image: linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
    background-size: 38px 38px;
    mask-image: linear-gradient(to bottom,transparent,black 28%,black 80%,transparent);
}

a {
    color: var(--haste-green);
    text-decoration: none;
    transition: .2s ease
}

a:hover {
    color: #fff
}

.euphoria-logo,.server_status {
    display: none!important
}

section[class] {
    display: block!important;
    width: min(1180px,calc(100% - 30px))!important;
    margin: 34px auto 70px!important;
    padding: 0!important;
    background: transparent!important;
    border: 0!important;
    box-shadow: none!important;
}

.header {
    position: relative!important;
    display: flex!important;
    align-items: flex-end!important;
    justify-content: space-between!important;
    min-height: 310px!important;
    padding: 0 28px 22px!important;
    overflow: hidden!important;
    background: url('../imgs/haste-ucp-hero.jpg') center top/cover no-repeat!important;
    border: 1px solid rgba(41,255,125,.38)!important;
    border-radius: 18px 18px 0 0!important;
    box-shadow: 0 28px 80px rgba(0,0,0,.62),inset 0 -110px 100px rgba(0,13,7,.88)!important;
}

.header:before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,transparent 35%,rgba(0,12,7,.25) 60%,rgba(0,12,7,.96) 100%);
    pointer-events: none
}

.header:after {
    content: "ACCOUNT CONTROL";
    position: absolute;
    left: 28px;
    bottom: 53px;
    color: #86a994;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 4px;
    text-transform: uppercase
}

.header .icon-top {
    display: none!important
}

.header .server-name {
    position: relative;
    z-index: 2;
    display: inline-flex!important;
    align-items: center!important;
    min-height: 44px!important;
    padding: 0 17px!important;
    border: 1px solid rgba(35,255,126,.32)!important;
    border-radius: 9px!important;
    background: rgba(2,18,10,.76)!important;
    box-shadow: inset 0 1px rgba(255,255,255,.04),0 8px 28px rgba(0,0,0,.35)!important;
    color: #eafff1!important;
    font-size: 12px!important;
    font-weight: 800!important;
    letter-spacing: 2.4px!important;
    text-transform: uppercase!important;
}

.header .server-name:before {
    content: "";
    width: 8px;
    height: 8px;
    margin-right: 11px;
    border-radius: 50%;
    background: var(--haste-green);
    box-shadow: 0 0 16px var(--haste-green)
}

.header>div[style] {
    position: relative;
    z-index: 2;
    display: flex!important;
    align-items: center;
    gap: 14px;
    float: none!important
}

.langs {
    display: flex!important;
    align-items: center!important;
    gap: 8px!important;
    color: #7f9c8b!important;
    font-size: 9px!important;
    letter-spacing: 1px!important;
    text-transform: uppercase!important
}

.langs>span {
    display: flex!important;
    gap: 4px!important
}

.langs a {
    filter: saturate(.85);
    opacity: .75
}

.langs a:hover {
    opacity: 1;
    transform: translateY(-1px)
}

.opts {
    display: flex!important;
    gap: 7px!important
}

.opts a {
    display: grid!important;
    place-items: center!important;
    width: 36px!important;
    height: 36px!important;
    border: 1px solid var(--haste-line)!important;
    border-radius: 8px!important;
    background: rgba(4,24,14,.78)!important;
    color: #a9c8b4!important
}

.opts a:hover {
    border-color: var(--haste-green)!important;
    color: #fff!important;
    box-shadow: 0 0 20px rgba(32,244,119,.18)!important
}

.all {
    display: grid!important;
    grid-template-columns: 255px minmax(0,1fr)!important;
    align-items: stretch!important;
    gap: 0!important;
    width: 100%!important;
    min-height: 520px!important;
    margin: 0!important;
    padding: 0!important;
    overflow: hidden!important;
    border: 1px solid rgba(35,255,126,.26)!important;
    border-top: 0!important;
    border-radius: 0 0 18px 18px!important;
    background: linear-gradient(135deg,rgba(4,19,11,.98),rgba(2,9,6,.99))!important;
    box-shadow: 0 35px 90px rgba(0,0,0,.55)!important;
}

.menu {
    grid-column: 1!important;
    width: auto!important;
    float: none!important;
    margin: 0!important;
    padding: 25px 16px!important;
    background: linear-gradient(180deg,#071b11,#030b07)!important;
    border-right: 1px solid var(--haste-line-soft)!important
}

.menu>div,.menu>div>div {
    height: 100%!important
}

.miniLogo {
    height: 74px!important;
    margin: 0 0 17px!important;
    background: none!important;
    position: relative!important
}

.miniLogo:before {
    content: "Donate Panel";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    border: 1px solid var(--haste-line-soft);
    border-radius: 10px;
    background: radial-gradient(circle at 50% 0,rgba(32,244,119,.16),transparent 65%),#06120c;
    color: #eafff1;
    font-family: Georgia,'Times New Roman',serif;
    font-size: 22px;
    letter-spacing: 4px;
    text-shadow: 0 0 18px rgba(32,244,119,.35)
}

nav,nav nav {
    display: flex!important;
    flex-direction: column!important;
    gap: 7px!important;
    width: 100%!important;
    background: none!important
}

nav a {
    position: relative!important;
    display: flex!important;
    align-items: center!important;
    min-height: 46px!important;
    padding: 0 13px!important;
    border: 1px solid transparent!important;
    border-radius: 9px!important;
    background: rgba(255,255,255,.018)!important;
    color: #91a99a!important;
    font-size: 10px!important;
    font-weight: 700!important;
    letter-spacing: 1px!important;
    text-transform: uppercase!important;
}

nav a .icon {
    display: grid!important;
    place-items: center!important;
    width: 29px!important;
    height: 29px!important;
    margin-right: 10px!important;
    border: 1px solid rgba(35,255,126,.16)!important;
    border-radius: 7px!important;
    background: #07180f!important;
    color: #38d876!important
}

nav a:hover,nav a.actived {
    padding-left: 17px!important;
    border-color: rgba(35,255,126,.34)!important;
    background: linear-gradient(90deg,rgba(19,176,82,.20),rgba(6,30,17,.28))!important;
    color: #fff!important;
    box-shadow: inset 3px 0 var(--haste-green)!important
}

.bluArea {
    grid-column: 2!important;
    width: auto!important;
    float: none!important;
    margin: 0!important;
    padding: 0!important;
    background: transparent!important
}

.whitArea {
    width: auto!important;
    min-height: 100%!important;
    float: none!important;
    margin: 0!important;
    padding: 36px!important;
    background: radial-gradient(circle at 80% 0,rgba(22,196,91,.06),transparent 38%),linear-gradient(180deg,#06120c,#030a07)!important;
    color: var(--haste-text)!important
}

article {
    width: 100%!important;
    float: none!important;
    margin: 0!important;
    padding: 0!important;
    background: none!important;
    color: var(--haste-text)!important;
    box-shadow: none!important
}

article h1,article h2,article h3,.euphoria-sign-title {
    color: #e9fff0!important;
    font-family: Georgia,'Times New Roman',serif!important;
    font-weight: 400!important;
    letter-spacing: .7px!important;
    text-shadow: none!important
}

article h1 {
    margin: 0 0 24px!important;
    padding: 0 0 15px!important;
    border-bottom: 1px solid var(--haste-line-soft)!important
}

.breadcrumb {
    display: flex!important;
    align-items: center!important;
    min-height: 38px!important;
    margin: 0 0 22px!important;
    padding: 0 13px!important;
    border: 1px solid var(--haste-line-soft)!important;
    border-radius: 8px!important;
    background: rgba(8,31,18,.42)!important;
    color: #799284!important
}

.breadcrumb li {
    font-size: 9px!important;
    font-weight: 700!important;
    letter-spacing: 2px!important;
    text-transform: uppercase!important
}

.breadcrumb i {
    margin-right: 8px!important;
    color: var(--haste-green)!important
}

.smallCenter {
    width: min(540px,100%)!important;
    margin: 0 auto!important;
    padding: 31px!important;
    border: 1px solid var(--haste-line-soft)!important;
    border-radius: 14px!important;
    background: linear-gradient(145deg,rgba(10,35,21,.88),rgba(3,13,8,.96))!important;
    box-shadow: 0 24px 70px rgba(0,0,0,.34)!important
}

.euphoria-sign-title {
    margin-bottom: 27px!important;
    text-align: center!important;
    font-size: 24px!important
}

.formpadrao {
    display: block!important;
    width: 100%!important;
    margin: 0 0 14px!important;
    padding: 0!important;
    border: 0!important;
    background: none!important
}

.formpadrao>div {
    display: grid!important;
    grid-template-columns: 130px 1fr!important;
    align-items: center!important;
    gap: 12px!important
}

.formpadrao .desc {
    width: auto!important;
    height: auto!important;
    float: none!important;
    padding: 0!important;
    color: #8ba797!important;
    font-size: 9px!important;
    font-weight: 800!important;
    letter-spacing: 1.3px!important;
    text-transform: uppercase!important
}

.formpadrao .camp {
    height: auto!important;
    float: none!important
}

.formpadrao input[type=text],.formpadrao input[type=password],.formpadrao input[type=email],.formpadrao select,textarea {
    width: 100%!important;
    height: 44px!important;
    margin: 0!important;
    padding: 0 13px!important;
    border: 1px solid rgba(35,255,126,.19)!important;
    border-radius: 8px!important;
    outline: 0!important;
    background: #020b06!important;
    color: #e7f9ed!important;
    box-shadow: inset 0 2px 12px rgba(0,0,0,.35)!important
}

.formpadrao input:focus,.formpadrao select:focus,textarea:focus {
    border-color: rgba(35,255,126,.66)!important;
    box-shadow: 0 0 0 3px rgba(32,244,119,.08),inset 0 2px 12px rgba(0,0,0,.3)!important
}

.default,input.default,a.default {
    display: inline-flex!important;
    align-items: center!important;
    justify-content: center!important;
    min-width: 190px!important;
    min-height: 45px!important;
    padding: 0 25px!important;
    border: 1px solid #59ff9a!important;
    border-radius: 8px!important;
    background: linear-gradient(180deg,#30f47d,#09a94d)!important;
    color: #021108!important;
    font-size: 10px!important;
    font-weight: 900!important;
    letter-spacing: 1.5px!important;
    text-transform: uppercase!important;
    box-shadow: inset 0 1px rgba(255,255,255,.4),0 10px 28px rgba(0,184,83,.18)!important
}

.default:hover,input.default:hover,a.default:hover {
    filter: brightness(1.12)!important;
    transform: translateY(-1px)!important;
    color: #001007!important
}

.grayArea {
    margin: 15px 0!important;
    padding: 13px 15px!important;
    border: 1px solid var(--haste-line-soft)!important;
    border-radius: 8px!important;
    background: rgba(2,12,7,.72)!important;
    color: #73897d!important;
    font-size: 11px!important
}

.accessButton {
    text-align: center!important;
    margin-top: 21px!important
}

table.default,table {
    width: 100%!important;
    border-collapse: separate!important;
    border-spacing: 0!important;
    overflow: hidden!important;
    border: 1px solid var(--haste-line-soft)!important;
    border-radius: 10px!important;
    background: #041009!important;
    color: var(--haste-text)!important
}

table th {
    padding: 13px!important;
    background: #0a2517!important;
    color: #bcf7d0!important;
    font-size: 9px!important;
    letter-spacing: 1.3px!important;
    text-transform: uppercase!important;
    border-bottom: 1px solid var(--haste-line-soft)!important
}

table td {
    padding: 12px!important;
    border-bottom: 1px solid rgba(35,255,126,.07)!important;
    color: #a8b9ae!important
}

table tr:hover td {
    background: rgba(32,244,119,.035)!important
}

.rmsg {
    width: 100%!important;
    padding: 14px 16px!important;
    border: 1px solid rgba(55,231,125,.36)!important;
    border-radius: 8px!important;
    background: rgba(18,103,55,.22)!important;
    color: #d9ffe7!important
}

.rmsg.error {
    border-color: rgba(255,77,99,.5)!important;
    background: rgba(112,18,33,.28)!important
}

.rmsg.warn {
    border-color: rgba(255,190,80,.5)!important;
    background: rgba(115,72,10,.25)!important
}

.sidebar-account {
    margin-top: 16px!important;
    padding: 17px!important;
    border: 1px solid var(--haste-line-soft)!important;
    border-radius: 11px!important;
    background: linear-gradient(180deg,rgba(11,38,23,.78),rgba(3,14,8,.9))!important
}

.sidebar-user {
    display: flex!important;
    align-items: center!important;
    gap: 10px!important;
    padding-bottom: 14px!important;
    border-bottom: 1px solid var(--haste-line-soft)!important
}

.sidebar-avatar {
    flex: 0 0 46px!important;
    width: 46px!important;
    height: 46px!important;
    padding: 2px!important;
    border: 1px solid rgba(35,255,126,.4)!important;
    border-radius: 9px!important;
    background: #020905!important;
    overflow: hidden!important
}

.sidebar-avatar img {
    width: 100%!important;
    height: 100%!important;
    object-fit: cover!important
}

.sidebar-user-data {
    min-width: 0!important
}

.sidebar-user-data strong {
    display: block!important;
    overflow: hidden!important;
    color: #dffff0!important;
    font-size: 10px!important;
    letter-spacing: 1px!important;
    text-overflow: ellipsis!important;
    text-transform: uppercase!important;
    white-space: nowrap!important
}

.sidebar-user-data span {
    color: #60776a!important;
    font-size: 8px!important
}

.sidebar-balance {
    display: flex!important;
    align-items: center!important;
    flex-direction: column!important;
    justify-content: center!important;
    min-height: 83px!important;
    margin: 13px 0!important;
    border: 1px solid var(--haste-line-soft)!important;
    border-radius: 9px!important;
    background: radial-gradient(circle at 50% 0,rgba(32,244,119,.12),transparent 70%),#031008!important
}

.sidebar-balance span,.sidebar-balance small {
    color: #6f8d7b!important;
    font-size: 8px!important;
    letter-spacing: 1.5px!important;
    text-transform: uppercase!important
}

.sidebar-balance strong {
    margin: 6px 0!important;
    color: #c9ffdc!important;
    font-family: Georgia,serif!important;
    font-size: 28px!important;
    font-weight: 400!important
}

.sidebar-actions {
    display: flex!important;
    flex-direction: column!important;
    gap: 6px!important
}

.sidebar-actions a {
    min-height: 38px!important;
    padding: 0 10px!important;
    border: 1px solid rgba(35,255,126,.10)!important;
    border-radius: 7px!important;
    background: rgba(255,255,255,.018)!important;
    color: #87a192!important;
    font-size: 8px!important
}

.sidebar-actions a i {
    width: 16px!important;
    color: #2de777!important
}

.sidebar-actions a:hover {
    border-color: rgba(35,255,126,.35)!important;
    color: #fff!important;
    background: rgba(32,244,119,.07)!important
}

#backblack {
    position: fixed!important;
    inset: 0!important;
    background: rgba(0,0,0,.86)!important;
    z-index: 9998!important;
    backdrop-filter: blur(5px)!important
}

#alerta,#modal {
    position: fixed!important;
    left: 50%!important;
    top: 50%!important;
    transform: translate(-50%,-50%)!important;
    width: min(470px,calc(100vw - 34px))!important;
    padding: 27px!important;
    border: 1px solid rgba(35,255,126,.48)!important;
    border-radius: 14px!important;
    background: linear-gradient(145deg,#0b2b19,#020a06)!important;
    color: #dff5e6!important;
    box-shadow: 0 35px 100px rgba(0,0,0,.8)!important;
    z-index: 9999!important
}

.captcha>div {
    grid-template-columns: 130px 1fr 42px!important
}

.captchaImage {
    display: block!important;
    max-width: 120px!important;
    height: 38px!important;
    border-radius: 5px!important
}

.captcha a {
    display: grid!important;
    place-items: center!important;
    width: 40px!important;
    height: 40px!important;
    border: 1px solid var(--haste-line-soft)!important;
    border-radius: 7px!important;
    background: #031008!important
}

.captcha a img {
    width: 17px!important;
    height: 17px!important
}

@media(max-width: 850px) {
    section[class] {
        width:min(100% - 16px,720px)!important;
        margin-top: 8px!important
    }

    .header {
        min-height: 245px!important;
        padding: 0 16px 16px!important;
        border-radius: 12px 12px 0 0!important
    }

    .header:after {
        left: 17px;
        bottom: 48px
    }

    .header>div[style],.langs {
        display: none!important
    }

    .all {
        grid-template-columns: 1fr!important;
        border-radius: 0 0 12px 12px!important
    }

    .menu {
        grid-column: 1!important;
        border-right: 0!important;
        border-bottom: 1px solid var(--haste-line-soft)!important
    }

    .bluArea {
        grid-column: 1!important
    }

    .miniLogo {
        height: 58px!important
    }

    .whitArea {
        padding: 20px!important
    }

    .formpadrao>div {
        grid-template-columns: 1fr!important;
        gap: 7px!important
    }

    .captcha>div {
        grid-template-columns: 1fr!important
    }

    .captchaImage {
        max-width: none!important
    }

    .captcha a {
        width: 100%!important
    }

    .sidebar-account {
        display: none!important
    }
}
.donate-modern-wrap{margin:0 auto;max-width:980px;color:#eee}.donate-hero{position:relative;overflow:hidden;border:1px solid rgba(255,188,75,.22);border-radius:18px;padding:28px;background:radial-gradient(circle at top left,rgba(255,174,53,.28),transparent 34%),linear-gradient(135deg,#07190f,#07190f 65%,#07190f);box-shadow:0 18px 45px rgb(7 25 15)}.donate-hero:after{content:"";position:absolute;right:-90px;top:-90px;width:230px;height:230px;background:rgba(255,190,80,.09);border-radius:50%;filter:blur(2px)}.donate-kicker{color:#ffffff;text-transform:uppercase;font-weight:700;letter-spacing:2px;font-size:12px}.donate-title{font-size:34px;line-height:1.1;margin:8px 0 8px;color:#fff}.donate-sub{color:#ffffff;font-size:14px;max-width:650px}.donate-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:18px;margin-top:18px}.donate-card{border:1px solid rgba(255,255,255,.1);border-radius:16px;background: rgb(7 25 15);padding:20px;box-shadow:0 10px 30px rgb(13 121 76 / 22%)}.donate-label{display:block;margin:0 0 8px;color:#68ff1b;font-weight:700;font-size:13px}.donate-select,.donate-input{width:100%;box-sizing:border-box;border:1px solid rgba(255,255,255,.16);background: #07190f;color:#fff;border-radius:12px;padding:13px 14px;outline:none}.donate-row{margin-bottom:16px}.coin-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.coin-choice{position:relative}.coin-choice input{position:absolute;opacity:0}.coin-choice span{display:block;text-align:center;padding:13px 8px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background: linear-gradient(180deg, #07190f, #0d0d0d);cursor:pointer;font-weight:700;color:#ddd}.coin-choice input:checked+span{border-color: #fbfbfb;background: linear-gradient(180deg, #01d35e, #1c3516);color:#fff;box-shadow:0 0 0 2px rgba(255,179,64,.12)}.summary-line{display:flex;justify-content:space-between;gap:15px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.08);color:#cfc4b4}.summary-line b{color:#fff}.summary-total{margin-top:16px;border-radius:14px;padding:16px;background:linear-gradient(135deg,rgba(255,179,64,.2),rgba(255,255,255,.04));border:1px solid rgba(255,179,64,.22)}.summary-total small{display:block;color:#d2b27a}.summary-total strong{display:block;font-size:30px;color:#fff;margin-top:4px}.donate-rules{display:flex;gap:10px;align-items:flex-start;margin:16px 0;color:#c9bca9;font-size:13px}.donate-btn{width:100%;border:0;border-radius:13px;padding:15px 18px;background: linear-gradient(180deg, #0a9b44, #5ccf20);color: #f7f7f7;font-weight:900;text-transform:uppercase;letter-spacing:.7px;cursor:pointer;box-shadow:0 12px 24px rgba(210,120,20,.25)}.donate-btn:hover{filter:brightness(1.08)}.donate-note{margin-top:12px;color:#988b7a;font-size:12px;line-height:1.5}.bonus-pill{display:none;margin-top:8px;padding:8px 10px;border-radius:999px;background:rgba(76,211,120,.13);color:#8affb1;border:1px solid rgba(76,211,120,.25);font-weight:700;text-align:center}@media(max-width:800px){.donate-grid{grid-template-columns:1fr}.coin-buttons{grid-template-columns:repeat(2,1fr)}.donate-title{font-size:27px}}