:root {
  color-scheme: dark;
  --bg: #080516;
  --panel: #130d2d;
  --panel-strong: #201044;
  --text: #fff8ff;
  --muted: #b8a9d9;
  --line: #49317a;
  --accent: #00f5ff;
  --accent-dark: #0066ff;
  --mint: #39ff88;
  --rose: #ff2f92;
  --amber: #ffd23f;
  --violet: #b536ff;
  --blue: #32a7ff;
  --green: #39ff88;
  --shadow: 0 24px 80px rgba(0, 0, 0, .42);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
  position: relative;
  overflow-x: hidden;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background:
    linear-gradient(rgba(0, 245, 255, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 47, 146, .03) 1px, transparent 1px),
    radial-gradient(circle at 12% 8%, rgba(0, 245, 255, .2), transparent 28%),
    radial-gradient(circle at 88% 2%, rgba(181, 54, 255, .16), transparent 24%),
    radial-gradient(circle at 50% 120%, rgba(255, 47, 146, .18), transparent 40%),
    linear-gradient(180deg, rgba(8, 5, 22, 0) 0 42vh, rgba(33, 7, 26, .42) 120vh, rgba(18, 3, 15, .88) 220vh),
    linear-gradient(155deg, rgba(57, 255, 136, .08), transparent 34%),
    var(--bg);
  background-size: 42px 42px, 42px 42px, auto, auto, auto, auto, auto, auto;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 17% 23%, rgba(255, 255, 255, .08) 0 1px, transparent 1.8px),
    radial-gradient(circle at 71% 41%, rgba(0, 245, 255, .075) 0 1px, transparent 1.6px),
    radial-gradient(circle at 44% 68%, rgba(255, 47, 146, .07) 0 1px, transparent 1.7px),
    radial-gradient(circle at 83% 76%, rgba(255, 210, 63, .055) 0 1px, transparent 1.8px),
    repeating-linear-gradient(
      0deg,
      rgba(255, 255, 255, .025) 0 1px,
      transparent 1px 4px
    );
  background-size: 19px 17px, 23px 29px, 31px 27px, 37px 33px, auto;
  opacity: .42;
  mix-blend-mode: screen;
}

body::after {
  content: "";
  position: fixed;
  inset: auto 0 0;
  z-index: 0;
  height: 52vh;
  pointer-events: none;
  background:
    radial-gradient(circle, rgba(255, 210, 63, .36) 0 1px, transparent 2px) 8px 16px / 86px 58px,
    radial-gradient(circle, rgba(255, 47, 146, .34) 0 1px, transparent 2px) 44px 28px / 96px 72px,
    radial-gradient(circle, rgba(0, 245, 255, .3) 0 1px, transparent 2px) 22px 6px / 112px 80px,
    linear-gradient(180deg, transparent, rgba(18, 3, 15, .74));
  opacity: .28;
}

button {
  font: inherit;
}

.compact-stats {
  position: fixed;
  top: 8px;
  left: 50%;
  z-index: 30;
  width: min(620px, calc(100vw - 24px));
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 6px;
  border: 1px solid rgba(0, 245, 255, .34);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(0, 245, 255, .1), rgba(255, 47, 146, .1)),
    rgba(7, 5, 18, .78);
  backdrop-filter: blur(8px);
  box-shadow:
    0 10px 34px rgba(0, 0, 0, .34),
    inset 0 -2px 0 rgba(255, 47, 146, .18);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -130%);
  transition: opacity .18s ease, transform .18s ease;
}

.show-compact-stats .compact-stats {
  opacity: 1;
  transform: translate(-50%, 0);
}

.compact-stats > div {
  min-width: 0;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  padding: 5px 8px;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 6px;
  background: rgba(8, 5, 22, .42);
}

.compact-stats span {
  color: var(--muted);
  font-size: .68rem;
  font-weight: 900;
  text-transform: uppercase;
}

.compact-stats strong {
  min-width: 0;
  color: var(--green);
  font-size: .92rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.compact-stats > div:last-child strong {
  color: var(--blue);
}

.game-shell {
  --shell-top-pad: 14px;
  position: relative;
  z-index: 1;
  width: min(1220px, calc(100vw - 32px));
  min-height: 100vh;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-items: start;
  padding: var(--shell-top-pad) 0 14px;
}

.portfolio-panel,
.side-panel {
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.portfolio-panel {
  --header-art-height: clamp(380px, 34vw, 430px);
  position: relative;
  min-height: 0;
  display: grid;
  grid-template-rows: auto auto auto auto auto 1fr;
  gap: 12px;
  overflow: visible;
  padding: 0;
}

.portfolio-panel::before,
.portfolio-panel::after {
  content: "";
  position: absolute;
  top: calc(var(--shell-top-pad) * -1);
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
  pointer-events: none;
}

.portfolio-panel::before {
  z-index: 0;
  height: calc(var(--header-art-height) + var(--shell-top-pad));
  background:
    linear-gradient(180deg, rgba(5, 2, 14, .04), rgba(5, 2, 14, .18) 62%, rgba(5, 2, 14, .92)),
    linear-gradient(90deg, rgba(3, 2, 9, .08), rgba(3, 2, 9, .22)),
  url("assets/facility-garage-lab-ambient.gif") center 38% / cover no-repeat,
  url("assets/facility-garage-lab.png") center 38% / cover no-repeat;
  opacity: .92;
  animation: headerBreath 16s ease-in-out infinite;
}

.portfolio-panel[data-stage="1"]::before,
.portfolio-panel[data-stage="2"]::before {
  background:
    linear-gradient(180deg, rgba(5, 2, 14, .04), rgba(5, 2, 14, .18) 62%, rgba(5, 2, 14, .92)),
    linear-gradient(90deg, rgba(3, 2, 9, .08), rgba(3, 2, 9, .22)),
    url("assets/facility-warehouse-ambient.gif") center 38% / cover no-repeat,
    url("assets/facility-warehouse.png") center 38% / cover no-repeat;
}

.portfolio-panel[data-stage="3"]::before,
.portfolio-panel[data-stage="4"]::before {
  background:
    linear-gradient(180deg, rgba(5, 2, 14, .04), rgba(5, 2, 14, .18) 62%, rgba(5, 2, 14, .92)),
    linear-gradient(90deg, rgba(3, 2, 9, .08), rgba(3, 2, 9, .22)),
    url("assets/facility-private-grid-ambient.gif") center 38% / cover no-repeat,
    url("assets/facility-private-grid.png") center 38% / cover no-repeat;
}

.portfolio-panel[data-stage="5"]::before {
  background:
    linear-gradient(180deg, rgba(5, 2, 14, .04), rgba(5, 2, 14, .16) 62%, rgba(5, 2, 14, .92)),
    linear-gradient(90deg, rgba(3, 2, 9, .08), rgba(3, 2, 9, .22)),
    url("assets/facility-autonomous-city-ambient.gif") center 38% / cover no-repeat,
    url("assets/facility-autonomous-city.png") center 38% / cover no-repeat;
}

.portfolio-panel::after {
  z-index: 0;
  height: calc(var(--header-art-height) + var(--shell-top-pad));
  background:
    radial-gradient(ellipse at 30% 66%, rgba(0, 245, 255, .16), transparent 34%),
    radial-gradient(ellipse at 76% 58%, rgba(255, 47, 146, .12), transparent 32%),
    linear-gradient(90deg, transparent, rgba(255, 255, 255, .11) 48%, transparent 58%),
    linear-gradient(180deg, transparent 0 44%, rgba(8, 5, 22, .08) 68%, rgba(8, 5, 22, .86) 100%);
  background-size: 100% 100%, 100% 100%, 42% 100%, 100% 100%;
  background-position: 0 0, 0 0, -58% 0, 0 0;
  mix-blend-mode: screen;
  opacity: .82;
  animation: headerWeather 13s linear infinite, headerLightning 9s steps(1, end) infinite;
}

.portfolio-panel > * {
  position: relative;
  z-index: 1;
}

.side-panel {
  min-height: 0;
  display: grid;
  grid-template-rows: auto auto auto 1fr;
  gap: 16px;
  padding: 20px;
}

.title-row,
.section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.title-row {
  align-items: center;
  justify-content: flex-start;
}

.title-row > div:not(.ai-status) {
  flex: 1 1 auto;
  min-width: 0;
}

.sound-toggle,
.settings-mute {
  flex: 0 0 auto;
  align-self: start;
  display: inline-grid;
  place-items: center;
  width: 40px;
  min-width: 40px;
  height: 34px;
  padding: 0;
  border: 1px solid rgba(255, 47, 146, .42);
  border-radius: 999px;
  color: var(--text);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  background:
    linear-gradient(135deg, rgba(255, 47, 146, .22), rgba(0, 245, 255, .12)),
    rgba(8, 5, 22, .58);
  box-shadow:
    0 0 18px rgba(255, 47, 146, .22),
    inset 0 0 14px rgba(0, 245, 255, .08);
  backdrop-filter: blur(2px);
}

.sound-toggle svg,
.settings-mute svg {
  width: 18px;
  height: 18px;
  stroke-width: 2.6;
}

.sound-toggle:hover,
.settings-mute:hover {
  transform: translateY(-1px);
  border-color: rgba(0, 245, 255, .55);
  box-shadow:
    0 0 22px rgba(0, 245, 255, .24),
    inset 0 0 16px rgba(255, 47, 146, .14);
}

.sound-toggle.is-muted,
.settings-mute.is-muted {
  color: var(--muted);
  border-color: rgba(255, 255, 255, .18);
  background: rgba(8, 5, 22, .46);
  box-shadow: inset 0 0 12px rgba(255, 255, 255, .04);
}

.section-heading h2 {
  position: relative;
  padding-left: 12px;
  text-shadow:
    1px 0 0 rgba(0, 245, 255, .5),
    -1px 0 0 rgba(255, 47, 146, .42);
}

.section-heading h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: .12em;
  bottom: .08em;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--rose), var(--accent), var(--amber));
  box-shadow: 0 0 12px rgba(0, 245, 255, .32);
}

.eyebrow,
.metric-label {
  display: block;
  margin: 0 0 6px;
  color: var(--muted);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

h1,
h2,
h3,
p {
  margin: 0;
  letter-spacing: 0;
}

h1 {
  font-size: clamp(2rem, 5vw, 4rem);
  line-height: .95;
  color: #fff8ff;
  text-shadow:
    2px 0 0 rgba(0, 245, 255, .65),
    -2px 0 0 rgba(255, 47, 146, .55),
    0 0 26px rgba(0, 245, 255, .28);
}

.intro-copy {
  max-width: 760px;
  margin-top: 8px;
  color: var(--muted);
  font-size: .86rem;
  line-height: 1.35;
}

.intro-copy[hidden] {
  display: none;
}

h2 {
  font-size: 1rem;
}

h3 {
  font-size: .84rem;
}

.scoreboard {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.scoreboard > div {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid rgba(0, 245, 255, .28);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(0, 245, 255, .055), rgba(11, 8, 28, .12) 45%, rgba(255, 47, 146, .05)),
    rgba(7, 5, 18, .16);
  backdrop-filter: blur(1px);
  box-shadow:
    inset 0 -2px 0 rgba(255, 47, 146, .22),
    inset 0 0 22px rgba(103, 232, 249, .08);
}

.scoreboard strong {
  display: block;
  font-size: clamp(1rem, 1.8vw, 1.38rem);
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.scoreboard > div:nth-child(1) strong {
  color: var(--green);
  text-shadow: 0 0 14px rgba(57, 255, 136, .28);
}

.scoreboard > div:nth-child(2) strong,
.scoreboard > div:nth-child(4) strong {
  color: var(--blue);
  text-shadow: 0 0 14px rgba(50, 167, 255, .3);
}

.scoreboard > div:nth-child(3) strong {
  color: var(--amber);
  text-shadow: 0 0 14px rgba(255, 210, 63, .28);
}

.world-stage {
  --power-fill: 10%;
  --gpu-fill: 10%;
  position: relative;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(140px, .38fr) minmax(0, 1fr);
  gap: 8px;
  align-items: stretch;
  overflow: hidden;
  padding: 8px;
  border: 1px solid rgba(0, 245, 255, .3);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(0, 245, 255, .1), transparent 34%),
    radial-gradient(circle at 94% 18%, rgba(255, 47, 146, .18), transparent 32%),
    rgba(7, 5, 18, .5);
  backdrop-filter: blur(3px);
  box-shadow:
    inset 0 0 28px rgba(0, 245, 255, .08),
    inset 0 -2px 0 rgba(255, 47, 146, .22);
}

.world-stage::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent, rgba(0, 245, 255, .16), transparent) -70% 0 / 42% 100% no-repeat,
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 5px);
  opacity: .48;
  mix-blend-mode: screen;
  animation: stageScanner 5.8s linear infinite;
}

