@import url("https://fonts.googleapis.com/css2?family=Tilt+Neon&display=swap");

:root {
    --hw26-void: #07060c;
    --hw26-dusk: #120d1f;
    --hw26-orange: #ff7b2e;
    --hw26-slime: #a6ff4d;
    --hw26-slime-rgb: 166, 255, 77;
    --hw26-violet: #b77bff;
    --hw26-bone: #efe6d6;
    --hw26-moon: #f4ead2;
    --hw26-neon-font: 'Tilt Neon', system-ui, sans-serif;

    --hw26-glow-orange: 0 0 3px rgba(255, 123, 46, 0.95), 0 0 10px rgba(255, 123, 46, 0.6), 0 0 24px rgba(255, 123, 46, 0.32);
    --hw26-glow-slime: 0 0 3px rgba(166, 255, 77, 0.9), 0 0 10px rgba(166, 255, 77, 0.5), 0 0 22px rgba(166, 255, 77, 0.26);
    --hw26-glow-violet: 0 0 3px rgba(183, 123, 255, 0.9), 0 0 10px rgba(183, 123, 255, 0.5), 0 0 22px rgba(183, 123, 255, 0.26);

    --theme-stripe: linear-gradient(90deg, var(--hw26-orange), var(--hw26-violet));
    --theme-stripe-vertical: linear-gradient(180deg, var(--hw26-orange), var(--hw26-violet));
    --theme-accent: var(--hw26-orange);
    --theme-accent-soft: rgba(255, 123, 46, 0.14);
    --theme-accent-border: rgba(255, 123, 46, 0.38);

    --mini-tt-fade: var(--hw26-void);
    --mini-tt-now-line: var(--hw26-slime);

    --color-primary: #ff7b2e;
    --color-success: #a6ff4d;
    --color-danger: #ff4d6d;
    --color-bg: #07060c;
    --color-glass: rgba(183, 123, 255, 0.08);
    --color-glass-hover: rgba(183, 123, 255, 0.14);
    --color-text: #f6efe4;
    --color-text-muted: rgba(239, 230, 214, 0.72);
    --color-border: rgba(183, 123, 255, 0.12);
}

@keyframes hw26-flicker {
    0%, 5% { opacity: 1; }
    6% { opacity: 0.55; text-shadow: none; }
    10%, 19% { opacity: 1; }
    20% { opacity: 0.62; text-shadow: none; }
    24%, 60% { opacity: 1; }
    62% { opacity: 0.75; }
    66%, 100% { opacity: 1; }
}

@keyframes hw26-flicker-alt {
    0%, 9% { opacity: 1; }
    10% { opacity: 0.5; text-shadow: none; }
    14% { opacity: 0.85; }
    18% { opacity: 0.5; text-shadow: none; }
    44% { opacity: 0.55; text-shadow: none; }
    52%, 100% { opacity: 1; }
}

@keyframes hw26-breathe {
    0%, 100% { box-shadow: 0 0 0 2px var(--hw26-orange), 0 0 10px rgba(255, 123, 46, 0.45), inset 0 0 8px rgba(255, 123, 46, 0.25); }
    50% { box-shadow: 0 0 0 2px var(--hw26-orange), 0 0 22px rgba(255, 123, 46, 0.65), inset 0 0 12px rgba(255, 123, 46, 0.35); }
}

@keyframes hw26-fog {
    0% { transform: translateX(-4%); }
    100% { transform: translateX(4%); }
}

@keyframes hw26-bat-fly {
    0% { transform: translate(0, 0); }
    25% { transform: translate(calc(25vw + 30px), -16px); }
    50% { transform: translate(calc(50vw + 60px), 6px); }
    75% { transform: translate(calc(75vw + 90px), -10px); }
    100% { transform: translate(calc(100vw + 140px), 0); }
}

@keyframes hw26-bat-fly-rtl {
    0% { transform: translate(0, 0); }
    25% { transform: translate(calc(-25vw - 30px), -12px); }
    50% { transform: translate(calc(-50vw - 60px), 8px); }
    75% { transform: translate(calc(-75vw - 90px), -14px); }
    100% { transform: translate(calc(-100vw - 140px), 0); }
}


@keyframes hw26-haunt {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-4px); }
}

@keyframes hw26-flap {
    0% { transform: scaleY(1); }
    100% { transform: scaleY(0.45); }
}

::selection {
    background: rgba(255, 123, 46, 0.45);
    color: #fff;
}

html,
body {
    background-color: var(--hw26-void) !important;
    background-image:
        radial-gradient(ellipse 90% 60% at 50% -10%, rgba(183, 123, 255, 0.13), transparent 60%),
        radial-gradient(ellipse 60% 40% at 0% 100%, rgba(166, 255, 77, 0.05), transparent 60%),
        radial-gradient(ellipse 60% 40% at 100% 100%, rgba(255, 123, 46, 0.06), transparent 60%),
        radial-gradient(1px 1px at 12% 18%, rgba(244, 234, 210, 0.55), transparent),
        radial-gradient(1px 1px at 27% 41%, rgba(244, 234, 210, 0.35), transparent),
        radial-gradient(1.5px 1.5px at 63% 12%, rgba(244, 234, 210, 0.45), transparent),
        radial-gradient(1px 1px at 81% 33%, rgba(244, 234, 210, 0.4), transparent),
        radial-gradient(1px 1px at 92% 71%, rgba(244, 234, 210, 0.3), transparent),
        radial-gradient(1px 1px at 44% 83%, rgba(244, 234, 210, 0.25), transparent) !important;
    background-attachment: fixed !important;
}

body {
    color: var(--hw26-bone);
}

.header,
.header.is-expanded {
    overflow: hidden;
    overflow: clip;
}

.header {
    background: linear-gradient(180deg, #0b0816 0%, var(--hw26-dusk) 55%, #0a0712 100%) !important;
    box-shadow: inset 0 -2px 0 rgba(255, 123, 46, 0.85), 0 12px 18px -10px rgba(255, 123, 46, 0.4);
}

.header::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    background:
        radial-gradient(circle at 68% 42%, var(--hw26-moon) 0 24px, rgba(244, 234, 210, 0.22) 25px, rgba(244, 234, 210, 0.07) 48px, transparent 90px),
        radial-gradient(circle at 67.4% 39.5%, rgba(160, 150, 130, 0.35) 0 4px, transparent 5px),
        radial-gradient(circle at 68.6% 44%, rgba(160, 150, 130, 0.3) 0 6px, transparent 7px);
}

