@font-face{font-family:LandingMyanmar;src:url('./assets/myanmar-bold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{color-scheme:dark;--page:724px;--safe:env(safe-area-inset-bottom,0px);font-family:LandingMyanmar,'Myanmar Text',sans-serif;background:#3b0502;color:#ffecad}
*{box-sizing:border-box}html{margin:0;min-width:280px}body{margin:0;background:radial-gradient(ellipse at top,#921a05,#300302 75%);padding-bottom:calc(clamp(116px,25vw,170px) + var(--safe) + 14px)}
a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}a:focus-visible{outline:3px solid #fff;outline-offset:3px}
.landing{max-width:var(--page);margin:auto;box-shadow:0 0 60px #120000;background:#570700}
.poster{position:relative;width:100%;aspect-ratio:724/2172;overflow:hidden;background:#720b03}
.master-art{display:block;width:100%;height:auto}
.brand{position:absolute;left:35%;top:3.5%;width:59%;display:flex;align-items:center;flex-direction:column;gap:clamp(2px,.6vw,5px)}
.brand-logo{width:100%;height:clamp(52px,15.5vw,112px);object-fit:contain;filter:drop-shadow(0 2px 2px #450200)}
body[data-customer="0131"] .brand{top:1.5%}body[data-customer="0131"] .brand-logo{height:clamp(64px,24vw,174px)}
.brand-domain{display:block;color:#fff178;text-decoration:none;text-align:center;font-family:Arial,sans-serif;font-weight:800;font-size:clamp(13px,3.6vw,26px);line-height:1.3;border:1px solid #ffce4d;border-radius:999px;background:linear-gradient(#d52809,#6c0602);padding:2px 14px;box-shadow:0 2px 5px #3d0303}
.headline{position:absolute;top:25%;left:2%;width:96%;margin:0;text-align:center;font-size:clamp(16px,4.7vw,34px);line-height:1.55;color:#ffe855;text-shadow:2px 2px 0 #770701,-2px -2px 0 #770701,0 3px 8px #480000}
.hero-actions{position:absolute;left:8%;top:28.5%;width:84%;display:grid;gap:clamp(6px,1.1vw,8px)}
.action{position:relative;display:flex;justify-content:center;align-items:center;gap:clamp(6px,1.6vw,12px);min-height:44px;height:clamp(44px,11vw,80px);padding:4px clamp(8px,2vw,20px);border:2px solid #fff282;border-radius:999px;box-shadow:0 0 0 2px #bd5704,0 0 0 4px #7e1004,inset 0 2px 1px #fff7bc,inset 0 -5px 1px #b86b00,0 5px 9px #3b0300b0;text-decoration:none;color:#690900;font-size:clamp(14px,4.7vw,32px);font-weight:700;line-height:1.45;white-space:nowrap;background:linear-gradient(#fff58b 0%,#ffe849 30%,#ffd107 70%,#efa700 100%)}
.action.h5{color:#fff6ba;background:linear-gradient(#a6f773 0%,#26cf44 25%,#049536 72%,#00662e 100%);box-shadow:0 0 0 2px #b17a10,0 0 0 4px #791204,inset 0 2px 1px #ebffb9,inset 0 -5px 1px #005324,0 5px 9px #3b0300b0;text-shadow:0 2px 1px #074820}
.action-symbol{flex-shrink:0;width:clamp(32px,8.3vw,60px);height:clamp(32px,8.3vw,60px);filter:drop-shadow(0 2px 2px #501602)}
.action:hover{filter:brightness(1.08)}.action:active{filter:brightness(.94)}.action[aria-disabled=true]{cursor:not-allowed}.action[aria-disabled=true] .button-label{font-size:.85em}
.game-window{position:absolute;margin:0;left:6.9%;width:86.1%;height:13.08%;overflow:hidden;isolation:isolate;background:#4b0504}
.game-window .screen-fill{position:absolute;inset:-10px;background-image:var(--screen);background-size:cover;background-position:center;filter:blur(10px) brightness(.44);z-index:-1}
.game-window img{display:block;width:100%;height:100%;object-fit:contain}
.game-title{position:absolute;left:27%;width:46%;margin:0;display:flex;align-items:center;justify-content:center;height:2.2%;color:#fff1b2;font-size:clamp(12px,3.6vw,26px);line-height:1.3;text-shadow:0 2px 2px #560000}
.game-1{top:43.0%}.title-1{top:40.75%}.game-2{top:62.13%}.title-2{top:60.05%}.game-3{top:80.7%}.title-3{top:78.65%}
.release-summary{display:flex;gap:12px;align-items:center;justify-content:center;padding:10px;font-family:Arial,sans-serif;font-size:12px;line-height:1.5;background:#630801}.summary-icon{width:38px;height:38px;object-fit:contain}.age{border:1px solid #d08d38;border-radius:999px;padding:1px 5px}
.release-notice{margin:0;padding:6px 14px 14px;text-align:center;font-size:13px;line-height:1.8}.release-notice[hidden]{display:none}
.dock{position:fixed;bottom:0;left:50%;transform:translateX(-50%);z-index:20;width:100%;max-width:var(--page);padding:7px 9px calc(7px + var(--safe));display:grid;grid-template-rows:1fr 1fr;gap:7px;border:2px solid #f4c54c;border-bottom:0;border-radius:20px 20px 0 0;background:linear-gradient(100deg,#660800,#ae1603 50%,#630700);box-shadow:0 -4px 14px #290000c0}
.dock .action{height:clamp(44px,9.3vw,67px);font-size:clamp(15px,4.3vw,28px);box-shadow:inset 0 2px 1px #fff9b0,inset 0 -3px 1px #bb7400,0 1px 4px #340000;border-width:2px}.dock .h5{box-shadow:inset 0 2px 1px #d8ffb4,inset 0 -3px 1px #005321,0 1px 4px #340000}.dock .action-symbol{width:clamp(32px,8vw,48px);height:clamp(32px,8vw,48px)}
.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}.symbols{position:absolute;width:0;height:0;overflow:hidden}
@media(prefers-reduced-motion:no-preference){.action{transition:filter .12s ease}}@media(min-width:725px){.landing{border:1px solid #9c460c}.dock{border-left-width:3px;border-right-width:3px}}