/* THUNDER DOME splash — dark, sharp corners, phone-first */
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;background:#000;overflow:hidden}
body{font-family:"Arial Narrow",Arial,Helvetica,sans-serif;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
#stage{position:fixed;inset:0;background:#000;touch-action:none;cursor:pointer;overflow:hidden}
#poster,#water,#trailer{position:absolute;inset:0;width:100%;height:100%;display:block}
#poster{object-fit:cover;z-index:1}
#water{z-index:2}
#trailer{object-fit:cover;z-index:3;opacity:0;pointer-events:none;background:#000}
body.no-water #water{display:none}
body.water-on #poster{visibility:hidden}
#hint{position:absolute;left:0;right:0;bottom:calc(4.5vh + env(safe-area-inset-bottom));z-index:4;
  text-align:center;color:#e8c877;font-size:15px;font-weight:700;letter-spacing:.55em;text-indent:.55em;
  text-shadow:0 0 14px rgba(0,0,0,.9),0 2px 6px rgba(0,0,0,.9);pointer-events:none;
  animation:hintPulse 2.2s ease-in-out infinite;transition:opacity .35s linear}
#hint.gone{opacity:0;animation:none}
@keyframes hintPulse{0%,100%{opacity:.45}50%{opacity:1}}
#controls{position:absolute;left:0;right:0;bottom:calc(7vh + env(safe-area-inset-bottom));z-index:5;
  display:flex;flex-direction:column;align-items:center;gap:18px;
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity .45s ease,transform .45s ease,visibility 0s linear .45s}
#controls.show{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .45s ease,transform .45s ease}
#enterBtn{display:block;min-width:min(78vw,340px);text-align:center;text-decoration:none;
  padding:20px 34px;background:rgba(0,0,0,.72);border:2px solid #d9a441;color:#ffd97a;
  font-size:26px;font-weight:900;letter-spacing:.4em;text-indent:.4em;border-radius:0;
  box-shadow:0 0 0 1px rgba(0,0,0,.85),0 0 26px rgba(217,164,65,.28),inset 0 0 18px rgba(217,164,65,.12);
  cursor:pointer}
#enterBtn:active{background:rgba(60,42,4,.85);color:#ffe9ad}
#replayBtn{background:rgba(0,0,0,.55);border:1px solid rgba(232,200,119,.55);color:#e8c877;
  font-size:13px;font-weight:700;letter-spacing:.32em;text-indent:.32em;padding:10px 18px;
  border-radius:0;cursor:pointer;font-family:inherit}
#replayBtn:active{background:rgba(60,42,4,.7)}
@media (prefers-reduced-motion: reduce){
  #hint{animation:none;opacity:.9}
  #controls{transition:none}
}
