/*
 * NDOF0Ssome / Ark family / maximal depth
 * Original clean-room composition: no official logos, art, fonts or bundles.
 */

[data-ark-theme='ark'][data-ark-depth='maximal'] {
  --ark-ink: #050708;
  --ark-paper: #f5f7f7;
  --ark-signal: #18d1ff;
  --ark-state: #c8eb21;
  --ark-muted: #8e989c;
  --ark-max-rule: rgb(24 209 255 / 28%);
  --ark-max-paper-rule: rgb(245 247 247 / 22%);
  --ark-max-panel: rgb(5 7 8 / 88%);
  color-scheme: dark;
  scrollbar-color: var(--ark-signal) var(--ark-ink);
}

[data-ark-depth='maximal'] body {
  background: var(--ark-ink);
}

[data-ark-depth='maximal'] body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 90;
  pointer-events: none;
  border: .35rem solid var(--ark-ink);
  box-shadow: inset 0 0 0 1px rgb(245 247 247 / 18%);
}

[data-ark-depth='maximal'] ::selection {
  background: var(--ark-signal);
  color: var(--ark-ink);
}

.ark-maximal-progress {
  position: fixed;
  z-index: 140;
  inset: 0 0 auto;
  height: .35rem;
  pointer-events: none;
  background: rgb(245 247 247 / 10%);
}

.ark-maximal-progress i {
  position: absolute;
  inset: 0;
  transform: scaleX(0);
  transform-origin: left;
  background: var(--ark-signal);
  box-shadow: 0 0 1.4rem rgb(24 209 255 / 54%);
  animation: ark-maximal-progress linear both;
  animation-timeline: scroll(root block);
}

.ark-maximal-progress span {
  position: absolute;
  top: 0;
  left: 0;
  width: 1.25rem;
  height: .35rem;
  transform: translateX(-50%) skewX(-32deg);
  background: var(--ark-paper);
  animation: ark-maximal-marker linear both;
  animation-timeline: scroll(root block);
}

@keyframes ark-maximal-progress { to { transform: scaleX(1); } }
@keyframes ark-maximal-marker { to { left: 100%; } }

/* Global shell ---------------------------------------------------------- */

[data-ark-depth='maximal'] .ark-shell {
  grid-template-columns: 7.25rem minmax(0, 1fr);
  grid-template-rows: 5.4rem minmax(0, 1fr);
  background: var(--ark-ink);
}

[data-ark-depth='maximal'] .ark-topbar {
  height: 5.4rem;
  padding-inline: 2rem 12rem;
  border-bottom-color: var(--ark-max-paper-rule);
  background:
    linear-gradient(90deg, rgb(24 209 255 / 12%) 0 1px, transparent 1px 4rem),
    rgb(5 7 8 / 94%);
  color: var(--ark-paper);
  backdrop-filter: blur(18px);
}

[data-ark-depth='maximal'] .ark-wordmark { color: var(--ark-paper); }
[data-ark-depth='maximal'] .ark-wordmark strong { font-size: 1.1rem; letter-spacing: -.03em; }
[data-ark-depth='maximal'] .ark-wordmark small { color: var(--ark-signal); }

[data-ark-depth='maximal'] .ark-top-status {
  position: relative;
  padding: .7rem 1rem .7rem 2.7rem;
  border: 1px solid var(--ark-max-paper-rule);
  clip-path: polygon(.8rem 0, 100% 0, 100% 100%, 0 100%, 0 .8rem);
}

[data-ark-depth='maximal'] .ark-top-status::before {
  content: 'LIVE';
  position: absolute;
  left: .55rem;
  color: var(--ark-signal);
  font: 800 .54rem var(--ark-mono);
  letter-spacing: .08em;
}

[data-ark-depth='maximal'] .ark-rail {
  width: 7.25rem;
  border-right-color: var(--ark-max-paper-rule);
  background:
    repeating-linear-gradient(0deg, transparent 0 2.9rem, rgb(245 247 247 / 5%) 2.9rem calc(2.9rem + 1px)),
    var(--ark-ink);
  color: var(--ark-paper);
}

