/* Bio canvas: appearance is independent of content and publication. */
body{--bio-bg:var(--ink);--bio-text:var(--on-ink);--bio-accent:var(--panel);--bio-profile-gap:12px;background:var(--bio-bg);color:var(--bio-text);min-height:100dvh;overflow-x:clip}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 25% 0%,color-mix(in srgb,var(--bio-accent) 16%,transparent),transparent 65%)}
body[data-backgroundmode="solid"]::before{display:none}
/* The midpoint biases the colour range; 50% preserves the original 0–88% fade. */
body[data-backgroundmode="gradient"]::before{background:linear-gradient(var(--bio-angle),var(--bio-gradient,var(--panel-lo)) 0%,var(--bio-gradient-midpoint,44%),var(--bio-bg) 88%);opacity:var(--bio-gradient-opacity,1)}
body[data-backgroundmode="image"]::before{background:var(--bio-image) center top/cover no-repeat;opacity:var(--bio-image-opacity);mask-image:linear-gradient(#000 0%,#000 25%,transparent 100%)}
.bioShell{max-width:600px;padding:12px 24px 48px;position:relative}
body[data-width="compact"] .bioShell{max-width:528px}
body[data-width="wide"] .bioShell{max-width:808px}
.bioTop{position:relative;background:none;padding:8px 0 20px}
.bioMark{background:transparent;border:0;opacity:.7}
.bioSub{background:color-mix(in srgb,var(--bio-text) 8%,transparent);color:var(--bio-text);font-size:12px;border:1px solid color-mix(in srgb,var(--bio-text) 12%,transparent)}
.bioHero{background:none;border-radius:var(--bio-radius);color:var(--bio-text);padding:32px 24px 20px;overflow:visible}
.bioHero__mark{width:104px;height:104px;border-radius:50%;background:var(--panel);color:var(--on-panel);box-shadow:0 12px 32px #00000015;margin-bottom:24px}
.bioHero h1{font-size:28px;font-weight:500;line-height:1.2;letter-spacing:-.035em;overflow-wrap:anywhere}
.bioHero p{font-size:16px;line-height:1.5;color:inherit;opacity:.72;margin-top:var(--bio-profile-gap);max-width:40ch}
body[data-font="editorial"] .bioHero h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.025em}
body[data-herostyle="panel"] .bioHero{background:color-mix(in srgb,var(--bio-text) 6%,transparent);border:1px solid color-mix(in srgb,var(--bio-text) 10%,transparent);backdrop-filter:blur(16px);padding-block:36px}
.bioSocials{gap:12px;margin-top:24px;flex-wrap:wrap}
.bioSocial{background:transparent;color:inherit;border:0;width:40px;height:40px}
.bioSocial svg{width:23px;height:23px}
.bioCommunity{display:flow-root;margin:28px 0 36px;position:relative;clear:both}
.bioCommunity:empty{display:none}
.bioCommunity .eaBtn{width:100%;margin:0;padding:18px 20px;border-radius:var(--bio-radius);box-shadow:0 8px 24px #00000012}
.bioCommunity .eaGlow{display:none}
.bioCommunity .eaBtn::before{animation:none;opacity:.25}
.bioCommunity .eaShine{display:none}
.bioCommunity .bioPresave{margin:0}
.bioCommunity>.bioPresave~.eaBtn{margin-top:16px}
.bioSection{margin-top:36px}
.bioSection__head{margin-bottom:16px;gap:16px}
.bioText.bioSectionDescription{margin:0 0 16px;white-space:pre-wrap;font-weight:500}
.bioShell>.bioTextGroup{display:flow-root;margin-block:var(--bio-content-gap) 0}
.bioShell>.bioTextGroup:has(>.bioHeading){margin-block-start:var(--bio-section-gap)}
.bioTextGroup>.bioHeading{margin:0 0 16px;font-weight:500}
.bioTextGroup>.bioHeading:last-child{margin-bottom:0}
.bioTextGroup>.bioText{margin:0;white-space:pre-wrap;font-weight:500}
.bioSection__title,.bioHeading{color:inherit;font-size:16px;letter-spacing:.11em}
.bioHeading{margin:36px 0 16px;overflow-wrap:anywhere}
.bioHeading+:where(.bioVideoBlock):is(.ci-spec,*),.bioHeading+:where(.bioFeatureLink):is(.ci-spec,*),.bioHeading+:where(.bioLinkRow):is(.ci-spec,*){margin-top:0}
.bioAuto{font-size:9px;opacity:.55;padding:3px 7px;color:inherit}
.bioRailWrap{margin-inline:0;padding-inline:0}
.bioRail{gap:16px;padding-bottom:4px}
.bioCard{border-radius:var(--bio-radius);background:color-mix(in srgb,var(--bio-bg) 86%,var(--bio-text));border:1px solid color-mix(in srgb,var(--bio-text) 12%,transparent);box-shadow:none;transition:transform .25s ease,border-color .25s ease;color:var(--bio-text)}
.bioCard__foot{padding:14px;gap:8px;align-items:flex-start}
.bioCard__foot b{color:inherit;font-size:14px;font-weight:500;white-space:normal;overflow-wrap:anywhere;line-height:1.4}
.bioCard__foot small{color:inherit;opacity:.62;font-size:12px}
body[data-releaselayout="grid"] .bioRail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}
body[data-releaselayout="grid"] .bioCard{max-width:none;min-width:0}
body[data-releaselayout="grid"] .bioRail__next,body[data-releaselayout="list"] .bioRail__next{display:none}
body[data-releaselayout="rail"] .bioRail{padding-right:32px}
body[data-releaselayout="rail"] .bioCard{flex-basis:62%;max-width:320px}
body[data-releaselayout="list"] .bioRail{display:grid;overflow:visible;gap:12px}
body[data-releaselayout="list"] .bioCard:not(.bioPlaylistCard){display:flex;max-width:none;align-items:center;padding:10px;gap:12px}
body[data-releaselayout="list"] .bioCard:not(.bioPlaylistCard) .bioCard__art{width:88px;flex:none;border-radius:calc(var(--bio-radius) / 2)}
body[data-releaselayout="list"] .bioCard:not(.bioPlaylistCard) .bioCard__foot{flex:1;min-width:0;padding:4px;align-items:center}
body[data-releaselayout="list"] .bioCard:not(.bioPlaylistCard) .bioChip{display:none}
.bioLinkRow{margin-top:14px;padding:18px 20px;min-height:72px;border-radius:var(--bio-radius);color:var(--bio-text);background:color-mix(in srgb,var(--bio-text) 7%,var(--bio-bg));border:1px solid color-mix(in srgb,var(--bio-text) 10%,transparent);transition:transform .25s ease,background .25s ease}
.bioLinkRow small{color:inherit;opacity:.65}.bioLinkRow b,.bioLinkRow small{overflow-wrap:anywhere}
body[data-linkstyle="outline"] .bioLinkRow{background:transparent;border-color:color-mix(in srgb,var(--bio-text) 30%,transparent)}
body[data-linkstyle="glass"] .bioLinkRow{background:color-mix(in srgb,var(--bio-bg) 45%,transparent);backdrop-filter:blur(18px)}
.bioFeatureLink{display:block;position:relative;isolation:isolate;overflow:hidden;border-radius:var(--bio-radius);margin-top:18px;aspect-ratio:16/10;color:white;text-decoration:none;background:#262626}
.bioFeatureLink img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.bioFeatureLink::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 20%,#000b)}
.bioFeatureLink>span{position:absolute;bottom:24px;left:24px;right:54px;z-index:1;overflow-wrap:anywhere}
.bioFeatureLink b{display:block;font-size:22px;line-height:1.2}.bioFeatureLink small{display:block;opacity:.8;margin-top:8px}
.bioFeatureLink i{position:absolute;bottom:24px;right:22px;z-index:1;font-style:normal;font-size:24px}
.bioText{color:inherit;font-size:16px;line-height:1.5;overflow-wrap:anywhere}.bioImage{border-radius:var(--bio-radius)}
.bioFoot{margin-top:44px;color:inherit;opacity:.55}.bioFoot a{color:inherit}
.bioShell a:focus-visible,.bioShell button:focus-visible{outline:2px solid var(--bio-accent);outline-offset:5px}
@media(hover:hover){.bioLinkRow:hover,.bioCard:hover{transform:none;border-color:color-mix(in srgb,var(--bio-text) 30%,transparent)}.bioFeatureLink:hover img{transform:none}}
@media(max-width:420px){.bioShell{padding-inline:16px}.bioHero{padding:24px 8px 12px}.bioCard__foot{padding:10px}.bioFeatureLink>span{left:18px;bottom:18px}.bioFeatureLink b{font-size:19px}}
@media(prefers-reduced-motion:no-preference){[data-motion="fade"] .bioReveal{animation:bioReveal .65s ease}@keyframes bioReveal{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Hidden signup sheets must not enlarge the canvas or inherit a reveal transform. */
.bioCommunity .eaSheet{display:none;top:0}
.bioCommunity .eaSheet:target{display:flex}
@media(prefers-reduced-motion:no-preference){[data-motion="fade"] .bioCommunity.bioReveal{animation-name:bioRevealOpacity}@keyframes bioRevealOpacity{from{opacity:0}to{opacity:1}}}
body[data-releaselayout="list"] .bioCard:not(.bioPlaylistCard) .bioCta{margin:0 8px 0 0;flex:none;min-width:64px}

/* The modal's owner must rise above reveal/hover stacking contexts too. */
.bioCommunity:has(.eaSheet:is(:target,.isOpen)):not(:has(.eaSheet.isClosed)){z-index:1001;animation:none!important}
html.bioSignupOpen,html.bioSignupOpen body{overflow:hidden!important;overscroll-behavior:none}

.bioCommunity .eaBtn::before{display:none}
.bioCta--live,.bioCta--soon{background:var(--bio-accent);color:var(--bio-on-accent,var(--on-panel))}

/* Release cards keep their action on one baseline, including two-line titles. */
.bioCard{display:flex;flex-direction:column;min-width:0}
.bioCard__art{flex-shrink:0;width:100%}
.bioCard__foot{flex:none}
.bioCard__foot>span:first-child{flex:1;min-width:0;font-size:14px;min-height:calc(2.8em + 17.8px)}
.bioCard__foot b{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:0;max-height:2.8em;line-height:1.4}
.bioCard__foot small{line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bioCard .bioCta{margin-top:auto;min-height:38px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;line-height:1.4;flex:none}
body[data-releaselayout="grid"] .bioRail{align-items:stretch;grid-auto-rows:1fr}
body[data-releaselayout="rail"] .bioRail{display:flex;overflow-x:auto;overflow-y:hidden;align-items:stretch;scroll-snap-type:x mandatory;overscroll-behavior-x:contain}
body[data-releaselayout="rail"] .bioRail--single{overflow:visible;mask-image:none;padding-right:0}
body[data-releaselayout="list"] .bioCard:not(.bioPlaylistCard){flex-direction:row}
body[data-releaselayout="list"] .bioCard:not(.bioPlaylistCard) .bioCard__foot b{min-height:0}
body[data-releaselayout="list"] .bioCard:not(.bioPlaylistCard) .bioCta{margin:0 8px 0 0}
.bioRail__next[hidden]{display:none!important}

.bioShell>.bioSocials{margin:24px 0}
/* Align the 23px icons optically without shrinking their 40px click targets. */
body:not([data-herostyle="panel"]) .bioHero:has(+.bioSocials){padding-bottom:0}
body:not([data-herostyle="panel"]) .bioHero+.bioSocials{margin-top:calc(var(--bio-profile-gap) - 8.5px)}

/* Movable Early Access uses the Smart Links signup and neon ring. */
.bioCommunity.bioEarlyAccess{margin:26px 0;overflow:visible}
.bioEarlyAccess .eaBtn{--ea-art:linear-gradient(115deg,var(--bio-ea-accent),var(--bio-ea-secondary))!important;--ea-accent:var(--bio-ea-accent)!important;box-sizing:border-box;width:100%;max-width:100%;margin:0;color:var(--bio-ea-text);box-shadow:none}
.bioEarlyAccess .eaBtn .eaFace{background:var(--bio-ea-bg);box-shadow:0 8px 24px #0002}
.bioCommunity.bioEarlyAccess .eaBtn::before{display:block;opacity:1;background:linear-gradient(115deg,var(--bio-ea-accent),var(--bio-ea-secondary),var(--bio-ea-accent)) center/320% 320%;animation:eaDrift 16s ease-in-out infinite alternate}
.bioCommunity.bioEarlyAccess .eaGlow{display:block;background:linear-gradient(115deg,var(--bio-ea-accent),var(--bio-ea-secondary));opacity:var(--bio-ea-glow);filter:blur(15px);inset:-5px;animation:none}
.bioEarlyAccess .eaBtn:hover .eaGlow{opacity:var(--bio-ea-glow)}
.bioEarlyAccess .eaIcon{background:linear-gradient(115deg,var(--bio-ea-accent),var(--bio-ea-secondary));box-shadow:none}
.bioEarlyAccess[data-ea-shape="pill"] .eaBtn{border-radius:999px;min-height:54px;padding:10px 17px;gap:12px}
.bioEarlyAccess[data-ea-shape="pill"] .eaText small{display:none}
.bioEarlyAccess[data-ea-shape="pill"] .eaText b{font-size:14px;line-height:1.35;overflow-wrap:anywhere}
.bioEarlyAccess[data-ea-shape="pill"] .eaIcon{width:30px;height:30px;flex-basis:30px}
.bioEarlyAccess[data-ea-width="fit"] .eaBtn{width:fit-content;min-width:min(240px,100%);margin-inline:auto}
.bioEarlyAccess[data-ea-shape="card"] .eaBtn{padding:18px 20px;border-radius:var(--bio-radius);gap:14px}
.bioEarlyAccess .eaSheet{--ea-art:linear-gradient(115deg,var(--bio-ea-accent),var(--bio-ea-secondary))!important}
@media(prefers-reduced-motion:reduce){.bioCommunity.bioEarlyAccess .eaBtn::before{animation:none}}
:where(.bioEarlyAccess):is(.ci-spec,*) .eaSheet.isOpen,:where(.bioSmartAccess):is(.ci-spec,*) .eaSheet.isOpen{display:flex;top:0;visibility:visible}
:where(.bioEarlyAccess):is(.ci-spec,*) .eaSheet.isClosed,:where(.bioSmartAccess):is(.ci-spec,*) .eaSheet.isClosed{display:none!important}
:where(.bioEarlyAccess):is(.ci-spec,*) .eaSheet.isOpen .eaSheetBackdrop,:where(.bioSmartAccess):is(.ci-spec,*) .eaSheet.isOpen .eaSheetBackdrop{animation:eaFade .4s ease both}
:where(.bioEarlyAccess):is(.ci-spec,*) .eaSheet.isOpen .eaSheetPanel,:where(.bioSmartAccess):is(.ci-spec,*) .eaSheet.isOpen .eaSheetPanel{animation:eaSheetUp .6s cubic-bezier(.16,1,.3,1) both}
@media(min-width:640px){:where(.bioEarlyAccess):is(.ci-spec,*) .eaSheet.isOpen .eaSheetPanel,:where(.bioSmartAccess):is(.ci-spec,*) .eaSheet.isOpen .eaSheetPanel{animation-name:eaPop}}
@media(prefers-reduced-motion:reduce){:where(.bioEarlyAccess):is(.ci-spec,*) .eaSheet.isOpen .eaSheetPanel,:where(.bioSmartAccess):is(.ci-spec,*) .eaSheet.isOpen .eaSheetPanel,:where(.bioEarlyAccess):is(.ci-spec,*) .eaSheet.isOpen .eaSheetBackdrop,:where(.bioSmartAccess):is(.ci-spec,*) .eaSheet.isOpen .eaSheetBackdrop{animation:none}}

.bioVideoBlock{margin:24px 0;min-width:0}
.bioVideoBlock .bioVideo{position:relative;margin:0;aspect-ratio:16/9;border-radius:var(--bio-radius);overflow:hidden}
.bioVideoPlay{display:block;position:relative;width:100%;height:100%;padding:0;border:0;background:#17171c;color:#fff;cursor:pointer}
.bioVideoPlay>img{display:block;width:100%;height:100%;object-fit:cover;opacity:.7}
.bioVideoPlayIcon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;display:grid;place-items:center;border-radius:50%;background:#111c;border:1px solid #fff8;box-shadow:0 0 28px #0005}
.bioVideoPlayIcon svg{width:28px;height:28px}
.bioVideoPlayLabel{position:absolute;left:14px;bottom:12px;font:500 13px system-ui;text-shadow:0 1px 8px #000}
.bioVideoFallback{display:block;width:fit-content;margin:9px 0 0 auto;color:inherit;font-size:11px;text-decoration:none;opacity:.75}
.bioVideoFallback:hover{text-decoration:underline;opacity:1}

/* Once opened, the player supplies its own single external fallback. */
.bioVideo:has(iframe)+.bioVideoFallback{display:none}

/* Duotone fills use the actual button face, with distinct left/right colours. */
.bioEarlyAccess[data-ea-fill="duotone"] .eaBtn .eaFace{background:linear-gradient(90deg,var(--bio-ea-bg) 0%,var(--bio-ea-bg) 8%,var(--bio-ea-right) 92%,var(--bio-ea-right) 100%)}

/* Profile bio: category, preserved line breaks and adjustable description size. */
.bioHero .bioHeroCategory{display:block;margin:12px auto 0;font-size:12px;line-height:1.5;color:inherit;opacity:.6;overflow-wrap:anywhere}
.bioHero .bioHeroDescription{font-size:var(--bio-description-size,16px);white-space:pre-wrap;overflow-wrap:anywhere}
.bioHero .bioHeroCategory+.bioHeroDescription{margin-top:6px}

/* Native Smart Link invite: share its renderer and effects, only fit the bio layout. */
.bioSmartAccess{margin:26px 0;overflow:visible}
.bioSmartAccess .eaBtn{box-sizing:border-box;width:100%;max-width:100%;margin:0 auto}
.bioSmartAccess[data-ea-width="fit"] .eaBtn{width:min(400px,92%)}

/* An explicit description is visible in compact buttons too. */
:where(.bioEarlyAccess):is(.ci-spec,*) .eaBtn.eaHasDescription .eaText small,:where(.bioSmartAccess):is(.ci-spec,*) .eaBtn.eaHasDescription .eaText small{display:block;white-space:pre-line;overflow-wrap:anywhere;line-height:1.4;margin-top:3px}
:where(.bioEarlyAccess):is(.ci-spec,*) .eaBtn.eaHasDescription,:where(.bioSmartAccess):is(.ci-spec,*) .eaBtn.eaHasDescription{height:auto;min-height:64px;text-align:left}

/* Premium glass: restrained coloured edges, translucent charcoal and a soft halo. */
.bioEarlyAccess[data-ea-finish="glass"] .eaBtn{min-height:72px;padding:14px 20px;gap:14px;isolation:isolate}
.bioEarlyAccess[data-ea-finish="glass"] .eaBtn .eaFace{background:linear-gradient(100deg,color-mix(in srgb,var(--bio-ea-bg) 90%,transparent),color-mix(in srgb,var(--bio-ea-right) 90%,transparent));backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:inset 0 1px 0 #ffffff09,0 8px 24px #00000018}
.bioCommunity.bioEarlyAccess[data-ea-finish="glass"] .eaBtn::before{inset:-1px;padding:1px;background:linear-gradient(110deg,var(--bio-ea-accent),var(--bio-ea-secondary));background-size:100% 100%;opacity:.78;filter:none;animation:none}
.bioCommunity.bioEarlyAccess[data-ea-finish="glass"] .eaGlow{inset:-7px;filter:blur(25px);opacity:calc(var(--bio-ea-glow)*.35);animation:none}
.bioEarlyAccess[data-ea-finish="glass"] .eaBtn:hover .eaGlow{opacity:calc(var(--bio-ea-glow)*.45)}
.bioEarlyAccess[data-ea-finish="glass"] .eaIcon{width:40px;height:40px;flex-basis:40px;background:#e7d6b8;color:#34372f;box-shadow:inset 0 0 0 1px #ffffff16}
.bioEarlyAccess[data-ea-finish="glass"] .eaPic{opacity:1;transform:none}.bioEarlyAccess[data-ea-finish="glass"] .eaIcon.hasPic i{opacity:0}
.bioEarlyAccess[data-ea-finish="glass"] .eaText b{font-size:15px;font-weight:600;line-height:1.35;letter-spacing:-.02em}
.bioEarlyAccess[data-ea-finish="glass"] .eaText small{font-size:11.5px;line-height:1.45;opacity:.66}
.bioEarlyAccess[data-ea-finish="glass"] .eaArrow{font-size:24px;opacity:.85}
.bioEarlyAccess[data-ea-finish="glass"][data-ea-shape="card"] .eaBtn{border-radius:22px;padding:20px}
@media(max-width:360px){.bioEarlyAccess[data-ea-finish="glass"] .eaBtn{padding:13px 16px;gap:11px}.bioEarlyAccess[data-ea-finish="glass"] .eaIcon{width:36px;height:36px;flex-basis:36px}.bioEarlyAccess[data-ea-finish="glass"] .eaText b{font-size:14px}}

@media(prefers-reduced-motion:reduce){.bioEarlyAccess[data-ea-finish="glass"] :where(.eaGlow):is(ci-spec.ci-spec,*),.bioEarlyAccess[data-ea-finish="glass"] :where(.eaPic):is(ci-spec.ci-spec,*),.bioEarlyAccess[data-ea-finish="glass"] :where(.eaArrow):is(ci-spec.ci-spec,*),.bioEarlyAccess[data-ea-finish="glass"] :where(.eaIcon i):is(ci-spec.ci-spec,*){transition:none!important}}

/* A soft blur resolves into sharp content; signup dialogs keep a fixed viewport. */
@media(prefers-reduced-motion:no-preference){
 body[data-motion="blur"] .bioReveal{animation:bioBlurReveal .8s cubic-bezier(.2,.7,.2,1)}
 @keyframes bioBlurReveal{from{opacity:0;filter:blur(8px);transform:translateY(8px)}to{opacity:1;filter:none;transform:none}}
 body[data-motion="blur"] .bioCommunity.bioReveal{animation-name:bioRevealOpacity}
 body[data-motion="blur"] .bioCommunity.bioReveal .eaBtn{animation:bioBlurReveal .8s cubic-bezier(.2,.7,.2,1)}
}

.bioFoot{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px 18px}
.bioFoot .bioPowered{font-size:inherit;text-decoration:none}
.bioFoot .bioPowered[hidden]{display:none}

/* Logo placement is independent from the profile title and the join action. */
body[data-logoplacement="none"] .bioHero__mark{display:none}
.bioTop .bioSub{margin-inline-start:auto}

/* Curated playlists remain a horizontal rail independently of release layout. */
body .bioPlaylistSection .bioRail{display:flex;grid-template-columns:none;overflow-x:auto;gap:16px;padding-right:32px;scroll-snap-type:x mandatory}
body .bioPlaylistSection .bioPlaylistCard{flex:0 0 62%;max-width:320px}
body .bioPlaylistSection .bioRail__next:not([hidden]){display:grid}
/* A standalone playlist uses the same full content width as an image block. */
body .bioPlaylistSection .bioRail.bioRail--single{overflow:visible;padding-right:0;scroll-snap-type:none;mask-image:none;-webkit-mask-image:none}
body .bioPlaylistSection .bioRail--single .bioPlaylistCard{flex:1 1 100%;width:100%;max-width:none;min-width:0}

/* Shared rhythm: adjoining blocks/cards, heading/content, then new sections. */
body{--bio-content-gap:16px;--bio-section-gap:28px}
body[data-releaselayout] .bioRail,body .bioPlaylistSection .bioRail{gap:var(--bio-content-gap);padding-bottom:0}
.bioShell>:where(.bioSection):is(.ci-spec,*),.bioShell>:where(.bioRailWrap):is(.ci-spec,*),.bioShell>:where(.bioImage):is(.ci-spec,*),.bioShell>:where(.bioVideoBlock):is(.ci-spec,*),.bioShell>:where(.bioFeatureLink):is(.ci-spec,*),.bioShell>:where(.bioLinkRow):is(.ci-spec,*),.bioShell>:where(.bioText):is(.ci-spec,*),.bioShell>:where(.bioCommunity):is(.ci-spec,*),.bioShell>:where(.bioSmartAccess):is(.ci-spec,*){margin-block:var(--bio-content-gap) 0}
.bioShell>.bioSection{margin-block-start:var(--bio-section-gap)}
.bioShell>.bioHeading{margin-block:var(--bio-section-gap) var(--bio-content-gap)}
.bioShell>.bioHeading+:where(.bioSection):is(.ci-spec,*),.bioShell>.bioHeading+:where(.bioRailWrap):is(.ci-spec,*),.bioShell>.bioHeading+:where(.bioImage):is(.ci-spec,*),.bioShell>.bioHeading+:where(.bioVideoBlock):is(.ci-spec,*),.bioShell>.bioHeading+:where(.bioFeatureLink):is(.ci-spec,*),.bioShell>.bioHeading+:where(.bioLinkRow):is(.ci-spec,*),.bioShell>.bioHeading+:where(.bioText):is(.ci-spec,*),.bioShell>.bioHeading+:where(.bioCommunity):is(.ci-spec,*),.bioShell>.bioHeading+:where(.bioSmartAccess):is(.ci-spec,*){margin-block-start:0}

/* ReleaseLoft's header mark is independent from the label's profile image. */
.bioTop .bioReleaseLoft{display:inline-flex;align-items:center;gap:8px;width:auto;height:34px;background:none;border:0;color:inherit;text-decoration:none;opacity:.8;font-size:12px;font-weight:600;white-space:nowrap}
.bioTop .bioReleaseLoft svg{width:23px;height:23px;flex:none}
.bioTop .bioReleaseLoft[hidden]{display:none}
.bioTop:has(.bioReleaseLoft[hidden]):not(:has(.bioSub)){display:none}

/* Alignment belongs to each text block, including headings. */
:is(.bioText,.bioHeading)[data-align="left"]{text-align:left}
:is(.bioText,.bioHeading)[data-align="center"]{text-align:center}
:is(.bioText,.bioHeading)[data-align="right"]{text-align:right}
/* Default preserves the existing paragraph and section-heading typography. */
.bioText[data-size="small"]{font-size:12px}
.bioHeading[data-size="small"]{font-size:11px}
:is(.bioText,.bioHeading)[data-size="large"]{font-size:18px}
:is(.bioText,.bioHeading)[data-size="xlarge"]{font-size:24px}

/* Design choices apply to the visible content, including the lower half of a bio. */
body[data-font="editorial"]{font-family:Georgia,'Times New Roman',serif}
.bioReleaseLoft{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Helvetica Neue',Arial,sans-serif}
.bioCta{border:1px solid transparent}
body[data-linkstyle="outline"] .bioCta{background:transparent;color:var(--bio-text);border-color:color-mix(in srgb,var(--bio-text) 45%,transparent)}
body[data-linkstyle="glass"] .bioCta{background:color-mix(in srgb,var(--bio-accent) 16%,transparent);color:var(--bio-text);border-color:color-mix(in srgb,var(--bio-text) 20%,transparent);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
/* On phones width also controls side space, rather than three identical capped canvases. */
@media(max-width:600px){
 .bioShell{padding-inline:16px}
 .bioSection__title,.bioHeading{font-size:14px}
 body[data-width="compact"] .bioShell{padding-inline:32px}
 body[data-width="wide"] .bioShell{padding-inline:12px}
}

/* Section titles have their own alignment, independent of their card rail. */
.bioSection__title{flex:1;min-width:0;overflow-wrap:anywhere}
.bioSection__title[data-align="left"]{text-align:left}
.bioSection__title[data-align="center"]{text-align:center}
.bioSection__title[data-align="right"]{text-align:right}
/* An explicit page choice overrides local typography without rewriting it. */
body[data-textalign="left"]{--bio-page-align:left;--bio-page-justify:flex-start;--bio-page-start:0;--bio-page-end:auto}
body[data-textalign="center"]{--bio-page-align:center;--bio-page-justify:center;--bio-page-start:auto;--bio-page-end:auto}
body[data-textalign="right"]{--bio-page-align:right;--bio-page-justify:flex-end;--bio-page-start:auto;--bio-page-end:0}
body:is([data-textalign="left"],[data-textalign="center"],[data-textalign="right"]) :where(.bioHero):is(ci-spec.ci-spec.ci-spec,*),body:is([data-textalign="left"],[data-textalign="center"],[data-textalign="right"]) :where(.bioText):is(ci-spec.ci-spec.ci-spec,*),body:is([data-textalign="left"],[data-textalign="center"],[data-textalign="right"]) :where(.bioHeading):is(ci-spec.ci-spec.ci-spec,*),body:is([data-textalign="left"],[data-textalign="center"],[data-textalign="right"]) :where(.bioSection__title):is(ci-spec.ci-spec.ci-spec,*),body:is([data-textalign="left"],[data-textalign="center"],[data-textalign="right"]) :where(.bioLinkRow>span:last-child):is(ci-spec.ci-spec.ci-spec,*),body:is([data-textalign="left"],[data-textalign="center"],[data-textalign="right"]) :where(.bioFeatureLink>span):is(ci-spec.ci-spec.ci-spec,*),body:is([data-textalign="left"],[data-textalign="center"],[data-textalign="right"]) :where(.bioPresave>span:last-child):is(ci-spec.ci-spec.ci-spec,*),body:is([data-textalign="left"],[data-textalign="center"],[data-textalign="right"]) :where(.bioEarlyAccess .eaText):is(ci-spec.ci-spec.ci-spec,*),body:is([data-textalign="left"],[data-textalign="center"],[data-textalign="right"]) :where(.bioSmartAccess .eaText):is(ci-spec.ci-spec.ci-spec,*){text-align:var(--bio-page-align)}
body:is([data-textalign="left"],[data-textalign="center"],[data-textalign="right"]) :where(.bioHero__mark):is(ci-spec.ci-spec,*),body:is([data-textalign="left"],[data-textalign="center"],[data-textalign="right"]) :where(.bioHero p):is(ci-spec.ci-spec,*){margin-inline-start:var(--bio-page-start);margin-inline-end:var(--bio-page-end)}
body:is([data-textalign="left"],[data-textalign="center"],[data-textalign="right"]) :where(.bioShell>.bioSocials):is(.ci-spec.ci-spec,*),body:is([data-textalign="left"],[data-textalign="center"],[data-textalign="right"]) :where(.bioFoot):is(.ci-spec.ci-spec,*){justify-content:var(--bio-page-justify)}
.bioLinkRow>span:last-child{flex:1;min-width:0}

/* A transparent mask blends with theme, gradient and image backgrounds alike.
   Keep arrows outside the mask; never fade a fully visible first/last card. */
body .bioRail[data-bio-edge]{--bio-edge-left:0px;--bio-edge-right:0px;-webkit-mask-image:none;mask-image:none}
body .bioRail[data-bio-edge="left"],body .bioRail[data-bio-edge="both"]{--bio-edge-left:8%}
body .bioRail[data-bio-edge="right"],body .bioRail[data-bio-edge="both"]{--bio-edge-right:8%}
body .bioRail[data-bio-edge]:not([data-bio-edge="none"]){
 -webkit-mask-image:linear-gradient(to right,transparent,#000 var(--bio-edge-left),#000 calc(100% - var(--bio-edge-right)),transparent);
 mask-image:linear-gradient(to right,transparent,#000 var(--bio-edge-left),#000 calc(100% - var(--bio-edge-right)),transparent);
}

/* Reserve optional wrapping below the artist, never as a blank title line.
   Card captions keep their own alignment independently of page typography. */
.bioCard__foot{text-align:left}
body[data-releaselayout="list"] .bioCard:not(.bioPlaylistCard) .bioCard__foot>span:first-child{min-height:0}

.bioCard .bioCta{font-weight:500}

/* Premium profile name: one inline group follows the heading alignment. */
.bioNameLine{display:inline-flex;align-items:center;gap:8px;max-width:100%;vertical-align:bottom}
.bioNameText{min-width:0;overflow-wrap:anywhere}
.bioProBadge{display:inline-flex;align-items:center;justify-content:center;flex:0 0 20px;width:20px;height:20px;color:#0095f6;line-height:1;letter-spacing:normal}
.bioProBadge svg{display:block;width:100%;height:100%}
@media(forced-colors:active){.bioProBadge{color:Highlight}.bioProBadge svg path:last-child{stroke:HighlightText}}