.header::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 104px;
    pointer-events: none;
    z-index: 2;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120'%3E%3Cg fill='%2305040a'%3E%3Cpath d='M0 120V82c140-18 290-10 420 2 150 14 280-20 440-14 140 6 230 18 340 12v38z'/%3E%3Cpath d='M176 76V56a8 8 0 0 1 16 0v20z'/%3E%3Cpath d='M210 80V66a6 6 0 0 1 12 0v14z'/%3E%3Cpath d='M296 78h52v3h-52z'/%3E%3Cpath d='M300 84V68l3-5 3 5v16zM314 84V68l3-5 3 5v16zM328 84V68l3-5 3 5v16zM342 84V68l3-5 3 5v16z'/%3E%3Cpath d='M518 90V64h-8v-6h8v-8h6v8h8v6h-8v26z'/%3E%3Cpath d='M752 74V52a10 10 0 0 1 20 0v22z'/%3E%3Cpath d='M790 76V64h12v12z'/%3E%3Cpath d='M976 78V66a6 6 0 0 1 12 0v12z'/%3E%3Cpath d='M1060 84c3-14 2-26-3-40l5 2c3 9 5 15 5 23 3-11 8-19 16-25l-6-10 5-1 5 8c4-3 9-5 14-6l1 4c-12 3-22 12-27 26-2 6-3 13-3 19z'/%3E%3Cpath d='M1048 50l-12-10 3-3 13 10z'/%3E%3Cpath d='M86 86c2-12 2-22-2-32l4 1c3 6 4 12 4 18 2-6 6-10 11-13l2 3c-6 4-10 10-11 18v5z'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: repeat-x;
    background-position: bottom center;
    background-size: auto 100%;
    opacity: 0.95;
    filter: drop-shadow(0 -1px 0 rgba(183, 123, 255, 0.35)) drop-shadow(0 -4px 10px rgba(183, 123, 255, 0.12));
}

.header .blur img {
    opacity: 0.28 !important;
    filter: blur(50px) saturate(160%) hue-rotate(-12deg) !important;
}

.header .blur::before {
    content: '';
    position: absolute;
    left: -10%;
    right: -10%;
    bottom: 0;
    height: 70%;
    pointer-events: none;
    z-index: 1;
    background:
        radial-gradient(ellipse 40% 45% at 25% 100%, rgba(183, 123, 255, 0.14), transparent 70%),
        radial-gradient(ellipse 45% 40% at 75% 100%, rgba(200, 200, 220, 0.08), transparent 70%);
    animation: hw26-fog 26s ease-in-out infinite alternate;
}

.header .blur::after {
    background: linear-gradient(180deg, rgba(7, 6, 12, 0.6) 0%, rgba(7, 6, 12, 0.15) 50%, rgba(7, 6, 12, 0.75) 100%) !important;
}

.header .now-playing .bigText,
.header .presenter-stats .bigText,
.header-expand-track,
.header-expand-presenter .bigText {
    font-family: var(--hw26-neon-font);
    font-weight: 400;
    letter-spacing: 0.01em;
}

.header .now-playing .bigText,
.header-expand-track {
    color: #fff1e4 !important;
    text-shadow: var(--hw26-glow-orange);
}

.header .presenter-stats .bigText,
.header-expand-presenter .bigText {
    color: #f3ffe6 !important;
    text-shadow: var(--hw26-glow-slime);
}

.header .now-playing .smallText,
.header-expand-artist {
    color: rgba(214, 186, 255, 0.92) !important;
}

.header .presenter-stats .smallText,
.header-expand-presenter .smallText {
    color: rgba(var(--hw26-slime-rgb), 0.8) !important;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 0.78em;
}

.header .stats .avatar,
.header-expand-presenter .avatar {
    background: var(--hw26-void) !important;
}

.header .stats .avatar img,
.header-expand-presenter .avatar img {
    border-radius: 50%;
}

.header .now-playing.left {
    margin-left: -16px;
    padding-left: 16px;
}

@media (max-width: 767px) {
    .header .now-playing.left {
        width: calc(100% + 16px);
    }

    .header .presenter-stats {
        overflow: visible;
    }
}

.header .now-playing .avatar {
    box-shadow: 0 0 0 2px var(--hw26-orange), 0 0 14px rgba(255, 123, 46, 0.55), 0 0 32px rgba(255, 123, 46, 0.22) !important;
}

.header .presenter-stats .avatar,
.header-expand-presenter .avatar {
    box-shadow: 0 0 0 2px var(--hw26-slime), 0 0 14px rgba(166, 255, 77, 0.45), 0 0 30px rgba(166, 255, 77, 0.18) !important;
}

.header .toggle.play {
    background: rgba(7, 6, 12, 0.72) !important;
    backdrop-filter: none !important;
    animation: hw26-breathe 4s ease-in-out infinite;
}

.header .toggle.play:hover {
    background: rgba(255, 123, 46, 0.18) !important;
}

.header .toggle.play svg,
.header .toggle.play i {
    color: #ffd9bf !important;
    stroke: #ffd9bf;
    filter: drop-shadow(0 0 4px rgba(255, 123, 46, 0.9));
}

.header .toggle.play.is-loading {
    animation: none;
}

.floatRight .toggle,
.header .toggle.volume {
    transition: box-shadow 0.2s ease, background 0.2s ease;
}

.floatRight .toggle:hover,
.header .toggle.volume:hover {
    background: rgba(183, 123, 255, 0.12);
    box-shadow: 0 0 0 1px rgba(183, 123, 255, 0.7), 0 0 14px rgba(183, 123, 255, 0.35);
}

.floatRight .toggle:hover svg {
    color: #f0e2ff !important;
}

.header .toggle.song-like.is-liked svg,
.header .toggle.song-like.is-liked i {
    color: var(--hw26-slime) !important;
    filter: drop-shadow(0 0 4px rgba(166, 255, 77, 0.8));
}

.volume-track::before {
    background: rgba(183, 123, 255, 0.2) !important;
}

.volume-track::after {
    background: linear-gradient(90deg, var(--hw26-violet), var(--hw26-orange)) !important;
    box-shadow: 0 0 8px rgba(255, 123, 46, 0.55);
}

#volume::-webkit-slider-thumb {
    background: #fff4ea;
    box-shadow: 0 0 0 2px var(--hw26-orange), 0 0 12px rgba(255, 123, 46, 0.8);
}

#volume::-moz-range-thumb {
    background: #fff4ea;
    box-shadow: 0 0 0 2px var(--hw26-orange), 0 0 12px rgba(255, 123, 46, 0.8);
}

.player-station-pill {
    background: rgba(7, 6, 12, 0.6) !important;
    border: 1px solid rgba(183, 123, 255, 0.55) !important;
    box-shadow: 0 0 10px rgba(183, 123, 255, 0.25);
}

