:root{--ink:#29262f;--muted:#797280;--line:#ded8e5;--paper:#f8f7fa;--accent:#837096}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,'PingFang SC','Microsoft YaHei',sans-serif}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
button,a{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible,video:focus-visible{outline:3px solid #8772bd;outline-offset:5px}
.studio-header,main,footer{width:min(1320px,calc(100% - 80px));margin:auto}
.studio-header{height:98px;display:flex;align-items:center;justify-content:space-between}
.studio-header>a:first-child{font-size:23px;font-weight:800;letter-spacing:-1px}
.studio-header>a:last-child{font-size:14px;color:var(--muted)}
.studio-hero{border-radius:24px;overflow:hidden;border:1px solid var(--line)}
.studio-hero img{width:100%;height:auto;display:block}
.studio-intro{display:flex;justify-content:space-between;align-items:end;padding:68px 0 40px;gap:30px}
.eyebrow{font-size:11px;font-weight:600;letter-spacing:2px;color:var(--accent)}
h1{font-size:clamp(32px,4vw,56px);letter-spacing:-2px;margin:16px 0 0}
p{color:var(--muted);line-height:1.9}
.studio-intro p{font-size:16px;margin:0}
.style-nav{position:sticky;top:0;z-index:4;display:flex;gap:8px;padding:18px 0;background:rgba(248,247,250,.96);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);overflow-x:auto}
.style-nav a{display:flex;align-items:center;gap:9px;border:0;white-space:nowrap;background:transparent;border-radius:30px;padding:12px 22px;color:var(--muted);font-size:14px}
.style-nav a.selected{background:var(--ink);color:white}
.collection{padding:68px 0 34px;border-bottom:1px solid var(--line)}
.collection[hidden]{display:none}
.collection-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:28px}
.collection-head h2{font-size:34px;margin:13px 0 0;font-weight:600}
.collection-head p{font-size:14px;margin:0;text-align:right}
.collection-head p span{display:block;font-size:11px;letter-spacing:1px;color:#a29aa9;white-space:nowrap}
/* Natural proportions: no cropped artwork and no fixed-height letterboxes. */
.art-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 22px;align-items:start}
.art-card{display:inline-block;vertical-align:top;break-inside:avoid;margin:0;padding:0;min-width:0;width:100%;text-align:left}
.art-image{overflow:hidden;border-radius:14px;background:#eae6ee}
.art-image img,.art-image video{display:block;width:100%;height:auto;object-fit:contain}
.art-image video{background:#17151b}
.art-caption{display:flex;justify-content:space-between;gap:12px;align-items:baseline;padding-top:14px}
.art-caption b{font-size:14px;font-weight:500}
.art-caption small{font-size:11px;color:var(--muted);white-space:nowrap}
#fantasy{margin-top:32px;background:#26242d;border:0;border-radius:24px;padding:44px 32px;color:#f5f1f9}
#fantasy .eyebrow,#fantasy p,#fantasy small{color:#c1b1cd}
#fantasy .art-image{background:#1c1b21}
.related{margin:60px 0 30px;padding:30px;border-radius:18px;background:#eee8f4;display:flex;gap:30px;flex-wrap:wrap;font-size:14px}
.related span{color:var(--accent);margin-right:auto}
footer{display:flex;justify-content:space-between;padding:40px 0 55px;font-size:13px;border-top:1px solid var(--line)}
@media(max-width:850px){
.studio-header,main,footer{width:calc(100% - 40px)}
.studio-intro{padding-top:40px}.studio-intro p{font-size:13px}
.style-nav a{padding:10px 16px}.art-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.collection-head p{max-width:230px}#fantasy{padding:30px 22px}.collection{padding-top:45px}
}
@media(max-width:560px){
.studio-header{height:76px}.studio-header>a:first-child{font-size:20px}
.studio-hero{border-radius:12px}.studio-intro{display:block}.studio-intro p{margin-top:20px}.studio-intro p br{display:none}
h1{letter-spacing:-1px}.collection-head{display:block}.collection-head h2{font-size:28px}
.collection-head p{text-align:left;max-width:none;margin-top:14px}.collection-head p span{margin-top:5px}
.art-grid{grid-template-columns:1fr}.art-image{border-radius:10px}.art-card{margin:0}
.art-caption b{font-size:14px}#fantasy{padding:28px 14px}.related{padding:24px;gap:20px;display:grid}
.eyebrow{letter-spacing:1px;font-size:10px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.art-image{position:relative}.inline-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:62px;height:62px;border:1px solid #ffffff80;border-radius:50%;background:#ffffffdf;color:#29262f;font-size:22px;box-shadow:0 4px 24px #0002}.inline-play span{margin-left:3px}.inline-play[hidden]{display:none}

.style-nav a small{font-size:10px;opacity:.55;letter-spacing:1px}
.style-nav a{transition:background .2s,color .2s}
.style-nav a:hover{background:#eee8f4;color:var(--ink)}
.style-nav a.selected:hover{background:var(--ink);color:#fff}
.series{margin-top:42px}
.series-head{display:flex;align-items:center;gap:16px;margin-bottom:22px}
.series-head h3{margin:0;font-size:16px;font-weight:500;letter-spacing:1px}
.series-head:after{content:'';height:1px;flex:1;background:var(--line)}
.series-head span{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
.four-up{grid-template-columns:repeat(4,minmax(0,1fr))}
.wide-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 28px}
.cinema-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.cinema-grid>.art-card:first-child{grid-column:1/-1}
.cinema-grid>.art-card:first-child .art-image{max-height:none}
.countdown-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.countdown-grid>.art-card:first-child{grid-column:1/-1;width:min(100%,880px);margin:0 auto 14px}
.masonry-grid{display:block;columns:3;column-gap:22px}
.masonry-grid>.art-card{margin-bottom:30px}
.fashion-lead{padding-bottom:36px;border-bottom:1px solid var(--line)}
#commercial .four-up{gap:16px}
#commercial .art-image{border-radius:5px}
#fashion .art-image{border-radius:4px}
#fantasy{padding-bottom:50px}
#fantasy .series-head:after{background:#49424f}
#fantasy .series-head span{color:#bcaac7}
#games .cinema-grid{padding:24px;background:#26242d;border-radius:20px;color:#fff}
#games .cinema-grid small{color:#c1b1cd}
#brand .wide-grid{padding:28px;background:#eee8f4;border-radius:20px}
#product .wide-grid{gap:40px 28px}
.inline-play{transition:background .2s,box-shadow .2s}
.inline-play:hover{background:#fff;box-shadow:0 5px 30px #0004}
.is-playing .art-image{outline:2px solid #ae93c6;outline-offset:4px}
@media(max-width:1000px){.four-up{grid-template-columns:repeat(2,minmax(0,1fr))}.style-nav a{padding:11px 16px}}
@media(max-width:850px){.masonry-grid{columns:2}.wide-grid{gap:30px 20px}.fashion-lead{grid-template-columns:repeat(3,minmax(0,1fr))}.fashion-lead .art-caption{display:block}.fashion-lead small{display:block;margin-top:6px}.art-caption{flex-wrap:wrap;gap:6px}.countdown-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){
.style-nav{gap:3px;padding:12px 0}.style-nav a{padding:10px 14px;font-size:13px}.style-nav a small{display:none}
.four-up,.wide-grid,.cinema-grid,.countdown-grid,.fashion-lead{grid-template-columns:1fr}
.masonry-grid{columns:1}.masonry-grid>.art-card{margin-bottom:28px}
.series{margin-top:32px}.series-head{margin-bottom:18px}.series-head h3{font-size:15px}
#games .cinema-grid{padding:14px;border-radius:14px}#brand .wide-grid{padding:14px;border-radius:14px}
.cinema-grid>.art-card:first-child,.countdown-grid>.art-card:first-child{grid-column:auto}
.fashion-lead .art-caption{display:flex}.fashion-lead small{margin-top:0}
.inline-play{width:54px;height:54px;font-size:19px}
}
@media(prefers-reduced-motion:reduce){.style-nav a,.inline-play{transition:none}}

/* Explicit occupied columns avoid the empty tracks created by column balancing. */
.balanced-grid{display:grid;columns:auto;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;align-items:start}
.balanced-grid.mixed-media-grid{grid-template-columns:1fr 1fr .72fr}
.balanced-grid.brand-content-grid{grid-template-columns:1fr 1fr .95fr}
.media-column{display:flex;flex-direction:column;gap:30px;min-width:0}
.media-column .art-card{display:block;margin:0}
.city-pair{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:561px) and (max-width:850px){
.balanced-grid,.balanced-grid.mixed-media-grid,.balanced-grid.brand-content-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px}
.balanced-grid>.media-column:last-child{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:24px 18px}
.mixed-media-grid>.media-column:last-child{display:block;grid-column:auto}
}
@media(max-width:560px){
.balanced-grid,.balanced-grid.mixed-media-grid,.balanced-grid.brand-content-grid,.city-pair{grid-template-columns:1fr;gap:28px}
.media-column{gap:28px}
}