[data-ark-depth='maximal'] .ark-rail::before {
  content: 'NDOF\A 0S\A SOME';
  white-space: pre;
  display: grid;
  place-items: end center;
  min-height: 11rem;
  padding-bottom: 1.2rem;
  border-bottom: 1px solid var(--ark-max-paper-rule);
  color: rgb(245 247 247 / 12%);
  font: 950 2rem/.72 var(--ark-display);
  letter-spacing: -.1em;
  text-align: center;
}

[data-ark-depth='maximal'] .ark-rail-item {
  min-height: 7.2rem;
  border-bottom-color: var(--ark-max-paper-rule);
  color: rgb(245 247 247 / 58%);
}

[data-ark-depth='maximal'] .ark-rail-item::after {
  top: auto;
  right: 0;
  bottom: 0;
  left: 0;
  width: auto;
  height: .25rem;
  transform: scaleX(0);
  transform-origin: right;
}

[data-ark-depth='maximal'] .ark-rail-item.is-active {
  background: var(--ark-paper);
  color: var(--ark-ink);
}

[data-ark-depth='maximal'] .ark-rail-item.is-active::after { transform: scaleX(1); transform-origin: left; }
[data-ark-depth='maximal'] .ark-rail-index { top: .65rem; right: .65rem; color: var(--ark-signal); }
[data-ark-depth='maximal'] .ark-rail-code { color: var(--ark-signal); }

/* Hero / operation stage ------------------------------------------------ */

[data-ark-depth='maximal'] .ark-hero {
  min-height: calc(100svh - 5.4rem);
  isolation: isolate;
  padding: clamp(3.5rem, 7vw, 7.5rem) clamp(2rem, 6vw, 7rem) 5rem;
  background:
    linear-gradient(90deg, transparent 0 72%, rgb(24 209 255 / 8%) 72% calc(72% + 1px), transparent calc(72% + 1px)),
    linear-gradient(0deg, transparent 0 68%, rgb(245 247 247 / 9%) 68% calc(68% + 1px), transparent calc(68% + 1px)),
    radial-gradient(circle at 77% 39%, rgb(24 209 255 / 13%), transparent 28%),
    #050708;
  color: var(--ark-paper);
}

[data-ark-depth='maximal'] .ark-hero::before {
  content: 'NDOF';
  position: absolute;
  z-index: -2;
  top: -4vw;
  right: -1vw;
  color: transparent;
  -webkit-text-stroke: 1px rgb(245 247 247 / 11%);
  font: 950 clamp(12rem, 28vw, 34rem)/.8 var(--ark-display);
  letter-spacing: -.095em;
  transform: skewX(-8deg);
}

[data-ark-depth='maximal'] .ark-hero::after {
  content: '';
  position: absolute;
  z-index: -1;
  top: -18%;
  right: 17%;
  width: clamp(5rem, 9vw, 10rem);
  height: 145%;
  transform: rotate(18deg);
  background: linear-gradient(90deg, transparent 0 34%, var(--ark-signal) 34% 38%, transparent 38% 66%, rgb(245 247 247 / 7%) 66% 100%);
  opacity: .9;
}