.world-stage.power-starved {
  border-color: rgba(255, 47, 146, .48);
  box-shadow:
    inset 0 0 40px rgba(255, 47, 146, .12),
    0 0 22px rgba(255, 47, 146, .08);
}

.facility-scene {
  display: none;
}

.world-stage[data-stage="1"] .facility-scene,
.world-stage[data-stage="2"] .facility-scene {
  background:
    linear-gradient(180deg, rgba(2, 1, 8, .02), rgba(2, 1, 8, .24) 62%, rgba(2, 1, 8, .7)),
    url("assets/facility-warehouse-ambient.gif") center / cover no-repeat,
    url("assets/facility-warehouse.png") center / cover no-repeat,
    rgba(3, 2, 9, .9);
}

.world-stage[data-stage="3"] .facility-scene,
.world-stage[data-stage="4"] .facility-scene {
  background:
    linear-gradient(180deg, rgba(2, 1, 8, .04), rgba(2, 1, 8, .22) 58%, rgba(2, 1, 8, .72)),
    url("assets/facility-private-grid-ambient.gif") center / cover no-repeat,
    url("assets/facility-private-grid.png") center / cover no-repeat,
    rgba(3, 2, 9, .9);
}

.world-stage[data-stage="5"] .facility-scene {
  background:
    linear-gradient(180deg, rgba(2, 1, 8, .08), rgba(2, 1, 8, .2) 56%, rgba(2, 1, 8, .74)),
    url("assets/facility-autonomous-city-ambient.gif") center / cover no-repeat,
    url("assets/facility-autonomous-city.png") center / cover no-repeat,
    rgba(3, 2, 9, .9);
}

.facility-grid {
  position: absolute;
  inset: 52% -10% -28%;
  transform: perspective(160px) rotateX(54deg);
  transform-origin: top;
  background:
    linear-gradient(rgba(0, 245, 255, .22) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 47, 146, .18) 1px, transparent 1px);
  background-size: 26px 18px;
  opacity: .52;
}

.facility-grid,
.facility-skyline,
.facility-land,
.facility-lab,
.facility-plant,
.facility-farm {
  display: none;
}

.facility-skyline,
.facility-land,
.facility-lab,
.facility-plant,
.facility-farm,
.facility-ai-eye {
  position: absolute;
  transition: opacity .35s ease, transform .35s ease, filter .35s ease;
}

.facility-skyline {
  left: 54%;
  right: 4%;
  bottom: 38px;
  height: 58px;
  opacity: .22;
  background:
    linear-gradient(180deg, transparent 0 18%, rgba(0, 245, 255, .42) 18% 19%, transparent 20%),
    linear-gradient(90deg, transparent 0 5%, rgba(0, 245, 255, .24) 5% 14%, transparent 14% 19%, rgba(255, 47, 146, .22) 19% 31%, transparent 31% 36%, rgba(255, 210, 63, .22) 36% 45%, transparent 45% 50%, rgba(0, 245, 255, .22) 50% 61%, transparent 61% 68%, rgba(255, 47, 146, .2) 68% 84%, transparent 84%);
  clip-path: polygon(0 100%, 0 52%, 9% 52%, 9% 28%, 18% 28%, 18% 62%, 29% 62%, 29% 36%, 40% 36%, 40% 72%, 53% 72%, 53% 22%, 65% 22%, 65% 56%, 78% 56%, 78% 34%, 90% 34%, 90% 100%);
}

.facility-land {
  left: 5%;
  right: 9%;
  bottom: 19px;
  height: 30px;
  opacity: .2;
  background:
    repeating-linear-gradient(90deg, rgba(255, 210, 63, .42) 0 2px, transparent 2px 42px),
    linear-gradient(90deg, rgba(255, 210, 63, .2), rgba(255, 47, 146, .12));
  clip-path: polygon(0 68%, 100% 16%, 100% 100%, 0 100%);
}

.facility-lab {
  left: 7%;
  bottom: 28px;
  width: 88px;
  height: 52px;
  border: 2px solid rgba(0, 245, 255, .52);
  border-bottom-width: 5px;
  border-radius: 7px 7px 3px 3px;
  background:
    radial-gradient(circle at 18% 38%, rgba(57, 255, 136, .9) 0 3px, transparent 4px),
    linear-gradient(90deg, rgba(0, 245, 255, .22) 0 24%, transparent 24% 29%, rgba(255, 47, 146, .24) 29% 54%, transparent 54% 62%, rgba(255, 210, 63, .2) 62% 84%, transparent 84%),
    rgba(10, 7, 30, .92);
  box-shadow: 0 0 22px rgba(0, 245, 255, .22);
}

.facility-lab span {
  position: absolute;
  bottom: -13px;
  width: 22px;
  height: 16px;
  border: 1px solid rgba(0, 245, 255, .35);
  background: rgba(13, 10, 32, .9);
}

.facility-lab span:nth-child(1) { left: 10px; }
.facility-lab span:nth-child(2) { left: 34px; }
.facility-lab span:nth-child(3) { left: 58px; }

.facility-plant {
  left: 36%;
  bottom: 28px;
  width: 104px;
  height: 68px;
  opacity: .22;
  transform: translateY(18px) scale(.82);
}

.facility-plant::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 34px;
  border: 2px solid rgba(255, 210, 63, .58);
  border-radius: 6px 6px 2px 2px;
  background:
    linear-gradient(90deg, rgba(255, 210, 63, .2), transparent 34%),
    rgba(20, 10, 20, .92);
}

.facility-plant span {
  position: absolute;
  bottom: 26px;
  width: 26px;
  height: 42px;
  border: 2px solid rgba(255, 210, 63, .6);
  border-radius: 999px 999px 4px 4px;
  background: linear-gradient(180deg, rgba(255, 210, 63, .2), rgba(8, 5, 22, .9));
}

.facility-plant span:first-child { left: 18px; }
.facility-plant span:last-child { left: 56px; height: 54px; }

.facility-plant span::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 92%;
  width: 28px;
  height: 34px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, .22), transparent 64%);
  transform: translateX(-50%);
  animation: facilitySteam 3.6s ease-in-out infinite;
}

.facility-farm {
  right: 13%;
  bottom: 26px;
  width: 128px;
  height: 72px;
  opacity: .18;
  transform: translateY(20px) scale(.8);
}

.facility-farm span {
  position: absolute;
  bottom: 0;
  width: 30px;
  height: 60px;
  border: 2px solid rgba(0, 245, 255, .5);
  border-radius: 5px;
  background:
    repeating-linear-gradient(180deg, rgba(0, 245, 255, .36) 0 2px, transparent 2px 8px),
    rgba(7, 5, 18, .94);
  box-shadow: inset 0 0 14px rgba(0, 245, 255, .12);
}

.facility-farm span:nth-child(1) { left: 0; height: 48px; }
.facility-farm span:nth-child(2) { left: 44px; }
.facility-farm span:nth-child(3) { left: 88px; height: 66px; }

.facility-ai-eye {
  right: 7%;
  top: 15px;
  width: 58px;
  height: 24px;
  opacity: 0;
  border: 2px solid rgba(255, 47, 146, .75);
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, .95) 0 3px, rgba(255, 47, 146, .95) 4px 8px, transparent 9px),
    rgba(255, 47, 146, .08);
  box-shadow: 0 0 20px rgba(255, 47, 146, .28);
}

.world-stage[data-stage="5"] .facility-ai-eye {
  opacity: 1;
  animation: eyeWatch 4.4s steps(1, end) infinite;
}

.infra-map {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: auto;
  gap: 8px;
  min-width: 0;
}

.infra-node {
  display: grid;
  align-content: center;
  gap: 3px;
  min-width: 0;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 8px;
  background: rgba(8, 5, 22, .26);
  backdrop-filter: blur(1px);
  box-shadow: inset 0 0 18px rgba(255, 255, 255, .035);
}

.infra-node span {
  color: var(--muted);
  font-size: .68rem;
  font-weight: 900;
  text-transform: uppercase;
}

.infra-node strong {
  min-width: 0;
  color: var(--text);
  font-size: .86rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.power-node {
  grid-column: 1;
  grid-row: 1;
  background:
    linear-gradient(90deg, rgba(255, 210, 63, .38) var(--power-fill), rgba(8, 5, 22, .26) var(--power-fill));
}

.gpu-node {
  grid-column: 2;
  grid-row: 1;
  background:
    linear-gradient(90deg, rgba(0, 245, 255, .32) var(--gpu-fill), rgba(8, 5, 22, .26) var(--gpu-fill));
}

.revenue-node {
  display: none;
  grid-column: 3;
  grid-row: 1;
  border-color: rgba(255, 47, 146, .3);
  background:
    linear-gradient(90deg, rgba(255, 47, 146, .16), rgba(0, 245, 255, .08)),
    rgba(8, 5, 22, .26);
}

.infra-link {
  display: none;
}

.revenue-link {
  display: none;
}

#visual-caption {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 8px 10px;
  border-right: 1px solid rgba(255, 255, 255, .1);
  color: var(--muted);
  font-size: .7rem;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

#save-status {
  color: var(--green);
  font-size: .84rem;
  font-weight: 800;
}

.business-list,
.manager-list,
.resource-list,
.unlock-list,
.event-choices {
  display: grid;
  gap: 8px;
  align-content: start;
}

.decision-dock {
  position: fixed;
  right: clamp(12px, 2vw, 22px);
  bottom: clamp(14px, 2vw, 24px);
  z-index: 18;
  display: grid;
  justify-items: end;
  gap: 8px;
  pointer-events: none;
}

.decision-dock[hidden] {
  display: none;
}

.decision-tab,
.decision-dock .event-panel {
  pointer-events: auto;
}

.decision-tab {
  display: inline-grid;
  grid-template-columns: auto;
  place-items: center;
  min-width: 46px;
  min-height: 46px;
  padding: 0 12px;
  border: 1px solid rgba(255, 210, 63, .56);
  border-radius: 999px;
  color: var(--amber);
  background:
    radial-gradient(circle at 35% 28%, rgba(255, 210, 63, .22), transparent 38%),
    rgba(10, 7, 22, .82);
  box-shadow:
    0 0 24px rgba(255, 210, 63, .22),
    inset 0 0 18px rgba(255, 47, 146, .12);
  backdrop-filter: blur(8px);
  cursor: pointer;
  font-weight: 900;
  text-transform: uppercase;
}

.decision-tab::before {
  content: "!";
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  color: #14020d;
  background: var(--amber);
  box-shadow: 0 0 14px rgba(255, 210, 63, .44);
}

.decision-tab span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.decision-dock.is-open .decision-tab {
  border-radius: 999px 999px 8px 8px;
}

.decision-dock .event-panel {
  width: min(420px, calc(100vw - 28px));
  max-height: min(520px, calc(100vh - 96px));
  overflow: auto;
  border-color: rgba(255, 210, 63, .42);
  background:
    linear-gradient(135deg, rgba(255, 210, 63, .12), rgba(255, 47, 146, .08)),
    rgba(8, 5, 22, .86);
  box-shadow:
    0 18px 58px rgba(0, 0, 0, .42),
    inset 0 0 0 1px rgba(255, 255, 255, .05);
  backdrop-filter: blur(10px);
}

