/* Shared shell for all EAG browser games. Dark-fantasy, full-bleed. */
:root{
  --gold:#c9a35a; --crimson:#c2384a; --ink:#f2e9d8; --bg:#0a0b0f;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;height:100%;background:#000;overflow:hidden;
  font-family:'Cinzel',Georgia,serif;color:var(--ink);
  user-select:none;-webkit-user-select:none;touch-action:none;}
#stage{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(ellipse at 50% 30%, #15171f 0%, #060709 75%);}
canvas#game{display:block;image-rendering:pixelated;image-rendering:crisp-edges;
  box-shadow:0 0 80px rgba(0,0,0,0.9), 0 0 0 1px rgba(201,163,90,0.18);}

/* Loading / title overlay */
.eag-overlay{position:fixed;inset:0;z-index:20;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;padding:24px;
  background:rgba(6,7,9,0.82);backdrop-filter:blur(3px);}
.eag-overlay.hidden{display:none;}
.eag-overlay h1{font-size:clamp(28px,7vw,56px);margin:0 0 6px;letter-spacing:.06em;
  color:var(--ink);text-shadow:0 3px 20px rgba(0,0,0,.8);}
.eag-overlay .tag{font-style:italic;color:var(--gold);font-size:clamp(13px,3vw,18px);margin-bottom:22px;opacity:.9;}
.eag-overlay p{max-width:560px;color:#b9b2a4;line-height:1.5;font-family:Inter,system-ui,sans-serif;font-size:14px;}
.eag-btn{margin-top:26px;background:linear-gradient(180deg,#d8455a,#9e2535);color:#fff;border:0;
  padding:15px 40px;font-family:'Cinzel',serif;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;font-size:15px;border-radius:6px;cursor:pointer;
  box-shadow:0 6px 24px rgba(194,56,74,.4);transition:transform .1s;}
.eag-btn:active{transform:translateY(2px);}
.eag-hint{margin-top:18px;font-size:12px;color:#7c7567;font-family:Inter,sans-serif;letter-spacing:.04em;}
.eag-loadbar{width:240px;height:5px;background:rgba(255,255,255,.1);border-radius:3px;overflow:hidden;margin-top:8px;}
.eag-loadbar>i{display:block;height:100%;width:0;background:var(--gold);transition:width .2s;}

/* Top-left back link to the store */
.eag-back{position:fixed;top:10px;left:12px;z-index:30;color:#cabfa9;text-decoration:none;
  font-family:Inter,sans-serif;font-size:12px;letter-spacing:.06em;opacity:.7;
  background:rgba(0,0,0,.45);padding:6px 12px;border-radius:20px;border:1px solid rgba(255,255,255,.08);}
.eag-back:hover{opacity:1;}

/* Touch controls (hidden on devices without touch) */
.eag-touch{position:fixed;inset:auto 0 0 0;z-index:15;display:none;
  justify-content:space-between;align-items:flex-end;padding:18px 22px;pointer-events:none;}
.eag-touch>div{pointer-events:auto;}
.eag-dpad{position:relative;width:150px;height:150px;}
.eag-dpad button{position:absolute;width:50px;height:50px;border-radius:10px;
  background:rgba(20,22,30,.7);border:1px solid rgba(201,163,90,.3);color:var(--gold);
  font-size:18px;display:flex;align-items:center;justify-content:center;}
.eag-dpad button.on{background:rgba(194,56,74,.7);color:#fff;}
.eag-dpad [data-k=up]{top:0;left:50px;} .eag-dpad [data-k=down]{bottom:0;left:50px;}
.eag-dpad [data-k=left]{top:50px;left:0;} .eag-dpad [data-k=right]{top:50px;right:0;}
.eag-btns{display:flex;gap:16px;align-items:center;}
.eag-btns button{width:68px;height:68px;border-radius:50%;border:1px solid rgba(201,163,90,.4);
  font-family:'Cinzel',serif;font-weight:700;font-size:18px;color:#fff;}
.eag-btns .a{background:rgba(194,56,74,.75);} .eag-btns .b{background:rgba(40,44,58,.75);width:58px;height:58px;}
.eag-btns button.on{filter:brightness(1.4);}
@media (hover:none) and (pointer:coarse){ .eag-touch{display:flex;} }
body.show-touch .eag-touch{display:flex;}
