/* Interactive Games Engine v1.5.0 CLD — tot ce ține de motor are prefixul .ige-; tema își poate schimba aspectul prin variabilele de mai jos. */
.ige-game-shell{
  --ige-accent:#d6aa5a; --ige-bg:#0b0b0b; --ige-text:#fff; --ige-panel:rgba(12,10,8,.88); --ige-radius:8px;
  width:100%; margin:20px auto; box-sizing:border-box; font-family:inherit;
}
/* Scena: are raportul de aspect al jocului (--ige-ratio = width/height din game_config.json) și nu depășește înălțimea ecranului.
   Atenție: pe .ige-game-shell NU se pune contain:layout/paint — ar închide în shell și ecranul complet de rezervă (position:fixed) de pe iPhone. */
.ige-stage{
  position:relative; width:min(100%, calc(88vh * var(--ige-ratio, 1.7778))); margin:0 auto;
  aspect-ratio:var(--ige-ratio, 1.7778); background:var(--ige-bg); overflow:hidden; border-radius:var(--ige-radius);
  box-shadow:0 12px 35px rgba(0,0,0,.28); user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; isolation:isolate;
}
.ige-canvas{display:block;width:100%;height:100%;outline:none;touch-action:pan-y;-webkit-tap-highlight-color:transparent}
/* Cât timp se joacă, glisarea pe joc nu mai derulează pagina; în pauză / pe mesaje / înainte de start, pagina se derulează normal. */
.ige-playing:not(.ige-overlay-open) .ige-canvas{touch-action:none}
.ige-hud{position:absolute;inset:0;pointer-events:none;color:var(--ige-text);font:600 15px/1.3 system-ui,sans-serif;text-shadow:0 2px 3px #000;padding:10px 128px 10px 12px;box-sizing:border-box} /* dreapta rămâne liberă pentru butoanele Pauză / Sunet / Ecran complet */
.ige-hud>*{pointer-events:none}
.ige-hud-row{display:flex;justify-content:space-between;gap:10px}
.ige-hud-center{flex:1;text-align:center}
.ige-hud-right{text-align:right}
.ige-bar{position:absolute;top:8px;right:8px;display:flex;gap:6px;z-index:5}
.ige-btn{width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(0,0,0,.45);color:#fff;font-size:14px;line-height:1;cursor:pointer;padding:0}
.ige-btn:hover,.ige-btn:focus-visible{border-color:var(--ige-accent);color:var(--ige-accent)}
.ige-btn[aria-pressed="true"]{border-color:var(--ige-accent)}
.ige-btn.mute[aria-pressed="true"]{opacity:.5;text-decoration:line-through}
.ige-overlay{position:absolute;inset:0;z-index:4;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.66);color:var(--ige-text);text-align:center;padding:20px;box-sizing:border-box}
.ige-overlay[hidden]{display:none}
.ige-panel{max-width:520px;background:var(--ige-panel);border:1px solid rgba(255,255,255,.18);border-radius:var(--ige-radius);padding:22px 24px}
.ige-panel h3{margin:0 0 10px;font-size:22px;color:var(--ige-accent)}
.ige-panel p{margin:0 0 12px;line-height:1.5}
.ige-panel .ige-line{font-weight:600;margin:0 0 6px}
.ige-panel .ige-hint{font-size:13px;opacity:.75}
.ige-buttons{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:8px}
.ige-buttons:empty{display:none}
.ige-cta{padding:11px 22px;border-radius:4px;border:1px solid var(--ige-accent);background:transparent;color:var(--ige-text);font:600 15px system-ui,sans-serif;cursor:pointer}
.ige-cta:hover{background:rgba(214,170,90,.18)}
.ige-cta.primary{background:var(--ige-accent);color:#1b1206}
.ige-cta:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* Dialog / conversații: panoul stă jos, jocul rămâne vizibil în spate. Textul se scrie pe loc (fără a reface panoul). */
.ige-overlay-dialog{align-items:flex-end;background:linear-gradient(to top,rgba(0,0,0,.55),rgba(0,0,0,.12) 60%,transparent);padding:14px}
.ige-dialog-panel{max-width:720px;width:min(96%,720px);text-align:left}
.ige-dialog-panel h3{font-size:17px;margin-bottom:6px}
.ige-dialog-panel .ige-dialog-portrait{display:block;float:left;width:84px;height:84px;object-fit:cover;border-radius:8px;margin:0 14px 8px 0;border:1px solid rgba(255,255,255,.18)}
.ige-dialog-text{min-height:3em;white-space:pre-wrap}
.ige-dialog-panel .ige-buttons{justify-content:flex-end;clear:both}
.ige-dialog-panel .ige-buttons.ige-choices{flex-direction:column;align-items:stretch}
.ige-dialog-panel .ige-buttons.ige-choices .ige-cta{text-align:left}

/* Mesaje scurte deasupra jocului (engine.notify) */
.ige-toast{position:absolute;left:50%;bottom:16%;transform:translateX(-50%);z-index:6;max-width:80%;padding:9px 16px;border-radius:6px;background:rgba(0,0,0,.8);border:1px solid rgba(255,255,255,.25);color:#fff;font:600 14px/1.35 system-ui,sans-serif;text-align:center;pointer-events:none;animation:ige-toast-in .18s ease-out}
@keyframes ige-toast-in{from{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%,0)}}
@media (prefers-reduced-motion:reduce){.ige-toast{animation:none}}

.ige-touch{position:absolute;inset:0;pointer-events:none;z-index:3}
.ige-pad{position:absolute;bottom:14px;pointer-events:none}
.ige-dpad{left:14px;width:150px;height:150px}
.ige-actions{right:14px;display:flex;gap:12px;align-items:flex-end}
.ige-key{pointer-events:auto;touch-action:none;border:1px solid rgba(255,255,255,.45);background:rgba(0,0,0,.4);color:#fff;font-size:20px;border-radius:50%;width:52px;height:52px;padding:0;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}
.ige-key.on{background:rgba(214,170,90,.55)}
.ige-dpad .ige-key{position:absolute;border-radius:10px;width:48px;height:48px}
.ige-dpad .up{left:51px;top:0}.ige-dpad .down{left:51px;bottom:0}.ige-dpad .left{left:0;top:51px}.ige-dpad .right{right:0;top:51px}
.ige-key.act{width:60px;height:60px;font-weight:700}
.ige-noscript{padding:20px;text-align:center}

/* Ecran complet (și varianta pentru iPhone, fără Fullscreen API). dvh = înălțimea reală vizibilă pe telefon (fără bara browserului). */
.ige-stage:fullscreen{width:100vw;height:100vh;width:100dvw;height:100dvh;max-width:none;aspect-ratio:auto;border-radius:0}
.ige-full .ige-stage{position:fixed;inset:0;z-index:99999;width:100vw;height:100vh;width:100dvw;height:100dvh;max-width:none;max-height:none;aspect-ratio:auto;border-radius:0}
html.ige-lock,html.ige-lock body{overflow:hidden}
/* Joc lat în ecran complet (varianta CSS) pe un telefon ținut vertical, când browserul nu a putut bloca orientarea (ex. iPhone; în ecran complet nativ browserul interzice transformările): scena se rotește cu 90° și folosește toată
   înălțimea ecranului, în loc să rămână o fâșie îngustă. Întorci telefonul pe orizontală și rotația dispare singură. */
@media (orientation:portrait){
  .ige-wide.ige-full .ige-stage{
    position:fixed;top:0;left:0;right:auto;bottom:auto;
    width:100vh;height:100vw;width:100dvh;height:100dvw;
    transform-origin:0 0;transform:translateX(100vw) rotate(90deg);transform:translateX(100dvw) rotate(90deg);
  }
}

/* Varianta CSS de ecran complet mută scena în <body> (portal), ca să nu fie afectată de transform/filter/contain din tema paginii. */
.ige-portal{margin:0;width:0;height:0;overflow:visible}
.ige-full .ige-stage{touch-action:none}

/* Telefon ținut pe orizontală, fără ecran complet: scena ocupă toată înălțimea vizibilă, nu doar o bucată din ea. */
@media (orientation:landscape) and (max-height:540px){
  .ige-stage{width:min(100%, calc(100vh * var(--ige-ratio, 1.7778)));width:min(100%, calc(100dvh * var(--ige-ratio, 1.7778)))}
  .ige-game-shell{margin:0 auto}
}

/* Lista de jocuri: [interactive_games] */
.ige-game-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}
.ige-game-card{padding:18px;border-radius:8px;background:#fff;color:#222;box-shadow:0 5px 20px rgba(0,0,0,.12)}
.ige-game-card h3{margin:10px 0 6px}
.ige-game-card h3 a{color:inherit;text-decoration:none}
.ige-game-cover img{display:block;width:100%;height:auto;border-radius:4px}
.ige-play-link{display:inline-block;padding:8px 14px;border-radius:4px;background:#222;color:#fff;text-decoration:none}
.ige-meta{opacity:.75}
@media (max-width:700px){
  .ige-game-shell{margin:10px auto}
  .ige-stage{border-radius:4px}
  .ige-panel{padding:16px 16px}
  .ige-panel h3{font-size:19px}
  .ige-dialog-panel .ige-dialog-portrait{width:64px;height:64px}
}