*{box-sizing:border-box}html,body{margin:0}body{background:#0c1840;color:#f3efe6;font:400 17px/1.6 Inter,system-ui,sans-serif}a:focus-visible{outline:2px solid #f0c062;outline-offset:5px}
.skip{position:absolute;top:-100px;left:12px;padding:8px 14px;z-index:60;color:#0c1840;background:#f0c062}.skip:focus{top:12px}
.hero{position:relative;min-height:100svh;overflow:hidden;background:#10140f}.hero>img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 42%}.scrim{position:absolute;inset:auto 0 0;height:33%;background:linear-gradient(to top,rgba(8,12,10,.62),transparent);pointer-events:none}
.hero header{position:relative;margin-left:auto;width:fit-content;max-width:52%;padding:44px 56px 72px;text-align:right;display:flex;flex-direction:column;align-items:flex-end;text-shadow:0 1px 14px rgba(0,0,0,.6)}h1{font:300 clamp(52px,7.5vw,92px)/1 Fraunces,Georgia,serif;letter-spacing:-.02em;margin:0;white-space:nowrap}
.roles,nav,.lab{font:500 13px/1.6 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase}.roles{margin:16px 0 0;color:#e8e2d2}nav{margin-top:22px;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px 24px}nav a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(243,239,230,.55);padding-bottom:2px}nav a:hover{border-color:white}
.meta{position:absolute;bottom:32px;left:56px;font-size:12px;line-height:1.7;color:#e8e2d2;text-shadow:0 1px 10px rgba(0,0,0,.7)}.meta a{color:inherit}
.rail{margin-top:150px;width:min(330px,28.5vw);display:flex;flex-direction:column;align-items:center;gap:72px}.grp{width:100%;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}.gfx{display:block;width:100%;transition:opacity .2s}.gfx:hover{opacity:.7}.lab{color:#f0c062;text-decoration:none;border-bottom:1px solid rgba(240,192,98,.5);text-shadow:0 1px 10px rgba(0,0,0,.7);padding-bottom:2px}.lab:hover{color:#fff4d6}.gfx canvas{display:block;width:100%;height:38px}.whale-lab{position:relative;top:.85em}.score{width:100%;max-height:69px;height:auto;display:block;object-fit:contain}
/* Mobile: image stands on its own. Text becomes a right-aligned vertical column below the photo.
   This deliberately avoids any text or navigation covering the artist's body. */
@media(max-width:800px){.hero{min-height:0;overflow:visible;background:#0c1840;display:flex;flex-direction:column}.hero>img{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:center 42%;order:0}.scrim{display:none}.hero header{order:1;margin:0;width:100%;max-width:none;padding:27px 22px 18px;display:flex;align-items:flex-end;text-align:right;text-shadow:none}.hero h1{font-size:clamp(49px,12vw,74px);white-space:normal}.roles{max-width:300px;margin:13px 0 0;color:#ccd6ed;font-size:11px}.hero nav{margin-top:20px;flex-direction:column;align-items:flex-end;gap:11px;text-align:right}.hero nav a{padding-bottom:3px}.rail{position:static;order:4;width:100%;max-width:420px;margin:42px 0 0;padding:0;gap:36px;align-self:center;align-items:center}.grp{align-items:center;max-width:350px;padding:0 20px}.gfx canvas{height:43px}.whale-lab{top:0}.score{max-height:60px}.meta{order:2;position:static;align-self:stretch;margin:24px 22px 0;padding:18px 0 32px;border-top:1px solid #273765;color:#aebdd8;text-shadow:none;font-size:12px}.meta a{color:inherit}}
@media(min-width:801px) and (max-height:740px){.rail{margin-top:65px;gap:35px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}}