/* INCUBASE Presentation Mode shell: the venture exhibition and its controller.
 * Self-contained: present.php does not load site.css, so nothing here can affect
 * the normal website. Sizes derive from --u, a viewport unit normalised to 16:9,
 * so the same composition holds from 4:3 projectors to 4K displays. */

@font-face {
  font-family: Instrument;
  src: url("../fonts/InstrumentSans.ttf") format("truetype");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("../fonts/jetbrains-mono-latin-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  --u: min(1vw, 1.7778vh);
  --bar-h: clamp(52px, calc(var(--u) * 3.2), 104px);
  --pad-x: clamp(20px, calc(var(--u) * 4.4), 180px);
  --gap: clamp(10px, calc(var(--u) * 1.05), 40px);
  --radius: clamp(10px, calc(var(--u) * 0.9), 30px);
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --sans: Instrument, "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  /* Light exhibition: warm gallery paper, white plinths. */
  --bg: #f3f1ea;
  --bg-deep: #ebe8df;
  --glow-a: rgba(18, 97, 237, 0.1);
  --glow-b: rgba(0, 167, 146, 0.08);
  --texture: rgba(13, 22, 41, 0.05);
  --tile: #fdfcf9;
  --tile-edge: rgba(13, 22, 41, 0.09);
  --tile-hover: #ffffff;
  --tile-shadow: 0 1px 1px rgba(13, 22, 41, 0.04), 0 10px 30px -18px rgba(13, 22, 41, 0.28);
  --tile-shadow-hover: 0 2px 2px rgba(13, 22, 41, 0.05), 0 26px 50px -26px rgba(13, 22, 41, 0.42);
  --ink: #0d1629;
  --soft-ink: #39445a;
  --muted: #667085;
  --line: rgba(13, 22, 41, 0.12);
  --accent: #1261ed;
  --accent-ink: #ffffff;
  --signal: #0f9f6e;
  --headline-grad: linear-gradient(100deg, #1261ed 0%, #0a7fd1 45%, #07a28e 100%);
  --bar: rgba(251, 250, 247, 0.94);
  --control: transparent;
  --control-hover: rgba(13, 22, 41, 0.06);
  --dialog: #fbfaf7;
  color-scheme: light;
}
:root[data-theme="dark"] {
  /* Dark exhibition: deep navy room, softly lit raised plinths. */
  --bg: #070e1b;
  --bg-deep: #050a14;
  --glow-a: rgba(36, 110, 255, 0.2);
  --glow-b: rgba(216, 248, 48, 0.06);
  --texture: rgba(190, 210, 240, 0.045);
  --tile: #0e1a2d;
  --tile-edge: rgba(176, 200, 236, 0.11);
  --tile-hover: #12223a;
  --tile-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset, 0 18px 40px -26px rgba(0, 0, 0, 0.8);
  --tile-shadow-hover: 0 1px 0 rgba(255, 255, 255, 0.05) inset, 0 30px 60px -28px rgba(0, 0, 0, 0.9);
  --ink: #eef3fa;
  --soft-ink: #c3cfde;
  --muted: #8d9db3;
  --line: rgba(176, 200, 236, 0.16);
  --accent: #d8f830;
  --accent-ink: #0d1629;
  --signal: #d8f830;
  --headline-grad: linear-gradient(100deg, #7cc8ff 0%, #5fe0c8 45%, #d8f830 100%);
  --bar: rgba(5, 10, 20, 0.92);
  --control: transparent;
  --control-hover: rgba(176, 200, 236, 0.1);
  --dialog: #0c1729;
  color-scheme: dark;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}
html,
body {
  height: 100%;
  margin: 0;
}
body {
  overflow: hidden;
  background: var(--bg);
  color: var(--ink);
  font: 400 16px/1.4 var(--sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
h1,
h2,
p,
ol,
dl,
dd {
  margin: 0;
}
ol {
  padding: 0;
  list-style: none;
}
a {
  color: inherit;
  text-decoration: none;
}
button {
  font: inherit;
  color: inherit;
}
img {
  display: block;
}
[hidden] {
  display: none !important;
}
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}
.pr-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.pr-icon {
  flex: none;
  width: 1.15em;
  height: 1.15em;
}
.pr-eyebrow {
  font: 500 clamp(10px, calc(var(--u) * 0.66), 24px) / 1.4 var(--mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}

/* ------------------------------------------------------------------ Layout */
.pr-app {
  position: fixed;
  inset: 0;
}
.pr-main {
  position: absolute;
  inset: 0 0 var(--bar-h);
  overflow: hidden;
}

/* ------------------------------------------------------------- Exhibition */
.pr-wall {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  padding: calc(var(--u) * 1.5) var(--pad-x) calc(var(--u) * 1.9);
  isolation: isolate;
}
/* Gallery lighting: two soft pools of light and a faint architectural grid. */
.pr-wall-light {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(48% 52% at 12% 0%, var(--glow-a), transparent 72%),
    radial-gradient(40% 46% at 92% 100%, var(--glow-b), transparent 70%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg-deep) 100%);
}
.pr-wall-light::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--texture) 1px, transparent 1px),
    linear-gradient(90deg, var(--texture) 1px, transparent 1px);
  background-size: calc(var(--u) * 4.8) calc(var(--u) * 4.8);
  -webkit-mask-image: radial-gradient(80% 70% at 50% 40%, #000 0%, transparent 85%);
  mask-image: radial-gradient(80% 70% at 50% 40%, #000 0%, transparent 85%);
}
.pr-wall-head {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 1.4);
}
.pr-brand {
  display: block;
  width: clamp(104px, calc(var(--u) * 8.6), 340px);
}
.pr-brand-art {
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 1;
  object-fit: contain;
}
.pr-brand-art--dark,
:root[data-theme="dark"] .pr-brand-art--light {
  display: none;
}
:root[data-theme="dark"] .pr-brand-art--dark {
  display: block;
}
.pr-cohort {
  display: flex;
  gap: 0.9em;
  padding-left: calc(var(--u) * 1.4);
  border-left: 1px solid var(--line);
  font: 500 clamp(10px, calc(var(--u) * 0.66), 24px) / 1.3 var(--mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}
.pr-cohort span:first-child {
  color: var(--ink);
}
.pr-start {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.6em;
  min-height: clamp(36px, calc(var(--u) * 2.3), 84px);
  padding: 0 1.15em;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--control);
  font: 550 clamp(12px, calc(var(--u) * 0.78), 28px) / 1 var(--sans);
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.pr-start:hover {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--accent-ink);
}
.pr-fullscreen .pr-start {
  opacity: 0.7;
}
.pr-wall-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, auto);
  align-items: end;
  gap: calc(var(--u) * 0.4) calc(var(--u) * 3);
  margin: calc(var(--u) * 1.5) 0 calc(var(--u) * 1.5);
}
.pr-wall-intro .pr-eyebrow {
  grid-column: 1 / -1;
}
.pr-wall-intro h1 {
  font-size: clamp(28px, calc(var(--u) * 3.3), 132px);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.045em;
}
.pr-accent {
  background: var(--headline-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.pr-wall-lede {
  max-width: 24em;
  text-wrap: balance;
  padding-bottom: 0.25em;
  font-size: clamp(13px, calc(var(--u) * 0.98), 38px);
  line-height: 1.35;
  color: var(--soft-ink);
  text-align: right;
}

/* The 4–5–4 composition: ten half-column tracks centre the shorter rows. */
.pr-grid-frame {
  min-height: 0;
  container-type: size;
}
/* Tiles are as wide as five fit, no wider than 1.5:1, and grow taller (to 1.15:1)
   on squarer screens such as 4:3 projectors so the room is used, not letterboxed. */
.pr-grid {
  --tw: min(calc((100cqw - 4 * var(--gap)) / 5), calc((100cqh - 2 * var(--gap)) / 3 * 1.5));
  --th: min(calc((100cqh - 2 * var(--gap)) / 3), calc(var(--tw) / 1.15));
  height: 100%;
  display: grid;
  grid-template-columns: repeat(10, calc((var(--tw) - var(--gap)) / 2));
  grid-auto-rows: var(--th);
  gap: var(--gap);
  justify-content: center;
  align-content: center;
}
.pr-cell {
  grid-row: var(--row);
  grid-column: var(--col) / span 2;
  min-width: 0;
}
.pr-tile {
  --tile-accent: var(--brand, var(--accent));
  position: relative;
  height: 100%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  padding: 6.5cqh 7cqw 6cqh;
  container-type: size;
  border: 1px solid var(--tile-edge);
  border-radius: var(--radius);
  background: var(--tile);
  box-shadow: var(--tile-shadow);
  overflow: hidden;
  isolation: isolate;
  transition: transform 0.35s var(--ease), box-shadow 0.35s var(--ease), background 0.35s, border-color 0.35s;
}
/* The cell is the size container for the tile's own padding and lift. */
.pr-cell {
  container-type: size;
}
/* A quiet line in the venture's own colour appears on hover and focus. */
.pr-tile::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: max(2px, 1.4cqh);
  background: var(--tile-accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.45s var(--ease);
}
:root[data-theme="dark"] .pr-tile:not([style*="--brand"])::before {
  background: var(--accent);
}
.pr-tile:hover,
.pr-tile:focus-visible {
  transform: translateY(-0.6cqh);
  background: var(--tile-hover);
  border-color: color-mix(in srgb, var(--tile-accent) 34%, var(--tile-edge));
  box-shadow: var(--tile-shadow-hover);
}
.pr-tile:hover::before,
.pr-tile:focus-visible::before {
  transform: scaleX(1);
}
.pr-tile:focus-visible {
  outline-offset: 4px;
}
.pr-tile-top {
  display: flex;
  align-items: baseline;
  gap: 0.9em;
  min-width: 0;
  font: 500 clamp(8px, 3.6cqw, 22px) / 1.2 var(--mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
}
.pr-tile-num {
  color: var(--ink);
}
.pr-tile-sector {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.pr-tile-mark {
  position: relative;
  margin: 3cqh 0;
  container-type: size;
}
.pr-tile-logo {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(calc(100cqw * var(--pw)), calc(100cqh * var(--ph) * var(--ratio)));
  height: auto;
  max-width: none;
  transform: translate(-50%, -50%);
  transition: transform 0.45s var(--ease);
}
.pr-tile:hover .pr-tile-logo,
.pr-tile:focus-visible .pr-tile-logo {
  transform: translate(-50%, -50%) scale(1.035);
}
.pr-tile-logo--dark,
:root[data-theme="dark"] .pr-tile-logo--light {
  display: none;
}
:root[data-theme="dark"] .pr-tile-logo--dark {
  display: block;
}
/* SEMAI has no approved identity yet: a typographic placeholder, never a drawn logo. */
.pr-tile-wordmark {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: min(15cqw, 36cqh);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-indent: 0.16em;
  line-height: 1;
  color: var(--ink);
}
.pr-tile-wordmark::after {
  content: "Identity to follow";
  position: absolute;
  left: 50%;
  bottom: 4%;
  transform: translateX(-50%);
  font: 500 max(8px, 3cqh) / 1 var(--mono);
  letter-spacing: 0.14em;
  text-indent: 0;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--muted);
}
.pr-tile-foot {
  display: grid;
  gap: 0.15em;
  min-width: 0;
}
.pr-tile-name {
  font-size: clamp(12px, 6.4cqw, 42px);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.02em;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.pr-tile-domain {
  font-size: clamp(10px, 4.3cqw, 28px);
  line-height: 1.25;
  color: var(--muted);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.pr-tile-status {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 0.55em;
  font: 500 clamp(8px, 3.2cqw, 20px) / 1 var(--mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}
.pr-tile-status::before {
  content: "";
  width: 0.62em;
  height: 0.62em;
  border-radius: 50%;
  border: 1px solid currentColor;
}
.pr-tile--ready .pr-tile-status {
  color: var(--ink);
}
.pr-tile--ready .pr-tile-status::before {
  border-color: var(--signal);
  background: var(--signal);
  box-shadow: 0 0 0 0.3em color-mix(in srgb, var(--signal) 22%, transparent);
}
/* The domain gives way first when a tile is short, then the sector. */
@container (max-height: 150px) {
  .pr-tile-domain {
    display: none;
  }
}
/* On narrow tiles the status keeps its marker; its words stay for screen readers. */
@container (max-width: 250px) {
  .pr-tile-status-text {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }
}
@container (max-height: 104px) {
  .pr-tile-sector {
    display: none;
  }
}

/* Entrance: once on arrival and when returning from a venture. */
@keyframes pr-rise {
  from {
    opacity: 0;
    transform: translate3d(0, 18px, 0) scale(0.985);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes pr-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.pr-wall.is-entering .pr-cell {
  animation: pr-rise 0.7s var(--ease) both;
  animation-delay: calc(80ms + var(--i) * 38ms);
}
.pr-wall.is-entering .pr-wall-intro,
.pr-wall.is-entering .pr-wall-head {
  animation: pr-fade 0.6s var(--ease) both;
}
.pr-preparing .pr-wall-intro,
.pr-preparing .pr-grid {
  opacity: 0;
}
.pr-wall.is-leaving {
  opacity: 0;
  transform: scale(0.985);
  transition: opacity 0.32s var(--ease), transform 0.4s var(--ease);
}

/* ------------------------------------------------------------ Venture stage */
.pr-stage {
  position: absolute;
  inset: 0;
  background: var(--bg);
}
.pr-frames,
.pr-frame {
  position: absolute;
  inset: 0;
}
.pr-frame {
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
  opacity: 0;
  transition: opacity 0.42s var(--ease);
}
.pr-frame.is-ready {
  opacity: 1;
}
.pr-loading {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: calc(var(--u) * 1.2);
  animation: pr-fade 0.3s 0.15s both;
}
.pr-loading-name {
  font-size: clamp(22px, calc(var(--u) * 2.4), 96px);
  font-weight: 600;
  letter-spacing: -0.03em;
}
.pr-loading-line {
  position: relative;
  width: calc(var(--u) * 12);
  height: 2px;
  overflow: hidden;
  background: var(--line);
}
.pr-loading-line::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 40%;
  background: var(--brand, var(--accent));
  animation: pr-sweep 1.1s var(--ease) infinite;
}
@keyframes pr-sweep {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(250%);
  }
}

/* Preview for ventures without a completed presentation (and the fallback). */
.pr-preview {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  align-items: center;
  gap: calc(var(--u) * 5);
  padding: calc(var(--u) * 3) var(--pad-x);
  overflow-y: auto;
  background:
    radial-gradient(42% 60% at 20% 50%, color-mix(in srgb, var(--brand, var(--accent)) 14%, transparent), transparent 70%),
    var(--bg);
  animation: pr-fade 0.45s var(--ease) both;
}
.pr-preview-mark {
  position: relative;
  aspect-ratio: 1.42;
  max-height: calc(100% - var(--u) * 2);
  border: 1px solid var(--tile-edge);
  border-radius: calc(var(--radius) * 1.5);
  background: var(--tile);
  box-shadow: var(--tile-shadow-hover);
  container-type: size;
}
.pr-preview-logo {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(calc(100cqw * var(--pw) * 0.9), calc(100cqh * var(--ph) * var(--ratio) * 0.72));
  height: auto;
  transform: translate(-50%, -50%);
}
.pr-preview-logo--dark,
:root[data-theme="dark"] .pr-preview-logo--light {
  display: none;
}
:root[data-theme="dark"] .pr-preview-logo--dark {
  display: block;
}
.pr-preview-wordmark {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 15cqw;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-indent: 0.16em;
}
.pr-preview-copy {
  display: grid;
  gap: calc(var(--u) * 1.1);
  max-width: 40em;
}
.pr-preview-copy h2 {
  font-size: clamp(34px, calc(var(--u) * 4.4), 176px);
  font-weight: 600;
  line-height: 0.98;
  letter-spacing: -0.045em;
}
.pr-preview-domain {
  font-size: clamp(17px, calc(var(--u) * 1.5), 60px);
  font-weight: 550;
  line-height: 1.2;
  letter-spacing: -0.015em;
}
.pr-preview-description {
  max-width: 34em;
  font-size: clamp(15px, calc(var(--u) * 1.08), 44px);
  line-height: 1.5;
  color: var(--soft-ink);
}
.pr-preview-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, auto));
  justify-content: start;
  gap: calc(var(--u) * 0.6) calc(var(--u) * 2.4);
  padding: calc(var(--u) * 1) 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.pr-preview-facts dt {
  font: 500 clamp(9px, calc(var(--u) * 0.6), 22px) / 1.4 var(--mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}
.pr-preview-facts dd {
  font-size: clamp(13px, calc(var(--u) * 0.9), 34px);
  font-weight: 550;
}
.pr-preview-note {
  display: flex;
  align-items: center;
  gap: 0.75em;
  font-size: clamp(13px, calc(var(--u) * 0.86), 32px);
  color: var(--muted);
}
.pr-pulse {
  width: 0.55em;
  height: 0.55em;
  border-radius: 50%;
  border: 1px solid var(--muted);
}
.pr-preview-actions {
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--u) * 0.7);
  margin-top: calc(var(--u) * 0.4);
}
.pr-button {
  display: inline-flex;
  align-items: center;
  gap: 0.6em;
  min-height: clamp(40px, calc(var(--u) * 2.6), 96px);
  padding: 0 1.2em;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: clamp(13px, calc(var(--u) * 0.86), 32px);
  font-weight: 550;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.pr-button:hover {
  border-color: var(--ink);
}
.pr-button--primary {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--accent-ink);
}
.pr-button--primary:hover {
  border-color: var(--ink);
  background: var(--ink);
  color: var(--bg);
}

/* --------------------------------------------------------------- Controller */
.pr-bar {
  position: absolute;
  inset: auto 0 0;
  height: var(--bar-h);
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 1.2);
  padding: 0 calc(var(--pad-x) * 0.5);
  border-top: 1px solid var(--line);
  background: var(--bar);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  font-size: clamp(12px, calc(var(--u) * 0.78), 30px);
  transition: opacity 0.4s;
}
.pr-bar.is-idle:not(:focus-within):not(:hover) {
  opacity: 0.4;
}
.pr-bar-start,
.pr-bar-end {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 0.45);
  min-width: 0;
}
.pr-bar-start {
  flex: 1 1 0;
}
.pr-bar-end {
  flex: 1 0 auto;
  justify-content: flex-end;
}
@media (max-width: 1180px) {
  .pr-count,
  .pr-live span:first-child {
    display: none;
  }
  .pr-live {
    padding: 0;
  }
}
.pr-bar-middle {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 0.9);
}
.pr-control {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  flex: none;
  min-width: clamp(36px, calc(var(--u) * 2.3), 84px);
  height: clamp(36px, calc(var(--u) * 2.3), 84px);
  padding: 0;
  border: 1px solid var(--line);
  border-radius: calc(var(--radius) * 0.75);
  background: var(--control);
  color: var(--ink);
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s, opacity 0.2s;
}
.pr-control:hover {
  background: var(--control-hover);
  border-color: color-mix(in srgb, var(--ink) 30%, transparent);
}
.pr-control--text {
  padding: 0 0.95em;
  font-weight: 550;
  white-space: nowrap;
}
.pr-control:disabled {
  opacity: 0.35;
  cursor: default;
}
.pr-divider {
  width: 1px;
  height: 1.6em;
  margin: 0 calc(var(--u) * 0.3);
  background: var(--line);
}
.pr-live {
  border-color: color-mix(in srgb, var(--accent) 60%, transparent);
}
.pr-icon--sun,
:root[data-theme="dark"] .pr-icon--moon,
.pr-icon--collapse,
.pr-fullscreen .pr-icon--expand {
  display: none;
}
:root[data-theme="dark"] .pr-icon--sun,
.pr-fullscreen .pr-icon--collapse {
  display: block;
}
.pr-now {
  display: grid;
  min-width: 0;
  padding-left: calc(var(--u) * 0.5);
  line-height: 1.2;
}
.pr-now-venture {
  font-weight: 600;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.pr-now-section {
  font-size: 0.86em;
  color: var(--muted);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.pr-progress {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 0.22);
}
.pr-progress button {
  display: block;
  width: clamp(12px, calc(var(--u) * 1.15), 44px);
  height: clamp(22px, calc(var(--u) * 1.6), 60px);
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}
.pr-progress button::before {
  content: "";
  display: block;
  height: max(3px, calc(var(--u) * 0.2));
  border-radius: 9px;
  background: var(--line);
  transition: background 0.3s, transform 0.3s;
}
.pr-progress button:hover::before {
  background: var(--muted);
}
.pr-progress .is-past::before {
  background: color-mix(in srgb, var(--ink) 55%, transparent);
}
.pr-progress [aria-current]::before {
  background: var(--accent);
  transform: scaleY(1.5);
}
.pr-count {
  min-width: 4.2em;
  font: 500 0.86em / 1 var(--mono);
  letter-spacing: 0.06em;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.pr-hint {
  display: flex;
  align-items: center;
  gap: 0.45em;
  font-size: 0.86em;
  color: var(--muted);
  white-space: nowrap;
}
.pr-hint span {
  margin: 0 0.3em;
}
kbd {
  display: inline-grid;
  place-items: center;
  min-width: 1.8em;
  height: 1.8em;
  padding: 0 0.4em;
  border: 1px solid var(--line);
  border-bottom-width: 2px;
  border-radius: 6px;
  font: 500 0.86em / 1 var(--mono);
  color: var(--ink);
}
body[data-view="venture"] .pr-hint,
body[data-view="wall"] [data-pr-home],
body[data-view="wall"] [data-pr-prev],
body[data-view="wall"] [data-pr-next],
body[data-view="wall"] .pr-count {
  display: none;
}

/* ---------------------------------------------------------- Venture switcher */
.pr-switcher {
  width: min(1180px, calc(100vw - 32px));
  max-height: min(860px, calc(100dvh - 32px));
  padding: 0;
  border: 1px solid var(--line);
  border-radius: calc(var(--radius) * 1.3);
  background: var(--dialog);
  color: var(--ink);
  box-shadow: 0 40px 120px -40px rgba(0, 0, 0, 0.6);
  overflow: hidden;
}
.pr-switcher[open] {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  animation: pr-rise 0.32s var(--ease) both;
}
.pr-switcher::backdrop {
  background: rgba(3, 8, 16, 0.55);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.pr-switcher-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 20px 14px 24px;
  border-bottom: 1px solid var(--line);
}
.pr-switcher-head h2 {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.pr-switcher-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 8px;
  padding: 16px;
  overflow-y: auto;
}
.pr-switcher-list a {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: center;
  gap: 2px 14px;
  min-height: 72px;
  padding: 10px 14px 10px 10px;
  border: 1px solid transparent;
  border-radius: 12px;
  transition: background 0.2s, border-color 0.2s;
}
.pr-switcher-list a:hover,
.pr-switcher-list a[aria-current] {
  background: var(--tile);
  border-color: var(--tile-edge);
}
.pr-switcher-list a[aria-current] {
  border-color: var(--accent);
}
.pr-switcher-mark {
  grid-row: 1 / 3;
  position: relative;
  height: 52px;
  border-radius: 8px;
  background: var(--tile);
  container-type: size;
}
.pr-switcher-logo {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(calc(100cqw * var(--pw)), calc(100cqh * var(--ph) * var(--ratio)));
  height: auto;
  transform: translate(-50%, -50%);
}
.pr-switcher-logo--dark,
:root[data-theme="dark"] .pr-switcher-logo--light {
  display: none;
}
:root[data-theme="dark"] .pr-switcher-logo--dark {
  display: block;
}
.pr-switcher-wordmark {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.14em;
}
.pr-switcher-name {
  display: grid;
  font-weight: 600;
  line-height: 1.25;
}
.pr-switcher-name small {
  font-size: 13px;
  font-weight: 400;
  color: var(--muted);
}
.pr-switcher-status {
  font: 500 10px / 1.2 var(--mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
}
.pr-switcher-status.is-ready {
  color: var(--ink);
}
.pr-switcher-status.is-ready::before {
  content: "● ";
  color: var(--signal);
}
.pr-switcher-wall {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  border: 0;
  border-top: 1px solid var(--line);
  background: none;
  font-weight: 550;
  cursor: pointer;
}
.pr-switcher-wall:hover {
  background: var(--control-hover);
}

.pr-toast {
  position: absolute;
  left: 50%;
  bottom: calc(var(--bar-h) + 16px);
  max-width: min(640px, calc(100vw - 32px));
  padding: 12px 18px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--dialog);
  font-size: 14px;
  box-shadow: 0 20px 50px -20px rgba(0, 0, 0, 0.5);
  opacity: 0;
  transform: translate(-50%, 8px);
  pointer-events: none;
  transition: opacity 0.3s, transform 0.3s var(--ease);
}
.pr-toast.is-on {
  opacity: 1;
  transform: translate(-50%, 0);
}

/* ------------------------------------------------- Compact screens (fallback) */
@media (max-width: 860px), (max-height: 520px) {
  .pr-wall {
    display: block;
    overflow-y: auto;
    padding: 18px 20px 28px;
  }
  .pr-wall-intro {
    grid-template-columns: minmax(0, 1fr);
    margin: 22px 0 20px;
  }
  .pr-wall-intro h1 {
    font-size: clamp(30px, 8vw, 44px);
  }
  .pr-wall-lede {
    text-align: left;
    font-size: 15px;
  }
  .pr-grid-frame {
    container-type: normal;
  }
  .pr-grid {
    height: auto;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 156px), 1fr));
    grid-auto-rows: auto;
    gap: 10px;
  }
  .pr-cell {
    grid-row: auto;
    grid-column: auto;
    aspect-ratio: 1.25;
  }
  .pr-wall.is-entering .pr-cell {
    animation-delay: 0s;
  }
  .pr-preview {
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    gap: 24px;
    padding: 20px;
  }
  .pr-preview-mark {
    width: min(100%, 420px);
  }
  .pr-preview-facts {
    grid-template-columns: minmax(0, 1fr);
  }
  .pr-bar {
    padding: 0 8px;
    gap: 6px;
  }
  .pr-bar-middle,
  .pr-control--text span,
  .pr-divider,
  [data-pr-theme] {
    display: none;
  }
  .pr-control--text {
    padding: 0;
    min-width: 36px;
  }
  .pr-now {
    padding-left: 2px;
  }
}
@media (max-width: 480px) {
  .pr-cohort,
  .pr-start span {
    display: none;
  }
  .pr-start {
    padding: 0 10px;
  }
  .pr-now-section {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-delay: 0s !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .pr-tile:hover,
  .pr-tile:focus-visible {
    transform: none;
  }
  .pr-loading-line::after {
    animation: none;
    width: 100%;
  }
}