[data-ark-depth='maximal'] .ark-grid {
  inset: 0;
  opacity: .9;
  background-size: clamp(3rem, 5vw, 6rem) clamp(3rem, 5vw, 6rem);
  mask-image: linear-gradient(90deg, #000 0 75%, transparent 100%);
}

[data-ark-depth='maximal'] .ark-art {
  inset: 5% 1% 2% 37%;
  opacity: 1;
  filter: drop-shadow(0 0 2rem rgb(24 209 255 / 10%));
  transform: rotate(-4deg) scale(1.08);
}

[data-ark-depth='maximal'] .ark-art::before,
[data-ark-depth='maximal'] .ark-art::after { border-width: 1px; }

[data-ark-depth='maximal'] .ark-orbit-a { animation-duration: 24s; }
[data-ark-depth='maximal'] .ark-orbit-b { animation-duration: 17s; animation-direction: reverse; }
[data-ark-depth='maximal'] .ark-orbit-c { animation-duration: 31s; }

[data-ark-depth='maximal'] .ark-hero-copy {
  position: relative;
  z-index: 3;
  width: min(62vw, 67rem);
  max-width: none;
  align-self: end;
}

[data-ark-depth='maximal'] .ark-hero-copy::before {
  content: '01';
  position: absolute;
  top: -2.7rem;
  right: 100%;
  margin-right: 1.2rem;
  color: var(--ark-signal);
  font: 900 4rem/.8 var(--ark-display);
}

[data-ark-depth='maximal'] .ark-hero h1 {
  margin: .7rem 0 1rem;
  font-size: clamp(7rem, 15.5vw, 16rem);
  line-height: .67;
  letter-spacing: -.09em;
  text-shadow: .035em .035em 0 rgb(24 209 255 / 16%);
}

[data-ark-depth='maximal'] .ark-title-solid {
  display: inline-block;
  transform: translateX(-.06em) skewX(-5deg);
}

[data-ark-depth='maximal'] .ark-title-outline {
  display: inline-block;
  margin-left: .31em;
  transform: skewX(-5deg);
  -webkit-text-stroke-width: 2px;
}

[data-ark-depth='maximal'] .ark-lede {
  width: min(100%, 49rem);
  margin: 2.5rem 0 0 auto;
  padding: 1.2rem 1.4rem 1.2rem 2rem;
  border-left: .35rem solid var(--ark-signal);
  background: rgb(5 7 8 / 72%);
  color: rgb(245 247 247 / 82%);
  font-size: clamp(1rem, 1.25vw, 1.28rem);
  backdrop-filter: blur(10px);
}

[data-ark-depth='maximal'] .ark-actions {
  width: min(100%, 49rem);
  margin: 1rem 0 0 auto;
  justify-content: flex-start;
}

[data-ark-depth='maximal'] .ark-button {
  min-height: 3.7rem;
  padding-inline: 1.5rem 2.7rem;
  clip-path: polygon(.8rem 0, 100% 0, 100% calc(100% - .8rem), calc(100% - .8rem) 100%, 0 100%, 0 .8rem);
}

[data-ark-depth='maximal'] .ark-button::after {
  content: '↗';
  position: absolute;
  right: .8rem;
  color: var(--ark-signal);
}

[data-ark-depth='maximal'] .ark-readout {
  right: 3.2vw;
  bottom: 8.5rem;
  width: min(29vw, 31rem);
  padding: 1.6rem;
  border: 1px solid var(--ark-max-paper-rule);
  border-top: .35rem solid var(--ark-signal);
  background: var(--ark-max-panel);
  color: var(--ark-paper);
  box-shadow: 1.25rem 1.25rem 0 rgb(24 209 255 / 13%);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 1.5rem), calc(100% - 1.5rem) 100%, 0 100%);
}

[data-ark-depth='maximal'] .ark-readout::before {
  content: 'STATUS / VERIFIED';
  position: absolute;
  right: 1rem;
  bottom: .55rem;
  color: rgb(245 247 247 / 24%);
  font: 700 .55rem var(--ark-mono);
  letter-spacing: .12em;
}

[data-ark-depth='maximal'] .ark-hero-footer {
  right: 2rem;
  bottom: 1.2rem;
  left: 2rem;
  padding-top: .75rem;
  color: rgb(245 247 247 / 52%);
  border-color: var(--ark-max-paper-rule);
}

/* Bespoke content modes ------------------------------------------------- */

[data-ark-depth='maximal'] .ark-section {
  position: relative;
  min-height: 92svh;
  padding: clamp(5rem, 9vw, 10rem) clamp(2rem, 7vw, 8rem);
  overflow: hidden;
}

[data-ark-depth='maximal'] .ark-section::before {
  content: attr(data-section);
  position: absolute;
  top: 1.2rem;
  right: -.05em;
  color: rgb(8 10 11 / 5%);
  font: 950 clamp(8rem, 22vw, 25rem)/.75 var(--ark-display);
  letter-spacing: -.09em;
  text-transform: uppercase;
  pointer-events: none;
}

[data-ark-depth='maximal'] .ark-section-title {
  display: grid;
  grid-template-columns: minmax(0, auto) 1fr;
  align-items: end;
  column-gap: 2rem;
  margin-bottom: clamp(4rem, 8vw, 8rem);
}

