:root { color-scheme: light; font-family: system-ui, -apple-system, "Segoe UI", sans-serif; color: #202d32; background: #f2f1ec; font-synthesis: none; }
* { box-sizing: border-box; }
body { margin: 0; line-height: 1.65; }
a { color: #225766; text-underline-offset: .2em; overflow-wrap: anywhere; }
a:hover { color: #103d49; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid #d49a2c; outline-offset: 4px; }
.skip-link { position: absolute; left: 1rem; top: -7rem; z-index: 2; padding: .75rem 1rem; background: white; }
.skip-link:focus { top: .75rem; }
.masthead { background: #091820; border-bottom: 3px solid #997039; color: #f1dfb4; padding: 1.75rem 1.25rem 1.2rem; }
.header-inner, main, .footer-inner { width: min(100%, 54rem); margin-inline: auto; }
.studio-logo { display: block; width: 10rem; height: auto; }
.game-logo { display: block; width: min(100%, 29rem); height: auto; margin: 1.3rem auto .6rem; }
.header-tools { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.language-picker { display: flex; gap: .4rem; }
.language-picker button { min-height: 44px; padding: .55rem .9rem; border: 1px solid #947748; border-radius: .4rem; background: #142932; color: #ffefd0; font: inherit; cursor: pointer; }
.language-picker button[aria-pressed="true"] { background: #edd8a6; color: #142932; border-color: #edd8a6; }
.main-nav { display: flex; justify-content: center; flex-wrap: wrap; gap: .3rem .8rem; margin-top: 1rem; }
.main-nav a { color: #f1dfb4; padding: .55rem .2rem; min-height: 44px; }
.main-nav a[aria-current="page"] { font-weight: 700; text-decoration-thickness: 2px; }
main { padding: 2.2rem 1.25rem 3rem; }
[hidden] { display: none !important; }
h1 { font-size: clamp(1.9rem, 6vw, 2.6rem); letter-spacing: -.025em; line-height: 1.2; margin: 0 0 1rem; color: #16272e; }
h2 { font-size: 1.3rem; line-height: 1.4; margin: 2rem 0 .6rem; }
p { margin: .65rem 0 1rem; }
ul, ol { padding-left: 1.5rem; }
li { margin-block: .45rem; }
.updated { color: #536267; font-size: .95rem; margin-top: -.25rem; }
.notice { background: #fffaf0; border: 1px solid #d6bb82; border-left: 4px solid #b28230; border-radius: .4rem; padding: 1rem 1.1rem; margin: 1.4rem 0; }
.notice p { margin: 0; }
.contact-card { border: 1px solid #b9c7c9; background: #fff; border-radius: .65rem; padding: 1.4rem; margin: 1.5rem 0; }
.contact-card h2 { margin-top: 0; }
.button-link { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; border-radius: .45rem; background: #173c49; border: 2px solid #173c49; color: #fff; padding: .65rem 1rem; text-decoration: none; font-weight: 700; }
.button-link:hover { color: #fff; background: #0d2b36; }
.text-example { background: #f1f4f4; border-radius: .4rem; padding: 1rem; white-space: pre-line; overflow-wrap: anywhere; }
.cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.card { background: #fff; border: 1px solid #b9c7c9; border-radius: .6rem; padding: 1.25rem; }
.card h2 { margin-top: 0; }
footer { border-top: 1px solid #ccd0c9; background: #e7e8e1; padding: 1.5rem 1.25rem; }
footer p { margin: .3rem 0; font-size: .95rem; }
.sources { font-size: .95rem; }
@media (max-width: 36rem) { .cards { grid-template-columns: 1fr; } .studio-logo { width: 8.5rem; } .masthead { padding-top: 1.2rem; } main { padding-top: 1.7rem; } }
@media (prefers-reduced-motion: no-preference) { .language-picker button, .button-link { transition: background-color .15s ease; } }