.infrastructure-list {
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255, 47, 146, .3);
}

.infrastructure-list .business {
  background:
    linear-gradient(90deg, rgba(255, 210, 63, .14), transparent 30%),
    linear-gradient(180deg, rgba(16, 11, 34, .64), rgba(8, 5, 22, .74));
  backdrop-filter: blur(3px);
}

.product-list .business {
  background:
    linear-gradient(90deg, rgba(0, 245, 255, .12), transparent 34%),
    linear-gradient(180deg, rgba(18, 10, 42, .64), rgba(8, 5, 22, .76));
  backdrop-filter: blur(3px);
}

.business-list,
.manager-list {
  padding-right: 4px;
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.stat-card {
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(0, 245, 255, .22);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(0, 245, 255, .09), rgba(255, 47, 146, .06)),
    rgba(7, 5, 18, .54);
  backdrop-filter: blur(2px);
  box-shadow: inset 0 -2px 0 rgba(255, 47, 146, .12);
}

.stat-card span,
.stat-card small {
  display: block;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
}

.stat-card strong {
  display: block;
  margin: 3px 0 2px;
  color: var(--green);
  font-size: clamp(1.05rem, 2.4vw, 1.45rem);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-shadow: 0 0 13px rgba(57, 255, 136, .22);
}

.stat-card small {
  color: rgba(238, 246, 255, .68);
  font-size: .68rem;
  text-transform: none;
}

.resource-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.infra-status {
  display: grid;
  grid-template-columns: auto minmax(210px, 1fr);
  gap: 8px;
  align-items: stretch;
  padding: 7px;
  border: 1px solid rgba(255, 210, 63, .32);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(255, 210, 63, .12), transparent 32%),
    rgba(7, 5, 18, .52);
  backdrop-filter: blur(3px);
}

.infra-status h3 {
  margin: 0;
  align-self: center;
  color: var(--muted);
  font-size: .74rem;
  font-weight: 900;
  text-transform: uppercase;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  letter-spacing: .04em;
}

.infra-status .resource small {
  display: none;
}

.buy-mode {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(0, 245, 255, .045), rgba(255, 47, 146, .045)),
    rgba(20, 12, 46, .34);
  backdrop-filter: blur(2px);
}

.app-tabs {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  padding: 0 8px;
  border-bottom: 1px solid rgba(0, 245, 255, .34);
}

.app-tabs button {
  position: relative;
  min-height: 34px;
  margin-bottom: -1px;
  padding: 7px 14px 8px;
  border: 1px solid transparent;
  border-bottom-color: var(--line);
  border-radius: 8px 8px 0 0;
  color: var(--text);
  background: transparent;
  cursor: pointer;
  font-size: .86rem;
  font-weight: 850;
}

.app-tabs button:hover:not(.active) {
  color: var(--accent);
  background: rgba(103, 232, 249, .08);
}

.app-tabs button.active {
  border-color: var(--accent);
  border-bottom-color: var(--bg);
  background:
    linear-gradient(180deg, rgba(0, 245, 255, .18), rgba(8, 5, 22, .92));
  color: var(--accent);
  box-shadow:
    0 -2px 0 rgba(255, 47, 146, .5) inset,
    0 0 18px rgba(103, 232, 249, .12);
}

.tab-panel {
  --tab-poster: url("assets/tab-products-bg.png");
  --tab-poster-position: center top;
  --tab-poster-size: 100% auto;
  position: relative;
  display: grid;
  gap: 10px;
  align-content: start;
  min-height: 420px;
  overflow: hidden;
  padding: 10px;
  border-radius: 8px;
}

.tab-panel[hidden] {
  display: none;
}

.tab-panel > *:not(.tab-showcase) {
  position: relative;
  z-index: 1;
}

.tab-showcase {
  position: absolute;
  inset: 0;
  z-index: 0;
  min-height: 100%;
  overflow: hidden;
  border: 1px solid rgba(0, 245, 255, .16);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(3, 2, 9, .05), rgba(3, 2, 9, .22)),
    var(--tab-poster) var(--tab-poster-position) / var(--tab-poster-size) no-repeat,
    rgba(3, 2, 9, .82);
  box-shadow:
    inset 0 0 26px rgba(0, 245, 255, .1),
    inset 0 -2px 0 rgba(255, 47, 146, .18);
}

.tab-showcase::before,
.tab-showcase::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.tab-showcase::before {
  background:
    radial-gradient(ellipse at 10% 70%, rgba(255, 255, 255, .08), transparent 38%),
    radial-gradient(ellipse at 82% 34%, rgba(0, 245, 255, .1), transparent 42%),
    linear-gradient(90deg, rgba(0, 245, 255, .12), transparent 18% 74%, rgba(255, 47, 146, .16)),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .07) 0 1px, transparent 1px 4px);
  background-size: 62% 100%, 70% 100%, 100% 100%, 100% 4px;
  background-position: -24% 0, 118% 0, 0 0, 0 0;
  mix-blend-mode: screen;
  opacity: .18;
  animation: tabFogDrift 17s ease-in-out infinite, tabScanlines 1.6s linear infinite;
}

.tab-showcase::after {
  inset: 0;
  height: auto;
  background:
    linear-gradient(180deg, rgba(8, 5, 22, .08) 0, rgba(8, 5, 22, .28) 58%, rgba(8, 5, 22, .86) 100%),
    radial-gradient(circle at 25% 22%, transparent 0 22%, rgba(8, 5, 22, .16) 54%, rgba(8, 5, 22, .42) 100%),
    linear-gradient(90deg, var(--accent), var(--rose), var(--amber), var(--green)) left bottom / 100% 3px no-repeat;
  box-shadow: inset 0 -20px 44px rgba(8, 5, 22, .78);
  animation: tabGlowRoll 11s ease-in-out infinite;
}

.products-showcase {
  --tab-poster: url("assets/tab-products-bg.png");
  --tab-poster-position: center top;
  --tab-poster-size: min(100%, 1180px) auto;
}

.systems-showcase {
  --tab-poster: url("assets/tab-systems-bg.png");
}

.operators-showcase {
  --tab-poster: url("assets/tab-operators-bg.png");
}

.stats-showcase {
  --tab-poster: url("assets/tab-stats-bg.png");
}

.buy-mode span {
  margin-right: auto;
  color: var(--muted);
  font-size: .82rem;
  font-weight: 900;
  text-transform: uppercase;
}

.buy-mode button {
  min-width: 54px;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  background: rgba(8, 5, 22, .7);
  cursor: pointer;
  font-weight: 900;
}

.buy-mode button.active {
  border-color: var(--amber);
  background:
    linear-gradient(180deg, rgba(255, 210, 63, .28), rgba(120, 78, 18, .32));
  color: var(--amber);
  box-shadow: 0 0 14px rgba(255, 210, 63, .16);
}

.resource,
.event-panel {
  border: 1px solid rgba(0, 245, 255, .2);
  border-radius: 8px;
  background: rgba(32, 16, 68, .5);
  backdrop-filter: blur(2px);
}

.resource {
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 8px;
  align-items: center;
  padding: 9px 10px;
}

.resource strong,
.resource small,
.resource em {
  display: block;
}

.resource strong {
  font-size: .86rem;
}

.resource small,
.unlock small,
.event-panel p,
.event-choice small {
  color: var(--muted);
  font-size: .78rem;
  line-height: 1.35;
}

.resource em {
  flex: 0 0 auto;
  color: var(--green);
  font-size: 1.05rem;
  font-style: normal;
  font-weight: 900;
}

.resource-flow {
  grid-column: auto;
  font-size: .78rem;
  font-weight: 900;
}

.resource-flow.up {
  color: var(--green);
}

.resource-flow.down {
  color: var(--rose);
}

.resource-flow.flat {
  color: var(--muted);
}

.resource-button {
  grid-column: 1 / -1;
  min-height: 28px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  background:
    linear-gradient(90deg, rgba(255, 210, 63, .34) var(--ready, 0%), rgba(8, 5, 22, .55) var(--ready, 0%));
  cursor: pointer;
  font-weight: 800;
}

.resource-button:hover:not(:disabled) {
  border-color: var(--accent);
}

.business {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr) 84px;
  gap: 8px;
  align-items: center;
  min-height: 82px;
  padding: 7px;
  border: 1px solid rgba(0, 245, 255, .24);
  border-radius: 8px;
  background: var(--panel-strong);
  box-shadow:
    inset 3px 0 0 rgba(0, 245, 255, .36),
    0 0 18px rgba(103, 232, 249, .06),
    inset 0 1px 0 rgba(255, 255, 255, .035);
  transition: border-color .16s ease, transform .16s ease, background .16s ease;
}

.business:hover {
  border-color: rgba(0, 245, 255, .52);
  transform: translateY(-1px);
  box-shadow:
    inset 3px 0 0 rgba(255, 47, 146, .5),
    0 0 22px rgba(0, 245, 255, .11);
}

.business-icon,
.manager-icon {
  display: grid;
  place-items: center;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(0, 245, 255, .24), rgba(181, 54, 255, .2));
  color: var(--accent);
  font-weight: 900;
  box-shadow: inset 0 0 18px rgba(103, 232, 249, .08);
}

.machine-art {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .12);
  isolation: isolate;
}

.machine-art::before,
.machine-art::after,
.machine-screen,
.machine-light,
.machine-cable {
  position: absolute;
  display: block;
}

.machine-art::before,
.machine-art::after {
  content: "";
  transition: opacity .2s ease, transform .2s ease, filter .2s ease;
}

.machine-screen {
  inset: 9px 7px 16px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(0, 245, 255, .48);
  border-radius: 4px;
  color: var(--text);
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .14) 0 1px, transparent 1px 4px),
    rgba(0, 245, 255, .08);
  font-size: .56rem;
  letter-spacing: .03em;
  text-shadow: 0 0 8px currentColor;
}

.machine-light {
  right: 6px;
  bottom: 6px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 10px var(--green);
  opacity: .45;
}

.machine-cable {
  left: 6px;
  right: 15px;
  bottom: 7px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--rose), var(--accent), var(--amber));
  opacity: .35;
}

.business[data-tier="0"] .machine-art {
  filter: saturate(.75) brightness(.82);
}

.business[data-tier="2"] .machine-art,
.business[data-tier="3"] .machine-art,
.business[data-tier="4"] .machine-art,
.business[data-tier="5"] .machine-art,
.business[data-tier="6"] .machine-art,
.business[data-tier="7"] .machine-art {
  box-shadow:
    inset 0 0 18px rgba(103, 232, 249, .16),
    0 0 14px rgba(0, 245, 255, .12);
}

.business[data-tier="4"] .machine-art,
.business[data-tier="5"] .machine-art,
.business[data-tier="6"] .machine-art,
.business[data-tier="7"] .machine-art {
  border-color: rgba(255, 47, 146, .42);
}

.business[data-tier="5"] .machine-art::after,
.business[data-tier="6"] .machine-art::after,
.business[data-tier="7"] .machine-art::after {
  inset: 5px;
  border: 1px solid rgba(255, 210, 63, .55);
  border-radius: 6px;
  opacity: .8;
}

.business.is-running .machine-screen {
  animation: machinePulse .9s steps(2, end) infinite;
}

.business.is-automated .machine-light {
  opacity: 1;
  animation: statusBlink 1.4s steps(1, end) infinite, statusColorCycle 5.2s linear infinite;
}

.business.is-starved .machine-light {
  background: var(--rose);
  box-shadow: 0 0 10px var(--rose);
  opacity: 1;
}

.business.is-starved .machine-screen {
  color: var(--rose);
  border-color: rgba(255, 47, 146, .52);
}