[data-ark-depth='maximal'] .ark-section-title .ark-kicker { grid-column: 1 / -1; }
[data-ark-depth='maximal'] .ark-section-title h2 {
  max-width: 12ch;
  font-size: clamp(4.8rem, 12vw, 13rem);
  line-height: .72;
  letter-spacing: -.08em;
  transform: translateX(-.055em);
}

[data-ark-depth='maximal'] .ark-title-rule { margin-bottom: .6rem; height: .35rem; }

[data-ark-depth='maximal'] #profile {
  background:
    linear-gradient(118deg, transparent 0 58%, rgb(24 209 255 / 8%) 58% 58.4%, transparent 58.4%),
    var(--ark-paper);
}

[data-ark-depth='maximal'] .profile-layout {
  grid-template-columns: minmax(0, 1.65fr) minmax(21rem, .75fr);
  gap: clamp(3rem, 10vw, 12rem);
}

[data-ark-depth='maximal'] .profile-statement h3 {
  max-width: 7ch;
  margin-left: -.06em;
  font-size: clamp(5.5rem, 14vw, 15rem);
  line-height: .7;
  color: transparent;
  -webkit-text-stroke: 2px var(--ark-ink);
}

[data-ark-depth='maximal'] .profile-statement > p:last-child {
  margin-left: clamp(0rem, 12vw, 12rem);
  padding-left: 1.5rem;
  border-left: .35rem solid var(--ark-signal);
}

[data-ark-depth='maximal'] .profile-dossier {
  position: sticky;
  top: 7.5rem;
  padding: 2rem;
  border: 0;
  border-top: .45rem solid var(--ark-signal);
  background: var(--ark-ink);
  color: var(--ark-paper);
  box-shadow: 1rem 1rem 0 rgb(24 209 255 / 22%);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 2rem), calc(100% - 2rem) 100%, 0 100%);
}

[data-ark-depth='maximal'] .profile-dossier dt { color: rgb(245 247 247 / 52%); }
[data-ark-depth='maximal'] .profile-dossier .ark-button { border-color: var(--ark-paper); color: var(--ark-paper); }

[data-ark-depth='maximal'] .projects-section {
  background:
    radial-gradient(circle at 15% 10%, rgb(24 209 255 / 11%), transparent 24%),
    repeating-linear-gradient(90deg, transparent 0 calc(12.5% - 1px), rgb(245 247 247 / 4%) calc(12.5% - 1px) 12.5%),
    var(--ark-ink);
}

[data-ark-depth='maximal'] .projects-section::before { color: rgb(245 247 247 / 4%); }
[data-ark-depth='maximal'] .project-list { border-top-width: .35rem; border-top-color: var(--ark-signal); }

[data-ark-depth='maximal'] .project-row {
  position: relative;
  grid-template-columns: clamp(5rem, 11vw, 12rem) minmax(0, 1fr) minmax(9rem, auto);
  min-height: 19rem;
  padding: 3.5rem 2rem;
  transition: background 260ms ease, transform 260ms ease;
}

[data-ark-depth='maximal'] .project-row::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: .35rem;
  transform: scaleY(0);
  transform-origin: bottom;
  background: var(--ark-signal);
  transition: transform 260ms ease;
}

[data-ark-depth='maximal'] .project-row:hover {
  z-index: 1;
  background: rgb(245 247 247 / 5%);
  transform: translateX(1rem);
}

[data-ark-depth='maximal'] .project-row:hover::before { transform: scaleY(1); transform-origin: top; }
[data-ark-depth='maximal'] .project-index { font-size: clamp(2rem, 5vw, 5rem); line-height: .8; }
[data-ark-depth='maximal'] .project-row h3 { font-size: clamp(3rem, 7vw, 7.5rem); }

[data-ark-depth='maximal'] .gateway-section {
  min-height: 100svh;
  background:
    linear-gradient(124deg, transparent 0 61%, rgb(24 209 255 / 18%) 61% 61.4%, transparent 61.4%),
    var(--ark-paper);
}

[data-ark-depth='maximal'] .gateway-grid {
  grid-template-columns: 1.24fr .76fr;
  border-width: .35rem;
  border-color: var(--ark-ink);
}

