:root{color-scheme:dark;--page-width:750px;--bar-height:84px;font-family:Arial,"Helvetica Neue",sans-serif;background:#251a08;color:#fff}
*{box-sizing:border-box}
html{margin:0;min-height:100%;scroll-padding-bottom:calc(var(--bar-height) + env(safe-area-inset-bottom,0px))}
body{margin:0;min-width:280px;padding-bottom:calc(var(--bar-height) + env(safe-area-inset-bottom,0px));-webkit-tap-highlight-color:transparent}
.image-stack{width:100%;max-width:var(--page-width);margin:0 auto;line-height:0;background:#eda400}
.image-stack img{display:block;width:100%;height:auto;margin:0;border:0}
.language-bar{position:fixed;inset:0 0 auto;z-index:10;max-width:var(--page-width);margin:0 auto;padding:calc(14px + env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) 0;display:flex;justify-content:flex-end;pointer-events:none}
.language-control{display:flex;align-items:center;position:relative;background:#3e2a0be8;border:1px solid #ffe4a257;border-radius:999px;box-shadow:0 3px 16px #47260024;pointer-events:auto;color:#fff4d9;backdrop-filter:blur(12px)}
.language-control>svg:first-child{position:absolute;left:13px;width:18px;height:18px;pointer-events:none}
.language-control .chevron{position:absolute;right:12px;width:13px;height:13px;pointer-events:none}
select{appearance:none;-webkit-appearance:none;padding:12px 33px 12px 39px;min-height:44px;font:600 12px/1.2 Arial,sans-serif;border:0;border-radius:999px;background:transparent;color:inherit;cursor:pointer;max-width:100%}
select option{color:#1c160b;background:#fff9e9}
.action-bar{position:fixed;inset:auto 0 0;z-index:20;max-width:var(--page-width);margin:0 auto;background:#241a09f2;border-top:1px solid #ffdc7140;padding:14px max(16px,env(safe-area-inset-right,0px)) calc(14px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));backdrop-filter:blur(16px)}
.action-inner{display:flex;gap:12px}
.cta{flex:1;min-width:0;height:55px;display:flex;align-items:center;justify-content:center;gap:12px;padding:0 10px;border-radius:10px;text-decoration:none;font-size:17px;font-weight:750;line-height:1.2;cursor:pointer;transition:filter .15s,transform .15s;user-select:none}
.cta svg{width:19px;height:19px;flex:none}
.cta-play{color:#231704;background:linear-gradient(180deg,#ffe670,#ffc62f);border:1px solid #ffe783;box-shadow:0 3px 0 #bb7d0e,0 3px 16px #ffc32921}
.cta-browse{color:#fff0b6;background:#59431f;border:1px solid #d2ae5e;box-shadow:0 3px 0 #1a1205}
.cta:hover{filter:brightness(1.09)}
.cta:active{transform:translateY(2px)}
:focus-visible{outline:3px solid white;outline-offset:4px}
.notice{position:fixed;z-index:30;bottom:calc(var(--bar-height) + env(safe-area-inset-bottom,0px) + 14px);left:50%;transform:translateX(-50%);width:max-content;max-width:min(650px,calc(100vw - 32px));padding:14px 20px;color:white;background:#241a09f5;border:1px solid #e3c17570;border-radius:10px;box-shadow:0 5px 25px #0004;text-align:center;font-size:14px;line-height:1.5}
.notice[hidden]{display:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:480px){:root{--bar-height:78px}.action-bar{padding-top:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}.action-inner{gap:10px}.cta{height:53px;font-size:15px;gap:8px;border-radius:9px}.cta svg{width:16px;height:16px}.language-bar{padding-top:calc(12px + env(safe-area-inset-top,0px))}select{font-size:11px;padding-top:10px;padding-bottom:10px}}
@media(prefers-reduced-motion:reduce){.cta{transition:none}}