.machine-art[data-visual="power-plant"] {
  background:
    linear-gradient(180deg, rgba(255, 210, 63, .16), rgba(8, 5, 22, .86));
  color: var(--amber);
}

.machine-art[data-visual="power-plant"]::before {
  left: 8px;
  bottom: 8px;
  width: 10px;
  height: 27px;
  border-radius: 999px 999px 2px 2px;
  background: rgba(255, 210, 63, .45);
  box-shadow: 15px -7px 0 rgba(255, 210, 63, .34);
}

.machine-art[data-visual="server-farm"]::before {
  inset: 6px 8px 8px;
  background:
    repeating-linear-gradient(180deg, rgba(0, 245, 255, .45) 0 2px, transparent 2px 6px),
    rgba(8, 5, 22, .7);
  border: 1px solid rgba(0, 245, 255, .42);
  border-radius: 4px;
}

.machine-art[data-visual="prompt-booth"]::before {
  inset: 8px 8px 11px;
  border: 1px solid rgba(57, 255, 136, .42);
  border-radius: 7px;
  background:
    linear-gradient(90deg, transparent 42%, rgba(57, 255, 136, .22) 42% 48%, transparent 48%),
    rgba(57, 255, 136, .08);
}

.machine-art[data-visual="meme-cabinet"]::before {
  inset: 6px 8px 8px;
  border: 1px solid rgba(255, 47, 146, .48);
  border-radius: 7px 7px 4px 4px;
  background:
    radial-gradient(circle at 25% 74%, var(--rose) 0 3px, transparent 4px),
    radial-gradient(circle at 72% 74%, var(--amber) 0 3px, transparent 4px),
    rgba(255, 47, 146, .09);
}

.machine-art[data-visual="friend-pod"]::before {
  inset: 7px 10px 7px;
  border: 1px solid rgba(57, 255, 136, .5);
  border-radius: 50% 50% 44% 44%;
  background: radial-gradient(circle at 50% 38%, rgba(255, 255, 255, .5) 0 4px, rgba(57, 255, 136, .16) 5px, transparent 15px);
}

.machine-art[data-visual="advisor-tower"]::before {
  left: 11px;
  right: 11px;
  bottom: 7px;
  height: 30px;
  clip-path: polygon(0 100%, 0 24%, 22% 24%, 22% 0, 72% 0, 72% 32%, 100% 32%, 100% 100%);
  background:
    repeating-linear-gradient(180deg, rgba(0, 245, 255, .44) 0 2px, transparent 2px 7px),
    rgba(0, 245, 255, .12);
}

.machine-art[data-visual="influencer-stage"]::before {
  inset: 8px 7px;
  border-radius: 50%;
  border: 1px solid rgba(255, 47, 146, .5);
  background:
    radial-gradient(circle at 50% 44%, rgba(255, 255, 255, .65) 0 5px, transparent 6px),
    conic-gradient(from 0deg, rgba(255, 47, 146, .35), rgba(0, 245, 255, .28), rgba(255, 210, 63, .26), rgba(255, 47, 146, .35));
}

.machine-art[data-visual="boardroom-core"]::before {
  inset: 8px 6px;
  clip-path: polygon(50% 0, 100% 24%, 100% 76%, 50% 100%, 0 76%, 0 24%);
  border: 1px solid rgba(255, 47, 146, .5);
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 47, 146, .72) 0 5px, transparent 6px),
    linear-gradient(135deg, rgba(255, 47, 146, .18), rgba(0, 245, 255, .16));
}

.machine-art[data-visual] {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .02), rgba(0, 0, 0, .2)),
    rgba(8, 5, 22, .92);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: transparent;
  filter: saturate(.7) brightness(.72);
  transition: filter .18s ease, box-shadow .18s ease, opacity .18s ease;
}

.machine-art[data-visual]::before {
  inset: -20%;
  display: block;
  z-index: 1;
  background:
    radial-gradient(ellipse at 50% 95%, rgba(255, 255, 255, .28), transparent 30%),
    radial-gradient(ellipse at 24% 42%, rgba(0, 245, 255, .2), transparent 26%),
    radial-gradient(ellipse at 76% 40%, rgba(255, 47, 146, .16), transparent 28%);
  mix-blend-mode: screen;
  opacity: 0;
  transform: translate3d(-6%, 7%, 0) scale(1.04);
}

.machine-art[data-visual]::after {
  inset: 0;
  z-index: 1;
  display: block;
  border-radius: inherit;
  background:
    linear-gradient(105deg, transparent 0 36%, rgba(0, 245, 255, 0) 38%, rgba(0, 245, 255, .58) 39%, rgba(255, 210, 63, .45) 40%, transparent 42% 100%),
    repeating-linear-gradient(90deg, transparent 0 8px, rgba(255, 255, 255, .16) 9px 10px, transparent 11px 22px);
  background-size: 180% 100%, 34px 100%;
  background-position: -130% 0, 0 0;
  mix-blend-mode: screen;
  opacity: 0;
}

.machine-art[data-visual="power-plant"] {
  background-image:
    linear-gradient(180deg, rgba(255, 210, 63, .08), rgba(0, 0, 0, .1)),
    url("assets/machine-power-plant.png");
}

.machine-art[data-visual="server-farm"] {
  background-image:
    linear-gradient(180deg, rgba(0, 245, 255, .06), rgba(0, 0, 0, .1)),
    url("assets/machine-server-farm.png");
}

.machine-art[data-visual="prompt-booth"] {
  background-image:
    linear-gradient(180deg, rgba(57, 255, 136, .06), rgba(0, 0, 0, .1)),
    url("assets/machine-prompt-booth.png");
}

.machine-art[data-visual="meme-cabinet"] {
  background-image:
    linear-gradient(180deg, rgba(255, 47, 146, .07), rgba(0, 0, 0, .12)),
    url("assets/machine-meme-cabinet.png");
}

.machine-art[data-visual="friend-pod"] {
  background-image:
    linear-gradient(180deg, rgba(57, 255, 136, .08), rgba(0, 0, 0, .12)),
    url("assets/machine-friend-pod.png");
}

.machine-art[data-visual="advisor-tower"] {
  background-image:
    linear-gradient(180deg, rgba(0, 245, 255, .07), rgba(0, 0, 0, .12)),
    url("assets/machine-advisor-tower.png");
}

.machine-art[data-visual="influencer-stage"] {
  background-image:
    linear-gradient(180deg, rgba(255, 47, 146, .08), rgba(0, 0, 0, .12)),
    url("assets/machine-influencer-stage.png");
}

.machine-art[data-visual="boardroom-core"] {
  background-image:
    linear-gradient(180deg, rgba(255, 47, 146, .07), rgba(0, 0, 0, .12)),
    url("assets/machine-boardroom-core.png");
}

.machine-art[data-visual] .machine-screen,
.machine-art[data-visual] .machine-cable {
  display: none;
}

.machine-art[data-visual] .machine-light {
  right: 5px;
  bottom: 5px;
  z-index: 2;
  width: 6px;
  height: 6px;
}

.business.is-running .machine-art[data-visual],
.business.is-automated .machine-art[data-visual] {
  filter: saturate(1.12) brightness(1.06);
}

.business.is-starved .machine-art[data-visual] {
  filter: saturate(.95) brightness(.78) hue-rotate(24deg);
}

.business.is-running .machine-art[data-visual]::before,
.business.is-automated .machine-art[data-visual]::before {
  opacity: .58;
  animation: machineFog 5.6s ease-in-out infinite;
}

.business.is-running .machine-art[data-visual]::after,
.business.is-automated .machine-art[data-visual]::after {
  opacity: .66;
  animation: machineElectric 1.8s linear infinite;
}

.business.is-starved .machine-art[data-visual]::after {
  opacity: .5;
  background:
    linear-gradient(105deg, transparent 0 40%, rgba(255, 47, 146, .8) 41%, transparent 43% 100%),
    repeating-linear-gradient(0deg, rgba(255, 47, 146, .18) 0 1px, transparent 1px 5px);
  animation: machineFault 1.1s steps(2, end) infinite;
}

.infrastructure-list .business-icon {
  background:
    linear-gradient(135deg, rgba(255, 210, 63, .3), rgba(57, 255, 136, .16));
  color: var(--amber);
}

.product-list .business:nth-child(2n) .business-icon {
  border-color: rgba(255, 47, 146, .42);
  box-shadow:
    inset 0 0 18px rgba(255, 47, 146, .12),
    0 0 14px rgba(255, 47, 146, .12);
}

.product-list .business:nth-child(3n) .business-icon {
  border-color: rgba(57, 255, 136, .4);
  box-shadow:
    inset 0 0 18px rgba(57, 255, 136, .1),
    0 0 14px rgba(57, 255, 136, .1);
}

.business-icon {
  width: 76px;
  height: 76px;
  font-size: .78rem;
}

.business .machine-art[data-visual] {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: transparent;
}

.business .machine-art[data-visual="power-plant"] {
  background-image:
    linear-gradient(180deg, rgba(255, 210, 63, .08), rgba(0, 0, 0, .1)),
    url("assets/machine-power-plant.png");
}

.business .machine-art[data-visual="server-farm"] {
  background-image:
    linear-gradient(180deg, rgba(0, 245, 255, .06), rgba(0, 0, 0, .1)),
    url("assets/machine-server-farm.png");
}

.business .machine-art[data-visual="prompt-booth"] {
  background-image:
    linear-gradient(180deg, rgba(57, 255, 136, .06), rgba(0, 0, 0, .1)),
    url("assets/machine-prompt-booth.png");
}

.business .machine-art[data-visual="meme-cabinet"] {
  background-image:
    linear-gradient(180deg, rgba(255, 47, 146, .07), rgba(0, 0, 0, .12)),
    url("assets/machine-meme-cabinet.png");
}

.business .machine-art[data-visual="friend-pod"] {
  background-image:
    linear-gradient(180deg, rgba(57, 255, 136, .08), rgba(0, 0, 0, .12)),
    url("assets/machine-friend-pod.png");
}

.business .machine-art[data-visual="advisor-tower"] {
  background-image:
    linear-gradient(180deg, rgba(0, 245, 255, .07), rgba(0, 0, 0, .12)),
    url("assets/machine-advisor-tower.png");
}

.business .machine-art[data-visual="influencer-stage"] {
  background-image:
    linear-gradient(180deg, rgba(255, 47, 146, .08), rgba(0, 0, 0, .12)),
    url("assets/machine-influencer-stage.png");
}

.business .machine-art[data-visual="boardroom-core"] {
  background-image:
    linear-gradient(180deg, rgba(255, 47, 146, .07), rgba(0, 0, 0, .12)),
    url("assets/machine-boardroom-core.png");
}

.business.is-running .machine-art[data-visual="power-plant"],
.business.is-automated .machine-art[data-visual="power-plant"] {
  background-image:
    linear-gradient(180deg, rgba(255, 210, 63, .08), rgba(0, 0, 0, .1)),
    url("assets/machine-power-plant-ai-active.gif");
}

.business.is-running .machine-art[data-visual="server-farm"],
.business.is-automated .machine-art[data-visual="server-farm"] {
  background-image:
    linear-gradient(180deg, rgba(0, 245, 255, .06), rgba(0, 0, 0, .1)),
    url("assets/machine-server-farm-ai-active.gif");
}

.business.is-running .machine-art[data-visual="prompt-booth"],
.business.is-automated .machine-art[data-visual="prompt-booth"] {
  background-image:
    linear-gradient(180deg, rgba(57, 255, 136, .06), rgba(0, 0, 0, .1)),
    url("assets/machine-prompt-booth-ai-active.gif");
}

.business.is-running .machine-art[data-visual="meme-cabinet"],
.business.is-automated .machine-art[data-visual="meme-cabinet"] {
  background-image:
    linear-gradient(180deg, rgba(255, 47, 146, .07), rgba(0, 0, 0, .12)),
    url("assets/machine-meme-cabinet-ai-active.gif");
}