[data-ark-depth='maximal'] .gateway-card { min-height: 42rem; }
[data-ark-depth='maximal'] .gateway-card h3 { font-size: clamp(5rem, 12vw, 13rem); }
[data-ark-depth='maximal'] .gateway-games { clip-path: polygon(0 0, 100% 0, calc(100% - 3.5rem) 100%, 0 100%); margin-right: -3.5rem; z-index: 1; }
[data-ark-depth='maximal'] .gateway-card:hover::before { transform: rotate(0) scale(1.12); }

/* Shared archive / Minecraft shell ------------------------------------- */

[data-ark-depth='maximal'] :is(.game-shell, .ark-game-shell) {
  position: relative;
  min-height: 100svh;
  background:
    linear-gradient(115deg, transparent 0 72%, rgb(24 209 255 / 8%) 72% 72.25%, transparent 72.25%),
    repeating-linear-gradient(90deg, transparent 0 calc(8.333% - 1px), rgb(245 247 247 / 4%) calc(8.333% - 1px) 8.333%),
    var(--ark-ink);
}

[data-ark-depth='maximal'] :is(.game-topbar, .ark-game-topbar, .tetris-topbar, .mine-topbar, .breakout-topbar) {
  min-height: 5.4rem;
  border-bottom: 1px solid var(--ark-max-paper-rule);
  background: rgb(5 7 8 / 94%);
  backdrop-filter: blur(18px);
}

[data-ark-depth='maximal'] :is(.game-heading, .ark-game-heading, .tetris-intro, .mine-intro, .breakout-intro) {
  position: relative;
  overflow: hidden;
  min-height: clamp(22rem, 46vw, 37rem);
  border-bottom: .35rem solid var(--ark-signal);
  background:
    radial-gradient(circle at 78% 42%, rgb(24 209 255 / 16%), transparent 25%),
    linear-gradient(140deg, transparent 0 65%, rgb(245 247 247 / 5%) 65% 100%);
}

[data-ark-depth='maximal'] :is(.game-heading, .ark-game-heading, .tetris-intro, .mine-intro, .breakout-intro)::before {
  content: 'PLAY';
  position: absolute;
  right: -.03em;
  bottom: -.2em;
  color: transparent;
  -webkit-text-stroke: 1px rgb(245 247 247 / 10%);
  font: 950 clamp(10rem, 28vw, 31rem)/.7 var(--ark-display);
  letter-spacing: -.09em;
  pointer-events: none;
}

[data-ark-depth='maximal'] :is(.game-heading, .ark-game-heading) h1,
[data-ark-depth='maximal'] :is(.tetris-intro, .mine-intro, .breakout-intro) h1 {
  position: relative;
  z-index: 1;
  font-size: clamp(5.8rem, 14vw, 15rem);
  line-height: .7;
  letter-spacing: -.085em;
}

[data-ark-depth='maximal'] .game-main { max-width: none; padding-inline: clamp(1.25rem, 5vw, 6rem); }

[data-ark-depth='maximal'] .game-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: .5rem;
  padding-bottom: 7rem;
}

[data-ark-depth='maximal'] .game-card {
  grid-column: span 5;
  min-height: 28rem;
  padding: 2rem;
  border: 1px solid var(--ark-max-paper-rule);
  background: rgb(5 7 8 / 78%);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 2rem), calc(100% - 2rem) 100%, 0 100%);
  transition: transform 280ms ease, background 280ms ease, color 280ms ease;
}

[data-ark-depth='maximal'] .game-card:nth-child(2),
[data-ark-depth='maximal'] .game-card:nth-child(5) { grid-column: span 7; }
[data-ark-depth='maximal'] .game-card:nth-child(3) { grid-column: 2 / span 7; }
[data-ark-depth='maximal'] .game-card:nth-child(4) { grid-column: span 4; }
[data-ark-depth='maximal'] .game-card:hover { z-index: 1; color: var(--ark-ink); background: var(--ark-signal); transform: translateY(-.75rem); }
[data-ark-depth='maximal'] .game-card h2 { font-size: clamp(3rem, 6vw, 6rem); line-height: .78; }
[data-ark-depth='maximal'] .game-card-visual { font-size: clamp(5rem, 12vw, 12rem); opacity: .18; }

