/* All authored surfaces are strictly black, white, or transparent.
   Pixel scale is shared by the homepage font, emblem, sprites, and cursor. */
@font-face { font-family: "FMW Pixel"; src: url("../fonts/fmw-pixel.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "FMW Display"; src: url("../fonts/fmw-display.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "FMW Display Narrow"; src: url("../fonts/fmw-display-narrow.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
:root { --black: #000; --white: #fff; --pixel: 2px; --space: calc(var(--pixel) * 8); font-family: "FMW Pixel", monospace; color-scheme: dark; color: var(--white); background: var(--black); }
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--black); color: var(--white); }
body { font-size: calc(var(--pixel) * 8); line-height: 1.75; font-synthesis: none; }
button, input, textarea { font: inherit; border-radius: 0; }
button, a, input, textarea { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; color: inherit; }
button, input, textarea { background: var(--black); border: 1px solid var(--white); }
img, canvas, svg { image-rendering: pixelated; }
h1, h2, h3, p { margin: 0; font-weight: 400; }
h1 { font-family: "FMW Display", "FMW Pixel", monospace; font-size: 48px; line-height: 1.25; }
h2 { font-size: 24px; line-height: 1.5; }h3 { font-size: 24px; line-height: 1.5; }
p { line-height: 1.75; }
::selection { background: var(--white); color: var(--black); }
:focus-visible { outline: 2px dashed var(--white); outline-offset: 6px; }
[hidden] { display: none !important; }
/* No transitions, CSS animations, or autonomous scene update loop in this release. */
.eyebrow, .micro, .badge, .site-footer { font-size: 16px; line-height: 1.75; }
.eyebrow, .badge { text-transform: uppercase; }
.status-dot { display: inline-block; width: 6px; height: 6px; margin-right: 8px; background: var(--white); vertical-align: middle; }
.accent, .muted, .unlocked { color: var(--white); }
.site-header { max-width: 1440px; min-height: 128px; padding: 32px 48px; margin: auto; display: flex; justify-content: space-between; align-items: center; gap: 32px; }
.brand { display: inline-flex; align-items: center; gap: 16px; flex-shrink: 0; }.brand img { width: 64px; height: 64px; }.brand > span { font-size: 16px; line-height: 1.5; }
.site-header nav { display: flex; gap: 32px; align-items: center; }.site-header nav a { text-transform: uppercase; }.site-header nav a:hover, .site-header nav a[aria-current] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 8px; }
.access-button, .home-access { display: inline-flex; align-items: center; gap: 12px; background: var(--black); padding: 12px 16px; text-transform: uppercase; }
.access-button { border: 0; }.access-button:hover, .home-access:hover { text-decoration: underline; text-underline-offset: 6px; }
.pixel-lock { display: inline-block; width: 24px; height: 28px; object-fit: contain; vertical-align: middle; flex-shrink: 0; }
.site-footer { max-width: 1440px; margin: 32px auto 0; padding: 24px 48px 40px; border-top: 1px solid var(--white); display: flex; justify-content: space-between; gap: 32px; }
.skip-link { position: fixed; top: -100px; left: 24px; z-index: 100; padding: 12px; color: var(--black); background: var(--white); }.skip-link:focus { top: 16px; }
/* Full-viewport transparent stage. Text and controls remain semantic DOM. */
.home { --pixel: 3px; height: 100vh; height: 100dvh; overflow: hidden; font-size: calc(var(--pixel) * 8); }
.pixel-scene { position: fixed; inset: 0; pointer-events: none; overflow: hidden; }
.pixel-scene canvas { position: absolute; top: 0; left: 0; display: block; }
.landing { position: relative; width: 100%; height: 100%; z-index: 1; padding: 60px 72px; }
.landing-copy { width: max-content; max-width: 100%; }
.landing-logo { display: block; width: calc(var(--pixel) * 32); height: calc(var(--pixel) * 32); margin-bottom: calc(var(--pixel) * 10); }
.landing h1 { font-family: "FMW Display", monospace; text-transform: uppercase; font-size: calc(var(--pixel) * 24); line-height: 1.125; margin: 0; }
.landing-tagline { margin-top: calc(var(--pixel) * 8); line-height: 1; font-size: calc(var(--pixel) * 8); }
.landing-nav { display: flex; flex-direction: column; gap: calc(var(--pixel) * 4); align-items: flex-start; margin-top: calc(var(--pixel) * 20); }
.landing-nav a { position: relative; display: block; line-height: 1; padding: calc(var(--pixel) * 4) 0; min-height: 44px; text-transform: uppercase; font-size: calc(var(--pixel) * 8); }
.menu-arrow { position: absolute; left: calc(var(--pixel) * -11); top: 50%; width: calc(var(--pixel) * 7); height: calc(var(--pixel) * 9); margin-top: calc(var(--pixel) * -5); background: url("../images/arrow.svg") no-repeat 0 0 / 100% 100%; visibility: hidden; }
@media (hover: hover) { .landing-nav a:hover .menu-arrow { visibility: visible; } }
.landing-nav a:focus-visible .menu-arrow { visibility: visible; }
.landing-nav a:focus-visible { outline: 0; text-decoration: underline; text-decoration-thickness: var(--pixel); text-underline-offset: calc(var(--pixel) * 4); }
.home-access { position: fixed; bottom: 24px; right: 48px; z-index: 2; border: 0; font-size: calc(var(--pixel) * 8); padding: calc(var(--pixel) * 4); }
.home-access .pixel-lock { width: calc(var(--pixel) * 12); height: calc(var(--pixel) * 14); }
/* Quiet, open monochrome interiors. */
.page-main { max-width: 1360px; padding: 48px; margin: 0 auto; min-height: calc(100vh - 240px); }
.page-heading { display: flex; justify-content: space-between; gap: 64px; align-items: flex-end; margin-bottom: 64px; }.page-heading h1 { margin-top: 24px; }.page-heading > p { max-width: 384px; }
.section-rule { display: flex; justify-content: space-between; align-items: center; gap: 24px; border-top: 1px solid var(--white); padding: 24px 0; }.section-rule h2 { font-size: 16px; }
.badge { display: inline-block; border: 1px solid var(--white); padding: 4px 8px; }
.editorial-note { max-width: 960px; padding-bottom: 32px; }
.panel { background: var(--black); border: 1px solid var(--white); }
.creator-row { display: grid; grid-template-columns: 1fr 1fr; margin-bottom: 48px; }.creator-visual { padding: 32px; min-height: 352px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; border-right: 1px solid var(--white); }.creator-monogram { font-family: "FMW Display", monospace; font-size: 72px; align-self: center; line-height: 1.25; }.creator-monogram span { font-family: "FMW Pixel", monospace; font-size: 32px; }.creator-story { padding: 40px; }.creator-story h2 { margin: 16px 0; }.creator-story > p { margin-bottom: 24px; }
blockquote { border-left: 2px solid var(--white); padding-left: 24px; margin: 24px 0; }blockquote footer { margin-top: 16px; }
.tag-row { display: flex; flex-wrap: wrap; gap: 16px; margin: 24px 0; }.tag-row span { border-bottom: 1px solid var(--white); padding-bottom: 4px; }.text-button { display: inline-flex; align-items: center; gap: 12px; background: var(--black); border: 0; padding: 0; line-height: 1.75; }.text-button:hover { text-decoration: underline; text-underline-offset: 6px; }.text-button .pixel-lock { width: 12px; height: 14px; }
.reverse .creator-visual { order: 2; border-right: 0; border-left: 1px solid var(--white); }.bottom-cta { display: flex; justify-content: space-between; align-items: center; gap: 32px; padding: 32px; margin-top: 48px; }.bottom-cta h2 { margin-top: 16px; }.round-arrow { font-size: 32px; }.bottom-cta:hover { background: var(--white); color: var(--black); }
.studio-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 32px; }.module-heading { padding: 24px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--white); }.module-copy { padding: 32px; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.video-wrapper { position: relative; }.video-wrapper video { display: block; width: 100%; aspect-ratio: 320 / 180; }.media-note { display: block; padding: 16px 24px; border-top: 1px solid var(--white); border-bottom: 1px solid var(--white); font-size: 16px; }.audio-placeholder { display: flex; align-items: center; gap: 16px; border: 1px dashed var(--white); width: 100%; padding: 16px; }.record-art { display: grid; place-items: center; padding: 32px; border-bottom: 1px solid var(--white); }.record-art > div { width: 128px; height: 128px; background: repeating-linear-gradient(0deg, var(--white) 0 2px, var(--black) 2px 8px); display: grid; place-items: center; }.record-art span { background: var(--black); border: 2px solid var(--white); padding: 12px; text-align: center; }.worlds-module { display: flex; align-items: center; gap: 32px; padding: 32px; }.worlds-module h2 { margin: 16px 0; }.worlds-module .badge { margin-top: 24px; }.world-art { font-size: 64px; }.studio-contact { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 32px; padding: 32px; }.studio-contact:hover { outline: 2px solid var(--white); outline-offset: -8px; }.card-link { display: flex; justify-content: space-between; gap: 24px; width: 100%; }
.contact-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 32px; }.contact-details, .contact-form-panel { padding: 32px; }.contact-details h2, .contact-form-panel h2 { margin: 24px 0; }.email-link { display: block; overflow-wrap: anywhere; margin: 32px 0 24px; }.email-link:hover { text-decoration: underline; text-underline-offset: 6px; }.contact-note { border-top: 1px solid var(--white); margin-top: 48px; padding-top: 24px; display: flex; align-items: baseline; gap: 16px; }
label { display: block; margin-bottom: 12px; }input, textarea { width: 100%; min-height: 48px; display: block; padding: 12px 16px; color: var(--white); background: var(--black); caret-color: var(--white); appearance: none; }input::placeholder, textarea::placeholder { color: var(--white); opacity: 1; }input:focus, textarea:focus { outline: 2px solid var(--white); outline-offset: 4px; }input[aria-invalid="true"] { outline: 2px dashed var(--white); outline-offset: 4px; }input:-webkit-autofill { -webkit-text-fill-color: var(--white); -webkit-box-shadow: 0 0 0 1000px var(--black) inset; }textarea { resize: vertical; min-height: 160px; }.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin: 32px 0 24px; }.form-help, .form-status { margin-top: 24px; }.button { display: inline-flex; align-items: center; justify-content: space-between; min-height: 48px; gap: 32px; padding: 12px 16px; border: 1px solid var(--white); }.primary { background: var(--white); color: var(--black); }.primary:hover { background: var(--black); color: var(--white); }.contact-form-panel .button { margin-top: 24px; }
/* Immediate, accessible passcode barriers; no fade or shake animation. */
dialog { background: var(--black); color: var(--white); border: 1px solid var(--white); padding: 0; border-radius: 0; }dialog::backdrop { background: var(--black); }.access-dialog { max-width: min(560px, calc(100% - 32px)); max-height: calc(100dvh - 32px); }.dialog-panel { position: relative; padding: 40px; }.dialog-panel h2 { font-family: "FMW Pixel", monospace; font-size: 32px; line-height: 1.5; margin: 24px 0; }.dialog-panel form { margin-top: 32px; }.dialog-panel .button { width: 100%; }.dialog-panel .micro { margin-top: 24px; }.dialog-panel .text-button { margin-top: 24px; }.close-button { position: absolute; right: 16px; top: 8px; border: 0; padding: 8px; font-size: 24px; }.lock-emblem { margin-top: 24px; }.form-error { min-height: 28px; margin: 12px 0; }.gate-dialog { position: fixed; inset: 0; margin: 0; width: 100%; height: 100%; max-width: none; max-height: none; border: 0; padding: 32px; overflow-y: auto; }.gate-shell { min-height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: 32px; }.gate-shell .dialog-panel { max-width: 560px; margin: auto; border: 1px solid var(--white); }.gate-shell > .brand { align-self: flex-start; }.gate-shell > .micro { text-align: center; }
.workspace-bar, .workspace-bar > div { display: flex; align-items: center; justify-content: space-between; gap: 24px; }.workspace-bar { margin-bottom: 48px; }.summary-grid { display: grid; grid-template-columns: 1.2fr .8fr 1fr; gap: 24px; margin-bottom: 32px; }.summary-card { padding: 24px; }.summary-card h2 { margin: 24px 0 16px; }.metric { display: block; font-size: 48px; margin: 16px 0; font-weight: 400; }.performance-panel { overflow: hidden; }.performance-panel h2 { margin-top: 16px; }.table-help { padding: 24px; }.table-scroll { overflow-x: auto; overscroll-behavior-inline: contain; }table { width: 100%; min-width: 1400px; border-collapse: collapse; text-align: left; }th, td { padding: 24px; border-top: 1px solid var(--white); border-right: 1px solid var(--white); vertical-align: top; font-weight: 400; }th:last-child, td:last-child { border-right: 0; }thead th { text-decoration: underline; text-underline-offset: 6px; }tbody th { min-width: 192px; }td small { display: block; font-size: 16px; }.insight-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-top: 32px; }.note-card { padding: 24px; }.note-card h2 { margin: 24px 0 16px; }.roadmap-intro { display: grid; grid-template-columns: 1.4fr .6fr 1fr; gap: 32px; align-items: center; padding: 32px; margin-bottom: 48px; }.roadmap-intro h2 { font-family: "FMW Display", monospace; font-size: 48px; line-height: 1.5; margin: 24px 0; }.roadmap-meta { border-left: 1px solid var(--white); padding-left: 24px; }.roadmap-meta strong { display: block; margin: 24px 0; font-weight: 400; }.target-mark { font-size: 48px; text-align: center; }.target-mark span span { font-size: 24px; }.timeline { list-style: none; padding: 0; margin: 0; max-width: 1000px; }.timeline-item { display: grid; grid-template-columns: 48px 1fr; gap: 24px; position: relative; padding-bottom: 32px; }.timeline-item:not(:last-child)::before { content: ""; position: absolute; top: 48px; bottom: 0; left: 23px; width: 2px; background: var(--white); }.phase-number { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid var(--white); background: var(--black); }.phase-card { padding: 32px; }.card-top { display: flex; justify-content: space-between; align-items: center; gap: 24px; }.phase-card h3 { margin: 24px 0; }.phase-tasks { list-style: none; padding: 0; margin: 24px 0; }.phase-tasks li { position: relative; padding-left: 32px; margin: 16px 0; }.phase-tasks li::before { content: ""; position: absolute; left: 0; top: 8px; width: 12px; height: 12px; border: 2px solid var(--white); }.phase-outcome { border-top: 1px solid var(--white); padding-top: 24px; }.phase-outcome p { margin-top: 16px; }.not-found h1 { margin: 32px 0; }.not-found .button { margin-top: 32px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 1099px) {
  .home { --pixel: 2px; }.landing { padding: 48px 48px; }.home-access { right: 32px; bottom: 24px; }.site-header { padding: 24px; gap: 24px; flex-wrap: wrap; }.site-header nav { gap: 24px; }.site-header .brand > span { display: none; }.page-main { padding: 32px; }.page-heading { gap: 32px; }.page-heading h1 { font-size: 48px; }.page-heading > p { max-width: 320px; }.creator-story { padding: 24px; }.contact-grid, .studio-grid { gap: 24px; }.form-row { grid-template-columns: 1fr; }.summary-grid { grid-template-columns: 1fr 1fr; }.summary-card:last-child { grid-column: 1 / -1; }.roadmap-intro { grid-template-columns: 1fr 1fr; }.roadmap-meta { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--white); padding: 24px 0 0; }.world-art { display: none; }
}
@media (max-width: 680px) {
  .landing { padding: 32px; }.landing h1 { font-family: "FMW Display Narrow", "FMW Pixel", monospace; }.landing-logo { margin-bottom: 24px; }.landing-tagline { margin-top: 24px; }.landing-nav { margin-top: 32px; gap: 8px; }.landing-nav a { min-height: 44px; padding: 14px 0; }.menu-arrow { left: -22px; }.home-access { right: 16px; bottom: 16px; padding: 8px; font-size: 16px; }
  .site-header { padding: 24px; gap: 24px; }.site-header .brand > span { display: inline; }.site-header nav { order: 3; width: 100%; justify-content: space-between; gap: 16px; }.access-button { padding: 0; }.access-button > span { display: none; }.page-main { padding: 32px 24px; }.page-heading { display: block; margin-bottom: 40px; }.page-heading h1 { font-family: "FMW Display Narrow", monospace; font-size: 48px; }.page-heading > p { margin-top: 32px; max-width: none; }.section-rule { flex-wrap: wrap; gap: 16px; }.creator-row, .studio-grid, .contact-grid, .summary-grid, .insight-grid { grid-template-columns: 1fr; }.creator-visual { min-height: 240px; border-right: 0; border-bottom: 1px solid var(--white); padding: 24px; }.reverse .creator-visual { order: 0; border-left: 0; }.creator-monogram { font-size: 48px; }.creator-story { padding: 24px; }.summary-card:last-child { grid-column: auto; }.site-footer { display: block; padding: 24px; margin-top: 24px; }.site-footer > span { display: block; margin-bottom: 16px; }.bottom-cta, .worlds-module, .studio-contact, .contact-details, .contact-form-panel, .module-copy { padding: 24px; }.contact-details .email-link { font-size: 16px; }.bottom-cta .round-arrow { display: none; }.workspace-bar { align-items: flex-start; gap: 24px; }.workspace-bar > div { align-items: flex-end; flex-direction: column; }.workspace-bar .badge { font-size: 16px; }.workspace-bar > a { max-width: 40%; }.roadmap-intro { grid-template-columns: 1fr; padding: 24px; }.target-mark { display: none; }.roadmap-intro h2 { font-family: "FMW Display Narrow", monospace; font-size: 48px; }.timeline-item { grid-template-columns: 32px 1fr; gap: 16px; }.phase-number { width: 32px; height: 40px; }.timeline-item:not(:last-child)::before { left: 15px; top: 40px; }.phase-card { padding: 24px; }.card-top { flex-wrap: wrap; gap: 16px; }.phase-card h3 { font-size: 24px; overflow-wrap: anywhere; }.phase-tasks li { padding-left: 24px; }.module-heading { flex-wrap: wrap; padding: 24px; }.dialog-panel { padding: 32px 24px; }.dialog-panel h2 { font-size: 32px; }.gate-dialog { padding: 24px 16px; }.gate-shell .brand > span { font-size: 16px; }.gate-shell .dialog-panel { padding: 24px; }.media-note { overflow-wrap: anywhere; }
}
@media (max-width: 359px) { .landing { padding: 24px; }.landing-logo { width: 64px; height: 64px; }.landing-nav { margin-top: 24px; }.site-header .brand > span { display: none; }.page-heading h1 { overflow-wrap: anywhere; }.page-main { padding-left: 16px; padding-right: 16px; }.timeline-item { grid-template-columns: 24px 1fr; gap: 8px; }.phase-number { width: 24px; }.timeline-item:not(:last-child)::before { left: 11px; }.phase-card { padding: 16px; } }
@media (max-height: 699px) { .home { --pixel: 2px; }.home .landing { padding-top: 24px; }.home .landing-logo { width: calc(var(--pixel) * 32); height: calc(var(--pixel) * 32); margin-bottom: 16px; }.home .landing-nav { margin-top: 24px; gap: 0; }.home .landing-tagline { margin-top: 16px; } }
@media (max-height: 480px) and (orientation: landscape) { .home { --pixel: 2px; }.landing { padding: 24px 48px; }.landing h1 { font-family: "FMW Display Narrow", monospace; font-size: 48px; }.home .landing-logo { position: absolute; right: 32px; top: 24px; width: 64px; height: 64px; }.home .landing-nav { margin-top: 16px; }.landing-nav a { min-height: 40px; padding: 12px 0; }.home-access { right: 16px; bottom: 16px; }.home .landing-tagline { margin-top: 16px; } }
/* Browser-owned scroll controls also follow the two-color palette. */
* { scrollbar-color: var(--white) var(--black); }
::-webkit-scrollbar { width: 8px; height: 8px; background: var(--black); }
::-webkit-scrollbar-thumb { background: var(--white); border: 2px solid var(--black); }
::-webkit-scrollbar-track, ::-webkit-scrollbar-corner, ::-webkit-resizer { background: var(--black); }
/* Quiet sign-in control stays in the top-right on all viewport sizes. */
.home .home-access { top: 16px; right: 24px; bottom: auto; font-size: 12px; min-height: 44px; padding: 12px 0; display: inline-flex; align-items: center; gap: 8px; }
.home .home-access .pixel-lock { width: 12px; height: 14px; }
.site-header > .access-button { border: 0; font-size: 12px; margin-left: auto; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; }
.site-header > .access-button .pixel-lock { width: 12px; height: 14px; }
.site-header > .access-button > span { display: inline; }
.home-access:hover, .site-header > .access-button:hover { text-decoration: underline; text-underline-offset: 6px; }
.access-dialog .dialog-panel { padding: 32px; }
.access-dialog .dialog-panel h2 { font-size: 32px; margin: 16px 0; }
.access-dialog .dialog-panel form { margin-top: 24px; }
.access-dialog .dialog-panel > p, .access-dialog label, .access-dialog input, .access-dialog .button, .access-dialog .form-error { font-size: 16px; }
.access-dialog .dialog-panel .micro { font-size: 11px; }
.access-dialog .lock-emblem { margin-top: 16px; }
@media (max-width: 540px) { .access-dialog .dialog-panel { padding: 24px; } }

