:root { color-scheme: dark; font-family: system-ui, sans-serif; color: #ebeff2; background: #101215; }
* { box-sizing: border-box; }
body { margin: 0; }
a { color: #8bd9ee; }
button, select { font: inherit; color: inherit; background: #252c31; border: 1px solid #66727b; padding: .7rem 1rem; border-radius: 4px; cursor: pointer; }
button:hover, a:hover { filter: brightness(1.2); }
:focus-visible { outline: 3px solid #80dcf1; outline-offset: 3px; }
#game { display: block; width: 100%; height: calc(100svh - 44px); min-height: 300px; border: 0; background: #101215; }
nav { min-height: 44px; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .6rem 1.2rem; padding: .4rem 1rem; border-bottom: 1px solid #343c42; font-size: .8rem; }
nav button { border: 0; padding: .2rem; background: none; text-decoration: underline; color: #8bd9ee; }
main.article { max-width: 900px; margin: auto; padding: 2.5rem 1.25rem 4rem; line-height: 1.65; }
h1 { font-size: 2rem; line-height: 1.15; }
h2 { font-size: 1.3rem; margin-top: 2rem; }
p { overflow-wrap: anywhere; }
.screenshot { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; margin: 1.5rem 0; }
dialog { color: #ebeff2; background: #181d21; border: 1px solid #65727a; border-radius: 6px; padding: 1.5rem; width: min(540px, calc(100% - 24px)); max-height: calc(100svh - 24px); overflow: auto; }
dialog::backdrop { background: #000b; }
dialog h2 { margin-top: 0; }
dialog p { line-height: 1.6; }
.choices { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.2rem; }
.choices button { flex: 1; min-width: 160px; }
.primary { background: #17697d; border-color: #62b4c8; }
.preference { display: block; margin: .8rem 0; }
.legal-copy { white-space: pre-wrap; }
#ad-space { text-align: center; padding: 12px 0; border-bottom: 1px solid #343c42; }
#ad-space[hidden] { display: none; }
#ad-space small { display: block; margin-bottom: 6px; color: #a7afb5; }
#ad-space iframe { display: block; width: 320px; height: 50px; margin: auto; border: 0; }
@media (max-width: 600px) { #game { height: calc(100svh - 70px); } nav { min-height: 70px; } }
body:has(#ad-space:not([hidden])) #game { height: calc(100svh - 118px); }
@media (max-width: 600px) { body:has(#ad-space:not([hidden])) #game { height: calc(100svh - 144px); } }