.ng-wrap { display: grid; grid-template-columns: minmax(0, 380px) minmax(0, 1fr); gap: var(--s6); align-items: start; margin-top: var(--s4); }
.ng-stage { position: relative; width: 100%; max-width: 420px; border-radius: 18px; overflow: hidden; border: 2px solid var(--line-strong); background: #0b1220; touch-action: none; }
.ng-stage canvas { display: block; width: 100%; height: auto; aspect-ratio: 9 / 16; }
.ng-start, .ng-over { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(4,6,10,0.55); }
.ng-start[hidden], .ng-over[hidden] { display: none; }
.ng-over > div { text-align: center; display: grid; gap: var(--s3); padding: var(--s5); }
.ng-fare { font: 800 2.2rem/1 var(--font-display); color: var(--green); }
.ng-setup { margin-bottom: var(--s4); }
@media (max-width: 760px) { .ng-wrap { grid-template-columns: minmax(0, 1fr); } .ng-stage:not(.full) { margin-inline: auto; } .page-head .lede { display: none; } }
.ng-x { display: none; position: absolute; left: 10px; bottom: 10px; z-index: 5; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.4); background: rgba(4,6,10,0.7); color: #fff; font-size: 1.5rem; line-height: 1; cursor: pointer; }
.ng-stage.full { position: fixed; inset: 0; z-index: 200; max-width: none; border: 0; border-radius: 0; background: linear-gradient(180deg, #070d22 0%, #070d22 45%, #0f170d 55%, #0f170d 100%); display: grid; place-items: center; }
.ng-stage.full canvas { width: min(100vw, calc(100dvh * 9 / 16)); height: auto; aspect-ratio: 9 / 16; }
.ng-stage.full .ng-x { display: block; }
.ng-stage.full .ng-start, .ng-stage.full .ng-over { inset: 0; }
html.ng-lock, html.ng-lock body { overflow: hidden; }
.ng-stage:not(.full) { width: fit-content; max-width: 100%; }
.ng-stage:not(.full) canvas { width: min(100%, 420px, calc((100dvh - 96px) * 9 / 16)); min-width: 260px; }
.ng-wrap { grid-template-columns: auto minmax(0, 1fr); }
@media (max-width: 760px) { .ng-wrap { grid-template-columns: minmax(0, 1fr); } }