.player-station-pill:hover {
    border-color: var(--hw26-violet) !important;
    box-shadow: 0 0 16px rgba(183, 123, 255, 0.45);
}

.header.is-expanded::before {
    opacity: 0.6;
}

.header.is-expanded::after {
    opacity: 0.55;
}

.header-expand-art {
    box-shadow: 0 0 0 2px var(--hw26-orange), 0 0 22px rgba(255, 123, 46, 0.45), 0 18px 50px rgba(0, 0, 0, 0.6) !important;
}

.header-expand-line.is-active {
    color: #fff3e8 !important;
    text-shadow: var(--hw26-glow-orange);
}

.header-expand-line.is-past {
    color: rgba(214, 186, 255, 0.42) !important;
}

.header-expand-btn:hover {
    box-shadow: 0 0 0 1px rgba(183, 123, 255, 0.7), 0 0 14px rgba(183, 123, 255, 0.35);
}

.hw26-fx .hw26-flicker {
    animation: hw26-flicker 1.2s linear 1;
}

.hw26-fx .hw26-flicker-alt {
    animation: hw26-flicker-alt 1.8s linear 1;
}

.hw26-bat {
    position: absolute;
    left: -60px;
    width: var(--hw26-bat-size, 24px);
    z-index: 4;
    pointer-events: none;
    animation-name: hw26-bat-fly;
    animation-timing-function: linear;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

.hw26-bat--rtl {
    left: auto;
    right: -60px;
    animation-name: hw26-bat-fly-rtl;
}

.hw26-bat svg {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
}

.hw26-bat-wing {
    fill: #06040b;
    stroke: rgba(255, 123, 46, 0.35);
    stroke-width: 0.8;
    transform-box: fill-box;
    transform-origin: center;
    animation: hw26-flap 0.32s ease-in-out infinite alternate;
}

.navbar {
    background: rgba(10, 7, 18, calc(0.08 + var(--nav-scroll, 0) * 0.86)) !important;
    border: 1px solid rgba(183, 123, 255, calc(0.08 + var(--nav-scroll, 0) * 0.2)) !important;
    box-shadow: 0 8px 28px rgba(0, 0, 0, calc(var(--nav-scroll, 0) * 0.45)), inset 0 -1px 0 rgba(183, 123, 255, calc(0.15 + var(--nav-scroll, 0) * 0.35)) !important;
}

@media (min-width: 992px) {
    .navbar {
        background: rgba(10, 7, 18, calc(0.3 + var(--nav-scroll, 0) * 0.62)) !important;
    }
}

.navbar .nav-link,
.navbar svg {
    color: rgba(239, 230, 214, 0.86) !important;
}

.navbar-toggler {
    border-color: rgba(255, 123, 46, 0.45) !important;
    box-shadow: 0 0 10px rgba(255, 123, 46, 0.2);
}

.navbar-dark .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%23ff7b2e' stroke-linecap='round' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") !important;
}

@media (max-width: 991px) {
    .navbar-collapse {
        background:
            radial-gradient(ellipse 80% 40% at 50% 0%, rgba(183, 123, 255, 0.16), transparent 70%),
            radial-gradient(ellipse 70% 35% at 50% 100%, rgba(255, 123, 46, 0.12), transparent 70%),
            rgba(7, 6, 12, 0.97) !important;
    }

    .navbar-collapse .nav-link {
        font-family: var(--hw26-neon-font) !important;
        font-size: 1.15rem;
        letter-spacing: 0.02em;
    }

    .navbar-collapse .nav-item.active > .nav-link,
    .navbar-collapse .nav-link.active {
        color: #fff1e4 !important;
        text-shadow: var(--hw26-glow-orange);
        box-shadow: none;
    }
}

.pageContainer.nav .navbar .nav-link:hover {
    color: var(--hw26-slime) !important;
}

.pageContainer.nav .navbar .nav-link.active,
.pageContainer.nav .navbar .nav-item.active > .nav-link {
    color: #fff !important;
    text-shadow: 0 0 8px rgba(255, 123, 46, 0.7);
    box-shadow: inset 0 -2px 0 var(--hw26-orange);
}

.nav-link .notificationIndicator {
    background: var(--hw26-orange) !important;
    color: #1a0b02 !important;
    box-shadow: 0 0 8px rgba(255, 123, 46, 0.7);
    animation: none !important;
}

.contentTitle.big {
    font-family: var(--hw26-neon-font);
    font-weight: 400 !important;
    color: #f6ecff !important;
    text-shadow: var(--hw26-glow-violet);
    position: relative;
    padding-bottom: 12px;
}

.contentTitle.big::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 64px;
    height: 3px;
    border-radius: 3px;
    background: var(--hw26-orange);
    box-shadow: 0 0 6px rgba(255, 123, 46, 0.9), 0 0 16px rgba(255, 123, 46, 0.45);
}

.contentTitle.big svg {
    color: var(--hw26-orange);
    filter: drop-shadow(0 0 4px rgba(255, 123, 46, 0.7));
}

.pageContainer .contentTitle:not(.big) {
    border-left: 2px solid var(--hw26-orange);
    padding-left: 10px;
}

.pageContainer .contentTitle:not(.big)::before {
    display: none;
}

.profileHeader .contentTitle {
    border-left: none;
    padding-left: 0;
}

