/* Opaque scene. Covers occupy only the blank upper wall, never characters. */
.hero { min-height:660px; }
.hero .hero-art { background:#1d2021 url('/hero-painted.png') center / 100% 100% no-repeat; }
.hero .wall-zone { position:absolute;top:0;right:0;width:64%;height:47%;overflow:hidden; }
.hero .arcade-wall { position:absolute;inset:12px 12px 8px 0;width:auto;height:auto;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:10px;transform:perspective(1600px) rotateY(-9deg) rotateZ(-3deg) scale(1.02);transform-origin:center; }
.hero .arcade-tile:nth-child(n) { grid-area:auto;aspect-ratio:auto;min-height:0;overflow:hidden;background:#141818;border:1px solid #8da6a8;border-radius:2px;box-shadow:4px 8px 14px #0007; }
.hero .arcade-tile img { width:100%;height:100%;object-fit:contain;opacity:1;filter:none; }
.hero .hero-art::before { display:none; }
.hero .hero-art::after { background:linear-gradient(90deg,#101210 0%,#101210df 26%,#10121050 43%,transparent 62%),linear-gradient(0deg,#101210,transparent 7%); }
.logo-frame,.brand .logo-frame,.footer-brand .logo-frame { width:44px;height:44px;overflow:hidden;border-radius:0; }
.logo-frame img { position:absolute;width:143%;height:143%;max-width:none;left:-21.5%;top:-19%;object-fit:contain;mix-blend-mode:lighten; }
footer .footer-legal { flex-basis:100%;width:100%;margin-top:22px;color:#a6aea4;font-size:13px;line-height:1.9; }
footer .footer-legal p { margin:0;font-size:inherit;color:inherit; }
footer .footer-legal a { color:#c6cec3;text-decoration:underline;text-underline-offset:3px;cursor:default; }
footer .footer-legal p span { display:inline-block;margin-left:18px; }
footer .footer-legal small { display:block;margin-top:8px; }
@media(min-width:1700px) { .hero .wall-zone { width:60%; } .hero .arcade-wall { gap:14px; }}
@media(max-width:1150px) { .hero .wall-zone { width:68%; } .hero .arcade-wall { gap:7px;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr)); }}
@media(max-width:760px) {
.hero { min-height:740px; }
.hero .hero-art { top:auto;bottom:0;height:300px;background-size:100% 100%; }
.hero .wall-zone { width:100%;height:47%; }
.hero .arcade-wall { inset:0 4px;grid-template-columns:repeat(7,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:4px; }
.hero .hero-art::after { background:linear-gradient(180deg,#101210,transparent 12%),linear-gradient(0deg,#101210,transparent 6%); }
.brand .logo-frame,.footer-brand .logo-frame,.header .brand .logo-frame { width:38px;height:38px; }
footer .footer-legal { font-size:12px; } footer .footer-legal p span { margin-left:8px; }}

/* Restore the user's selected second illustration as a single intact image. */
.hero .hero-art { inset:0; height:auto; background:#101210 url('/hero-arcade-wall.png') center / cover no-repeat; opacity:1; }
.hero .wall-zone { display:none; }
.hero .hero-art::after { background:linear-gradient(90deg,#101210c9 0%,#101210b0 27%,#10121025 56%,transparent 80%),linear-gradient(0deg,#101210 0%,transparent 18%); }
@media(max-width:760px) {
 .hero { min-height:650px; }
 .hero .hero-art { background-position:65% center; }
 .hero .hero-art::after { background:linear-gradient(90deg,#101210ed,#10121055),linear-gradient(0deg,#101210,transparent 80%); }}

.feature-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.feature-note { display:block; color:var(--muted); font-size:12px; line-height:1.8; }
@media(max-width:760px) { .feature-grid { grid-template-columns:1fr; }}

footer .footer-legal a[href] { cursor:pointer; }
footer .footer-legal a[href]:hover { color:var(--green); }
footer .footer-legal p:first-child span { margin-left:0; }

.hero .hero-actions { display:flex; flex-direction:column; align-items:stretch; width:max-content; max-width:100%; gap:12px; }
.hero .hero-actions .web-platform-button { justify-content:center; }