/*
 * Yume Corporation — production quality layer v5
 * Loaded only on modern Yume surfaces by bootstrap.js.
 * Retained/period microsites deliberately keep their own visual rules.
 */

:root {
  --yq-safe-top: env(safe-area-inset-top, 0px);
  --yq-safe-right: env(safe-area-inset-right, 0px);
  --yq-safe-bottom: env(safe-area-inset-bottom, 0px);
  --yq-safe-left: env(safe-area-inset-left, 0px);
  --yq-focus: #111827;
  --yq-paper: #fffdf7;
  --yq-shadow: rgba(16, 24, 40, .16);
  --yq-header-h: 78px;
}

html {
  min-width: 0;
  overflow-x: clip;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  scroll-padding-top: calc(var(--yq-header-h) + 18px);
}

body {
  min-width: 0;
  overflow-x: clip;
  -webkit-tap-highlight-color: rgba(23, 62, 120, .14);
}

main,
section,
header,
footer,
.shell,
.header-inner,
.footer-grid,
.home-hero-grid,
.company-hero-grid,
.bots-hero-grid,
.play-grid,
.chief-grid,
.executive-hold-grid,
.building-grid,
.newsroom-grid,
.bot-strip-grid,
.press-bottom-grid,
.feature-row,
.arcade-row,
.notice-strip,
.history-line,
.handover-steps,
.poster-wall,
.facts-grid {
  min-width: 0;
}

:is(.home-hero-grid,.company-hero-grid,.bots-hero-grid,.play-grid,.chief-grid,.executive-hold-grid,.building-grid,.newsroom-grid,.bot-strip-grid,.press-bottom-grid,.feature-row,.arcade-row,.notice-strip,.history-line,.handover-steps,.poster-wall,.facts-grid) > * {
  min-width: 0;
}

img,
video,
canvas,
svg {
  max-width: 100%;
}

img {
  height: auto;
}

button,
input,
select,
textarea,
a {
  touch-action: manipulation;
}

button,
[role="button"],
input,
select,
textarea {
  max-width: 100%;
}

button,
a,
input,
select,
textarea {
  outline-offset: 3px;
}

:is(a,button,input,select,textarea,[tabindex]):focus-visible {
  outline: 3px solid var(--yq-focus) !important;
  outline-offset: 3px !important;
}

button:disabled,
[aria-disabled="true"] {
  cursor: not-allowed;
}

[id] {
  scroll-margin-top: calc(var(--yq-header-h) + 18px);
}

.skip-link {
  position: fixed;
  z-index: 10000;
  top: calc(8px + var(--yq-safe-top));
  left: calc(8px + var(--yq-safe-left));
  transform: translateY(-160%);
  background: #111;
  color: #fff;
  padding: 10px 14px;
  border: 2px solid #fff;
  font-weight: 900;
  text-decoration: none;
}

.skip-link:focus {
  transform: none;
}

/* Header/nav: stable desktop layout, proper touch-sized mobile sheet. */
.site-header {
  top: 0;
  padding-top: var(--yq-safe-top);
  backdrop-filter: none;
}

.header-inner {
  position: relative;
}

.brand {
  min-width: 0;
}

.brand span {
  min-width: 0;
}

.site-nav a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Public navigation stays visible at every width; there is no hamburger/menu control. */
.nav-toggle {
  display: none !important;
}

.site-nav a[aria-current="page"] {
  background: rgba(255,255,255,.48);
}


/* Give the playful public surfaces more consistency without flattening them. */
.home-hero,
.company-hero,
.bots-hero,
.news-hero {
  isolation: isolate;
}

.hero-copyblock,
.company-hero-grid > div:first-child,
.bots-hero-grid > div:first-child {
  position: relative;
  z-index: 2;
}

.hero-copyblock > p,
.company-hero p,
.bots-hero p,
.spread-heading p,
.chief-copy p,
.executive-hold-copy p,
.release-list p,
.bot-strip p {
  text-wrap: pretty;
}