.about,
.sff-box,
.int-box,
.tt-box,
.ab-card,
.wtl-box,
.hp-winner-card,
.hp-left-articles .article-card,
.shop-item,
.settings-hero,
.about-quick-card,
.about-page .about.about-panel,
.about-side-card,
.api-block,
.auth-shell .auth-card,
.notif-menu,
.recently-played .item,
.profile-hero,
.timetable-box:not(.disabled),
.dp-page .wtl-box,
.shop-page .shop-grid .shop-item,
.members-section,
.member-card {
    background: rgba(18, 13, 31, 0.78) !important;
    border: 1px solid rgba(183, 123, 255, 0.16) !important;
    border-image: none !important;
    box-shadow: inset 0 1px 0 rgba(255, 123, 46, 0.4), 0 10px 30px rgba(0, 0, 0, 0.35);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.article-card:hover,
.shop-item:hover,
.member-card:hover,
.timetable-box:not(.disabled):hover,
.recently-played .item:hover {
    border-color: rgba(255, 123, 46, 0.55) !important;
    box-shadow: inset 0 1px 0 rgba(255, 123, 46, 0.7), 0 0 18px rgba(255, 123, 46, 0.18), 0 10px 30px rgba(0, 0, 0, 0.35);
}

.shop-item.theme-item .shop-theme-limited {
    color: var(--hw26-slime);
    text-shadow: 0 0 6px rgba(166, 255, 77, 0.5);
}

.btn-primary {
    background: rgba(7, 6, 12, 0.6) !important;
    border: 1px solid var(--hw26-orange) !important;
    color: #ffe2cc !important;
    text-shadow: 0 0 6px rgba(255, 123, 46, 0.7);
    box-shadow: 0 0 10px rgba(255, 123, 46, 0.3), inset 0 0 8px rgba(255, 123, 46, 0.15);
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.btn-primary:hover,
.btn-primary:focus {
    background: var(--hw26-orange) !important;
    color: #1a0b02 !important;
    text-shadow: none;
    box-shadow: 0 0 18px rgba(255, 123, 46, 0.6);
}

.btn-primary:disabled,
.btn-primary.disabled {
    opacity: 0.5;
    box-shadow: none;
}

.pageContainer a:not(.btn):not(.nav-link):not(.toggle):hover {
    color: var(--hw26-slime);
}

.days .col.selected .day {
    background: rgba(255, 123, 46, 0.22) !important;
    color: #fff !important;
    box-shadow: inset 0 -2px 0 var(--hw26-orange), 0 0 12px rgba(255, 123, 46, 0.25);
}

.miniTimetable .pageContainer::after {
    background: var(--hw26-slime) !important;
    box-shadow: 0 0 10px rgba(166, 255, 77, 0.6) !important;
}

.community-row {
    border-left: 2px solid rgba(183, 123, 255, 0.4);
}

.community-row:hover {
    background: rgba(183, 123, 255, 0.08) !important;
    border-left-color: var(--hw26-slime);
}

.profile-tab.is-active,
.auth-tab.active {
    border-bottom: 2px solid var(--hw26-orange) !important;
    color: #fff !important;
}

.profile-hero-title {
    color: #fff !important;
    background: none !important;
    -webkit-text-fill-color: #fff !important;
    text-shadow: var(--hw26-glow-violet);
}

.footer-online-badge,
.auth-hero-badge,
.profile-stat-card {
    border-color: rgba(166, 255, 77, 0.35) !important;
    background: rgba(166, 255, 77, 0.06) !important;
    color: #fff !important;
}

.social-link:hover {
    border-color: rgba(183, 123, 255, 0.6) !important;
    background: rgba(183, 123, 255, 0.1) !important;
}

.footer {
    position: relative;
    border-top: none !important;
    background: linear-gradient(0deg, #05040a, rgba(18, 13, 31, 0.96)) !important;
    box-shadow: inset 0 2px 0 rgba(166, 255, 77, 0.55), 0 -2px 16px rgba(166, 255, 77, 0.12);
}

html {
    accent-color: var(--hw26-orange);
}

html[data-theme="halloween2026"] .articles-track,
html[data-theme="halloween2026"] .hp-left-articles .articles-track {
    scrollbar-color: var(--hw26-orange) rgba(183, 123, 255, 0.1);
}

html[data-theme="halloween2026"] .articles-track::-webkit-scrollbar-track,
html[data-theme="halloween2026"] .hp-left-articles .articles-track::-webkit-scrollbar-track {
    background: rgba(183, 123, 255, 0.1);
}

html[data-theme="halloween2026"] .articles-track::-webkit-scrollbar-thumb,
html[data-theme="halloween2026"] .hp-left-articles .articles-track::-webkit-scrollbar-thumb {
    background: var(--hw26-orange);
    box-shadow: 0 0 6px rgba(255, 123, 46, 0.6);
}

html[data-theme="halloween2026"] .articles-track::-webkit-scrollbar-thumb:hover,
html[data-theme="halloween2026"] .hp-left-articles .articles-track::-webkit-scrollbar-thumb:hover {
    background: #ff9150;
}

.station-selector {
    background: rgba(10, 7, 18, 0.78) !important;
    border: 1px solid rgba(183, 123, 255, 0.3) !important;
    box-shadow: 0 0 14px rgba(183, 123, 255, 0.18);
}

.station-bubble.active {
    box-shadow: 0 0 0 2px var(--hw26-orange), 0 0 12px rgba(255, 123, 46, 0.6) !important;
}

.station-bubble.active::after {
    border-color: rgba(255, 123, 46, 0.45) !important;
}

.station-bubble.active .station-bubble__icon-fallback {
    background: var(--hw26-orange) !important;
    color: #1a0b02 !important;
}

.station-bubble__tooltip {
    background: #120d1f !important;
    border: 1px solid rgba(255, 123, 46, 0.45);
}

@media (max-width: 991px) {
    body:has(.station-selector:not(.single)) .header {
        padding-top: 112px;
    }
}

:focus-visible {
    outline: 2px solid var(--hw26-orange);
    outline-offset: 2px;
}

.pageAjax.page-is-loading::after {
    background: linear-gradient(90deg, transparent, var(--hw26-orange) 40%, var(--hw26-slime) 60%, transparent) !important;
    box-shadow: 0 0 8px rgba(255, 123, 46, 0.6);
}

.dropdown-menu,
.notif-menu {
    background: rgba(14, 10, 24, 0.97) !important;
    border: 1px solid rgba(183, 123, 255, 0.22) !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.55), 0 0 18px rgba(183, 123, 255, 0.12) !important;
}

.dropdown-menu::before {
    border-color: transparent transparent rgba(14, 10, 24, 0.97) transparent !important;
}

.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
    background: rgba(255, 123, 46, 0.12) !important;
    color: #fff1e4 !important;
}

.dropdown-menu .dropdown-item.active,
.dropdown-menu .dropdown-item:active {
    background: rgba(255, 123, 46, 0.2) !important;
    color: #fff !important;
}

.dropdown-divider {
    border-color: rgba(183, 123, 255, 0.16) !important;
}

.modal-backdrop {
    background: linear-gradient(0deg, rgba(20, 10, 34, 0.35) 0%, rgba(7, 6, 12, 1) 100%) !important;
}

.modal-content {
    background: linear-gradient(180deg, #120d1f 0%, #0a0712 100%) !important;
    border: 1px solid rgba(183, 123, 255, 0.22) !important;
    box-shadow: inset 0 2px 0 rgba(255, 123, 46, 0.75), 0 0 30px rgba(183, 123, 255, 0.12), 0 30px 80px rgba(0, 0, 0, 0.6) !important;
}

.modal-title {
    font-family: var(--hw26-neon-font);
    font-weight: 400;
    text-shadow: 0 0 8px rgba(183, 123, 255, 0.55);
}

.modal-header,
.modal-footer {
    border-color: rgba(183, 123, 255, 0.12) !important;
}

.modal .close,
.modal .btn-close {
    color: var(--hw26-bone);
    text-shadow: none;
    opacity: 0.7;
}

.modal .close:hover {
    color: var(--hw26-orange);
    opacity: 1;
}

form input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]):not([type="button"]),
form select,
form textarea,
.form-control,
select {
    background-color: rgba(183, 123, 255, 0.07) !important;
    color: var(--hw26-bone) !important;
    box-shadow: inset 0 0 0 1px rgba(183, 123, 255, 0.16);
    transition: box-shadow 0.2s ease, background-color 0.2s ease;
}

