/* Roberto Sound — Shatlyk-style agency motion system.
   Independent CSS implementation based on the user-supplied visual reference.
   Core V15 functionality remains in styles-v15.css and app-v15-language-fix.js. */

:root{
  --rs-bg:#0d0c0f;
  --rs-bg-2:#151318;
  --rs-panel:#222127;
  --rs-drawer:#343434;
  --rs-text:#f0edf2;
  --rs-muted:#8f8a94;
  --rs-line:rgba(255,255,255,.13);
  --rs-accent:#b75cff;
  --rs-accent-2:#ff3aac;
  --rs-accent-3:#59d88b;
  --rs-menu-size:clamp(390px,32vw,610px);
  color-scheme:dark;
}
html{background:var(--rs-bg);scroll-behavior:smooth}
body{margin:0;background:var(--rs-bg)!important;color:var(--rs-text)!important;overflow-x:hidden;cursor:auto}
body::before{
  content:"";position:fixed;inset:0;z-index:-4;pointer-events:none;
  background:
    radial-gradient(circle at 16% 4%,rgba(104,17,140,.24),transparent 25%),
    radial-gradient(circle at 84% 20%,rgba(27,104,82,.18),transparent 28%),
    linear-gradient(180deg,#0d0c0f 0%,#111014 52%,#0b0b0d 100%);
}
#robertoAmbientCanvas{position:fixed;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none;opacity:.92;mix-blend-mode:screen}
#robertoSmokeCanvas{position:fixed!important;inset:0!important;width:100%!important;height:100%!important;z-index:5!important;pointer-events:none!important;opacity:.60!important;mix-blend-mode:screen!important}
.site-grid{position:relative;z-index:2;transition:filter .55s cubic-bezier(.645,.045,.355,1),transform .55s cubic-bezier(.645,.045,.355,1);background:transparent!important}
body.roberto-menu-open{overflow:hidden}
body.roberto-menu-open .site-grid{filter:brightness(.40) saturate(.72);transform:translateX(-1.3vw) scale(.995)}

/* Hide the old horizontal navigation, but keep its buttons in DOM for app bindings. */
.masthead{background:transparent!important;border-color:var(--rs-line)!important;padding-top:clamp(90px,8vw,135px)!important}
.main-nav{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important}
.brand-row{border-color:var(--rs-line)!important}
.brand-title{color:#d9d5dc!important;letter-spacing:-.075em!important;text-shadow:none!important;opacity:.92}
.brand-note,.section-kicker,.status-line{color:var(--rs-muted)!important}

/* Fixed corner identity, like the supplied agency reference but unique to Roberto Sound. */
.roberto-agency-chrome{position:relative;z-index:7000}
.roberto-corner-brand{position:fixed;left:clamp(22px,2vw,42px);top:clamp(22px,2vw,38px);z-index:7002;width:clamp(62px,5.2vw,90px);height:clamp(62px,5.2vw,90px);display:grid;place-items:center;text-decoration:none;color:#d8d4dc;transition:opacity .3s ease,transform .4s cubic-bezier(.16,1,.3,1)}
.roberto-corner-brand:hover{transform:rotate(-6deg) scale(1.045);opacity:.82}
.roberto-brand-sun{position:relative;width:100%;height:100%;display:grid;place-items:center;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(213,209,219,.56) 0 7deg,transparent 7deg 14deg);filter:drop-shadow(0 8px 22px rgba(0,0,0,.25))}
.roberto-brand-sun::before{content:"";position:absolute;inset:20%;border-radius:50%;background:#333138;border:1px solid rgba(255,255,255,.18)}
.roberto-brand-sun b{position:relative;z-index:1;font:700 clamp(15px,1.35vw,22px)/1 system-ui,sans-serif;letter-spacing:.02em}

.roberto-agency-menu-toggle{position:fixed;right:clamp(24px,2.25vw,44px);top:clamp(24px,2.25vw,42px);z-index:7200;width:clamp(68px,4.8vw,90px);height:clamp(68px,4.8vw,90px);border:0!important;border-radius:50%!important;background:#bebbb9!important;color:#353434!important;display:grid!important;place-items:center!important;padding:0!important;box-shadow:0 12px 34px rgba(0,0,0,.20);transition:transform .4s cubic-bezier(.16,1,.3,1),background .3s ease!important;cursor:pointer}
.roberto-agency-menu-toggle:hover{transform:scale(1.055);background:#d1cecc!important}
.roberto-agency-menu-toggle span{position:absolute;width:34%;height:2px;background:#454343;border-radius:4px;transition:transform .45s cubic-bezier(.76,0,.24,1),top .45s cubic-bezier(.76,0,.24,1)}
.roberto-agency-menu-toggle span:first-child{transform:translateY(-5px)}
.roberto-agency-menu-toggle span:last-child{transform:translateY(5px)}
body.roberto-menu-open .roberto-agency-menu-toggle span:first-child{transform:rotate(45deg)}
body.roberto-menu-open .roberto-agency-menu-toggle span:last-child{transform:rotate(-45deg)}

.roberto-agency-backdrop{position:fixed;inset:0;z-index:7050;background:rgba(4,4,5,.54);backdrop-filter:blur(2px);opacity:0;transition:opacity .45s ease}
.roberto-agency-backdrop.is-open{opacity:1}
.roberto-agency-menu{position:fixed;right:0;top:0;z-index:7100;width:var(--rs-menu-size);height:100dvh;box-sizing:border-box;background:var(--rs-drawer);color:#f0edef;padding:clamp(130px,9.5vw,190px) clamp(48px,5vw,94px) clamp(42px,3.4vw,70px) clamp(58px,5vw,100px);transform:translate3d(calc(100% + 100px),0,0);visibility:hidden;transition:transform .62s cubic-bezier(.645,.045,.355,1),visibility 0s linear .62s;box-shadow:-25px 0 70px rgba(0,0,0,.24);display:flex;flex-direction:column}
.roberto-agency-menu.is-open{transform:translate3d(0,0,0);visibility:visible;transition:transform .62s cubic-bezier(.645,.045,.355,1),visibility 0s}
.roberto-agency-menu-head{padding-bottom:clamp(8px,.55vw,14px);border-bottom:1px solid rgba(255,255,255,.18);margin-bottom:clamp(24px,2.2vw,44px);color:#aaa6ad;font:500 clamp(11px,.78vw,15px)/1.2 system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase}
.roberto-agency-menu-links{display:flex;flex-direction:column;align-items:flex-start;gap:0;margin:0 0 auto}
.roberto-agency-menu-links a{position:relative;color:#f2eff3;text-decoration:none;font:650 clamp(37px,3vw,58px)/1.17 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:.01em;padding:2px 0;transform:translateX(45px);opacity:0;transition:transform .7s cubic-bezier(.76,0,.24,1),opacity .45s ease,color .25s ease}
.roberto-agency-menu.is-open .roberto-agency-menu-links a{transform:translateX(0);opacity:1}
.roberto-agency-menu.is-open .roberto-agency-menu-links a:nth-child(1){transition-delay:.12s}.roberto-agency-menu.is-open .roberto-agency-menu-links a:nth-child(2){transition-delay:.16s}.roberto-agency-menu.is-open .roberto-agency-menu-links a:nth-child(3){transition-delay:.20s}.roberto-agency-menu.is-open .roberto-agency-menu-links a:nth-child(4){transition-delay:.24s}.roberto-agency-menu.is-open .roberto-agency-menu-links a:nth-child(5){transition-delay:.28s}.roberto-agency-menu.is-open .roberto-agency-menu-links a:nth-child(6){transition-delay:.32s}.roberto-agency-menu.is-open .roberto-agency-menu-links a:nth-child(7){transition-delay:.36s}
.roberto-agency-menu-links a i{position:absolute;left:0;top:50%;width:9px;height:9px;border-radius:50%;background:#fff;transform:translate(-24px,-50%) scale(0);transition:transform .25s ease}
.roberto-agency-menu-links a:hover{transform:translateX(27px)!important;color:#fff}
.roberto-agency-menu-links a:hover i{transform:translate(-24px,-50%) scale(1)}
.roberto-agency-menu-foot{display:grid;gap:9px;margin-top:clamp(28px,3vw,58px)}
.roberto-agency-menu-foot button{width:100%;min-height:44px;background:#65636d!important;border:0!important;border-radius:2px!important;color:#f5f1f7!important;font:600 14px/1 system-ui,sans-serif;letter-spacing:.02em;text-transform:none!important;transition:background .25s ease,transform .25s ease!important}
.roberto-agency-menu-foot button:hover{background:#75727e!important;transform:translateY(-2px)}
.roberto-agency-menu-foot small{padding-top:14px;color:#8d8990;font:500 10px/1.4 system-ui,sans-serif;letter-spacing:.13em}

/* Stronger agency typography and muted dark surfaces. */
.search-banner,.youtube-discovery,.player-layout,.moss-layout,.lyrics-workbench,.spotify-panel,.catalog-toolbar,.site-footer,.filter-panel{background:rgba(18,17,21,.86)!important;color:var(--rs-text)!important;border-color:rgba(255,255,255,.14)!important;box-shadow:none!important}
.search-banner{position:relative;overflow:hidden;border-radius:0!important;min-height:clamp(520px,60vh,760px);align-items:end!important;padding-top:clamp(110px,10vw,180px)!important;padding-bottom:clamp(70px,7vw,130px)!important}
.search-banner::before{content:"DISCOVER";position:absolute;right:-.04em;top:-.22em;font:800 clamp(120px,20vw,360px)/.88 system-ui,sans-serif;letter-spacing:-.08em;color:rgba(255,255,255,.055);pointer-events:none}
.search-banner::after{content:"";position:absolute;right:5%;bottom:-20%;width:min(52vw,760px);height:min(52vw,760px);border-radius:48% 52% 58% 42%/55% 47% 53% 45%;background:radial-gradient(circle at 35% 38%,rgba(218,49,188,.54),rgba(97,33,242,.28) 38%,rgba(31,176,103,.18) 65%,transparent 74%);filter:blur(24px);opacity:.60;animation:rsMorph 13s ease-in-out infinite alternate;pointer-events:none}
@keyframes rsMorph{0%{transform:translate3d(0,0,0) rotate(-4deg) scale(.95);border-radius:48% 52% 58% 42%/55% 47% 53% 45%}100%{transform:translate3d(-6%,8%,0) rotate(9deg) scale(1.12);border-radius:64% 36% 45% 55%/38% 62% 38% 62%}}
.search-copy,.search-form{position:relative;z-index:2}
.search-copy h1,.section-header h2,.youtube-discovery-copy h3{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;color:#e2dee6!important;letter-spacing:-.065em!important;text-transform:none!important}
.search-copy h1{font-size:clamp(72px,9.4vw,180px)!important;line-height:.82!important;font-weight:700!important;max-width:7ch}
.search-copy p,.section-header p,.youtube-discovery-copy p{color:#8d8892!important}
.search-form{background:rgba(35,33,41,.72)!important;border:1px solid rgba(255,255,255,.1)!important;backdrop-filter:blur(18px);padding:clamp(22px,2vw,36px)!important}
.search-control input,.youtube-search-control input{background:#111014!important;color:#f0edf2!important;border-color:rgba(255,255,255,.19)!important}
.search-control button,.youtube-search-control button[type="submit"]{background:#d5d0d5!important;color:#302e32!important;border:0!important}
.quick-search button,.youtube-mode-row button,.filter-buttons button,.view-actions button{background:transparent!important;color:#b7b2bc!important;border-color:rgba(255,255,255,.20)!important}
.quick-search button:hover,.youtube-mode-row button:hover,.filter-buttons button:hover,.view-actions button:hover,.filter-buttons button.active,.view-actions button.active{background:#d0ccd2!important;color:#222125!important;border-color:#d0ccd2!important}

/* Large section-number typography like the reference. */
.studio-section{position:relative;overflow:hidden;background:rgba(13,12,15,.88)!important;border-color:var(--rs-line)!important}
.studio-section::before{position:absolute;right:2vw;top:0;font:800 clamp(130px,18vw,330px)/.85 system-ui,sans-serif;color:rgba(255,255,255,.055);letter-spacing:-.08em;pointer-events:none;z-index:0}
.youtube-section::before{content:"01."}.player-section::before{content:"02."}.moss-section::before{content:"03."}.lyrics-section::before{content:"04."}
.studio-section>*{position:relative;z-index:1}
.section-header{border-color:var(--rs-line)!important}
.section-header h2{font-size:clamp(54px,7vw,130px)!important;line-height:.90!important;font-weight:500!important;color:#8c8790!important}

/* Catalog / album cards */
.catalog{background:rgba(11,10,13,.84)!important}
.track-grid{gap:clamp(14px,1.5vw,28px)!important}
.track-card{background:rgba(31,29,35,.78)!important;border:1px solid rgba(255,255,255,.10)!important;color:#ece8ef!important;transition:transform .45s cubic-bezier(.16,1,.3,1),border-color .35s ease,background .35s ease!important;overflow:hidden}
.track-card:hover{border-color:rgba(210,201,220,.45)!important;background:rgba(40,37,45,.88)!important}
.track-card img{filter:saturate(.82) contrast(1.04);transition:transform .65s cubic-bezier(.16,1,.3,1),filter .35s ease!important}
.track-card:hover img{transform:scale(1.025);filter:saturate(1) contrast(1.04)}
.track-card h3,.track-card strong{color:#f2eef4!important}.track-card p,.track-card small{color:#908b94!important}
.track-actions button,.track-actions a,.outline-button,.player-actions button,.editor-toolbar button,.editor-footer button{background:#202025!important;color:#e9e5eb!important;border-color:rgba(255,255,255,.18)!important}
.track-actions button:hover,.track-actions a:hover,.outline-button:hover,.player-actions button:hover,.editor-toolbar button:hover,.editor-footer button:hover{background:#d0ccd2!important;color:#222125!important}

/* Maintain Spotify's requested green identity. */
.spotify-panel{background:#17d966!important;color:#052c18!important;border-color:#0e8d43!important}
.spotify-panel *{--rs-spotify-text:#052c18}
.spotify-panel h2,.spotify-panel h3,.spotify-panel strong,.spotify-panel p{color:#052c18!important}
.spotify-panel .spotify-embed-shell,.spotify-panel iframe{background:#111!important}

/* Forms / lyrics dark styling */
input,textarea,select{background:#151419!important;color:#eeeaf0!important;border-color:rgba(255,255,255,.17)!important}
input::placeholder,textarea::placeholder{color:#77717d!important}
.live-lyrics-card,.editor-card,.lyrics-tools,.moss-output,.youtube-recorder,.current-selection{background:#121115!important;color:#eae6ec!important;border-color:rgba(255,255,255,.13)!important}
.full-lyrics{background:#111!important;color:#efebf0!important}
.sticky-player{background:rgba(22,20,25,.90)!important;border:1px solid rgba(255,255,255,.13)!important;backdrop-filter:blur(18px) saturate(120%)}

/* Smooth reveal and cursor. */
.motion-reveal{opacity:0;transform:translate3d(0,38px,0);filter:blur(5px);transition:opacity .92s cubic-bezier(.16,1,.3,1),transform .92s cubic-bezier(.16,1,.3,1),filter .82s ease}
.motion-reveal.is-visible{opacity:1;transform:none;filter:none}
#robertoScrollProgress{position:fixed;top:0;left:0;width:100%;height:2px;z-index:7999;pointer-events:none}
#robertoScrollProgress>span{display:block;width:100%;height:100%;transform-origin:left center;transform:scaleX(0);background:linear-gradient(90deg,#8a37ff,#ff49b9,#58d28b);box-shadow:0 0 22px rgba(195,80,255,.5)}
#robertoCursorOrb,#robertoCursorDot{position:fixed;left:0;top:0;z-index:8000;pointer-events:none;border-radius:50%;will-change:transform,left,top}
#robertoCursorOrb{width:46px;height:46px;border:1px solid rgba(238,234,240,.48);background:rgba(255,255,255,.02);transform:translate(-50%,-50%);transition:width .3s cubic-bezier(.16,1,.3,1),height .3s cubic-bezier(.16,1,.3,1),background .25s ease,border-color .25s ease}
#robertoCursorDot{width:5px;height:5px;background:#f3eff5;box-shadow:0 0 16px rgba(255,255,255,.65);transform:translate(-50%,-50%)}
body.cursor-hot #robertoCursorOrb{width:78px;height:78px;border-color:rgba(255,255,255,.7);background:rgba(255,255,255,.055)}
body.cursor-text #robertoCursorOrb{width:24px;height:54px;border-radius:8px}
[data-roberto-magnetic]{will-change:transform}
:focus-visible{outline:2px solid #e7e1e9!important;outline-offset:4px}

@media(max-width:960px){
  :root{--rs-menu-size:min(78vw,600px)}
  .search-copy h1{font-size:clamp(65px,15vw,130px)!important}
  .section-header h2{font-size:clamp(48px,12vw,100px)!important}
}
@media(max-width:640px){
  :root{--rs-menu-size:100vw}
  .roberto-corner-brand{width:58px;height:58px;left:16px;top:16px}.roberto-agency-menu-toggle{width:58px;height:58px;right:16px;top:16px}
  .roberto-agency-menu{padding:110px 38px 34px 46px}.roberto-agency-menu-links a{font-size:clamp(34px,10.7vw,49px)}
  .masthead{padding-top:88px!important}.search-banner{min-height:590px;padding-top:92px!important}
  .search-copy h1{font-size:18vw!important}.search-banner::before{font-size:36vw}
  .studio-section::before{font-size:34vw}.section-header h2{font-size:14vw!important}
  #robertoCursorOrb,#robertoCursorDot,#robertoSmokeCanvas,#robertoAmbientCanvas{display:none!important}
}
@media(hover:none),(pointer:coarse){#robertoCursorOrb,#robertoCursorDot,#robertoSmokeCanvas{display:none!important}}
@media(prefers-reduced-motion:reduce){.search-banner::after{animation:none!important}.motion-reveal{opacity:1!important;transform:none!important;filter:none!important}#robertoAmbientCanvas,#robertoSmokeCanvas,#robertoCursorOrb,#robertoCursorDot{display:none!important}.roberto-agency-menu,.roberto-agency-menu-links a,.site-grid{transition:none!important}}