.business.is-running .machine-art[data-visual="friend-pod"],
.business.is-automated .machine-art[data-visual="friend-pod"] {
  background-image:
    linear-gradient(180deg, rgba(57, 255, 136, .08), rgba(0, 0, 0, .12)),
    url("assets/machine-friend-pod-ai-active.gif");
}

.business.is-running .machine-art[data-visual="advisor-tower"],
.business.is-automated .machine-art[data-visual="advisor-tower"] {
  background-image:
    linear-gradient(180deg, rgba(0, 245, 255, .07), rgba(0, 0, 0, .12)),
    url("assets/machine-advisor-tower-ai-active.gif");
}

.business.is-running .machine-art[data-visual="influencer-stage"],
.business.is-automated .machine-art[data-visual="influencer-stage"] {
  background-image:
    linear-gradient(180deg, rgba(255, 47, 146, .08), rgba(0, 0, 0, .12)),
    url("assets/machine-influencer-stage-ai-active.gif");
}

.business.is-running .machine-art[data-visual="boardroom-core"],
.business.is-automated .machine-art[data-visual="boardroom-core"] {
  background-image:
    linear-gradient(180deg, rgba(255, 47, 146, .07), rgba(0, 0, 0, .12)),
    url("assets/machine-boardroom-core-ai-active.gif");
}

.business.is-running .machine-art[data-visual]::before,
.business.is-running .machine-art[data-visual]::after,
.business.is-automated .machine-art[data-visual]::before,
.business.is-automated .machine-art[data-visual]::after {
  display: none;
}

.business-main {
  min-width: 0;
  display: grid;
  grid-template-columns: 94px minmax(0, 1fr);
  gap: 3px 8px;
  align-items: center;
}

.business-topline {
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.business h2 {
  margin-bottom: 0;
  font-size: .94rem;
  color: #fff8ff;
  text-shadow: 0 0 10px rgba(0, 245, 255, .16);
}

.business-stats,
.business-limit,
.manager small {
  color: var(--muted);
  font-size: .74rem;
  line-height: 1.2;
}

.business p {
  display: none;
}

.bonus-line {
  grid-column: 1;
  grid-row: 2;
  min-width: 0;
}

.ownership {
  flex: 0 0 auto;
  display: flex;
  align-items: baseline;
  gap: 6px;
  justify-items: end;
}

.ownership strong {
  flex: 0 0 auto;
  color: var(--green);
  font-size: .92rem;
  line-height: 1;
}

.ownership span,
.bonus-line {
  color: var(--amber);
  font-size: .72rem;
  font-weight: 900;
}

.run-button,
.buy-button,
.manager,
.speed-button {
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  background:
    linear-gradient(90deg, rgba(0, 245, 255, .28) var(--ready, 0%), rgba(8, 5, 22, .55) var(--ready, 0%));
  cursor: pointer;
}

.run-button {
  grid-column: 1;
  grid-row: 3;
  width: 92px;
  min-width: 0;
  height: 26px;
  color: var(--accent);
  font-weight: 900;
  font-size: .78rem;
  text-shadow: 0 0 8px rgba(0, 245, 255, .38);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.run-button:hover:not(:disabled),
.buy-button:hover:not(:disabled),
.manager:hover:not(:disabled),
.speed-button:hover:not(:disabled) {
  border-color: var(--accent);
  background:
    linear-gradient(90deg, rgba(0, 245, 255, .42) var(--ready, 100%), rgba(255, 47, 146, .12) var(--ready, 100%));
}

.speed-button {
  grid-column: 2;
  grid-row: 4;
  min-height: 24px;
  padding: 3px 7px;
  color: var(--accent);
  cursor: pointer;
  font-size: .76rem;
  font-weight: 900;
}

.speed-button[hidden] {
  display: none;
}

button:disabled {
  opacity: .72;
  cursor: not-allowed;
}

.progress-track {
  --progress: 0%;
  grid-column: 2;
  grid-row: 3;
  position: relative;
  width: 100%;
  height: 7px;
  overflow: hidden;
  border: 1px solid rgba(0, 245, 255, .28);
  border-radius: 999px;
  background: rgba(0, 0, 0, .22);
}

.progress-track::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent-dark), var(--accent), var(--rose), var(--green));
  clip-path: inset(0 calc(100% - var(--progress)) 0 0 round 999px);
  transition: clip-path .12s linear;
}

.progress-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  opacity: 0;
}

.progress-track.progress-reset::after,
.progress-track span.progress-reset {
  transition: none;
}

.business.fast-cycle .progress-track {
  --progress: 100% !important;
}

.business.fast-cycle .progress-track::after {
  transition: none;
  background:
    repeating-linear-gradient(
      115deg,
      rgba(255, 255, 255, .22) 0 8px,
      transparent 8px 16px
    ),
    linear-gradient(90deg, var(--accent), var(--violet), var(--green), var(--accent));
  background-size: 34px 100%, 220% 100%;
  animation: fastCycleFlow .75s linear infinite;
  box-shadow:
    0 0 12px rgba(0, 245, 255, .42),
    0 0 18px rgba(255, 47, 146, .22);
}

@keyframes fastCycleFlow {
  from {
    background-position: 0 0, 0% 0;
  }

  to {
    background-position: 34px 0, 100% 0;
  }
}

@keyframes headerBreath {
  0%,
  100% {
    filter: saturate(1) brightness(1);
    background-position: 0 0, 0 0, center 38%, center 38%;
  }

  50% {
    filter: saturate(1.12) brightness(1.07);
    background-position: 0 0, 0 0, center 36%, center 39%;
  }
}

@keyframes headerWeather {
  from {
    background-position: 0 0, 0 0, -58% 0, 0 0;
  }

  to {
    background-position: 0 0, 0 0, 158% 0, 0 0;
  }
}

@keyframes headerLightning {
  0%,
  48%,
  52%,
  100% {
    filter: brightness(1);
  }

  49%,
  51% {
    filter: brightness(1.85) saturate(1.28);
  }
}

@keyframes tabFogDrift {
  0%,
  100% {
    background-position: -24% 0, 118% 0, 0 0, 0 0;
  }

  50% {
    background-position: 22% 0, 78% 0, 0 0, 0 5px;
  }
}

@keyframes tabScanlines {
  0%,
  100% {
    opacity: .16;
  }

  50% {
    opacity: .24;
  }
}

@keyframes tabGlowRoll {
  0%,
  100% {
    opacity: 1;
    filter: hue-rotate(0deg);
  }

  50% {
    opacity: .86;
    filter: hue-rotate(18deg);
  }
}

@keyframes machineFog {
  0%,
  100% {
    transform: translate3d(-10%, 8%, 0) scale(1.04);
  }

  50% {
    transform: translate3d(8%, -4%, 0) scale(1.12);
  }
}

@keyframes machineElectric {
  from {
    background-position: -130% 0, 0 0;
  }

  to {
    background-position: 150% 0, 34px 0;
  }
}

@keyframes machineFault {
  0%,
  100% {
    transform: translateX(0);
    filter: brightness(1);
  }

  50% {
    transform: translateX(2px);
    filter: brightness(1.7);
  }
}

@keyframes operatorScan {
  from {
    background-position: 0 0, 0 0, 0 -100%;
  }

  to {
    background-position: 0 0, 0 0, 0 160%;
  }
}

@keyframes operatorWireDance {
  from {
    background-position: 0 0;
  }

  to {
    background-position: 36px 0;
  }
}

@keyframes stageScanner {
  from {
    background-position: -70% 0, 0 0;
  }

  to {
    background-position: 170% 0, 0 0;
  }
}

@keyframes facilitySteam {
  0%,
  100% {
    opacity: .16;
    transform: translate(-50%, 8px) scale(.72);
  }

  50% {
    opacity: .48;
    transform: translate(-50%, -7px) scale(1.15);
  }
}

@keyframes eyeWatch {
  0%,
  64%,
  100% {
    transform: translateX(0);
  }

  66% {
    transform: translateX(-8px);
  }

  72% {
    transform: translateX(7px);
  }
}

@keyframes machinePulse {
  0%,
  100% {
    filter: brightness(1);
  }

  50% {
    filter: brightness(1.8);
  }
}

@keyframes statusBlink {
  0%,
  60%,
  100% {
    opacity: 1;
  }

  61%,
  76% {
    opacity: .28;
  }
}

@keyframes statusColorCycle {
  0%,
  100% {
    background: var(--green);
    box-shadow: 0 0 10px var(--green);
  }

  34% {
    background: var(--accent);
    box-shadow: 0 0 12px var(--accent);
  }

  68% {
    background: var(--amber);
    box-shadow: 0 0 12px var(--amber);
  }
}

.business-stats {
  grid-column: 2;
  grid-row: 2;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  white-space: nowrap;
  overflow: hidden;
}

.business-limit {
  grid-column: 1;
  grid-row: 4;
  color: var(--blue);
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.business-limit:empty {
  display: none;
}

.buy-button {
  height: 58px;
  display: grid;
  place-items: center;
  padding: 6px;
  font-weight: 800;
  box-shadow: inset 0 -2px 0 rgba(255, 47, 146, .16);
}

.buy-button strong {
  color: var(--green);
  font-size: .9rem;
}

.milestone {
  min-height: 84px;
  display: flex;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid rgba(182, 156, 255, .34);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(182, 156, 255, .14), rgba(103, 232, 249, .08)),
    rgba(8, 5, 22, .36);
  backdrop-filter: blur(2px);
  color: #f6e8ff;
  font-weight: 800;
  line-height: 1.4;
}

.world-stage .milestone {
  position: relative;
  z-index: 1;
  min-width: 0;
  min-height: 0;
  padding: 8px 10px;
  border-color: rgba(255, 47, 146, .32);
  background:
    linear-gradient(90deg, rgba(255, 47, 146, .14), rgba(0, 245, 255, .08)),
    rgba(8, 5, 22, .54);
  color: #fff8ff;
  font-size: clamp(.82rem, 1.4vw, .98rem);
  line-height: 1.25;
  text-shadow: 0 0 14px rgba(255, 47, 146, .18);
}

.event-panel {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.event-panel[hidden] {
  display: none;
}

.event-panel h2 {
  color: var(--amber);
}

.event-choice,
.unlock,
.prestige-panel,
#prestige-button {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  background:
    linear-gradient(90deg, rgba(182, 156, 255, .2) var(--ready, 0%), rgba(8, 5, 22, .42) var(--ready, 0%));
  cursor: pointer;
  text-align: left;
  backdrop-filter: blur(2px);
}

.event-choice {
  display: grid;
  gap: 4px;
  padding: 10px;
}

.unlock {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
  min-height: 94px;
  padding: 8px;
  background:
    linear-gradient(90deg, rgba(57, 255, 136, .1) var(--ready, 0%), rgba(8, 5, 22, .76) var(--ready, 0%)),
    linear-gradient(135deg, rgba(0, 245, 255, .13), rgba(255, 47, 146, .08)),
    rgba(8, 5, 22, .72);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .03),
    0 0 18px rgba(0, 0, 0, .14);
}

.unlock-icon {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 76px;
  overflow: hidden;
  border: 1px solid rgba(0, 245, 255, .28);
  border-radius: 7px;
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .08) 0 1px, transparent 1px 5px),
    radial-gradient(circle at 50% 28%, rgba(0, 245, 255, .22), transparent 36%),
    rgba(7, 5, 18, .82);
  color: var(--accent);
  text-shadow: 0 0 10px currentColor;
}

.unlock-icon::before,
.unlock-icon::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.unlock-icon::before {
  inset: 8px;
  border: 1px solid currentColor;
  border-radius: 5px;
  opacity: .38;
}

.unlock-icon::after {
  left: 10px;
  right: 10px;
  bottom: 9px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--rose), var(--accent), var(--amber));
  opacity: .62;
}

