/* ACT IV — INDIE GAME: pixel rooms, HUD bar with agency meter, dialogue box, choice menus */
body[data-craft="game"] #stage { color: #f2f2f2; font-family: 'VT323', monospace; }
.backdrop-game { background: #1c1430; image-rendering: pixelated; }
.backdrop-game .hudbar { position: absolute; top: 0; left: 0; right: 0; height: 40px; display: flex; justify-content: space-between; align-items: center; padding: 0 18px; background: #000; color: #fff; font: 14px/1 'Press Start 2P', monospace; z-index: 1; }
.backdrop-game .agency { color: #9dff00; letter-spacing: 2px; }

[data-craft="game"] .scene { padding: 64px 80px 190px 220px; }
[data-craft="game"] .scene.avatar-right { padding: 64px 220px 190px 80px; }
[data-craft="game"] .layout-title, [data-craft="game"] .layout-handoff, [data-craft="game"] .layout-credits { padding: 64px 200px 190px; }
[data-craft="game"] .card { background: #0d0b1a; border: 4px solid #f2f2f2; box-shadow: 0 0 0 4px #0d0b1a, 10px 10px 0 4px rgba(0, 0, 0, .5); padding: 26px 34px; }
[data-craft="game"] .heading { font-family: 'Press Start 2P', monospace; font-size: 26px; line-height: 1.5; color: #ffd84a; }
[data-craft="game"] .text { font-size: 38px; }
[data-craft="game"] .media img { border: 6px solid #0d0b1a; outline: 4px solid #f2f2f2; }
[data-craft="game"] .layout-image .media img { max-height: min(290px, 100%); }
[data-craft="game"] .gallery .media img { max-height: min(260px, 100%); }
[data-craft="game"] .choice { font-family: 'Press Start 2P', monospace; font-size: 18px; line-height: 1.6; color: #cfcfcf; }
[data-craft="game"] .choice::before { content: '  '; white-space: pre; }
[data-craft="game"] .choice.current { color: #fff; }
[data-craft="game"] .choice.current::before { content: '▶ '; color: #ffd84a; animation: blink 1s steps(1) infinite; }
@keyframes blink { 50% { opacity: 0; } }
[data-craft="game"] .credits { font-family: 'Press Start 2P', monospace; font-size: 16px; line-height: 2.4; animation: roll 24s linear forwards; }
[data-craft="game"] .layout-credits .card { height: 420px; }
@keyframes roll { from { transform: translateY(380px); } to { transform: translateY(-40px); } }
.pixel-grid { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(32, 1fr); grid-template-rows: repeat(18, 1fr); }
.pixel-grid i { background: #0d0b1a; }

[data-craft="game"] #say { left: 40px !important; right: 40px; bottom: 14px; width: auto; max-width: none; height: 124px; padding: 14px 20px; background: #000; border: 4px solid #fff; color: #9dff00; font: 34px/1.15 'VT323', monospace; }