form input:focus,
form select:focus,
form textarea:focus,
.form-control:focus,
select:focus,
html[data-theme="halloween2026"] .password-input input:focus,
html[data-theme="halloween2026"] .pk-name-field input:focus,
.members-search-input:focus,
.members-select:focus,
.shop-select:focus,
.top-tracks-search:focus,
.profile-message-input:focus,
.auth-form input:focus,
.ban-appeal-form__textarea:focus,
.modal-rbt form .form-control:focus,
.modal-rbt--edit .modal-rbt__fields .form-control:focus {
    background-color: rgba(255, 123, 46, 0.06) !important;
    border-color: rgba(255, 123, 46, 0.6) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 123, 46, 0.7), 0 0 14px rgba(255, 123, 46, 0.22) !important;
    outline: none;
}

::placeholder {
    color: rgba(239, 230, 214, 0.42) !important;
}

select option {
    background: #120d1f;
    color: var(--hw26-bone);
}

.btn-secondary,
.btn-outline-light,
.btn-light {
    background: rgba(183, 123, 255, 0.1) !important;
    border: 1px solid rgba(183, 123, 255, 0.3) !important;
    color: #eadcff !important;
}

.btn-secondary:hover,
.btn-outline-light:hover,
.btn-light:hover {
    background: rgba(183, 123, 255, 0.2) !important;
    box-shadow: 0 0 12px rgba(183, 123, 255, 0.3);
}

.btn-danger {
    background: rgba(255, 77, 109, 0.14) !important;
    border: 1px solid rgba(255, 77, 109, 0.6) !important;
    color: #ffd0d9 !important;
}

.btn-danger:hover {
    background: #ff4d6d !important;
    color: #1a0408 !important;
}

.btn-success {
    background: rgba(166, 255, 77, 0.12) !important;
    border: 1px solid rgba(166, 255, 77, 0.6) !important;
    color: #eaffd6 !important;
}

.btn-success:hover {
    background: var(--hw26-slime) !important;
    color: #0e1a03 !important;
}

.tooltip-inner {
    background: #120d1f !important;
    color: var(--hw26-bone) !important;
    border: 1px solid rgba(255, 123, 46, 0.45);
    box-shadow: 0 0 10px rgba(255, 123, 46, 0.2);
}

.bs-tooltip-top .arrow::before,
.bs-tooltip-auto[x-placement^="top"] .arrow::before {
    border-top-color: rgba(255, 123, 46, 0.6) !important;
}

.bs-tooltip-bottom .arrow::before,
.bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
    border-bottom-color: rgba(255, 123, 46, 0.6) !important;
}

.bs-tooltip-left .arrow::before,
.bs-tooltip-auto[x-placement^="left"] .arrow::before {
    border-left-color: rgba(255, 123, 46, 0.6) !important;
}

.bs-tooltip-right .arrow::before,
.bs-tooltip-auto[x-placement^="right"] .arrow::before {
    border-right-color: rgba(255, 123, 46, 0.6) !important;
}

.ui-pnotify-container {
    background: #120d1f !important;
    background-image: none !important;
    color: var(--hw26-bone) !important;
    border: 1px solid rgba(183, 123, 255, 0.25) !important;
    border-left: 3px solid var(--hw26-violet) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5), 0 0 16px rgba(183, 123, 255, 0.15) !important;
}

.ui-pnotify-container.brighttheme-success {
    border-left-color: var(--hw26-slime) !important;
}

.ui-pnotify-container.brighttheme-error {
    border-left-color: #ff4d6d !important;
}

.ui-pnotify-container.brighttheme-notice {
    border-left-color: var(--hw26-orange) !important;
}

.ui-pnotify-title {
    color: #fff !important;
}

.ui-pnotify-text,
.ui-pnotify-closer {
    color: rgba(239, 230, 214, 0.85) !important;
}

.skeleton {
    background-color: rgba(183, 123, 255, 0.07) !important;
}

.skeleton::after {
    background: linear-gradient(-45deg, transparent 40%, rgba(255, 123, 46, 0.07) 50%, transparent 60%) !important;
    background-size: 500% !important;
}

.profile-page {
    --profile-accent: #ff7b2e;
    --profile-accent-soft: rgba(255, 123, 46, 0.12);
    --profile-accent-border: rgba(255, 123, 46, 0.3);
    --profile-glass: linear-gradient(324deg, rgba(183, 123, 255, 0.04) 0%, rgba(183, 123, 255, 0.08) 80%);
    --profile-glass-hover: linear-gradient(324deg, rgba(183, 123, 255, 0.07) 0%, rgba(255, 123, 46, 0.08) 80%);
}

.song-page {
    --song-accent: #ff7b2e;
}

.articles-page {
    --art-accent: #ff7b2e;
}

.profile-tab-count,
.profile-role-pill,
.profile-role-icon {
    background: rgba(183, 123, 255, 0.16) !important;
    border-color: rgba(183, 123, 255, 0.4) !important;
}