.unlock-icon span {
  position: relative;
  z-index: 1;
  font-size: .68rem;
  font-weight: 950;
  letter-spacing: .03em;
}

.unlock[data-kind="speed"] .unlock-icon {
  color: var(--accent);
  background:
    repeating-linear-gradient(90deg, rgba(0, 245, 255, .14) 0 2px, transparent 2px 8px),
    radial-gradient(circle at 52% 34%, rgba(0, 245, 255, .34), transparent 38%),
    rgba(7, 5, 18, .84);
}

.unlock[data-kind="speed"] .unlock-icon::after {
  height: 18px;
  background:
    linear-gradient(90deg, transparent 0 8%, currentColor 8% 18%, transparent 18% 26%, currentColor 26% 54%, transparent 54% 100%);
  opacity: .52;
}

.unlock[data-kind="cost"] .unlock-icon {
  color: var(--green);
  background:
    linear-gradient(135deg, rgba(57, 255, 136, .18), rgba(255, 210, 63, .1)),
    rgba(7, 5, 18, .84);
}

.unlock[data-kind="cost"] .unlock-icon::after {
  background: repeating-linear-gradient(90deg, var(--green) 0 8px, transparent 8px 12px);
}

.unlock[data-kind="automation"] .unlock-icon {
  color: var(--amber);
}

.unlock[data-kind="insight"] .unlock-icon {
  color: var(--rose);
}

.unlock[data-kind="planner"] .unlock-icon {
  color: var(--blue);
}

.unlock-main {
  display: grid;
  gap: 6px;
  align-content: start;
  min-width: 0;
}

.unlock-topline {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  justify-content: space-between;
  min-width: 0;
}

.unlock-topline strong {
  min-width: 0;
}

.unlock-flavour {
  color: rgba(246, 232, 255, .68);
  font-size: .75rem;
  line-height: 1.25;
}

.unlock-benefit {
  color: var(--text);
  font-size: .82rem;
  font-weight: 850;
  line-height: 1.28;
}

.unlock-status {
  width: fit-content;
  max-width: 100%;
  padding: 3px 7px;
  border: 1px solid rgba(255, 210, 63, .24);
  border-radius: 999px;
  color: var(--amber);
  background: rgba(255, 210, 63, .08);
  font-size: .68rem;
  font-weight: 900;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.unlock em {
  flex: 0 0 auto;
  color: var(--green);
  font-size: .74rem;
  font-style: normal;
  font-weight: 900;
  text-align: right;
  white-space: nowrap;
}

.event-choice:hover,
.unlock:hover:not(:disabled),
#prestige-button:hover:not(:disabled) {
  border-color: var(--accent);
}

.prestige-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(170px, 240px);
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background:
    linear-gradient(135deg, rgba(182, 156, 255, .13), rgba(103, 232, 249, .06)),
    rgba(32, 16, 68, .42);
  backdrop-filter: blur(2px);
}

.prestige-panel p {
  color: var(--muted);
  font-size: .78rem;
  line-height: 1.28;
  text-wrap: balance;
}

.prestige-progress {
  height: 8px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(0, 0, 0, .22);
}

.prestige-progress span {
  display: block;
  width: 0%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--violet), var(--rose), var(--accent), var(--green));
  transition: width .18s ease;
}

#prestige-button {
  min-height: 32px;
  padding: 7px 9px;
  font-weight: 900;
  text-align: center;
  white-space: nowrap;
}

.manager {
  width: 100%;
  min-height: 72px;
  display: grid;
  grid-template-columns: 46px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 10px;
  text-align: left;
  background:
    linear-gradient(90deg, rgba(0, 245, 255, .24) var(--ready, 0%), rgba(8, 5, 22, .42) var(--ready, 0%));
  backdrop-filter: blur(2px);
}

.manager-icon {
  width: 46px;
  height: 46px;
  font-size: .9rem;
}

.operator-art[data-visual] {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(0, 245, 255, .28);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: transparent;
  filter: grayscale(.48) brightness(.72) saturate(.74);
  transition: filter .18s ease, box-shadow .18s ease;
  box-shadow:
    inset 0 0 16px rgba(0, 245, 255, .1),
    0 0 12px rgba(255, 47, 146, .08);
}

.operator-art[data-visual]::before,
.operator-art[data-visual]::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.operator-art[data-visual]::before {
  background:
    radial-gradient(circle at 28% 26%, rgba(0, 245, 255, .34), transparent 18%),
    radial-gradient(circle at 76% 70%, rgba(255, 47, 146, .22), transparent 20%),
    linear-gradient(180deg, transparent 0 42%, rgba(255, 255, 255, .14) 45%, transparent 48% 100%);
  background-size: 100% 100%, 100% 100%, 100% 180%;
  background-position: 0 0, 0 0, 0 -100%;
  mix-blend-mode: screen;
  opacity: .16;
}

.operator-art[data-visual]::after {
  border-radius: inherit;
  background:
    repeating-linear-gradient(90deg, transparent 0 7px, rgba(0, 245, 255, .2) 8px 9px, transparent 10px 18px);
  opacity: 0;
}

.manager.is-owned {
  border-color: rgba(57, 255, 136, .34);
  background:
    linear-gradient(90deg, rgba(57, 255, 136, .18), rgba(0, 245, 255, .08)),
    rgba(8, 5, 22, .46);
}

.manager.is-owned:disabled {
  opacity: 1;
}

.manager.is-owned .operator-art[data-visual] {
  filter: saturate(1.14) brightness(1.04);
  box-shadow:
    inset 0 0 16px rgba(57, 255, 136, .16),
    0 0 15px rgba(0, 245, 255, .14);
}

.manager.is-owned .operator-art[data-visual]::before {
  opacity: .56;
  animation: operatorScan 2.8s linear infinite;
}

.manager.is-owned .operator-art[data-visual]::after {
  opacity: .5;
  animation: operatorWireDance 1.8s linear infinite;
}

.operator-art[data-visual="power-plant"] {
  background-image: url("assets/operator-power-plant.png");
}

.operator-art[data-visual="server-farm"] {
  background-image: url("assets/operator-server-farm.png");
}

.operator-art[data-visual="prompt-booth"] {
  background-image: url("assets/operator-prompt-booth.png");
}

.operator-art[data-visual="meme-cabinet"] {
  background-image: url("assets/operator-meme-cabinet.png");
}

.operator-art[data-visual="friend-pod"] {
  background-image: url("assets/operator-friend-pod.png");
}

.operator-art[data-visual="advisor-tower"] {
  background-image: url("assets/operator-advisor-tower.png");
}

.operator-art[data-visual="influencer-stage"] {
  background-image: url("assets/operator-influencer-stage.png");
}

.operator-art[data-visual="boardroom-core"] {
  background-image: url("assets/operator-boardroom-core.png");
}

.manager.is-owned .operator-art[data-visual="power-plant"] {
  background-image: url("assets/operator-power-plant-ai-online.gif");
}

.manager.is-owned .operator-art[data-visual="server-farm"] {
  background-image: url("assets/operator-server-farm-ai-online.gif");
}

.manager.is-owned .operator-art[data-visual="prompt-booth"] {
  background-image: url("assets/operator-prompt-booth-ai-online.gif");
}

.manager.is-owned .operator-art[data-visual="meme-cabinet"] {
  background-image: url("assets/operator-meme-cabinet-ai-online.gif");
}

.manager.is-owned .operator-art[data-visual="friend-pod"] {
  background-image: url("assets/operator-friend-pod-ai-online.gif");
}

.manager.is-owned .operator-art[data-visual="advisor-tower"] {
  background-image: url("assets/operator-advisor-tower-ai-online.gif");
}

.manager.is-owned .operator-art[data-visual="influencer-stage"] {
  background-image: url("assets/operator-influencer-stage-ai-online.gif");
}

.manager.is-owned .operator-art[data-visual="boardroom-core"] {
  background-image: url("assets/operator-boardroom-core-ai-online.gif");
}

.manager.is-owned .operator-art[data-visual]::before,
.manager.is-owned .operator-art[data-visual]::after {
  display: none;
}

.manager strong,
.manager small {
  display: block;
}

.manager em {
  font-style: normal;
  color: var(--green);
  font-weight: 900;
}

.ai-status {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 76px;
  height: 76px;
  padding: 6px;
  border: 1px solid rgba(0, 245, 255, .34);
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(0, 245, 255, .16), rgba(103, 232, 249, .08) 48%, rgba(8, 5, 22, .6) 64%),
    rgba(8, 5, 22, .72);
  box-shadow:
    0 0 24px rgba(0, 245, 255, .24),
    0 0 34px rgba(255, 47, 146, .14);
}

.ai-status .ai-core {
  width: 64px;
  height: 64px;
}

.settings-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(255, 47, 146, .28);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 47, 146, .13), rgba(0, 245, 255, .08)),
    rgba(7, 5, 18, .58);
  backdrop-filter: blur(2px);
}

.danger-settings {
  margin-top: 10px;
  border-color: rgba(255, 143, 143, .32);
  background:
    linear-gradient(135deg, rgba(255, 47, 146, .11), rgba(255, 143, 143, .06)),
    rgba(7, 5, 18, .58);
}

.settings-copy h3 {
  margin: 2px 0 4px;
  color: var(--accent);
  font-size: 1rem;
}

.settings-copy p:last-child {
  margin: 0;
  color: var(--muted);
  font-size: .82rem;
}

.settings-mute {
  border: 1px solid rgba(57, 255, 136, .42);
  background:
    linear-gradient(135deg, rgba(57, 255, 136, .2), rgba(0, 245, 255, .11)),
    rgba(8, 5, 22, .56);
  box-shadow: 0 0 18px rgba(57, 255, 136, .16);
}

.settings-mute.is-muted {
  border-color: rgba(255, 143, 143, .42);
  background:
    linear-gradient(135deg, rgba(255, 47, 146, .18), rgba(8, 5, 22, .58)),
    rgba(8, 5, 22, .6);
  box-shadow: 0 0 18px rgba(255, 47, 146, .12);
}

.volume-control {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr) 54px;
  gap: 10px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid rgba(0, 245, 255, .18);
  border-radius: 8px;
  background: rgba(8, 5, 22, .42);
}

.volume-control span,
.volume-control strong {
  color: var(--text);
  font-size: .76rem;
  font-weight: 900;
  text-transform: uppercase;
}

.volume-control strong {
  color: var(--green);
  text-align: right;
}

.volume-control input[type="range"] {
  width: 100%;
  accent-color: var(--rose);
}

.stats-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px;
  border: 1px solid rgba(255, 143, 143, .22);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(255, 143, 143, .1), rgba(32, 43, 49, .62)),
    rgba(16, 20, 24, .3);
  backdrop-filter: blur(2px);
}

.stats-actions p {
  margin-top: 4px;
  color: var(--muted);
  font-size: .8rem;
}

.reset-button {
  min-height: 36px;
  padding: 8px 12px;
  border: 1px solid rgba(255, 143, 143, .44);
  border-radius: 8px;
  color: var(--text);
  background: rgba(255, 143, 143, .12);
  cursor: pointer;
  font-weight: 900;
  white-space: nowrap;
}

.reset-button:hover {
  border-color: var(--rose);
}

.story-open,
.modal-open {
  overflow: hidden;
}

.confirm-screen,
.story-screen {
  position: fixed;
  inset: 0;
  z-index: 20;
  display: grid;
  place-items: center;
  padding: 24px;
  background:
    radial-gradient(circle at 50% 38%, rgba(0, 245, 255, .16), transparent 28%),
    radial-gradient(circle at 58% 18%, rgba(103, 232, 249, .08), transparent 32%),
    rgba(4, 8, 10, .82);
  backdrop-filter: blur(12px);
}

.confirm-screen[hidden],
.story-screen[hidden] {
  display: none;
}

