html, body { margin: 0; padding: 0; }
body {
    box-sizing: border-box;
    background: var(--st-bg);
    color: var(--st-on-bg);
    font-family: var(--st-font-body), system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

.st-powered-link { display: flex; justify-content: center; align-items: center; width: 100%;text-decoration: none; }
.st-powered-logo {display: block; margin: 0 auto;height: 25px; }

*, *::before, *::after { box-sizing: inherit; }
img, svg, video, canvas, audio, iframe, embed, object { max-width: 100%; }
h1, h2, h3, h4, h5, h6 { font-family: var(--st-font-heading), system-ui, sans-serif; }
.truncate { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.thdef_is_hidden, .bm_is_hidden, .jmb_message--hidden { display: none !important; }
.thdef_modal_locked, body.join_modal_locked { overflow: hidden; }

/* Shared theme primitives */
.thdef_section { width: 100%; }
.thdef_shell { max-width: 1100px; margin: 0 auto; }
.thdef_narrow { max-width: 760px; margin: 0 auto; }
.thdef_block_header { text-align: center; margin: 0 auto 1.75rem; max-width: 900px; }
.thdef_heading,
.bnrs_heading,.sli_heading,.cbc_heading,.ef_heading,.bm_heading,.q_heading,.jmb_heading,.ytb_heading,.mlb_heading,.sd_headings,.ad_headings {
    margin: 0 0 .5rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.02em;
}
.thdef_heading--xs { font-size: clamp(1.2rem, 2vw, 1.6rem); }
.thdef_heading--sm,.jmb_heading,.ytb_heading { font-size: clamp(1.6rem, 2.5vw, 1.9rem); }
.thdef_heading--md,.sli_heading,.cbc_heading,.mlb_heading,.sd_headings,.ad_headings { font-size: clamp(1.8rem, 3vw, 2.2rem); }
.thdef_heading--lg,.bnrs_heading { font-size: clamp(2rem, 4vw, 3rem); }
.thdef_heading--xl { font-size: clamp(2.75rem, 6vw, 4.5rem); }
.thdef_subheading,
.bnrs_subheading,.sli_subheading,.cbc_subheading,.ef_subheading,.bm_subheading,.q_subheading,.jmb_subheading,.ytb_subheading,.mlb_subheading,.sd_subheadings,.ad_subheadings {
    margin: 0 auto;
    max-width: 720px;
    font-size: 1.05rem;
    line-height: 1.6;
    font-weight: 400;
}
.thdef_subheading--sm,.jmb_subheading,.ytb_subheading { font-size: .98rem; }
.thdef_subheading--lg,.bnrs_subheading { font-size: clamp(1.1rem, 2.2vw, 1.35rem); }
.thdef_text_bg,.streaming_subhead,.lyrics_subhead { color: var(--st-on-bg); }
.thdef_text_bg_heading,.streaming_head,.tracks_head,.lyrics_head { color: var(--st-on-bg-hdr); }
.thdef_text_surface { color: var(--st-on-surface); }
.thdef_text_surface_heading { color: var(--st-on-surface-hdr); }
.thdef_text_surface_alt { color: var(--st-on-surface-alt); }
.thdef_text_surface_alt_heading,.about_head { color: var(--st-on-surface-alt-hdr); }
.thdef_text_secondary { color: var(--st-on-secondary); }
.thdef_text_hero,.thdef_text_custom { color: var(--ytb-text-color, #fff); }

.thdef_button,.cbc_button,.jmb_button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .8rem 1.9rem;
    border: 0;
    border-radius: 999px;
    background: var(--st-cta-bg);
    color: var(--st-cta-text);
    cursor: pointer;
    font-size: .95rem;
    font-weight: 600;
    letter-spacing: .06em;
    line-height: 1;
    text-decoration: none;
    text-transform: uppercase;
    transition: transform .15s ease, background .2s ease, color .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.thdef_button:hover,.cbc_button:hover,.jmb_button:hover { background: var(--st-cta-bg-hover); color: var(--st-cta-text); transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,.25); }
.thdef_button:active,.cbc_button:active,.jmb_button:active { transform: translateY(0); box-shadow: none; }
.thdef_pill_link,.phfs_song_link {
    display: inline-flex; align-items: center; gap: .6rem; min-height: 32px; padding: 0 1rem; border-radius: 999px;margin-top:1em;
    background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.18); color: #fff; text-decoration: none; font-size: .95rem; font-weight: 500;
}
.thdef_text_button,.bm_toggle_btn { border: 0; background: none; color: inherit; cursor: pointer; font: inherit; font-size: .85rem; text-decoration: underline; padding: .1rem 0; }
.thdef_input,.jmb_input { padding: .55rem .9rem; border-radius: 999px; border: 1px solid var(--st-border); font-size: .95rem; outline: none; min-width: 0; }
.thdef_card,.bm_card,.q_card,.mlb_item { border-radius: 12px; box-sizing: border-box; }
.thdef_empty,.mcsl_empty,.pgc_empty,.ef_no_events { text-align: center; opacity: .7; }

/* Navigation */
#nav.st-nav { top: 0; left: 0; width: 100%; z-index: 100; background: var(--st-nav-bg); padding: .75rem 1rem; }
.st-nav-inner { position: relative; z-index: 50; display: flex; align-items: center; justify-content: space-between; width: 100%; }
.site_logo { display: inline-flex; align-items: center; min-height: 42px; max-width: 52%; color: var(--st-on-nav); text-decoration: none; font-family: var(--st-font-nav); font-weight: 700; }
.site_logo_img { display: block; max-height: 38px; max-width: 180px; object-fit: contain; }
.site_logo_text { overflow: hidden; font-size: 1.25rem; line-height: 1.1; white-space: nowrap; text-overflow: ellipsis; }
.st-nav-actions { display: inline-flex; align-items: center; justify-content: flex-end; gap: .65rem; margin-left: auto; }
.st-nav-join { display: inline-flex; align-items: center; justify-content: center; min-height: 34px; padding: .5rem .95rem; border-radius: 999px; background: var(--st-on-nav-act); color: var(--st-nav-bg); text-decoration: none; font-size: .82rem; font-weight: 700; line-height: 1; }
.st-nav-toggle { display: inline-flex; flex-direction: column; justify-content: center; align-items: center; width: 40px; height: 36px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.st-nav-toggle-bar { display: block; width: 24px; height: 3px; margin: 3px 0; border-radius: 999px; background: var(--st-on-nav); transition: transform .25s ease, opacity .25s ease; }
#nav.st-nav.st-nav-open .st-nav-toggle-bar:nth-child(1) { transform: translateY(9px) rotate(45deg); }
#nav.st-nav.st-nav-open .st-nav-toggle-bar:nth-child(2) { opacity: 0; }
#nav.st-nav.st-nav-open .st-nav-toggle-bar:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }
.st-nav-menu { position: absolute; top: 100%; left: 1rem; right: 1rem; z-index: 2; list-style: none; margin: .5rem 0 0; padding: .55rem; max-height: 0; overflow: hidden; border-radius: 1rem; background: rgba(0,0,0,.82); backdrop-filter: blur(10px); opacity: 0; transform: translateY(-8px); pointer-events: none; transition: max-height .25s ease, opacity .2s ease, transform .2s ease; }
#nav.st-nav.st-nav-open .st-nav-menu { max-height: 520px; opacity: 1; transform: translateY(0); pointer-events: auto; }
.st-nav-item { border: none; }
.st-nav-link { display: block; padding: .85rem 1rem; border-radius: .75rem; color: #fff; text-decoration: none; font-size: .95rem; line-height: 1.2; }
.st-nav-link:hover { background: rgba(255,255,255,.08); }
.st-nav-item.current .st-nav-link { background: rgba(255,255,255,.12); color: var(--st-on-nav-act); font-weight: 700; }
@media (min-width: 768px) {
    #nav.st-nav { padding: 1.35rem 2rem; }
    .st-nav-inner { min-height: 46px; justify-content: center; }
    .site_logo { position: absolute; left: 0; top: 50%; max-width: 240px; transform: translateY(-50%); }
    .st-nav-actions { position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
    .st-nav-toggle { display: none; }
    .st-nav-menu { position: static; display: block; max-height: none; overflow: visible; margin: 0 auto; padding: 0; background: transparent; backdrop-filter: none; border-radius: 0; opacity: 1; transform: none; pointer-events: auto; text-align: center; line-height: 0; }
    .st-nav-item { display: inline-block; margin: 0 .35rem; padding: .75rem .85rem; border: 1px solid transparent; border-radius: .65rem; transition: border-color .25s ease, background .25s ease; }
    .st-nav-item:hover,.st-nav-item.current { border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.04); }
    .st-nav-link { padding: 0; color: var(--st-on-nav); }
    .st-nav-link:hover,.st-nav-item.current .st-nav-link { background: transparent; }
    .st-nav-item.current .st-nav-link { color: var(--st-on-nav-act); }
}

/* Footer and modals */
.st-footer { background: #000; color: #fff; text-align: center; padding: 12px; }
.st_socials_list { list-style: none; margin: 0; padding: 1em; display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.st_social_item { display: inline-block; }
.st_social_link { display: inline-flex; align-items: center; justify-content: center; font-size: 1.1rem; text-decoration: none; color: #fff; }
.st-footer-text { font-size: 12px; padding-bottom: 2em; margin: 0; }
.st-footer-link { color: #fff; text-decoration: none; background: none; border: 0; padding: 0; cursor: pointer; font: inherit; }
.st-footer-link:hover { text-decoration: underline; }

.st-modal-overlay,.thdef_lightbox { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; padding: 20px; background: rgba(0,0,0,.78); }
.st-modal-overlay.st-is-open,.thdef_lightbox.thdef_is_open,.pgc_lightbox.pgc_lightbox_open { display: flex; }
.st-modal { position: relative; width: 100%; max-width: 720px; max-height: 82vh; overflow: hidden; background: #050505; color: #fff; border: 1px solid rgba(255,255,255,.16); border-radius: 18px; box-shadow: 0 24px 80px rgba(0,0,0,.65); }
.st-modal-close { position: absolute; top: 12px; right: 14px; width: 36px; height: 36px; border: 0; border-radius: 999px; background: rgba(255,255,255,.08); color: #fff; font-size: 26px; line-height: 1; cursor: pointer; }
.st-modal-title { margin: 0; padding: 24px 64px 16px 24px; font-size: 22px; font-weight: 800; }
.st-modal-content { max-height: calc(82vh - 82px); overflow-y: auto; padding: 0 24px 26px; font-size: 14px; line-height: 1.7; color: rgba(255,255,255,.86); }

/* Generic carousel */
.thdef_carousel,.mcsl_wrapper,.pgc_wrapper { position: relative; overflow: hidden; }
.thdef_carousel_track,.mcsl_track,.pgc_track { display: flex; gap: 1rem; overflow-x: auto; scroll-behavior: smooth; padding: .75rem 0; -ms-overflow-style: none; scrollbar-width: none; }
.thdef_carousel_track::-webkit-scrollbar,.mcsl_track::-webkit-scrollbar,.pgc_track::-webkit-scrollbar { display: none; }
.thdef_carousel_arrow,.mcsl_arrow,.pgc_arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; border: 0; color: #fff; width: 35px; height: 35px; border-radius: 999px; cursor: pointer; font-size: 1.1rem; line-height: 35px; text-align: center; background: rgba(0,0,0,.72); display: none; }
.thdef_carousel_prev,.mcsl_arrow_left,.pgc_arrow_left { left: 0; }
.thdef_carousel_next,.mcsl_arrow_right,.pgc_arrow_right { right: 0; }
@media (min-width: 768px) { .thdef_carousel_arrow,.mcsl_arrow,.pgc_arrow { display: block; } }

/* Header blocks */
.phfc_section,.phixl_section,.phisl_section { width: 100%; }
.phfc_header,.phixl_header,.phisl_header { width: 100%; background-size: cover; background-position: center; background-repeat: no-repeat; background-attachment: fixed; display: flex; align-items: center; justify-content: center; position: relative; margin: 0; padding: 0; overflow: hidden; text-align: center; }
.phfc_header { min-height: var(--phfc-min-height, 90vh); }
.phixl_header { min-height: 90vh; }
.phisl_header { min-height: 60vh; }
.phfc_overlay,.phfs_overlay { position: absolute; inset: 0; background: rgba(0,0,0,.35); z-index: 1; }
.phisl_header::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.35); pointer-events: none; }
.phfc_inner,.phixl_inner,.phisl_inner { position: relative; z-index: 2; width: 100%; padding: 2rem; }
.phfc_header_content { color: var(--phfc-text-color,#fff); }
.phfc_content--left { text-align: left; } .phfc_content--center { text-align: center; } .phfc_content--right { text-align: right; }
.phfc_text_box { display: inline-block; max-width: 860px; padding: 1rem 2rem; border-radius: 20px; background: var(--phfc-text-bg-color, transparent); }
.phfc_heading { margin: 0; color: var(--phfc-text-color,#fff); font-weight: 800; line-height: 1.05; letter-spacing: -.04em; }
.phfc_heading--sm { font-size: clamp(2rem,4vw,3rem); } .phfc_heading--md { font-size: clamp(2.75rem,6vw,4.5rem); } .phfc_heading--lg { font-size: clamp(3.5rem,8vw,6rem); } .phfc_heading--xl { font-size: clamp(4rem,10vw,8rem); }
.phfc_sub_heading { margin: 1rem 0 0; color: var(--phfc-text-color,#fff); font-weight: 400; line-height: 1.35; }
.phfc_sub_heading--sm { font-size: clamp(1rem,2vw,1.25rem); } .phfc_sub_heading--md { font-size: clamp(1.2rem,2.5vw,1.65rem); } .phfc_sub_heading--lg { font-size: clamp(1.45rem,3vw,2.1rem); }
.phfc_button { margin-top: 1.5rem; background: var(--phfc-button-color,#fff); color: var(--phfc-button-text-color,#000); }
.phfc_button--sm { padding: .7rem 1.1rem; font-size: .9rem; } .phfc_button--md { padding: .9rem 1.4rem; font-size: 1rem; } .phfc_button--lg { padding: 1.05rem 1.8rem; font-size: 1.1rem; }
.phixl_logo_img,.phisl_logo_img { max-width: 45vh; height: auto; }
.phixl_logo_text { font-size: 3rem; font-weight: 700; letter-spacing: 1px; color: #fff; }
.phisl_logo_text { font-size: 1.8rem; font-weight: 700; color: #fff; }
.phixl_heading,.phisl_heading { color: #fff; font-weight: 400; }
@media (max-width: 768px) { .phfc_header,.phixl_header,.phisl_header { background-attachment: scroll; } .phfc_inner,.phixl_inner,.phisl_inner { padding: 1.25rem; } .phfc_text_box { width: 100%; padding: 1.25rem; } .phfc_content--left,.phfc_content--right { text-align: center; } .phixl_logo_img,.phisl_logo_img { max-width: 80%; } .phisl_header { min-height: 28vh; } }

/* Simple section blocks */
.bnrs_banner,.sli_banner { width: 100%; padding: 5rem 1.5rem; background: var(--st-surface); position: relative; text-align: center; }
.sli_socials_list { list-style: none; margin: 0; padding: 1em; display: flex; gap: 2rem; justify-content: center; flex-wrap: wrap; }
.sli_social_link { display: inline-flex; align-items: center; justify-content: center; font-size: 2.2rem; text-decoration: none; color: var(--st-on-surface-hdr); }
.cbc_section,.ef_section,.bm_section,.q_section,.mlb_section,.sd_info_section,.sd_stream_section,.sd_lyrics_section,.ad_tracklist_section { padding: 3rem 1.5rem; }
.cbc_wrapper,.q_wrapper,.mlb_wrapper,.sd_info_wrapper { max-width: 1100px; margin: 0 auto; }
.ef_wrapper,.sd_lyrics_wrapper { max-width: 800px; margin: 0 auto; }
.sd_stream_inner,.ad_inner { max-width: 600px; margin: 0 auto; }
.cbc_hero { margin-bottom: 2rem; }
.cbc_hero_image,.cbc_image { width: 100%; height: auto; display: block; border-radius: 10px; object-fit: cover; }
.cbc_layout { display: flex; gap: 2rem; align-items: flex-start; margin-top: 2rem; }
.cbc_layout--reverse { flex-direction: row-reverse; }
.cbc_col { flex: 1 1 50%; min-width: 0; }
.cbc_body,.sd_info_body { font-size: 1rem; line-height: 1.7; color: var(--st-on-bg); }
.cbc_body_single { margin-top: 1rem; }
.cbc_footer { margin-top: 2.25rem; text-align: center; }
@media (max-width: 768px) { .bnrs_banner,.sli_banner { padding: 3.5rem 1.25rem; } .cbc_section,.ef_section,.bm_section,.q_section,.mlb_section,.sd_info_section,.sd_stream_section,.sd_lyrics_section,.ad_tracklist_section { padding: 2.5rem 1.25rem; } .cbc_layout,.cbc_layout--reverse { flex-direction: column; gap: 1.5rem; } .thdef_heading,.cbc_heading,.ef_heading,.bm_heading,.q_heading { font-size: 1.7rem; } .sli_social_link { font-size: 1.5rem; } .sli_socials_list { gap: 1rem; } }

/* Music carousel and photo carousel */
.mcsl_section { width: 100%; padding: 2rem 0; background: var(--st-surface-alt); }
.mcsl_track { gap: 1.5rem; padding: 1rem 0; }
.mcsl_item { min-width: 200px; flex: 0 0 auto; text-align: center; }
.mcsl_image_wrap { display: block; width: 100%; max-width: 200px; aspect-ratio: 1/1; overflow: hidden; border-radius: 8px; background: #222; }
.mcsl_image,.mlb_thumb,.phfs_art { width: 100%; height: 100%; object-fit: cover; display: block; }
.mcsl_item_header { margin-top: .75rem; }
.mcsl_item_header a { text-decoration: none; color: var(--st-on-surface-alt); }
.mcsl_title { font-size: 1rem; margin: 0; }
.pgc_section { padding: 2rem 0; }
.pgc_item { flex: 0 0 auto; }
.pgc_thumb_link { display: inline-block; }
.pgc_thumb { display: block; height: 360px; width: auto; border-radius: 6px; object-fit: cover; background: #111; }
.pgc_lightbox { position: fixed; inset: 0; background: rgba(0,0,0,.85); display: none; align-items: center; justify-content: center; z-index: 9999; }
.pgc_lightbox_inner { position: relative; max-width: 90vw; max-height: 90vh; }
.pgc_lightbox_image { max-width: 90vw; max-height: 90vh; width: auto; height: auto; display: block; border-radius: 6px; object-fit: contain; box-shadow: 0 10px 30px rgba(0,0,0,.7); }
.pgc_lightbox_close { position: absolute; top: -12px; right: -12px; width: 32px; height: 32px; border-radius: 50%; border: 0; background: rgba(0,0,0,.75); color: #fff; font-size: 1.3rem; cursor: pointer; }

/* Cards, grids and lists */
.mlb_grid,.bm_grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.5rem; }
.mlb_item { background: rgba(255,255,255,.03); padding: .9rem .9rem 1.1rem; display: flex; flex-direction: column; }
.mlb_thumb_wrap { position: relative; width: 100%; aspect-ratio: 1/1; border-radius: 8px; overflow: hidden; background: #222; margin-bottom: .6rem; }
.mlb_thumb_link { display: block; width: 100%; height: 100%; }
.mlb_thumb_placeholder { width: 100%; height: 100%; background: #444; display: flex; align-items: center; justify-content: center; }
.mlb_overlay_play { position: absolute; inset: 0; margin: auto; width: 52px; height: 52px; border-radius: 999px; border: 0; background: rgba(0,0,0,.55); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.mlb_overlay_play.mlb_playing { background: #fff; color: #000; }
.mlb_overlay_label { position: absolute; bottom: 8px; left: 8px; padding: .2rem .6rem; border-radius: 999px; background: rgba(0,0,0,.65); color: #fff; font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; }
.mlb_title { margin: 0 0 .3rem; font-size: 1rem; font-weight: 600; text-align: center; }
.mlb_title_link { color: inherit; text-decoration: none; }
.mlb_meta { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; font-size: .8rem; opacity: .9; }
.bm_card { background: var(--st-surface-alt); color: var(--st-on-surface-alt); padding: 1.25rem 1.25rem 1.5rem; text-align: center; }
.bm_photo_wrap { width: 120px; height: 120px; margin: 0 auto .75rem; border-radius: 50%; overflow: hidden; background: #222; }
.bm_photo { width: 100%; height: 100%; object-fit: cover; display: block; }
.bm_member_name { margin: 0; font-size: 1.2rem; font-weight: 600; color: var(--st-on-surface-alt-hdr); }
.bm_member_role { margin: .25rem 0 0; font-size: .9rem; opacity: .85; }
.bm_description { margin: .5rem 0 0; font-size: .9rem; line-height: 1.5; text-align: left; }

/* Events */
.ef_events_list { margin: 0; padding: 0; }
.ef_event_link { display: block; text-decoration: none; color: inherit; }
.ef_event_row { display: flex; align-items: flex-start; gap: 1.25rem; padding: .75rem 0; border-bottom: 1px solid var(--st-border); }
.ef_event_date { min-width: 70px; text-align: center; padding: .5rem .75rem; border-radius: .35rem; background: var(--st-primary); color: var(--st-on-primary); }
.ef_event_day { font-size: 1.4rem; font-weight: 700; line-height: 1; }
.ef_event_month { font-size: .85rem; text-transform: uppercase; line-height: 1.2; }
.ef_event_year { font-size: .7rem; opacity: .8; line-height: 1.2; }
.ef_event_info { flex: 1; }
.ef_event_mainline { display: flex; justify-content: space-between; gap: .75rem; align-items: flex-start; }
.ef_event_location { margin: 0; font-size: 1.1rem; color: var(--st-on-bg-hdr); }
.ef_event_time { font-size: .85rem; opacity: .85; white-space: nowrap; color: var(--st-on-bg-hdr); }
.ef_event_venue_price { margin-top: .25rem; font-size: .9rem; opacity: .9; }
.ef_event_venue { font-weight: 600; }
.ef_event_more { margin-top: .15rem; font-size: .8rem; text-decoration: underline; opacity: .9; }
@media (max-width: 768px) { .ef_event_mainline { flex-direction: column; } .ef_event_time { white-space: normal; } }

/* Quotes */
.q_slider { margin-top: 1.5rem; }
.q_card { display: none; text-align: left; position: relative; padding: 1.5rem 1.5rem 1.25rem; background: var(--st-secondary); }
.q_card.q_card--active,.thdef_slide_active { display: block; animation: q_fade_in .35s ease-out; }
.q_mark_inline { font-size: 6rem; line-height: 0; vertical-align: bottom; opacity: .5; font-family: Georgia, serif; }
.q_text { margin: 0; font-size: 1rem; line-height: 1.65; color: var(--st-on-secondary); }
.q_source { display: block; text-align: right; margin-top: .5rem; font-size: .9rem; color: var(--st-on-secondary); }
.q_source a { color: var(--st-on-secondary); text-decoration: none; }
.q_dots { margin-top: 1rem; text-align: center; }
.q_dot { width: 8px; height: 8px; border-radius: 999px; margin: 0 4px; border: 0; padding: 0; background: var(--st-on-bg); cursor: pointer; }
.q_dot.q_dot--active,.thdef_dot_active { width: 18px; background: var(--st-on-bg-hdr); }
@keyframes q_fade_in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

/* Mailing */
.jmb_section { width: 100%; padding: 3rem 1.5rem; background: var(--st-surface); }
.jmb_wrapper { max-width: 1100px; margin: 0 auto; text-align: center; padding: 2.25rem 2rem; }
.jmb_extra_email { position: absolute; left: -9999px; opacity: 0; pointer-events: none; }
.jmb_form { margin-top: 1.25rem; }
.jmb_form_row { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; }
.jmb_input_email,.jmb_input_email_confirm { flex: 1 1 220px; max-width: 280px; }
.jmb_input_error { border-color: #ff6b6b; }
.jmb_message { margin-top: .75rem; font-size: .9rem; }
.jmb_message--error { color: #ffb0b0; }
.jmb_message--success { color: #b4ffb4; }
.join_modal { position: fixed; inset: 0; z-index: 9999; display: none; }
.join_modal.is-open,.join_modal.thdef_is_open { display: block; }
.join_modal_overlay { position: absolute; inset: 0; background: rgba(0,0,0,.72); }
.join_modal_panel { position: relative; z-index: 2; width: min(92vw, 620px); margin: 40px auto; border-radius: 24px; overflow-y: auto; max-height: calc(100vh - 40px); box-shadow: 0 25px 80px rgba(0,0,0,.35); }
.join_modal_close { position: absolute; top: 20px; right: 20px; border: 0; background: transparent; font-size: 34px; cursor: pointer; z-index: 5; color: var(--st-on-surface-hdr); }
@media (max-width: 768px) { .jmb_wrapper { padding: 1.9rem 1.35rem; } .jmb_form_row { flex-direction: column; align-items: stretch; gap: .6rem; } .jmb_input_email,.jmb_input_email_confirm { max-width: 100%; flex: 1 1 auto; } .jmb_button { width: 100%; } }

/* YouTube */
.ytb_section { position: relative; width: 100%; padding: clamp(1.5rem,4vw,3rem) 1rem 3rem; overflow: hidden; background: #000; }
.ytb_section::before { content: ""; position: absolute; inset: 0; background-image: var(--ytb-bg-image); background-size: cover; background-position: center; filter: blur(40px); z-index: 0; }
.ytb_wrapper { position: relative; z-index: 2; max-width: 920px; margin: 0 auto; }
.ytb_facade,.sd_ytb_facade { position: relative; width: 100%; cursor: pointer; background: #000; overflow: hidden; }
.ytb_facade { padding-bottom: 56.25%; height: 0; border-radius: 22px; box-shadow: 0 28px 90px rgba(0,0,0,.65); border: 1px solid rgba(255,255,255,.18); }
.ytb_thumbnail { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease, opacity .35s ease; }
.ytb_play_button,.sd_ytb_play_button { position: absolute; inset: 0; display: flex; justify-content: center; align-items: center; pointer-events: none; }
.ytb_play_inner,.sd_ytb_play_inner { width: 82px; height: 82px; display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,.92); border-radius: 999px; box-shadow: 0 18px 45px rgba(0,0,0,.45); }
.ytb_play_icon { width: 44px; height: 44px; color: #000; margin-left: 4px; }
.ytb_iframe,.thdef_youtube_iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.sd_ytb_facade iframe { width: 100%; aspect-ratio: 16 / 9; display: block; border: 0; }

/* Featured song */
.phfs_section { position: relative; min-height: 70vh; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.phfs_bg { position: absolute; inset: -24px; background-size: cover; background-position: center; filter: blur(18px); z-index: 1; }
.phfs_overlay { background: rgba(0,0,0,.48); z-index: 2; }
.phfs_inner { position: relative; z-index: 3; width: 100%; max-width: 1050px; padding: 2rem; }
.phfs_card { display: grid; grid-template-columns: minmax(220px,340px) 1fr; gap: 1rem; align-items: center; border-radius: 24px; background: rgba(0,0,0,.6); box-shadow: 0 30px 90px rgba(0,0,0,.35); backdrop-filter: blur(16px); }
.phfs_art_wrap { position: relative; width: 100%; aspect-ratio: 1/1; border-radius: 24px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,.45); background: rgba(255,255,255,.08); }
.phfs_play_button,.sd_square_play { position: absolute; inset: 50% auto auto 50%; transform: translate(-50%,-50%); width: 74px; height: 74px; border-radius: 999px; border: 0; background: rgba(255,255,255,.92); color: #111; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; font-size: 1.35rem; box-shadow: 0 14px 34px rgba(0,0,0,.35); }
.phfs_pause_icon,.phfs_play_button.is-playing .phfs_play_icon { display: none; }
.phfs_play_button.is-playing .phfs_pause_icon { display: inline-block; }
.phfs_audio { display: none; }
.phfs_content { color: #fff; min-width: 0; }
.phfs_title { margin: 0; font-size: clamp(2.4rem,6vw,3.6rem); font-weight: 800; line-height: .98; letter-spacing: -.055em; }
.phfs_wave_wrap,.sd_square_wave_wrap { position: relative; width: 100%; overflow: hidden; border-radius: 12px; background: rgba(255,255,255,.12); }
.phfs_wave_wrap { max-width: 620px; height: 58px; margin-top: 1.4rem; }
.phfs_wave,.sd_square_wave { width: 100%; height: 100%; object-fit: cover; display: block; opacity: .55; }
.phfs_progress,.sd_square_progress { position: absolute; inset: 0 auto 0 0; width: 0%; pointer-events: none; transition: width .08s linear; }
.phfs_progress { background: rgba(255,255,255,.28); }
.phfs_actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-top: 1.5rem; }
.phfs_stream_icon img,.phfs_icon_button { width: 42px; height: 42px; }
.phfs_icon_button { border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; background: rgba(255,255,255,.20); color: #fff; }
@media (max-width: 800px) { .phfs_section { min-height: auto; padding: 4rem 0; } .phfs_inner { padding: 1.25rem; } .phfs_card { grid-template-columns: 1fr; gap: 1.5rem; padding: 1.25rem; } .phfs_art_wrap { max-width: 540px; margin: 0 auto; } .phfs_content { text-align: center; } .phfs_actions { justify-content: center; } .phfs_wave_wrap { margin-left: auto; margin-right: auto; } .phfs_stream_icon img,.phfs_icon_button { width: 32px; height: 32px; } }

/* Song and album detail */
.sd_section,.ad_section { position: relative; width: 100%; min-height: 90vh; background-size: cover; background-position: center; background-repeat: no-repeat; background-attachment: fixed; display: flex; align-items: center; justify-content: center; text-align: center; margin: 0; padding: 0; color: #fff; }
.sd_inner,.ad_inner { width: 100%; padding: 2rem; z-index: 2; }
.sd_player_square,.ad_square { display: flex; flex-direction: column; align-items: center; gap: 1.25rem; background: rgba(0,0,0,.70); backdrop-filter: blur(10px); padding: 2rem; border-radius: 20px; max-width: 480px; margin: 0 auto; }
.sd_square_title,.ad_square_title { font-size: 1.9rem; font-weight: 700; margin: 0; }
.sd_square_art,.ad_square_art { width: 240px; height: 240px; border-radius: 12px; object-fit: cover; box-shadow: 0 15px 30px rgba(0,0,0,.45); }
.sd_square_art_wrap { position: relative; display: inline-block; }
.sd_square_play { background: linear-gradient(135deg,#5bffb2,#27a673); color: #0a0a0a; font-size: 1.9rem; }
.sd_square_wave_wrap { max-width: 240px; height: 55px; margin: 0 auto; background: rgba(255,255,255,.05); }
.sd_square_progress { background: linear-gradient(90deg,#5bffb2,#4fcbff); mix-blend-mode: screen; }
.sd_preview_cta { display: none; margin: 2rem auto 0; padding: 1rem 1.25rem; max-width: 480px; background: linear-gradient(135deg,#3b82f6,#2563eb); color: #fff; border-radius: 14px; font-size: 1.05rem; font-weight: 600; line-height: 1.5; opacity: 0; transform: translateY(10px) scale(.96); transition: opacity .35s ease, transform .35s ease; }
.sd_preview_cta--visible { display: block; opacity: 1; transform: translateY(0) scale(1); overflow: hidden; position: relative; }
.sd_stream_list { display: flex; flex-direction: column; gap: 1rem; align-items: center; margin-top: 2em; }
.sd_stream_btn { width: 100%; max-width: 420px; background: #fff; border-radius: 14px; padding: .9rem 1rem; text-decoration: none; color: #222; font-weight: 600; display: flex; justify-content: center; align-items: center; box-shadow: 0 4px 10px rgba(0,0,0,.08); border: 1px solid rgba(0,0,0,.10); transition: transform .15s ease, box-shadow .15s ease; }
.sd_stream_btn:hover { transform: translateY(-3px); box-shadow: 0 10px 20px rgba(0,0,0,.12); }
.sd_stream_btn_inner { display: flex; align-items: center; justify-content: center; gap: .75rem; }
.sd_stream_icon { width: 28px; height: 28px; object-fit: contain; }
.sd_stream_label { font-size: 1.1rem; font-weight: 700; color: #111; }
.sd_info_section { background: var(--st-surface-alt); color: var(--st-on-surface-alt); }
.sd_info_cols { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2rem; align-items: start; }
.sd_info_cols--single { grid-template-columns: 1fr; }
.sd_vibes_wrap { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.5rem; }
.sd_vibe_pill { padding: .2rem .7rem; font-size: .7rem; border-radius: 999px; border: 1px solid var(--st-border); }
.sd_video_box { width: 100%; border-radius: 10px; overflow: hidden; background: #000; box-shadow: 0 10px 20px rgba(0,0,0,.5); }
.sd_lyrics_body { font-size: 1.05rem; line-height: 1.75; text-align: center; opacity: .95; padding: 1rem 0; }
.ad_album_pill { margin-top: .5rem; background: rgba(0,0,0,.75); padding: .3rem 1rem; border-radius: 999px; border: 1px solid rgba(255,255,255,.3); }
.ad_album_pill_label { font-size: .78rem; text-transform: uppercase; letter-spacing: .16em; }
.ad_tracklist_wrapper { max-width: 700px; margin: 0 auto; }
.ad_tracklist_list { display: flex; flex-direction: column; gap: .85rem; }
.ad_track_row { display: flex; align-items: center; gap: 1rem; background: var(--st-secondary); padding: .9rem 1.1rem; border-radius: 12px; box-shadow: 0 3px 10px rgba(0,0,0,.08); }
.ad_track_thumb { width: 56px; height: 56px; border-radius: 8px; object-fit: cover; flex-shrink: 0; }
.ad_track_info { flex: 1 1 auto; }
.ad_track_title { font-size: 1rem; font-weight: 600; color: var(--st-on-secondary); }
.ad_track_play { width: 42px; height: 42px; border-radius: 50%; border: 0; background: #3a3a3e; color: #fff; font-size: 1.1rem; font-weight: bold; cursor: pointer; display: flex; align-items: center; justify-content: center; }
@media (max-width: 780px) { .sd_info_cols { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .sd_section,.ad_section { background-attachment: scroll; } .sd_square_art,.ad_square_art { width: 180px; height: 180px; } .sd_square_wave_wrap { max-width: 180px; height: 45px; } .sd_player_square,.ad_square { padding: 1.5rem; } .sd_square_title,.ad_square_title { font-size: 1.6rem; } }