.profile-badge-pill {
    box-shadow: 0 0 8px color-mix(in srgb, var(--profile-badge-accent, #b77bff) 30%, transparent);
}

.members-hero,
.members-hero--staff {
    background:
        linear-gradient(135deg, rgba(255, 123, 46, 0.14) 0%, rgba(18, 13, 31, 0.6) 45%, rgba(183, 123, 255, 0.14) 100%) !important;
    border: 1px solid rgba(183, 123, 255, 0.18) !important;
}

.members-hero-bg {
    background:
        radial-gradient(circle at 85% 10%, rgba(255, 123, 46, 0.14), transparent 40%),
        radial-gradient(circle at 10% 90%, rgba(183, 123, 255, 0.14), transparent 40%) !important;
}

.members-page-num.is-active,
.articles-page .articles-page-num.is-active,
.page-item.active .page-link {
    background: var(--hw26-orange) !important;
    border-color: var(--hw26-orange) !important;
    color: #1a0b02 !important;
    box-shadow: 0 0 12px rgba(255, 123, 46, 0.45);
}

.page-link {
    background: rgba(183, 123, 255, 0.08) !important;
    border-color: rgba(183, 123, 255, 0.18) !important;
    color: var(--hw26-bone) !important;
}

.members-sidebar-btn:hover,
.profile-host-chip:hover {
    border-color: rgba(255, 123, 46, 0.5) !important;
    box-shadow: 0 0 12px rgba(255, 123, 46, 0.2);
}

.shop-price,
.shop-points-badge {
    color: var(--hw26-orange) !important;
}

.shop-points-badge {
    background: rgba(255, 123, 46, 0.1) !important;
    border-color: rgba(255, 123, 46, 0.35) !important;
    box-shadow: 0 0 10px rgba(255, 123, 46, 0.15);
}

.shop-badge--sale {
    background: var(--hw26-slime) !important;
    color: #0e1a03 !important;
}

.auth-tab.active,
.auth-nav-link.active,
html[data-theme="halloween2026"] .settings-nav-link.active {
    background: rgba(255, 123, 46, 0.14) !important;
    border-color: rgba(255, 123, 46, 0.5) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 123, 46, 0.35), 0 0 12px rgba(255, 123, 46, 0.15) !important;
    color: #fff !important;
}

.auth-submit,
.reboot-confirm-btn--purchase,
html[data-theme="halloween2026"] .settings-page #settingsPkRegisterBtn,
html[data-theme="halloween2026"] .password-submit,
html[data-theme="halloween2026"] .btn-allow-oauth {
    background: var(--hw26-orange) !important;
    color: #1a0b02 !important;
    border: none !important;
    box-shadow: 0 0 14px rgba(255, 123, 46, 0.4);
}

.auth-submit:hover,
.reboot-confirm-btn--purchase:hover,
html[data-theme="halloween2026"] .btn-allow-oauth:hover {
    background: #ff9150 !important;
    box-shadow: 0 0 22px rgba(255, 123, 46, 0.55);
}

html[data-theme="halloween2026"] .theme-preview-img.selected,
html[data-theme="halloween2026"] .viz-option-preview.selected,
.badge-option-btn.is-selected .badge-option-preview {
    border-color: var(--hw26-orange) !important;
    box-shadow: 0 0 0 1px var(--hw26-orange), 0 0 16px rgba(255, 123, 46, 0.45) !important;
}

html[data-theme="halloween2026"] .settings-hero-badge.on,
html[data-theme="halloween2026"] .settings-inline-alert.success,
html[data-theme="halloween2026"] .password-chip,
html[data-theme="halloween2026"] .security-pill.on,
html[data-theme="halloween2026"] .oauth-app-badge.verified,
html[data-theme="halloween2026"] .my-app-status--accepted,
html[data-theme="halloween2026"] .api-verb-get,
.auth-connected-badge {
    background: rgba(166, 255, 77, 0.1) !important;
    border-color: rgba(166, 255, 77, 0.4) !important;
    color: #dcffb8 !important;
}

html[data-theme="halloween2026"] .settings-gate-card svg,
.shop-gate-card svg,
.auth-status-icon {
    color: var(--hw26-orange) !important;
    filter: drop-shadow(0 0 6px rgba(255, 123, 46, 0.6));
}

html[data-theme="halloween2026"] .pk-row-icon,
html[data-theme="halloween2026"] .oauth-user-avatar {
    background: rgba(255, 123, 46, 0.12) !important;
    border-color: rgba(255, 123, 46, 0.35) !important;
}

html[data-theme="halloween2026"] .account-meta-value a,
html[data-theme="halloween2026"] .api-note a,
html[data-theme="halloween2026"] .oauth-headline strong,
html[data-theme="halloween2026"] .oauth-footer-note a,
html[data-theme="halloween2026"] .about-page .article-content a:not(.btn),
html[data-theme="halloween2026"] .about-page .external-link,
.contentBody a:not(.btn),
.article-content a:not(.btn) {
    color: var(--hw26-orange) !important;
    border-bottom-color: rgba(255, 123, 46, 0.3) !important;
}

html[data-theme="halloween2026"] .api-jump a:hover,
html[data-theme="halloween2026"] .api-jump a.is-active {
    background: rgba(255, 123, 46, 0.1) !important;
    border-color: rgba(255, 123, 46, 0.3) !important;
}

html[data-theme="halloween2026"] .api-base-inline {
    color: #dcffb8 !important;
    border-color: rgba(166, 255, 77, 0.25) !important;
}

html[data-theme="halloween2026"] .api-icon-btn.copied {
    color: var(--hw26-slime) !important;
    border-color: rgba(166, 255, 77, 0.4) !important;
    background: rgba(166, 255, 77, 0.08) !important;
}

html[data-theme="halloween2026"] .my-app-thread-item.is-applicant {
    border-color: rgba(255, 123, 46, 0.3) !important;
}

.days .day {
    transition: background 0.2s ease, box-shadow 0.2s ease;
}

.days .col:not(.selected) .day:hover {
    background: rgba(183, 123, 255, 0.1) !important;
}

.tt-box .time {
    color: var(--hw26-orange) !important;
    text-shadow: 0 0 6px rgba(255, 123, 46, 0.5);
}

.tt-box .avatar {
    box-shadow: 0 0 0 2px rgba(183, 123, 255, 0.55), 0 0 12px rgba(183, 123, 255, 0.3);
}

.tt-box:hover {
    border-color: rgba(255, 123, 46, 0.5) !important;
}

.onlineMember img {
    box-shadow: 0 0 0 2px rgba(183, 123, 255, 0.35);
}

.onlineMember a:hover img {
    box-shadow: 0 0 0 2px var(--hw26-orange), 0 0 12px rgba(255, 123, 46, 0.45);
}

.footer-credits.credits a:hover,
.footer-links a:hover {
    color: var(--hw26-orange) !important;
}

.profileHeader,
.banners {
    box-shadow: inset 0 -2px 0 rgba(255, 123, 46, 0.6);
}

.profileAvatar {
    box-shadow: 0 0 0 2px var(--hw26-orange), 0 0 18px rgba(255, 123, 46, 0.35);
}

.theme-preview-img:hover {
    box-shadow: 0 0 14px rgba(183, 123, 255, 0.4);
}

table,
.table {
    color: var(--hw26-bone);
}

.table th,
.table td,
.table thead th {
    border-color: rgba(183, 123, 255, 0.14) !important;
}

.table-hover tbody tr:hover {
    background: rgba(255, 123, 46, 0.06);
}

.badge-primary {
    background: var(--hw26-orange) !important;
    color: #1a0b02 !important;
}

.badge-success {
    background: var(--hw26-slime) !important;
    color: #0e1a03 !important;
}

.alert {
    background: rgba(18, 13, 31, 0.85) !important;
    border: 1px solid rgba(183, 123, 255, 0.22) !important;
    color: var(--hw26-bone) !important;
}

.alert-success {
    border-left: 3px solid var(--hw26-slime) !important;
}

.alert-danger {
    border-left: 3px solid #ff4d6d !important;
}

.alert-warning,
.alert-info {
    border-left: 3px solid var(--hw26-orange) !important;
}

.reboot-confirm-dialog {
    background: linear-gradient(180deg, #120d1f 0%, #0a0712 100%) !important;
    border: 1px solid rgba(183, 123, 255, 0.22) !important;
    box-shadow: inset 0 2px 0 rgba(255, 123, 46, 0.75), 0 30px 80px rgba(0, 0, 0, 0.6) !important;
}

.aap-sheet {
    background: linear-gradient(180deg, #120d1f 0%, #07060c 100%) !important;
    border-top: 1px solid rgba(255, 123, 46, 0.55);
    box-shadow: 0 -4px 24px rgba(255, 123, 46, 0.15);
}

.aap-btn-primary {
    background: var(--hw26-orange) !important;
    color: #1a0b02 !important;
}

html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar {
    position: relative !important;
    overflow: visible !important;
    background: linear-gradient(180deg, rgba(26, 19, 41, 0.92) 0%, rgba(8, 6, 14, 0.92) 100%) !important;
    border: 1px solid rgba(183, 123, 255, 0.55) !important;
    box-shadow: 0 0 12px rgba(183, 123, 255, 0.28), inset 0 0 10px rgba(183, 123, 255, 0.12), inset 0 -1px 0 rgba(255, 123, 46, 0.45), 0 6px 20px rgba(0, 0, 0, 0.45) !important;
}

html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar::before {
    content: '';
    position: absolute;
    top: -7px;
    right: 6px;
    width: 26px;
    height: 20px;
    pointer-events: none;
    opacity: 0.7;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 20'%3E%3Cg fill='none' stroke='%23d9cfe8' stroke-width='0.7' stroke-linecap='round'%3E%3Cpath d='M26 0L2 0M26 0L6 12M26 0L16 19M26 0L26 18'/%3E%3Cpath d='M20 0q1 3 3 4.5q1.2-2 3-1.5M14 0q2 5 5.5 7.5q2.5-2.5 6.5-2M8 0q3 8 9 11.5q4-3 9-2.5'/%3E%3C/g%3E%3Cpath d='M13 13.5v3' stroke='%23d9cfe8' stroke-width='0.5'/%3E%3Ccircle cx='13' cy='17.4' r='1.3' fill='%2306040b' stroke='%23ff7b2e' stroke-width='0.5'/%3E%3C/svg%3E") no-repeat center / contain;
}

html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar .toggle,
html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar a.toggle {
    transition: background 0.2s ease, box-shadow 0.2s ease !important;
}

html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar .toggle svg,
html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar a.toggle svg,
html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar .toggle i,
html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar a.toggle i {
    color: rgba(239, 230, 214, 0.78) !important;
    transition: color 0.2s ease, filter 0.2s ease;
}

html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar .toggle:hover,
html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar a.toggle:hover {
    background: rgba(var(--hw26-hover-rgb, 255, 123, 46), 0.14) !important;
    box-shadow: 0 0 0 1px rgba(var(--hw26-hover-rgb, 255, 123, 46), 0.7), 0 0 12px rgba(var(--hw26-hover-rgb, 255, 123, 46), 0.4) !important;
}

html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar .toggle:hover svg,
html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar a.toggle:hover svg {
    color: rgb(var(--hw26-hover-rgb, 255, 123, 46)) !important;
    filter: drop-shadow(0 0 4px rgba(var(--hw26-hover-rgb, 255, 123, 46), 0.85));
}

.header .player-actions-bar .fs-player-open {
    --hw26-hover-rgb: 255, 123, 46;
}

.header .player-actions-bar .visualizer-style {
    --hw26-hover-rgb: 166, 255, 77;
}

.header .player-actions-bar #headerRequest {
    --hw26-hover-rgb: 183, 123, 255;
}

.header .player-actions-bar .song-like {
    --hw26-hover-rgb: 255, 196, 80;
}

.header .player-actions-bar .heart {
    --hw26-hover-rgb: 255, 77, 109;
}

html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar .toggle.song-like.is-liked svg {
    color: #ffc450 !important;
    fill: rgba(255, 196, 80, 0.35);
    filter: drop-shadow(0 0 5px rgba(255, 196, 80, 0.9));
}

html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar .toggle.heart svg[style*="255, 71, 87"],
html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar .toggle.heart svg[style*="ff4757"] {
    color: #ff4d6d !important;
    fill: rgba(255, 77, 109, 0.4);
    filter: drop-shadow(0 0 5px rgba(255, 77, 109, 0.9));
}

html[data-theme="halloween2026"]:not([data-theme="core"]):not([data-theme="pride"]) body .header .player-actions-bar .toggle.visualizer-style.viz-toggle-off svg {
    color: rgba(239, 230, 214, 0.4) !important;
}

#musicVisualizer {
    mix-blend-mode: normal !important;
    filter: drop-shadow(0 0 4px rgba(255, 123, 46, 0.55));
}

.profile-hero,
.profile-hero--user {
    background: linear-gradient(180deg, #110c1e 0%, #0a0712 100%) !important;
    border: 1px solid rgba(183, 123, 255, 0.22) !important;
}

.profile-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120'%3E%3Cg fill='%2305040a'%3E%3Cpath d='M0 120V82c140-18 290-10 420 2 150 14 280-20 440-14 140 6 230 18 340 12v38z'/%3E%3Cpath d='M176 76V56a8 8 0 0 1 16 0v20z'/%3E%3Cpath d='M518 90V64h-8v-6h8v-8h6v8h8v6h-8v26z'/%3E%3Cpath d='M752 74V52a10 10 0 0 1 20 0v22z'/%3E%3Cpath d='M1060 84c3-14 2-26-3-40l5 2c3 9 5 15 5 23 3-11 8-19 16-25l-6-10 5-1 5 8c4-3 9-5 14-6l1 4c-12 3-22 12-27 26-2 6-3 13-3 19z'/%3E%3C/g%3E%3C/svg%3E") repeat-x bottom center / auto 64px,
        radial-gradient(circle at 88% 22%, rgba(244, 234, 210, 0.9) 0 16px, rgba(244, 234, 210, 0.16) 17px, rgba(244, 234, 210, 0.05) 34px, transparent 60px),
        radial-gradient(ellipse 60% 50% at 20% 100%, rgba(183, 123, 255, 0.16), transparent 70%);
    opacity: 0.9;
}

.profile-hero-overlay {
    background: linear-gradient(180deg, rgba(10, 7, 18, 0.25) 0%, rgba(10, 7, 18, 0.65) 60%, rgba(7, 6, 12, 0.88) 100%) !important;
}

.profile-hero-name,
.profile-hero-body > h1.profile-hero-name {
    font-family: var(--hw26-neon-font) !important;
    font-weight: 400 !important;
    color: #f6ecff !important;
    -webkit-text-fill-color: #f6ecff !important;
    background: none !important;
    text-shadow: var(--hw26-glow-violet);
}

.profile-hero-avatar-col .profileAvatar {
    outline: 1.5px dashed rgba(166, 255, 77, 0.6);
    outline-offset: 7px;
    border: 2px solid var(--hw26-orange) !important;
    box-shadow: 0 0 16px rgba(255, 123, 46, 0.45), inset 0 0 10px rgba(255, 123, 46, 0.25) !important;
}

.profile-panel-head {
    border-bottom-color: rgba(183, 123, 255, 0.16) !important;
}

.profile-panel-head svg,
.profile-panel-head i,
.profile-stat-icon {
    color: var(--hw26-orange) !important;
    filter: drop-shadow(0 0 4px rgba(255, 123, 46, 0.5));
}

.profile-stat-value {
    color: #fff1e4 !important;
    text-shadow: 0 0 8px rgba(255, 123, 46, 0.45);
}

.profile-tab.is-active {
    text-shadow: 0 0 8px rgba(255, 123, 46, 0.55);
}

.profile-message-form,
.profile-message-body {
    border-color: rgba(183, 123, 255, 0.16) !important;
}

.profile-message-author {
    color: #eadcff !important;
}

.profile-status-pill--online,
.profile-online-dot,
.profileAvatar.online::after,
.profile-message-avatar.online::after,
.member-card-avatar-wrap.is-online::after,
.follow-list-avatar--online::after {
    background: var(--hw26-slime) !important;
    box-shadow: 0 0 8px rgba(166, 255, 77, 0.7) !important;
}

.profile-status-pill--listening,
.profileAvatar.listening::after,
.profile-message-avatar.listening::after,
.member-card-avatar-wrap.is-listening::after,
.follow-list-avatar--listening::after {
    background: var(--hw26-orange) !important;
    box-shadow: 0 0 8px rgba(255, 123, 46, 0.7) !important;
}

.profile-status-pill--online,
.profile-status-pill--listening {
    color: #120d1f !important;
}

.footer-online-title {
    font-family: var(--hw26-neon-font) !important;
    font-weight: 400 !important;
    color: #f6ecff !important;
    text-shadow: var(--hw26-glow-violet);
}

.onlineMember {
    animation: hw26-haunt 5s ease-in-out infinite;
}

.onlineMember:nth-child(3n + 1) {
    animation-delay: -1.6s;
}

.onlineMember:nth-child(3n + 2) {
    animation-delay: -3.2s;
}

.onlineMember:nth-child(4n) {
    animation-duration: 6.5s;
}

.onlineMember a {
    border: 2px solid rgba(183, 123, 255, 0.55) !important;
    background: #120d1f !important;
    box-shadow: 0 0 10px rgba(183, 123, 255, 0.3), 0 6px 12px rgba(0, 0, 0, 0.45);
}

.onlineMember a:hover {
    border-color: var(--hw26-orange) !important;
    box-shadow: 0 0 16px rgba(255, 123, 46, 0.6), 0 8px 16px rgba(0, 0, 0, 0.5);
}

.onlineMember img {
    filter: saturate(0.85) contrast(1.05);
}

.onlineMember a:hover img {
    filter: none;
}

.onlineMember.active a {
    border-color: rgba(166, 255, 77, 0.7) !important;
}

.onlineMember.active::after,
.onlineMember.active::before {
    background: var(--hw26-slime) !important;
}

.onlineMember.listening a {
    border-color: rgba(255, 123, 46, 0.75) !important;
}

.onlineMember.listening::after,
.onlineMember.listening::before {
    background: var(--hw26-orange) !important;
    box-shadow: 0 0 0 1px rgba(255, 123, 46, 0.5) !important;
}

.footer-online-empty {
    color: rgba(214, 186, 255, 0.75) !important;
    font-style: italic;
}

.animation-toggle.hw26-toggle {
    background: rgba(7, 6, 12, 0.85);
    color: #ffe2cc;
    border: 1px solid rgba(255, 123, 46, 0.6);
    border-radius: 999px;
    box-shadow: 0 0 10px rgba(255, 123, 46, 0.25);
    font-size: 13px;
    padding: 7px 14px;
}

.animation-toggle.hw26-toggle:hover {
    background: rgba(255, 123, 46, 0.15);
}

.animation-toggle.hw26-toggle svg {
    width: 14px;
    height: 14px;
    vertical-align: -2px;
}

@media (max-width: 767px) {
    .header::before {
        background:
            radial-gradient(circle at 84% 20%, var(--hw26-moon) 0 14px, rgba(244, 234, 210, 0.2) 15px, rgba(244, 234, 210, 0.06) 30px, transparent 56px);
        opacity: 0.85;
    }

    .header::after {
        height: 64px;
        background-size: auto 100%;
    }

    .header .now-playing .bigText,
    .header-expand-track {
        text-shadow: 0 0 3px rgba(255, 123, 46, 0.9), 0 0 9px rgba(255, 123, 46, 0.45);
    }

    .header .presenter-stats .bigText,
    .header-expand-presenter .bigText {
        text-shadow: 0 0 3px rgba(166, 255, 77, 0.85), 0 0 9px rgba(166, 255, 77, 0.4);
    }

    .contentTitle.big {
        text-shadow: 0 0 3px rgba(183, 123, 255, 0.85), 0 0 9px rgba(183, 123, 255, 0.4);
    }

    .hw26-bat {
        width: calc(var(--hw26-bat-size, 24px) * 0.75);
    }

    .animation-toggle.hw26-toggle {
        bottom: 12px;
        right: 12px;
        font-size: 12px;
        padding: 6px 11px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .header::before {
        background:
            radial-gradient(circle at 62% 26%, var(--hw26-moon) 0 18px, rgba(244, 234, 210, 0.2) 19px, rgba(244, 234, 210, 0.06) 38px, transparent 70px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .header .toggle.play,
    .header .blur::before,
    .hw26-fx .hw26-flicker,
    .hw26-fx .hw26-flicker-alt,
    .hw26-bat-wing,
    .onlineMember {
        animation: none !important;
    }

    .hw26-bat {
        display: none !important;
    }

    .header .toggle.play {
        box-shadow: 0 0 0 2px var(--hw26-orange), 0 0 14px rgba(255, 123, 46, 0.5);
    }
}
