/* RIFFELO DS1-B2 | public profile opt-in. No LP1 selectors or assets modified. */ :root {--ds-profile-glass:rgba(13,18,34,.82);--ds-profile-border:rgba(203,189,234,.22);--ds-profile-pink:#F046A8;} /* Profile image extends up behind the unchanged fixed header; no layout jump. */ #app>.shell:has(.ds-profile){padding-top:0!important} #app .ds-header.ds-profile-hero-header{background:transparent!important;} #app .ds-header.ds-profile-hero-header::before,#app .ds-header.ds-profile-hero-header::after{opacity:0!important;pointer-events:none!important} #app .ds-header::before,#app .ds-header::after{transition:opacity .24s ease!important} #app .ds-header.ds-profile-hero-header .ds-wordmark,#app .ds-header.ds-profile-hero-header .ds-primary-nav>button{filter:drop-shadow(0 2px 8px rgba(0,0,0,.72))!important} /* Match the landing's lighter tracking and stroke. Never alters landing itself. */ /* DS1-B2.1: shared header wordmark is owned by riffelo-ds1.css. */ /* Artist-only root, real image remains a DOM img with descriptive alt. */ #app .ds-profile{position:relative;background:#070910!important;color:#f8f5fc!important;min-height:100vh;overflow:clip!important;isolation:isolate;} #app .ds-profile:before{content:'';position:absolute;inset:490px 0 auto; height:1300px;pointer-events:none;background:radial-gradient(ellipse at 100% 8%,rgba(208,55,146,.12),transparent 35%),radial-gradient(ellipse at 4% 65%,rgba(102,56,180,.12),transparent 33%);z-index:0} #app .ds-profile .artist-profile-stage{min-height:clamp(630px,39vw,760px)!important;height:clamp(630px,39vw,760px)!important;position:relative!important;overflow:visible!important;border:0!important;background:radial-gradient(ellipse at 78% 32%,rgba(184,37,123,.26),transparent 41%),linear-gradient(100deg,#070911 0%,#131021 60%,#070911)!important;isolation:isolate} #app .ds-profile .artist-profile-stage:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 85% 36%,rgba(250,63,167,.2),transparent 26%),radial-gradient(circle at 70% 5%,rgba(78,90,207,.28),transparent 31%)} #app .ds-profile .artist-profile-stage:after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,rgba(4,7,15,.97) 0%,rgba(4,7,15,.90) 28%,rgba(4,7,15,.44) 52%,rgba(4,7,15,.03) 80%),linear-gradient(0deg,#070911 0%,transparent 28%)} #app .ds-profile .artist-hero-backdrop.ds-profile-hero-glow{position:absolute!important;inset:0 0 0 28%!important;opacity:.24!important;filter:blur(55px) saturate(1.5)!important;transform:scale(1.05)!important;background-position:70% 35%!important;background-size:cover!important;pointer-events:none;z-index:0} #app .ds-profile .artist-hero-backdrop.ds-profile-hero-glow:after{display:none!important} #app .ds-profile .artist-hero-shell{position:relative!important;z-index:2!important;max-width:none!important;width:100%!important;min-height:100%!important;padding:0 clamp(23px,4.7vw,114px)!important;box-sizing:border-box!important} #app .ds-profile .artist-back-link{position:absolute!important;top:calc(var(--ds-fixed-header-height) + 12px);left:clamp(23px,4.7vw,114px);z-index:4;min-height:32px;color:#e9dfed!important;filter:drop-shadow(0 2px 5px #080914)} #app .ds-profile .artist-hero-v2{position:relative!important;display:flex!important;align-items:flex-end!important;justify-content:space-between!important;width:100%!important;max-width:none!important;min-height:clamp(630px,39vw,760px)!important;height:clamp(630px,39vw,760px)!important;overflow:visible!important;grid-template-columns:none!important;gap:clamp(18px,2.4vw,42px)!important;} #app .ds-profile .ds-profile-hero-image{position:absolute!important;z-index:-1!important;top:0!important;bottom:0!important;right:calc(-1 * clamp(23px,4.7vw,114px))!important;width:73%!important;height:100%!important;overflow:hidden!important;border:0!important;border-radius:0!important;box-shadow:none!important;pointer-events:none} #app .ds-profile .ds-profile-hero-image:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#070911 0%,rgba(7,9,17,.30) 32%,transparent 64%),linear-gradient(0deg,rgba(7,9,17,.5),transparent 30%);pointer-events:none} #app .ds-profile .ds-profile-hero-image img{height:100%!important;width:100%!important;min-height:0!important;object-fit:cover!important;object-position:60% 18%!important;border:0!important;border-radius:0!important;filter:saturate(1.14) contrast(1.08);} #app .ds-profile.ds-profile-no-photo .ds-profile-hero-image{display:none!important} #app .ds-profile.ds-profile-no-photo .artist-profile-stage{background:radial-gradient(ellipse at 85% 12%,rgba(240,70,168,.25),transparent 43%),radial-gradient(ellipse at 60% 62%,rgba(93,82,185,.30),transparent 42%),linear-gradient(100deg,#070911,#14142d)!important} #app .ds-profile .artist-hero-main{z-index:3;position:relative!important;flex:1 1 55%!important;max-width:min(860px,57%)!important;padding:0 0 110px!important;margin:0!important;align-self:flex-end!important;background:transparent!important;} #app .ds-profile .artist-hero-main>.eyebrow{font:700 12px/1.4 Inter,Arial,sans-serif!important;color:#e9bedf!important;letter-spacing:.22em!important} #app .ds-profile .artist-name-line{display:flex;align-items:center;gap:22px;flex-wrap:wrap!important;margin-top:10px!important} #app .ds-profile .artist-name-line h1{font:400 clamp(68px,5.65vw,128px)/.96 'DM Serif Display',Georgia,serif!important;letter-spacing:-.032em!important;color:#fff!important;margin:0!important;text-shadow:0 8px 30px rgba(0,0,0,.34)} #app .ds-profile .artist-no1-badge{width:clamp(58px,4.6vw,98px)!important;height:clamp(58px,4.6vw,98px)!important;object-fit:contain!important;flex:none!important;filter:drop-shadow(0 4px 18px rgba(243,185,52,.28))} #app .ds-profile .artist-hero-tagline{color:#f0e7f2!important;font:400 clamp(17px,1.35vw,26px)/1.35 'DM Serif Display',Georgia,serif!important;max-width:750px!important;margin:16px 0!important} #app .ds-profile .artist-genre-chips{display:flex;flex-wrap:wrap;gap:7px!important} #app .ds-profile .artist-genre-chips>span{background:rgba(9,15,27,.50)!important;border:1px solid rgba(236,222,244,.35)!important;border-radius:999px!important;padding:7px 13px!important;color:#f2eaf5!important;font:500 12px Inter,Arial,sans-serif!important;} #app .ds-profile .artist-hero-actions{display:flex;align-items:center;gap:12px!important;margin-top:22px!important;flex-wrap:wrap!important;} #app .ds-profile .artist-play-latest{background:var(--ds-profile-pink)!important;border:1px solid #fa77bd!important;border-radius:999px!important;min-height:50px!important;padding:12px 24px!important;color:#101016!important;font:700 14px Inter,Arial,sans-serif!important;box-shadow:0 9px 28px rgba(240,70,168,.35)!important;display:inline-flex!important;align-items:center!important;gap:8px!important;} #app .ds-profile .artist-play-latest svg{width:19px!important;height:19px!important;stroke:#110812!important;fill:none!important;} #app .ds-profile .hero-share{background:rgba(8,13,24,.55)!important;min-height:50px!important;padding:10px 22px!important;border-radius:999px!important;color:#fff!important;border:1px solid rgba(247,238,254,.65)!important;display:inline-flex!important;align-items:center!important;gap:9px!important;box-shadow:none!important;} #app .ds-profile .artist-hero-stats{z-index:3;position:relative!important;flex:0 0 min(560px,42%)!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:0!important;padding:16px 8px!important;margin:0 0 90px!important;align-self:flex-end!important;border:1px solid rgba(232,210,244,.23)!important;border-radius:16px!important;background:linear-gradient(130deg,rgba(12,15,33,.78),rgba(8,12,27,.45))!important;box-shadow:0 18px 50px rgba(0,0,0,.28),inset 0 1px rgba(245,191,242,.12);backdrop-filter:blur(16px);} #app .ds-profile .artist-hero-stats span{display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;gap:6px!important;min-width:0!important;text-align:center!important;padding:8px 4px!important;border-right:1px solid rgba(236,215,250,.18)!important;} #app .ds-profile .artist-hero-stats span:last-child{border:0!important} #app .ds-profile .artist-hero-stats b{font:600 clamp(20px,1.7vw,35px)/1.1 Inter,Arial,sans-serif!important;color:#fff!important;font-variant-numeric:tabular-nums} #app .ds-profile .artist-hero-stats small{font:500 11px/1.3 Inter,Arial,sans-serif!important;color:#d3d1df!important;text-transform:none!important;letter-spacing:0!important} #app .ds-profile .artist-debut-pending{display:flex!important;justify-content:center;flex-basis:350px!important} #app .ds-profile .artist-debut-pending span{border:0!important} #app .ds-profile .new-artist-marker{display:inline-block;border:1px solid rgba(240,70,168,.5);border-radius:99px;padding:7px 12px;color:#f9c5e2!important;background:rgba(240,70,168,.09);} /* Small, focused invitation under hero. Uses existing shareGuestInvitation unchanged. */ #app .ds-profile .share-artist-guest{width:calc(100% - 2 * clamp(16px,1.8vw,48px))!important;max-width:2400px!important;margin:12px auto 0!important;position:relative;z-index:3;} #app .ds-profile .share-guest-invitation{border:1px solid var(--ds-profile-border)!important;background:linear-gradient(110deg,rgba(36,15,46,.86),rgba(12,17,33,.92)),radial-gradient(circle at 15% 25%,rgba(240,70,168,.17),transparent 30%)!important;border-radius:15px!important;box-shadow:0 12px 32px rgba(0,0,0,.2)!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:6px 22px!important;align-items:center!important;padding:14px 22px!important;min-height:100px!important;} #app .ds-profile .share-guest-invitation>.eyebrow{grid-column:1!important;grid-row:1!important;color:#d9a3d0!important;letter-spacing:.15em!important;font-size:10px!important} #app .ds-profile .share-guest-invitation h2{grid-column:1!important;grid-row:2!important;font:400 clamp(17px,1.55vw,28px)/1.16 'DM Serif Display',Georgia,serif!important;color:#fff!important;margin:0!important;max-width:none!important} #app .ds-profile .share-guest-actions{grid-column:2!important;grid-row:1/4!important;display:flex!important;align-items:center!important;gap:10px!important;margin:0!important} #app .ds-profile .share-guest-actions button{min-height:44px!important;border-radius:99px!important;white-space:nowrap!important} #app .ds-profile .share-guest-actions .primary-cta{background:var(--ds-profile-pink)!important;color:#12101b!important;border:0!important;box-shadow:none!important} #app .ds-profile .share-guest-actions .secondary-cta{background:rgba(10,15,28,.6)!important;border:1px solid rgba(224,220,238,.5)!important;color:#fff!important} #app .ds-profile .share-guest-invitation>small{grid-column:1;grid-row:3;color:#aeb6c7!important;font-size:11px!important} /* Three-column glass editorial layout. Content remains exactly the source profile. */ #app .ds-profile .artist-profile-grid{width:calc(100% - 2 * clamp(16px,1.8vw,48px))!important;max-width:2400px!important;display:grid!important;grid-template-columns:minmax(0,1.05fr) minmax(0,1.05fr) minmax(0,.88fr)!important;grid-template-rows:repeat(4,auto)!important;align-items:start!important;gap:14px!important;margin:0 auto!important;padding:14px 0 65px!important;} #app .ds-profile .artist-profile-grid>.artist-profile-left,#app .ds-profile .artist-profile-grid>.artist-profile-right{display:contents!important} #app .ds-profile .artist-profile-grid .profile-card{min-width:0!important;border-radius:16px!important;padding:clamp(16px,1.25vw,24px)!important;background:linear-gradient(145deg,rgba(17,22,38,.92),rgba(7,12,25,.94))!important;border:1px solid var(--ds-profile-border)!important;box-shadow:inset 0 1px rgba(238,170,228,.12),0 13px 35px rgba(0,0,0,.20)!important;overflow:hidden!important;} #app .ds-profile .profile-card-head h2{font:400 clamp(21px,1.45vw,29px)/1.16 'DM Serif Display',Georgia,serif!important;letter-spacing:-.015em!important;color:#fff!important;display:flex!important;align-items:center!important;gap:9px!important;} #app .ds-profile .profile-card-head svg{width:18px!important;height:18px!important;stroke:#f478c3!important;fill:none!important;flex-shrink:0!important;stroke-width:1.6px!important} #app .ds-profile .profile-card-head button,#app .ds-profile .profile-card-head span{color:#c0c6d7!important;background:none!important} #app .ds-profile .latest-release-panel{grid-column:1!important;grid-row:1!important} #app .ds-profile .official-history-panel{grid-column:1!important;grid-row:2/span 3!important} #app .ds-profile .official-achievements-panel{grid-column:2!important;grid-row:1!important} #app .ds-profile .artist-catalogue-panel{grid-column:2!important;grid-row:2!important} #app .ds-profile .career-highlights-panel{grid-column:2!important;grid-row:3!important} #app .ds-profile .artist-alltime-panel{grid-column:2!important;grid-row:4!important} #app .ds-profile .artist-about-panel{grid-column:3!important;grid-row:1!important} #app .ds-profile .genres-panel{grid-column:3!important;grid-row:2!important} #app .ds-profile .profile-links-panel{grid-column:3!important;grid-row:3!important} #app .ds-profile .public-debut-card{grid-column:1/3!important;grid-row:2!important} #app .ds-profile .latest-release-feature{display:grid!important;grid-template-columns:minmax(100px,35%) minmax(0,1fr)!important;gap:17px!important;align-items:center!important} #app .ds-profile .latest-release-art{width:100%!important;height:auto!important;aspect-ratio:1!important;border-radius:12px!important;box-shadow:0 8px 28px rgba(198,52,147,.16)!important} #app .ds-profile .track-title-line h3{font:400 clamp(19px,1.35vw,29px)/1.15 'DM Serif Display',Georgia,serif!important;overflow-wrap:anywhere} #app .ds-profile .latest-release-copy>strong{color:#f1eaf2!important} #app .ds-profile .profile-play-button,#app .ds-profile .profile-row-play{border:1px solid rgba(242,238,249,.6)!important;border-radius:999px!important;background:rgba(12,18,34,.68)!important;color:#fff!important;min-width:44px!important;min-height:44px!important;box-shadow:none!important} #app .ds-profile .artist-catalogue-row{border-bottom:1px solid rgba(215,205,241,.10)!important;border-radius:4px!important;gap:8px!important;min-width:0!important} #app .ds-profile .artist-catalogue-row:hover{background:rgba(240,70,168,.09)!important} #app .ds-profile .artist-catalogue-row .catalogue-main{min-width:0!important} #app .ds-profile .artist-catalogue-row .catalogue-main strong{white-space:normal!important;overflow-wrap:anywhere!important} #app .ds-profile .save-mini{min-width:44px!important;min-height:44px!important;color:#f4eaf4!important;background:rgba(12,18,34,.4)!important;border-color:rgba(245,226,244,.28)!important} #app .ds-profile .save-mini.active{color:#F046A8!important;border-color:#F046A8!important;background:rgba(240,70,168,.10)!important} #app .ds-profile .achievement-stat-grid.four-up{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important} #app .ds-profile .achievement-stat-grid article{min-width:0!important;min-height:115px!important;border:1px solid rgba(170,177,220,.24)!important;border-radius:11px!important;background:rgba(11,19,37,.58)!important;color:#fff!important} #app .ds-profile .achievement-stat-grid article:first-child{border-color:rgba(240,70,168,.7)!important;box-shadow:inset 0 1px rgba(240,70,168,.24),0 4px 20px rgba(240,70,168,.07)} #app .ds-profile .achievement-stat-grid article b{color:#fff!important;font:600 clamp(23px,2vw,36px)/1.1 Inter,Arial,sans-serif!important} #app .ds-profile .achievement-stat-grid article small{font-size:11px!important;line-height:1.25!important;color:#d2cee0!important;text-align:center} #app .ds-profile .official-history-panel{overflow-x:hidden!important} #app .ds-profile .official-history-table{max-width:100%;overflow-x:auto!important;scrollbar-color:#56546c #0c101c!important;} #app .ds-profile .history-table-head,#app .ds-profile .history-table-row{grid-template-columns:minmax(100px,1.3fr) minmax(48px,.5fr) minmax(53px,.5fr) minmax(75px,.8fr) minmax(270px,2fr)!important;gap:7px!important;min-width:575px!important;} #app .ds-profile .history-table-head{font-size:10px!important} #app .ds-profile .history-table-head>span:nth-child(n+5){display:none!important} #app .ds-profile .history-table-row>.history-official-totals{display:grid!important;grid-column:5!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:4px!important;font-size:11px!important} #app .ds-profile .history-table-row>.history-official-totals span{display:flex!important;flex-direction:column!important;gap:2px!important} #app .ds-profile .history-table-row b{color:#f1e5f5!important} #app .ds-profile .profile-links-panel>button{background:rgba(11,17,30,.7)!important;border:1px solid rgba(225,211,236,.3)!important;border-radius:999px!important;min-height:44px!important;color:#fff!important;} #app .ds-profile .artist-about-panel p{line-height:1.55!important;color:#d5d2e0!important;overflow-wrap:anywhere!important} #app .ds-profile :is(button,[role=button],a):focus-visible{outline:3px solid #fff!important;outline-offset:3px!important} #app .ds-profile *{scrollbar-width:thin;scrollbar-color:#514260 #090c16} /* New artist and image-less states use the real production empty-state content. */ #app .ds-profile .public-new-artist-grid .artist-about-panel{grid-column:3!important;grid-row:1!important} #app .ds-profile .public-new-artist-grid .genres-panel{grid-column:3!important;grid-row:2!important} #app .ds-profile .public-new-artist-grid .public-debut-card{grid-column:1/3!important;grid-row:1/span 2!important;min-height:200px} /* Maintain wide image and compact cards on medium screens. */ @media(max-width:1550px){ #app .ds-profile .artist-profile-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;} #app .ds-profile .latest-release-panel{grid-column:1!important;grid-row:1!important} #app .ds-profile .official-achievements-panel{grid-column:2!important;grid-row:1!important} #app .ds-profile .official-history-panel{grid-column:1!important;grid-row:2/span 2!important} #app .ds-profile .artist-catalogue-panel{grid-column:2!important;grid-row:2!important} #app .ds-profile .career-highlights-panel{grid-column:2!important;grid-row:3!important} #app .ds-profile .artist-about-panel{grid-column:1!important;grid-row:4!important} #app .ds-profile .genres-panel{grid-column:2!important;grid-row:4!important} #app .ds-profile .profile-links-panel{grid-column:2!important;grid-row:5!important} #app .ds-profile .artist-alltime-panel{grid-column:1!important;grid-row:5!important} #app .ds-profile .public-debut-card{grid-column:1!important;grid-row:1!important} #app .ds-profile .public-new-artist-grid .artist-about-panel{grid-column:2!important;grid-row:1!important} #app .ds-profile .public-new-artist-grid .genres-panel{grid-column:1!important;grid-row:2!important} #app .ds-profile .public-new-artist-grid .profile-links-panel{grid-column:2!important;grid-row:2!important} #app .ds-profile .artist-hero-main{max-width:63%!important;padding-bottom:100px!important} #app .ds-profile .artist-hero-stats{flex-basis:38%!important} } @media(max-width:1050px){ #app .ds-profile .artist-profile-stage,#app .ds-profile .artist-hero-v2{height:640px!important;min-height:640px!important} #app .ds-profile .artist-hero-main{max-width:64%!important;padding-bottom:130px!important} #app .ds-profile .artist-hero-stats{position:absolute!important;right:0!important;bottom:22px!important;width:min(460px,100%)!important;margin:0!important;} #app .ds-profile .ds-profile-hero-image{width:78%!important} #app .ds-profile .share-guest-invitation{grid-template-columns:minmax(0,1fr)!important;} #app .ds-profile .share-guest-actions{grid-column:1!important;grid-row:4!important} #app .ds-profile .artist-profile-grid{grid-template-columns:1fr!important;display:flex!important;flex-direction:column!important;align-items:stretch!important} #app .ds-profile .artist-profile-grid>.ds-profile-col-source{display:contents!important} #app .ds-profile .artist-profile-grid .profile-card{width:100%!important;grid-column:auto!important;grid-row:auto!important} #app .ds-profile .latest-release-panel{order:1!important}#app .ds-profile .official-achievements-panel{order:2!important}#app .ds-profile .official-history-panel{order:3!important}#app .ds-profile .artist-catalogue-panel{order:4!important}#app .ds-profile .career-highlights-panel{order:5!important}#app .ds-profile .artist-alltime-panel{order:6!important}#app .ds-profile .artist-about-panel{order:7!important}#app .ds-profile .genres-panel{order:8!important}#app .ds-profile .profile-links-panel{order:9!important}#app .ds-profile .public-debut-card{order:1!important} } @media(max-width:620px){ #app .ds-profile .artist-profile-stage,#app .ds-profile .artist-hero-v2{height:570px!important;min-height:570px!important} /* RC2.68b: exceptionally long names require extra room for the existing absolute-positioned content. */ #app .artist-profile-page.ds-profile:has(.artist-name-line.ds-profile-name-long) .artist-profile-stage,#app .artist-profile-page.ds-profile:has(.artist-name-line.ds-profile-name-long) .artist-hero-v2{height:655px!important;min-height:655px!important} #app .artist-profile-page.ds-profile:has(.artist-name-line.ds-profile-name-very-long) .artist-profile-stage,#app .artist-profile-page.ds-profile:has(.artist-name-line.ds-profile-name-very-long) .artist-hero-v2{height:810px!important;min-height:810px!important} /* Debut-pending panel sits below the share action rather than covering it. */ #app .artist-profile-page.ds-profile:has(.artist-debut-pending):not(:has(.artist-name-line.ds-profile-name-very-long)) .artist-profile-stage,#app .artist-profile-page.ds-profile:has(.artist-debut-pending):not(:has(.artist-name-line.ds-profile-name-very-long)) .artist-hero-v2{height:690px!important;min-height:690px!important} #app .ds-profile .artist-hero-shell{padding:0 23px!important} #app .ds-profile .artist-back-link{left:23px!important;top:calc(var(--ds-fixed-header-height) + 8px)!important} #app .ds-profile .ds-profile-hero-image{width:100%!important;right:-23px!important;height:480px!important;top:0!important;border-radius:0!important;} #app .ds-profile .ds-profile-hero-image img{object-position:60% 12%!important;} #app .ds-profile .artist-profile-stage:after{background:linear-gradient(0deg,#070911 0%,rgba(7,9,17,.93) 18%,rgba(7,9,17,.12) 65%),linear-gradient(90deg,rgba(7,9,17,.20),transparent 60%)!important} #app .ds-profile .artist-hero-main{position:absolute!important;left:0!important;right:0!important;top:300px!important;max-width:100%!important;padding:0!important;margin:0!important;background:none!important;} #app .ds-profile .artist-name-line{gap:9px!important;margin-top:6px!important} #app .ds-profile .artist-name-line h1{font-size:clamp(43px,11vw,61px)!important;letter-spacing:-.03em!important} #app .ds-profile .artist-no1-badge{width:54px!important;height:54px!important} #app .ds-profile .artist-hero-tagline{font-size:16px!important;margin:10px 0!important;line-height:1.32!important} #app .ds-profile .artist-genre-chips span{padding:5px 9px!important;font-size:11px!important} #app .ds-profile .artist-hero-actions{display:grid!important;grid-template-columns:1fr auto!important;gap:8px!important;margin-top:14px!important;} #app .ds-profile .artist-hero-actions .artist-play-latest{min-height:48px!important;padding:9px 11px!important;font-size:12px!important;overflow-wrap:anywhere} #app .ds-profile .artist-hero-actions .hero-share{min-height:48px!important;padding:8px 12px!important;font-size:12px!important} #app .ds-profile .artist-hero-stats{position:absolute!important;left:0!important;right:0!important;bottom:12px!important;width:100%!important;flex-basis:auto!important;margin:0!important;padding:11px 4px!important;border-radius:12px!important;} #app .ds-profile .artist-hero-stats b{font-size:18px!important} #app .ds-profile .artist-hero-stats small{font-size:10px!important} #app .ds-profile .share-artist-guest{width:calc(100% - 28px)!important;margin-top:10px!important} #app .ds-profile .share-guest-invitation{padding:15px!important;gap:10px!important} #app .ds-profile .share-guest-actions{display:flex!important;flex-direction:column!important;align-items:stretch!important} #app .ds-profile .artist-profile-grid{width:calc(100% - 28px)!important;gap:11px!important;padding-top:11px!important;} #app .ds-profile .artist-profile-grid .profile-card{padding:15px!important} #app .ds-profile .latest-release-feature{grid-template-columns:108px minmax(0,1fr)!important;gap:11px!important} #app .ds-profile .achievement-stat-grid.four-up{grid-template-columns:repeat(2,minmax(0,1fr))!important} #app .ds-profile .artist-catalogue-row .catalogue-main{grid-template-columns:44px minmax(0,1fr)!important;gap:7px!important} #app .ds-profile .artist-catalogue-row .catalogue-main em{grid-column:2!important} #app .ds-profile .history-table-head{display:none!important} #app .ds-profile .history-table-row{min-width:0!important;grid-template-columns:minmax(0,1fr) repeat(2,minmax(55px,.5fr))!important;gap:6px!important} #app .ds-profile .history-table-row>.history-song-title{grid-column:1/-1!important} #app .ds-profile .history-table-row>.history-official-totals{grid-column:1/-1!important;grid-row:auto!important;grid-template-columns:repeat(4,minmax(0,1fr))!important} #app .ds-profile .history-table-row>.history-official-totals small{display:block!important} #app .ds-profile .official-history-table{overflow:visible!important} } @media(prefers-reduced-motion:reduce){#app .ds-profile *,#app .ds-header.ds-profile-hero-header,#app .ds-header.ds-profile-hero-header::before,#app .ds-header.ds-profile-hero-header::after{transition:none!important;animation:none!important}} /* Specificity against B1.2 header slot reservation: artist hero begins at y=0. */ #app>.shell:has(>.app-header.ds-header):has(.ds-profile){padding-top:0!important} /* QA refinements: no photographic seam, true edge-to-edge phone artwork. */ #app .ds-profile .ds-profile-hero-image{-webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.42) 11%,#000 31%);mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.42) 11%,#000 31%)} #app .ds-profile .ds-profile-hero-image img{object-position:60% 34%!important;} /* The existing real Chart History has EIGHT headers, not five. */ #app .ds-profile .history-table-head{display:grid!important;grid-template-columns:minmax(105px,1.25fr) 45px 45px 75px repeat(4,minmax(42px,.45fr))!important;min-width:530px!important;gap:6px!important;} #app .ds-profile .history-table-head>span:nth-child(n+5){display:block!important} #app .ds-profile .history-table-row{grid-template-columns:minmax(105px,1.25fr) 45px 45px 75px minmax(178px,1.8fr)!important;min-width:530px!important;gap:6px!important} @media(max-width:620px){ #app .ds-profile .ds-profile-hero-image{left:-23px!important;right:-23px!important;width:calc(100% + 46px)!important;height:480px!important;-webkit-mask-image:none!important;mask-image:none!important} #app .ds-profile .ds-profile-hero-image img{object-position:60% 12%!important} #app .ds-profile .history-table-row{min-width:0!important;grid-template-columns:minmax(0,1fr) repeat(2,minmax(55px,.5fr))!important} #app .ds-profile .history-table-head{display:none!important} } /* Consistent subtle line icons above each real hero figure. */ #app .ds-profile .artist-hero-stats span>svg{display:block!important;width:18px!important;height:18px!important;margin:0 auto 2px!important;fill:none!important;stroke:var(--ds-profile-pink)!important;stroke-width:1.6!important;stroke-linecap:round!important;stroke-linejoin:round!important} #app .ds-profile .artist-hero-stats span:nth-child(2)>svg{stroke:#92cffa!important} #app .ds-profile .artist-hero-stats span:nth-child(3)>svg{stroke:#f08ec7!important} #app .ds-profile .artist-hero-stats span:nth-child(4)>svg{stroke:#b6bde6!important} /* Distinct glass statistic tiles, with the source values and labels unchanged. */ #app .ds-profile .artist-hero-stats:not(.artist-debut-pending){background:transparent!important;border:0!important;padding:0!important;gap:7px!important;box-shadow:none!important;backdrop-filter:none!important} #app .ds-profile .artist-hero-stats:not(.artist-debut-pending)>span{border:1px solid rgba(223,200,241,.28)!important;border-radius:11px!important;background:linear-gradient(155deg,rgba(25,21,42,.78),rgba(9,15,28,.61))!important;backdrop-filter:blur(12px);padding:12px 5px!important;box-shadow:inset 0 1px rgba(255,255,255,.08),0 8px 20px rgba(0,0,0,.15)} @media(max-width:620px){#app .ds-profile .artist-hero-stats:not(.artist-debut-pending){gap:5px!important}#app .ds-profile .artist-hero-stats:not(.artist-debut-pending)>span{padding:9px 3px!important}} /* Card columns stack independently (same source cards; no ghost grid rows). */ @media(min-width:1051px){ #app .ds-profile .artist-profile-grid{grid-template-rows:none!important;align-items:start!important} #app .ds-profile .artist-profile-grid>.artist-profile-left,#app .ds-profile .artist-profile-grid>.artist-profile-right,#app .ds-profile .artist-profile-grid>.ds-profile-middle{display:flex!important;flex-direction:column!important;gap:14px!important;align-items:stretch!important;min-width:0!important;align-self:start!important} #app .ds-profile .artist-profile-grid>.artist-profile-left{grid-column:1!important;grid-row:1!important} #app .ds-profile .artist-profile-grid>.ds-profile-middle{grid-column:2!important;grid-row:1!important} #app .ds-profile .artist-profile-grid>.artist-profile-right{grid-column:3!important;grid-row:1!important} #app .ds-profile .artist-profile-grid .profile-card{grid-column:auto!important;grid-row:auto!important;min-height:0!important} #app .ds-profile .artist-profile-grid.public-new-artist-grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)!important} #app .ds-profile .artist-profile-grid.public-new-artist-grid>.artist-profile-right{grid-column:2!important} } #app .ds-profile .artist-about-panel{position:relative!important;min-height:195px!important;isolation:isolate;} #app .ds-profile .artist-about-panel .ds-profile-about-photo{position:absolute!important;z-index:-1!important;right:0!important;bottom:0!important;top:0!important;width:43%!important;height:100%!important;object-fit:cover!important;object-position:center 27%!important;opacity:.74!important;-webkit-mask-image:linear-gradient(to right,transparent,#000 60%);mask-image:linear-gradient(to right,transparent,#000 60%);} #app .ds-profile .artist-about-panel:has(.ds-profile-about-photo) p{max-width:70%!important;position:relative;z-index:1;text-shadow:0 2px 10px rgba(0,0,0,.7)} #app .ds-profile.ds-profile-no-photo .artist-about-panel .ds-profile-about-photo{display:none!important} @media(max-width:1050px){ #app .ds-profile .artist-profile-grid>.artist-profile-left,#app .ds-profile .artist-profile-grid>.artist-profile-right,#app .ds-profile .artist-profile-grid>.ds-profile-middle{display:contents!important} #app .ds-profile .artist-profile-grid .profile-card{order:inherit} #app .ds-profile .artist-profile-grid .latest-release-panel{order:1!important} #app .ds-profile .artist-profile-grid .official-achievements-panel{order:2!important} #app .ds-profile .artist-profile-grid .official-history-panel{order:3!important} #app .ds-profile .artist-profile-grid .artist-catalogue-panel{order:4!important} #app .ds-profile .artist-profile-grid .career-highlights-panel{order:5!important} #app .ds-profile .artist-profile-grid .artist-alltime-panel{order:6!important} #app .ds-profile .artist-profile-grid .artist-about-panel{order:7!important} #app .ds-profile .artist-profile-grid .genres-panel{order:8!important} #app .ds-profile .artist-profile-grid .profile-links-panel{order:9!important} #app .ds-profile .artist-profile-grid .public-debut-card{order:1!important} } /* Between 1051px and 1550px, never create an implicit narrow third column. */ @media(min-width:1051px) and (max-width:1550px){ #app .ds-profile .artist-profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:auto auto!important} #app .ds-profile .artist-profile-grid>.artist-profile-left{grid-column:1!important;grid-row:1!important} #app .ds-profile .artist-profile-grid>.ds-profile-middle{grid-column:2!important;grid-row:1!important} #app .ds-profile .artist-profile-grid>.artist-profile-right{grid-column:1/-1!important;grid-row:2!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;align-items:start!important;gap:14px!important} #app .ds-profile .artist-profile-grid.public-new-artist-grid>.artist-profile-right{grid-column:2!important;grid-row:1!important;display:flex!important} } /* Source song names wrap in all profile surfaces, never slice at mid-word. */ #app .ds-profile .latest-release-title-line h3,#app .ds-profile .artist-catalogue-row strong{white-space:normal!important;overflow-wrap:break-word!important;word-break:normal!important;overflow:visible!important;text-overflow:clip!important} /* DS1-B2.1 approved profile corrections (hero size, framing, statistics unchanged). */ @media (min-width:621px){ #app .ds-profile .artist-hero-main{ align-self:flex-start!important; padding-top:calc(var(--ds-fixed-header-height) + 61px)!important; padding-bottom:0!important; } } #app .ds-profile .artist-name-line{align-items:center!important;row-gap:13px!important;margin-bottom:9px!important} #app .ds-profile .artist-name-line h1{line-height:1.085!important;padding-bottom:.09em!important;overflow:visible!important} #app .ds-profile .artist-hero-tagline{margin:11px 0 18px!important;line-height:1.4!important} #app .ds-profile .artist-genre-chips{margin-top:14px!important;row-gap:9px!important} #app .ds-profile .artist-hero-main>.eyebrow{ text-shadow:0 2px 5px #070911,0 3px 14px rgba(0,0,0,.95)!important; } #app .ds-profile .artist-back-link{ text-shadow:0 1px 5px #050612,0 2px 14px rgba(0,0,0,.95)!important; filter:drop-shadow(0 2px 7px rgba(0,0,0,.78))!important; } @media(max-width:620px){ #app .ds-profile .artist-hero-main{padding-top:0!important} #app .ds-profile .artist-name-line{row-gap:8px!important;margin-bottom:7px!important} #app .ds-profile .artist-hero-tagline{margin:10px 0 11px!important} #app .ds-profile .artist-genre-chips{margin-top:9px!important} #app .ds-profile .artist-hero-main>.eyebrow{display:table!important;padding:2px 8px 2px 0!important;background:linear-gradient(90deg,rgba(3,5,12,.38),transparent)!important} #app .ds-profile .artist-back-link{background:linear-gradient(90deg,rgba(3,5,12,.28),transparent)!important;border-radius:3px!important} } /* DS1-B2.2 / RC2.48 — approved owner amendment: desktop-only hero composition. Source/DOM order remains hero copy then hero stats. At <=620px the baseline rules are intentionally unaffected. No change to photo, hero height, or back link. */ @media (min-width:621px){ #app .ds-profile .artist-hero-v2{ display:flex!important; flex-direction:column!important; align-items:flex-start!important; justify-content:flex-start!important; gap:0!important; } #app .ds-profile .artist-hero-main{ position:relative!important; align-self:flex-start!important; flex:0 0 auto!important; width:min(860px,63%)!important; max-width:63%!important; padding-top:calc(var(--ds-fixed-header-height) + 85px)!important; padding-bottom:0!important; } #app .ds-profile .artist-hero-stats{ position:relative!important; align-self:flex-start!important; flex:0 0 auto!important; left:auto!important; right:auto!important; top:auto!important; bottom:auto!important; width:min(560px,63%)!important; max-width:63%!important; margin:auto 0!important; } #app .ds-profile .artist-debut-pending{ flex-basis:auto!important; width:min(400px,63%)!important; } } @media (min-width:621px) and (max-width:1250px){ #app .ds-profile .artist-hero-main{width:63%!important;max-width:63%!important;} #app .ds-profile .artist-hero-stats{width:min(460px,63%)!important;max-width:63%!important;} } /* Only names requiring multiple lines receive responsive optical sizing. Short names keep the signed-off large display treatment. */ @media (min-width:621px){ #app .ds-profile .artist-name-line.ds-profile-name-long h1{font-size:clamp(35px,3.25vw,70px)!important;line-height:1.08!important;} #app .ds-profile .artist-name-line.ds-profile-name-very-long h1{font-size:clamp(29px,2.45vw,52px)!important;line-height:1.08!important;} } /* RC2.49: saved public framing; legacy breakpoint crops remain when no focal data. */ #app .ds-profile .ds-profile-hero-image.ds-profile-saved-framing img{object-position:var(--ds-profile-desktop-pos)!important} @media(max-width:620px){#app .ds-profile .ds-profile-hero-image.ds-profile-saved-framing img{object-position:var(--ds-profile-mobile-pos)!important}} /* RC2.56 — only the private Manager hero shares the production profile system. Public profile markup/classes and header scroll implementation remain canonical. */ #app .ds-manager-profile.manager-page{padding:0 0 112px!important;overflow:clip!important;max-width:none!important} #app .ds-manager-profile .artist-profile-stage{height:auto!important;min-height:690px!important;overflow:visible!important} #app .ds-manager-profile .artist-hero-shell{min-height:inherit!important} #app .ds-manager-profile .artist-hero-v2{height:auto!important;min-height:690px!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important} #app .ds-manager-profile .artist-hero-main{width:min(860px,67%)!important;max-width:67%!important;padding-top:calc(var(--ds-fixed-header-height) + 76px)!important;padding-bottom:34px!important;align-self:flex-start!important;flex:0 0 auto!important} #app .ds-manager-profile .artist-name-line h1{overflow-wrap:anywhere!important} #app .ds-manager-profile .manager-owner-actions{display:flex!important;gap:9px!important;margin-top:17px!important} #app .ds-manager-profile .manager-owner-actions button{min-height:44px!important;padding:10px 14px!important;border-radius:999px!important;white-space:normal!important;line-height:1.3!important;font:600 13px/1.3 Inter,Arial,sans-serif!important;flex:none!important} #app .ds-manager-profile .manager-owner-actions .primary-cta{background:#f046a8!important;color:#101016!important;border:1px solid #fa77bd!important} #app .ds-manager-profile .manager-owner-actions .hero-share{display:inline-flex!important;align-items:center!important;background:rgba(8,13,24,.55)!important;border:1px solid rgba(247,238,254,.65)!important;color:#fff!important;box-shadow:none!important} #app .ds-manager-profile .manager-owner-totals.artist-hero-stats{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:0!important;width:min(560px,100%)!important;max-width:100%!important;margin:18px 0 0!important;padding:12px 8px!important;align-self:flex-start!important} #app .ds-manager-profile .manager-owner-totals.artist-debut-pending{display:flex!important;width:min(400px,100%)!important} #app .ds-manager-profile .manager-owner-totals small{font-size:12px!important} #app .ds-manager-profile .manager-hero-tools{display:flex;flex-wrap:wrap;align-items:center;gap:12px;max-width:100%;margin-top:12px} #app .ds-manager-profile .manager-hero-tools .manager-artist-picker{flex:0 1 250px} #app .ds-manager-profile .manager-hero-tools .manager-credits{min-height:44px;min-width:175px;padding:7px 12px;text-align:left;background:rgba(8,13,24,.68);border-color:rgba(247,238,254,.42)} #app .ds-manager-profile .manager-hero-tools .manager-credits strong{font-size:17px} #app .ds-manager-profile .manager-profile-body{position:relative;z-index:3;max-width:1450px;width:calc(100% - 32px);margin:0 auto;padding:18px 0 32px;display:block} #app .ds-manager-profile .manager-profile-body .mkpi-tabs{display:flex!important;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;max-width:100%;scrollbar-width:thin;gap:2px;margin-bottom:14px;position:relative;top:auto} #app .ds-manager-profile .manager-profile-body .mkpi-tabs>button{flex:1 0 auto;min-height:44px;white-space:nowrap} #app .ds-manager-profile .mkpi-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important} #app .ds-manager-profile .mkpi-tile{display:flex;flex-direction:column;min-width:0} #app .ds-manager-profile .mkpi-label{order:0;margin-bottom:10px} #app .ds-manager-profile .mkpi-value{order:1} #app .ds-manager-profile .mkpi-comparison{order:2} #app .ds-manager-profile .manager-profile-career{margin-top:14px} #app .ds-manager-profile .manager-album-soon{color:#bbc0d2;font-size:12px!important;margin-top:5px} #app .ds-manager-profile .manager-profile-career .manager-hero-next{margin-top:16px;padding-top:17px;border-top:1px solid rgba(215,200,240,.15)} #app .ds-manager-profile .manager-profile-overview-lower{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;margin-top:14px;align-items:start} #app .ds-manager-profile .mkpi-latest-feature{min-width:0} #app .ds-manager-profile .mkpi-feature-row{align-items:center!important;min-height:0!important;grid-template-columns:clamp(100px,13vw,175px) minmax(0,1fr)!important} #app .ds-manager-profile .mkpi-release-copy{align-self:center!important;max-width:100%} #app .ds-manager-profile .manager-messages-panel{min-width:0;contain:none!important;height:auto!important} #app .ds-manager-profile .manager-depth-panel .manager-heading:not(:first-child){margin-top:24px} #app .ds-manager-profile .manager-depth-table{max-width:100%;overflow-x:auto;scrollbar-width:thin} #app .ds-manager-profile .manager-depth-row{display:grid;grid-template-columns:minmax(140px,2fr) repeat(4,minmax(65px,.75fr)) repeat(3,minmax(76px,.9fr));gap:8px;align-items:center;min-width:760px;padding:12px 10px;border-bottom:1px solid rgba(215,210,238,.12);color:#f0eef6;font-size:12px} #app .ds-manager-profile .manager-depth-row>span{text-align:right;font-variant-numeric:tabular-nums} #app .ds-manager-profile .manager-depth-row>strong{font-size:13px;overflow-wrap:anywhere} #app .ds-manager-profile .manager-depth-head{font-weight:700;background:rgba(30,35,55,.68)} #app .ds-manager-profile .manager-depth-table>p{padding:15px;color:#cbd1df} #app .ds-manager-profile :is(button,[role="button"],a):focus-visible{outline:3px solid #fff!important;outline-offset:3px!important} /* Public showcase history now has precisely four columns, with no abandoned totals gutter. */ #app .ds-profile:not(.ds-manager-profile) .official-history-panel .history-table-head, #app .ds-profile:not(.ds-manager-profile) .official-history-panel .history-table-row{grid-template-columns:minmax(120px,1.8fr) minmax(60px,.6fr) minmax(65px,.7fr) minmax(92px,.9fr)!important;min-width:0!important;gap:9px!important} #app .ds-profile:not(.ds-manager-profile) .official-history-panel .history-table-row>.history-official-totals{display:none!important} #app .ds-profile:not(.ds-manager-profile) .latest-release-copy>strong{display:none!important} #app .ds-profile:not(.ds-manager-profile) .artist-catalogue-row .catalogue-main>em{display:none!important} #app .ds-profile:not(.ds-manager-profile) .public-new-artist-grid .public-debut-card{min-height:175px!important} @media(max-width:1100px){ #app .ds-manager-profile .artist-hero-main{width:75%!important;max-width:75%!important} #app .ds-manager-profile .mkpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important} } @media(max-width:768px){ #app .ds-manager-profile .artist-profile-stage,#app .ds-manager-profile .artist-hero-v2{min-height:0!important} #app .ds-manager-profile .artist-hero-main{width:100%!important;max-width:100%!important;min-width:0!important} #app .ds-manager-profile .manager-profile-overview-lower{grid-template-columns:minmax(0,1fr)} #app .ds-manager-profile .manager-profile-body{width:calc(100% - 24px);padding:12px 0 38px} } @media(max-width:620px){ #app .ds-manager-profile .artist-hero-v2{display:flex!important;flex-direction:column!important;min-height:0!important;height:auto!important} #app .ds-manager-profile .artist-hero-main{padding:0 17px 26px!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important} #app .ds-manager-profile .artist-profile-stage{height:auto!important} #app .ds-manager-profile .manager-owner-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important} #app .ds-manager-profile .manager-owner-actions button{min-width:0!important;white-space:normal!important;min-height:44px!important} #app .ds-manager-profile .manager-owner-actions button:first-child{grid-column:1/-1} #app .ds-manager-profile .manager-owner-totals.artist-hero-stats{width:100%!important;max-width:100%!important;margin-top:12px!important} #app .ds-manager-profile .manager-hero-tools{flex-direction:column;align-items:stretch} #app .ds-manager-profile .manager-hero-tools .manager-artist-picker{flex:auto;width:100%} #app .ds-manager-profile .manager-hero-tools .manager-credits{width:100%!important} #app .ds-manager-profile .manager-profile-body .mkpi-tabs{gap:0!important;overflow-x:auto!important} #app .ds-manager-profile .manager-profile-body .mkpi-tabs>button{padding:9px 7px!important;min-width:0!important;font-size:12px!important;min-height:44px!important} #app .ds-manager-profile .manager-milestones{overflow-x:auto!important;grid-template-columns:repeat(7,minmax(88px,1fr))!important} #app .ds-manager-profile .mkpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important} #app .ds-manager-profile .mkpi-feature-row{grid-template-columns:110px minmax(0,1fr)!important;gap:12px} } /* Keep the taller owner hero in normal flow at all breakpoints; the public profile deliberately retains its original absolutely positioned phone copy. */ #app .ds-manager-profile .manager-owner-totals.artist-hero-stats{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important} @media(max-width:620px){ #app .ds-manager-profile .artist-hero-main{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;margin:300px 0 0!important;z-index:3!important} #app .ds-manager-profile .manager-owner-totals.artist-hero-stats{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;margin:12px 0 0!important} #app .ds-manager-profile .artist-profile-stage{min-height:0!important;height:auto!important} #app .ds-manager-profile .artist-hero-v2{min-height:0!important;height:auto!important} } /* Manager weekly performance is visually explicit and order-stable, including when the optional legacy manager stylesheet is absent from an off-server pack. */ #app .ds-manager-profile .mkpi-panel{padding:22px;border:1px solid rgba(203,189,234,.2);border-radius:18px;background:linear-gradient(145deg,#111728,#080d1b)} #app .ds-manager-profile .mkpi-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:15px} #app .ds-manager-profile .mkpi-heading h2{color:#f8f3fc;margin:0;font:400 clamp(23px,2vw,32px)/1.2 'DM Serif Display',Georgia,serif} #app .ds-manager-profile .mkpi-heading>div{display:flex;align-items:center;gap:14px} #app .ds-manager-profile .mkpi-heading .mkpi-live{font-size:11px;letter-spacing:.13em;color:#f3c3e0} #app .ds-manager-profile .mkpi-heading .mkpi-clock{margin:0;font-size:12px;color:#c9c3d5} #app .ds-manager-profile .mkpi-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important;min-width:0} #app .ds-manager-profile .mkpi-tile{display:flex!important;flex-direction:column!important;padding:16px!important;gap:6px!important;min-width:0;border:1px solid rgba(215,211,235,.18);border-radius:12px;background:rgba(15,20,35,.88);color:#fff} #app .ds-manager-profile .mkpi-tile .mkpi-label{display:flex!important;align-items:center;gap:6px;order:-2!important;font-size:12px!important;color:#e5ddec!important;line-height:1.3} #app .ds-manager-profile .mkpi-tile .mkpi-value{order:-1!important;font-size:clamp(22px,2.3vw,38px)!important;font-weight:700;line-height:1.2;min-width:0} #app .ds-manager-profile .mkpi-tile .mkpi-comparison{font-size:12px!important;color:#b9c1d2;order:0!important} #app .ds-manager-profile .mkpi-tile svg{flex:none} #app .ds-manager-profile .mkpi-tile .mkpi-position-delta{font-size:12px;margin-left:6px;vertical-align:middle} #app .ds-manager-profile .mkpi-chips{margin-top:12px} #app .ds-manager-profile .mkpi-first{padding:10px 0 16px;color:#e4e0ef} #app .ds-manager-profile .mkpi-first h3{margin:6px 0} #app .ds-manager-profile .manager-profile-body .mkpi-tabs{display:flex!important;background:rgba(10,15,28,.92);border-radius:13px;border:1px solid rgba(215,200,240,.2);padding:5px} #app .ds-manager-profile .manager-profile-body .mkpi-tabs button{color:#f0eaf8;border:0;background:transparent;border-radius:9px;padding:10px 15px;min-height:44px;font-size:13px;cursor:pointer} #app .ds-manager-profile .manager-profile-body .mkpi-tabs button.is-active{background:#4a214e;color:#fff} #app .ds-manager-profile .manager-profile-body [data-manager-panel][hidden]{display:none!important} @media(max-width:1100px){#app .ds-manager-profile .mkpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}} @media(max-width:430px){#app .ds-manager-profile .mkpi-panel{padding:14px}#app .ds-manager-profile .mkpi-tile{padding:12px!important}} /* Public hero can use the recovered vertical space previously taken by totals. */ @media(min-width:621px){#app .ds-profile:not(.ds-manager-profile) .artist-profile-stage,#app .ds-profile:not(.ds-manager-profile) .artist-hero-v2{height:clamp(560px,35vw,680px)!important;min-height:clamp(560px,35vw,680px)!important}} /* RC2.56 R1: keep existing Artist DNA/Studio refresh prompt in Overview. */ #app .ds-manager-profile .manager-profile-overview-left{display:flex;flex-direction:column;min-width:0;gap:14px} #app .ds-manager-profile .manager-profile-overview-left>.manager-card{min-width:0} #app .ds-manager-profile .manager-profile-overview-left .manager-dna button{min-height:44px} #app .ds-manager-profile .manager-depth-panel .manager-heading>small{display:block;color:#c6c5d5;font-size:12px;line-height:1.5} /* RC2.56 R1 accessibility: preserve the existing help controls at a phone-sized hit target. */ #app .ds-manager-profile .mkpi-panel > .mkpi-grid .mkpi-tile .mkpi-info{flex:0 0 44px!important;width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important;margin:-8px -5px -8px 0!important;display:grid!important;place-items:center!important} #app .ds-profile .artist-genre-chips>span{font-size:12px!important} #app .ds-profile:not(.ds-manager-profile) .achievement-stat-grid small{font-size:12px!important} /* RC2.56 R1: public-profile reading and activation sizes. */ #app .ds-profile:not(.ds-manager-profile) .artist-back-link{min-height:44px!important;display:inline-flex!important;align-items:center!important} #app .ds-profile:not(.ds-manager-profile) .official-history-head button{min-height:44px!important;display:inline-flex!important;align-items:center!important} #app .ds-profile:not(.ds-manager-profile) .official-history-panel .history-table-head>span{font-size:12px!important} /* RC2.56 R2 — DEC-73: align private Manager body with the artist hero's established responsive page-shell inset; never affect public profiles. */ #app .ds-manager-profile.manager-page .manager-profile-body{ width:calc(100% - 2 * clamp(23px,4.7vw,114px))!important; max-width:none!important; margin-inline:auto!important; } @media(max-width:620px){ /* The profile hero has 23px shell inset plus 17px inner text padding. */ #app .ds-manager-profile.manager-page .manager-profile-body{ width:calc(100% - 80px)!important; } } /* DEC-109 RC2.59: signed-in artist shell only. Production landing / public profile untouched. */ #app .ns-signed-in-shell .ns-app-header{position:sticky!important;top:0!important;z-index:200!important;background:rgba(7,10,20,.97)!important;box-shadow:0 12px 25px -16px #02040c!important;backdrop-filter:blur(16px)} #app .ns-signed-in-shell .ns-app-header::after{content:"";position:absolute;top:100%;left:0;right:0;height:18px;pointer-events:none;background:linear-gradient(to bottom,rgba(5,8,17,.7),transparent)} #app .ns-signed-in-shell .ns-app-header .ds-primary-nav{display:none!important} #app .ns-signed-in-shell .ns-header-balance{border:0;background:transparent;display:flex;flex-direction:column;text-align:right;justify-content:center;min-height:44px;padding:2px 10px;color:#fff;gap:0;white-space:nowrap} #app .ns-signed-in-shell .ns-header-balance small{font-size:12px;color:#d8d3e6} #app .ns-signed-in-shell .ns-header-balance strong{font-size:14px} #app .ns-signed-in-shell .ns-shell-manager{background:#070b18!important;--atmo-image:none!important} #app .ns-signed-in-shell .ns-compact-hero.artist-profile-stage{height:auto!important;min-height:0!important;max-height:none!important;padding:0!important;margin:0!important;isolation:isolate} #app .ns-signed-in-shell .ns-compact-hero .artist-hero-shell{width:calc(100% - 2 * clamp(23px,4.7vw,114px))!important;max-width:none!important;padding:0!important;margin:auto!important} #app .ns-signed-in-shell .ns-compact-hero .artist-hero-v2{min-height:0!important;height:auto!important;max-height:none!important;padding:26px 0 18px!important;display:block!important} #app .ns-signed-in-shell .ns-compact-hero .artist-hero-portrait{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:.36;pointer-events:none} #app .ns-signed-in-shell .ns-compact-hero .artist-hero-main{position:relative!important;inset:auto!important;width:100%!important;max-width:none!important;min-height:0!important;padding:0!important;transform:none!important;text-align:left!important} #app .ns-signed-in-shell .ns-compact-hero .artist-hero-main h1{font-size:clamp(33px,3.5vw,60px)!important;line-height:1.1!important} #app .ns-signed-in-shell .ns-compact-hero .artist-genre-chips{position:relative!important;inset:auto!important;margin:10px 0 0!important} #app .ns-signed-in-shell .ns-shell-layout{display:grid;grid-template-columns:248px minmax(0,1fr);gap:16px;width:calc(100% - 2 * clamp(23px,4.7vw,114px));margin:0 auto 55px;max-width:none;align-items:start} #app .ns-signed-in-shell .ns-shell-layout>.ns-rail{position:sticky;top:92px;display:flex;flex-direction:column;justify-content:space-between;min-height:min(75vh,750px);padding:16px 10px;border-radius:17px;border:1px solid #373348;background:#101323;color:#f4f0fb;max-height:calc(100vh - 108px);overflow-y:auto} #app .ns-signed-in-shell .ns-rail nav{display:flex;flex-direction:column;gap:4px} #app .ns-signed-in-shell .ns-rail-link{min-height:44px;display:flex;gap:12px;align-items:center;text-align:left;width:100%;padding:10px 12px;color:#e5dff0;border:0;border-radius:10px;background:transparent;font-size:14px;cursor:pointer} #app .ns-signed-in-shell .ns-rail-link.active{background:#482445;color:#fff} #app .ns-signed-in-shell .ns-rail-link:hover{background:#30253d} #app .ns-signed-in-shell .ns-rail-link svg{width:19px;height:19px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8} #app .ns-signed-in-shell .ns-rail-group{padding:20px 12px 7px;color:#d0c6da;font-size:12px;letter-spacing:.09em} #app .ns-signed-in-shell .ns-rail-foot{margin-top:25px} #app .ns-signed-in-shell .ns-week-status{margin-top:12px;padding:14px;border:1px solid #4c4055;border-radius:12px;color:#eee;font-size:12px;display:grid;gap:5px} #app .ns-signed-in-shell .ns-week-status strong{font-size:23px;color:#fff} #app .ns-signed-in-shell .ns-week-time{color:#d2c9db} #app .ns-signed-in-shell .ns-shell-surface{min-width:0;width:100%;} #app .ns-signed-in-shell .ns-content-inner{display:flex;flex-direction:column;gap:14px;min-width:0;width:100%} #app .ns-signed-in-shell .ns-screen-heading{font:normal clamp(28px,2.5vw,38px)/1.2 'DM Serif Display',Georgia,serif;color:#fff;margin:6px 0 4px} #app .ns-signed-in-shell .ns-content-inner>.manager-card,#app .ns-signed-in-shell .ns-content-inner>.mkpi-panel{margin:0!important;width:100%!important;max-width:none!important;min-width:0} #app .ns-signed-in-shell .ns-next-step{padding:20px} #app .ns-signed-in-shell .ns-next-step .manager-hero-next{margin:0!important} #app .ns-signed-in-shell .ns-owner-totals.artist-hero-stats{position:relative!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;inset:auto!important;max-width:none!important;width:100%!important;gap:10px!important;margin:0!important} #app .ns-signed-in-shell .ns-owner-totals.artist-hero-stats>span{display:flex;flex-direction:column;gap:6px;align-items:flex-start;background:#151928;border:1px solid #403750;padding:16px;border-radius:13px;min-width:0;color:#f8f6fb} #app .ns-signed-in-shell .ns-owner-totals.artist-hero-stats b{font-size:26px} #app .ns-signed-in-shell .ns-owner-totals.artist-hero-stats small{font-size:12px;order:-1} #app .ns-signed-in-shell .ns-owner-totals.artist-hero-stats svg{width:20px;height:20px} #app .ns-signed-in-shell .ns-artist-actions{display:flex;flex-wrap:wrap;gap:9px;width:100%} #app .ns-signed-in-shell .ns-artist-actions>button{min-height:44px!important;margin:0!important} #app .ns-signed-in-shell .ns-songs-content .catalogue-board{margin:0!important} #app .ns-signed-in-shell .ns-songs-content .catalogue-progress-strip{margin:0 0 14px} #app .ns-signed-in-shell .ns-song-saves{display:flex;flex-direction:column;align-items:center;min-width:54px;color:#fff;font-size:13px} #app .ns-signed-in-shell .ns-song-saves small{font-size:12px;color:#cdd0df} #app .ns-signed-in-shell .ns-shell-chart{width:100%!important;max-width:none!important;margin:0!important;min-width:0} #app .ns-signed-in-shell .ns-shell-surface>.chart-page{width:100%!important;max-width:none!important} #app .ns-signed-in-shell button:focus-visible{outline:3px solid #fff!important;outline-offset:2px!important} @media(max-width:1099px){ #app .ns-signed-in-shell .ns-shell-layout{display:block;width:calc(100% - 32px)!important;margin:0 auto 60px} #app .ns-signed-in-shell .ns-rail{display:none!important} #app .ns-signed-in-shell .ns-compact-hero .artist-hero-shell{width:calc(100% - 32px)!important} #app .ns-signed-in-shell .ns-compact-hero .artist-hero-v2{padding:22px 0 16px!important} #app .ns-signed-in-shell .ns-content-inner>.mkpi-panel{padding:15px!important} #app .ns-signed-in-shell .ns-owner-totals.artist-hero-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important} #app .ns-signed-in-shell .ns-screen-heading{font-size:28px} #app .ns-signed-in-shell .ns-song-saves{display:none} } @media(min-width:701px){ #app .ns-signed-in-shell .ns-songs-content .catalogue-own-head, #app .ns-signed-in-shell .ns-songs-content .catalogue-own-row{grid-template-columns:110px minmax(210px,1fr) 72px 80px 80px 80px 80px!important;min-width:0} } @media(max-width:700px){ #app .ns-signed-in-shell .ns-songs-content .catalogue-own-row{grid-template-columns:minmax(0,1fr) 44px!important} } #app .ns-signed-in-shell .ns-compact-hero .artist-hero-main{margin:0!important;top:auto!important;bottom:auto!important} @media(max-width:1099px){ #app .ns-signed-in-shell .ns-compact-hero .artist-hero-main{margin:0!important} #app .ns-signed-in-shell .ns-header-balance{display:none!important} } /* RC2.59 R1: labelled stored DNA fields; crisp compact hero label. */ #app .ns-signed-in-shell .ns-dna-fields{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px} #app .ns-signed-in-shell .ns-dna-fields .ns-dna-field{min-width:0;border:1px solid #4a4257;border-radius:10px;background:#171a2a;padding:11px 13px;display:flex;flex-direction:column;gap:4px} #app .ns-signed-in-shell .ns-dna-field small{font-size:12px;color:#d7cfdf} #app .ns-signed-in-shell .ns-dna-field strong{font-size:14px;font-weight:600;color:#fff;overflow-wrap:anywhere} #app .ns-signed-in-shell .ns-compact-hero .artist-hero-main>.eyebrow{opacity:1!important;filter:none!important;text-shadow:none!important;color:#fff!important;backdrop-filter:none!important} /* RC2.60 DEC-109 phone shell navigation. Scope to signed-in artist only. */ #app .ns-phone-tabs{display:none} #app .ns-phone-stats-link{display:none} @media(max-width:1099px){ #app .ns-signed-in-shell .ns-app-header{min-height:64px!important;height:64px!important;max-height:64px!important} #app .ns-signed-in-shell .ns-app-header .ds-header-inner{min-height:64px!important;height:64px!important;max-height:64px!important} #app .ns-signed-in-shell .ns-app-header .desktop-create-action,#app .ns-signed-in-shell .ns-app-header .ns-header-balance,#app .ns-signed-in-shell .ns-app-header #mobileMenuBtn{display:none!important} #app .ns-signed-in-shell .ns-app-header #managerMessageBell,#app .ns-signed-in-shell .ns-app-header .ns-artist-selector{display:flex!important;visibility:visible!important;opacity:1!important;min-width:44px!important;min-height:44px!important;width:44px!important;height:44px!important;padding:0!important;justify-content:center!important;align-items:center!important;border-radius:50%!important;overflow:hidden} #app .ns-signed-in-shell .ns-app-header .ds-header-actions{display:flex!important;align-items:center;gap:8px!important} #app .ns-signed-in-shell .ns-app-header .ns-artist-selector span{display:none!important} #app .ns-signed-in-shell .ns-app-header .ns-artist-selector img{width:40px!important;height:40px!important;min-height:40px!important;border-radius:50%!important;object-fit:cover} #app .ns-signed-in-shell .ns-phone-tabs{position:fixed!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr)) 72px repeat(2,minmax(0,1fr));align-items:center;left:0;right:0;bottom:0;min-height:calc(74px + env(safe-area-inset-bottom))!important;height:calc(74px + env(safe-area-inset-bottom))!important;padding:4px 8px env(safe-area-inset-bottom)!important;box-sizing:border-box;background:#090e1d;border-top:1px solid #403b53;z-index:210!important;gap:2px} #app .ns-signed-in-shell .ns-phone-tab{min-width:0;min-height:62px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:0;border-radius:10px;background:none;color:#d4cee2;font-size:12px;line-height:1.1;cursor:pointer;padding:5px 0;white-space:nowrap} #app .ns-signed-in-shell .ns-phone-tab.active{color:#ff66ae} #app .ns-signed-in-shell .ns-phone-tab svg{width:21px;height:21px;stroke:currentColor;stroke-width:1.8;fill:none} #app .ns-signed-in-shell .ns-phone-create{position:relative;transform:translateY(-8px);min-height:68px;min-width:68px;border:0;border-radius:24px;background:transparent;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:12px;cursor:pointer} #app .ns-signed-in-shell .ns-phone-create>span{display:grid;place-items:center;border-radius:50%;width:54px;height:54px;background:linear-gradient(125deg,#f13591,#8851ee);box-shadow:0 6px 20px #f1359170} #app .ns-signed-in-shell .ns-phone-create svg{width:26px;height:26px;stroke:white;stroke-width:1.8;fill:none} #app .ns-signed-in-shell .ns-phone-create small{font-size:12px;color:#fff} #app .ns-signed-in-shell .ns-phone-stats-link{align-self:flex-start;display:flex;align-items:center;justify-content:center;min-height:44px;padding:8px 16px;border:1px solid #695e7b;border-radius:10px;background:#1d2134;color:#fff;font-size:13px} #app .ns-signed-in-shell .ns-shell-layout{margin-bottom:calc(110px + env(safe-area-inset-bottom))!important} #app .ns-signed-in-shell footer.footer{padding-bottom:calc(95px + env(safe-area-inset-bottom))!important} #app .ns-signed-in-shell .ns-owner-totals.artist-hero-stats{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important} #app .ns-signed-in-shell .ns-owner-totals.artist-hero-stats>span{padding:10px 4px!important;align-items:center;text-align:center;justify-content:center;gap:4px!important} #app .ns-signed-in-shell .ns-owner-totals.artist-hero-stats small{font-size:12px!important;overflow-wrap:anywhere} #app .ns-signed-in-shell .ns-owner-totals.artist-hero-stats b{font-size:20px} #app .ns-signed-in-shell .ns-content-inner>.mkpi-panel .mkpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important} #app .ns-signed-in-shell .ns-content-inner>.mkpi-panel .mkpi-label{font-size:12px!important;line-height:1.3!important} #app .ns-signed-in-shell .ns-content-inner>.mkpi-panel .mkpi-tile{padding:12px 8px!important} body.ns-phone-active .sheet-backdrop,body.ns-phone-active .banner-position-backdrop,body.ns-phone-active .riffelo-share-overlay{z-index:1000!important} body.ns-phone-active .toast,body.ns-phone-active .rf-toast{z-index:1200!important;bottom:calc(84px + env(safe-area-inset-bottom))!important} } @media(max-width:380px){ #app .ns-signed-in-shell .ns-phone-tabs{grid-template-columns:repeat(2,minmax(0,1fr)) 65px repeat(2,minmax(0,1fr));padding-left:4px!important;padding-right:4px!important} #app .ns-signed-in-shell .ns-phone-create{min-width:62px} #app .ns-signed-in-shell .ns-phone-create>span{width:50px;height:50px} } /* RC2.60 R1: four weekly metrics remain balanced in a true 2x2 grid. */ @media(max-width:1099px){ #app .ns-signed-in-shell .ns-content-inner>.mkpi-panel>.mkpi-grid>.mkpi-saves{grid-column:auto!important;grid-row:auto!important} } /* RC2.59 R1: keep the compact hero eyebrow legible against bright banner art. */ #app .ns-signed-in-shell .ns-compact-hero .artist-hero-main>.eyebrow{position:relative!important;z-index:5!important;display:table!important;background:rgba(6,10,24,.86)!important;border-radius:4px!important;padding:3px 8px!important;color:#fff!important;opacity:1!important;text-shadow:none!important;filter:none!important} /* RC2.59 R1: retire inherited 84px transparent-header fade in the opaque shell. */ #app>.shell.ns-signed-in-shell:has(>.app-header.ds-header){padding-top:0!important} #app .ns-signed-in-shell .ns-app-header::before{display:none!important;content:none!important} #app .ns-signed-in-shell .ns-app-header::after{display:block!important;content:""!important;top:100%!important;bottom:auto!important;height:18px!important;min-height:0!important;max-height:18px!important;z-index:0!important;pointer-events:none!important;background:linear-gradient(to bottom,rgba(5,8,17,.7),transparent)!important} /* RC2.60 R2 — chart-only fit inside the signed-in desktop shell. Public Chart, landing, other shell screens and mobile navigation remain unchanged. */ @media(min-width:1100px){ #app .ns-signed-in-shell .ds-chart.chart-page .chart-hero h1{font-size:clamp(34px,3.25vw,60px)!important;line-height:1.07!important} #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-head, #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-stack>.chart-row{ grid-template-columns:42px minmax(0,1fr) repeat(5,minmax(42px,60px)) 148px!important; column-gap:6px!important; } #app .ns-signed-in-shell .ds-chart.chart-page .chart-chase-head, #app .ns-signed-in-shell .ds-chart.chart-page .chart-chase-stack>.chart-chase-row{ grid-template-columns:42px minmax(0,1fr) 60px 56px 56px 148px!important; column-gap:6px!important; } #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-stack>.chart-row>.chart-row-actions, #app .ns-signed-in-shell .ds-chart.chart-page .chart-chase-stack>.chart-chase-row>.chart-chase-actions{ width:148px!important;min-width:148px!important;max-width:148px!important; margin:0!important;justify-content:end!important; } #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-stack>.chart-row>.chart-row-actions button, #app .ns-signed-in-shell .ds-chart.chart-page .chart-chase-stack>.chart-chase-row>.chart-chase-actions button, #app .ns-signed-in-shell .ds-chart.chart-page .chart-leader-actions button{ width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important; } } @media(min-width:1100px) and (max-width:1599px){ #app .ns-signed-in-shell .ds-chart.chart-page .chart-editorial-shell{grid-template-columns:minmax(0,1fr)!important} #app .ns-signed-in-shell .ds-chart.chart-page .chart-side{grid-column:1!important;grid-row:3!important} } @media(min-width:1100px) and (max-width:1499px){ #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-head, #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-stack>.chart-row{ grid-template-columns:42px minmax(0,1fr) repeat(4,minmax(42px,60px)) 148px!important; } #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-head>span:nth-child(4), #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-stack>.chart-row>.chart-stat:nth-child(4){display:none!important} } @media(min-width:1100px){ #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-head>span, #app .ns-signed-in-shell .ds-chart.chart-page .chart-chase-head>span, #app .ns-signed-in-shell .ds-chart.chart-page .chart-leader-stats small{font-size:12px!important} #app .ns-signed-in-shell .ds-chart.chart-page .chart-row-play, #app .ns-signed-in-shell .ds-chart.chart-page .chart-leader-play{width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important} } @media(min-width:1100px) and (max-width:1399px){ #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-board .chart-leader{ display:grid!important;grid-template-columns:40px minmax(0,1fr) 148px!important; grid-template-rows:auto auto!important;gap:8px!important;padding:12px!important; } #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-board .chart-leader-rank{grid-column:1!important;grid-row:1!important;min-width:0!important} #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-board .chart-leader-main{grid-column:2!important;grid-row:1!important;min-width:0!important} #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-board .chart-leader-actions{grid-column:3!important;grid-row:1!important;width:148px!important} #app .ns-signed-in-shell .ds-chart.chart-page .current-chart-board .chart-leader-stats{ grid-column:2/4!important;grid-row:2!important;display:grid!important; grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:6px!important; } #app .ns-signed-in-shell .ds-chart.chart-page .chart-side{grid-template-columns:repeat(2,minmax(0,1fr))!important} } /* RC2.61 — desktop shell refinement only; no impact below 1100px. The original image-position percentages are applied to the new cover-crop plane. */ @media(min-width:1100px){ #app .ns-signed-in-shell .ns-backdrop-root{ position:relative!important;isolation:isolate!important;overflow:visible!important; background:#070b18!important;min-height:100vh; } #app .ns-signed-in-shell .ns-backdrop-root::before, #app .ns-signed-in-shell .ns-backdrop-root::after{content:none!important;display:none!important} #app .ns-signed-in-shell .ns-backdrop-root>.ns-atmosphere-backdrop{ position:absolute;top:0;right:0;width:min(77vw,1690px);height:clamp(480px,48vw,760px); overflow:hidden;pointer-events:none;z-index:0;opacity:1; -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.28) 18%,#000 55%),linear-gradient(to bottom,#000 0%,#000 49%,transparent 100%); -webkit-mask-composite:source-in; mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.28) 18%,#000 55%),linear-gradient(to bottom,#000 0%,#000 49%,transparent 100%); mask-composite:intersect; } #app .ns-signed-in-shell .ns-atmosphere-backdrop>.ns-atmosphere-photo{ display:block;width:100%;height:100%;object-fit:cover;opacity:.78; } #app .ns-signed-in-shell .ns-backdrop-root>.ns-shell-layout{ position:relative!important;z-index:1!important; padding-top:18px!important;align-items:start!important; } #app .ns-signed-in-shell .ns-shell-layout>.ns-rail{top:92px!important;margin-top:0!important;z-index:3;} #app .ns-signed-in-shell .ns-backdrop-root .ns-shell-surface{min-width:0;} #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero.artist-profile-stage{ background:transparent!important;box-shadow:none!important;border:0!important; position:relative!important;overflow:visible!important;isolation:auto!important; margin:0 0 14px!important;padding:0!important; } #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero::before, #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero::after, #app .ns-signed-in-shell .ns-backdrop-root .artist-hero-backdrop{display:none!important;content:none!important} #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero .artist-hero-portrait{display:none!important;} #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero .artist-hero-shell{ width:100%!important;max-width:none!important;margin:0!important;padding:0!important; } #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero .artist-hero-v2{ padding:0 0 2px!important;margin:0!important;min-height:0!important; } #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero .artist-hero-main{ width:100%!important;max-width:950px!important;min-width:0!important; padding:0!important;text-shadow:0 2px 16px rgba(0,0,0,.93)!important; } #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero .artist-hero-tagline{ max-width:820px!important;color:#fff!important;font-weight:600; text-shadow:0 2px 8px #050713,0 0 20px #050713!important; } #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero .artist-genre-chips{margin:8px 0 0!important;} #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero .artist-genre-chips>span{ background:rgba(7,10,20,.93)!important;color:#fff!important;border-color:#797185!important;font-size:12px!important; } #app .ns-signed-in-shell .ns-accessible-heading{ position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important; padding:0!important;border:0!important;margin:-1px!important; clip:rect(0,0,0,0)!important;white-space:nowrap!important; } #app .ns-signed-in-shell .ns-backdrop-root .ns-content-inner{gap:14px;} #app .ns-signed-in-shell .ns-backdrop-root .manager-card, #app .ns-signed-in-shell .ns-backdrop-root .mkpi-panel, #app .ns-signed-in-shell .ns-backdrop-root .catalogue-board, #app .ns-signed-in-shell .ns-backdrop-root .manager-depth-panel{ background:rgba(11,14,26,.89)!important;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px); border-color:rgba(133,126,157,.34)!important; } #app .ns-signed-in-shell .ns-rail-without-week .ns-week-status{display:none!important} /* Keep header fade inside the 84px header, rather than below it. */ #app .ns-signed-in-shell .ns-app-header::after{ top:calc(100% - 17px)!important;bottom:auto!important;height:17px!important; background:linear-gradient(to bottom,rgba(5,8,17,0),rgba(5,8,17,.92))!important; } /* Two-column Manager; original card markup and actions are moved, not regenerated. */ #app .ns-signed-in-shell .ns-manager-columns{ display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,440px); align-items:start;gap:18px;min-width:0;width:100%; } #app .ns-signed-in-shell .ns-manager-primary, #app .ns-signed-in-shell .ns-manager-secondary{ display:flex;flex-direction:column;gap:16px;min-width:0; } #app .ns-signed-in-shell .ns-manager-primary>.manager-card, #app .ns-signed-in-shell .ns-manager-secondary>.manager-card, #app .ns-signed-in-shell .ns-manager-secondary>.mkpi-panel{ margin:0!important;width:100%!important;max-width:none!important;min-width:0; } #app .ns-signed-in-shell .ns-manager-primary #managerMessagesPanel{padding:18px 20px!important;min-height:0!important} #app .ns-signed-in-shell .ns-manager-primary #managerMessagesPanel:has(.manager-messages-empty){padding-bottom:12px!important} #app .ns-signed-in-shell .ns-manager-primary #managerMessagesPanel .manager-heading{margin-bottom:6px!important} #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature{padding:16px 20px!important} #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature>.manager-heading{display:none!important} #app .ns-signed-in-shell .ns-manager-primary .mkpi-feature-row{ display:flex!important;align-items:center!important;gap:16px!important;min-width:0; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-release-copy{min-width:0;flex:1 1 auto;} #app .ns-signed-in-shell .ns-manager-primary .mkpi-release-copy h3{margin:3px 0 4px!important;} #app .ns-signed-in-shell .ns-manager-primary .mkpi-release-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px} #app .ns-signed-in-shell .ns-manager-primary .mkpi-release-actions>button{min-height:44px!important;} #app .ns-signed-in-shell .ns-latest-stats{ display:flex;align-items:center;justify-content:flex-end;gap:12px;flex:0 0 auto; border-left:1px solid #514858;padding-left:15px; } #app .ns-signed-in-shell .ns-latest-stats>span{display:flex;flex-direction:column;gap:3px;min-width:42px;text-align:center} #app .ns-signed-in-shell .ns-latest-stats strong{font-size:21px;color:#fff} #app .ns-signed-in-shell .ns-latest-stats small{font-size:12px;color:#d2c9da} #app .ns-signed-in-shell .ns-next-step{padding:17px 20px!important;} #app .ns-signed-in-shell .ns-next-step .manager-hero-next{ display:grid!important;grid-template-columns:minmax(0,1fr) auto;column-gap:20px;align-items:center; padding:0!important;margin:0!important;min-height:0!important; } #app .ns-signed-in-shell .ns-next-step .manager-hero-next>.eyebrow{grid-column:1!important;margin:0!important} #app .ns-signed-in-shell .ns-next-step .manager-hero-next>h2{grid-column:1!important;margin:3px 0 0!important;} #app .ns-signed-in-shell .ns-next-step .manager-hero-next>p{grid-column:1!important;margin:3px 0!important;} #app .ns-signed-in-shell .ns-next-step .manager-hero-next>button{grid-column:2!important;grid-row:1/4!important;min-height:44px;} #app .ns-signed-in-shell .ns-weekly-panel{padding:18px!important;min-height:0!important;} #app .ns-signed-in-shell .ns-weekly-panel .mkpi-heading{margin:0 0 12px!important;} #app .ns-signed-in-shell .ns-weekly-panel .mkpi-heading h2{font-size:24px!important;} #app .ns-signed-in-shell .ns-weekly-panel .mkpi-grid{ display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:0!important; } #app .ns-signed-in-shell .ns-weekly-panel .mkpi-position{ grid-column:1/-1!important;padding:10px 0 14px!important; border-bottom:1px solid #514858;margin-bottom:5px; } #app .ns-signed-in-shell .ns-weekly-panel .mkpi-tile:not(.mkpi-position){ padding:10px 8px!important;border:0!important;border-radius:0!important;min-width:0; } #app .ns-signed-in-shell .ns-weekly-panel .mkpi-tile:not(.mkpi-position)+.mkpi-tile{border-left:1px solid #514858!important} #app .ns-signed-in-shell .ns-weekly-panel .mkpi-label{font-size:12px!important;min-width:0;flex-wrap:wrap} #app .ns-signed-in-shell .ns-weekly-panel .mkpi-value{font-size:25px!important} #app .ns-signed-in-shell .ns-weekly-panel .mkpi-comparison{font-size:12px!important;white-space:normal!important} #app .ns-signed-in-shell .ns-catalogue-totals{padding:18px 20px!important;} #app .ns-signed-in-shell .ns-catalogue-totals>h2{font:normal 25px/1.2 'DM Serif Display',Georgia,serif;color:#fff;margin:0 0 14px;} #app .ns-signed-in-shell .ns-catalogue-totals>.ns-owner-totals.artist-hero-stats{ grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important; } #app .ns-signed-in-shell .ns-catalogue-totals .ns-owner-totals.artist-hero-stats>span{ padding:12px!important;min-height:72px;justify-content:center; } #app .ns-signed-in-shell .ns-catalogue-totals .ns-owner-totals.artist-hero-stats>span svg{display:none} #app .ns-signed-in-shell .ns-catalogue-totals .ns-owner-totals.artist-hero-stats b{font-size:25px!important} #app .ns-signed-in-shell .ns-catalogue-totals .ns-owner-totals.artist-hero-stats small{font-size:12px!important;color:#e9e3ed!important} } @media(min-width:1100px) and (max-width:1199px){ #app .ns-signed-in-shell .ns-manager-columns{grid-template-columns:minmax(0,1fr)!important} #app .ns-signed-in-shell .ns-manager-secondary{width:100%;} } @media(min-width:1200px) and (max-width:1549px){ #app .ns-signed-in-shell .ns-manager-columns{grid-template-columns:minmax(0,1fr) minmax(360px,39%)!important;gap:14px!important} #app .ns-signed-in-shell .ns-manager-primary .mkpi-feature-row{flex-wrap:wrap;} #app .ns-signed-in-shell .ns-latest-stats{margin-left:auto;} } /* RC2.61 compact Manager panels and shared rail elevation. Scoped to desktop only; the older small-screen shell is left untouched. */ @media(min-width:1100px){ #app .ns-signed-in-shell .ns-backdrop-root>.ns-shell-layout{padding-top:0!important;} #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-feature-row{ min-height:0!important;height:auto!important;display:flex!important; grid-template-columns:none!important;align-items:center!important; flex-wrap:nowrap;gap:16px!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-art{ display:block!important;width:112px!important;min-width:112px!important;max-width:112px!important; height:112px!important;min-height:112px!important;max-height:112px!important; flex:0 0 112px!important;align-self:center!important;border-radius:10px!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-art>.manager-art{ display:block!important;width:100%!important;height:100%!important;min-height:0!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-copy{ flex:1 1 210px!important;min-width:140px!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-actions{display:flex!important;align-items:center!important;gap:8px!important;margin-top:10px!important} #app .ns-signed-in-shell .ns-manager-primary #managerMessagesPanel .manager-message-empty{ min-height:0!important;height:auto!important;margin:6px 0 0!important;padding:8px 2px!important; } #app .ns-signed-in-shell .ns-manager-primary #managerMessagesPanel .manager-message-empty p{margin:0!important} } @media(min-width:1100px) and (max-width:1549px){ #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-feature-row{flex-wrap:wrap!important} #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .ns-latest-stats{margin-left:128px!important} } @media(min-width:1100px){ /* Uniform top inset for Chart and all hero screens; sticky rail shares one y-coordinate. */ #app .ns-signed-in-shell .ns-shell-layout, #app .ns-signed-in-shell .ns-backdrop-root>.ns-shell-layout{padding-top:18px!important;} } @media(min-width:1100px){ /* A short Songs screen must still afford the rail's sticky offset. */ #app .ns-signed-in-shell .ns-shell-layout{min-height:calc(100vh - 65px)} } /* RC2.61 R1 — CTO R1–R5 targeted desktop polish only. */ @media (min-width:1100px){ /* R3: image extends behind the opaque header; no photo top-edge seam. */ #app .ns-signed-in-shell .ns-backdrop-root>.ns-atmosphere-backdrop{ top:-84px!important;height:calc(clamp(480px,48vw,760px) + 84px)!important; } /* R4: protect hero copy against white/bright portrait regions. */ #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero .artist-hero-main{ max-width:min(590px,64%)!important;isolation:isolate!important;position:relative!important; text-shadow:0 2px 8px #03050e,0 0 25px #03050e!important; } #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero .artist-hero-main::before{ content:''!important;display:block!important;position:absolute;z-index:-1; inset:-15px -36px -17px -23px;border-radius:35px; background:linear-gradient(90deg,rgba(3,6,15,.96),rgba(3,6,15,.90) 50%,rgba(3,6,15,.62) 80%,transparent 100%); filter:blur(12px);pointer-events:none; } #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero .artist-hero-tagline{ max-width:530px!important;line-height:1.48!important;color:#fff!important; } /* R1: chart-position help remains in its own row, Plays help moved to heading. */ #app .ns-signed-in-shell .ns-weekly-panel{overflow:visible!important;padding:16px 17px!important;} #app .ns-signed-in-shell .ns-weekly-panel .mkpi-heading{ display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:6px!important; } #app .ns-signed-in-shell .ns-weekly-panel .mkpi-heading>div{ display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:8px!important;min-width:0; } #app .ns-signed-in-shell .ns-weekly-panel .mkpi-heading>div>.mkpi-info{margin-left:auto!important;} #app .ns-signed-in-shell .ns-weekly-panel .mkpi-info{ width:44px!important;min-width:44px!important;max-width:44px!important; height:44px!important;min-height:44px!important;max-height:44px!important; flex:0 0 44px!important;padding:0!important;box-sizing:border-box!important; display:inline-flex!important;align-items:center!important;justify-content:center!important; border-radius:50%!important;overflow:hidden!important;font-size:15px!important; } #app .ns-signed-in-shell .ns-weekly-panel .mkpi-position>.mkpi-label{ display:grid!important;grid-template-columns:15px minmax(0,1fr) 44px!important; align-items:center!important;gap:7px!important;min-width:0!important; min-height:44px!important;height:auto!important;overflow:visible!important; } #app .ns-signed-in-shell .ns-weekly-panel .mkpi-position>.mkpi-label>span{ flex:none!important;line-height:1.25!important;overflow-wrap:normal!important; } #app .ns-signed-in-shell .ns-weekly-panel .mkpi-grid>.mkpi-tile:not(.mkpi-position){ height:auto!important;min-height:0!important;display:grid!important; grid-template-rows:42px minmax(35px,auto) auto!important;align-content:start!important; gap:3px!important;padding:10px 6px 7px!important;overflow:visible!important; } #app .ns-signed-in-shell .ns-weekly-panel .mkpi-grid>.mkpi-tile:not(.mkpi-position)>.mkpi-label{ height:42px!important;min-height:42px!important;max-height:42px!important; display:flex!important;align-items:flex-start!important;align-content:start!important;gap:5px!important; flex-wrap:nowrap!important;line-height:1.26!important;overflow:visible!important; } #app .ns-signed-in-shell .ns-weekly-panel .mkpi-grid>.mkpi-tile:not(.mkpi-position)>.mkpi-label>span{ display:block!important;min-width:0!important;flex:1 1 auto!important;overflow-wrap:normal!important;word-break:normal!important; } #app .ns-signed-in-shell .ns-weekly-panel .mkpi-grid>.mkpi-tile:not(.mkpi-position)>.mkpi-value{ height:35px!important;min-height:35px!important;align-self:start!important;line-height:1.1!important; font-size:25px!important; } #app .ns-signed-in-shell .ns-weekly-panel .mkpi-grid>.mkpi-tile:not(.mkpi-position)>.mkpi-comparison{ min-height:0!important;font-size:12px!important;line-height:1.25!important; } /* R2: compact artwork, readable buttons, zero dropped stats at 1280+. */ #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-art{ width:132px!important;min-width:132px!important;max-width:132px!important; height:132px!important;min-height:132px!important;max-height:132px!important; flex:0 0 132px!important;position:relative!important;overflow:hidden!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-cover-play{ position:absolute!important;left:50%!important;top:50%!important; transform:translate(-50%,-50%)!important; width:52px!important;height:52px!important;min-width:52px!important;min-height:52px!important;max-width:52px!important;max-height:52px!important; display:flex!important;align-items:center!important;justify-content:center!important; border-radius:50%!important;padding:0!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-cover-play svg{ width:23px!important;height:23px!important;max-width:23px!important;max-height:23px!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-feature-row{ display:grid!important;grid-template-columns:132px minmax(0,1fr) auto!important; align-items:center!important;gap:12px!important;flex-wrap:nowrap!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-copy{ min-width:0!important;max-width:none!important;width:auto!important;flex:auto!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-actions{ flex-wrap:nowrap!important;gap:7px!important;white-space:nowrap!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-actions>button{ min-height:44px!important;white-space:nowrap!important;padding:8px 10px!important; width:auto!important;flex:0 0 auto!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .ns-latest-stats{ margin:0!important;display:flex!important;flex:none!important;padding-left:10px!important;gap:7px!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .ns-latest-stats>span{min-width:32px!important;} #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .ns-latest-stats strong{font-size:19px!important;} /* R5: compact Next Step on one line where the available width allows it. */ #app .ns-signed-in-shell .ns-next-step .manager-hero-next{column-gap:12px!important;} #app .ns-signed-in-shell .ns-next-step .manager-hero-next>h2{ font-size:clamp(18px,1.12vw,21px)!important;line-height:1.23!important; } #app .ns-signed-in-shell .ns-next-step .manager-hero-next>p{ font-size:13px!important;line-height:1.35!important; } } @media (min-width:1100px) and (max-width:1399px){ /* The two narrow columns cannot keep the required release actions and stats aligned. */ #app .ns-signed-in-shell .ns-manager-columns{grid-template-columns:minmax(0,1fr)!important;} #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .ns-latest-stats{border-left:1px solid #514858!important;} } @media (min-width:1100px) and (max-width:1199px){ /* At 1100, stats can sit below the title without pushing either CTA down. */ #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-feature-row{grid-template-columns:132px minmax(0,1fr)!important;} #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .ns-latest-stats{grid-column:2!important;justify-self:start!important;border-left:0!important;padding-left:0!important;} } @media (min-width:1400px) and (max-width:1549px){ #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-feature-row{gap:8px!important;} #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-actions>button{padding:8px!important;font-size:12px!important;} } @media (min-width:1100px){ /* Remove legacy minimum height / 16px inner padding from the release card. */ #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature{ min-height:0!important;height:auto!important;display:block!important;padding:16px 20px!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-feature-row{ min-height:132px!important;height:auto!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-copy{ padding:0!important;margin:0!important;min-height:0!important;gap:0!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-copy p{ margin:4px 0!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-copy h3{ margin:3px 0 5px!important;font-size:clamp(22px,1.5vw,26px)!important;line-height:1.15!important; } #app .ns-signed-in-shell .ns-weekly-panel{display:block!important;} #app .ns-signed-in-shell .ns-weekly-panel .mkpi-position{height:auto!important;min-height:0!important;padding:4px 0 8px!important;} #app .ns-signed-in-shell .ns-weekly-panel .mkpi-grid>.mkpi-tile:not(.mkpi-position){ grid-template-rows:39px 35px auto!important;padding-top:8px!important;padding-bottom:4px!important; } #app .ns-signed-in-shell .ns-weekly-panel .mkpi-grid>.mkpi-tile:not(.mkpi-position)>.mkpi-label{height:39px!important;min-height:39px!important;max-height:39px!important;} #app .ns-signed-in-shell .ns-next-step .manager-hero-next>button{ font-size:13px!important;padding:0 10px!important;min-width:0!important;margin:0!important; } #app .ns-signed-in-shell .ns-next-step .manager-hero-next>p{font-size:12px!important;} } @media (min-width:1100px) and (max-width:1279px){ /* Small desktop crop brings the bright face behind text: stronger local scrim. */ #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero .artist-hero-main::before{ inset:-23px -45px -26px -30px!important; background:linear-gradient(90deg,rgba(3,6,15,.99),rgba(3,6,15,.98) 74%,rgba(3,6,15,.96) 100%)!important; filter:blur(9px)!important; } } /* RC2.62 — viewport-fixed desktop rail; preserve the existing grid slot and responsive mobile menu. This cannot scroll away with short content panels. */ @media (min-width:1100px){ #app .ns-signed-in-shell .ns-shell-layout{grid-template-columns:248px minmax(0,1fr)!important;} #app .ns-signed-in-shell .ns-shell-layout>.ns-shell-surface{grid-column:2;grid-row:1;} #app .ns-signed-in-shell .ns-shell-layout>.ns-rail{ position:fixed!important; left:clamp(23px,4.7vw,114px)!important; top:92px!important; width:248px!important; max-width:248px!important; max-height:calc(100dvh - 108px)!important; min-height:0!important; height:auto!important; overflow-y:auto!important; overscroll-behavior:contain; z-index:3!important; } /* Keep footer text in the same content column as the page, beside the fixed rail. */ #app .ns-signed-in-shell>footer.footer{ padding-left:calc(clamp(23px,4.7vw,114px) + 264px)!important; } } @media (min-width:1600px){ #app .ns-signed-in-shell .ns-shell-layout>.ns-rail{ top:116px!important; max-height:calc(100dvh - 132px)!important; } } /* RC2.62 Item B — overlays must cover the signed-in shell, and the song footer stays reachable. */ body:has(#app .ns-signed-in-shell) > .sheet-backdrop, body:has(#app .ns-signed-in-shell) > .banner-position-backdrop, body:has(#app .ns-signed-in-shell) > .riffelo-share-overlay{z-index:1000!important} body:has(#app .ns-signed-in-shell) > .toast, body:has(#app .ns-signed-in-shell) > .rf-toast{z-index:1200!important} body > .sheet-backdrop.song-backdrop{align-items:center!important;padding:16px!important;box-sizing:border-box} body > .song-backdrop > .song-sheet{ display:flex!important;flex-direction:column!important;position:relative!important; width:100%;max-height:calc(100dvh - 32px)!important; height:auto;overflow:hidden!important;box-sizing:border-box!important; padding:0 16px!important;border-radius:22px!important } body > .song-backdrop > .song-sheet > .sheet-handle{flex:none;margin:12px auto 0} body > .song-backdrop > .song-sheet > .sheet-close{ position:absolute!important;top:12px!important;right:12px!important; width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important; z-index:5!important;display:grid!important;place-items:center!important } body > .song-backdrop > .song-sheet > .song-sheet-scroll{ flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain; padding:58px 2px 14px;scrollbar-gutter:stable; } body > .song-backdrop > .song-sheet > .song-sheet-footer{ flex:0 0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:8px; padding:12px 0 max(12px,env(safe-area-inset-bottom)); background:#101827;border-top:1px solid rgba(255,255,255,.15); z-index:3;position:relative; } body > .song-backdrop > .song-sheet > .song-sheet-footer .sheet-button{ width:auto!important;min-height:44px!important;min-width:44px!important; flex:1 1 auto;padding:10px 12px!important;font-size:12px!important; display:inline-flex;align-items:center;justify-content:center;gap:7px; white-space:nowrap; } body > .song-backdrop > .song-sheet > .song-sheet-footer svg{ width:18px;height:18px;flex:none;stroke:currentColor;fill:none; } /* RC2.64 — owner song tiles; existing list remains unchanged. */ #app .ns-signed-in-shell .ns-songs-content .catalogue-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:12px} #app .ns-signed-in-shell .ns-songs-content .ns-view-toggle{display:flex;gap:3px;align-items:center;margin-left:0;padding:3px;border-radius:12px;background:#151a28;border:1px solid #474657} #app .ns-signed-in-shell .ns-view-toggle button{min-height:44px;min-width:58px;padding:8px 13px;border:0;border-radius:9px;background:transparent;color:#e8e9ee;font-size:13px;font-weight:700;cursor:pointer} #app .ns-signed-in-shell .ns-view-toggle button.active{background:#683457;color:#fff} #app .ns-signed-in-shell .ns-tiles-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:14px} #app .ns-signed-in-shell .ns-song-tile{min-width:0;border:1px solid #484254;border-radius:16px;background:rgba(21,22,34,.94);overflow:hidden;box-shadow:0 12px 28px rgba(0,0,0,.12)} #app .ns-signed-in-shell .ns-tile-cover{position:relative;aspect-ratio:1;width:100%;background-position:center;background-size:cover;overflow:hidden} #app .ns-signed-in-shell .ns-tile-image{display:block;width:100%;height:100%;object-fit:cover;position:absolute;inset:0} #app .ns-signed-in-shell .ns-tile-cover .status-pill{position:absolute;z-index:2;top:12px;left:12px;bottom:auto;padding:8px 10px;border-radius:9px;background:#111522;color:#fff;font-size:12px;line-height:1.3} #app .ns-signed-in-shell .ns-tile-open{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;cursor:pointer} #app .ns-signed-in-shell .ns-tile-play{position:absolute;right:13px;bottom:13px;width:56px;height:56px;min-width:56px;min-height:56px;z-index:3;display:grid;place-items:center;border:1px solid #ffd9ea;border-radius:50%;background:#d62e88;color:#fff;cursor:pointer} #app .ns-signed-in-shell .ns-tile-play svg{width:23px;height:23px;fill:currentColor} #app .ns-signed-in-shell .ns-tile-details{padding:15px 16px 14px;min-width:0} #app .ns-signed-in-shell .ns-tile-title{display:block;width:100%;min-height:44px;padding:0;border:0;background:none;color:#fff;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:17px;font-weight:800;cursor:pointer} #app .ns-signed-in-shell .ns-tile-meta{display:block;margin:2px 0 13px;color:#d3cddd;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #app .ns-signed-in-shell .ns-tile-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:8px 0 12px} #app .ns-signed-in-shell .ns-tile-stats>span{display:flex;flex-direction:column;gap:2px;min-width:0} #app .ns-signed-in-shell .ns-tile-stats b{font-size:19px;color:#fff} #app .ns-signed-in-shell .ns-tile-stats small{font-size:12px;color:#d3cede} #app .ns-signed-in-shell .ns-tile-actions{display:flex;align-items:center;gap:8px} #app .ns-signed-in-shell .ns-tile-actions>button,#app .ns-signed-in-shell .ns-tile-actions>a{min-height:44px!important;min-width:44px!important;border-radius:9px!important;display:inline-flex!important;align-items:center;justify-content:center;gap:7px;border:1px solid #5c5268;background:#292435;color:#fff;text-decoration:none;font-size:13px;cursor:pointer} #app .ns-signed-in-shell .ns-tile-actions .ns-tile-share{flex:1 1 auto;min-width:0!important;background:#583050} #app .ns-signed-in-shell .ns-tile-actions svg{width:19px;height:19px;stroke:currentColor;fill:none} #app .ns-signed-in-shell .ns-tile-actions .catalogue-actions-trigger{flex:0 0 44px!important;width:44px!important;height:44px!important;margin:0!important} @media(min-width:1100px) and (max-width:1279px){#app .ns-signed-in-shell .ns-tiles-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(min-width:1280px) and (max-width:1699px){#app .ns-signed-in-shell .ns-tiles-grid{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(min-width:1700px){#app .ns-signed-in-shell .ns-tiles-grid{grid-template-columns:repeat(4,minmax(0,1fr))}} @media(max-width:1099px){ #app .ns-signed-in-shell .ns-tiles-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px} #app .ns-signed-in-shell .ns-tile-details{padding:9px 8px} #app .ns-signed-in-shell .ns-tile-title{font-size:13px;min-height:44px} #app .ns-signed-in-shell .ns-tile-meta{font-size:12px;margin-bottom:8px} #app .ns-signed-in-shell .ns-tile-stats{gap:2px} #app .ns-signed-in-shell .ns-tile-stats b{font-size:16px} #app .ns-signed-in-shell .ns-tile-stats small{font-size:12px} #app .ns-signed-in-shell .ns-tile-actions .ns-tile-share,#app .ns-signed-in-shell .ns-tile-actions .ns-tile-download{display:none!important} #app .ns-signed-in-shell .ns-tile-actions{justify-content:flex-end} #app .ns-signed-in-shell .ns-tile-play{width:48px;min-width:48px;height:48px;min-height:48px;right:8px;bottom:8px} } /* RC2.64 — larger artwork, preserving the RC2.63 scrolling sheet and footer. */ body > .song-backdrop > .song-sheet{max-width:640px!important} body > .song-backdrop > .song-sheet .song-hero{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:13px!important} body > .song-backdrop > .song-sheet .song-art{width:min(100%,430px)!important;height:min(40dvh,430px)!important;max-height:40dvh!important;aspect-ratio:auto!important;margin:0 auto!important;border-radius:16px!important;background-size:cover!important;background-position:center!important;flex:none} body > .song-backdrop > .song-sheet .song-heading{width:100%;min-width:0} @media(min-width:1100px){ #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-feature-row{grid-template-columns:200px minmax(0,1fr)!important} #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-art{width:200px!important;height:200px!important;max-width:200px!important;min-width:200px!important} #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-art>.manager-art{width:100%!important;height:100%!important} #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .ns-latest-stats{grid-column:2!important} #app .ns-signed-in-shell .ns-shell-chart .chart-leader-cover{width:108px!important;height:108px!important;flex:0 0 108px!important} #app .ns-signed-in-shell .ns-artist-achievements{height:max-content!important;min-height:0!important} #app .ns-signed-in-shell [data-manager-panel="bio"]{height:max-content!important;min-height:0!important;align-self:start!important} } /* RC2.64: align the enlarged release cover with its track column at narrow desktop widths. */ @media (min-width:1100px) and (max-width:1199px){ #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-feature-row{grid-template-columns:200px minmax(0,1fr)!important} } /* RC2.64 R1: restore square Latest Release artwork and keep the existing Plays/Saves/Votes with the title instead of a third grid row. */ @media (min-width:1100px){ #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-feature-row{ display:grid!important;grid-template-columns:132px minmax(0,1fr)!important; align-items:center!important;gap:14px!important;min-height:132px!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-art{ width:132px!important;min-width:132px!important;max-width:132px!important; height:132px!important;min-height:132px!important;max-height:132px!important; flex:0 0 132px!important;aspect-ratio:1!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-copy{ display:grid!important;grid-template-columns:minmax(0,1fr)!important; grid-template-rows:auto auto auto auto auto!important; align-content:center!important;min-width:0!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-copy>:is(.eyebrow,h3,p,.mkpi-release-actions){grid-column:1!important} #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-copy>.ns-latest-stats{ grid-column:1!important;grid-row:5!important;justify-self:start!important; margin:8px 0 0!important;padding:0!important;border:0!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-actions{ display:flex!important;flex-wrap:nowrap!important;gap:8px!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-actions>button{ white-space:nowrap!important;min-height:44px!important; } /* The featured #1 row has its own grid track. Do not change regular row covers. */ #app .ns-signed-in-shell .ns-shell-chart.ds-chart.chart-page .current-chart-board .chart-leader-main{ grid-template-columns:108px minmax(0,1fr) 44px!important; gap:10px!important;min-width:0!important; } #app .ns-signed-in-shell .ns-shell-chart.ds-chart.chart-page .current-chart-board .chart-leader-main>.chart-leader-cover{ display:block!important;box-sizing:border-box!important; width:108px!important;height:108px!important;min-width:108px!important;max-width:108px!important; min-height:108px!important;max-height:108px!important;aspect-ratio:1!important;flex:0 0 108px!important; } } @media (min-width:1280px){ #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-feature-row{ grid-template-columns:200px minmax(0,1fr)!important;min-height:200px!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-art{ width:200px!important;height:200px!important;min-width:200px!important;max-width:200px!important; min-height:200px!important;max-height:200px!important;flex:0 0 200px!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-copy{ grid-template-columns:minmax(0,1fr) auto!important;column-gap:8px!important; } #app .ns-signed-in-shell .ns-manager-primary .mkpi-latest-feature .mkpi-release-copy>.ns-latest-stats{ grid-column:2!important;grid-row:1/5!important;align-self:center!important;justify-self:end!important; margin:0!important;padding:0 0 0 10px!important;border:0!important; } } /* RC2.66: moderation evidence stays visible to its owner but is not actionable. */ #app .catalogue-rejected{margin-top:20px;padding:18px 20px;border:1px solid rgba(200,200,220,.20);border-radius:16px;background:rgba(24,24,34,.88);} #app .catalogue-rejected h2{font-size:16px;font-weight:700;line-height:1.45;margin:0 0 12px;color:#dddde5;} #app .catalogue-rejected-row{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;align-items:center;padding:12px 0;border-top:1px solid rgba(200,200,220,.15);opacity:.75;color:#d5d4e0;font-size:14px;} #app .catalogue-rejected-row strong{font-size:14px;overflow-wrap:anywhere;} #app .catalogue-rejected-row span{font-size:12px;font-weight:700;} /* RC2.67 — Approved shell UI refinement. No API/landing/public-profile change. */ /* A — match approved compact desktop start line; retained fixed rail, opaque header. */ @media (min-width:1100px) { #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero.artist-profile-stage, #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero .artist-hero-v2 { min-height:318px!important; box-sizing:border-box!important; } #app .ns-signed-in-shell .ns-backdrop-root .ns-compact-hero .artist-hero-main{max-width:min(590px,64%)!important;} } /* B — owner actions are outside the hero, in existing navigation and Edit Artist. */ #app .ns-signed-in-shell .ns-compact-hero .manager-owner-actions{display:none!important;} #app .rc267-banner-action{display:flex;justify-content:flex-end;margin:12px 0 18px;} #app .rc267-banner-action>button{min-height:44px;} /* C — the approved black/grey/quiet/danger language for the signed-in experience. No lp-* landing selectors, no public-profile buttons, no button semantics changed. */ #app .ns-signed-in-shell{ --rc267-primary:#000;--rc267-primary-border:#3d4156;--rc267-secondary:#2a2e42; --rc267-quiet-hover:#30253d;--rc267-focus:#f5f2ff; } #app .ns-signed-in-shell :is(.primary-cta,.ds-btn-primary,.desktop-create-action), #app .ns-signed-in-shell .ns-shell-surface :is(.mkpi-release-actions button,.ns-next-step .manager-hero-next>button){ min-height:44px!important;border-radius:10px!important; background:#000!important;color:#fff!important;border:1px solid #3d4156!important; font-size:14px!important;font-weight:700!important;box-shadow:none!important; transition:background-color 180ms ease,border-color 180ms ease,transform 180ms ease!important; } #app .ns-signed-in-shell :is(.primary-cta,.ds-btn-primary,.desktop-create-action):hover, #app .ns-signed-in-shell .ns-shell-surface :is(.mkpi-release-actions button,.ns-next-step .manager-hero-next>button):hover{background:#3a3e52!important;} #app .ns-signed-in-shell :is(.secondary-cta,.hero-share,.ns-tile-share,.ns-tile-download,.manager-credits), #app .ns-signed-in-shell .ns-songs-content :is(.catalogue-filters button,.ns-view-toggle button,.catalogue-sort select), #app .ns-signed-in-shell .ns-song-tile .ns-tile-actions :is(button,a){ min-height:44px!important;border-radius:10px!important; background:#2a2e42!important;color:#fff!important;border:1px solid #4d5066!important; font-size:14px!important;box-shadow:none!important; transition:background-color 180ms ease,border-color 180ms ease,transform 180ms ease!important; } #app .ns-signed-in-shell :is(.secondary-cta,.hero-share,.ns-tile-share,.ns-tile-download,.manager-credits):hover, #app .ns-signed-in-shell .ns-songs-content :is(.catalogue-filters button,.ns-view-toggle button):hover, #app .ns-signed-in-shell .ns-song-tile .ns-tile-actions :is(button,a):hover{background:#000!important;} #app .ns-signed-in-shell .ns-songs-content :is(.catalogue-filters button.active,.ns-view-toggle button.active){background:#403e56!important;border-color:#716782!important;color:#fff!important;} #app .ns-signed-in-shell :is(.ns-rail-link,.ns-phone-tab){border-radius:10px!important;background:transparent;color:#e6e3ef;transition:background-color 180ms ease,color 180ms ease,transform 180ms ease;} #app .ns-signed-in-shell :is(.ns-rail-link,.ns-phone-tab):hover{background:#30253d!important;} #app .ns-signed-in-shell .ns-rail-link.active{background:#482445!important;color:#fff!important;} #app .ns-signed-in-shell :is(.danger-link,.catalogue-draft-delete){min-width:44px;min-height:44px!important;border:1px solid #7e3e50!important;border-radius:10px!important;background:#000!important;color:#ff8b9f!important;font-size:14px!important;} #app .ns-signed-in-shell :is(.danger-link,.catalogue-draft-delete):hover{background:#361b28!important;} #app .ns-signed-in-shell :is(button,[role="button"],a):focus-visible{outline:3px solid #f5f2ff!important;outline-offset:3px!important;} #app .ns-signed-in-shell button:disabled,#app .ns-signed-in-shell button[aria-disabled="true"]{opacity:.46!important;cursor:not-allowed!important;filter:saturate(.35)!important;} #app .ns-signed-in-shell button:not(:disabled):active{transform:translateY(1px)!important;} #app .ns-signed-in-shell button :is(.lp-hero-cta-arrow,svg:last-child){transition:transform 180ms ease;} #app .ns-signed-in-shell button:hover .lp-hero-cta-arrow{transform:translateX(3px);} /* Quiet circular controls retain familiar shape, but use the black/grey palette. */ #app .ns-signed-in-shell .ns-app-header #managerMessageBell, #app .ns-signed-in-shell .ns-app-header .ns-artist-selector{background:#141824!important;border:1px solid #3d4156!important;color:#fff!important;} #app .ns-signed-in-shell .ns-app-header #managerMessageBell:hover, #app .ns-signed-in-shell .ns-app-header .ns-artist-selector:hover{background:#30253d!important;} /* E — song artwork at approved five-column desktop scale. */ @media(min-width:1280px){ #app .ns-signed-in-shell .ns-tiles-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px!important;} #app .ns-signed-in-shell .ns-song-tile .ns-tile-details{padding:10px 11px 12px!important;} #app .ns-signed-in-shell .ns-song-tile .ns-tile-title{font-size:14px!important;} #app .ns-signed-in-shell .ns-song-tile .ns-tile-stats b{font-size:17px!important;} #app .ns-signed-in-shell .ns-song-tile .ns-tile-actions{gap:5px!important;} } @media(min-width:1100px) and (max-width:1279px){#app .ns-signed-in-shell .ns-tiles-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important;}} /* Other application views: carry the same button language into Create, Edit Artist, Chart, Songs and Admin while leaving the frozen public landing untouched. */ #app .shell :is(.create-page,.artist-setup-page,.chart-page,.songs-page,.admin-console-page,.dev-native-page) :is(.primary-cta,.create-primary-action), #app .shell .artist-setup-page .artist-dna-readonly-actions button{ min-height:44px!important;border-radius:10px!important;background:#000!important; color:#fff!important;border:1px solid #3d4156!important;font-size:14px!important; box-shadow:none!important;transition:background-color 180ms ease,transform 180ms ease!important; } #app .shell :is(.create-page,.artist-setup-page,.chart-page,.songs-page,.admin-console-page,.dev-native-page) :is(.primary-cta,.create-primary-action):hover{background:#3a3e52!important;} #app .shell :is(.create-page,.artist-setup-page,.chart-page,.songs-page,.admin-console-page,.dev-native-page) :is(.secondary-cta,.create-artist-pill){ min-height:44px!important;border-radius:10px!important;background:#2a2e42!important; color:#fff!important;border:1px solid #4d5066!important;font-size:14px!important; box-shadow:none!important;transition:background-color 180ms ease,transform 180ms ease!important; } #app .shell :is(.create-page,.artist-setup-page,.chart-page,.songs-page,.admin-console-page,.dev-native-page) :is(.secondary-cta,.create-artist-pill):hover{background:#000!important;} #app .shell .chart-page .chart-mode-toggle>button{min-height:44px!important;border-radius:10px!important;border:1px solid #4d5066!important;background:#2a2e42!important;color:#fff!important;font-size:14px!important;} #app .shell .chart-page .chart-mode-toggle>button.active{background:#403e56!important;border-color:#716782!important;} #app .shell :is(.create-page,.artist-setup-page,.chart-page,.songs-page,.admin-console-page,.dev-native-page) :is(button,[role="button"]):focus-visible{outline:3px solid #f5f2ff!important;outline-offset:3px!important;} #app .shell :is(.create-page,.artist-setup-page,.chart-page,.songs-page,.admin-console-page,.dev-native-page) button:disabled{opacity:.46!important;cursor:not-allowed!important;} #app .shell :is(.create-page,.artist-setup-page,.chart-page,.songs-page,.admin-console-page,.dev-native-page) button:not(:disabled):active{transform:translateY(1px)!important;} /* Manager-message and catalogue actions: the same four approved states. */ #app .ns-signed-in-shell .manager-message-action, #app .ns-signed-in-shell .manager-message-expand, #app .ns-signed-in-shell .ns-songs-content .catalogue-own-row button, #app .ns-signed-in-shell .ns-app-header .manager-message-bell{ min-width:44px!important;min-height:44px!important;border-radius:10px!important; font-size:14px!important;transition:background-color 180ms ease,transform 180ms ease!important; } #app .ns-signed-in-shell .manager-message-action.primary{background:#000!important;color:#fff!important;border:1px solid #3d4156!important;} #app .ns-signed-in-shell .manager-message-action.primary:hover{background:#3a3e52!important;} #app .ns-signed-in-shell .manager-message-action.secondary{background:#2a2e42!important;color:#fff!important;border:1px solid #4d5066!important;} #app .ns-signed-in-shell .manager-message-action.secondary:hover{background:#000!important;} #app .ns-signed-in-shell .manager-message-action.delete{background:#000!important;color:#ff8b9f!important;border:1px solid #7e3e50!important;} #app .ns-signed-in-shell .manager-message-action.delete:hover{background:#361b28!important;} #app .ns-signed-in-shell .manager-message-expand{background:transparent!important;color:#fff!important;border:1px solid #484a60!important;} #app .ns-signed-in-shell .manager-message-expand:hover{background:#30253d!important;} /* Live overlays belong to the existing signed-in app, never to the landing. */ body:has(#app .ns-signed-in-shell)>.sheet-backdrop :is(.sheet-button.primary,.banner-position-save), body:has(#app .ns-signed-in-shell)>.banner-position-backdrop .banner-position-save{ background:#000!important;color:#fff!important;border:1px solid #3d4156!important; border-radius:10px!important;min-height:44px!important;font-size:14px!important; } body:has(#app .ns-signed-in-shell)>.sheet-backdrop :is(.sheet-button.secondary,.banner-position-cancel), body:has(#app .ns-signed-in-shell)>.banner-position-backdrop .banner-position-cancel{ background:#2a2e42!important;color:#fff!important;border:1px solid #4d5066!important; border-radius:10px!important;min-height:44px!important;font-size:14px!important; } body:has(#app .ns-signed-in-shell)>.sheet-backdrop .sheet-button.danger{background:#000!important;color:#ff8b9f!important;border:1px solid #7e3e50!important;border-radius:10px!important;min-height:44px!important;} body:has(#app .ns-signed-in-shell)>.sheet-backdrop button:focus-visible, body:has(#app .ns-signed-in-shell)>.banner-position-backdrop button:focus-visible{outline:3px solid #f5f2ff!important;outline-offset:3px!important;} body:has(#app .ns-signed-in-shell)>.sheet-backdrop button:disabled{opacity:.46!important;cursor:not-allowed!important;} #app .ns-signed-in-shell .rc267-cta-arrow{display:inline-block;margin-left:4px;transition:transform 180ms ease;} #app .ns-signed-in-shell button:hover .rc267-cta-arrow{transform:translateX(3px);} /* Song play controls preserve circular affordance but adopt the neutral system. */ #app .ns-signed-in-shell .ns-tile-play{background:#000!important;border:1px solid #85869a!important;color:#fff!important;box-shadow:0 3px 14px #0009!important;} #app .ns-signed-in-shell .ns-tile-play:hover{background:#3a3e52!important;} /* D — phone hero: 232px image, no covered face, name and badge at photo bottom. */ @media(max-width:1099px){ #app .ns-signed-in-shell .ns-compact-hero.artist-profile-stage{ height:232px!important;min-height:232px!important;max-height:232px!important; padding:0!important;overflow:hidden!important;position:relative!important;isolation:isolate!important; } #app .ns-signed-in-shell .ns-compact-hero .artist-hero-shell{height:232px!important;width:100%!important;max-width:none!important;padding:0!important;margin:0!important;} #app .ns-signed-in-shell .ns-compact-hero .artist-hero-v2{ position:relative!important;height:232px!important;min-height:232px!important;max-height:232px!important; width:100%!important;padding:0!important;display:block!important;overflow:hidden!important; } #app .ns-signed-in-shell .ns-compact-hero .artist-hero-portrait{ position:absolute!important;inset:0!important;width:100%!important;height:100%!important; opacity:1!important;z-index:0!important;pointer-events:none!important; } #app .ns-signed-in-shell .ns-compact-hero .artist-hero-portrait img{ width:100%!important;height:100%!important;object-fit:cover!important;object-position:var(--ds-profile-mobile-pos,center 38%)!important; } #app .ns-signed-in-shell .ns-compact-hero .artist-hero-v2::after{ content:'';position:absolute;inset:40% 0 0;z-index:1;pointer-events:none; background:linear-gradient(transparent,rgba(4,6,15,.52) 55%,rgba(4,6,15,.93)); } #app .ns-signed-in-shell .ns-compact-hero .artist-hero-v2>.artist-hero-main{ position:absolute!important;inset:auto 16px 12px 16px!important;width:calc(100% - 32px)!important; max-width:none!important;min-height:0!important;margin:0!important;padding:0!important; transform:none!important;z-index:2!important;text-align:left!important; } #app .ns-signed-in-shell .ns-compact-hero .artist-hero-main .artist-hero-tagline, #app .ns-signed-in-shell .ns-compact-hero .artist-hero-main .artist-genre-chips, #app .ns-signed-in-shell .ns-compact-hero .artist-hero-main .new-artist-marker{display:none!important;} #app .ns-signed-in-shell .ns-compact-hero .artist-name-line h1{font-size:clamp(30px,8vw,38px)!important;} #app .ns-signed-in-shell .ns-phone-create{ background:#000!important;border:1px solid #3d4156!important;border-radius:12px!important; min-height:68px!important; } #app .ns-signed-in-shell .ns-phone-create>span{background:#000!important;box-shadow:none!important;border-radius:10px!important;} #app .ns-signed-in-shell .ns-phone-tab.active{color:#fff!important;background:#141624!important;} #app .ns-signed-in-shell .ns-manager-phone-content>*{order:0!important;} #app .ns-signed-in-shell .ns-manager-phone-content>.ns-screen-heading{ position:absolute!important;width:1px!important;height:1px!important; overflow:hidden!important;margin:-1px!important;clip-path:inset(50%)!important;white-space:nowrap!important; } #app .ns-signed-in-shell .ns-songs-content .catalogue-toolbar{justify-content:center;gap:10px!important;} #app .ns-signed-in-shell .ns-songs-content .catalogue-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;} #app .ns-signed-in-shell .ns-songs-content .catalogue-filters button{min-height:44px!important;padding:7px 8px!important;font-size:14px!important;} #app .ns-signed-in-shell .ns-songs-content .catalogue-sort{justify-content:center;} #app .ns-signed-in-shell .ns-songs-content .ns-view-toggle{margin-inline:auto!important;} #app .ns-signed-in-shell .ns-songs-content .ns-view-toggle button{font-size:14px!important;} } @media(prefers-reduced-motion:reduce){ #app .ns-signed-in-shell :is(button,a,[role="button"]),#app .ns-signed-in-shell button svg{transition:none!important;animation:none!important;} } /* RC2.67a — surgical restoration of approved RC2.66b Create and tile-Play. Chart and song-sheet Play retain their unchanged RC2.66b colours. All non-Create/Play DEC-117 button rules remain RC2.67. */ #app .ns-signed-in-shell .ns-app-header .desktop-create-action{ background:#e63e94!important;color:#fff!important;border:1px solid transparent!important; border-radius:10px!important;box-shadow:none!important; transition:background-color 180ms ease,transform 180ms ease!important; } #app .ns-signed-in-shell .ns-app-header .desktop-create-action:hover:not(:disabled){background:#d22b7b!important;} #app .ns-signed-in-shell .ns-tile-play{ background:#d62e88!important;color:#fff!important;border:1px solid #ffd9ea!important; border-radius:50%!important;box-shadow:none!important; transition:background-color 180ms ease,transform 180ms ease!important; } #app .ns-signed-in-shell .ns-tile-play:hover:not(:disabled){background:#bb2777!important;} @media(max-width:1099px){ #app .ns-signed-in-shell .ns-phone-create{ background:transparent!important;color:#fff!important;border:0!important;border-radius:24px!important; min-height:68px!important;transform:translateY(-8px); } #app .ns-signed-in-shell .ns-phone-create>span{ border-radius:50%!important;background:linear-gradient(125deg,#f13591,#8851ee)!important; box-shadow:0 6px 20px #f1359170!important; transition:filter 180ms ease!important; } #app .ns-signed-in-shell .ns-phone-create:hover:not(:disabled)>span{filter:brightness(1.08);} /* Keep the original raised position: press down by 1px, not by 9px. */ #app .ns-signed-in-shell .ns-phone-create:not(:disabled):active{transform:translateY(-7px)!important;} } @media(prefers-reduced-motion:reduce){ #app .ns-signed-in-shell .ns-phone-create>span{transition:none!important;} } /* RC2.67a Amendment 1: reused signed-in hero + field rows; no Create journey changes. */ #app .ns-signed-in-shell .ns-edit-fields{width:100%;min-width:0;display:flex;flex-direction:column;gap:0;background:rgba(16,18,35,.87);border:1px solid #30334b;border-radius:15px;padding:10px 20px;margin-bottom:42px;} #app .ns-signed-in-shell .ns-edit-fields .artist-dna-readonly{display:flex;flex-direction:column;gap:0;background:transparent;border:0;padding:0;margin:0;} #app .ns-signed-in-shell .ns-edit-fields .ns-edit-row{position:relative;display:grid!important;grid-template-columns:minmax(145px,1fr) minmax(130px,2fr) 94px;gap:18px;align-items:center;min-height:72px;margin:0!important;padding:14px 8px!important;background:transparent!important;border:0!important;border-radius:0!important;border-bottom:1px solid #282b43!important;max-width:none!important;box-shadow:none!important;} #app .ns-signed-in-shell .ns-edit-fields .artist-dna-readonly>.ns-edit-row{grid-template-columns:minmax(145px,1fr) minmax(130px,2fr) 94px!important;} #app .ns-signed-in-shell .ns-edit-fields .ns-edit-row>span:first-child,#app .ns-signed-in-shell .ns-edit-fields .ns-edit-row>label,#app .ns-signed-in-shell .ns-edit-banner-copy strong{font-size:14px!important;font-weight:700!important;color:#f7f7fd!important;} #app .ns-signed-in-shell .ns-edit-fields .ns-edit-row>strong{font-size:13px!important;font-weight:400!important;color:#aeb1c5!important;min-width:0;overflow-wrap:anywhere;} #app .ns-signed-in-shell .ns-edit-fields .ns-edit-state{justify-self:end;min-width:72px;text-align:center;padding:6px 9px;border-radius:8px;background:#282a40;color:#d9dae6;border:1px solid #34374f;font-size:12px!important;font-weight:700;letter-spacing:.04em;text-transform:uppercase;} #app .ns-signed-in-shell .ns-edit-fields .ns-edit-state.open{background:#163d2a;border-color:#256444;color:#8de1a5;} #app .ns-signed-in-shell .ns-edit-fields .artist-setup-form{width:100%;max-width:none;display:flex;flex-direction:column;gap:0;margin:0;padding:0;background:transparent;border:0;} #app .ns-signed-in-shell .ns-edit-fields .artist-field-card input,#app .ns-signed-in-shell .ns-edit-fields .artist-field-card select,#app .ns-signed-in-shell .ns-edit-fields .artist-field-card textarea,#app .ns-signed-in-shell .ns-edit-inline select{width:100%;min-height:44px;max-width:none;background:#1b2033;color:#fff;border:1px solid #45495d;border-radius:10px;box-sizing:border-box;} #app .ns-signed-in-shell .ns-edit-fields .artist-portrait-block{grid-template-columns:minmax(145px,1fr) 80px minmax(0,1fr);} #app .ns-signed-in-shell .ns-edit-fields .artist-portrait-block .artist-portrait-copy{min-width:0;} #app .ns-signed-in-shell .ns-edit-fields .artist-portrait-block img{max-height:72px;max-width:72px;object-fit:cover;border-radius:9px;} #app .ns-signed-in-shell .ns-edit-fields .rc267-banner-action{display:flex!important;flex-direction:row;justify-content:space-between!important;} #app .ns-signed-in-shell .ns-edit-fields .artist-setup-dock{position:static!important;display:flex;justify-content:flex-end;gap:14px;max-width:none;width:100%;background:transparent;border:0;box-shadow:none;padding:18px 8px;margin:0;} #app .ns-signed-in-shell .ns-edit-fields .ns-edit-open-actions{padding:16px 8px;display:flex;justify-content:flex-end;} #app .ns-signed-in-shell .ns-edit-fields .ns-edit-inline{width:100%;} #app .ns-signed-in-shell .ns-edit-fields .ns-visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;} @media(max-width:1099px){ #app .ns-signed-in-shell .ns-edit-fields{padding:4px 12px;margin-bottom:92px;} #app .ns-signed-in-shell .ns-edit-fields .ns-edit-row,#app .ns-signed-in-shell .ns-edit-fields .artist-dna-readonly>.ns-edit-row{grid-template-columns:minmax(90px,1fr) minmax(108px,1.4fr) 60px!important;gap:8px!important;min-height:78px;padding:12px 2px!important;} #app .ns-signed-in-shell .ns-edit-fields .ns-edit-state{min-width:50px;padding:6px 3px;font-size:12px!important;} #app .ns-signed-in-shell .ns-edit-fields .artist-portrait-block{grid-template-columns:1fr 54px 1fr!important;} #app .ns-signed-in-shell .ns-edit-fields .artist-portrait-block img{width:50px;max-height:50px;} #app .ns-signed-in-shell .ns-edit-fields .artist-setup-dock{flex-wrap:wrap;} #app .ns-signed-in-shell .ns-edit-fields .artist-field-card input,#app .ns-signed-in-shell .ns-edit-fields .artist-field-card select,#app .ns-signed-in-shell .ns-edit-fields .artist-field-card textarea{min-width:0;} } /* Portrait choice and banner focal point remain open on locked artists (API enforced). */ #app .ns-signed-in-shell .ns-edit-fields .artist-portrait-copy .ns-edit-state{display:inline-flex;align-items:center;justify-content:center;margin-top:8px;} #app .ns-signed-in-shell .ns-edit-fields .rc267-banner-action{gap:12px;} #app .ns-signed-in-shell .ns-edit-fields .rc267-banner-action>.ns-edit-state{flex:none;} @media(max-width:1099px){#app .ns-signed-in-shell .ns-edit-fields .rc267-banner-action{gap:6px;}#app .ns-signed-in-shell .ns-edit-fields .rc267-banner-action>button{padding:7px 9px!important;font-size:12px!important;}} /* RC2.68: reuse the existing signed-in shell around Create and signed-in Home. No wizard markup, data or step handlers are changed. */ #app .ns-signed-in-shell .ns-shell-surface>.ns-shell-create, #app .ns-signed-in-shell .ns-shell-surface>.ns-shell-home{min-width:0;width:100%;max-width:100%;margin:0!important;} #app .ns-signed-in-shell .ns-shell-surface>.ns-shell-create{ min-height:calc(100vh - 84px);padding:0!important;background:transparent!important; } #app .ns-signed-in-shell .ns-shell-create .persistent-create-frame{ width:min(760px,100%);max-width:100%;min-width:0;min-height:calc(100vh - 118px); } #app .ns-signed-in-shell .ns-shell-home{min-width:0;overflow:visible;} #app .ns-signed-in-shell .ns-shell-home .lp-main, #app .ns-signed-in-shell .ns-shell-home .lp-content{max-width:100%;min-width:0;} /* Manager — the two cards share one row and one consistent height. */ #app .ns-signed-in-shell .ns-manager-feature-pair{ display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:stretch;gap:14px;min-width:0;width:100%; } #app .ns-signed-in-shell .ns-manager-feature-pair.ns-no-release{grid-template-columns:minmax(0,1fr);} #app .ns-signed-in-shell .ns-manager-feature-pair>.manager-card{margin:0!important;min-width:0;width:100%!important;height:100%!important;box-sizing:border-box;} #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature{ padding:18px!important;min-height:230px!important;display:flex!important;align-items:center; } #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .mkpi-feature-row{ display:grid!important;grid-template-columns:minmax(100px,40%) minmax(0,1fr)!important; width:100%!important;gap:14px!important;min-height:0!important;height:auto!important; flex-wrap:nowrap!important;align-items:center!important; } #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .mkpi-release-art{ width:100%!important;height:auto!important;min-width:0!important;max-width:150px!important; min-height:0!important;max-height:150px!important;aspect-ratio:1!important;flex:none!important; } #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .mkpi-release-copy{ display:flex!important;flex-direction:column!important;align-items:flex-start!important; justify-content:center!important;gap:6px!important;min-width:0!important;width:100%!important; grid-template-columns:none!important;grid-template-rows:none!important; } #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .mkpi-release-copy h3{ min-width:0!important;width:100%;font-size:clamp(19px,1.25vw,25px)!important;line-height:1.18!important; white-space:normal!important;text-overflow:clip!important;overflow:visible!important; display:block!important;overflow-wrap:anywhere;max-height:none!important; } #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .mkpi-release-copy .eyebrow{white-space:nowrap!important;font-size:12px!important;} #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .ns-latest-stats{ display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:10px!important; margin:5px 0 0!important;padding:0!important;grid-column:auto!important;grid-row:auto!important; justify-self:start!important;border:0!important; } #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .ns-latest-stats>span{display:flex;flex-direction:column;align-items:center;gap:1px;} #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .ns-latest-stats strong{font-size:16px!important;} #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .mkpi-release-actions{ display:flex!important;gap:8px!important;flex-wrap:wrap!important;white-space:normal!important; margin:5px 0 0!important; } #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .mkpi-release-actions>button{ min-height:44px!important;max-width:100%;white-space:nowrap!important;width:auto!important; padding:8px 12px!important;font-size:13px!important; } #app .ns-signed-in-shell .ns-create-tile{ min-height:230px;display:grid;grid-template-columns:minmax(0,1fr) auto; gap:16px;align-items:center;padding:28px!important;background:#101324;border:1px solid #333349; } #app .ns-signed-in-shell .ns-create-tile .ns-create-copy{min-width:0;display:flex;flex-direction:column;gap:9px;} #app .ns-signed-in-shell .ns-create-tile .ns-create-copy>.eyebrow{font-size:12px!important;} #app .ns-signed-in-shell .ns-create-tile h2{ font:normal clamp(21px,1.65vw,30px)/1.12 'DM Serif Display',Georgia,serif; margin:0!important;overflow-wrap:break-word;color:#fff; } #app .ns-signed-in-shell .ns-create-tile p{margin:0!important;color:#c4c4d5;font-size:13px!important;line-height:1.5;overflow-wrap:break-word;} #app .ns-signed-in-shell .ns-create-disc{ appearance:none;display:grid;place-items:center;flex:none;cursor:pointer; width:100px;height:100px;min-width:80px;min-height:80px;border-radius:50%!important; color:#fff!important;background:linear-gradient(125deg,#f13591,#8851ee)!important; border:0!important;box-shadow:0 8px 24px rgba(241,53,145,.35); transition:transform 180ms ease,filter 180ms ease,box-shadow 180ms ease; } #app .ns-signed-in-shell .ns-create-disc svg{width:38px;height:38px;stroke:currentColor;stroke-width:2;fill:none;} #app .ns-signed-in-shell .ns-create-disc:hover{filter:brightness(1.1);transform:translateY(-3px);} #app .ns-signed-in-shell .ns-create-disc:active{transform:translateY(1px);} #app .ns-signed-in-shell .ns-create-disc:focus-visible{outline:3px solid white!important;outline-offset:4px!important;} /* RC2.68: Edit Artist desktop heading and correctly sized portrait action. */ #app .ns-signed-in-shell .ns-content-inner>.ns-screen-heading:not(.ns-accessible-heading){display:block!important;} #app .ns-signed-in-shell .ns-edit-fields .artist-portrait-block :is(button,.secondary-cta){ width:auto!important;max-width:max-content!important;min-width:0!important;justify-self:start!important;flex:0 0 auto!important; } @media (min-width:1100px) and (max-width:1549px){ #app .ns-signed-in-shell .ns-manager-feature-pair{gap:10px;} #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature{padding:12px!important;} #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .mkpi-feature-row{ grid-template-columns:minmax(80px,36%) minmax(0,1fr)!important;gap:9px!important; } #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .mkpi-release-actions>button{padding:7px 9px!important;} #app .ns-signed-in-shell .ns-create-tile{padding:17px!important;gap:8px;} #app .ns-signed-in-shell .ns-create-disc{width:80px;height:80px;} } @media (max-width:1099px){ #app .ns-signed-in-shell .ns-manager-feature-pair{grid-template-columns:minmax(0,1fr);gap:14px;} #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature{min-height:0!important;padding:16px!important;} #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .mkpi-feature-row{grid-template-columns:110px minmax(0,1fr)!important;} #app .ns-signed-in-shell .ns-create-tile{min-height:160px;padding:20px!important;} #app .ns-signed-in-shell .ns-create-disc{width:80px;height:80px;} #app .ns-signed-in-shell .ns-shell-create{padding-bottom:calc(88px + env(safe-area-inset-bottom))!important;} #app .ns-signed-in-shell .ns-shell-create .persistent-create-frame{width:min(760px,100%);min-height:calc(100vh - 164px);border-radius:14px;} #app .ns-signed-in-shell .ns-shell-create .create-action-bar{bottom:0!important;padding-bottom:12px!important;z-index:9;} } @media (max-width:420px){ #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .mkpi-feature-row{grid-template-columns:95px minmax(0,1fr)!important;gap:10px!important;} #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .mkpi-release-art{max-width:95px!important;} #app .ns-signed-in-shell .ns-manager-feature-pair .mkpi-latest-feature .mkpi-release-actions{gap:6px!important;} #app .ns-signed-in-shell .ns-create-tile{gap:10px;padding:16px!important;} #app .ns-signed-in-shell .ns-create-tile h2{font-size:23px!important;} #app .ns-signed-in-shell .ns-create-disc{width:80px;height:80px;} } @media (prefers-reduced-motion: reduce){ #app .ns-signed-in-shell .ns-create-disc{transition:none!important;} #app .ns-signed-in-shell .ns-create-disc:hover{transform:none;} } /* RC2.68 phone/tablet Create: keep navigation and wizard actions in separate bands. */ @media(max-width:1099px){ #app .ns-signed-in-shell .ns-shell-surface>.ns-shell-create{ min-height:0!important; padding:0 0 16px!important; } #app .ns-signed-in-shell .ns-shell-create .persistent-create-frame{ height:calc(100dvh - 154px)!important; min-height:0!important; grid-template-rows:auto auto minmax(0,1fr) auto!important; overflow:hidden!important; } #app .ns-signed-in-shell .ns-shell-create .persistent-create-body{ min-height:0!important;overflow-y:auto!important;overscroll-behavior:contain; } #app .ns-signed-in-shell .ns-shell-create .create-action-bar{ flex-shrink:0;bottom:0!important;position:relative!important; min-height:64px;align-self:stretch; } } /* Direct /saved and /songs catalogue routes retain their original content inside the shell. */ #app .ns-signed-in-shell .ns-shell-surface>.ns-shell-library{margin:0!important;max-width:100%;min-width:0;width:100%!important;} #app .ns-signed-in-shell .ns-shell-library>.page-shell{max-width:100%!important;width:100%!important;min-width:0;padding-inline:0!important;} @media(max-width:1099px){#app .ns-signed-in-shell .ns-shell-library{padding-bottom:calc(84px + env(safe-area-inset-bottom))!important;}} /* RC2.83 A — only the two Save Artist DNA buttons within Edit Artist. Do not recolour the shared primary-cta/secondary-cta components elsewhere. */ #app .ns-signed-in-shell .ns-edit-fields.ns-edit-grid-shell .artist-setup-dock .artist-lock-actions > button[type="submit"], #app .ns-signed-in-shell .ns-edit-fields.ns-edit-grid-shell .ns-edit-open-actions > button[type="submit"]{ background:#fff!important;color:#0b0b12!important;border-color:#fff!important; box-shadow:0 3px 12px rgba(255,255,255,.09)!important; min-height:44px!important;transition:background-color .15s,box-shadow .15s,transform .15s!important; } #app .ns-signed-in-shell .ns-edit-fields.ns-edit-grid-shell :is(.artist-setup-dock .artist-lock-actions,.ns-edit-open-actions) > button[type="submit"]:not(:disabled):hover{ background:#f0f1f5!important;color:#0b0b12!important;border-color:#f0f1f5!important; box-shadow:0 4px 18px rgba(255,255,255,.16)!important; } #app .ns-signed-in-shell .ns-edit-fields.ns-edit-grid-shell :is(.artist-setup-dock .artist-lock-actions,.ns-edit-open-actions) > button[type="submit"]:focus-visible{ outline:3px solid #ffd1e9!important;outline-offset:3px!important; } #app .ns-signed-in-shell .ns-edit-fields.ns-edit-grid-shell :is(.artist-setup-dock .artist-lock-actions,.ns-edit-open-actions) > button[type="submit"]:disabled{ background:#c2c5cd!important;color:#292a32!important;border-color:#c2c5cd!important; opacity:.75!important;cursor:progress!important;box-shadow:none!important;transform:none!important; } @media(prefers-reduced-motion:reduce){ #app .ns-signed-in-shell .ns-edit-fields.ns-edit-grid-shell :is(.artist-setup-dock .artist-lock-actions,.ns-edit-open-actions) > button[type="submit"]{transition:none!important} } /* RC2.83 B — public artist pages only: share the signed-out header lane. Signed-in owner/shell boxes and <=800px phone profile intentionally untouched. */ @media(min-width:1101px){ #app .shell:not(.ns-signed-in-shell) .ds-profile:not(.ds-manager-profile) .artist-hero-shell{ padding-inline:var(--ds-header-gutter)!important; } #app .shell:not(.ns-signed-in-shell) .ds-profile:not(.ds-manager-profile) .artist-back-link{ left:var(--ds-header-gutter)!important; } #app .shell:not(.ns-signed-in-shell) .ds-profile:not(.ds-manager-profile) .artist-profile-grid{ box-sizing:border-box!important;width:calc(100% - 2 * var(--ds-header-gutter))!important; max-width:none!important;margin-inline:var(--ds-header-gutter)!important; padding-top:24px!important;gap:24px!important; } #app .shell:not(.ns-signed-in-shell) .ds-profile:not(.ds-manager-profile) .artist-profile-grid > :is(.artist-profile-left,.artist-profile-right,.ds-profile-middle){gap:24px!important} #app .shell:has(>.ds-profile:not(.ds-manager-profile)):not(.ns-signed-in-shell) > .footer{ box-sizing:border-box!important;width:calc(100% - 2 * var(--ds-header-gutter))!important; margin-inline:var(--ds-header-gutter)!important; } } @media(min-width:801px) and (max-width:1100px){ #app .shell:not(.ns-signed-in-shell) .ds-profile:not(.ds-manager-profile) .artist-hero-shell{ padding-inline:var(--ds-header-gutter)!important; } #app .shell:not(.ns-signed-in-shell) .ds-profile:not(.ds-manager-profile) .artist-back-link{ left:var(--ds-header-gutter)!important; } #app .shell:not(.ns-signed-in-shell) .ds-profile:not(.ds-manager-profile) .artist-profile-grid{ box-sizing:border-box!important;width:calc(100% - 2 * var(--ds-header-gutter))!important; max-width:none!important;margin-inline:var(--ds-header-gutter)!important; padding-top:16px!important;gap:16px!important; } #app .shell:not(.ns-signed-in-shell) .ds-profile:not(.ds-manager-profile) .artist-profile-grid > :is(.artist-profile-left,.artist-profile-right,.ds-profile-middle){gap:16px!important} #app .shell:has(>.ds-profile:not(.ds-manager-profile)):not(.ns-signed-in-shell) > .footer{ box-sizing:border-box!important;width:calc(100% - 2 * var(--ds-header-gutter))!important; margin-inline:var(--ds-header-gutter)!important; } } /* RC2.83 A state distinction: disabled is muted, saving is visibly in progress. */ #app .ns-signed-in-shell .ns-edit-fields.ns-edit-grid-shell :is(.artist-setup-dock .artist-lock-actions,.ns-edit-open-actions) > button[type="submit"]:disabled:not([aria-busy="true"]){ background:#c2c5cd!important;color:#292a32!important;border-color:#c2c5cd!important; opacity:.66!important;cursor:not-allowed!important; } #app .ns-signed-in-shell .ns-edit-fields.ns-edit-grid-shell :is(.artist-setup-dock .artist-lock-actions,.ns-edit-open-actions) > button[type="submit"]:disabled[aria-busy="true"]{ background:#e1e3e9!important;color:#292a32!important;border-color:#e1e3e9!important; opacity:.88!important;cursor:progress!important; } /* The existing editable-form handler inserts a spinner while saving. */ #app .ns-signed-in-shell .ns-edit-fields.ns-edit-grid-shell :is(.artist-setup-dock .artist-lock-actions,.ns-edit-open-actions) > button[type="submit"]:disabled:has(.spinner){ background:#e1e3e9!important;color:#292a32!important;border-color:#e1e3e9!important; opacity:.88!important;cursor:progress!important; } /* RC2.83a: only the signed-out public artist's guest invitation shares the header lane; public song invitations, signed-in owner and phone untouched. */ @media (min-width:1101px){ #app .shell:not(.ns-signed-in-shell) .ds-profile:not(.ds-manager-profile) > .share-artist-guest.page-shell{ box-sizing:border-box!important; width:calc(100% - 2 * var(--ds-header-gutter))!important; max-width:none!important; margin:24px var(--ds-header-gutter) 0!important; } } @media (min-width:801px) and (max-width:1100px){ #app .shell:not(.ns-signed-in-shell) .ds-profile:not(.ds-manager-profile) > .share-artist-guest.page-shell{ box-sizing:border-box!important; width:calc(100% - 2 * var(--ds-header-gutter))!important; max-width:none!important; margin:16px var(--ds-header-gutter) 0!important; } } /* RC2.84 private Creation Record. Scoped to its modal, never the public song view. */ .creation-record-overlay{z-index:12050;display:flex;align-items:center;justify-content:center;padding:16px;background:#02030ccd} .creation-record-modal{width:min(780px,calc(100vw - 32px));max-height:min(92dvh,980px);overflow:hidden;display:flex;flex-direction:column;gap:16px;background:linear-gradient(150deg,#13182b,#080c19);border:1px solid #65728e;border-radius:22px;padding:24px;color:#f4f5fb;box-shadow:0 24px 100px #000b} .creation-record-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.creation-record-head h2{font-size:clamp(21px,2.2vw,27px);margin:0} .creation-record-close{width:44px;height:44px;flex-shrink:0;border-radius:50%;background:#24293a;color:#fff;border:1px solid #8993a5;font-size:26px;cursor:pointer} .creation-record-selector{display:grid;gap:8px;font-size:13px;color:#d3d8e8}.creation-record-selector select{height:48px;min-width:0;padding:0 12px;background:#161c31;color:#fff;border:1px solid #8b94ac;border-radius:10px} .creation-record-meta{display:flex;flex-direction:column;gap:7px;color:#d3d9eb;font-size:13px}.creation-record-meta code{display:block;overflow-wrap:anywhere;color:#e3b9f1;font-size:12px} .creation-record-scroll{min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:8px;overscroll-behavior:contain} .creation-record-section{background:#161d30;border:1px solid #57647a;border-radius:12px;padding:0 12px} .creation-record-section summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:700;font-size:14px} .creation-record-section pre{padding:12px;margin:0 0 12px;max-height:320px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;color:#e9ebf8;font-size:12px;line-height:1.55;background:#090f20;border-radius:8px} .creation-record-disclaimer{font-size:12px;line-height:1.5;color:#c8d0e5;margin:0} .creation-record-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.creation-record-actions button{min-height:48px;padding:8px 12px;border-radius:12px;border:1px solid #929cb0;background:#f7f7fc;color:#10131c;font-weight:750;cursor:pointer} .creation-record-actions button:last-child{background:#222a3f;color:#fff} .creation-record-modal button:focus-visible,.creation-record-modal select:focus-visible,.creation-record-modal summary:focus-visible{outline:3px solid #f673c0;outline-offset:3px} @media(max-width:700px){.creation-record-modal{padding:16px;gap:12px;border-radius:16px;max-height:calc(100dvh - 28px)}.creation-record-scroll{flex:1;min-height:0}.creation-record-actions button{min-height:44px}} /* RC2.84b — creator-facing Song recipe (the stored audit JSON is unchanged). */ body > .song-recipe-overlay, body.ns-phone-active > .song-recipe-overlay{z-index:12050!important;} .song-recipe-modal{width:min(850px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:24px;gap:14px;box-sizing:border-box;} .song-recipe-modal .creation-record-scroll{display:flex;flex-direction:column;gap:16px;overflow:auto;min-height:0;overscroll-behavior:contain;padding:0 3px 3px 0;} .song-recipe-modal .creation-record-head{flex:0 0 auto;} .song-recipe-modal .creation-record-selector{flex:0 0 auto;} .song-recipe-song-head{display:flex;gap:16px;align-items:center;padding:4px 0 10px;min-width:0;} .song-recipe-song-head>img,.song-recipe-cover-placeholder{width:98px;height:98px;flex:0 0 98px;object-fit:cover;border:1px solid #686a89;border-radius:16px;background:linear-gradient(140deg,#713461,#2c294e 50%,#101423);} .song-recipe-song-head>div{min-width:0;} .song-recipe-overline{display:block;color:#f0a5d2;letter-spacing:.1em;font-size:12px;font-weight:800;} .song-recipe-song-head h3{font-size:clamp(23px,3vw,31px);line-height:1.13;overflow-wrap:anywhere;margin:5px 0;} .song-recipe-song-head p{font-size:15px;color:#f2d2e8;margin:5px 0;} .song-recipe-song-head small{display:block;font-size:12px;color:#d4d9e7;line-height:1.4;} .song-recipe-partial{background:#222239;border:1px solid #80738a;border-radius:11px;padding:14px;color:#f2d8ed;font-size:13px;margin:0;} .song-recipe-card{position:relative;display:block;min-width:0;padding:19px 20px;background:#171c2f;border:1px solid #5e6780;border-radius:17px;} .song-recipe-card h3{font-size:18px;line-height:1.28;margin:0 0 13px;font-weight:750;color:#f9f4fc;} .song-recipe-card p{margin:0 0 12px;color:#e0e3f0;font-size:14px;line-height:1.55;overflow-wrap:anywhere;} .song-recipe-card>small{font-size:12px;color:#d5bad6;} .song-recipe-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-width:0;} .song-recipe-field{min-width:0;display:grid;gap:5px;padding:12px 13px;border-radius:11px;background:#232940;border:1px solid #424c63;} .song-recipe-field>span,.song-recipe-chip small{display:block;color:#d5d9e9;font-size:12px;line-height:1.2;} .song-recipe-field>strong,.song-recipe-chip strong{display:block;color:#fff;font-size:14px;font-weight:700;line-height:1.38;overflow-wrap:anywhere;} .song-recipe-chips{display:flex;flex-wrap:wrap;gap:10px;} .song-recipe-chip{display:grid;gap:5px;min-width:90px;max-width:100%;padding:10px 12px;border-radius:13px;border:1px solid #80608e;background:rgba(143,60,120,.17);} .song-recipe-locked{display:inline-flex;min-height:32px;align-items:center;margin-top:12px;padding:0 12px;border-radius:20px;font-size:12px;font-weight:700;color:#f5ecfc;background:#403651;} .song-recipe-technical{padding:0;overflow:visible;} .song-recipe-technical>summary{cursor:pointer;display:flex;align-items:center;min-height:52px;padding:10px 20px;font-size:16px;font-weight:750;} .song-recipe-tech-body{display:grid;gap:16px;padding:0 20px 20px;} .song-recipe-tech-body .song-recipe-fields{grid-template-columns:1fr;} .song-recipe-tech-body .song-recipe-field>strong{font-size:12px;overflow-wrap:anywhere;} .song-recipe-prompt{border:1px solid #626c86;border-radius:10px;overflow:hidden;} .song-recipe-prompt>summary{cursor:pointer;display:flex;align-items:center;min-height:44px;padding:9px 12px;font-size:13px;font-weight:750;} .song-recipe-prompt pre{margin:0;padding:12px;background:#0a1021;max-height:240px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.5;color:#e7e4f5;} .song-recipe-modal .creation-record-disclaimer{flex:0 0 auto;padding-top:11px;border-top:1px solid #424b67;font-size:12px;} .song-recipe-modal :is(button,select,summary):focus-visible{outline:3px solid #ff83cf!important;outline-offset:3px;} .song-recipe-modal .creation-record-actions{margin:0;} .song-recipe-modal .creation-record-actions button{min-height:48px;} @media(max-width:700px){ body > .song-recipe-overlay{padding:0!important;align-items:stretch!important;} .song-recipe-modal{width:100%;max-width:none;max-height:100dvh;height:100dvh;border:0;border-radius:0;padding:calc(12px + env(safe-area-inset-top)) 16px calc(16px + env(safe-area-inset-bottom));gap:12px;} .song-recipe-modal .creation-record-scroll{flex:1;} .song-recipe-song-head{gap:12px;} .song-recipe-song-head>img,.song-recipe-cover-placeholder{width:72px;height:72px;flex-basis:72px;border-radius:11px;} .song-recipe-song-head h3{font-size:22px;} .song-recipe-card{padding:15px 14px;} .song-recipe-fields{grid-template-columns:1fr;gap:9px;} .song-recipe-technical>summary{padding-left:14px;} .song-recipe-tech-body{padding:0 14px 14px;} } @media(prefers-reduced-motion:reduce){.song-recipe-modal *{scroll-behavior:auto!important;transition:none!important;}} .song-recipe-version-date{display:block;font-size:12px;color:#d5d9e8;line-height:1.35;} /* RC2.84d — compact creator account actions; artist phone sheet only. */ @media (max-width:1099px) { body > .sheet-backdrop:has(> .account-sheet.rc284d-phone-sheet) { align-items:flex-end!important; justify-content:center!important; padding:0!important; box-sizing:border-box; z-index:1001!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet { position:relative!important; box-sizing:border-box!important; width:100%!important; max-width:520px!important; min-width:0!important; height:auto!important; min-height:0!important; max-height:calc(100dvh - 8px)!important; display:flex!important; flex-direction:column!important; gap:12px!important; overflow-x:hidden!important; overflow-y:auto!important; overscroll-behavior:contain; margin:0!important; padding:12px 16px max(16px,env(safe-area-inset-bottom))!important; background:linear-gradient(165deg,#1d1b30 0%,#141525 65%,#111521 100%)!important; color:#f6f3ff!important; border:1px solid #50465e!important; border-bottom:none!important; border-radius:22px 22px 0 0!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .sheet-handle { flex:none!important; display:block!important; align-self:center!important; width:42px!important; height:4px!important; min-height:4px!important; padding:0!important; margin:0 auto 0!important; border-radius:4px!important; background:#73667e!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .sheet-close { position:absolute!important; top:20px!important; right:12px!important; display:flex!important; align-items:center!important; justify-content:center!important; min-width:44px!important; min-height:44px!important; width:44px!important; height:44px!important; border:1px solid transparent!important; border-radius:12px!important; color:#fff!important; background:transparent!important; z-index:2!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .sheet-close svg {width:20px!important;height:20px!important;stroke:currentColor!important;fill:none!important;stroke-width:1.8!important;} body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-identity-compact { display:grid!important; grid-template-columns:56px minmax(0,1fr)!important; gap:12px!important; align-items:center!important; min-height:60px!important; margin:0!important; padding:0 44px 0 0!important; border:0!important; background:none!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-identity-compact img { display:block!important; width:56px!important; height:56px!important; min-width:56px!important; border-radius:15px!important; object-fit:cover!important; border:1px solid #6a4d74!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-identity-compact > div {min-width:0!important;} body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-identity-compact span { display:block!important; font-size:12px!important; letter-spacing:.11em!important; color:#f7a5d1!important; line-height:1.3!important; margin:0 0 3px!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-identity-compact h2 { display:block!important; font-size:21px!important; font-weight:750!important; line-height:1.1!important; letter-spacing:-.02em!important; color:#fff!important; margin:0 0 5px!important; overflow-wrap:anywhere!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-identity-compact p { font-size:12px!important; line-height:1.3!important; margin:0!important; color:#cdc5dc!important; overflow-wrap:anywhere!important; display:-webkit-box!important; -webkit-line-clamp:2!important; -webkit-box-orient:vertical!important; overflow:hidden!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-phone-credits { box-sizing:border-box!important; width:100%!important; min-height:66px!important; display:grid!important; grid-template-columns:auto 1fr auto!important; column-gap:10px!important; align-items:center!important; padding:10px 12px!important; margin:0!important; border:1px solid #614b73!important; border-radius:15px!important; background:linear-gradient(120deg,#30243f,#25243b)!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-phone-credits .account-credit-number { font-size:34px!important; line-height:1!important; font-weight:800!important; color:#fff!important; margin:0!important; white-space:nowrap!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-phone-credits .account-credit-name { color:#f6eaf9!important; font-size:14px!important; font-weight:600!important; line-height:1.2!important; margin:0!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-phone-credits .credit-offer-information { display:block!important; font-size:12px!important; line-height:1.3!important; color:#dfcde4!important; text-align:right!important; font-weight:400!important; margin:0!important; max-width:134px!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-phone-actions { display:flex!important; flex-direction:column!important; gap:12px!important; min-width:0!important; width:100%!important; margin:0!important; padding:0!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-action-grid { display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:10px!important; min-width:0!important; width:100%!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-action-tile { box-sizing:border-box!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; gap:8px!important; min-width:0!important; width:100%!important; min-height:84px!important; height:84px!important; padding:8px 5px!important; margin:0!important; border-radius:16px!important; border:1px solid #554961!important; background:#29263b!important; color:#fdf8ff!important; box-shadow:none!important; font-family:inherit!important; cursor:pointer!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-action-tile:hover, body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-action-tile:active { background:#39314c!important; border-color:#b87aa5!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-action-icon { width:24px!important; height:24px!important; flex:0 0 24px!important; display:flex!important; align-items:center!important; justify-content:center!important; color:#ff90ca!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-action-icon svg { display:block!important; width:24px!important; height:24px!important; stroke:currentColor!important; fill:none!important; stroke-width:1.75!important; stroke-linecap:round!important; stroke-linejoin:round!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-action-label { font-size:12px!important; font-weight:650!important; line-height:1.2!important; text-align:center!important; color:#fff!important; white-space:normal!important; overflow-wrap:normal!important; word-break:normal!important; margin:0!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-owner-section { display:flex!important; flex-direction:column!important; gap:7px!important; margin:0!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-owner-label { font-size:12px!important; line-height:1.3!important; font-weight:700!important; letter-spacing:.14em!important; color:#c9b8d3!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-owner-actions { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:10px!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-owner-action { box-sizing:border-box!important; width:100%!important; min-width:0!important; min-height:44px!important; display:flex!important; justify-content:center!important; align-items:center!important; padding:9px 8px!important; border:1px dashed #ad8aa7!important; border-radius:12px!important; background:#29263b!important; color:#fefaff!important; font-size:13px!important; font-weight:650!important; font-family:inherit!important; cursor:pointer!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-owner-action:hover {background:#3b3049!important;} body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-signout { box-sizing:border-box!important; display:flex!important; justify-content:center!important; align-items:center!important; width:100%!important; min-height:44px!important; height:44px!important; padding:8px!important; margin:0!important; font-size:14px!important; font-weight:650!important; color:#f7e8f3!important; background:#272337!important; border:1px solid #554961!important; border-radius:12px!important; box-shadow:none!important; } body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-signout:hover {background:#39314b!important;} body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet :is(button):focus-visible { outline:3px solid #ffb8df!important; outline-offset:2px!important; } @media(max-width:350px) { body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet {padding-left:12px!important;padding-right:12px!important;gap:10px!important;} body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-phone-credits {grid-template-columns:auto 1fr!important;row-gap:5px!important;} body > .sheet-backdrop > .account-sheet.rc284d-phone-sheet .account-phone-credits .credit-offer-information {grid-column:1/-1!important;text-align:left!important;max-width:none!important;} } } /* RC2.87 Part A/B — signed-in phone credits, explicit low/zero recording balance. */ @media(max-width:1099px){ #app .ns-signed-in-shell .ns-app-header .ns-header-balance{display:flex!important;visibility:visible!important;opacity:1!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;flex:0 0 auto!important;width:66px!important;min-width:66px!important;min-height:44px!important;height:48px!important;padding:3px 5px!important;margin:0!important;gap:0!important;line-height:1.1!important;border:1px solid #929ab8!important;border-radius:12px!important;background:#20243b!important;color:#fff!important;white-space:nowrap!important} #app .ns-signed-in-shell .ns-app-header .ns-header-balance>small{display:none!important} #app .ns-signed-in-shell .ns-app-header .ns-header-balance strong{display:flex!important;flex-direction:column!important;align-items:center!important;gap:1px!important;font-weight:700!important;line-height:1.1!important} #app .ns-signed-in-shell .ns-app-header .ns-header-balance .rc287-balance-value{font-size:20px!important;color:#fff!important} #app .ns-signed-in-shell .ns-app-header .ns-header-balance .rc287-balance-unit{font-size:12px!important;font-weight:500!important;color:#e4e8f3!important} #app .ns-signed-in-shell .ns-app-header .ns-header-balance.rc287-low{background:#4a3112!important;border-color:#e5ae53!important} #app .ns-signed-in-shell .ns-app-header .ns-header-balance.rc287-zero{background:#512334!important;border-color:#f0a2af!important} #app .ns-signed-in-shell .ns-app-header .ds-header-inner{min-width:0!important;gap:6px!important} #app .ns-signed-in-shell .ns-app-header .ds-header-actions{margin-left:auto!important;min-width:0!important;gap:6px!important} #app .ns-signed-in-shell .ns-app-header .ns-header-balance:focus-visible{outline:3px solid #fff!important;outline-offset:2px!important} } @media(max-width:345px){ #app .ns-signed-in-shell .ns-app-header .ns-header-balance{width:46px!important;min-width:46px!important} #app .ns-signed-in-shell .ns-app-header .ns-header-balance .rc287-balance-unit{display:none!important} } #app .rc287-credit-alert{width:100%;max-width:100%;box-sizing:border-box;border-radius:12px;border:1px solid #bc9955;background:#342714;color:#fff;padding:14px 16px;margin:0 0 14px;font-size:clamp(13px,1.2vw,15px);line-height:1.55} #app .rc287-credit-alert.rc287-credit-zero{border-color:#e6a3b1;background:#3f1f2d} #app .rc287-credit-alert strong{display:block;font-size:clamp(18px,1.9vw,22px);color:#fff;line-height:1.35} #app .rc287-credit-alert p{margin:8px 0 0;color:#fff} #app .rc287-saved-draft{padding:16px;border-radius:10px;border:1px solid #868ba7;background:#1a1e2c;color:#eee;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px} #app .rc287-zero-idea{min-width:0} /* RC2.97: public artist's tiny invitation note is explanatory, not a status badge. */ @media(max-width:760px){ #app .ds-profile .share-guest-invitation>.eyebrow{font-size:12px!important} #app .ds-profile .share-guest-invitation>small{font-size:14px!important;line-height:1.45!important} } /* RC2.98 — approved list-first Songs page at phone widths only. Artist, Manager, Chart, API and every desktop selector retain their RC2.97 behaviour. */ @media (max-width:430px){ #app .ns-signed-in-shell .rc298-songs-screen.ns-shell-manager .ns-compact-hero.artist-profile-stage, #app .ns-signed-in-shell .rc298-songs-screen.ns-shell-manager .ns-compact-hero .artist-hero-shell, #app .ns-signed-in-shell .rc298-songs-screen.ns-shell-manager .ns-compact-hero .artist-hero-v2{ height:148px!important;min-height:148px!important;max-height:148px!important; } #app .ns-signed-in-shell .rc298-songs-screen .ns-compact-hero .artist-hero-v2>.artist-hero-main{bottom:12px!important;} #app .ns-signed-in-shell .rc298-songs-screen .ns-shell-layout{width:calc(100% - 32px)!important;} #app .ns-signed-in-shell .rc298-songs-screen .ns-content-inner{gap:0!important;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-heading-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 16px;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-heading-row .ns-screen-heading{font-size:29px!important;line-height:1.2!important;margin:0!important;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-heading-row .ns-phone-stats-link{ margin:0!important;min-height:44px!important;height:44px!important;padding:8px 15px!important;align-self:center!important; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-phone-songs{width:100%;min-width:0;} #app .ns-signed-in-shell .rc298-songs-screen .catalogue-board{border:0!important;border-radius:0!important;overflow:visible!important;background:transparent!important;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-toolbar{ display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-rows:52px 48px!important; align-items:stretch!important;justify-content:stretch!important;gap:10px!important; border:0!important;padding:0!important;margin:0 0 16px!important;box-sizing:border-box!important; } #app .ns-signed-in-shell .rc298-songs-screen .catalogue-filters{ display:grid!important;grid-column:1/-1!important;grid-row:1!important;grid-template-columns:repeat(3,minmax(0,1fr))!important; align-items:stretch!important;justify-content:stretch!important;gap:4px!important; width:100%!important;min-width:0!important;min-height:52px!important;margin:0!important; padding:4px!important;box-sizing:border-box!important;border:1px solid rgba(255,255,255,.1)!important; border-radius:14px!important;background:#10121f!important; } #app .ns-signed-in-shell .rc298-songs-screen .catalogue-filters button{ display:flex!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:center!important;gap:4px!important; min-width:0!important;min-height:44px!important;height:44px!important;box-sizing:border-box!important; border:1px solid transparent!important;border-radius:10px!important;background:transparent!important; padding:2px 4px!important;color:#cbd3df!important;font-size:15px!important;font-weight:700!important; white-space:nowrap!important;overflow:hidden!important; } #app .ns-signed-in-shell .rc298-songs-screen .catalogue-filters button small{font-size:14px!important;color:#9da0b2!important;opacity:1!important;} #app .ns-signed-in-shell .rc298-songs-screen .catalogue-filters button.active{ background:linear-gradient(110deg,rgba(255,45,138,.28),rgba(155,92,255,.22))!important; border-color:#ff2d8a!important;color:white!important;font-weight:800!important; } #app .ns-signed-in-shell .rc298-songs-screen .catalogue-filters button.active small{color:#ffb3d6!important;} #app .ns-signed-in-shell .rc298-songs-screen .catalogue-sort{ display:flex!important;grid-row:2!important;grid-column:1!important;min-width:0!important; height:48px!important;align-items:center!important;justify-content:flex-start!important;gap:7px!important; padding:0 10px!important;box-sizing:border-box!important;border:1px solid rgba(255,255,255,.16)!important; border-radius:12px!important;background:#10121f!important;color:#9da0b2!important; font-size:14px!important;font-weight:500!important; } #app .ns-signed-in-shell .rc298-songs-screen .catalogue-sort select{ width:100%!important;max-width:none!important;min-width:0!important;height:46px!important;min-height:46px!important; flex:1 1 0!important;border:0!important;outline-offset:2px!important;background:transparent!important; color:#fff!important;font-size:16px!important;font-weight:700!important;padding:0 19px 0 0!important; } #app .ns-signed-in-shell .rc298-songs-screen .ns-view-toggle{ display:flex!important;grid-column:2!important;grid-row:2!important;align-items:center!important;justify-content:center!important; height:48px!important;gap:4px!important;padding:2px!important;box-sizing:border-box!important; margin:0!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:12px!important;background:#10121f!important; } #app .ns-signed-in-shell .rc298-songs-screen .ns-view-toggle button{ width:44px!important;min-width:44px!important;max-width:44px!important;height:44px!important;min-height:44px!important; display:grid!important;place-items:center!important;padding:0!important;border:1px solid transparent!important; border-radius:9px!important;background:transparent!important;color:#cbd3df!important; } #app .ns-signed-in-shell .rc298-songs-screen .ns-view-toggle button.active{ border-color:#ff2d8a!important;color:#fff!important; background:linear-gradient(110deg,rgba(255,45,138,.28),rgba(155,92,255,.22))!important; } #app .ns-signed-in-shell .rc298-songs-screen .ns-view-toggle svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;} #app .ns-signed-in-shell .rc298-songs-screen .catalogue-results{width:100%;min-width:0;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-song-list{display:flex;flex-direction:column;gap:10px;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-song-row{ display:grid;grid-template-columns:64px minmax(0,1fr) 44px 44px;align-items:center; min-width:0;width:100%;gap:8px;box-sizing:border-box;padding:10px 4px 10px 10px; background:#10121f;border:1px solid rgba(255,255,255,.1);border-radius:16px; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-row-cover{ position:relative;width:64px;min-width:64px;height:64px;display:block;overflow:hidden; border:0;padding:0;border-radius:10px;background-size:cover;background-position:center; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-row-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-row-info{min-width:0;display:flex;flex-direction:column;gap:4px;align-items:flex-start;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-row-title{ width:100%;min-width:0;min-height:44px;max-height:52px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical; overflow:hidden;white-space:normal;word-break:normal;overflow-wrap:break-word;text-overflow:clip; padding:0;background:transparent;border:0;color:#fff;font-size:16px;font-weight:800;line-height:1.3;text-align:left; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-row-meta{ width:100%;color:#b9beda;font-size:14px;line-height:1.35;white-space:normal;overflow-wrap:normal; display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-row-counts{ display:block;font-size:13px;line-height:1.35;white-space:nowrap;min-width:0; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-row-play, #app .ns-signed-in-shell .rc298-songs-screen .rc298-row-more{ display:grid;place-items:center;min-width:44px!important;width:44px!important;height:44px!important;min-height:44px!important; border-radius:50%!important;color:#fff!important;flex:0 0 44px;padding:0!important; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-row-play{ background:linear-gradient(125deg,#ff2d8a,#965cff)!important;border:1px solid rgba(255,255,255,.16)!important; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-row-more{background:#151a2b!important;border:1px solid rgba(255,255,255,.16)!important;} #app .ns-signed-in-shell .rc298-songs-screen :is(.rc298-row-play,.rc298-row-more) svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-row-play svg{fill:currentColor;stroke:none;} #app .ns-signed-in-shell .rc298-songs-screen .ns-tiles-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;margin:0!important;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile{ min-width:0;display:flex;flex-direction:column;overflow:visible!important;border-radius:16px!important; background:#10121f!important;border:1px solid rgba(255,255,255,.1)!important;box-shadow:none!important; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-cover{border-radius:15px 15px 0 0!important;overflow:hidden;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-cover-status{ position:static!important;align-self:flex-start!important;display:inline-flex!important;align-items:center!important; width:max-content!important;max-width:calc(100% - 16px)!important;margin:6px 8px 0!important;padding:3px 8px!important; min-height:24px!important;box-sizing:border-box!important;border-radius:999px!important;font-size:12px!important;font-weight:800!important; background:rgba(7,8,15,.78)!important;border:1px solid rgba(255,255,255,.15)!important;color:#fff!important; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-details{padding:6px 8px 10px!important;display:flex;flex-direction:column;flex:1;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile-heading{display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:start;gap:3px;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-title{ font-size:15px!important;font-weight:800!important;line-height:1.3!important;min-width:0!important;min-height:44px!important; white-space:normal!important;overflow-wrap:break-word!important;overflow:visible!important;text-overflow:clip!important; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-meta{font-size:14px!important;line-height:1.4!important;color:#b9beda!important;margin:2px 0 6px!important;white-space:normal!important;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-actions{display:flex!important;align-items:flex-start!important;justify-content:flex-end!important;margin:0!important;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .catalogue-actions-trigger{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .rc298-tile-footer{ margin-top:auto;display:flex;align-items:end;justify-content:space-between;gap:4px;min-width:0; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-stats{ min-width:0;flex:1;display:flex!important;flex-direction:column;align-items:flex-start; gap:3px!important;margin:0!important;padding-top:6px; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-stats>span{ display:flex!important;flex-direction:row!important;align-items:baseline;flex-wrap:wrap;column-gap:5px;row-gap:0; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-stats b{font-size:15px!important;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-stats small{font-size:12px!important;letter-spacing:-.02em;} /* RC2.100 — centred ghost Play on mobile Tiles only. Cover remains otherwise unobstructed. */ #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-cover .rc298-tile-play{ position:absolute!important;top:50%!important;left:50%!important;right:auto!important;bottom:auto!important; transform:translate(-50%,-50%)!important;z-index:3!important; display:grid!important;place-items:center!important;box-sizing:border-box!important; width:52px!important;height:52px!important;min-width:52px!important;min-height:52px!important; margin:0!important;padding:0!important;border-radius:50%!important; background:transparent!important;border:2px solid rgba(255,255,255,.95)!important; color:rgba(255,255,255,.85)!important;box-shadow:none!important; backdrop-filter:none!important;-webkit-backdrop-filter:none!important; filter:drop-shadow(0 0 3px rgba(0,0,0,.78))!important; transition:transform 120ms ease,border-color 120ms ease,color 120ms ease!important; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-cover .rc298-tile-play svg{ width:22px!important;height:22px!important;fill:currentColor!important; filter:drop-shadow(0 0 2px rgba(0,0,0,.72));pointer-events:none; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-cover .rc298-tile-play:hover:not(:disabled), #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-cover .rc298-tile-play:focus-visible{ background:transparent!important;border-color:#fff!important;color:#fff!important; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-cover .rc298-tile-play:active{ transform:translate(-50%,-50%) scale(.96)!important;border-color:#fff!important;color:#fff!important; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-tile .ns-tile-cover .rc298-tile-play:focus-visible{ outline:3px solid #ff2d8a!important;outline-offset:3px!important; } /* RC2.99 — three-column stats for multi-song tiles retained unchanged. */ #app .ns-signed-in-shell .rc298-songs-screen .ns-tiles-grid:not(.rc298-single-tile) .rc298-tile-footer{display:block!important;} #app .ns-signed-in-shell .rc298-songs-screen .ns-tiles-grid:not(.rc298-single-tile) .ns-tile-stats{ display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:2px!important; align-items:start;justify-content:stretch;margin:0!important;padding-top:5px; } #app .ns-signed-in-shell .rc298-songs-screen .ns-tiles-grid:not(.rc298-single-tile) .ns-tile-stats>span{ display:flex!important;flex-direction:column!important;align-items:center!important;flex-wrap:nowrap!important; min-width:0;gap:2px!important;text-align:center;white-space:nowrap; } #app .ns-signed-in-shell .rc298-songs-screen .ns-tiles-grid:not(.rc298-single-tile) .ns-tile-stats small{ font-size:12px!important;line-height:1.25!important;letter-spacing:-.025em!important; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-single-tile{grid-template-columns:minmax(0,1fr)!important;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-single-tile .rc298-tile{ display:grid!important;grid-template-columns:128px minmax(0,1fr);grid-template-rows:128px auto;gap:0 8px; padding:10px;box-sizing:border-box;align-items:start;overflow:visible; } #app .ns-signed-in-shell .rc298-songs-screen .rc298-single-tile .ns-tile-cover{width:128px!important;height:128px!important;aspect-ratio:1!important;border-radius:10px!important;grid-column:1;grid-row:1;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-single-tile .rc298-cover-status{grid-column:1;grid-row:2;margin:6px 0 0!important;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-single-tile .ns-tile-details{grid-column:2;grid-row:1/3;padding:0!important;min-width:0;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-single-tile .ns-tile-title{font-size:17px!important;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-single-tile .ns-tile-stats b{font-size:18px!important;} #app .ns-signed-in-shell .rc298-songs-screen .catalogue-more-results{min-height:44px!important;margin:12px auto;} } @media(max-width:375px){ #app .ns-signed-in-shell .rc298-songs-screen .catalogue-filters button{font-size:14px!important;} #app .ns-signed-in-shell .rc298-songs-screen .catalogue-filters button small{font-size:12px!important;} #app .ns-signed-in-shell .rc298-songs-screen .rc298-song-row{gap:6px!important;} }