.hero-subtitle,
.spread-heading h2,
.company-hero h1,
.bots-hero h1,
.news-hero h1,
.executive-hold-copy h2 {
  text-wrap: balance;
}

.paper-label {
  max-width: 100%;
  line-height: 1.2;
}

.acquisition-poster,
.feature-slab,
.memory-machine,
.ticket-machine,
.building-notice,
.archive-card,
.visitor-note,
.clipping-note,
.status-board {
  overflow-wrap: anywhere;
}

.acquisition-poster {
  max-width: 100%;
}

.acquisition-poster img {
  shape-margin: 10px;
}

.feature-slab,
.memory-machine,
.ticket-machine,
.archive-card,
.building-notice,
.visitor-note,
.clipping-note {
  border-radius: 2px;
}

/* Home games */
.game-cabinet {
  width: min(100%, 620px);
}

.game-screen {
  width: 100%;
  min-width: 0;
  isolation: isolate;
}

.catch-star {
  min-width: 44px;
  min-height: 44px;
  line-height: 1;
  padding: 0;
  display: grid;
  place-items: center;
  touch-action: manipulation;
}

.memory-card,
.small-machine-button,
.game-start,
.ticket-machine button {
  min-height: 44px;
}

.memory-card {
  min-width: 0;
}

.ticket-window {
  overflow-wrap: anywhere;
}

