:root { --dark-teal-rgb: 0,235,235; --dark-bg-rgb: 12,12,12; --darker-bg-rgb: 25,25,25; --text-light-rgb: 230,230,230; --text-muted-rgb: 150,150,150; --neon-blue-rgb: 0,243,255; --neon-pink-rgb: 255,0,255; --neon-green-rgb: 57,255,20; --bg-color-rgb: 25,25,25; --font-color-rgb: 220,220,220; --header-bg-color-rgb: 34,34,34; --header-font-color-rgb: 200,200,200; --navbar-bg-color-rgb: 30,30,30; --navbar-font-color-rgb: 190,190,190; --footer-bg-color-rgb: 28,28,28; --footer-font-color-rgb: 180,180,180; --container-bg-color-rgb: 36,36,36; --container-shadow-color-rgb: 60,60,60; --table-header-color-rgb: 44,44,44; --table-row-color-rgb: 66,66,66; --table-border-color-rgb: 90,90,90; --tooltip-bg-color-rgb: 66,66,66; --warning-box-bg-color-rgb: 68,68,68; --warning-text-color-rgb: 231,76,60; --animated-hr-color-rgb: 136,136,136; --copy-button-color-rgb: 0,160,150; --copy-button-hover-color-rgb: 0,200,180; --copy-button-text-color-rgb: 255,255,255; --button-shadow-color-rgb: 0,80,80; --form-bg-color-rgb: 36,36,36; --form-font-color-rgb: 180,180,180; --form-border-color-rgb: 80,80,80; --placeholder-color-rgb: 120,120,120; --bg-color: rgb(var(--bg-color-rgb)); --font-color: rgb(var(--font-color-rgb)); --header-bg-color: rgb(var(--header-bg-color-rgb)); --header-font-color: rgb(var(--header-font-color-rgb)); --navbar-bg-color: rgb(var(--navbar-bg-color-rgb)); --navbar-font-color: rgb(var(--navbar-font-color-rgb)); --footer-bg-color: rgb(var(--footer-bg-color-rgb)); --footer-font-color: rgb(var(--footer-font-color-rgb)); --container-bg-color: rgb(var(--container-bg-color-rgb)); --container-shadow-color: rgb(var(--container-shadow-color-rgb)); --table-header-color: rgb(var(--table-header-color-rgb)); --table-row-color: rgb(var(--table-row-color-rgb)); --table-border-color: rgb(var(--table-border-color-rgb)); --tooltip-bg-color: rgb(var(--tooltip-bg-color-rgb)); --warning-box-bg-color: rgb(var(--warning-box-bg-color-rgb)); --warning-text-color: rgb(var(--warning-text-color-rgb)); --animated-hr-color: rgb(var(--animated-hr-color-rgb)); --copy-button-color: rgb(var(--copy-button-color-rgb)); --copy-button-hover-color: rgb(var(--copy-button-hover-color-rgb)); --form-bg-color: rgb(var(--form-bg-color-rgb)); --form-font-color: rgb(var(--form-font-color-rgb)); --form-border-color: rgb(var(--form-border-color-rgb)); --placeholder-color: rgb(var(--placeholder-color-rgb)); --dark-teal: #00efef; --secondary-color: #008080; --deep-dark: #0c0c0c; --darker-bg: #191919; --light-text: #e6e6e6; --glitch-text: #ff00ff; --neon-blue: #00f3ff; --neon-pink: #ff00ff; --neon-green: #39ff14; color-scheme: dark }

.user-dropdown { margin-right: .5rem }
.user-dropdown-toggle { display: flex; align-items: center; padding: .25rem .75rem !important }
.user-dropdown-toggle:after { margin-left: .5rem }
.profile-thumbnail { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; border: 2px solid var(--dark-teal); margin-right: .5rem; background-color: #1a1a1a }
.support-notification-badge { position: absolute; top: 0; right: 99px; background: #ff3b30; color: #fff; border-radius: 50%; font-size: 10px; font-weight: 600; min-width: 20px; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; box-shadow: 0 2px 8px rgba(255,59,48,.4),0 1px 3px rgba(0,0,0,.2); animation: pulse-notification 2s infinite; z-index: 1000; line-height: 1 }
 
@keyframes pulse-notification {
    0% { transform: scale(1) }
    50% { transform: scale(1.1) }
    100% { transform: scale(1) }
}

@media (max-width:767.98px) {
    .support-notification-badge { right: 165px }
}

.user-dropdown { position: relative }
.username-display { max-width: 120px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #fff }
.user-welcome { font-size: .9rem; font-weight: 600 }
.theme-toggle-btn { padding: .35rem .5rem; background-color: transparent; color: var(--dark-teal); border: 1px solid var(--dark-teal); border-radius: 4px; font-size: .9rem; margin-right: .5rem; transition: all .2s ease }
.theme-toggle-btn:focus, .theme-toggle-btn:hover { background-color: var(--dark-teal); color: #000; box-shadow: 0 0 8px rgba(0,239,239,.5) }

@media (max-width:767.98px) {
    .navbar-nav.ml-auto { flex-direction: row !important; align-items: center; justify-content: center; margin-top: .5rem }
    .theme-toggle-btn, .user-dropdown { margin: 0 .25rem }
    .profile-thumbnail { width: 28px; height: 28px; margin-right: 0 }
    .dropdown-menu { right: 0; left: auto; min-width: 210px }
}

@media (max-width:575.98px) {
    .navbar-collapse { text-align: center }
    .user-dropdown-toggle { padding: .25rem .5rem !important }
    .theme-toggle-btn { padding: .25rem .35rem; font-size: .8rem }
}

 

@keyframes twinkle {
    0% { opacity: 0 }
    50% { opacity: 1 }
    100% { opacity: 0 }
}

.star { position: absolute; width: 2px; height: 2px; background: #fff; border-radius: 50%; z-index: 1 }
.star::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: inherit; border-radius: inherit; transform: rotate(45deg) }

@keyframes float1 {
    0% { transform: translateY(0) }
    50% { transform: translateY(-20px) }
    100% { transform: translateY(0) }
}

@keyframes float2 {
    0% { transform: translateY(-10px) }
    50% { transform: translateY(10px) }
    100% { transform: translateY(-10px) }
}

@media (max-width:768px) {
    .header { min-height: 160px }
    .header img { max-height: 240px }
}

@media (max-width:480px) {
    .header { min-height: 120px }
    .header img { max-height: 200px }
}

 
.containerp { position: relative; margin-top: 30px; margin-bottom: 120px; background-color: var(--container-bg-color); border-radius: 5px; backdrop-filter: blur(5px); padding: 20px; max-width: 1350px !important }
.containerp::after, .containerp::before { display: block; content: ""; position: absolute; background-repeat: no-repeat; background-position: center; background-size: contain }

@media screen and (min-width:768px) {
    .containerp::before { top: -2px; right: -77px; height: 100px; width: 100px; }
    .containerp::after { bottom: -2px; left: -77px; height: 100px; width: 100px; }
}

 

@keyframes glitch {
    2%,64% { transform: translate(2px,0) skew(0) }
    4%,60% { transform: translate(-2px,0) skew(0) }
    62% { transform: translate(0,0) skew(5deg) }
}

@media (min-width:992px) {
    .navbar-expand-lg .navbar-nav .nav-link { padding-right: .4rem; padding-left: .8rem !important }
}

@media (max-width:991.98px) {
    .navbar-nav.ml-auto { flex-direction: column; align-items: flex-start }
    .navbar-nav.ml-auto .nav-item { margin-right: 0 !important; margin-bottom: 10px }
}

.gtranslate_wrapper, .gtranslate_wrapper * { all: unset; box-sizing: border-box }
.gtranslate_wrapper { background-color: rgba(15,15,15,.95); border: 1px solid var(--dark-teal) !important; border-radius: 5px !important; margin-right: 15px !important; padding: 5px !important; box-shadow: 0 0 10px rgba(var(--dark-teal-rgb),.3) !important; transition: all .3s ease !important }
.gtranslate_wrapper:hover { box-shadow: 0 0 15px rgba(var(--dark-teal-rgb),.5) !important }
.gt_dropdown, .gtranslate_wrapper select { background-color: rgba(15,15,15,.95); border: 1px solid var(--dark-teal) !important; color: var(--dark-teal) !important; font-family: Orbitron,sans-serif !important; font-size: .875rem !important; line-height: 1.5 !important; padding: .25rem .5rem !important; margin: 0 !important; text-transform: uppercase !important; letter-spacing: 1px !important; word-wrap: normal !important; appearance: none !important; transition: all .3s ease !important }
.gt_dropdown:hover, .gtranslate_wrapper select:hover { box-shadow: 0 0 10px rgba(var(--dark-teal-rgb),.3) !important }
.gt_dropdown::-ms-expand, .gtranslate_wrapper select::-ms-expand { display: none !important }
.gt_dropdown .gt_selected, .gt_dropdown .gt_selected:after { color: var(--dark-teal) !important; border-top-color: var(--dark-teal) !important }
.gt_dropdown .gt_option { background-color: rgba(15,15,15,.9) !important; color: var(--light-text) !important; font-family: Roboto,sans-serif !important; transition: all .2s ease !important }
.gt_dropdown .gt_option:hover { background-color: rgba(var(--copy-button-color-rgb),.2) !important; color: var(--dark-teal) !important; text-shadow: 0 0 5px var(--dark-teal) !important }
.navbar-nav .nav-item .gtranslate_wrapper { display: flex !important; align-items: center !important }
.profile-name { background-color: var(--container-bg-color); color: var(--font-color); border: 1px solid var(--table-border-color); padding: 10px; margin: 5px 0; border-radius: 5px; width: 100%; box-sizing: border-box; font-size: 1rem }
.profile-name::placeholder { color: var(--font-color); opacity: .5 }
.membership-status { display: flex; align-items: center; padding: 5px 10px; border-radius: 5px; font-weight: 700; white-space: nowrap }
.premium-user { color: gold; text-shadow: 0 0 5px #ff0 }
.regular-user { color: red; text-shadow: 0 0 5px red }
.pogomaster-user { background: linear-gradient(to right,#32cd32,#7cfc00); color: #000; font-weight: 700; padding: 5px 10px; border-radius: 20px; box-shadow: 0 0 10px rgba(124,252,0,.7); animation: glow 1.5s ease-in-out infinite alternate }

@keyframes glow {
    from { box-shadow: 0 0 5px rgba(124,252,0,.7) }
    to { box-shadow: 0 0 15px rgba(124,252,0,.9) }
}

#rewardsTable { width: 100%; color: var(--font-color) }
#rewardsTable thead { background-color: var(--header-bg-color); color: var(--header-font-color) }
#rewardsTable th { cursor: pointer }
#rewardsTable tbody { background-color: var(--table-row-color) }
#rewardsTable, #rewardsTable td, #rewardsTable th { border: 1px solid var(--table-border-color); border-collapse: collapse; padding: 15px; text-align: center }
#rewardsTable tbody tr:nth-child(2n) { background-color: var(--table-header-color) }
#rewardsTable tbody tr:hover { background-color: var(--navbar-bg-color); color: var(--navbar-font-color); cursor: pointer }
.table-container { position: relative; max-height: 400px; overflow-y: auto; display: block; border-radius: 8px; box-shadow: 0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05) }
#moves { width: 100%; border-collapse: separate; border-spacing: 0; font: 14px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; color: #e0e0e0 }
#moves thead { position: sticky; top: 0; z-index: 1; background: #2e2e2e; border-bottom: 2px solid #545454 }
#moves tr { background: #3b3b3b; color: #e0e0e0; border-top: 1px solid #545454; transition: background-color .5s ease }
#moves tbody tr.selected { background: var(--secondary-color) !important; color: #fff !important; font-weight: 700 }
#moves td, #moves th { padding: 8px 15px; vertical-align: middle; border-top: 1px solid #545454 }
#moves thead th { color: #979ea3; text-transform: uppercase; font-weight: 700; letter-spacing: .06em }
#moves tbody td:first-child, #moves thead th:first-child { border-left: 1px solid #545454 }
#moves tbody td:last-child, #moves thead th:last-child { border-right: 1px solid #545454 }
#moves tbody:hover > tr { filter: brightness(90%) }
#moves tbody:hover > tr:hover { filter: brightness(100%) }
#moves td:nth-child(8), #moves th:nth-child(8) { display: none }
#moves td:nth-child(9), #moves th:nth-child(9) { display: table-cell }

@media (max-width:767px) {
    #moves tbody td:nth-child(3), #moves tbody td:nth-child(4), #moves tbody td:nth-child(8), #moves thead th:nth-child(3), #moves thead th:nth-child(4), #moves thead th:nth-child(8) { display: none }
    #moves td, #moves th { padding: 6px 8px; font-size: 12px }
    #moves td:nth-child(9), #moves th:nth-child(9) { display: none }
    #moves td:nth-child(2) { display: flex; flex-direction: column }
    #moves td:nth-child(2)::after { content: attr(data-description); font-size: 10px; color: #666; margin-top: 4px }
}

.table.table-striped { background-color: transparent; color: var(--font-color); border: 1px solid var(--table-border-color) }
.table.table-striped thead { background-color: var(--header-bg-color); color: var(--header-font-color); border-bottom: 2px solid var(--table-border-color) }
.table.table-striped thead th { text-transform: uppercase; letter-spacing: 1px; font-weight: 700; padding: 1rem }
.table.table-striped tbody tr:nth-of-type(odd) { background-color: rgba(66,66,66,.1) }
.table.table-striped tbody tr:nth-of-type(2n) { background-color: rgba(66,66,66,.05) }
.table.table-striped tbody tr:hover { background-color: rgba(var(--navbar-bg-color-rgb),.1); cursor: pointer }
.btn-info { background-color: var(--copy-button-color) !important; border-color: var(--copy-button-hover-color) !important; color: #fff !important; transition: background-color .3s ease }
.btn-info:focus, .btn-info:hover { background-color: var(--copy-button-hover-color) !important; border-color: var(--copy-button-hover-color) !important; color: #fff !important }
.raid-details { background-color: rgba(0,0,0,.2); transition: all .3s ease }
.raid-details td { border-top: 1px solid var(--table-border-color); padding: 1rem }
.raid-info { background: rgba(36,36,36,.6); border: 1px solid var(--table-border-color); border-radius: 8px; padding: 1rem; color: var(--font-color); box-shadow: 0 2px 4px rgba(0,0,0,.2) }
.raid-info p { margin: .25rem 0 }
.raid-info p strong { color: var(--copy-button-color); font-weight: 600 }
.dropdown-item.disabled { color: #ccc !important; cursor: not-allowed !important }
.dropdown-item.disabled img { opacity: .3 }
.custom-control-input:checked ~ .custom-control-label::before { color: #fff; border-color: #007bff; background-color: #007bff }
.custom-control-label { font-weight: 500; color: var(--font-color) }
.tooltip { position: absolute; z-index: 1070; display: block; margin: 0; font-family: Roboto,sans-serif; font-style: normal; font-weight: 400; line-height: 1.5; text-align: left; text-decoration: none; font-size: .875rem; word-wrap: break-word; opacity: 0 }
.tooltip.show { opacity: 1 }
.tooltip-inner { background: var(--secondary-color); color: #fff; border-radius: 3px; box-shadow: 0 0 10px rgba(var(--dark-teal-rgb),.3); padding: 10px; max-width: 200px }
.tooltip.bs-tooltip-auto[x-placement^=top] .arrow::before, .tooltip.bs-tooltip-top .arrow::before { background: var(--secondary-color) }
.hide-move { display: none }
.animated-hr { border: none; height: 1px; background-color: #000; position: relative; animation: hr-animation 2s forwards }

@keyframes hr-animation {
    0% { width: 0; left: 0 }
    100% { width: 100%; left: 0 }
}

.warning-box { background-color: var(--warning-box-bg-color); padding: 10px; border-radius: 5px; border: 1px solid var(--warning-text-color) }
.warning-text { color: var(--warning-text-color); font-weight: 700 }
.profile-card { position: relative; width: 225px; margin: auto; box-shadow: 0 0 20px 0 rgba(0,0,0,.2); border-radius: 5px; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 20px; background-color: #2c2c2c; color: #e6e6e6 }
.profile-img-container { width: 150px; height: 150px; border-radius: 50%; overflow: hidden; border: 3px solid #484848; display: flex; justify-content: center; align-items: center; background-color: #111; margin-bottom: 20px }
.profile-img-container img { max-width: 90%; max-height: 90%; object-fit: contain; object-position: center }
.profile-name { font-size: 18px; font-weight: 700; color: #e0e0e0; margin: 0 }
.ball-img-container { position: absolute; bottom: 75px; right: 25px }
.ball-img-container img { width: 50px; height: 50px }
.item-img-container img { width: 25px; height: 25px }
.item-image {   }
.alpha-img-container { position: absolute; bottom: 225px; right: 10px }
.alpha-img-container img { width: 25px; height: 25px }
.card { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; background-color: var(--container-bg-color); background-clip: border-box; border: 1px solid var(--form-border-color); border-radius: .25rem; color: var(--font-color); box-shadow: 0 2px 5px 0 var(--container-shadow-color); margin-bottom: 20px }
.card.increase { box-shadow: 0 0 10px 0 green }
.card.decrease { box-shadow: 0 0 10px 0 red }
.card .card-body { background-color: var(--container-bg-color); color: var(--font-color) }
.flex-container { display: flex; justify-content: space-between }
.prefix-select-container { display: flex; flex-direction: column; justify-content: flex-end }
.form-control { flex-grow: 1; background-color: var(--form-bg-color); color: var(--form-font-color); border-color: var(--form-border-color) }
.form-control::placeholder { color: var(--placeholder-color) }
.base-stat-bar { display: flex; align-items: center; margin-bottom: 10px }
.base-stat-bar .stat-number { width: 30px; text-align: right; margin-right: 10px }
.base-stat-bar .stat-bar { height: 20px; border: 1px solid #000; flex-grow: 1 }
.progress-bar-container { display: flex; align-items: center }
.progress-bar { height: 20px; margin-left: 0; border: 1px solid #000; display: inline-block }
.export-container { background: var(--container-bg-color); color: var(--font-color); border-radius: 10px; padding: 20px; box-shadow: 0 4px 6px rgba(0,0,0,.1) }
.copy-area { display: grid; grid-template-rows: auto 40px; gap: 10px }
#copyButton { justify-self: end; padding: 10px; background: var(--copy-button-color); color: #fff; border: none; border-radius: 5px; cursor: pointer; transition: background .3s }
#copyButton:hover { background: var(--copy-button-hover-color) }
.custom-google-btn { background: linear-gradient(45deg,var(--darker-bg),var(--deep-dark)); border: 1px solid var(--dark-teal); color: var(--dark-teal); font-family: Orbitron,sans-serif; text-transform: uppercase; letter-spacing: 2px; padding: 8px 16px; position: relative; overflow: hidden; transition: all .3s ease; display: flex; align-items: center; gap: 8px; border-radius: 5px; cursor: pointer }
.custom-google-btn:hover { color: var(--light-text); text-shadow: 0 0 5px var(--dark-teal); box-shadow: 0 0 5px var(--dark-teal),0 0 25px var(--dark-teal); transform: translateY(-2px) }
.custom-google-btn::before { content: ''; position: absolute; top: -2px; left: -2px; right: -2px; bottom: -2px; background: linear-gradient(45deg,var(--dark-teal),var(--neon-pink),var(--neon-green)); z-index: -1; filter: blur(5px); opacity: 0; transition: opacity .3s ease }
.custom-google-btn:hover::before { opacity: 1 }
.google-icon { width: 25px; height: 25px; filter: invert(1) }
.fancy-container { position: relative; background-color: var(--container-bg-color); box-shadow: 0 4px 8px 0 var(--container-shadow-color); padding: 20px; border-radius: 15px }
.fancy-select-container { position: absolute; top: 10px; right: 20px }
.header-title { color: #111; padding-bottom: 20px }
.fancy-button { background-color: var(--copy-button-color); color: #fff; padding: 10px; border: none; border-radius: 5px; cursor: pointer; transition: all .3s ease }
.fancy-button:hover { background-color: var(--copy-button-hover-color) }
.button-icon { margin-left: 5px }
.fancy-textarea { margin-top: 20px; border: 1px solid var(--form-border-color); border-radius: 5px; color: var(--form-font-color); background-color: var(--form-bg-color) }
.fancy-label { color: var(--font-color); margin-top: 20px }
.fancy-select { margin-top: 10px; border: 1px solid var(--form-border-color); border-radius: 5px; color: var(--form-font-color); background-color: var(--form-bg-color) }
.mt-4, .my-4 { margin-top: 4.5rem !important }
.customization-section { position: relative; border: 1px solid var(--form-border-color); border-radius: 10px; padding: 20px; background-color: var(--form-bg-color); margin-top: 120px }
.customization-section::before { content: ""; position: absolute; top: -102px; left: 50%; transform: translateX(-50%); height: 120px; width: 120px; }
.section-title { color: var(--secondary-color); text-transform: uppercase; font-size: 24px; margin-bottom: 20px }
.form-checkbox-group { display: grid; grid-gap: 15px }
.form-check-label { font-size: 18px; color: var(--form-font-color) }
.help-icon { color: var(--placeholder-color); font-size: 16px }
.slider-wrapper { position: relative; height: 36px; display: flex; align-items: center }
.slider-progress { position: absolute; height: 8px; background: linear-gradient(90deg,#8c52ff 0,#a64dff 25%,#cb38ff 50%,#ff36db 75%,#ff4dab 100%); left: 0; width: 0%; top: 50%; transform: translateY(-50%); z-index: 1; border-radius: 4px; box-shadow: 0 0 10px rgba(140,82,255,.5); transition: width .2s ease,box-shadow .3s ease; pointer-events: none; max-width: calc(100% - 12px) }
.form-range.custom-range { position: relative; z-index: 2; height: 8px; width: 100%; appearance: none; background: 0 0; cursor: pointer; margin: 0; padding: 0 12px 0 0 }
.form-range.custom-range::-webkit-slider-runnable-track { width: 100%; height: 8px; background: rgba(255,255,255,.2); border-radius: 4px; cursor: pointer }
.form-range.custom-range::-moz-range-track { width: 100%; height: 8px; background: rgba(255,255,255,.2); border-radius: 4px; cursor: pointer }
.form-range.custom-range::-webkit-slider-thumb { appearance: none; width: 24px; height: 24px; border-radius: 50%; background: #fff; cursor: pointer; box-shadow: 0 0 0 4px rgba(140,82,255,.3),0 0 10px rgba(140,82,255,.5); border: 2px solid #8c52ff; transition: all .2s ease; position: relative; z-index: 3; margin-top: -8px }
.form-range.custom-range::-moz-range-thumb { width: 24px; height: 24px; border-radius: 50%; background: #fff; cursor: pointer; box-shadow: 0 0 0 4px rgba(140,82,255,.3),0 0 10px rgba(140,82,255,.5); border: 2px solid #8c52ff; transition: all .2s ease; position: relative; z-index: 3 }
.form-range.custom-range::-webkit-slider-thumb:hover { transform: scale(1.1); box-shadow: 0 0 0 5px rgba(140,82,255,.4),0 0 15px rgba(140,82,255,.6) }
.form-range.custom-range::-moz-range-thumb:hover { transform: scale(1.1); box-shadow: 0 0 0 5px rgba(140,82,255,.4),0 0 15px rgba(140,82,255,.6) }
.form-range.custom-range:active::-webkit-slider-thumb { background: rgba(140,82,255,.9); border-color: #fff }
.form-range.custom-range:active::-moz-range-thumb { background: rgba(140,82,255,.9); border-color: #fff }
.slider-value { background: rgba(140,82,255,.2); color: #fff; border-radius: 8px; padding: 4px 10px; font-weight: 600; border: 1px solid rgba(140,82,255,.4); transition: all .3s ease }
.slider-progress.high-value, .slider-progress.high-value ~ .slider-value { background: rgba(140,82,255,.4); box-shadow: 0 0 10px rgba(140,82,255,.5); border-color: rgba(140,82,255,.6) }
.btn-primary { background: linear-gradient(45deg,var(--darker-bg),var(--deep-dark)); border: 2px solid var(--dark-teal); color: var(--dark-teal); font-family: Orbitron,sans-serif; text-transform: uppercase; letter-spacing: 2px; padding: 10px 20px; position: relative; overflow: hidden; transition: all .3s ease; z-index: 1; cursor: pointer }
.btn-primary::before { content: ''; position: absolute; top: -2px; left: -2px; right: -2px; bottom: -2px; background: linear-gradient(45deg,var(--dark-teal),var(--neon-pink),var(--neon-green)); z-index: -1; filter: blur(5px); opacity: 0; transition: opacity .3s ease }
.btn-primary::after { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg,transparent,rgba(var(--dark-teal-rgb),.4),transparent); transition: .5s }
.btn-primary:focus, .btn-primary:hover { color: var(--light-text); text-shadow: 0 0 5px var(--dark-teal); box-shadow: 0 0 5px var(--dark-teal),0 0 25px var(--dark-teal),0 0 50px var(--dark-teal),0 0 100px var(--dark-teal) }
.btn-primary:focus::before, .btn-primary:hover::before { opacity: 1 }
.btn-primary:focus::after, .btn-primary:hover::after { left: 100% }
.btn-primary:active { transform: scale(.95); box-shadow: 0 0 2px var(--dark-teal),0 0 10px var(--dark-teal) }
.btn-primary:hover span { animation: flicker .5s infinite alternate }

@keyframes flicker {
    0%,100%,19%,21%,23%,25%,54%,56% { text-shadow: 0 0 4px var(--dark-teal),0 0 11px var(--dark-teal),0 0 19px var(--dark-teal),0 0 40px var(--dark-teal) }
    20%,24%,55% { text-shadow: none }
}

#signOutButton { background-color: transparent; color: var(--dark-teal); border: 1px solid var(--dark-teal); font-family: Orbitron,sans-serif; text-transform: uppercase; letter-spacing: 1px; padding: .5rem 1rem; transition: all .3s ease; position: relative; overflow: hidden; box-shadow: 0 0 5px rgba(var(--dark-teal-rgb),.3) }
#signOutButton:hover { background-color: rgba(var(--dark-teal-rgb),.1); color: var(--light-text); box-shadow: 0 0 15px rgba(var(--dark-teal-rgb),.5) }
#signOutButton::before { content: ''; position: absolute; top: -2px; left: -2px; right: -2px; bottom: -2px; background: linear-gradient(45deg,var(--dark-teal),var(--neon-pink),var(--neon-green)); z-index: -1; filter: blur(5px); opacity: 0; transition: opacity .3s ease }
#signOutButton:hover::before { opacity: 1 }
#signOutButton:active { transform: scale(.98); box-shadow: 0 0 2px rgba(var(--dark-teal-rgb),.5) }
.cyberpunk-button { background-color: #111; color: #fff; border: none; border-radius: 8px; padding: 12px 24px; font-size: 18px; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; position: relative; overflow: hidden; cursor: pointer; transition: all .3s ease; animation: neonChase 4s infinite,textColorChange 4s infinite }
.cyberpunk-button::before { content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: radial-gradient(circle,rgba(255,255,255,.3) 0,rgba(255,255,255,0) 70%); transform: scale(0); transition: transform .5s ease-out }
.cyberpunk-button:hover { background-color: #000 }
.cyberpunk-button:hover::before { transform: scale(1) }
.cyberpunk-button:active { transform: scale(.98) }
.cyberpunk-button:focus { outline: 0; box-shadow: 0 0 0 3px rgba(255,0,222,.5),0 0 0 6px rgba(0,255,255,.5) }

@keyframes neonChase {
    0% { box-shadow: 0 0 5px #ff00de,0 0 10px #ff00de,0 0 20px #ff00de,0 0 40px #ff00de }
    25% { box-shadow: 0 0 5px #0ff,0 0 10px #0ff,0 0 20px #0ff,0 0 40px #0ff }
    50% { box-shadow: 0 0 5px #ff00de,0 0 10px #ff00de,0 0 20px #ff00de,0 0 40px #ff00de }
    75% { box-shadow: 0 0 5px #0ff,0 0 10px #0ff,0 0 20px #0ff,0 0 40px #0ff }
    100% { box-shadow: 0 0 5px #ff00de,0 0 10px #ff00de,0 0 20px #ff00de,0 0 40px #ff00de }
}

@keyframes textColorChange {
    0% { color: #ff00de }
    25% { color: #0ff }
    50% { color: #ff00de }
    75% { color: #0ff }
    100% { color: #ff00de }
}

.form-control.fancy-textarea:disabled, .form-control.fancy-textarea[readonly] { background-color: var(--form-bg-color) !important; color: var(--form-font-color) !important; opacity: 1 !important }
.admin-panel { max-width: 600px; margin: 2rem auto; padding: 2rem; background-color: var(--container-bg-color); border-radius: 15px; box-shadow: 0 4px 10px var(--container-shadow-color); color: var(--font-color) }
.admin-panel h1, .admin-panel h2, .admin-panel h3 { color: var(--header-font-color); margin-bottom: 1.5rem; text-align: center; border-bottom: 2px solid var(--navbar-bg-color); padding-bottom: .5rem }
.settings-form { display: flex; flex-direction: column; align-items: flex-end; margin-bottom: 2rem }
.form-group { margin-bottom: 1rem }
.form-group label { display: block; margin-bottom: .5rem; color: var(--header-font-color); font-weight: 700 }
.form-group input { width: 100%; padding: .5rem; border: 1px solid #ccc; border-radius: 4px; font-size: 1rem }
.btn-add, .btn-remove, .btn-update { background-color: var(--copy-button-color); color: var(--navbar-font-color); border: none; padding: .5rem 1rem; font-size: .9rem; border-radius: 4px; cursor: pointer; transition: background-color .2s,transform .1s }
.btn-add:hover, .btn-remove:hover, .btn-update:hover { background-color: var(--copy-button-hover-color); transform: translateY(-2px) }
.btn-remove { background-color: var(--warning-box-bg-color); color: var(--warning-text-color) }
.add-email-form { display: flex; justify-content: space-between; align-items: center }
.add-email-form input { flex-grow: 1; margin-right: 1rem }
.modal-content { border-radius: 15px; background-color: var(--container-bg-color); color: var(--font-color) }
.modal-header { border-bottom: none; background-color: var(--header-bg-color); color: var(--header-font-color); border-top-left-radius: 15px; border-top-right-radius: 15px }
.modal-body { padding: 2rem }
.modal-dialog { display: flex; align-items: center; min-height: calc(100% - 1rem) }
.pokemon-modal { background-color: var(--container-bg-color); color: var(--font-color); border: 2px solid var(--navbar-bg-color) }
.pokemon-modal .modal-header { background-color: var(--navbar-bg-color); color: var(--navbar-font-color); border-bottom: 1px solid var(--navbar-font-color) }
.pokemon-modal .modal-footer { border-top: 1px solid var(--navbar-bg-color) }
.pokemon-modal .btn-secondary { background-color: var(--navbar-bg-color); color: var(--navbar-font-color); border: none }
.pokemon-modal .btn-secondary:hover { background-color: var(--copy-button-hover-color) }

@media (min-width:576px) {
    .modal-dialog { min-height: calc(100% - 3.5rem) }
}

.embed-responsive { position: relative; width: 100%; padding-bottom: 20% }
.embed-responsive-item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0 }
#donateButton { padding: 10px 20px; cursor: pointer; background: var(--secondary-color); color: #fff; border: none; border-radius: 4px; transition: background-color .3s ease }
#donateButton:hover { background-color: #066 }
#donateButton, #refreshButton { flex: 1; max-width: 200px }

@media (max-width:991.98px) {
    #signOutButton { margin-bottom: 10px }
}

.announcement-banner { background: var(--secondary-color); color: #fff; text-align: center; padding: 12px; position: relative; overflow: hidden; box-shadow: 0 2px 4px rgba(0,0,0,.1) }
.announcement-content { display: flex; align-items: center; justify-content: center; gap: 12px; max-width: 1200px; margin: 0 auto }
.announcement-icon { font-size: 20px }
.announcement-text { font-family: Roboto,sans-serif; font-weight: 500 }
.announcement-time { font-weight: 700 }

@media (max-width:768px) {
    .announcement-content { flex-direction: column; gap: 8px }
    .announcement-text { font-size: 14px }
}

.contest-banner { background: #066; color: #fff; text-align: center; padding: 12px; position: relative; overflow: hidden; box-shadow: 0 2px 4px rgba(0,0,0,.1) }
.contest-content { display: flex; align-items: center; justify-content: center; gap: 12px; max-width: 1200px; margin: 0 auto }
.contest-text { font-family: Roboto,sans-serif; font-weight: 500 }

@media (max-width:768px) {
    .contest-content { flex-direction: column; gap: 8px }
    .contest-text { font-size: 14px }
}

.batch-trade-container { background: rgba(0,0,0,.7); border-radius: 12px; padding: 1.5rem; margin-top: 2rem; position: relative; border: 1px solid rgba(var(--dark-teal-rgb),.3); box-shadow: 0 0 20px rgba(var(--dark-teal-rgb),.1),inset 0 0 20px rgba(var(--dark-teal-rgb),.05),0 0 2px rgba(var(--dark-teal-rgb),.3) }
.batch-trade-container::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: 12px; background: linear-gradient(90deg,transparent 0,rgba(var(--dark-teal-rgb),.1) 25%,rgba(var(--dark-teal-rgb),.1) 75%,transparent 100%); pointer-events: none }
.batch-trade-container::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: 12px; background: linear-gradient(45deg,transparent 0,rgba(var(--dark-teal-rgb),.05) 25%,transparent 50%,rgba(var(--dark-teal-rgb),.05) 75%,transparent 100%); pointer-events: none }
.batch-trade-header { margin-bottom: 1.5rem }
.batch-trade-header h2 { color: var(--header-bg-color); font-size: 1.75rem; margin-bottom: .5rem }
.batch-sets-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(250px,1fr)); gap: 1rem; margin-bottom: 1.5rem }
.pokemon-slot.editing { border: 2px solid #4caf50; box-shadow: 0 0 10px rgba(76,175,80,.3) }
.empty-slot { height: 160px; border: 2px dashed rgba(255,255,255,.2); border-radius: 8px; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.2); cursor: pointer; transition: all .2s ease }
.empty-slot:hover { border-color: var(--copy-button-color) }
.empty-slot i { font-size: 1.5rem; color: rgba(255,255,255,.4) }
.pokemon-slot { height: 160px; background: rgba(255,255,255,.05); border-radius: 8px; padding: 1rem; position: relative; backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,.1) }
.pokemon-slot .pokemon-info { display: flex; align-items: center; gap: 1rem }
.pokemon-slot .image-container { position: relative; width: 80px; height: 80px }
.pokemon-slot .pokemon-image { width: 100%; height: 100%; object-fit: contain }
.pokemon-slot .ball-image { position: absolute; bottom: -8px; right: -8px; width: 24px; height: 24px }
.pokemon-slot .held-item { position: absolute; top: -8px; right: -8px; width: 24px; height: 24px }
.pokemon-slot .details { flex: 1 }
.pokemon-slot .pokemon-name { font-size: 1.1rem; font-weight: 600; color: var(--secondary-color); margin-bottom: .25rem }
.pokemon-slot .slot-actions { position: absolute; top: .75rem; right: .75rem; display: flex; gap: .5rem }
.slot-actions button { padding: .35rem; border-radius: 4px; border: none; background: rgba(0,0,0,.3); color: #fff; cursor: pointer; transition: all .2s ease }
.slot-actions .edit-btn:hover { background: var(--secondary-color) }
.slot-actions .remove-btn:hover { background: var(--warning-box-bg-color) }
.batch-trade-controls { display: flex; gap: 1rem; margin-bottom: 1.5rem }
.add-set-btn { width: 45px; height: 45px; padding: 0; border-radius: 8px; background: var(--secondary-color); border: none; color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all .2s ease }
.add-set-btn:hover { transform: scale(1.05) }
.start-trade-btn { flex: 1; max-width: 300px; height: 45px; border-radius: 8px; background: var(--secondary-color); border: none; color: #fff; font-weight: 500; cursor: pointer; transition: all .2s ease }
.start-trade-btn:hover { transform: scale(1.02) }
.start-trade-btn:disabled { opacity: .6; cursor: not-allowed }
#themeColorBtn { background: linear-gradient(45deg,var(--darker-bg),var(--deep-dark)); border: 1px solid var(--dark-teal); color: var(--dark-teal); font-family: Orbitron,sans-serif; text-transform: uppercase; letter-spacing: 2px; padding: 8px 16px; position: relative; overflow: hidden; transition: all .3s ease; display: flex; align-items: center; gap: 8px; border-radius: 5px; cursor: pointer; margin-right: 15px }
#themeColorBtn:hover { color: var(--light-text); text-shadow: 0 0 5px var(--dark-teal); box-shadow: 0 0 5px var(--dark-teal),0 0 25px var(--dark-teal); transform: translateY(-2px) }
#themeColorBtn::before { content: ''; position: absolute; top: -2px; left: -2px; right: -2px; bottom: -2px; background: linear-gradient(45deg,var(--dark-teal),var(--neon-pink),var(--neon-green)); z-index: -1; filter: blur(5px); opacity: 0; transition: opacity .3s ease }
#themeColorBtn:hover::before { opacity: 1 }
#colorWheel { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); background: var(--container-bg-color); padding: 25px; border-radius: 10px; border: 2px solid var(--dark-teal); box-shadow: 0 0 30px rgba(0,0,0,.5); z-index: 1000; display: none; min-width: 300px }
#colorWheel.active { display: block }
.color-picker-group { margin: 15px 0 }
.color-picker-group label { font-family: Orbitron,sans-serif; color: var(--dark-teal); margin-bottom: 8px; font-size: .9em; text-transform: uppercase; letter-spacing: 1px }
.color-picker-group input[type=color] { width: 100%; height: 45px; border: 1px solid var(--dark-teal); border-radius: 5px; background: var(--container-bg-color); cursor: pointer; transition: all .3s ease }
.color-picker-group input[type=color]:hover { box-shadow: 0 0 10px rgba(var(--dark-teal-rgb),.3) }
.confetti-container, .snow-container { position: fixed; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 9999 }
.confetti, .snowflake { position: fixed; background-color: #fff; border-radius: 50%; opacity: 0; animation: fall linear forwards }
.confetti { border-radius: 2px; transform: rotate(0) }

@keyframes fall {
    0% { transform: translateY(-5vh) translateX(0); opacity: 1 }
    85% { opacity: .8 }
    100% { transform: translateY(100vh) translateX(20px); opacity: 0 }
}

#tradeConsole { background-color: var(--form-bg-color); color: var(--form-font-color); border-color: var(--form-border-color) }
.trade-console { height: 300px; overflow-y: auto; background-color: #1c1c1c; border: 1px solid #666; border-radius: .25rem }
.trade-message { padding: .5rem; margin-bottom: .5rem; border-left: 4px solid var(--secondary-color); color: var(--font-color); background-color: var(--table-header-color); transition: all .3s ease }
.trade-message:first-child { animation: fadeIn .5s ease-out }
.trade-message.error { border-left-color: #dc3545 }

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-10px) }
    to { opacity: 1; transform: translateY(0) }
}

.bootstrap-select .btn-light, .bootstrap-select .btn-secondary, .bootstrap-select .dropdown-toggle.btn-light { background-color: var(--form-bg-color) !important; color: var(--light-text) !important; border: 1px solid var(--dark-teal) !important; transition: background-color .3s ease !important }
.bootstrap-select .btn-light:hover, .bootstrap-select .btn-secondary:hover, .bootstrap-select .dropdown-toggle.btn-light:hover { background-color: var(--container-bg-color) !important; color: var(--dark-teal) !important }
.bootstrap-select .btn-light .filter-option-inner-inner img, .bootstrap-select .dropdown-menu img { width: 25px; height: 25px; object-fit: contain; object-position: center; margin-right: 5px }
.bootstrap-select .dropdown-menu { background-color: var(--form-bg-color) !important; border: 1px solid var(--dark-teal) !important; box-shadow: 0 0 10px rgba(var(--dark-teal-rgb),.3) !important }
.bootstrap-select.show .dropdown-menu { background-color: var(--form-bg-color) !important; border: 1px solid var(--dark-teal) !important }
.bootstrap-select .dropdown-menu li a { padding-top: 5px; padding-bottom: 5px; color: var(--light-text) !important; background-color: transparent !important; transition: all .3s ease !important }
.bootstrap-select .dropdown-menu li a:focus, .bootstrap-select .dropdown-menu li a:hover { background-color: var(--container-bg-color) !important; color: var(--dark-teal) !important }
.bootstrap-select .dropdown-menu li.active > a { background-color: var(--animated-hr-color) !important; color: var(--neon-green) !important }
.bootstrap-select .dropdown-menu .text-muted { color: var(--placeholder-color) !important; white-space: normal }
.bootstrap-select .dropdown-menu .bs-ok-default.check-mark { color: var(--neon-green) !important }
button#copyButton { color: #fff; background-color: var(--copy-button-color); border-color: var(--copy-button-hover-color) }
button#copyButton:hover { color: #fff; background-color: var(--copy-button-hover-color); border-color: #ff4949 }

@media (max-width:576px) {
    .trade-console { height: 200px }
    button#copyButton { margin-top: 40px }
}

@media (max-width:991.98px) {
    .dropdown-menu { background-color: transparent; border: none; box-shadow: none }
    .dropdown-item { color: var(--dark-teal); padding: .5rem 1rem; border-bottom: 1px solid rgba(var(--dark-teal-rgb),.1) }
    .dropdown-item:last-child { border-bottom: none }
    .dropdown-item:focus, .dropdown-item:hover { background-color: rgba(var(--dark-teal-rgb),.1); color: var(--neon-green) }
}

h1, h2, h3, h4, h5, h6 { font-family: Orbitron,sans-serif !important; color: var(--dark-teal) !important; text-shadow: 0 0 5px var(--dark-teal),0 0 10px var(--dark-teal) !important }
hr { border-color: var(--font-color) }
table.tablesorter { background-color: var(--container-bg-color) !important; color: var(--font-color) !important; border: 1px solid var(--table-border-color) !important; border-collapse: collapse !important; width: 100% !important }
table.tablesorter thead tr { background-color: var(--header-bg-color) !important; color: var(--header-font-color) !important }
table.tablesorter thead th { font-weight: 700 !important; text-transform: uppercase !important; border-left: 1px solid var(--table-border-color) !important; padding: .75rem !important; cursor: pointer !important }
table.tablesorter thead th:first-child { border-left: none !important }
table.tablesorter tbody tr:hover { background-color: rgba(var(--navbar-bg-color-rgb),.1) !important }
table.tablesorter thead th.headerSortUp::after { content: " ▲"; color: var(--secondary-color) }
table.tablesorter thead th.headerSortDown::after { content: " ▼"; color: var(--secondary-color) }
table.tablesorter tbody tr:nth-of-type(2n) { background-color: rgba(66,66,66,.05) !important }
table.tablesorter tbody tr:nth-of-type(odd) { background-color: rgba(66,66,66,.1) !important }
.table-responsive { border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,.25); margin: 1rem 0 }
.table { width: 100%; background-color: var(--container-bg-color); color: var(--font-color); border: 1px solid var(--table-border-color); border-collapse: collapse }
.table thead { background-color: var(--header-bg-color); color: var(--header-font-color); border-bottom: 2px solid var(--table-border-color) }
.table thead th { text-transform: uppercase; font-weight: 700; letter-spacing: 1px; padding: .75rem }
.table thead th a { color: var(--header-font-color); text-decoration: none; transition: color .2s ease,text-shadow .3s ease }
.table thead th a:hover { color: var(--copy-button-hover-color); text-shadow: 0 0 5px var(--secondary-color) }
.table tbody tr td { padding: .75rem; border-top: 1px solid var(--table-border-color) }
.table tbody tr:nth-of-type(2n) { background-color: rgba(66,66,66,.05) }
.table tbody tr:hover { background-color: rgba(var(--navbar-bg-color-rgb),.1); cursor: pointer }
.btn.btn-primary.btn-sm { background-color: var(--secondary-color); border-color: var(--copy-button-hover-color); color: #fff; transition: background-color .3s ease; font-family: Orbitron,sans-serif; text-transform: uppercase; letter-spacing: 1px; padding: .25rem .75rem }
.btn.btn-primary.btn-sm:hover { background-color: var(--copy-button-hover-color); color: #fff }
.progress { background-color: var(--header-bg-color) !important; border: 1px solid var(--table-border-color) !important }
.form-control:disabled, .form-control[readonly] { background-color: transparent !important; opacity: 1 }
.news-section { background: rgba(0,0,0,.3); border-radius: 15px; padding: 2rem; margin-bottom: 2rem; border: 1px solid var(--dark-teal); box-shadow: 0 0 15px rgba(var(--dark-teal-rgb),.1); position: relative; overflow: hidden }
.news-section::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg,transparent 0,var(--dark-teal) 50%,transparent 100%) }
.news-greeting { font-family: Orbitron,sans-serif; font-size: 2rem; color: var(--dark-teal); text-shadow: 0 0 10px rgba(var(--dark-teal-rgb),.5); margin-bottom: 1.5rem; text-align: center }
.news-header { font-size: 1.5rem; color: var(--light-text); margin-bottom: 1rem; padding-bottom: .5rem; border-bottom: 1px solid rgba(var(--dark-teal-rgb),.3) }
.news-article { background: rgba(0,0,0,.2); border-radius: 10px; padding: 1.5rem }
.news-title { font-size: 1.3rem; color: var(--dark-teal); margin-bottom: .5rem }
.news-meta { display: flex; justify-content: space-between; align-items: center; font-size: .9rem; color: rgba(var(--font-color-rgb),.7); margin-bottom: 1rem; padding-bottom: .5rem; border-bottom: 1px solid rgba(var(--dark-teal-rgb),.2) }
.news-content { color: var(--font-color); line-height: 1.6 }
.news-content img { max-width: 100%; height: auto; border-radius: 5px; margin: 1rem 0 }
.news-content a { color: var(--dark-teal); text-decoration: none; transition: color .3s ease }
.news-content a:hover { color: var(--neon-blue); text-shadow: 0 0 5px rgba(var(--neon-blue-rgb),.5) }

@media (max-width:768px) {
    .news-section { padding: 1rem }
    .news-greeting { font-size: 1.5rem }
    .news-meta { flex-direction: column; align-items: flex-start; gap: .5rem }
}