[data-ark-depth='maximal'] .mc-dashboard {
  gap: 0;
  border: .35rem solid var(--ark-paper);
  background: var(--ark-paper);
}

[data-ark-depth='maximal'] .mc-stage {
  min-height: 42rem;
  background:
    linear-gradient(135deg, transparent 0 57%, rgb(24 209 255 / 22%) 57% 57.5%, transparent 57.5%),
    repeating-linear-gradient(0deg, transparent 0 3.5rem, rgb(245 247 247 / 6%) 3.5rem calc(3.5rem + 1px)),
    var(--ark-ink);
}

[data-ark-depth='maximal'] .mc-stage h2 { font-size: clamp(5.5rem, 12vw, 13rem); line-height: .7; }
[data-ark-depth='maximal'] .mc-panel { border: 0; border-left: .35rem solid var(--ark-signal); }
[data-ark-depth='maximal'] .info-grid { gap: .5rem; }
[data-ark-depth='maximal'] .info-panel { min-height: 24rem; border-top: .35rem solid var(--ark-signal); }

/* Game operation screens ------------------------------------------------ */

[data-ark-depth='maximal'] :is(.ark-game-main, #tetris-main, #mine-main, #breakout-main) { position: relative; }

[data-ark-depth='maximal'] .ark-game-layout {
  grid-template-columns: minmax(0, 1.42fr) minmax(19rem, .58fr);
  gap: .5rem;
}

[data-ark-depth='maximal'] :is(.ark-game-stage, .tetris-board-stage, .mine-stage, .breakout-stage) {
  position: relative;
  border: 1px solid var(--ark-max-paper-rule);
  background:
    linear-gradient(135deg, rgb(24 209 255 / 8%), transparent 34%),
    rgb(5 7 8 / 76%);
  box-shadow: -.8rem .8rem 0 rgb(24 209 255 / 10%);
}

[data-ark-depth='maximal'] :is(.ark-game-dossier, .tetris-metrics, .tetris-piece-queue, .mine-controls, .mine-help, .breakout-metrics, .breakout-controls) {
  border-top: .35rem solid var(--ark-signal);
  background: rgb(5 7 8 / 92%);
}

[data-ark-depth='maximal'] :is(.snake-canvas-frame, .game-2048-board-frame, .tetris-board-frame, .mine-board-scroll, .breakout-canvas-frame) {
  filter: drop-shadow(1rem 1rem 0 rgb(24 209 255 / 11%));
}

[data-ark-depth='maximal'] :is(.ark-game-button, .tetris-action, .mine-reset, .breakout-action, .breakout-launch, .breakout-secondary) {
  min-height: 3.25rem;
  clip-path: polygon(.6rem 0, 100% 0, 100% calc(100% - .6rem), calc(100% - .6rem) 100%, 0 100%, 0 .6rem);
}

[data-ark-depth='maximal'] .tetris-console {
  grid-template-columns: minmax(13rem, .55fr) minmax(19rem, 1.25fr) minmax(13rem, .55fr);
  gap: .5rem;
}

[data-ark-depth='maximal'] .mine-console,
[data-ark-depth='maximal'] .breakout-console { gap: .5rem; }
[data-ark-depth='maximal'] .tetris-help,
[data-ark-depth='maximal'] .breakout-help { border-top-width: .35rem; border-top-color: var(--ark-signal); }

/* Language control becomes a dock, not a floating widget. */
[data-ark-depth='maximal'] .language-switcher {
  top: .65rem;
  right: .75rem;
  bottom: auto;
  border: 1px solid var(--ark-max-paper-rule);
  background: rgb(5 7 8 / 94%);
  box-shadow: .45rem .45rem 0 rgb(24 209 255 / 16%);
}

[data-ark-depth='maximal'] .language-switcher button { min-height: 3.2rem; min-width: 3.2rem; }

/* Responsive re-art-direction ------------------------------------------ */

@media (max-width: 1100px) {
  [data-ark-depth='maximal'] .ark-shell { grid-template-columns: 5.2rem minmax(0, 1fr); }
  [data-ark-depth='maximal'] .ark-rail { width: 5.2rem; }
  [data-ark-depth='maximal'] .ark-rail::before { font-size: 1.45rem; min-height: 8rem; }
  [data-ark-depth='maximal'] .ark-hero-copy { width: min(70vw, 58rem); }
  [data-ark-depth='maximal'] .ark-readout { width: min(36vw, 27rem); right: 2rem; }
  [data-ark-depth='maximal'] .project-row { grid-template-columns: 5rem minmax(0, 1fr); }
  [data-ark-depth='maximal'] .project-row > :last-child { grid-column: 2; }
  [data-ark-depth='maximal'] .ark-game-layout,
  [data-ark-depth='maximal'] .tetris-console,
  [data-ark-depth='maximal'] .mine-console,
  [data-ark-depth='maximal'] .breakout-console { grid-template-columns: 1fr; }
}

@media (max-width: 760px), (orientation: portrait) {
  [data-ark-depth='maximal'] body::before { border-width: .2rem; }
  [data-ark-depth='maximal'] .ark-shell { display: block; }
  [data-ark-depth='maximal'] .ark-topbar {
    min-height: 4.6rem;
    height: auto;
    padding: .65rem 4.7rem .65rem .8rem;
  }
  [data-ark-depth='maximal'] .ark-top-status { display: none; }
  [data-ark-depth='maximal'] .ark-rail {
    position: fixed;
    z-index: 110;
    inset: auto .35rem .35rem;
    width: auto;
    min-height: 4.5rem;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border: 1px solid var(--ark-max-paper-rule);
    background: rgb(5 7 8 / 96%);
    backdrop-filter: blur(18px);
  }
  [data-ark-depth='maximal'] .ark-rail::before,
  [data-ark-depth='maximal'] .ark-rail-code { display: none; }
  [data-ark-depth='maximal'] .ark-rail-item { min-height: 4.5rem; border-right: 1px solid var(--ark-max-paper-rule); border-bottom: 0; }
  [data-ark-depth='maximal'] .ark-rail-item span:last-child { writing-mode: initial; }
  [data-ark-depth='maximal'] .ark-main { padding-bottom: 5.4rem; }

  [data-ark-depth='maximal'] .ark-hero {
    min-height: calc(100svh - 4.6rem);
    padding: 5rem 1.2rem 10rem;
    align-items: start;
  }
  [data-ark-depth='maximal'] .ark-hero::before { top: 7%; right: -7%; font-size: 58vw; writing-mode: vertical-rl; }
  [data-ark-depth='maximal'] .ark-hero::after { right: -2rem; opacity: .48; }
  [data-ark-depth='maximal'] .ark-art { inset: 7% -35% 37% 16%; transform: rotate(-7deg); opacity: .62; }
  [data-ark-depth='maximal'] .ark-hero-copy { width: 100%; align-self: end; }
  [data-ark-depth='maximal'] .ark-hero-copy::before { display: none; }
  [data-ark-depth='maximal'] .ark-hero h1 { font-size: clamp(5.3rem, 25vw, 8.5rem); line-height: .7; }
  [data-ark-depth='maximal'] .ark-title-outline { margin-left: 0; }
  [data-ark-depth='maximal'] .ark-lede { margin-top: 1.8rem; padding: 1rem; }
  [data-ark-depth='maximal'] .ark-actions { justify-content: stretch; }
  [data-ark-depth='maximal'] .ark-actions .ark-button { width: 100%; }
  [data-ark-depth='maximal'] .ark-readout { right: 1.2rem; bottom: 4.2rem; width: calc(100% - 2.4rem); padding: .9rem 1rem; box-shadow: .5rem .5rem 0 rgb(24 209 255 / 15%); }
  [data-ark-depth='maximal'] .ark-readout .ark-spark { display: none; }
  [data-ark-depth='maximal'] .ark-hero-footer { display: none; }

  [data-ark-depth='maximal'] .ark-section { min-height: auto; padding: 5rem 1.2rem 6rem; }
  [data-ark-depth='maximal'] .ark-section-title { grid-template-columns: 1fr; margin-bottom: 3rem; }
  [data-ark-depth='maximal'] .ark-section-title h2 { font-size: clamp(4rem, 20vw, 7rem); overflow-wrap: anywhere; }
  [data-ark-depth='maximal'] .ark-title-rule { margin-top: 1rem; }
  [data-ark-depth='maximal'] .profile-layout { grid-template-columns: 1fr; gap: 3rem; }
  [data-ark-depth='maximal'] .profile-statement h3 { font-size: clamp(4rem, 19vw, 7rem); }
  [data-ark-depth='maximal'] .profile-statement > p:last-child { margin-left: 0; }
  [data-ark-depth='maximal'] .profile-dossier { position: static; box-shadow: .5rem .5rem 0 rgb(24 209 255 / 18%); }
  [data-ark-depth='maximal'] .project-row { grid-template-columns: 2.4rem minmax(0, 1fr); min-height: 16rem; padding: 2rem 0; }
  [data-ark-depth='maximal'] .project-index { font-size: 1.25rem; }
  [data-ark-depth='maximal'] .project-row h3 { font-size: clamp(2.5rem, 13vw, 4.8rem); overflow-wrap: anywhere; }
  [data-ark-depth='maximal'] .gateway-grid { grid-template-columns: 1fr; border-width: .2rem; }
  [data-ark-depth='maximal'] .gateway-games { clip-path: none; margin-right: 0; }
  [data-ark-depth='maximal'] .gateway-card { min-height: 30rem; }

  [data-ark-depth='maximal'] :is(.game-topbar, .ark-game-topbar, .tetris-topbar, .mine-topbar, .breakout-topbar) { padding-right: 10.7rem; }
  [data-ark-depth='maximal'] :is(.game-heading, .ark-game-heading, .tetris-intro, .mine-intro, .breakout-intro) { min-height: 25rem; padding-inline: 1rem; }
  [data-ark-depth='maximal'] :is(.game-heading, .ark-game-heading) h1,
  [data-ark-depth='maximal'] :is(.tetris-intro, .mine-intro, .breakout-intro) h1 { font-size: clamp(4rem, 20vw, 7rem); overflow-wrap: anywhere; }
  [data-ark-depth='maximal'] .game-main { padding-inline: 1rem; }
  [data-ark-depth='maximal'] .game-grid { grid-template-columns: 1fr; }
  [data-ark-depth='maximal'] .game-card,
  [data-ark-depth='maximal'] .game-card:nth-child(n) { grid-column: 1; min-height: 23rem; }
  [data-ark-depth='maximal'] .mc-dashboard { border-width: .2rem; }
  [data-ark-depth='maximal'] .mc-stage { min-height: 30rem; }
  [data-ark-depth='maximal'] .mc-stage h2 { font-size: clamp(4.5rem, 22vw, 8rem); }
  [data-ark-depth='maximal'] .language-switcher { top: auto; right: .45rem; bottom: .45rem; z-index: 145; }
  [data-ark-depth='maximal'] .language-switcher button { min-width: 2.8rem; min-height: 3.6rem; padding-inline: .35rem; }
}

@media (max-height: 520px) and (orientation: landscape) {
  [data-ark-depth='maximal'] .ark-hero { min-height: 42rem; }
  [data-ark-depth='maximal'] .ark-hero h1 { font-size: clamp(6rem, 17vw, 10rem); }
  [data-ark-depth='maximal'] .ark-readout { bottom: 2rem; }
  [data-ark-depth='maximal'] .language-switcher { transform: scale(.82); transform-origin: top right; }
}

@media (prefers-reduced-motion: reduce) {
  [data-ark-depth='maximal'] .ark-maximal-progress i,
  [data-ark-depth='maximal'] .ark-maximal-progress span { animation: none; }
  [data-ark-depth='maximal'] :is(.ark-art, .ark-orbit, .ark-core, .ark-vector) { animation: none !important; transform: none; }
  [data-ark-depth='maximal'] :is(.project-row, .game-card, .gateway-card)::before { transition: none; }
  [data-ark-depth='maximal'] :is(.project-row, .game-card, .gateway-card):hover { transform: none; }
}