/* Executive Office: a compact public-company entry, not an ARG exposition wall. */
.executive-brief {
  padding: clamp(46px, 5vw, 64px) 0;
  background: var(--yellow, #ffda31);
}

.executive-brief-card {
  width: min(100%, 940px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(150px,190px) minmax(0,1fr);
  gap: clamp(24px,4vw,42px);
  align-items: center;
  padding: clamp(18px,3vw,28px);
  background: #fffdf7;
  border: 2px solid rgba(24,33,60,.28);
  box-shadow: 9px 10px 0 rgba(24,33,60,.13);
}

.executive-brief-photo {
  width: 100%;
  margin: 0;
  transform: rotate(-.6deg);
  box-shadow: 6px 7px 0 rgba(24,33,60,.12);
}

.executive-brief-photo figcaption {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}

.executive-brief-copy h2 {
  margin: 14px 0 2px;
  font-size: clamp(2.25rem,4vw,3.7rem);
  line-height: .95;
  letter-spacing: -.045em;
}

.executive-brief-copy .executive-role {
  margin: 8px 0 16px;
  font-size: .92rem;
  font-weight: 900;
  letter-spacing: .035em;
  text-transform: uppercase;
  color: #245ba0;
}

.executive-brief-copy > p:last-child {
  max-width: 620px;
  margin-bottom: 0;
  font-size: 1rem;
  font-weight: 700;
  color: var(--muted, #52617d);
}

/* Compatibility only: if a cached page still has the superseded section, keep it sane. */
.executive-hold {
  padding: 54px 0;
  background: var(--yellow, #ffda31);
}
.executive-hold-grid { grid-template-columns: 180px minmax(0,1fr); gap: 34px; }
.executive-hold .chief-photo { width: 180px; }
.executive-hold-copy h2 { font-size: clamp(2.2rem,4vw,3.4rem); }
.executive-hold-card { display: none; }
.executive-file-image figcaption { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }


.executive-file-image figcaption small {
  color: #6a7180;
  font-size: inherit;
}

/* Company timeline: six entries need room; no squeezed five-column assumption. */
.history-line {
  grid-template-columns: repeat(6, minmax(0,1fr));
}

.history-line article {
  min-width: 0;
}

.history-line time {
  overflow-wrap: anywhere;
}

.company-facts .facts-grid > div {
  min-width: 0;
}

/* Long archive/staff content should scroll inside itself rather than the page. */
:is(table,.data-table,.record-table,.case-table) {
  max-width: 100%;
}

.table-wrap,
.records-table-wrap,
.case-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

pre,
code {
  overflow-wrap: anywhere;
}

pre {
  max-width: 100%;
  overflow: auto;
}

/* Forms */
input,
select,
textarea {
  font-size: 16px; /* prevents iOS zoom */
}

:is(.portal-form,.records-input-row) input {
  min-height: 46px;
}

:is(.portal-form,.records-input-row) button {
  min-height: 46px;
}

/* Footer */
.site-footer {
  padding-bottom: var(--yq-safe-bottom);
}

.footer-grid > * {
  min-width: 0;
}

.footer-grid nav a {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
}

/* Large interactive overlays/phones should never make the underlying page unusable. */
:is(.jamie-phone,.assistant-phone,.live-event-control,.live-card,.case-file,.case-desk) {
  max-width: calc(100vw - 16px - var(--yq-safe-left) - var(--yq-safe-right));
  max-height: calc(100dvh - 16px - var(--yq-safe-top) - var(--yq-safe-bottom));
}

/* A calm, non-flashy default for decorative rules; avoids giant generic divider bars. */
main hr {
  height: 1px;
  border: 0;
  background: rgba(24,33,60,.25);
  margin: 28px 0;
}

/* Tablet */
@media (max-width: 1100px) {
  .history-line {
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 16px;
  }

  .history-line::before {
    display: none;
  }

  .history-line article {
    padding: 24px 20px;
    background: rgba(255,255,255,.46);
    border-top: 3px solid rgba(24,33,60,.2);
  }

  .history-line article::before {
    display: none;
  }
}

@media (max-width: 900px) {
  :root { --yq-header-h: 108px; }

  .site-header {
    z-index: 1000;
  }

  .header-inner {
    min-height: 66px !important;
  }

  .header-inner {
    flex-wrap: wrap;
    gap: 0 14px;
    padding-top: 5px;
  }

  .brand {
    max-width: 100%;
    min-height: 54px;
  }

  .brand span,
  .brand small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .site-nav {
    position: static !important;
    display: flex !important;
    flex: 0 0 100%;
    width: 100%;
    flex-wrap: wrap;
    align-items: center;
    gap: 3px;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 0 9px !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  .site-nav a {
    width: auto !important;
    flex: 0 0 auto;
    justify-content: center;
    min-height: 36px;
    padding: 7px 10px !important;
    font-size: .82rem;
  }

  .site-nav .staff-link {
    margin: 0 !important;
  }

  body.nav-open {
    overflow: auto;
  }

  .home-hero,
  .company-hero,
  .bots-hero,
  .news-hero {
    padding-top: clamp(48px,8vw,70px) !important;
  }

  .home-hero-grid,
  .company-hero-grid,
  .bots-hero-grid,
  .play-grid,
  .chief-grid,
  .executive-hold-grid,
  .executive-brief-card,
  .building-grid,
  .newsroom-grid,
  .bot-strip-grid,
  .press-bottom-grid {
    grid-template-columns: minmax(0,1fr) !important;
  }

  .executive-hold .chief-photo,
  .executive-brief-photo {
    width: min(62vw, 240px);
    margin-inline: auto;
  }

  .feature-row,
  .notice-strip,
  .handover-steps,
  .poster-wall,
  .facts-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }

  .arcade-row {
    grid-template-columns: minmax(0,1fr) !important;
  }

  .game-cabinet {
    margin-inline: auto;
    transform: none !important;
  }

  .since-stamp {
    width: min(70vw,310px);
    height: min(70vw,310px);
  }

  .news-side {
    position: static !important;
  }
}

/* Phone */
@media (max-width: 620px) {
  :root { --yq-header-h: 118px; }

  .shell,
  .staff-masthead-inner,
  .staff-desktop,
  .investigation-desk,
  .mega-shell {
    width: calc(100% - 24px - var(--yq-safe-left) - var(--yq-safe-right)) !important;
  }

  .header-inner {
    min-height: 62px !important;
  }

  .brand img {
    width: 38px !important;
    height: 38px !important;
  }

  .brand span {
    font-size: .9rem;
  }

  .brand small {
    font-size: .5rem;
  }

  .home-hero {
    padding-bottom: 62px !important;
  }

  .word-yume {
    font-size: clamp(4.4rem,23vw,6.2rem) !important;
  }

  .hero-subtitle {
    margin-top: 22px !important;
    font-size: clamp(2rem,10vw,2.8rem) !important;
  }

  .hero-copyblock > p,
  .company-hero p,
  .bots-hero p {
    font-size: 1rem !important;
  }

  .hero-buttons {
    display: grid !important;
    grid-template-columns: minmax(0,1fr);
  }

  .play-button {
    width: 100%;
    text-align: center;
  }

  .acquisition-poster {
    padding: 30px 24px 26px !important;
    transform: rotate(.3deg) !important;
    box-shadow: 7px 8px 0 rgba(0,0,0,.16) !important;
  }

  .acquisition-poster img {
    width: 66px !important;
    margin: -16px -7px 7px 12px !important;
  }

  .acquisition-poster h2 {
    font-size: clamp(1.75rem,9vw,2.25rem) !important;
  }

  .marquee > div {
    gap: 20px !important;
  }

  .feature-spread,
  .mini-arcade,
  .around-yume,
  .building-section,
  .archive-posters,
  .newsroom,
  .handover,
  .executive-hold,
  .executive-brief {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }

  .spread-heading {
    margin-bottom: 30px !important;
  }

  .spread-heading h2,
  .company-hero h1,
  .bots-hero h1,
  .news-hero h1,
  .executive-hold-copy h2,
  .executive-brief-copy h2 {
    font-size: clamp(2.55rem,13vw,3.8rem) !important;
  }

  .feature-row,
  .notice-strip,
  .handover-steps,
  .poster-wall,
  .facts-grid,
  .history-line {
    grid-template-columns: minmax(0,1fr) !important;
  }

  .feature-slab {
    min-height: 230px !important;
    transform: none !important;
  }

  .play-grid {
    gap: 38px !important;
  }

  .play-copy h2 {
    font-size: clamp(3rem,16vw,4.5rem) !important;
  }

  .game-stats {
    flex-wrap: wrap;
  }

  .game-cabinet {
    padding: 12px 12px 17px !important;
    border-radius: 16px 16px 8px 8px !important;
    box-shadow: 7px 9px 0 rgba(0,0,0,.25) !important;
  }

  .game-screen {
    height: min(68vw, 310px) !important;
    min-height: 240px;
    border-width: 8px !important;
  }

  .catch-star {
    font-size: clamp(2.6rem,12vw,3.4rem) !important;
  }

  .screen-idle b {
    font-size: clamp(2rem,10vw,2.8rem) !important;
  }

  .cabinet-controls {
    flex-wrap: wrap;
  }

  .cabinet-controls small {
    width: 100%;
    margin-left: 0 !important;
    margin-top: 4px;
  }

  .memory-machine,
  .ticket-machine {
    padding: 20px 17px !important;
    transform: none !important;
    box-shadow: 6px 7px 0 rgba(24,33,60,.12) !important;
  }

  .memory-grid {
    gap: 7px !important;
  }

  .memory-card {
    font-size: 1.35rem !important;
  }

  .ticket-window {
    padding: 18px 12px !important;
    font-size: 1.15rem !important;
  }

  .chief-photo,
  .executive-hold .chief-photo,
  .executive-brief-photo {
    width: min(82vw, 350px);
  }

  .chief-copy h2,
  .building-copy h2 {
    font-size: clamp(2.6rem,13vw,3.5rem) !important;
  }

  .floor-list > div {
    grid-template-columns: 38px minmax(0,1fr) !important;
    gap: 12px !important;
    padding: 14px !important;
  }

  .floor-list em {
    grid-column: 2 !important;
    justify-self: start;
  }

  .status-board,
  .building-notice,
  .visitor-note,
  .clipping-note,
  .executive-hold-card {
    transform: none !important;
  }

  .bot-big-name h2 {
    font-size: clamp(3rem,15vw,4.1rem) !important;
  }

  .portal-wrap {
    padding: 22px 12px !important;
  }

  .portal-body {
    padding: 25px 18px !important;
  }

  .portal-body h1 {
    font-size: clamp(2rem,11vw,3rem) !important;
  }

  .portal-form,
  .records-input-row {
    grid-template-columns: minmax(0,1fr) !important;
  }

  .records-body {
    padding: 23px 16px !important;
  }

  .records-heading h1 {
    font-size: clamp(1.8rem,10vw,2.45rem) !important;
  }

  .records-footer {
    flex-direction: column;
  }

  .footer-grid nav {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 4px 14px;
  }

  .yume-toast {
    left: calc(12px + var(--yq-safe-left)) !important;
    right: calc(12px + var(--yq-safe-right)) !important;
    bottom: calc(12px + var(--yq-safe-bottom)) !important;
    width: auto;
    transform: translateY(20px) !important;
    text-align: center;
  }

  .yume-toast.show {
    transform: none !important;
  }
}

@media (max-width: 390px) {
  .brand span {
    max-width: 205px;
  }

  .brand small {
    display: none;
  }

  .nav-toggle {
    padding-inline: 10px !important;
  }

  .memory-grid {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
  }

  .memory-card {
    min-height: 54px;
  }
}

/* Accessibility and performance preferences. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  .marquee > div { animation: none !important; }
}

@media (prefers-contrast: more) {
  :is(.play-button,.game-start,.small-machine-button,.memory-card) {
    border-width: 2px !important;
  }
  .site-nav a[aria-current="page"] {
    outline: 2px solid currentColor;
  }
}

/* 2026-09-01 Executive Office layout refinement.
   Keep the original strong portrait-led composition without turning the
   public company page into an ARG explanation panel. */
.executive-brief {
  padding: clamp(64px,7vw,88px) 0;
}

.executive-brief-card {
  width: min(100%, 1100px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(300px, 380px) minmax(0, 1fr);
  gap: clamp(42px, 6vw, 78px);
  align-items: center;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.executive-brief-photo {
  width: 100%;
  max-width: 380px;
  margin: 0;
  transform: rotate(-.8deg);
  box-shadow: 12px 14px 0 rgba(24,33,60,.15);
}

.executive-brief-photo img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: center top;
}

.executive-brief-copy {
  max-width: 650px;
}

.executive-brief-copy h2 {
  margin: 16px 0 6px;
  font-size: clamp(3rem, 5.2vw, 4.8rem);
  line-height: .9;
  letter-spacing: -.055em;
}

.executive-brief-copy .executive-role {
  margin: 12px 0 22px;
}

.executive-brief-copy > p:last-child {
  max-width: 590px;
  font-size: 1.05rem;
  line-height: 1.6;
}

@media (min-width: 621px) and (max-width: 900px) {
  .executive-brief-card {
    grid-template-columns: minmax(230px, 300px) minmax(0, 1fr) !important;
    gap: clamp(28px, 5vw, 44px) !important;
  }

  .executive-brief-photo {
    width: 100% !important;
    max-width: 300px;
    margin: 0 !important;
  }

  .executive-brief-copy h2 {
    font-size: clamp(2.8rem, 7vw, 4rem) !important;
  }
}

@media (max-width: 620px) {
  .executive-brief-card {
    grid-template-columns: minmax(0,1fr) !important;
    gap: 34px !important;
  }

  .executive-brief-photo {
    width: min(82vw, 340px) !important;
    max-width: 340px;
    margin: 0 !important;
  }

  .executive-brief-copy h2 {
    font-size: clamp(2.8rem, 14vw, 3.8rem) !important;
  }
}