:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#080b10;color:#f4f5f7}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;width:100%}
.poster{min-height:100svh;display:flex;align-items:center;justify-content:center}
.artwork{position:relative;flex:none;min-width:0;width:min(100vw,177.68331562svh);max-width:100%;aspect-ratio:3344/1882}
.poster-image{display:block;width:100%;height:auto}
.footer{position:absolute;z-index:1;left:18.2%;top:52%;width:16%;transform:translateX(-50%)}
.channels{display:flex;align-items:center;justify-content:space-between;list-style:none;padding:0;margin:0}
.channels li{width:18%;aspect-ratio:1;display:flex;align-items:center;justify-content:center}
.channel{width:100%;display:flex;align-items:center;justify-content:center;opacity:.8}
.channel img{display:block;width:100%;height:auto;filter:brightness(0) invert(1)}
.channels li:first-child img{width:82%}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(prefers-reduced-motion:no-preference){.artwork{animation:reveal .6s ease-out both}@keyframes reveal{from{opacity:0}to{opacity:1}}}


.mobile-poster{display:none}
@media(max-width:700px) and (orientation:portrait){
 .poster{display:block;min-height:100svh}
 .artwork{display:none}
 .mobile-poster{display:block;position:relative;height:100svh;min-height:560px;overflow:hidden;background:#080b10}
 .mobile-scene{position:absolute;inset:0}
 .mobile-horse{display:block;width:100%;height:100%;object-fit:cover;object-position:center center;transform:scale(1.06);transform-origin:80% 28%}
 .mobile-brand{position:absolute;z-index:2;top:3.5%;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;width:max-content}
 .mobile-brand img{display:block;width:clamp(120px,20svh,166px);height:auto}
 .mobile-brand p{margin:12px 0 0;font-size:14px;line-height:1.4;letter-spacing:.2em;font-weight:400;color:#f4f5f7;text-shadow:0 1px 12px #0009}
 .mobile-channels{position:absolute;z-index:2;bottom:max(18px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%)}
 .mobile-channels .channels{gap:20px}
 .mobile-channels .channels li{width:44px;height:44px;aspect-ratio:auto}
 .mobile-channels .channel{width:44px;height:44px;opacity:.9}
 .mobile-channels .channel img{width:29px;height:29px;object-fit:contain}
 .mobile-channels .channels li:first-child img{width:26px;height:26px}
}
