:root { color-scheme: dark; font-family: Consolas, "Courier New", monospace; background: #111; color: #e7e7d2; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at top, #243224, #111 60%); }
main { max-width: 1400px; margin: 0 auto; padding: 2.5rem 1.25rem; }
h1 { color: #9be564; margin: 0; letter-spacing: .08em; }
header p, .hint { color: #b7b7ad; }
header, #game-list { max-width: 960px; margin-left: auto; margin-right: auto; }
#game-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; }
.game-button { min-height: 3.25rem; padding: .7rem .85rem; font: inherit; text-align: left; color: #e7f2e1; background: #1d281b; border: 1px solid #5e8552; cursor: pointer; }
.game-button:hover, .game-button:focus { background: #2c4427; }
.game-button:disabled { background: #444; color: #aaa; cursor: wait; }
#close-player, .player-tools button, .file-button { font: inherit; color: #e7f2e1; background: #1d281b; border: 1px solid #5e8552; border-radius: 3px; padding: .45rem .8rem; cursor: pointer; }
#close-player { color: #102010; background: #9be564; border: 0; }
#player-section { max-width: 1400px; margin: 2rem auto 0; }
.player-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.player-tools { display: flex; flex-direction: column; align-items: stretch; gap: .5rem; padding-top: 2.6rem; }
.player-tools > * { text-align: center; }
.file-button input { display: none; }
#game-layout { display: grid; grid-template-columns: minmax(0, 1fr) 10.5rem; gap: 1rem; align-items: start; }
#screen-wrap { position: relative; width: min(100%, calc(82vh * 4 / 3)); margin: 0 auto; }
#dos-screen { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: fill; background: #000; outline: 1px solid #4b654b; image-rendering: pixelated; }
@media (max-width: 620px) { #game-layout { grid-template-columns: 1fr; } .player-tools { flex-direction: row; flex-wrap: wrap; padding-top: 0; } }
@media (max-width: 700px) { #game-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { main { padding: 1.25rem .75rem; } #game-list { grid-template-columns: 1fr; } }
