/* Public pages share an editorial rhythm, while retaining their existing contracts. */
.musicPage, .tvPage, .wrap, .v12-content-page main, .app-page, .dash-page, .space-page { padding-top: 34px; padding-bottom: 30px; }
.musicHero, .v12-tv-hero, .v12-content-hero, .wrap > .hero, .app-page > .hero, .dash-page > .hero, .space-page > .hero { margin-top: 0; padding: 34px 40px; border-radius: 8px; background: radial-gradient(ellipse at 95% 20%,#d7a64d35,transparent 65%),linear-gradient(110deg,#214359,#223c46); }
.musicHero h1, .v12-content-hero h1 { margin-bottom: 16px; }
.wrap > .hero { display: grid; grid-template-columns: 180px 1fr; align-items: center; gap: 35px; }
.wrap > .hero > .hero-logo { width: 180px; height: 180px; object-fit: contain; }
.wrap > .hero p { max-width: 700px; }
.wrap > .section.panel { padding-block: 24px; }
.v85-music-catalog .cards { grid-template-columns: repeat(3,minmax(0,1fr)); }
#tracks .card { display: flex; flex-direction: column; }
#tracks .card img { height: 285px; object-fit: contain; background: #ffffff06; }
#tracks .card h3 { font-size: 22px; }
#tracks .platforms { margin-top: auto; }
.v12-legacy-anchor { margin-top: 48px; }
.emptyState { padding: 28px; border: 1px solid var(--v14-line); }
/* Cinema Room: centered projection, then metadata, actions, library and comments. */
.v12-tv-hero { display: flex; justify-content: space-between; align-items: center; min-height: 0; margin-bottom: 28px; }
.v12-tv-hero h1 { font-size: 44px; margin: 8px 0; }
.v12-tv-hero__label { color: var(--v14-cyan); font-size: 10px; font-weight: 700; letter-spacing: .13em; }
.v12-tv-hero__subtitle { font-size: 12px; letter-spacing: .08em; }
.v12-tv-hero__description { margin: 0; font-size: 13px; color: var(--v14-muted); }
.v85-tv-badges { display: flex; flex-wrap: wrap; gap: 10px; }
.v12-tv-player { position: relative; isolation: isolate; margin: 0; padding: 24px; background: #102732e0; border-radius: 8px; }
.v12-tv-player::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--v14-tv-backdrop) center/cover; opacity: .16; filter: blur(38px); }
.v13-tv-player__head { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.v13-tv-player__head h2 { font-size: 24px; margin: 4px 0; }
.v13-tv-player__head p:not(.sup) { font-size: 12px; color: var(--v14-muted); margin-bottom: 0; }
.v13-tv-player__layout { width: min(100%,1040px); margin-inline: auto; }
.v13-tv-stage { position: relative; aspect-ratio: 16/9; width: 100%; display: grid; place-items: center; background: #03090b; border: 1px solid #e7b86055; border-radius: 4px; }
.v13-tv-stage::before { content: ''; position: absolute; inset: 0; background: var(--v14-tv-backdrop) center / cover; filter: blur(24px); opacity: .26; }
.v13-tv-stage video, .v13-tv-stage iframe { display: block; width: 100%; height: 100%; border: 0; position: absolute; inset: 0; object-fit: contain; }
.v13-tv-youtube-start { position: absolute; inset: 0; display: grid; place-items: center; width: 100%; padding: 0; border: 0; background: transparent; color: var(--v14-warm-white); }
.v13-tv-youtube-start img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: contain; }
.v13-tv-youtube-start span { display: grid; place-items: center; position: relative; width: 70px; height: 70px; border: 1px solid #ffdda0; border-radius: 50%; background: #051923c9; color: var(--v14-gold-light); font-size: 24px; }
.v13-tv-youtube-start strong { position: absolute; bottom: 22px; padding: 8px 16px; background: #051923c9; font-size: 11px; }
.v12-tv-player__content { padding: 24px 0; display: grid; grid-template-columns: 1fr auto; gap: 8px 30px; }
.v12-tv-player__content > .sup { margin: 0; grid-column: 1; }
.v12-tv-player__content h2 { font-size: 30px; margin: 4px 0; }
#v12TvPlayerDescription { color: var(--v14-muted); font-size: 12px; max-width: 660px; grid-column: 1; margin-bottom: 0; }
.v12-tv-engagement { grid-column: 2; grid-row: 1/4; display: flex; align-items: center; gap: 12px; font-size: 11px; }
.v12-tv-like { white-space: nowrap; }
.v12-tv-like[aria-pressed=true] { color: #f4abc1; }
.v12-tv-player__actions { grid-column: 1/-1; display: flex; flex-wrap: wrap; gap: 12px; padding-top: 14px; }
.v98-share-feedback { font-size: 11px; color: var(--v14-cyan); margin: 0; }
.v13-tv-library-status { margin: 12px 0; font-size: 11px; color: var(--v14-muted); }
.v13-tv-library { display: flex; overflow-x: auto; gap: 16px; padding-bottom: 14px; scroll-snap-type: x proximity; }
.v13-tv-library button { flex: 0 0 220px; display: grid; grid-template-rows: 140px auto; padding: 0; text-align: left; border: 1px solid #ffffff19; background: #183a47; color: #f4eddd; border-radius: 4px; scroll-snap-align: start; }
.v13-tv-library img { height: 140px; width: 100%; object-fit: contain; background: #0d202a; }
.v12-tv-playlist__copy { padding: 12px; display: grid; gap: 4px; }
.v12-tv-playlist__copy strong { font-size: 13px; }
.v12-tv-playlist__copy span { font-size: 10px; color: var(--v14-muted); }
.v13-tv-library [aria-current=true], .v13-tv-library [aria-pressed=true] { border-color: var(--v14-cyan); }
.v12-tv-legacy { display: none; }
.v12-tv-comments { padding: 32px; border-top: 1px solid #62c9ca55; background: #ffffff04; border-radius: 5px; }
.v12-tv-comments h2 { font-size: 28px; }
.v12-tv-comments__status { font-size: 12px; }
.v12-tv-comments__form { display: grid; grid-template-columns: 1fr 2fr; gap: 18px; }
.v12-tv-comments__form label { display: grid; gap: 8px; font-size: 12px; }
.v12-tv-comments__form textarea { min-height: 108px; }
.v12-tv-comments__form button { width: max-content; }
.v12-tv-comment { padding: 16px; border-bottom: 1px solid var(--v14-line); }
.tvSplit { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
/* Artist heroes are editorial stages, with a floating portrait and an overlaid biography. */
.artist-page { padding-top: 18px; --artist-accent: #d8a357; }
.artist-page .hero { position: relative; isolation: isolate; min-height: 580px; padding: 36px; display: grid; grid-template-columns: 48% 52%; align-items: center; border-radius: 10px; background: #23404c; margin-bottom: 24px; }
.artist-page .hero::before { content: ''; position: absolute; inset: 0; z-index: -2; background: var(--artist-portrait) center / cover; filter: blur(28px); opacity: .32; border-radius: inherit; }
.artist-page .hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,#09273618,#122f3cbc); border-radius: inherit; }
.v14-artist-portrait { width: 100%; background: transparent; padding: 0; }
.artist-page .hero-img { width: 100%; height: 500px; max-height: none; object-fit: contain; box-shadow: none; }
.artist-page .hero-content { align-self: end; padding: 28px; margin-left: -42px; margin-bottom: 14px; border-left: 2px solid var(--artist-accent); background: #123242e8; backdrop-filter: blur(8px); border-radius: 3px; position: relative; z-index: 2; }
.artist-page h1 { font-size: clamp(35px,3.5vw,53px); margin: 12px 0; }
.artist-page .role { color: var(--artist-accent); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.artist-page .bio { font-size: 12px; line-height: 1.8; }
.tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.tags span { font-size: 9px; padding: 4px 8px; background: #ffffff09; }
.v14-artist-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-bottom: 30px; border-bottom: 1px solid var(--v14-line-cyan); padding-bottom: 16px; }
.v14-artist-nav a { min-height: 42px; padding: 10px 20px; text-transform: uppercase; font-size: 11px; font-weight: 800; text-decoration: none; }
.v14-artist-nav a:hover { color: var(--artist-accent); }
.artist-page > .section { padding-block: 28px; border-top: 1px solid var(--v14-line); }
.artist-page > .section h2 { font-size: 31px; }
.release-card-artist, .makeda-release-card, .makeda-clip-card { display: grid; grid-template-columns: 260px 1fr; gap: 28px; align-items: center; margin-block: 24px; padding: 22px; background: #ffffff05; border-radius: 5px; }
.release-card-artist img, .makeda-release-card img, .makeda-clip-card img { width: 100%; max-height: 340px; object-fit: contain; }
.release-card-artist h3, .makeda-release-card h3, .makeda-clip-card h3 { font-size: 25px; }
.release-card-artist p, .makeda-release-card p, .makeda-clip-card p { font-size: 13px; color: var(--v14-muted); }
.makeda-release-grid { display: grid; gap: 18px; }
.makeda-countdown { font-size: 13px; color: var(--v14-gold); }
.v95-static-release { display: none; }
body[data-artist-key=sparetdee] { --artist-portrait: url('../artists/sparetdee-simon.webp'); }
body[data-artist-key=makeda] { --artist-portrait: url('../makeda-muse/makeda-muse-profile.png'); }
body[data-artist-key=jup] { --artist-portrait: url('../artists/juste-une-plume.webp'); }
.makeda-artist-body .artist-page { --artist-accent: #9cdcc7; }
body[data-artist-key=jup] .artist-page { --artist-accent: #f8e1bb; }
/* Event bill: date, entire poster, measured type. No generated date in CSS. */
#roots-live-25-07-2026 { display: grid; grid-template-columns: 84px 1.15fr .9fr; gap: 28px; background: linear-gradient(125deg,#304957,#36392e); padding: 28px; align-items: center; }
.v14-event-date { display: grid; justify-items: center; gap: 4px; padding-block: 16px; border-block: 1px solid #ffdda061; color: var(--v14-gold-light); align-self: start; margin-top: 20px; }
.v14-event-date strong { font-size: 42px; line-height: 1; }
.v14-event-date span { font-size: 12px; text-transform: uppercase; }
.v14-event-date small { font-size: 10px; }
#roots-live-25-07-2026 .hero-logo { width: 100%; height: auto; object-fit: contain; }
#roots-live-25-07-2026 h1 { font-size: 34px; }
#roots-live-25-07-2026 p { font-size: 12px; }
#roots-live-25-07-2026 .v14-event-subtitle { font-size: 20px; font-weight: 700; line-height: 1.35; }
/* Content pages: illustrated magazine and masonry with intact source ratios. */
.v12-content-section { margin-top: 42px; }
.v12-content-head { display: flex; justify-content: space-between; align-items: end; gap: 28px; margin-bottom: 28px; }
.v12-content-head h2 { margin-bottom: 0; }
.v12-news-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 36px; }
.v12-news-cards .v12-news-card { display: block; }
.v12-news-cards .v14-media-stage { margin-bottom: 16px; }
.v12-news-cards img { max-height: 340px; }
.v12-news-actions { display: flex; gap: 16px; align-items: center; }
.v12-news-actions a { font-size: 11px; color: var(--v14-gold-light); }
.v12-news-actions button { background: transparent; border: 0; color: var(--v14-cyan); padding: 10px; font-size: 11px; }
.v12-gallery-cards { columns: 3; column-gap: 22px; }
.v12-gallery-card { break-inside: avoid; margin-bottom: 24px; }
.v12-gallery-card button { border: 0; padding: 0; background: transparent; text-align: left; width: 100%; color: #e9e8db; }
.v12-gallery-card img { width: 100%; height: auto; object-fit: contain; border-radius: 4px; }
.v12-gallery-card span { display: block; padding-block: 10px; font-size: 11px; }
.v12-gallery-card__artist-link { font-size: 11px; color: var(--v14-gold); }
.v12-lightbox { position: fixed; inset: 0; z-index: 1600; display: flex; align-items: center; justify-content: center; gap: 20px; padding: 30px; background: #04121af2; }
.v12-lightbox figure { margin: 0; max-width: 80vw; max-height: 90vh; }
.v12-lightbox img { max-height: 78vh; width: 100%; object-fit: contain; }
.v12-lightbox figcaption { display: grid; gap: 4px; padding-top: 12px; font-size: 12px; }
.v12-lightbox button { border: 1px solid var(--v14-line-cyan); color: white; background: #102b39; width: 42px; height: 42px; flex-shrink: 0; }
.v12-lightbox [data-lightbox-close] { position: absolute; top: 18px; right: 18px; }
/* Utilities and membership forms keep their original JS and get readable surfaces. */
.members-page, .downloads-page { padding-block: 32px; }
.members-page .top, .downloads-page .top, .app-page .top, .dash-page .top, .space-page .top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; margin-bottom: 28px; }
.members-page .hero, .downloads-page .hero { padding: 34px; background: #254552; border-radius: 8px; }
.members-page section, .downloads-page section, .app-page > .section, .dash-page > .section, .space-page > .section { padding: 28px; background: #ffffff05; border-radius: 6px; }
.members-page .hero h1, .downloads-page .hero h1, .app-page h1, .dash-page h1, .space-page h1 { font-size: 42px; }
.members-page form, .downloads-page form { display: grid; gap: 16px; }
.offline-page, body > main:not([class]):has(> .panel) { width: min(900px,calc(100% - 40px)); margin: 40px auto; }
.offline-card, body > main:not([class]) > .panel { padding: 36px; background: #234151; border-radius: 8px; }
pre { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; }
table { width: 100%; border-collapse: collapse; }
td, th { text-align: left; padding: 10px; border-bottom: 1px solid var(--v14-line); }