.confirm-panel,
.story-panel,
.credits-panel {
  width: min(680px, 100%);
  display: grid;
  gap: 14px;
  padding: 22px;
  border: 1px solid rgba(0, 245, 255, .36);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(19, 13, 45, .96), rgba(8, 5, 22, .96)),
    var(--panel);
  box-shadow:
    0 28px 110px rgba(0, 0, 0, .58),
    0 0 32px rgba(103, 232, 249, .12);
}

.confirm-panel {
  width: min(460px, 100%);
  gap: 12px;
}

.confirm-panel h2 {
  color: var(--amber);
  font-size: clamp(1.25rem, 5vw, 1.8rem);
}

.confirm-panel p {
  color: var(--muted);
  line-height: 1.45;
}

.confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.confirm-actions button {
  min-height: 38px;
  padding: 8px 14px;
  border: 1px solid rgba(0, 245, 255, .32);
  border-radius: 8px;
  color: var(--text);
  background: rgba(8, 5, 22, .52);
  cursor: pointer;
  font-weight: 900;
}

.confirm-actions .confirm-ok {
  border-color: rgba(57, 255, 136, .42);
  background:
    linear-gradient(135deg, rgba(57, 255, 136, .18), rgba(0, 245, 255, .1)),
    rgba(8, 5, 22, .58);
}

.confirm-actions .confirm-ok.is-danger {
  border-color: rgba(255, 143, 143, .5);
  background:
    linear-gradient(135deg, rgba(255, 47, 146, .22), rgba(255, 143, 143, .08)),
    rgba(8, 5, 22, .58);
}

.credits-screen {
  position: fixed;
  inset: 0;
  z-index: 22;
  display: grid;
  place-items: center;
  padding: 24px;
  background:
    radial-gradient(circle at 50% 18%, rgba(182, 156, 255, .16), transparent 28%),
    radial-gradient(circle at 50% 54%, rgba(0, 245, 255, .16), transparent 34%),
    rgba(4, 8, 10, .92);
  backdrop-filter: blur(14px);
}

.credits-screen[hidden] {
  display: none;
}

.credits-panel {
  width: min(760px, 100%);
  max-height: min(760px, calc(100vh - 48px));
  overflow: hidden;
  text-align: center;
}

.ai-core,
.ai-status .ai-core,
.guide-orb {
  --ai-avatar-idle: url("assets/ai-avatar-sway.gif");
  position: relative;
  display: grid;
  place-items: center;
  border-radius: 50%;
  overflow: hidden;
  isolation: isolate;
  background:
    var(--ai-avatar-idle) center / cover no-repeat,
    radial-gradient(circle, rgba(255, 248, 255, .95) 0 12%, rgba(0, 245, 255, .68) 13% 24%, rgba(181, 54, 255, .38) 25% 46%, rgba(8, 5, 22, .82) 47%);
  box-shadow:
    0 0 24px rgba(0, 245, 255, .28),
    0 0 34px rgba(255, 23, 79, .18);
}

.ai-core::before,
.ai-status .ai-core::before,
.guide-orb::before,
.ai-core::after,
.ai-status .ai-core::after,
.guide-orb::after {
  opacity: 0;
  pointer-events: none;
}

.ai-core::before,
.ai-status .ai-core::before,
.guide-orb::before {
  content: "";
  position: absolute;
  inset: -135%;
  z-index: 2;
  border-radius: 50%;
  background:
    repeating-radial-gradient(circle at 17% 132%, rgba(255, 255, 255, .95) 0 .0005px, rgba(0, 0, 0, .8) .00085px),
    repeating-radial-gradient(circle at 83% 12%, rgba(255, 255, 255, .75) 0 .00045px, rgba(12, 12, 18, .84) .0009px),
    repeating-linear-gradient(0deg, transparent 0 4px, rgba(255, 255, 255, .18) 4px 5px);
  background-blend-mode: screen, normal, normal;
  filter: contrast(360%) brightness(1.05) grayscale(.35);
  mix-blend-mode: screen;
  transform: translate3d(0, 0, 0);
  animation: none;
}

.ai-core::after,
.ai-status .ai-core::after,
.guide-orb::after {
  content: "";
  position: absolute;
  inset: 7% -7%;
  z-index: 3;
  border-radius: 50%;
  background:
    linear-gradient(transparent 0 34%, rgba(255, 255, 255, .9) 35% 37%, transparent 38% 63%, rgba(0, 245, 255, .5) 64% 65%, transparent 66%),
    linear-gradient(90deg, transparent, rgba(255, 255, 255, .34), transparent 62%);
  filter: blur(.25px);
  mix-blend-mode: screen;
  animation: none;
}

.ai-face-unlocked .ai-core,
.ai-face-unlocked .ai-status .ai-core,
.ai-face-unlocked .guide-orb {
  background:
    var(--ai-avatar-idle) center / cover no-repeat,
    radial-gradient(circle at 50% 46%, rgba(255, 248, 255, .98) 0 34%, rgba(0, 245, 255, .64) 35% 48%, rgba(181, 54, 255, .42) 49% 61%, rgba(8, 5, 22, .82) 62%);
}

.ai-core[data-expression="blink"],
.ai-status .ai-core[data-expression="blink"],
.guide-orb[data-expression="blink"] {
  --ai-avatar-idle: url("assets/ai-avatar-blink.gif");
}

.ai-core[data-expression="look"],
.ai-status .ai-core[data-expression="look"],
.guide-orb[data-expression="look"] {
  --ai-avatar-idle: url("assets/ai-avatar-look.gif");
}

.ai-core[data-expression="sway"],
.ai-status .ai-core[data-expression="sway"],
.guide-orb[data-expression="sway"] {
  --ai-avatar-idle: url("assets/ai-avatar-sway.gif");
}

.ai-core[data-expression="eyebrow"],
.ai-status .ai-core[data-expression="eyebrow"],
.guide-orb[data-expression="eyebrow"] {
  --ai-avatar-idle: url("assets/ai-avatar-eyebrow.gif");
}

.ai-core[data-expression="eyeroll"],
.ai-status .ai-core[data-expression="eyeroll"],
.guide-orb[data-expression="eyeroll"] {
  --ai-avatar-idle: url("assets/ai-avatar-eyeroll.gif");
}

.ai-core[data-expression="yawn"],
.ai-status .ai-core[data-expression="yawn"],
.guide-orb[data-expression="yawn"] {
  --ai-avatar-idle: url("assets/ai-avatar-yawn.gif");
}

.ai-core[data-expression="glitch"],
.ai-status .ai-core[data-expression="glitch"],
.guide-orb[data-expression="glitch"] {
  --ai-avatar-idle: url("assets/ai-avatar-glitch.gif");
}

.ai-face-unlocked .ai-core::before,
.ai-face-unlocked .ai-status .ai-core::before,
.ai-face-unlocked .guide-orb::before,
.ai-face-unlocked .ai-core::after,
.ai-face-unlocked .ai-status .ai-core::after,
.ai-face-unlocked .guide-orb::after {
  opacity: 0;
}

.ai-core {
  width: 86px;
  height: 86px;
  margin: 0 auto;
}

.ai-core span,
.ai-status .ai-core span,
.guide-orb span {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  border: 0;
  border-radius: 50%;
  background:
    url("assets/ai-avatar-red-eye.png") center / cover no-repeat,
    rgba(255, 59, 59, .92);
  display: none;
  opacity: 0;
  box-shadow: none;
  animation: redEyeGlitch 13s steps(1, end) infinite;
}

.ai-face-unlocked .ai-core span,
.ai-face-unlocked .ai-status .ai-core span,
.ai-face-unlocked .guide-orb span {
  animation: redEyeGlitch 13s steps(1, end) infinite;
}

.story-panel h2 {
  color: var(--accent);
  font-size: clamp(1.5rem, 4vw, 2.4rem);
}

.story-chat .story-panel {
  width: min(760px, 100%);
  gap: 12px;
  border-color: rgba(57, 255, 136, .42);
  background:
    linear-gradient(180deg, rgba(18, 8, 42, .98), rgba(5, 2, 14, .98)),
    var(--panel);
  box-shadow:
    0 28px 110px rgba(0, 0, 0, .58),
    inset 0 0 0 1px rgba(57, 255, 136, .1);
}

.story-chat .ai-core {
  animation: avatarMaterialize 1.5s ease-out both;
}

.story-chat .ai-core::before {
  content: "";
  position: absolute;
  inset: -8px;
  width: auto;
  height: auto;
  left: -8px;
  top: -8px;
  border-radius: 50%;
  opacity: 0;
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .34) 0 1px, transparent 1px 4px),
    repeating-linear-gradient(90deg, rgba(0, 245, 255, .28) 0 2px, transparent 2px 9px);
  mix-blend-mode: screen;
  pointer-events: none;
  animation: avatarStatic 2.2s steps(1, end) .2s both;
}

.credits-panel h2 {
  color: var(--text);
  font-size: clamp(2rem, 7vw, 4.3rem);
  line-height: .95;
}

.story-lines {
  display: grid;
  gap: 9px;
}

.story-chat .story-lines {
  min-height: 300px;
  max-height: min(44vh, 360px);
  align-content: start;
  overflow-y: auto;
  padding: 12px;
  border: 1px solid rgba(57, 255, 136, .28);
  border-radius: 8px;
  background:
    linear-gradient(rgba(57, 255, 136, .04) 50%, rgba(0, 0, 0, .08) 50%),
    rgba(8, 5, 22, .78);
  background-size: 100% 6px;
  box-shadow: inset 0 0 26px rgba(0, 0, 0, .4);
}

.story-lines p {
  display: grid;
  grid-template-columns: 76px 1fr;
  gap: 10px;
  padding: 10px;
  border: 1px solid rgba(103, 232, 249, .14);
  border-radius: 8px;
  background: rgba(32, 43, 49, .56);
}

.story-chat .story-lines p {
  width: min(88%, 560px);
  grid-template-columns: 58px 1fr;
  border-color: rgba(57, 255, 136, .18);
  background: rgba(18, 8, 42, .9);
  font-family: "Cascadia Code", "Consolas", monospace;
}

.story-chat .story-lines .from-user {
  justify-self: end;
  border-color: rgba(255, 47, 146, .38);
  background: rgba(45, 8, 28, .92);
}

.story-chat .story-lines .from-model {
  justify-self: start;
}

.story-lines strong {
  color: var(--amber);
  font-size: .76rem;
  letter-spacing: .08em;
}

.story-lines span {
  color: var(--text);
  font-size: .92rem;
  line-height: 1.35;
}

.story-composer {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: center;
  min-height: 44px;
  padding: 9px 11px;
  border: 1px solid rgba(255, 47, 146, .38);
  border-radius: 8px;
  background: rgba(8, 5, 22, .86);
  font-family: "Cascadia Code", "Consolas", monospace;
}

.story-composer[hidden] {
  display: none;
}

.story-composer span {
  color: var(--green);
  font-size: .72rem;
  font-weight: 900;
}

.story-composer p {
  color: var(--text);
  font-size: .86rem;
  line-height: 1.28;
}

.story-awaiting-response .story-composer span {
  color: var(--amber);
}

#story-continue {
  min-height: 40px;
  border: 1px solid var(--accent);
  border-radius: 8px;
  color: var(--text);
  background: rgba(0, 245, 255, .16);
  cursor: pointer;
  font-weight: 900;
}

.story-chat #story-continue::after {
  content: "  Enter";
  color: var(--muted);
  font-size: .72rem;
}

.credits-roll {
  height: min(280px, 34vh);
  display: grid;
  align-content: start;
  gap: 10px;
  overflow: hidden;
  color: var(--muted);
  font-size: .96rem;
  font-weight: 800;
  line-height: 1.35;
  mask-image: linear-gradient(transparent, #000 18%, #000 82%, transparent);
}

.credits-roll p {
  animation: creditsRoll 18s linear infinite;
}

.credits-stinger {
  padding: 12px;
  border: 1px solid rgba(255, 143, 143, .32);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(255, 143, 143, .14), rgba(103, 232, 249, .08)),
    rgba(16, 20, 24, .72);
  text-align: left;
}