/* Preserve the exact supplied silhouette without stretching its proportions. */
.landing-logo, .brand img { object-fit: contain; }

/* A quiet, tiny copy of the supplied emblem; no reinterpretation. */
.home .landing-logo { width: 24px; height: 24px; margin-bottom: 24px; }
/* Centre the arrow against the actual text line, including roomy hit areas. */
.landing-nav .menu-arrow { top: calc(var(--pixel) * 4); margin-top: calc(var(--pixel) * -1); }
@media (max-width: 680px) { .landing-nav .menu-arrow { top: 14px; } }
@media (max-height: 480px) and (orientation: landscape) { .landing-nav .menu-arrow { top: 12px; } }
/* Approved Pixel Slab direction: real text, original bitmap slab-serif fonts. */
@font-face { font-family: "FMW Clean Slab"; src: url("../fonts/fmw-clean-slab.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "FMW Clean Slab Small"; src: url("../fonts/fmw-clean-slab-small.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
.home .landing h1 { font-family: "FMW Clean Slab", monospace; font-size: calc(var(--pixel) * 24); line-height: calc(var(--pixel) * 25); }
@media (max-width: 680px) { .home .landing h1 { font-family: "FMW Clean Slab Small", monospace; font-size: calc(var(--pixel) * 16); line-height: calc(var(--pixel) * 17); } }
@media (max-height: 480px) and (orientation: landscape) { .home .landing h1 { font-family: "FMW Clean Slab Small", monospace; font-size: calc(var(--pixel) * 16); line-height: calc(var(--pixel) * 17); } }

/* The battlefield forms the base of the page, below the elevated landscape. */
.siege-scene { position: relative; inset: auto; margin: 0 16px; z-index: 2; overflow: hidden; }
.siege-scene canvas { position: relative; pointer-events: auto; cursor: crosshair; touch-action: manipulation; }

.nature-scene { display: block; width: 100%; aspect-ratio: 263 / 168; pointer-events: none; align-self: center; }

.google-sign-in { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 20px; border: 1px solid #000; border-radius: 4px; background: #fff; color: #000; font: 500 14px Arial, sans-serif; text-decoration: none; }
[data-access-manager] form { display: grid; gap: 12px; max-width: 440px; }
[data-access-manager] li { margin: 12px 0; }
#access-dialog .dialog-panel > div > a { display: block; margin: 12px 0; }

#access-dialog .dialog-panel > div > a.google-sign-in { display: flex; }

/* Let compact screens scroll instead of clipping the art or navigation. */
.home { height: auto; min-height: 100vh; min-height: 100dvh; overflow-x: hidden; overflow-y: auto; display: flex; flex-direction: column; }
.home .landing { flex: 1; height: auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 48px; padding: 72px 48px 40px 72px; }
.home .nature-scene { max-width: 789px; justify-self: end; }
.home-battlefield { padding-top: 20px; }
.home-privacy { padding: 8px 20px 16px; font: 12px Arial, sans-serif; }
@media (max-width: 1000px) and (min-width: 681px) {
  .home .landing { padding-left: 40px; gap: 24px; grid-template-columns: minmax(300px, 1fr) minmax(0, 1fr); }
  .home .landing h1 { font-size: clamp(32px, 4.5vw, 48px); line-height: 1.05; }
}
@media (max-width: 680px) {
  .home .landing { grid-template-columns: minmax(0, 1fr); gap: 32px; padding: 72px 32px 0; }
  .home .nature-scene { width: calc(100% + 64px); max-width: none; margin: 0 -32px; }
  .home-battlefield { padding-top: 24px; }
}
@media (max-height: 480px) and (orientation: landscape) {
  .home .landing { padding-top: 64px; }
  .home .landing-logo { position: static; }
}

@media (min-width: 1001px) { .home .landing h1 { font-size: clamp(48px, 5vw, 72px); line-height: 1.05; } }