@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@400;500;600;700&display=swap');
/* Capa visual inspirada en la referencia. No modifica el visor ni su lógica. */
:root{--studio-purple:#a78bfa;--studio-surface:#101725;--studio-border:#ffffff12}
body{font-family:Inter,'DM Sans',sans-serif;background:#07090e;color:#e2e8f0}
body::before{background:radial-gradient(ellipse at 12% 10%,color-mix(in srgb,var(--accent) 20%,transparent),transparent 46%),radial-gradient(ellipse at 88% 32%,#7c3aed30,transparent 43%),radial-gradient(ellipse at 30% 88%,color-mix(in srgb,var(--accent) 15%,transparent),transparent 46%);animation:studio-aurora 18s ease-in-out infinite alternate}
::selection{background:var(--accent);color:#08121c}
::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#07090e}::-webkit-scrollbar-thumb{background:#293448;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--accent)}
#network{opacity:.12}#constellation{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;opacity:.72}
header.studio-header{position:relative;z-index:5;height:82px;max-width:none;margin:0;padding:0 max(6%,calc((100vw - 1268px)/2));border:0;border-bottom:1px solid #ffffff12;border-radius:0;background:#0e121dc4;backdrop-filter:blur(20px);box-shadow:0 8px 35px #0002;gap:20px}
.studio-brand{display:flex;gap:24px;align-items:center;min-width:0}
.studio-monogram,.profile-monogram{display:grid;place-items:center;flex-shrink:0;background:linear-gradient(135deg,var(--accent),#6366f1 60%,#9333ea);border:1px solid #ffffff30;box-shadow:0 5px 24px color-mix(in srgb,var(--accent) 18%,transparent);font-family:Outfit,sans-serif;font-weight:600;color:white}
.studio-monogram{width:43px;height:43px;border-radius:13px;font-size:20px;letter-spacing:-1px}
.studio-identity{display:grid;gap:5px}.studio-identity strong{font:600 17px/1.2 Outfit,sans-serif;color:#f8fafc;letter-spacing:.15px;text-shadow:0 3px 12px #0006}.studio-identity small{font-size:10px;color:#94a3b8;letter-spacing:.1px}
.studio-badge{display:flex;align-items:center;gap:6px;white-space:nowrap;padding:5px 8px;border-radius:20px;color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent);border:1px solid color-mix(in srgb,var(--accent) 22%,transparent);font-size:8px;letter-spacing:1px}
.studio-badge i,.studio-tags i,.showcase-frame figcaption i{width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 9px color-mix(in srgb,var(--accent) 60%,transparent)}
.studio-header nav{gap:9px}.studio-header nav>a{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;font-size:12px;border-radius:9px;color:#bdc9d7}.studio-header nav>a:hover{background:#ffffff06;color:white}
.studio-header nav>.studio-contact{padding:11px 17px;background:linear-gradient(110deg,var(--accent),#5e8af5);border:1px solid #ffffff18;color:#061521;font-weight:600;box-shadow:0 5px 20px color-mix(in srgb,var(--accent) 15%,transparent)}.studio-header nav>.studio-contact:hover{color:#061521;filter:brightness(1.1)}
main{max-width:1440px}
.hero.studio-hero{display:grid;grid-template-columns:1.17fr 1fr;gap:44px;min-height:392px;margin:24px 0 38px;padding:30px 0 55px;border:0;border-radius:0;background:none;backdrop-filter:none;box-shadow:none;overflow:visible;align-items:center}
.studio-hero::after{display:none}.studio-hero .hero-copy{width:100%;min-width:0}.studio-hero .hero-glow{right:-30px;top:-100px;opacity:.65}
.studio-hero .eyebrow{display:inline-flex;align-items:center;padding:7px 11px;border:1px solid #33415590;border-radius:20px;background:#131c2b85;color:var(--accent);font-size:8px;letter-spacing:1.1px;backdrop-filter:blur(12px)}
.studio-hero h1{font-family:Outfit,sans-serif;font-size:clamp(35px,3.9vw,55px);font-weight:600;line-height:1.13;letter-spacing:-1.7px;margin:20px 0 18px;filter:drop-shadow(0 3px 3px #0004) drop-shadow(0 8px 18px #0005)}
.studio-hero h1 em{background:linear-gradient(100deg,var(--accent),#acb5ff 55%,#be93ec);background-clip:text;-webkit-background-clip:text;color:transparent}
.studio-hero .hero-intro{font-size:13px;line-height:1.85;color:#a9b9cc;max-width:540px;margin:0 0 19px}
.studio-tags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:23px}.studio-tags span{display:flex;gap:7px;align-items:center;padding:7px 10px;border:1px solid #ffffff0f;border-radius:8px;background:#0f172ac2;font-size:9px;color:#aebcd0;box-shadow:inset 0 1px 0 #ffffff04}
.studio-tags span:nth-child(2) i{background:#b894fb;box-shadow:0 0 9px #b894fb55}.studio-tags span:nth-child(3) i{background:#6ee7b7;box-shadow:0 0 9px #6ee7b755}
.studio-hero .hero-bottom{gap:19px;flex-wrap:wrap}.studio-hero .explore{padding:13px 19px;gap:28px;border:1px solid #ffffff22;border-radius:11px;background:linear-gradient(110deg,var(--accent),#5e8af5);color:#071421;font-size:12px;font-weight:600;box-shadow:0 8px 25px color-mix(in srgb,var(--accent) 15%,transparent)}.studio-hero .explore span{color:#071421}.studio-hero .explore:hover{filter:brightness(1.1);transform:translateY(-1px)}
.studio-secondary{display:flex;gap:12px;align-items:center;font-size:11px;color:#c0cee0}.studio-secondary span{color:var(--accent)}
.studio-hero .hero-foot{left:0;right:0;bottom:4px;padding-top:14px;font-size:7px;letter-spacing:1.5px;color:#6f829b}
.studio-showcase{position:relative;min-width:0;margin:0}.showcase-glow{position:absolute;inset:-20px;background:linear-gradient(110deg,color-mix(in srgb,var(--accent) 23%,transparent),#9333ea27);filter:blur(28px);border-radius:30px;opacity:.7;animation:studio-pulse 9s ease-in-out infinite alternate;pointer-events:none}
.showcase-frame{position:relative;padding:7px;border:1px solid #52607970;border-radius:19px;background:linear-gradient(130deg,#1b2634b8,#0d1422d9);backdrop-filter:blur(16px);box-shadow:0 22px 65px #0006,inset 0 1px 0 #ffffff12}
.showcase-image{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:12px;background:#050c13}.showcase-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1s}.studio-showcase:hover img{transform:scale(1.035)}
.studio-showcase .showcase-image img{position:absolute;inset:0;object-fit:contain;transform:none}
.showcase-caption strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.showcase-image::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,#040a13eb);pointer-events:none}
.showcase-caption{position:absolute;z-index:1;bottom:17px;left:19px;right:50px;display:grid;gap:6px;text-shadow:0 2px 8px #0008}.showcase-caption>span{font-size:7px;letter-spacing:1.6px;color:var(--accent)}.showcase-caption strong{font:500 21px Outfit,sans-serif;color:#f4f8ff}.showcase-caption small{font-size:9px;color:#b0bfd2}
.showcase-signal{position:absolute;z-index:1;bottom:21px;right:17px;font-size:20px;color:var(--accent);filter:drop-shadow(0 0 12px var(--accent))}
.showcase-frame figcaption{display:flex;justify-content:space-between;gap:10px;padding:13px 9px 7px;font-size:7px;letter-spacing:1.1px;color:#8a9bb4}.showcase-frame figcaption>span{display:flex;align-items:center;gap:6px}
#gallery{position:relative;padding:30px 0 0;border-top:1px solid #ffffff12}.section-top h2{font-family:Outfit,sans-serif;font-size:32px;font-weight:500;color:#f1f5fc;margin:10px 0 25px}.eyebrow{color:var(--accent);font-size:9px;letter-spacing:1.6px}
.toolbar{border:1px solid #ffffff13;border-radius:15px;background:#0e1522b8;padding:13px;backdrop-filter:blur(18px);box-shadow:inset 0 1px 0 #ffffff06,0 10px 35px #0002;align-items:center}
.toolbar-caption{flex:1;min-width:0;text-align:center;font-size:9px;line-height:1.5;letter-spacing:.3px;color:#8195ad}
.tabs{gap:5px}.tabs button{padding:10px 14px;border-radius:9px;font-size:11px}.tabs button.active{background:var(--accent);border-color:transparent;color:#06131e;box-shadow:0 3px 12px color-mix(in srgb,var(--accent) 18%,transparent);font-weight:600}.tabs button:not(.active):hover{color:#e3edf9;background:#ffffff06}
.search{background:#080e1b99;border-color:#2b394d;border-radius:10px;padding-left:12px}.search input{width:245px;padding:10px 8px;font-size:10px}.search:focus-within{border-color:var(--accent)}
.palette span{color:#92a3b8}.palette button{width:15px;height:15px}.result-line{font-size:8px;margin:18px 0;color:#7b8ca3}.auto-status{font-size:10px;color:#8498ae}.gallery-tools{gap:17px}.gallery-tools button{border-radius:9px;background:#111b29b0;border-color:#29374b;color:#b6c9dc}.gallery-tools a{font-size:10px}
.breadcrumbs{gap:7px}.breadcrumbs button{padding:8px 12px;border-radius:9px;background:#0f1927a6;border-color:#263449;color:#aabed2}.breadcrumbs [aria-current]{color:var(--accent);background:color-mix(in srgb,var(--accent) 7%,#0e1522)}
#grid{gap:23px}.card{border-radius:17px;background:#131929ad;border-color:#ffffff10;box-shadow:inset 0 1px 0 #ffffff05,0 10px 30px #0002}.card:hover{border-color:color-mix(in srgb,var(--accent) 45%,transparent);box-shadow:0 15px 35px #0004,0 6px 28px color-mix(in srgb,var(--accent) 10%,transparent)}
#grid .art img,#grid .art video{display:block;object-fit:contain;object-position:center;padding:8px}
#grid .album-art>img,#grid .album-art>video{position:absolute;inset:0}
#grid .card:hover .art img{transform:none}
#grid .card:not(.album-card) .card-copy h3{margin:0;line-height:1.35;overflow-wrap:anywhere}
.card .art{height:245px;background:radial-gradient(ellipse at 20% 10%,#1d3650,#0a111e)}.album-art img{opacity:.84}.card-copy,.album-card .card-copy{padding:19px 21px;background:linear-gradient(130deg,#182334b0,#111827ad);border-top:1px solid #ffffff0a}.card-copy h3,.album-card .card-copy h3{font-family:Outfit,sans-serif;font-size:22px;font-weight:500;letter-spacing:-.2px;color:#eef4ff;text-shadow:0 3px 10px #0006}.card-copy small{font-size:8px}.card-copy p,.album-card .card-copy p{font-size:10px;color:#91a4bc}.badge{font-size:8px;letter-spacing:1px;border-radius:6px!important}.folder-icon{font-size:125px;font-weight:400}
#about{margin-top:65px;padding:42px 0 55px;border-color:#ffffff12}#about>.eyebrow{margin-bottom:20px}.about-content{grid-template-columns:1fr 1.1fr;gap:36px;align-items:center}
.studio-profile{position:relative;padding:29px;border:1px solid #ffffff14;border-radius:22px;background:linear-gradient(140deg,#131e2dcc,#0e1422c4);backdrop-filter:blur(16px);box-shadow:0 18px 50px #0003;overflow:hidden}.studio-profile::after{content:"";position:absolute;right:-100px;top:-120px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 12%,transparent),transparent 65%);pointer-events:none}
.profile-monogram{width:54px;height:54px;border-radius:16px;font-size:25px;margin-bottom:22px}.studio-profile h2{font-family:Outfit,sans-serif;font-size:31px;line-height:1.23;margin:0 0 18px;letter-spacing:-.8px}.about-content p{font-size:12px;line-height:1.85;color:#9baec5}.profile-contact{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:22px;padding-top:20px;border-top:1px solid #ffffff10}.profile-contact a{font-size:11px!important;margin:0}.profile-contact button{font-size:10px;border-radius:9px}
.studio-process>h3{font:500 31px/1.22 Outfit,sans-serif;letter-spacing:-.7px;color:#f0f5fc;margin:15px 0}.process-cards{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:22px}.process-cards article{padding:19px;border-radius:15px;border:1px solid #ffffff10;background:#131c2ab0;backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 #ffffff04}.process-cards article>span{display:inline-block;font-size:8px;letter-spacing:1px;color:var(--accent);margin-bottom:16px}.process-cards article:nth-child(2)>span{color:#bd9cfa}.process-cards h4{font:500 16px Outfit,sans-serif;margin:0 0 10px;color:#e5edf9}.process-cards p{font-size:10px;margin:0}
footer{border-color:#ffffff12}footer .brand{font-family:Outfit,sans-serif}
.page-refresh{display:flex;justify-content:center;padding:0 20px 24px}.page-refresh button{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:20px;border:1px solid color-mix(in srgb,var(--accent) 22%,transparent);background:color-mix(in srgb,var(--accent) 4%,transparent);color:#8da7bb;font-size:10px;letter-spacing:.2px;transition:color .2s,border-color .2s,background .2s}.page-refresh button>span{color:var(--accent);font-size:15px}.page-refresh button:hover,.page-refresh button:focus-visible{color:var(--accent);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}.page-refresh button:disabled{opacity:.55;cursor:wait}
.page-refresh{gap:10px;flex-wrap:wrap}.page-refresh .cleanup-toggle{font-size:11px;color:var(--accent);border-color:color-mix(in srgb,var(--accent) 45%,transparent)}
@keyframes studio-pulse{to{opacity:.4;transform:scale(.95)}}
@keyframes studio-aurora{0%{transform:translate3d(-2%,-1%,0) scale(1)}50%{transform:translate3d(3%,2%,0) scale(1.06)}100%{transform:translate3d(0,-3%,0) scale(1.03)}}
@media(min-width:1440px){header.studio-header{max-width:none}}
@media(max-width:1100px){.studio-badge{display:none}.studio-hero h1{font-size:42px}.hero.studio-hero{gap:28px}.studio-identity strong{font-size:15px}.studio-identity small{font-size:9px}.studio-header nav>a{font-size:11px;padding:9px}.studio-tags span{font-size:8px;padding:6px 8px}}
@media(max-width:850px){header.studio-header{height:76px;padding:0 6%;gap:10px}.studio-header nav>a[href="#about"]{display:none}.studio-identity strong{font-size:14px}.studio-identity small{font-size:8px}.studio-header nav>.studio-contact{padding:10px 12px}.hero.studio-hero{grid-template-columns:1fr 1fr;gap:22px;min-height:355px}.studio-hero h1{font-size:35px;letter-spacing:-1px}.studio-hero .hero-intro{font-size:11px}.studio-tags{gap:5px}.studio-tags span:last-child{display:none}.studio-hero .hero-bottom{gap:13px}.studio-secondary{font-size:10px}.showcase-caption strong{font-size:18px}.showcase-caption small{font-size:8px}.showcase-frame figcaption{font-size:6px}.about-content{gap:20px}.studio-profile{padding:23px}.studio-profile h2,.studio-process>h3{font-size:26px}.toolbar{align-items:stretch}.search input{width:100%}.search{width:100%}.process-cards{grid-template-columns:1fr}.process-cards article{padding:15px}.process-cards article>span{margin-bottom:10px}}
@media(max-width:600px){header.studio-header{height:72px;margin:0;border-radius:0;padding:0 5%;gap:8px}.studio-monogram{width:36px;height:36px;font-size:17px;border-radius:11px}.studio-brand{gap:18px}.studio-identity strong{font-size:13px}.studio-identity small{font-size:7px;max-width:170px}.studio-header nav{gap:0}.studio-header nav>a[href="#gallery"]{display:none}.studio-header nav>.studio-contact{display:flex;font-size:10px;padding:9px 11px}.studio-contact>span{display:none}.hero.studio-hero{display:flex;flex-direction:column;gap:25px;align-items:stretch;min-height:0;margin:0 0 25px;padding:30px 0 39px;border-radius:0;overflow:hidden}.studio-hero .hero-copy{width:100%}.studio-hero h1{font-size:clamp(33px,8.5vw,46px);letter-spacing:-1.2px;margin:17px 0 14px}.studio-hero .hero-intro{font-size:12px;max-width:none}.studio-hero .eyebrow{font-size:7px;letter-spacing:.9px}.studio-tags{margin-bottom:20px}.studio-tags span{font-size:8px}.studio-tags span:last-child{display:flex}.studio-hero .hero-bottom{flex-direction:row;gap:19px}.studio-hero .explore{font-size:11px;padding:12px 15px;gap:24px}.studio-secondary{font-size:10px}.studio-showcase{width:100%;max-width:480px;align-self:center}.showcase-image{aspect-ratio:16/8}.showcase-caption{left:15px;bottom:14px}.showcase-caption strong{font-size:20px}.showcase-caption small{font-size:8px}.showcase-frame figcaption{font-size:6px;padding-top:10px}.studio-hero .hero-foot{bottom:0;font-size:6px;letter-spacing:.8px;padding-top:10px}.hero-foot span:last-child{display:none}.section-top h2{font-size:28px}.palette{margin-bottom:15px}#gallery{padding-top:23px}.toolbar{padding:10px}.tabs button{font-size:10px;padding:9px 10px}.gallery-tools{gap:12px}.gallery-tools button{font-size:10px}.auto-status{font-size:9px;line-height:1.8}.card .art{height:255px}.about-content{grid-template-columns:1fr;gap:28px}#about{margin-top:45px;padding-top:30px}.studio-profile h2{font-size:30px}.process-cards{grid-template-columns:1fr 1fr;gap:11px}.studio-profile{padding:24px}.process-cards article{padding:15px}.studio-process>h3{font-size:30px}.profile-contact{gap:12px}footer>span{font-size:7px}}
@media(max-width:360px){.studio-identity strong{font-size:11px}.studio-identity small{max-width:150px}.studio-header nav>.studio-contact{font-size:9px;padding:8px}.studio-tags span:last-child{display:none}.process-cards{grid-template-columns:1fr}.studio-hero .hero-bottom{gap:12px}}
@media(prefers-reduced-motion:reduce){body::before,.showcase-glow{animation:none}.showcase-image img{transition:none}}
@media(min-width:601px){.toolbar{display:grid;grid-template-columns:auto minmax(100px,1fr) minmax(180px,245px);gap:14px}.toolbar .search{min-width:0}.toolbar .search input{width:100%;min-width:0}}
@media(min-width:601px) and (max-width:1000px){.toolbar{grid-template-columns:auto minmax(100px,1fr)}.toolbar .search{grid-column:1/-1}.toolbar-caption{text-align:right}}
@media(max-width:600px){.toolbar-caption{display:none}}

/* Portada compacta y marco proporcional a la fotografía actual. */
header.studio-header{height:66px}
.studio-identity small{font-size:11px}.studio-badge{font-size:10px}
.hero.studio-hero{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:28px;min-height:0;margin:0 0 20px;padding:0 0 18px}
.studio-hero .eyebrow{font-size:10px;padding:6px 10px;letter-spacing:.7px}
.studio-hero h1{font-size:clamp(35px,3.7vw,48px);line-height:1.1;margin:13px 0 14px}
.studio-hero .hero-intro{font-size:14px;line-height:1.65;margin-bottom:16px;max-width:670px}
.studio-hero .explore{font-size:13px;padding:11px 17px}.studio-secondary{font-size:12px}
.studio-showcase{--cover-max-height:240px;max-width:100%;justify-self:center;align-self:center;transition:width .5s ease}
.studio-showcase .showcase-image{aspect-ratio:auto;height:220px;transition:height .5s ease}
.showcase-caption{left:13px;right:13px;bottom:12px;gap:0}
.showcase-caption>span,.showcase-caption>small,.showcase-signal{display:none}
.showcase-caption strong{width:fit-content;max-width:100%;font:500 13px/1.35 Outfit,sans-serif;padding:7px 10px;border-radius:8px;background:#0b1422a6;border:1px solid #ffffff20;backdrop-filter:blur(12px)}
.showcase-image::after{background:linear-gradient(180deg,transparent 65%,#040a1373)}
#gallery{padding-top:20px}.section-top h2{margin-bottom:19px}
.tabs button{font-size:12px}.search input{font-size:12px}.toolbar-caption{font-size:11px}.breadcrumbs button{font-size:12px}.palette span{font-size:10px}
@media(max-width:850px) and (min-width:601px){.hero.studio-hero{gap:22px}.studio-hero h1{font-size:36px}.studio-hero .hero-intro{font-size:13px}.studio-showcase{--cover-max-height:230px}.studio-identity small{font-size:10px}}
@media(max-width:600px){header.studio-header{height:62px}.studio-identity strong{font-size:14px}.studio-identity small{font-size:9px}.hero.studio-hero{gap:18px;padding:20px 0 14px;margin:0 0 18px;min-height:0}.studio-hero h1{font-size:clamp(31px,8.2vw,40px);margin:12px 0}.studio-hero .eyebrow{font-size:9px}.studio-hero .hero-intro{font-size:14px;line-height:1.6;margin-bottom:15px}.studio-hero .hero-bottom{gap:17px}.studio-hero .explore{font-size:12px;padding:11px 15px}.studio-secondary{font-size:11px}.studio-showcase{--cover-max-height:210px;max-width:100%;align-self:center}.showcase-caption strong{font-size:12px}.tabs button{font-size:11px}.search input{font-size:12px}}
@media(prefers-reduced-motion:reduce){.studio-showcase,.studio-showcase .showcase-image{transition:none}}

/* Portada multimedia sin rótulos, cristal, recuadros ni adornos sobre la pieza. */
.studio-showcase{background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;padding:0}
.studio-showcase .showcase-image{background:transparent;border:0;border-radius:0;box-shadow:none;padding:0}
.studio-showcase .showcase-image::after{content:none}
.studio-showcase .showcase-image img,.studio-showcase .showcase-image video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;border:0;border-radius:0;box-shadow:none;transform:none}

.appearance-tools{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.music-control{display:flex;align-items:center;gap:10px;padding:7px 12px;border:1px solid #ffffff24;border-radius:30px;background:#101d2866;backdrop-filter:blur(16px)}.music-control button{display:grid;place-items:center;width:32px;height:32px;padding:5px;border:0;border-radius:50%;color:var(--accent);background:transparent}.music-control svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.music-control input{width:84px;padding:0;border:0;accent-color:var(--accent);cursor:pointer}.appearance-tools .palette{margin-bottom:0}@media(max-width:600px){.appearance-tools{gap:12px;margin-bottom:18px}}

.studio-hero .hero-bottom .appearance-tools{gap:20px;align-items:center}.studio-hero .hero-bottom .palette{margin:0;gap:11px}.studio-hero .hero-bottom .palette span{font-size:10px;letter-spacing:1.5px}.studio-hero .hero-bottom .palette button{width:18px;height:18px}.studio-hero .hero-bottom .music-control{flex-shrink:0}@media(max-width:600px){.studio-hero .hero-bottom .appearance-tools{gap:14px;margin-bottom:0}}

.studio-showcase{position:relative;padding-bottom:22px;box-sizing:content-box}.now-playing{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:7px;height:18px;min-width:0;margin:0;padding:0 2px;color:#b7c7d8;font:400 11px/18px "DM Sans",sans-serif;letter-spacing:.2px;text-shadow:0 1px 5px #0007}.now-playing>span:first-child{color:var(--accent);font-size:13px;flex-shrink:0}.now-playing-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}

.now-playing-spectrum{display:flex;align-items:center;justify-content:center;gap:2px;width:34px;height:16px;flex:0 0 34px;color:var(--accent);filter:drop-shadow(0 0 3px color-mix(in srgb,var(--accent) 30%,transparent))}.now-playing-spectrum i{display:block;width:2px;height:14px;border-radius:2px;background:currentColor;transform:scaleY(.15);transform-origin:center;will-change:transform}

.studio-showcase{padding-bottom:var(--caption-space,0px)}.now-playing{left:50%;right:auto;bottom:0;transform:translateX(-50%);box-sizing:border-box;width:var(--caption-width,100%);height:auto;display:flex;flex-direction:column;gap:6px;padding:9px 14px 10px;border:1px solid color-mix(in srgb,var(--accent) 23%,#ffffff10);border-radius:13px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 9%,#101925d9),#101722b8);backdrop-filter:blur(14px);box-shadow:inset 0 1px 0 #ffffff10,0 5px 18px #0003,0 0 18px color-mix(in srgb,var(--accent) 5%,transparent)}.now-playing-spectrum{width:54px;flex:0 0 18px;gap:3px;height:18px}.now-playing-spectrum i{width:3px;height:16px}.now-playing-title{display:block;width:100%;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;text-align:center;font-size:12px;line-height:1.45;color:#d5e1ed;letter-spacing:.15px}

.now-playing{gap:7px;padding:13px 16px 10px;border:0;border-top:1px solid #ffffff1c;border-bottom:1px solid #ffffff0b;border-radius:0;background:linear-gradient(180deg,#0c162138,#0a142050);backdrop-filter:blur(8px);box-shadow:none}.mini-player-top{display:flex;width:100%;justify-content:space-between;align-items:center;gap:10px;font-size:8px;line-height:1;letter-spacing:1.6px}.mini-player-label{color:#a9bed0}.mini-player-status{color:var(--accent);font-size:7px;letter-spacing:.9px}.now-playing-spectrum{width:100%;height:25px;flex:0 0 25px;gap:4px;filter:drop-shadow(0 0 5px color-mix(in srgb,var(--accent) 25%,transparent))}.now-playing-spectrum i{width:3px;height:25px;background:linear-gradient(to top,color-mix(in srgb,var(--accent) 45%,#3f5367),var(--accent));border-radius:1px;transform-origin:bottom}.now-playing-title{font-size:12px;line-height:1.4;font-weight:500;color:#e0eaf3}.mini-player-transport{display:flex;align-items:center;gap:11px;width:100%;margin-top:2px}.now-playing .mini-player-transport button{display:grid;place-items:center;width:23px;height:24px;flex:0 0 23px;padding:2px;border:0;background:transparent;color:#c7d9e7;border-radius:4px;box-shadow:none}.mini-player-transport button:hover{color:var(--accent)}.mini-player-transport button:focus-visible{outline:1px solid var(--accent);outline-offset:3px}.mini-player-transport svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.mini-player-time{font-size:10px;letter-spacing:.5px;font-variant-numeric:tabular-nums;color:#8fa7bb}.mini-volume{margin-left:auto;display:flex;align-items:center;gap:7px;color:#8fa7bb;font-size:13px}.mini-volume input{width:58px;height:3px;padding:0;margin:0;border:0;accent-color:var(--accent)}.now-playing .mini-seek{display:block;width:100%;height:2px;padding:0;margin:0;accent-color:var(--accent);border:0;opacity:.65;cursor:pointer}

.mini-player-picker{display:block;width:100%;margin-top:2px}.now-playing .mini-player-picker select{display:block;width:100%;padding:6px 24px 6px 8px;font:400 11px/1.3 "DM Sans",sans-serif;color:#b8cbdc;border:1px solid #ffffff12;border-radius:5px;background-color:#0d19238c;cursor:pointer;text-overflow:ellipsis}.mini-player-picker select:focus-visible{outline:1px solid var(--accent)}.mini-player-picker option{background:#101c29;color:#e0eaf3}

.now-playing{background:linear-gradient(135deg,#23394bed,#1c2943ed 65%,#293854e8);border:1px solid #8eb9d842;border-top-color:#c3e4fc55;border-radius:14px;box-shadow:inset 0 1px 0 #e3f3ff14,0 10px 28px #0004,0 0 18px color-mix(in srgb,var(--accent) 7%,transparent)}.mini-player-label{color:#d0e3f2}.mini-player-status{color:var(--accent)}.now-playing-title{color:#f1f7fd;text-shadow:0 2px 6px #08101a99}.now-playing .mini-player-transport button{color:#e0f0fc;background:#b4d9fa0d}.now-playing .mini-player-transport button:hover{color:var(--accent);background:#d3ecff17}.mini-player-time,.mini-volume{color:#bfd2e3}.now-playing .mini-player-picker select{color:#e3eef8;border-color:#a9c9e72b;background-color:#0c1a2a80}.now-playing .mini-seek{opacity:.9}

/* Marco sutil de la selección aleatoria de portada. */
.studio-showcase .showcase-image{isolation:isolate;overflow:hidden;border-radius:12px;outline:1px solid #d1e7fa38;outline-offset:0;background:#0a14204d;box-shadow:0 12px 28px -8px #0009,0 3px 8px #0005,0 0 18px color-mix(in srgb,var(--accent) 6%,transparent)}.studio-showcase .showcase-image::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;box-shadow:inset 0 1px 0 #ffffff18;background:none}.studio-showcase .showcase-image img,.studio-showcase .showcase-image video{border-radius:inherit}

/* Zona visual estable, independiente de la altura del reproductor. */
.studio-showcase{--cover-max-height:300px;display:flex;flex-direction:column;align-items:center;gap:20px;padding:0;box-sizing:border-box;max-width:100%;transition:none}.studio-showcase .showcase-image{position:relative;display:flex;align-items:center;justify-content:center;flex:0 0 var(--cover-max-height);width:100%;height:var(--cover-max-height);aspect-ratio:auto;overflow:visible;isolation:auto;border:0;outline:0;border-radius:0;background:none;box-shadow:none;transition:none}.studio-showcase .showcase-image::after{content:none}.showcase-media-frame{position:relative;flex:none;max-width:100%;overflow:hidden;border-radius:12px;outline:1px solid #d1e7fa38;background:#0a14204d;box-shadow:0 12px 28px -8px #0009,0 3px 8px #0005,0 0 18px color-mix(in srgb,var(--accent) 6%,transparent)}.showcase-media-frame::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;box-shadow:inset 0 1px 0 #ffffff18}.studio-showcase .showcase-media-frame img,.studio-showcase .showcase-media-frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border-radius:inherit}.studio-showcase .now-playing{position:relative;inset:auto;transform:none;flex:none;width:min(360px,100%);margin:0}.hero.studio-hero{overflow:visible}@media(max-width:850px) and (min-width:601px){.studio-showcase{--cover-max-height:270px}}@media(max-width:600px){.studio-showcase{--cover-max-height:250px;gap:18px}}


/* Minirreproductor compacto, independiente del tamaño de la imagen. */
.studio-showcase .now-playing{width:min(290px,100%);padding:8px 11px 7px;gap:4px;border-radius:11px}.now-playing .mini-player-top{font-size:7px;letter-spacing:1.2px}.now-playing .mini-player-status{font-size:7px;letter-spacing:.5px}.now-playing .now-playing-spectrum{height:16px;flex-basis:16px;gap:3px}.now-playing .now-playing-spectrum i{height:16px;width:2px}.now-playing .now-playing-title{font-size:11px;line-height:1.3}.now-playing .mini-player-transport{gap:9px;margin-top:0}.now-playing .mini-player-transport button{width:24px;height:24px;flex-basis:24px}.now-playing .mini-player-transport svg{width:16px;height:16px}.now-playing .mini-player-time{font-size:9px}.now-playing .mini-volume input{width:50px}.now-playing .mini-player-picker{margin-top:0}.now-playing .mini-player-picker select{font-size:10px;line-height:1.2;padding:4px 22px 4px 7px}

/* Minirreproductor horizontal junto al selector de color. */
.studio-hero .hero-bottom{display:flex;flex-wrap:wrap;align-items:center;gap:14px}.hero-bottom>.now-playing{position:relative;inset:auto;transform:none;display:grid;grid-template-columns:minmax(100px,1fr) auto;grid-template-areas:"heading heading" "spectrum transport" "title picker" "seek seek";column-gap:14px;row-gap:5px;flex:0 1 auto;width:min(313.56px,60.3%);max-width:313.56px;min-width:0;padding:10px 13px 8px;box-sizing:border-box;align-items:center}.hero-bottom .mini-player-top{grid-area:heading}.hero-bottom .now-playing-spectrum{grid-area:spectrum;min-width:0;height:18px;flex:none;gap:3px}.hero-bottom .now-playing-spectrum i{height:18px}.hero-bottom .now-playing-title{grid-area:title;text-align:left;font-size:11px;line-height:1.35}.hero-bottom .mini-player-transport{grid-area:transport;width:auto;gap:8px;margin:0}.hero-bottom .mini-player-picker{grid-area:picker;max-width:190px;min-width:0}.hero-bottom .mini-seek{grid-area:seek}.hero-bottom .mini-volume{display:flex;align-items:center;gap:9px;padding:4px 9px;border:1px solid #ffffff24;border-radius:30px;background:#101d2866;backdrop-filter:blur(16px);margin-left:0}.hero-bottom .mini-volume input{width:70px;height:auto;margin:0;padding:0;border:0;accent-color:var(--accent);cursor:pointer}.hero-bottom .mini-volume .mini-mute{width:28px;height:28px;flex:0 0 28px;padding:4px;border:0;border-radius:50%;color:var(--accent);background:transparent}.hero-bottom .mini-mute svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.hero-bottom .mini-mute[aria-pressed=true]{opacity:.55}@media(max-width:600px){.hero-bottom>.now-playing{flex-basis:auto;column-gap:10px;padding:9px 10px}.hero-bottom .mini-volume input{width:52px}.hero-bottom .mini-player-transport{gap:6px}.hero-bottom .mini-player-time{display:none}.hero-bottom .mini-player-picker{max-width:160px}}

.studio-hero .hero-bottom .palette{display:grid;grid-template-columns:repeat(2,18px);grid-template-rows:auto repeat(2,18px);column-gap:12px;row-gap:10px;align-items:center;justify-content:start}.studio-hero .hero-bottom .palette>span{grid-column:1/-1;justify-self:center;text-align:center;margin:0;font-size:9px;line-height:1.3;letter-spacing:1.1px;white-space:nowrap;color:#b8cbdc}.studio-hero .hero-bottom .palette>button{margin:0;justify-self:start}

/* Reproductor horizontal más bajo, en cristal lavanda pastel. */
.hero-bottom>.now-playing{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"spectrum transport" "title picker" "seek seek";row-gap:3px;column-gap:12px;padding:7px 11px 6px;background:linear-gradient(120deg,#b9b2d82e,#a7c7d42b 60%,#d6bdcf24);border:1px solid #d6d0ef42;border-top-color:#eee8ff55;box-shadow:inset 0 1px 0 #ffffff10,0 5px 18px #0002;backdrop-filter:blur(18px);border-radius:10px}.hero-bottom .now-playing .mini-player-top{display:none}.hero-bottom .now-playing .now-playing-spectrum{height:14px;flex-basis:14px}.hero-bottom .now-playing .now-playing-spectrum i{height:14px}.hero-bottom .now-playing .mini-player-transport{gap:7px}.hero-bottom .now-playing .mini-player-transport>button{width:22px;height:22px;flex-basis:22px}.hero-bottom .now-playing .mini-volume{padding:1px 7px;gap:6px;background:#b6c4db12;border-color:#ded8ee2b}.hero-bottom .now-playing .mini-volume .mini-mute{width:23px;height:23px;flex-basis:23px;padding:3px}.hero-bottom .now-playing .now-playing-title{font-size:11px;line-height:1.25}.hero-bottom .now-playing .mini-player-picker select{padding:3px 20px 3px 6px;font-size:10px;line-height:1.2;background-color:#d0c8e712;border-color:#dfd6ee26;color:#edf0f7}.hero-bottom .now-playing .mini-seek{height:2px;margin-top:2px}.hero-bottom .now-playing .mini-player-time{font-size:9px;color:#d0d4e4}

.hero-gallery-preview{display:grid;grid-template-columns:minmax(0,1fr) 160px;align-items:center;gap:22px;min-width:0;width:100%}.hero-gallery-heading{position:relative;padding:18px 0 18px 17px;border-left:1px solid color-mix(in srgb,var(--accent) 28%,transparent)}.hero-gallery-heading::before{content:"";position:absolute;width:120px;height:100px;top:50%;left:0;transform:translateY(-50%);background:radial-gradient(ellipse,color-mix(in srgb,var(--accent) 8%,transparent),transparent 70%);filter:blur(12px);pointer-events:none}.hero-gallery-heading .eyebrow{font-size:8px;letter-spacing:1.7px;color:#aec0d4;text-shadow:0 2px 6px #0006}.hero-gallery-heading h2{position:relative;margin:12px 0 0;font:500 26px/1.3 Outfit,"DM Sans",sans-serif;letter-spacing:-.6px;color:#eaf2fb;text-shadow:0 3px 9px #0008,0 1px 1px #ffffff12;white-space:nowrap}.hero-gallery-heading h2 em{font-style:normal;font-weight:400;color:color-mix(in srgb,var(--accent) 50%,#eee6fb)}.hero-gallery-heading h2 span{color:var(--accent)}@media(max-width:1100px){.hero-gallery-preview{grid-template-columns:minmax(0,1fr) 135px;gap:16px}.hero-gallery-heading{padding-left:12px}.hero-gallery-heading h2{font-size:23px}}@media(max-width:600px){.hero-gallery-preview{grid-template-columns:minmax(0,1fr) 128px;gap:16px}.hero-gallery-heading h2{font-size:22px}.hero-gallery-heading .eyebrow{font-size:7px;letter-spacing:1px}}

/* Selector único para el título, alineado a todo el ancho del reproductor. */
.hero-bottom>.now-playing{grid-template-areas:"spectrum transport" "picker picker" "seek seek";column-gap:6px;row-gap:5px;padding:7px 8px 6px}.hero-bottom .now-playing .now-playing-title{display:none}.hero-bottom .now-playing .mini-player-picker{width:100%;max-width:none;margin:0;align-self:stretch}.hero-bottom .now-playing .mini-player-picker select{box-sizing:border-box;width:100%;min-height:28px;padding:5px 27px 5px 10px;font-size:12px;line-height:1.3;border-radius:6px}.hero-bottom .now-playing .now-playing-spectrum{box-sizing:border-box;justify-content:space-between;gap:0;width:100%;margin:0;padding:0}.hero-bottom .now-playing .now-playing-spectrum i{flex:0 1 3px;min-width:1px;max-width:3px}.hero-bottom .now-playing .mini-player-transport{justify-self:end}.hero-bottom .now-playing .mini-seek{margin-top:0}

.hero-gallery-heading{border:0;outline:0;background:none;box-shadow:none;backdrop-filter:none;padding-left:0}.hero-gallery-heading::before{content:none}.hero-gallery-heading h2{margin:0;text-shadow:0 3px 9px #0008,0 1px 1px #ffffff12}

.studio-hero .hero-bottom{column-gap:64px;row-gap:36px}
.studio-hero .hero-bottom .palette{flex-shrink:0;margin-bottom:0;margin-left:40px;padding:12px 14px;background:linear-gradient(120deg,#b9b2d82e,#a7c7d42b 60%,#d6bdcf24);border:1px solid #d6d0ef42;border-top-color:#eee8ff55;border-radius:10px;box-shadow:inset 0 1px 0 #ffffff10,0 5px 18px #0002;backdrop-filter:blur(18px)}

.studio-brand{min-width:0}.studio-identity{min-width:0}.studio-header .studio-identity small{display:block;max-width:360px;min-height:2.6em;line-height:1.3;white-space:normal;overflow-wrap:normal;text-shadow:0 2px 6px #0006}@media(max-width:850px){.studio-header .studio-identity small{max-width:290px}}@media(max-width:600px){.studio-header .studio-identity small{max-width:210px;font-size:9px;line-height:1.25;min-height:2.5em}}

/* Frases personales: trazo fino y luz de neón sutil. */
.studio-header .studio-identity small{font-family:"DM Sans",sans-serif;font-weight:300;font-size:12px;line-height:1.35;letter-spacing:.3px;color:color-mix(in srgb,var(--accent) 65%,#f4f5ff);text-shadow:0 0 4px color-mix(in srgb,var(--accent) 40%,transparent),0 0 11px color-mix(in srgb,var(--accent) 20%,transparent),0 2px 5px #0005;min-height:2.7em;max-width:390px}@media(max-width:850px){.studio-header .studio-identity small{font-size:11px;max-width:300px}}@media(max-width:600px){.studio-header .studio-identity small{font-size:10px;max-width:220px}}

.studio-hero h1{min-height:2.6em;font-size:clamp(24px,2.75vw,40px);line-height:1.3;letter-spacing:-1px}.studio-hero h1 .hero-title-line{display:block;font-weight:inherit;overflow-wrap:normal;text-wrap:balance}.studio-hero h1 span.hero-title-line{color:inherit}@media(max-width:850px){.studio-hero h1{font-size:clamp(23px,3.3vw,30px);letter-spacing:-.7px}}@media(max-width:600px){.studio-hero h1{font-size:clamp(22px,4.8vw,29px);line-height:1.35;letter-spacing:-.5px;min-height:2.7em}}

.studio-hero h1 .hero-title-line{white-space:nowrap}

/* Espectro de color conectado al analizador de audio. */
.hero-bottom>.now-playing{grid-template-areas:"spectrum spectrum" "transport transport" "picker picker" "seek seek"}
.hero-bottom .now-playing .now-playing-spectrum{height:30px;flex-basis:30px;align-items:flex-end;padding:3px 4px;filter:none;border-radius:5px;background:linear-gradient(90deg,#22d3ee0d,#a78bfa12,#f472b60d)}
.hero-bottom .now-playing .now-playing-spectrum i{height:24px;max-width:5px;flex-basis:5px;border-radius:2px 2px 0 0;color:#22d3ee;background:linear-gradient(to top,currentColor,color-mix(in srgb,currentColor 55%,white));box-shadow:0 0 6px currentColor;transform-origin:bottom}
.hero-bottom .now-playing .now-playing-spectrum i:nth-child(n+7){color:#818cf8}
.hero-bottom .now-playing .now-playing-spectrum i:nth-child(n+13){color:#c084fc}
.hero-bottom .now-playing .now-playing-spectrum i:nth-child(n+19){color:#f472b6}
.hero-bottom .now-playing .mini-player-transport{justify-self:center}

/* Satélite luminoso alrededor de las iniciales. */
.studio-monogram{position:relative;isolation:isolate;overflow:visible;width:48px;height:48px;border:0;border-radius:0;background:none;box-shadow:none;font-size:18px;font-weight:500;letter-spacing:-1px;color:#edf8ff;text-shadow:0 0 12px color-mix(in srgb,var(--accent) 45%,transparent)}
.studio-monogram::before{content:"";position:absolute;inset:-5px;z-index:-1;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 13%,transparent),transparent 68%);pointer-events:none}
.studio-monogram .monogram-orbit{position:absolute;inset:-9px;pointer-events:none;border:1px solid transparent;border-top-color:color-mix(in srgb,var(--accent) 50%,transparent);border-bottom-color:color-mix(in srgb,var(--accent) 25%,transparent);border-radius:50%;transform:rotate(-30deg) scaleY(.65);box-shadow:0 0 7px color-mix(in srgb,var(--accent) 15%,transparent)}
.monogram-orbit i{position:absolute;inset:-1px;border-radius:50%;animation:monogram-orbit-turn 5s linear infinite}
.monogram-orbit i::before{content:"";position:absolute;top:50%;left:-3px;width:7px;height:7px;margin-top:-3.5px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff,var(--accent) 55%,#7674dc);box-shadow:0 0 6px var(--accent),0 0 12px color-mix(in srgb,var(--accent) 65%,transparent);transform:scaleY(1.54)}
@keyframes monogram-orbit-turn{to{transform:rotate(360deg)}}
@media(max-width:600px){.studio-monogram{width:40px;height:40px;font-size:15px}.studio-monogram .monogram-orbit{inset:-7px}}
@media(prefers-reduced-motion:reduce){.monogram-orbit i{animation:none;transform:rotate(35deg)}}