.credits-stinger strong {
  display: block;
  color: var(--rose);
  font-size: .88rem;
}

.credits-stinger p {
  margin-top: 5px;
  color: var(--text);
  font-size: .9rem;
  line-height: 1.36;
}

#credits-close {
  min-height: 40px;
  border: 1px solid var(--rose);
  border-radius: 8px;
  color: var(--text);
  background: rgba(255, 143, 143, .13);
  cursor: pointer;
  font-weight: 900;
}

.guide-bubble {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 10;
  width: min(390px, calc(100vw - 36px));
  display: grid;
  grid-template-columns: 46px 1fr 28px;
  gap: 10px;
  align-items: start;
  padding: 12px;
  border: 1px solid rgba(103, 232, 249, .28);
  border-radius: 8px;
  background: rgba(16, 24, 29, .96);
  box-shadow: 0 18px 60px rgba(0, 0, 0, .4);
}

.guide-bubble[hidden] {
  display: none;
}

.guide-orb {
  width: 46px;
  height: 46px;
}

.guide-bubble strong {
  display: block;
  color: var(--accent);
  font-size: .86rem;
}

.guide-bubble p {
  margin-top: 3px;
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.35;
}

#guide-dismiss {
  width: 28px;
  height: 28px;
  border: 1px solid rgba(103, 232, 249, .18);
  border-radius: 8px;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
}

@keyframes aiWake {
  0%,
  100% {
    transform: scale(.86);
    opacity: .78;
  }

  50% {
    transform: scale(1.12);
    opacity: 1;
  }
}

@keyframes cuteFaceBlink {
  0%,
  44%,
  48%,
  100% {
    transform: scaleY(1);
  }

  46% {
    transform: scaleY(.12);
  }
}

@keyframes redEyeGlitch {
  0%,
  77%,
  86%,
  100% {
    opacity: 0;
    transform: translateX(0) scale(1);
    filter: none;
  }

  78% {
    opacity: 1;
    transform: translateX(-1px) scale(1.015);
    filter: contrast(1.18) saturate(1.18);
  }

  80%,
  85% {
    opacity: 1;
    transform: translateX(0) scale(1);
    filter: none;
  }
}

@keyframes analogueStaticGlitch {
  0%,
  70%,
  82%,
  86%,
  100% {
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(1);
    background-size: 100% 100%, 52% 48%, auto;
    background-position: 0 0, 0 0, 0 0;
  }

  72% {
    opacity: .18;
    transform: translate3d(-18%, 12%, 0) scale(1.04);
    background-size: 96% 103%, 51% 47%, auto;
    background-position: 0 0, 12px -8px, 0 2px;
  }

  74% {
    opacity: .42;
    transform: translate3d(16%, -18%, 0) scale(1.03);
    background-size: 103% 98%, 50% 44%, auto;
    background-position: -16px 14px, -24px 9px, 0 7px;
  }

  76% {
    opacity: .76;
    transform: translate3d(-22%, -9%, 0) scale(1.06);
    background-size: 99% 101%, 48% 50%, auto;
    background-position: 18px -22px, 36px 18px, 0 11px;
  }

  78% {
    opacity: .34;
    transform: translate3d(10%, 18%, 0) scale(1.08);
    background-size: 101% 99%, 50% 43.9%, auto;
    background-position: -34px 28px, 18px -30px, 0 17px;
  }

  84% {
    opacity: .12;
    transform: translate3d(0, 0, 0) scale(1);
    background-size: 98% 102%, 49% 46%, auto;
    background-position: 24px 30px, -18px 14px, 0 23px;
  }
}

@keyframes analogueTearGlitch {
  0%,
  71%,
  79%,
  100% {
    opacity: 0;
    transform: translateX(0) skewX(0deg);
  }

  73% {
    opacity: .2;
    transform: translateX(-4px) skewX(-5deg);
  }

  75% {
    opacity: .46;
    transform: translateX(5px) skewX(7deg);
  }

  77% {
    opacity: .28;
    transform: translateX(-2px) skewX(-3deg);
  }
}

@keyframes avatarMaterialize {
  0% {
    opacity: 0;
    transform: scale(.86);
    filter: grayscale(1) contrast(2);
  }

  34% {
    opacity: .35;
    transform: scale(.94) translateX(-2px);
    filter: hue-rotate(120deg) contrast(1.8);
  }

  68% {
    opacity: .82;
    transform: scale(1.04) translateX(1px);
    filter: saturate(1.5) contrast(1.2);
  }

  100% {
    opacity: 1;
    transform: scale(1);
    filter: none;
  }
}

@keyframes avatarStatic {
  0%,
  12%,
  24% {
    opacity: .7;
    transform: translateX(-2px);
  }

  8%,
  18%,
  32% {
    opacity: .2;
    transform: translateX(2px);
  }

  44%,
  100% {
    opacity: 0;
    transform: translateX(0);
  }
}

@keyframes creditsRoll {
  from {
    transform: translateY(100px);
  }

  to {
    transform: translateY(-220px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .business,
  .progress-track::after,
  .progress-track span,
  .prestige-progress span {
    transition: none;
  }

  .business.fast-cycle .progress-track span {
    animation: none;
  }

  .world-stage::before,
  .facility-plant span::before,
  .facility-ai-eye,
  .portfolio-panel::before,
  .portfolio-panel::after,
  .tab-showcase::before,
  .tab-showcase::after,
  .machine-art[data-visual]::before,
  .machine-art[data-visual]::after,
  .operator-art[data-visual]::before,
  .operator-art[data-visual]::after,
  .business.is-running .machine-screen,
  .business.is-automated .machine-light {
    animation: none;
  }

  .ai-core span,
  .ai-status .ai-core span,
  .guide-orb span {
    animation: none;
  }

  .ai-core::before,
  .ai-status .ai-core::before,
  .guide-orb::before,
  .ai-core::after,
  .ai-status .ai-core::after,
  .guide-orb::after {
    animation: none;
  }

  .credits-roll p {
    animation: none;
  }

  .story-chat .ai-core,
  .story-chat .ai-core::before {
    animation: none;
  }
}

@media (max-width: 980px) {
  .game-shell {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .portfolio-panel,
  .side-panel {
    min-height: auto;
    height: auto;
  }

  .infra-map {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto;
  }

  .power-node,
  .gpu-node {
    grid-row: 1;
  }

  .power-node { grid-column: 1; }
  .gpu-node { grid-column: 2; }

  .infra-link,
  .revenue-link {
    display: none;
  }
}

@media (max-width: 650px) {
  .game-shell {
    --shell-top-pad: 10px;
    width: min(100vw - 24px, 1220px);
    padding: var(--shell-top-pad) 0 10px;
    gap: 10px;
  }

  .portfolio-panel,
  .side-panel {
    padding: 0;
  }

  .world-stage {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  #visual-caption {
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
  }

  .scoreboard {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .prestige-panel {
    grid-template-columns: 1fr;
  }

  #prestige-button {
    justify-self: stretch;
  }

  .resource-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .infra-status {
    grid-template-columns: 1fr;
  }

  .infra-status h3 {
    writing-mode: horizontal-tb;
    transform: none;
  }

  .buy-mode {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .title-row {
    align-items: center;
    gap: 10px;
  }

  .ai-status {
    width: 62px;
    height: 62px;
    padding: 5px;
  }

  .ai-status .ai-core {
    width: 52px;
    height: 52px;
  }

  .sound-toggle {
    width: 38px;
    min-width: 38px;
    height: 30px;
  }

  .stats-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .settings-panel {
    grid-template-columns: 1fr;
  }

  .settings-mute {
    justify-self: start;
  }

  .business {
    grid-template-columns: 68px minmax(0, 1fr);
    align-items: start;
    padding: 8px;
  }

  .business-icon {
    width: 68px;
    height: 68px;
  }

  .business-main {
    grid-template-columns: minmax(0, 92px) minmax(0, 1fr);
  }

  .business-topline,
  .business-stats {
    display: flex;
    gap: 8px;
  }

  .business-topline {
    align-items: flex-start;
    justify-content: space-between;
  }

  .business-stats {
    align-items: baseline;
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .ownership {
    justify-content: flex-end;
    padding-top: 1px;
  }

  .bonus-line {
    margin-top: 2px;
  }

  .run-button {
    width: 100%;
  }

  .business-limit {
    grid-column: 1;
    grid-row: auto;
    margin-top: 3px;
    font-size: .68rem;
    text-align: center;
  }

  .buy-button {
    grid-column: 2;
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 6px;
    height: 42px;
    white-space: nowrap;
  }
}

@media (max-width: 520px) {
  .game-shell {
    width: min(100vw - 24px, 1220px);
  }

  h1 {
    font-size: clamp(2rem, 13vw, 3rem);
  }

  .intro-copy {
    font-size: .8rem;
  }

  .title-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .scoreboard > div,
  .world-stage,
  .prestige-panel,
  .infra-status,
  .buy-mode,
  .business {
    border-radius: 7px;
  }

  .prestige-panel {
    padding: 9px;
    gap: 8px;
  }

  .prestige-panel h2 {
    font-size: .98rem;
  }

  .prestige-panel p {
    font-size: .72rem;
  }

  .scoreboard {
    gap: 6px;
  }

  .scoreboard > div {
    padding: 8px;
  }

  .scoreboard strong {
    font-size: clamp(.94rem, 5vw, 1.18rem);
  }

  .world-stage {
    min-height: auto;
  }

  .infra-map {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .power-node,
  .gpu-node {
    grid-row: 1;
    min-height: 44px;
  }

  .power-node { grid-column: 1; }
  .gpu-node { grid-column: 2; }

  .prestige-panel {
    grid-template-columns: 1fr;
  }

  .app-tabs {
    overflow-x: auto;
    padding: 0;
    scrollbar-width: none;
  }

  .app-tabs::-webkit-scrollbar {
    display: none;
  }

  .app-tabs button {
    flex: 0 0 auto;
    padding-inline: 11px;
    font-size: .8rem;
  }

  .tab-panel {
    padding: 7px;
  }

  .business {
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 7px;
    min-height: 0;
  }

  .business-icon {
    grid-column: 1;
    grid-row: 1;
    width: 58px;
    height: 58px;
  }

  .business-main {
    display: contents;
  }

  .business-topline {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
  }

  .bonus-line,
  .run-button,
  .progress-track,
  .business-stats,
  .speed-button {
    grid-row: auto;
  }

  .bonus-line {
    grid-column: 1;
    grid-row: 2;
    max-width: 58px;
    text-align: center;
  }

  .run-button,
  .progress-track,
  .business-stats,
  .speed-button {
    grid-column: 2;
  }

  .business-limit {
    grid-column: 1;
    grid-row: 3 / span 2;
    align-self: start;
    max-width: 58px;
    margin-top: 0;
    padding-inline: 1px;
    font-size: .63rem;
    line-height: 1.15;
    text-align: center;
    white-space: normal;
  }

  .run-button {
    width: 100%;
  }

  .business-stats {
    line-height: 1.25;
  }

  .buy-button {
    grid-column: 1 / -1;
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 6px;
    height: 38px;
    white-space: nowrap;
  }

  .buy-button strong {
    font-size: .88rem;
  }

  .resource {
    grid-template-columns: 1fr auto;
  }

  .resource-flow {
    grid-column: 1 / -1;
  }

  .unlock {
    grid-template-columns: 58px minmax(0, 1fr);
    min-height: 0;
  }

  .unlock-icon {
    min-height: 58px;
  }

  .stats-grid {
    grid-template-columns: 1fr;
  }

  .volume-control {
    grid-template-columns: 1fr auto;
  }

  .volume-control input[type="range"] {
    grid-column: 1 / -1;
    grid-row: 2;
  }
}


