/* Nebula v1 — canonical subscriber stylesheet. Keep presentation here, not in TSX.
 * Source: BLOCKS src/styles.css and app-chrome.tsx, read 2026-09-10.
 * Load AFTER host CSS. No build tool or Tailwind processing is required.
 */
@font-face {
  font-family: "IBM Plex Sans";
  src: url("./fonts/IBMPlexSans-Latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
}

html[data-nebula-subscriber],
[data-theme="nebula"] {
  color-scheme: dark;
  --nebula-version: 1;
  --nebula-font-sans: "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  --nebula-font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --nebula-font-size-xs: 0.75rem;
  --nebula-font-size-sm: 0.875rem;
  --nebula-font-size-base: 1rem;
  --nebula-font-weight-light: 300;
  --nebula-font-weight-normal: 400;
  --nebula-font-weight-medium: 500;
  --nebula-font-weight-semibold: 600;
  --nebula-heading-page-size: 1.5rem;
  --nebula-heading-letter-spacing: -0.025em;
  --nebula-body-line-height: 1.5;
  --nebula-control-height: 2.25rem;
  --nebula-control-height-sm: 2rem;
  --nebula-control-height-comfortable: 2.5rem;
  --nebula-control-font-size: var(--nebula-font-size-sm);
  --nebula-control-font-size-sm: var(--nebula-font-size-xs);
  --nebula-input-height-comfortable: 2.75rem;
  --nebula-wordmark-size: 14px;
  --nebula-wordmark-weight: 600;
  --nebula-wordmark-line-height: 20px;
  --nebula-wordmark-tracking: 0.42em;
  --nebula-kicker-size: 10px;
  --nebula-kicker-tracking: 0.22em;
  --nebula-header-height: 56px;
  --nebula-header-opacity: 0.85;
  --nebula-header-blur: 8px;
  --nebula-panel-open-duration: 610ms;
  --nebula-panel-close-duration: 440ms;
  --nebula-panel-ease: cubic-bezier(0.2, 0.72, 0.16, 1);
  --nebula-background: oklch(0.16 0.004 285);
  --nebula-foreground: oklch(0.92 0.003 285);
  --nebula-surface: oklch(0.2 0.004 285);
  --nebula-raised: oklch(0.24 0.004 285);
  --nebula-muted: oklch(0.62 0.004 285);
  --nebula-gold: oklch(0.78 0.09 74);
  --nebula-danger: oklch(0.62 0.16 26);
  --nebula-danger-ink: oklch(0.96 0.003 285);
  --nebula-border: oklch(0.29 0.004 285);
  --nebula-ring: oklch(0.45 0.004 285);
  --nebula-sidebar: oklch(0.18 0.004 285);
  --nebula-page: oklch(0.965 0.006 88);
  --nebula-page-ink: oklch(0.22 0.008 60);
  --nebula-chart-2: oklch(0.6 0.05 220);
  --nebula-chart-3: oklch(0.5 0.03 285);
  --nebula-chart-4: oklch(0.7 0.06 150);
  --nebula-chart-5: oklch(0.66 0.1 30);
  --nebula-radius: 0.375rem;
  --nebula-radius-dialog: 1.375rem;
  --nebula-modal-background: color-mix(in oklch, var(--nebula-surface) 60%, transparent);
  --nebula-modal-blur: 12px;
  --nebula-modal-scrim: rgb(0 0 0 / 38%);
  --nebula-modal-scrim-blur: 3px;
  --nebula-weight-heading: 300;
  --nebula-weight-body: 400;
  --nebula-weight-control: 400;
  --nebula-header-background: color-mix(
    in oklch,
    var(--nebula-background) calc(var(--nebula-header-opacity) * 100%),
    transparent
  );
  --nebula-overlay: oklch(0 0 0 / 75%);
  --nebula-shadow-dialog: 0 32px 110px oklch(0 0 0 / 68%);
  --nebula-duration: 160ms;
}

/* Rebind on K2/dark boundaries: local declarations otherwise beat inheritance.
 * The application HTML marker covers portals and is owned by its root.
 */
html[data-nebula-subscriber],
[data-theme="nebula"],
html:is([data-nebula-subscriber="admin"], [data-nebula-subscriber="kontagion"]) body,
html:is([data-nebula-subscriber="admin"], [data-nebula-subscriber="kontagion"]) :is(.k2, .dark, .k2-cohesion-v1, .k2-cohesion-portal),
[data-theme="nebula"] :is(.k2, .dark) {
  --font-app-sans: var(--nebula-font-sans);
  --font-app-display: var(--nebula-font-sans);
  --font-app-mono: var(--nebula-font-mono);
  --font-sans: var(--nebula-font-sans);
  --font-display: var(--nebula-font-sans);
  --font-mono: var(--nebula-font-mono);
  --writer-panel-open-duration: var(--nebula-panel-open-duration);
  --writer-panel-close-duration: var(--nebula-panel-close-duration);
  --writer-panel-motion-ease: var(--nebula-panel-ease);
  --background: var(--nebula-background);
  --foreground: var(--nebula-foreground);
  --card: var(--nebula-surface);
  --card-foreground: var(--nebula-foreground);
  --popover: var(--nebula-surface);
  --popover-foreground: var(--nebula-foreground);
  /* BLOCKS primary is off-white. The explicit primary button class uses gold. */
  --primary: var(--nebula-foreground);
  --primary-foreground: var(--nebula-background);
  --secondary: var(--nebula-raised);
  --secondary-foreground: var(--nebula-foreground);
  --muted: var(--nebula-raised);
  --muted-foreground: var(--nebula-muted);
  --accent: var(--nebula-gold);
  --accent-foreground: var(--nebula-background);
  --destructive: var(--nebula-danger);
  --destructive-foreground: var(--nebula-danger-ink);
  --border: var(--nebula-border);
  --input: var(--nebula-border);
  --ring: var(--nebula-ring);
  --radius: var(--nebula-radius);
  --page: var(--nebula-page);
  --page-foreground: var(--nebula-page-ink);
  --chart-1: var(--nebula-gold);
  --chart-2: var(--nebula-chart-2);
  --chart-3: var(--nebula-chart-3);
  --chart-4: var(--nebula-chart-4);
  --chart-5: var(--nebula-chart-5);
  --sidebar: var(--nebula-sidebar);
  --sidebar-foreground: var(--nebula-foreground);
  --sidebar-primary: var(--nebula-gold);
  --sidebar-primary-foreground: var(--nebula-background);
  --sidebar-accent: var(--nebula-raised);
  --sidebar-accent-foreground: var(--nebula-foreground);
  --sidebar-border: var(--nebula-border);
  --sidebar-ring: var(--nebula-ring);
}

/* Kontagion compatibility. Active product routes and admin share one material. */
html:is([data-nebula-subscriber="admin"], [data-nebula-subscriber="kontagion"]),
html:is([data-nebula-subscriber="admin"], [data-nebula-subscriber="kontagion"]) body,
html:is([data-nebula-subscriber="admin"], [data-nebula-subscriber="kontagion"]) :is(.k2, .k2-cohesion-v1, .k2-cohesion-portal) {
  --oai-black: var(--nebula-background);
  --oai-surface: var(--nebula-surface);
  --oai-surface-raised: var(--nebula-raised);
  --oai-ink: var(--nebula-foreground);
  --oai-muted: var(--nebula-muted);
  --oai-faint: var(--nebula-muted);
  --oai-line: var(--nebula-border);
  --oai-line-strong: var(--nebula-ring);
  --k2-cohesion-canvas: var(--nebula-background);
  --k2-cohesion-surface: var(--nebula-surface);
  --k2-cohesion-raised: var(--nebula-raised);
  --k2-cohesion-ink: var(--nebula-foreground);
  --k2-cohesion-muted: var(--nebula-muted);
  --k2-cohesion-faint: var(--nebula-muted);
  --k2-cohesion-line: var(--nebula-border);
  --k2-cohesion-line-strong: var(--nebula-border);
  --k2-cohesion-signal: var(--nebula-gold);
  --k2-cohesion-on-signal: var(--nebula-background);
  --k2-cohesion-focus-edge: var(--nebula-gold);
  --k2-cohesion-focus-border: var(--nebula-gold);
  --k2-cohesion-focus-halo: transparent;
  --k2-cohesion-radius-control: var(--nebula-radius);
  --k2-cohesion-radius-surface: var(--nebula-radius-dialog);
  --k2-gold: var(--nebula-gold) !important;
  --noir-orange: var(--nebula-gold) !important;
  --advanced-timeline-gold: var(--nebula-gold) !important;
  --k3-gold: var(--nebula-gold);
  --k3-gold-bright: color-mix(in oklch, var(--nebula-gold) 88%, white);
  --k3-gold-deep: var(--nebula-gold);
  --k3-on-gold: var(--nebula-background);
  --k3-font-sans: var(--nebula-font-sans);
  --k3-font-display: var(--nebula-font-sans);
  --k3-bar-h: var(--nebula-header-height);
  --k3-ring: var(--nebula-gold);
  --k3-ring-soft: transparent;
}

html:is([data-nebula-subscriber="admin"], [data-nebula-subscriber="kontagion"]),
html:is([data-nebula-subscriber="admin"], [data-nebula-subscriber="kontagion"]) body,
.nebula-root,
.nebula-showcase {
  background: var(--nebula-background);
  color: var(--nebula-foreground);
  font-family: var(--nebula-font-sans);
  font-weight: var(--nebula-weight-body);
  line-height: 1.6;
  letter-spacing: normal;
  -webkit-font-smoothing: antialiased;
}

.nebula-root,
.nebula-showcase,
.nebula-dialog,
.nebula-root *,
.nebula-showcase *,
.nebula-dialog * {
  box-sizing: border-box;
}

:is(html[data-nebula-subscriber], [data-theme="nebula"])
  :is(.nebula-title, .nebula-heading, .nebula-subheading) {
  margin: 0;
  background: transparent;
  color: var(--nebula-foreground);
  font-family: var(--nebula-font-sans);
  font-weight: var(--nebula-weight-heading);
  line-height: 1.2;
  letter-spacing: var(--nebula-heading-letter-spacing);
  text-wrap: balance;
}
.nebula-title {
  font-size: clamp(2.5rem, 4.5vw, 4rem);
}
.nebula-heading {
  font-size: clamp(1.5rem, 2.5vw, 2rem);
}
.nebula-subheading {
  font-size: 1.2rem;
}
.nebula-body {
  margin: 0;
  max-width: 62ch;
  font-size: 0.9375rem;
}
.nebula-muted {
  color: var(--nebula-muted);
}
.nebula-eyebrow {
  margin: 0;
  color: var(--nebula-muted);
  font-family: var(--nebula-font-sans);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.nebula-mono {
  font-family: var(--nebula-font-mono);
  font-size: 0.75rem;
}
.nebula-link {
  color: var(--nebula-gold);
  text-decoration: underline;
  text-underline-offset: 0.25em;
}

/* BLOCKS TopBar already owns all layout; this adapter changes material only. */
:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-app-header {
  background: var(--nebula-header-background);
  backdrop-filter: blur(var(--nebula-header-blur));
  -webkit-backdrop-filter: blur(var(--nebula-header-blur));
}

:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: var(--nebula-header-height);
  padding: 0.625rem 1.5rem;
  border-bottom: 1px solid color-mix(in oklch, var(--nebula-border) 60%, transparent);
  background: var(--nebula-header-background);
  color: var(--nebula-foreground);
  backdrop-filter: blur(var(--nebula-header-blur));
  -webkit-backdrop-filter: blur(var(--nebula-header-blur));
}
.nebula-wordmark {
  font-size: var(--nebula-wordmark-size);
  font-weight: var(--nebula-wordmark-weight);
  line-height: var(--nebula-wordmark-line-height);
  letter-spacing: var(--nebula-wordmark-tracking);
}
.nebula-kicker {
  font-size: var(--nebula-kicker-size);
  font-weight: var(--nebula-font-weight-normal);
  letter-spacing: var(--nebula-kicker-tracking);
  color: var(--nebula-muted);
}

:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: var(--nebula-control-height-comfortable);
  height: auto;
  padding: 0.5rem 1rem;
  border: 1px solid var(--nebula-border);
  border-radius: var(--nebula-radius);
  background: transparent;
  color: var(--nebula-foreground);
  font-family: var(--nebula-font-sans);
  font-size: var(--nebula-control-font-size);
  font-weight: var(--nebula-weight-control);
  line-height: 1.4;
  text-decoration: none;
  white-space: normal;
  cursor: pointer;
  box-shadow: none;
  transition:
    background-color var(--nebula-duration),
    border-color var(--nebula-duration);
}
:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-button:hover:not(:disabled) {
  background: var(--nebula-raised);
  border-color: var(--nebula-ring);
}
:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-button--primary {
  background: var(--nebula-gold);
  border-color: var(--nebula-gold);
  color: var(--nebula-background);
}
:is(html[data-nebula-subscriber], [data-theme="nebula"])
  .nebula-button--primary:hover:not(:disabled) {
  background: color-mix(in oklch, var(--nebula-gold) 85%, var(--nebula-page));
  border-color: var(--nebula-gold);
}
:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-button--ghost {
  border-color: transparent;
}
:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-button--danger {
  color: var(--nebula-danger-ink);
  border-color: var(--nebula-danger);
}
:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-button--icon {
  width: 2.5rem;
  padding: 0.5rem;
}
:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-button--sm {
  min-height: var(--nebula-control-height-sm);
  padding: 0.375rem 0.75rem;
  font-size: var(--nebula-control-font-size-sm);
}
.nebula-button svg {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
  stroke-width: 1.5;
}
.nebula-button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

:is(html[data-nebula-subscriber], [data-theme="nebula"])
  :is(
    .nebula-button,
    .nebula-input,
    .nebula-checkbox,
    .nebula-link,
    .nebula-gallery-trigger
  ):focus-visible {
  outline: 2px solid var(--nebula-gold);
  outline-offset: 3px;
  box-shadow: none;
}
.nebula-card {
  min-width: 0;
  padding: 1.5rem;
  border: 1px solid var(--nebula-border);
  border-radius: var(--nebula-radius);
  background: var(--nebula-surface);
}
.nebula-field {
  display: grid;
  gap: 0.5rem;
  min-width: 0;
}
.nebula-label {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--nebula-foreground);
}
.nebula-hint {
  margin: 0;
  font-size: 0.75rem;
  color: var(--nebula-muted);
}
:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-input,
html:is([data-nebula-subscriber="admin"], [data-nebula-subscriber="kontagion"]) .nebula-input[data-k2-cohesion-control="input"] {
  width: 100%;
  min-height: var(--nebula-input-height-comfortable);
  height: auto;
  padding: 0.625rem 0.875rem;
  border: 1px solid var(--nebula-border);
  border-radius: var(--nebula-radius);
  background: var(--nebula-background);
  color: var(--nebula-foreground);
  font: 400 0.9375rem/1.5 var(--nebula-font-sans);
  box-shadow: none;
  caret-color: var(--nebula-gold);
  accent-color: var(--nebula-gold);
}
.nebula-input::placeholder {
  color: var(--nebula-muted);
  opacity: 1;
}
:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-input[aria-invalid="true"] {
  border-color: var(--nebula-danger);
}
.nebula-input:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.nebula-input[readonly] {
  color: var(--nebula-muted);
}
textarea.nebula-input {
  min-height: 6rem;
  resize: vertical;
}
.nebula-field-error {
  margin: 0;
  color: var(--nebula-danger-ink);
  font-size: 0.75rem;
}
.nebula-check-row {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-size: 0.8125rem;
}
:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-checkbox {
  width: 1.125rem;
  height: 1.125rem;
  border: 1px solid var(--nebula-muted);
  border-radius: 0.2rem;
}
:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-checkbox[data-state="checked"] {
  background: var(--nebula-gold);
  border-color: var(--nebula-gold);
  color: var(--nebula-background);
}
.nebula-select {
  font-family: var(--nebula-font-sans);
}
.nebula-select [role="option"] {
  padding-block: 0.625rem;
}
.nebula-select [role="option"][data-highlighted] {
  background: var(--nebula-raised);
  color: var(--nebula-foreground);
}

.nebula-table-wrap {
  width: 100%;
  overflow-x: auto;
}
.nebula-table {
  width: 100%;
  border-collapse: collapse;
  color: var(--nebula-foreground);
  font-size: 0.8125rem;
  text-align: left;
}
.nebula-table :is(th, td) {
  padding: 1rem 0.75rem;
  border-bottom: 1px solid var(--nebula-border);
  text-align: left;
  vertical-align: middle;
}
.nebula-table th {
  color: var(--nebula-muted);
  font-weight: 400;
}
.nebula-table[data-density="compact"] :is(th, td) {
  padding-block: 0.625rem;
}
.nebula-table tbody tr:hover {
  background: var(--nebula-raised);
}
.nebula-table caption {
  padding: 0.75rem;
  color: var(--nebula-muted);
  font-size: 0.75rem;
  caption-side: bottom;
  text-align: left;
}
.nebula-table .nebula-status {
  white-space: nowrap;
}
.nebula-status {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: var(--nebula-muted);
  font-size: 0.75rem;
}
.nebula-status::before {
  content: "";
  width: 0.3rem;
  height: 0.3rem;
  border-radius: 50%;
  background: currentColor;
}
.nebula-status--active,
.nebula-status--warning {
  color: var(--nebula-gold);
}
.nebula-status--success {
  color: var(--nebula-chart-4);
}
.nebula-status--error {
  color: var(--nebula-danger-ink);
}
.nebula-state {
  display: grid;
  align-content: start;
  justify-items: start;
  gap: 0.875rem;
  min-height: 13rem;
}
.nebula-state > svg {
  width: 1.125rem;
  height: 1.125rem;
  color: var(--nebula-muted);
  stroke-width: 1.5;
}
.nebula-state--error {
  border-color: var(--nebula-danger);
}
.nebula-skeleton {
  width: 100%;
  height: 0.5rem;
  border-radius: var(--nebula-radius);
  background: var(--nebula-raised);
  animation: nebula-pulse 1.7s ease-in-out infinite;
}
.nebula-skeleton + .nebula-skeleton {
  width: 65%;
}
.nebula-spinner {
  animation: nebula-spin 1s linear infinite;
}
@keyframes nebula-spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes nebula-pulse {
  50% {
    opacity: 0.4;
  }
}

/* Only tagged dialog surfaces defeat the host's !important portal material. */
:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-dialog {
  width: calc(100vw - 2rem);
  max-width: 30rem;
  max-height: calc(100dvh - 2rem);
  overflow-y: auto;
  padding: 1.75rem;
  gap: 1.5rem;
  border: 1px solid var(--nebula-border);
  border-radius: var(--nebula-radius-dialog) !important;
  background-color: var(--nebula-surface) !important;
  border-color: var(--nebula-border) !important;
  box-shadow: var(--nebula-shadow-dialog) !important;
  color: var(--nebula-foreground);
  font-family: var(--nebula-font-sans);
  font-weight: var(--nebula-weight-body);
  line-height: 1.6;
}
.nebula-dialog > :first-child {
  padding-right: 1.5rem;
}
.nebula-dialog::before {
  content: "";
  position: absolute;
  inset: 0 2rem auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--nebula-gold), transparent);
}
.nebula-dialog > button:last-child {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  top: 1rem;
  right: 1rem;
  color: var(--nebula-muted);
}
:is(html[data-nebula-subscriber], [data-theme="nebula"]) .nebula-dialog--lightbox {
  max-width: 64rem;
}
.nebula-dialog-footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.625rem;
  padding-top: 1rem;
  border-top: 1px solid var(--nebula-border);
}

/* Showcase composition; these classes are opt-in and portable with this file. */
.nebula-showcase {
  width: 100%;
  max-width: 76rem;
  margin-inline: auto;
  padding: clamp(1.25rem, 4vw, 3.5rem);
}
.nebula-stack {
  display: grid;
  gap: 1.25rem;
}
.nebula-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}
.nebula-section {
  display: grid;
  gap: 1.5rem;
  padding-block: 2.5rem;
  border-bottom: 1px solid var(--nebula-border);
  scroll-margin-top: 6rem;
}
.nebula-section:last-child {
  border-bottom: 0;
}
.nebula-section-heading {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.75rem;
}
.nebula-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
}
.nebula-grid--three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.nebula-hero {
  display: grid;
  gap: 1.5rem;
  padding-bottom: 1rem;
}
.nebula-type-specimen {
  display: grid;
  gap: 1rem;
  padding-block: 1.5rem;
  border-top: 1px solid var(--nebula-border);
}
.nebula-swatches {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.nebula-swatch {
  margin: 0;
  display: grid;
  gap: 0.5rem;
}
.nebula-swatch-color {
  height: 5rem;
  border: 1px solid var(--nebula-border);
  border-radius: var(--nebula-radius);
  background: var(--nebula-swatch-color);
}
.nebula-swatch figcaption {
  display: grid;
  gap: 0.125rem;
  font-size: 0.8125rem;
}
.nebula-swatch code {
  color: var(--nebula-muted);
  font-size: 0.6875rem;
  overflow-wrap: anywhere;
}
.nebula-header-stage {
  overflow: hidden;
  border: 1px solid var(--nebula-border);
  border-radius: var(--nebula-radius);
  background: linear-gradient(120deg, var(--nebula-background), var(--nebula-raised));
}
.nebula-header-caption {
  margin: 0;
  padding: 1rem 1.5rem;
  color: var(--nebula-muted);
  font-size: 0.75rem;
}
.nebula-gallery-trigger {
  display: grid;
  gap: 1rem;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--nebula-foreground);
  text-align: left;
  font: inherit;
  cursor: zoom-in;
}
.nebula-art {
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 12rem;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 1px solid var(--nebula-border);
  border-radius: var(--nebula-radius);
  background: var(--nebula-background);
}
.nebula-art--horizon {
  background:
    radial-gradient(
      ellipse at 50% 125%,
      color-mix(in oklch, var(--nebula-gold) 32%, transparent),
      transparent 65%
    ),
    var(--nebula-background);
}
.nebula-art--orbit {
  background:
    repeating-radial-gradient(
      ellipse at 50% 100%,
      transparent 0 3rem,
      color-mix(in oklch, var(--nebula-gold) 20%, transparent) 3rem calc(3rem + 1px),
      transparent calc(3rem + 1px) 5rem
    ),
    var(--nebula-background);
}
.nebula-art-label {
  font-size: clamp(1.5rem, 4vw, 3rem);
  font-weight: 300;
  letter-spacing: 0.12em;
}
.nebula-lightbox-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.nebula-lightbox-figure {
  margin: 0;
}
.nebula-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 760px) {
  .nebula-grid,
  .nebula-grid--three {
    grid-template-columns: minmax(0, 1fr);
  }
  .nebula-swatches {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .nebula-card {
    padding: 1.125rem;
  }
  .nebula-section {
    padding-block: 2rem;
  }
  .nebula-table {
    min-width: 31rem;
  }
}
/* Public home keeps its semantic sections and real navigation. Its material,
 * type and film imagery now subscribe to the same theme as the workspace. */
html[data-nebula-subscriber] [data-nebula-home][data-build] {
  --bg: var(--nebula-background);
  --panel: var(--nebula-surface);
  --panel-2: var(--nebula-raised);
  --paper: var(--nebula-foreground);
  --muted: var(--nebula-muted);
  --quiet: var(--nebula-muted);
  --line: var(--nebula-border);
  --amber: var(--nebula-gold);
  --amber-light: var(--nebula-gold);
  --font-geist-sans: var(--nebula-font-sans);
  background: var(--nebula-background);
  color: var(--nebula-foreground);
  font-family: var(--nebula-font-sans);
}
html[data-nebula-subscriber] [data-nebula-home][data-build] :is(h1,h2,h3) { font-family: var(--nebula-font-sans); font-weight: 300; color: var(--nebula-foreground); }
html[data-nebula-subscriber] [data-nebula-home][data-build] > section { background: transparent; color: var(--nebula-foreground); }
html[data-nebula-subscriber] [data-nebula-home][data-build] > section :is(p,article,blockquote,strong) { color: var(--nebula-foreground); }
html[data-nebula-subscriber] [data-nebula-home][data-build] > section h2 span { color: inherit; }
html[data-nebula-subscriber] [data-nebula-home][data-build] [data-testid="flagship-context"]::before { display: none; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-public-header {
  min-height: var(--nebula-header-height);
  height: var(--nebula-header-height);
  background: var(--nebula-header-background);
  backdrop-filter: blur(var(--nebula-header-blur));
  -webkit-backdrop-filter: blur(var(--nebula-header-blur));
  border-color: var(--nebula-border);
  font-family: var(--nebula-font-sans);
  grid-template-columns: minmax(320px,1fr) auto auto;
  gap: 30px;
}
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-public-header > a[aria-label="Kontagion home"] { font-size: 14px; font-weight: 500; letter-spacing: 0.38em; gap: 20px; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-public-header > a[aria-label="Kontagion home"] > span { color: var(--nebula-foreground); }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-public-header small { color: var(--nebula-muted); font-size: 10px; font-weight: 400; letter-spacing: 0.18em; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-public-header nav { gap: 24px; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-public-header :is(nav a, a[href="/login"]) { font-size: 13px; letter-spacing: normal; }
html[data-nebula-subscriber] [data-nebula-home][data-build] a[href^="/signup"] { min-height: 38px; border: 1px solid transparent; border-radius: 6px; background: var(--nebula-gold); color: var(--nebula-background); font-size: 13px; font-weight: 500; letter-spacing: normal; text-transform: none; box-shadow: none; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-hero { min-height: 0; padding: 88px 24px 48px; border: 0; overflow: visible; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-hero::after { display: none; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-hero > p { margin-bottom: 12px !important; color: var(--nebula-gold); font: 400 11px/1.5 var(--nebula-font-sans); letter-spacing: 0.3em; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-hero > p::before,
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-hero > p::after { display: none; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-hero h1 { font-size: clamp(34px,3.7vw,58px); line-height: 1.18; font-weight: 300; letter-spacing: -0.035em; text-indent: 0; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-hero h1 span { color: var(--nebula-foreground); }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-promise { margin: 10px 0 30px; font: 400 clamp(15px,1.4vw,21px)/1.5 var(--nebula-font-sans); letter-spacing: normal; text-align: center; color: var(--nebula-muted); }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-product { width: min(100%,1040px); margin: 0 auto; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-product::before,
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-product::after { display: none; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-product-image { height: auto; border-radius: 12px; border: 1px solid var(--nebula-border); padding: 6px; background: var(--nebula-background); box-shadow: 0 20px 65px rgb(0 0 0 / .4); }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-product-image > img { display: block; width: 100%; height: auto; border-radius: 7px; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-product-image > a { bottom: 18px; right: 18px; }
.nebula-home-help { position: absolute; top: 82px; right: 28px; }
.nebula-home-star-babe, .nebula-home-rook { display: none; }
html[data-nebula-subscriber] [data-nebula-home][data-build] [data-testid="flagship-promise-strip"] { width: min(1100px,100%); margin: 0 auto; min-height: 100px; padding: 0 20px 24px; border: 0; }
html[data-nebula-subscriber] [data-nebula-home][data-build] [data-testid="flagship-promise-strip"] article { padding: 20px 24px; border-color: var(--nebula-border); background: transparent; }
html[data-nebula-subscriber] [data-nebula-home][data-build] [data-testid="flagship-promise-strip"] :is(strong,small) { color: var(--nebula-foreground); font-family: var(--nebula-font-sans); }
html[data-nebula-subscriber] [data-nebula-home][data-build] [data-testid="flagship-promise-strip"] span { color: var(--nebula-muted); font-size: 13px; }
@media (min-width: 1100px) {
  .nebula-home-star-babe, .nebula-home-rook { display: block; position: absolute; z-index: -1; top: 75px; bottom: 0; width: 29%; background-size: auto 100%; background-repeat: no-repeat; opacity: .72; }
  .nebula-home-star-babe { left: 0; background-image: url("/nebula/star-babe-reference.png"); background-position: 52% center; mask-image: linear-gradient(to right,black 10%,transparent 100%),linear-gradient(to bottom,transparent,black 15%,black 66%,transparent); mask-composite: intersect; }
  .nebula-home-rook { right: 0; background-image: url("/nebula/rook-reference.png"); background-position: 54% center; mask-image: linear-gradient(to left,black 10%,transparent 100%),linear-gradient(to bottom,transparent,black 15%,black 66%,transparent); mask-composite: intersect; }
}
@media (max-width: 1100px) {
  html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-public-header { grid-template-columns: 1fr auto; }
  html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-public-header > nav[aria-label="Primary navigation"] { display: none; }
  html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-public-header button[aria-expanded] { display: grid; width: 42px; height: 42px; place-content: center; gap: 6px; border: 1px solid var(--nebula-border); border-radius: 6px; background: transparent; }
  html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-public-header button[aria-expanded] > span { display: block; width: 18px; height: 1px; background: var(--nebula-gold); }
  .nebula-home-help { top: 64px; right: 16px; }
}
@media (max-width: 600px) {
  html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-public-header small,
  html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-public-header s { display: none; }
  html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-public-header > a[aria-label="Kontagion home"] { font-size: 12px; letter-spacing: .24em; }
  html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-hero { padding: 110px 16px 32px; }
  html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-product-image > a { position: relative; margin: 12px auto 6px; inset: auto; display: flex; width: fit-content; }
}
.nebula-help-hook {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 36px;
  padding: 0.4rem 0.55rem;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--nebula-muted);
  font: 400 13px/1.35 var(--nebula-font-sans);
  cursor: pointer;
}
.nebula-help-hook:hover { color: var(--nebula-foreground); }
.nebula-help-hook:focus-visible {
  outline: 1px solid var(--nebula-gold);
  outline-offset: 3px;
}
.nebula-help-fallback {
  position: fixed;
  right: 20px;
  bottom: 12px;
  z-index: 45;
  border-radius: 8px;
  background: var(--nebula-background);
}
html:has([data-screen-help-entry="true"]) .nebula-help-fallback { display: none; }
.nebula-help-dialog {
  z-index: 2147483600;
  width: min(540px, calc(100vw - 32px));
  max-height: min(760px, calc(100dvh - 40px));
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 28px;
  border: 1px solid var(--nebula-border);
  border-radius: 12px;
  background: var(--nebula-surface);
  color: var(--nebula-foreground);
  font: 400 14px/1.65 var(--nebula-font-sans);
  box-shadow: 0 24px 80px rgb(0 0 0 / 0.5);
}
.nebula-help-dialog .nebula-help-title {
  margin: 0;
  padding-right: 16px;
  font: 400 26px/1.25 var(--nebula-font-sans);
  letter-spacing: -0.02em;
}
.nebula-help-dialog .nebula-help-purpose { font-size: 15px; line-height: 1.6; color: var(--nebula-muted); }
.nebula-help-steps { margin: 0; padding: 0; list-style: none; display: grid; gap: 16px; }
.nebula-help-steps li { display: grid; grid-template-columns: 26px 1fr; gap: 12px; align-items: start; }
.nebula-help-steps li > span { display: grid; place-items: center; width: 26px; height: 26px; border: 1px solid var(--nebula-border); border-radius: 50%; color: var(--nebula-gold); font-size: 12px; }
.nebula-help-steps p, .nebula-help-note p, .nebula-help-recovery p { margin: 0; }
.nebula-help-note { padding: 16px; border: 1px solid var(--nebula-border); border-radius: 8px; background: var(--nebula-background); }
.nebula-help-recovery h3 { margin: 0 0 4px; font-size: 14px; font-weight: 500; }
.nebula-help-recovery p { color: var(--nebula-muted); }
.nebula-help-related { display: flex; flex-wrap: wrap; gap: 8px 16px; padding-top: 12px; border-top: 1px solid var(--nebula-border); }
.nebula-help-related button, .nebula-help-back { padding: 0; border: 0; background: transparent; color: var(--nebula-gold); font: inherit; cursor: pointer; text-align: left; }
.nebula-help-related button:focus-visible, .nebula-help-back:focus-visible { outline: 1px solid var(--nebula-gold); outline-offset: 4px; border-radius: 2px; }
.nebula-help-back { display: inline-flex; align-items: center; gap: 8px; align-self: start; font-size: 12px; margin-bottom: 2px; }
.nebula-help-shortcuts p { display: flex; justify-content: space-between; gap: 16px; margin: 8px 0; }
@media (max-width: 600px) {
  .nebula-help-dialog { width: 100%; max-width: none; height: 100dvh; max-height: none; border-radius: 0; padding: 24px; }
}
@media (prefers-reduced-transparency: reduce) {
  :is(html[data-nebula-subscriber], [data-theme="nebula"]) :is(.nebula-header, .nebula-app-header) {
    background: var(--nebula-background);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .nebula-spinner,
  .nebula-skeleton {
    animation: none;
  }
  .nebula-help-dialog { animation: none; transition: none; }
  :is(html[data-nebula-subscriber], [data-theme="nebula"])
    :is(.nebula-button, .nebula-dialog, .nebula-select) {
    animation: none;
    transition: none;
  }
}

/* Living film workspace: the canonical header and allocated side panels. */
html[data-nebula-subscriber="kontagion"] [data-living-nebula-shell] {
  /* Keep the filmmaking workspace on the neutral Noir family. The shared
   * Nebula defaults carry a slight 285deg chroma that reads as blue across a
   * full-screen canvas; that cast belongs in neither the picture nor the
   * filmmaker's tools. Scope the correction here so Control Room keeps its
   * independently approved Nebula palette. */
  --nebula-background: #080808;
  --nebula-surface: #101010;
  --nebula-raised: #171717;
  --nebula-sidebar: #0d0d0d;
  background: var(--nebula-background); color: var(--nebula-foreground);
  font-family: var(--nebula-font-sans);
}
html[data-nebula-subscriber="kontagion"] [data-living-nebula-shell] > .k3-canvas { background: radial-gradient(ellipse at 55% 0%,color-mix(in oklch, var(--nebula-gold) 2.5%, transparent),transparent 65%); }
html[data-nebula-subscriber="kontagion"] .nebula-workspace-header {
  min-height: 56px; height: 56px; padding: 0 20px; gap: 20px;
  border-bottom: 1px solid var(--nebula-border);
}
/* BLOCKS parity (measured on blocks.film 2026-09-12): the global header is the translucent
 * layer - 85% ground, 8px blur - and the page scrolls beneath it. The cohesion layer
 * de-glasses every mode header with `background-color: ... !important` plus
 * `backdrop-filter: none !important`, so matching BLOCKS needs the same weight and a
 * more specific selector; without this the header paints flat and the translucency
 * ends up on the screenplay's own bars, which is backwards. */
html[data-nebula-subscriber="kontagion"] .k2-cohesion-v1 [data-k2-cohesion-role="mode-header"].nebula-workspace-header,
html[data-nebula-subscriber="kontagion"] .nebula-workspace-header {
  background-color: var(--nebula-header-background) !important;
  backdrop-filter: blur(var(--nebula-header-blur)) !important;
}
@media (prefers-reduced-transparency: reduce) {
  html[data-nebula-subscriber="kontagion"] .k2-cohesion-v1 [data-k2-cohesion-role="mode-header"].nebula-workspace-header,
  html[data-nebula-subscriber="kontagion"] .nebula-workspace-header {
    background-color: var(--nebula-background) !important; backdrop-filter: none !important;
  }
}
.nebula-workspace-brand-row { display: flex; align-items: center; gap: 24px; min-width: 0; }
.nebula-brand { display: inline-flex; align-items: center; gap: 22px; color: var(--nebula-foreground); white-space: nowrap; text-decoration: none; }
.nebula-brand strong { font: 400 14px/1 var(--nebula-font-sans); letter-spacing: .36em; }
.nebula-brand > span { border-left: 1px solid var(--nebula-border); padding-left: 22px; font-size: 11px; letter-spacing: .17em; color: var(--nebula-muted); }
/* The film you are in, and the way to a different one, in the header on every surface. */
.nebula-workspace-film { display: flex; min-width: 0; align-items: center; padding-left: 22px; border-left: 1px solid var(--nebula-border); }
.nebula-workspace-film [data-testid="project-picker-trigger"] { min-width: 0; max-width: 22ch; font-size: 13px; font-weight: 400; color: var(--nebula-foreground); }
/* Reserve the centered stages' intrinsic width. A long title shrinks in its
 * side lane, rather than painting beneath WRITE. ProjectPicker's `contents`
 * wrapper remains a DOM ancestor, so a direct-child button selector misses it. */
@media (min-width: 1100px) {
  html[data-nebula-subscriber="kontagion"] .nebula-workspace-header { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
  html[data-nebula-subscriber="kontagion"] .nebula-workspace-header > .nebula-workspace-brand-row { max-width: 100%; }
  html[data-nebula-subscriber="kontagion"] .nebula-workspace-header > [data-testid="mode-switcher"] { position: static; transform: none; translate: none; }
  html[data-nebula-subscriber="kontagion"] .nebula-workspace-header > .nebula-workspace-header-actions { justify-self: end; }
}
@media (max-width: 900px) { .nebula-brand > span { display: none; } .nebula-workspace-film { padding-left: 14px; } }
.nebula-icon-button { display: inline-grid; place-items: center; flex-shrink: 0; width: 36px; height: 36px; border: 0; border-radius: 6px; background: transparent; color: var(--nebula-muted); }
.nebula-icon-button:focus-visible { outline: 1px solid var(--nebula-gold); outline-offset: 2px; }
.nebula-navigation-trigger { color: var(--nebula-gold); }
.nebula-workspace-header-actions { margin-left: auto; display: flex; align-items: center; gap: 4px; }
/* BLOCKS parity, measured 2026-09-12: BLOCKS runs one control shape across its whole header -
 * 40px tall, 4px radius, muted, no fills or borders. Kontagion had five shapes in one row
 * (32/30/73/32/32 wide; radii 9px, 9999px, 0, 4.75px, 6px) because each control arrived from a
 * different feature with its own styling - Gordon's "yard sale". One shape, set here at the
 * container so a control added tomorrow inherits it instead of bringing a sixth. */
html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions :is(button, a, .nebula-help-hook) {
  min-width: 36px; width: 36px; height: 36px; min-height: 36px; max-height: 36px;
  padding: 0; border-radius: 4px;
  border: 0; background: transparent; box-shadow: none;
  color: var(--nebula-muted);
  display: inline-grid; place-items: center;
}
/* Their icons arrive at four different sizes; one size, like every other control. */
html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions :is(button, a) > svg { width: 17px; height: 17px; }
/* These controls stay icon-only even when legacy wide-screen labels reappear.
 * A label would create a second grid row inside the fixed 36px control. */
html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions .nebula-workspace-action-label { display: none; }
/* No pulsing ring on the bell: the count is the signal, and BLOCKS has no such halo. */
html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions .animate-ping { display: none; }
html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions :is(button, a):hover { color: var(--nebula-foreground); background: rgb(255 255 255 / .05); }
html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions :is(button, a):focus-visible { outline: 1px solid var(--nebula-gold); outline-offset: 2px; }
/* The Kyger control keeps its word and its gold spark; it just stops being a different height. */
html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions .nebula-kyger-button { min-width: 0; width: auto; padding: 0 10px; gap: 7px; display: inline-flex; }
/* The avatar is the one deliberate exception: it is a person, not an icon. */
html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions [data-testid="k3-profile-menu"] :is(button, a) { border-radius: 9999px; }

/* The workspace side rails carried a lighter, bluer ground (oklch .2) than the writing room's
 * page chrome (oklch .16), which is what read as "the left sidebar looks slightly blue". */
html[data-nebula-subscriber="kontagion"] [data-living-nebula-shell] :is([data-testid="workspace-shell-browser"], [data-testid="workspace-shell-inspector"]) {
  background: var(--nebula-background); backdrop-filter: none; border-color: var(--nebula-border);
}
.nebula-workspace-header-actions > .nebula-help-hook { border: 0; padding: 8px; }
.nebula-workspace-header-actions > .nebula-help-hook span { display: none; }
.nebula-film-navigation { flex: 0 0 auto; width: 0; min-width: 0; overflow: hidden; background: var(--nebula-surface); border-right: 0 solid var(--nebula-border); transition: width var(--nebula-panel-close-duration) var(--nebula-panel-ease); }
[data-navigation-open="true"] > .nebula-workspace-body > .nebula-film-navigation { width: 260px; border-right-width: 1px; transition-duration: var(--nebula-panel-open-duration); }
.nebula-film-navigation-inner { width: 260px; height: 100%; display: flex; flex-direction: column; min-height: 0; }
.nebula-navigation-heading { display: flex; min-height: 62px; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px 8px 18px; border-bottom: 1px solid var(--nebula-border); }
.nebula-navigation-heading > div { min-width: 0; }
.nebula-navigation-search { display: flex; align-items: center; gap: 8px; margin: 16px 16px 6px; padding: 8px 0; color: var(--nebula-muted); border-bottom: 1px solid var(--nebula-border); }
.nebula-navigation-search input { width: 100%; min-width: 0; color: var(--nebula-foreground); background: transparent; border: 0; outline: 0; font-size: 13px; }
.nebula-navigation-search:focus-within { border-color: var(--nebula-gold); }
.nebula-navigation-links { min-height: 0; flex: 1; overflow-y: auto; padding: 8px; }
.nebula-navigation-links h2 { margin: 24px 12px 8px; color: var(--nebula-muted); font-size: 10px; font-weight: 400; letter-spacing: .18em; text-transform: uppercase; }
.nebula-navigation-links a { display: flex; align-items: center; gap: 12px; min-height: 40px; padding: 9px 12px; color: var(--nebula-foreground); font-size: 13px; border-left: 2px solid transparent; border-radius: 3px; }
.nebula-navigation-links a:hover { background: rgb(255 255 255 / .035); }
.nebula-navigation-links a[aria-current="page"] { color: var(--nebula-gold); background: color-mix(in oklch, var(--nebula-gold) 4.5%, transparent); border-left-color: var(--nebula-gold); }
.nebula-navigation-empty { color: var(--nebula-muted); padding: 16px; font-size: 13px; }
.nebula-navigation-footer { padding: 12px 16px; border-top: 1px solid var(--nebula-border); }
html[data-nebula-subscriber="kontagion"] [data-living-nebula-shell] [data-testid="k3-shell-right"] {
  margin-top: 0; margin-bottom: 0; margin-left: 0; border: 0; border-radius: 0;
  background: transparent; box-shadow: none;
  transition: margin-right var(--nebula-panel-close-duration) var(--nebula-panel-ease);
}
html[data-nebula-subscriber="kontagion"] [data-living-nebula-shell][data-kyger-open="true"] [data-testid="k3-shell-right"] { transition-duration: var(--nebula-panel-open-duration); }
/* Timeline pixel geometry changes once; its persistent player is never scaled mid-frame. */
html[data-nebula-subscriber="kontagion"] [data-living-nebula-shell]:is([data-timeline="true"],[data-resizing="true"]) :is([data-testid="k3-shell-right"],.nebula-film-navigation) { transition: none; }
.nebula-workspace-kyger { background: var(--nebula-surface); border-left: 1px solid var(--nebula-border); transition: transform var(--nebula-panel-open-duration) var(--nebula-panel-ease); }
.nebula-workspace-kyger[data-collapsed="true"] { transition-duration: var(--nebula-panel-close-duration); }
.nebula-kyger-button { display: inline-flex; height: 34px; align-items: center; gap: 7px; padding: 0 10px; border: 0; background: transparent; color: var(--nebula-muted); font-size: 12px; }
.nebula-kyger-button svg { color: var(--nebula-gold); }
/* BLOCKS parity, measured on blocks.film 2026-09-12: the edge affordance is a FULL-HEIGHT
 * 48px rail flush to the window edge, with a 9px/1.62px vertical label - the same rail the
 * writing room already uses for SCENES and KYGER. It used to be a 36px tab floating at
 * top:50%, which is the "weird tab thing to pull Kyger out" Gordon rejected: one grammar
 * for every panel handle, on every surface. */
.nebula-kyger-edge { position:absolute; right:0; top:0; bottom:0; translate:none; z-index:40; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; width:48px; padding:12px 0; color:var(--nebula-gold); background:var(--nebula-background); border:0; border-left:1px solid var(--nebula-border); }
.nebula-kyger-edge > span { writing-mode:vertical-rl; font:400 9px/1.6 var(--nebula-font-sans); letter-spacing:1.62px; text-transform:uppercase; color:var(--nebula-muted); }
.nebula-kyger-edge:focus-visible { outline:1px solid var(--nebula-gold); outline-offset:-3px; }
@media (max-width: 1399px) {
 .nebula-workspace-brand-row .nebula-brand { flex-direction:column; align-items:flex-start; gap:5px; }
 .nebula-workspace-brand-row .nebula-brand > span { display:block; border:0; padding:0; font-size:9px; letter-spacing:.1em; }
}
@media (max-width: 1100px) { .nebula-workspace-header { gap: 12px; } .nebula-workspace-brand-row { gap: 12px; } .nebula-kyger-button > span { display: none; } }
@media (max-width: 900px) {
  html[data-nebula-subscriber="kontagion"] .nebula-workspace-header { padding: 0 10px; }
  .nebula-brand strong { font-size: 12px; letter-spacing: .2em; }
  .nebula-workspace-brand-row { gap: 6px; }
  [data-living-nebula-shell][data-compact="true"][data-navigation-open="true"] > .nebula-workspace-body > .nebula-film-navigation { width: 100%; }
  [data-compact="true"] .nebula-film-navigation-inner { width: 100%; }
  [data-living-nebula-shell][data-compact="true"] .nebula-workspace-kyger { width: 100% !important; }
  html[data-nebula-subscriber="kontagion"] [data-living-nebula-shell][data-compact="true"][data-kyger-open="true"] [data-testid="k3-shell-right"] { margin-right: 100% !important; }
  [data-living-nebula-shell][data-compact="true"] :is([data-testid="k3-chat-resize"],.nebula-kyger-edge) { display: none; }
  [data-living-nebula-shell][data-compact="true"] [data-testid="k3-shell-right"][inert] { flex-basis: 0; flex-shrink: 1; width: 0; visibility: hidden; }
}
@media (max-width: 480px) { .nebula-workspace-brand-row .nebula-brand { display: none; } .nebula-workspace-header-actions { gap: 3px; } }
@media (prefers-reduced-motion: reduce) { .nebula-film-navigation,.nebula-workspace-kyger,html[data-nebula-subscriber="kontagion"] [data-living-nebula-shell] [data-testid="k3-shell-right"] { transition: none; } }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-hero { display: block; text-align: center; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-hero > p { display: block; text-align: center; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-hero h1 { text-align: center; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-promise { justify-content: center; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-product { grid-column: auto; grid-row: auto; }
html[data-nebula-subscriber] [data-nebula-home][data-build] .nebula-home-product-image > a { display: none; }
html[data-nebula-subscriber] [data-nebula-home][data-build] [data-testid="flagship-promise-strip"] { box-shadow: none; }
html[data-nebula-subscriber] [data-nebula-home][data-build] [data-testid="flagship-promise-strip"] article::before,
html[data-nebula-subscriber] [data-nebula-home][data-build] [data-testid="flagship-promise-strip"] article::after { display: none; }
@media (max-width: 480px) {
  .nebula-workspace-brand-row .nebula-brand { display: inline-flex; }
  .nebula-workspace-brand-row .nebula-brand strong { font-size: 10px; letter-spacing: .12em; }
}

/* Project shelf, project home and film intake share one active Nebula shell. */
[data-nebula-collection] { min-height: 100dvh; color: var(--nebula-foreground); background: var(--nebula-background); font-family: var(--nebula-font-sans); }
[data-nebula-collection][data-footer-reserved="true"] { height: calc(100dvh - 40px); min-height: 0; overflow: auto; }
.nebula-collection-header { display: flex; position: sticky; top: 0; z-index: 40; width: 100%; justify-content: space-between; }
.nebula-collection-header .nebula-workspace-header-actions { display: flex; align-items: center; gap: 14px; }
.nebula-collection-tabs,.nebula-collection-stages { position: absolute; left: 50%; transform: translateX(-50%); display: flex; height: 100%; align-items: center; gap: 28px; }
.nebula-collection-tabs a { padding: 18px 10px 14px; border-bottom: 2px solid transparent; font-size: 14px; color: var(--nebula-muted); }
.nebula-collection-tabs a[aria-current="page"] { color: var(--nebula-gold); border-color: var(--nebula-gold); }

/* The collection tabs must occupy the middle track of the shared desktop
   grid. Absolute tabs left actions auto-placed in that same middle track. */
@media (min-width: 1100px) {
 html[data-nebula-subscriber="kontagion"] .nebula-collection-header > .nebula-collection-tabs {
  position: static; left: auto; transform: none; grid-column: 2; grid-row: 1;
 }
 html[data-nebula-subscriber="kontagion"] .nebula-collection-header > .nebula-workspace-header-actions {
  grid-column: 3; grid-row: 1;
 }
}

.nebula-collection-body { display: flex; min-height: calc(100dvh - 56px); }
.nebula-collection-nav { position: sticky; top: 56px; display: flex; flex-direction: column; flex-shrink: 0; width: 0; height: calc(100dvh - 56px); overflow: hidden; background: var(--nebula-surface); transition: width var(--nebula-panel-close-duration) var(--nebula-panel-ease); }
[data-nebula-collection][data-nav-open="true"] .nebula-collection-nav { width: 96px; transition-duration: var(--nebula-panel-open-duration); }
.nebula-collection-nav a { display: flex; flex-direction: column; flex: 0 0 auto; align-items: center; justify-content: center; gap: 9px; min-height: 88px; width: 96px; padding: 12px 5px; border-left: 3px solid transparent; color: var(--nebula-muted); font-size: 12px; white-space: nowrap; }
.nebula-collection-nav a[aria-current="page"] { color: var(--nebula-gold); border-left-color: var(--nebula-gold); background: rgb(255 255 255 / .04); }
.nebula-collection-nav a:hover { background: rgb(255 255 255 / .025); }
.nebula-collection-nav .nebula-collection-settings { margin-top: auto; }
.nebula-collection-content { min-width: 0; flex: 1; padding: 26px 46px 60px; }
.nebula-collection-content[data-content-width="bounded"] { width: 100%; max-width: 1380px; margin: 0 auto; }
.nebula-projects-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.nebula-projects-heading > div:first-child { display: contents; }
.nebula-projects-heading > div:first-child > div { margin-right: auto; }
.nebula-projects-heading h1 { font-size: 42px; font-weight: 300; line-height: 1.2; letter-spacing: -.025em; }
.nebula-projects-heading p { color: var(--nebula-muted); margin-top: 5px; font-size: 18px; }
html[data-nebula-subscriber="kontagion"] [data-testid="projects-page"] [data-testid="project-create-actions"] { margin: 0; }
html[data-nebula-subscriber="kontagion"] [data-testid="projects-page"] [data-testid="project-create-actions"] a { border-radius: 6px; font-weight: 400; height: 46px; background: var(--nebula-gold); color: var(--nebula-background); }
html[data-nebula-subscriber="kontagion"] [data-testid="projects-page"] [data-testid="scaffold-entry-button"] { display: none; } /* This door remains in New film's two-path intake. */
html[data-nebula-subscriber="kontagion"] [data-testid="projects-page"] [data-testid="project-library-controls"] { grid-template-columns: minmax(200px,1fr) 170px 190px 246px; gap: 16px; margin-bottom: 20px; }
html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] > div[role="group"] { grid-column: 4; grid-row: 1; border: 0; padding: 0; border-radius: 0; background: transparent; }
html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] > label { grid-row: 1; }
html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] > label:has(input) { grid-column: 1; }
html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] > label:has([data-testid="project-type-filter"]) { grid-column: 2; }
html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] > label:has([data-testid="project-sort"]) { grid-column: 3; }
html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] :is(select,label:has(input)) { border-radius: 6px; height: 48px; border-color: var(--nebula-border); background: var(--nebula-surface); color: var(--nebula-foreground); }
html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] [role="group"] button { width: 50%; border-radius: 0; border-bottom: 2px solid transparent; color: var(--nebula-muted); background: transparent; font-size: 13px; }
html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] [role="group"] button[aria-pressed="true"] { color: var(--nebula-gold); border-bottom-color: var(--nebula-gold); }
html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] [role="group"] button span { color: inherit; opacity: .6; }
.nebula-project-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px 20px; }
.nebula-project-grid [data-project-featured="true"] { grid-column: 1 / -1; }
.nebula-project-grid .nebula-project-card { position: relative; padding: 10px; border-radius: 8px; border-color: var(--nebula-border); background: var(--nebula-surface); }
.nebula-project-grid .group:hover .nebula-project-card { transform: none; background: var(--nebula-surface); }
.nebula-project-card [data-project-frame],.nebula-project-card [data-project-frame] > div { border-radius: 5px; }
.nebula-project-card [data-project-frame] { aspect-ratio: 2.65; }
.nebula-project-card [data-project-frame] > div { height: 100%; width: 100%; aspect-ratio: auto; }
.nebula-project-card [data-testid="project-context-menu-trigger"] { opacity: 1; border-radius: 6px; right: 18px; top: auto; bottom: 20px; width: 46px; height: 42px; background: var(--nebula-surface); }
.nebula-project-card-details { padding: 16px 12px 10px; min-width: 0; }
.nebula-project-card-details h3 { font-size: 25px; letter-spacing: -.015em; font-weight: 400; }
.nebula-project-kind { margin-top: 3px; font-size: 14px; color: var(--nebula-muted); }
.nebula-project-logline { margin: 22px 0; font-size: 14px; line-height: 1.6; }
.nebula-project-card-details [data-testid="project-last-accessed"] { color: var(--nebula-muted); font-size: 13px; margin-top: 8px; }
.nebula-project-card-actions { position: relative; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 22px; padding-right: 54px; }
.nebula-primary-button,.nebula-secondary-button { display: inline-flex; align-items: center; justify-content: center; gap: 24px; min-height: 44px; border: 1px solid var(--nebula-border); border-radius: 6px; padding: 10px 26px; font-size: 13px; font-weight: 400; }
.nebula-primary-button { background: var(--nebula-gold); color: var(--nebula-background); border-color: transparent; }
.nebula-secondary-button { color: var(--nebula-foreground); background: transparent; }
.nebula-primary-button:focus-visible,.nebula-secondary-button:focus-visible { outline: 1px solid var(--nebula-gold); outline-offset: 3px; }
.nebula-project-grid [data-project-featured="true"] .nebula-project-card { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); gap: 12px; }
.nebula-project-grid [data-project-featured="true"] [data-project-frame] { aspect-ratio: 2.7; min-height: 290px; }
.nebula-project-grid [data-project-featured="true"] .nebula-project-card-details { padding: 12px 26px 24px 14px; }
.nebula-project-grid [data-project-featured="true"] .nebula-project-card-details h3 { font-size: 31px; }
html[data-nebula-subscriber="kontagion"] [data-testid="projects-kyger-resume"] { margin-top: 30px; border-radius: 8px; }
@media (max-width: 1200px) {
 html[data-nebula-subscriber="kontagion"] [data-testid="projects-page"] [data-testid="project-library-controls"] { grid-template-columns: minmax(180px,1fr) 150px 160px; }
 html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] > div[role="group"] { grid-row: 2; grid-column: 1 / -1; justify-self: end; width: 240px; }
 .nebula-project-grid [data-project-featured="true"] .nebula-project-card { grid-template-columns: 1.15fr 1fr; }
 .nebula-project-grid [data-project-featured="true"] [data-project-frame] { min-height: 270px; }
}
@media (max-width: 900px) {
 .nebula-collection-tabs { display: none; }
 .nebula-collection-content { padding: 24px 22px 48px; }
 [data-nebula-collection][data-compact="true"][data-nav-open="true"] .nebula-collection-nav { width: 100%; }
 [data-compact="true"] .nebula-collection-nav a { width: 100%; flex-direction: row; justify-content: start; gap: 18px; padding: 16px 28px; min-height: 60px; }
 [data-nebula-collection][data-compact="true"][data-nav-open="true"] .nebula-collection-content { display: none; }
 .nebula-projects-heading h1 { font-size: 33px; }
 .nebula-projects-heading p { font-size: 15px; }
 .nebula-project-grid [data-project-featured="true"] .nebula-project-card { display: block; }
 .nebula-project-grid [data-project-featured="true"] [data-project-frame] { min-height: 0; aspect-ratio: 2; }
 .nebula-project-grid { gap: 18px; }
}
@media (max-width: 600px) {
 .nebula-collection-header .nebula-workspace-header-actions { gap: 5px; }
 .nebula-collection-content { padding: 20px 16px 40px; }
 .nebula-projects-heading { flex-wrap: wrap; gap: 12px; }
 .nebula-projects-heading > div:first-child > div { flex-basis: calc(100% - 70px); }
 .nebula-projects-heading [data-testid="project-create-actions"] { width: 100%; }
 .nebula-projects-heading [data-testid="project-create-actions"] a { width: 100%; }
 html[data-nebula-subscriber="kontagion"] [data-testid="projects-page"] [data-testid="project-library-controls"] { grid-template-columns: 1fr 1fr; gap: 10px; }
 html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] > label:has(input) { grid-column: 1 / -1; grid-row: 1; }
 html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] > label:has([data-testid="project-type-filter"]) { grid-column: 1; grid-row: 2; }
 html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] > label:has([data-testid="project-sort"]) { grid-column: 2; grid-row: 2; }
 html[data-nebula-subscriber="kontagion"] [data-testid="project-library-controls"] > div[role="group"] { grid-row: 3; grid-column: 1 / -1; width: 100%; }
 .nebula-project-grid { grid-template-columns: 1fr; }
}
/* The narrow shared lockup keeps the full slogan beside stage/account controls. */
@media (max-width: 600px) {
 .nebula-workspace-brand-row .nebula-brand strong { font-size:10px; letter-spacing:.12em; }
 .nebula-workspace-brand-row .nebula-brand > span { font-size:8.5px; letter-spacing:.06em; }
}
@media (prefers-reduced-motion: reduce) { .nebula-collection-nav { transition: none; } }

/* Compact headers keep the actual stage selector and account controls in
   separate columns. The stage name carries meaning; its ordinal does not. */
@media (max-width: 1099px) {
 html[data-nebula-subscriber="kontagion"] [data-testid="stage-switcher-compact"] > span { display:none; }
 html[data-nebula-subscriber="kontagion"] [data-testid="stage-switcher-compact"] { font-family:var(--nebula-font-sans); letter-spacing:.08em; padding-inline:10px; gap:6px; }
}
@media (max-width: 480px) {
 .nebula-collection-header:has(.nebula-collection-stages) { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:8px; }
 .nebula-collection-header .nebula-collection-stages { position:static; transform:none; justify-content:center; min-width:0; }
}
html[data-nebula-subscriber="kontagion"] [data-testid="mode-switcher"] [data-workspace-stage] { font-family: var(--nebula-font-sans); font-size: 12px; letter-spacing: .12em; font-weight: 400; background: transparent; border: 0; border-radius: 0; padding: 18px 12px; color: var(--nebula-muted); }
html[data-nebula-subscriber="kontagion"] [data-testid="mode-switcher"] [data-workspace-stage][aria-current="page"] { color: var(--nebula-gold); }
html[data-nebula-subscriber="kontagion"] [data-testid="mode-switcher"] [data-workspace-stage] > span { box-shadow: none; bottom: 6px; background:var(--nebula-gold); }
html[data-nebula-subscriber="kontagion"] [data-testid="mode-switcher"] > div > span[aria-hidden] { display: none; }

/* Gordon's treatment 5: five equal architectural bays. Keep the existing
   glass header; the selection belongs to one bay, not the whole header. */
html[data-nebula-subscriber="kontagion"] [data-testid="mode-switcher"] > [data-stage-segments] {
 width: 420px; max-width: 100%; gap: 0;
}
html[data-nebula-subscriber="kontagion"] [data-testid="mode-switcher"] [data-stage-segments] > [data-workspace-stage] {
 display: flex; flex: 0 0 20%; min-width: 0; min-height: 38px;
 align-items: center; justify-content: center;
 padding: 10px 8px; letter-spacing: .075em;
}
html[data-nebula-subscriber="kontagion"] [data-testid="mode-switcher"] [data-stage-segments] > [data-workspace-stage] ~ [data-workspace-stage] {
 border-left: 1px solid var(--nebula-border);
}
html[data-nebula-subscriber="kontagion"] [data-testid="mode-switcher"] [data-stage-segments] > [data-workspace-stage]:hover {
 color: var(--nebula-foreground); background: color-mix(in srgb, var(--nebula-foreground) 6%, transparent);
}
html[data-nebula-subscriber="kontagion"] [data-testid="mode-switcher"] [data-stage-segments] > [data-workspace-stage][aria-current="page"] {
 color: var(--nebula-foreground); background: color-mix(in srgb, var(--nebula-foreground) 14%, transparent);
 font-weight: 500;
}
html[data-nebula-subscriber="kontagion"] [data-testid="mode-switcher"] [data-stage-segments] > [data-workspace-stage] > span[aria-hidden] {
 display: none;
}
html[data-nebula-subscriber="kontagion"] [data-testid="stage-switcher-compact"] {
 border-radius: 2px; border-color: var(--nebula-border); background: var(--nebula-surface);
}

html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions [data-testid="k3-cmdk-trigger"] { width: 32px; height: 34px; border: 0; background: transparent; }
html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions [data-testid="k3-upgrade"] { width: 30px; height: 32px; background: transparent; border: 0; }
html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions [data-testid="k3-upgrade"] > svg { width: 15px; }
html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions [data-testid="k3-upgrade"]::after { display: none; }
/* The narrow header gives brand, stage and account controls their own space.
   Chat and Library remain in navigation; their desktop shortcuts do not compete
   with the stage selector on a phone. */
@media (max-width: 600px) {
 html[data-nebula-subscriber="kontagion"] .nebula-workspace-header > [data-testid="mode-switcher"] { position:static; transform:none; translate:none; }
 html[data-nebula-subscriber="kontagion"] .nebula-workspace-header .nebula-project-shortcuts { display:none; }
 html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions { justify-content:flex-end; gap:2px; min-width:0; }
 html[data-nebula-subscriber="kontagion"] .nebula-workspace-header .nebula-kyger-button { width:30px; padding:0; justify-content:center; }

 /* ── Compact header, two rows (2026-09-12, screen 23 "Compact writer") ──
  * Measured on the writer at 390px before this block: the grid resolved to
  * `276.906px 77.0938px 0px`, the actions cluster was 188px wide starting at
  * x=380, and ALL FIVE of its controls - search, upgrade, notifications, help
  * and the profile menu that carries sign-out - sat off the right edge, the
  * furthest at x=568. `documentElement.scrollWidth - clientWidth` was 0 and the
  * nearest ancestor carries `overflow-x: hidden`, so there was no scroll to
  * reach them and no way past the clip: laid out, hittable by nothing.
  *
  * Three clusters wanting 542px cannot share a 354px row, so squeezing was
  * never going to be the answer. Row one is the film and the actions; the
  * stage switcher drops to row two - the same move the shipped Review header
  * already makes at its own compact width (livingReview.css). Nothing is
  * dropped and nothing is shrunk below its hit target.
  * Arithmetic + the measured numbers: src/lib/k2/layout/compactWorkspaceHeader.ts */
 html[data-nebula-subscriber="kontagion"] .nebula-workspace-header {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  align-items:center;
  gap:6px 12px;
  /* The header's height arrives as an inline `height: var(--k3-bar-h)`, which
   * no rule can outrank - so redefine the variable HERE, on the element the
   * inline declaration resolves it against. Scoping it to this class is what
   * leaves the admin shell (same variable, no such class) at one row. */
  --k3-bar-h:90px;
  height:90px; min-height:90px;
  padding-block:6px;
 }
 html[data-nebula-subscriber="kontagion"] .nebula-workspace-header > .nebula-workspace-brand-row { grid-column:1; grid-row:1; min-width:0; }
 html[data-nebula-subscriber="kontagion"] .nebula-workspace-header > .nebula-workspace-header-actions { grid-column:2; grid-row:1; }
 html[data-nebula-subscriber="kontagion"] .nebula-workspace-header > [data-testid="mode-switcher"] { grid-column:1 / -1; grid-row:2; justify-self:center; }
 /* The film name is the one thing here that may truncate; it must not push the
  * actions off the row the way it used to. */
 html[data-nebula-subscriber="kontagion"] .nebula-workspace-film { min-width:0; }
 html[data-nebula-subscriber="kontagion"] .nebula-workspace-film [data-testid="project-picker-trigger"] { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 /* A control its own component hides stays hidden. The one-shape rule above
  * carries `display: inline-grid` and its selector outranks Tailwind's
  * `.hidden`, so the command-palette trigger - declared `hidden sm:flex` -
  * was laid out at 390px anyway (measured: display "grid", .hidden present),
  * spending 38px of a row that was already short. This block ends at 600 and
  * `sm:` begins at 640, so the two never argue over the same width. */
 html[data-nebula-subscriber="kontagion"] .nebula-workspace-header-actions :is(button, a, .nebula-help-hook).hidden { display:none; }
}
/* Modal material is governed by the shared glass contract below. */
html[data-nebula-subscriber="kontagion"] [data-k2-cohesion-surface="portal"][role="dialog"] {
  background: var(--nebula-surface) !important;
  border-color: var(--nebula-border) !important;
  color: var(--nebula-foreground);
  box-shadow: var(--nebula-shadow-dialog) !important;
  font-family: var(--nebula-font-sans);
}

/* A screen-owned report action replaces the floating fallback. */
html:is([data-nebula-subscriber="kontagion"],[data-nebula-subscriber="admin"]) body:has([data-testid="bug-report-button"][data-variant="inline"]) [data-testid="bug-report-button"][data-variant="floating"] { display:none; }

/* The poster maker keeps its generous controls and deterministic artwork;
   its surrounding interface subscribes to the same Nebula tokens. */
html[data-nebula-subscriber="kontagion"] .poster-maker {
  --pm-font:var(--nebula-font-sans);
  --pm-ink:var(--nebula-foreground);
  --pm-ink-soft:color-mix(in oklch,var(--nebula-foreground) 85%,var(--nebula-muted));
  --pm-line:var(--nebula-border);
  --pm-line-strong:var(--nebula-ring);
  --pm-surface:var(--nebula-surface);
  --pm-raised:var(--nebula-raised);
  --pm-canvas:var(--nebula-background);
  --pm-gold:var(--nebula-gold);
  --pm-t-film:400 26px/1.15 var(--pm-font);
  --pm-t-head:400 20px/1.25 var(--pm-font);
}

/* Approved confirmation concept 25: fixed 40% translucency (60% surface).
   Typed permanent actions and auth stay separate. */
html .nebula-confirm[data-k2-cohesion-surface="portal"] {
  display: block; width: min(520px, calc(100vw - 32px)); max-width: 520px;
  max-height: calc(100dvh - 32px); overflow-y: auto; padding: 30px;
  border: 1px solid var(--nebula-border); border-radius: 22px !important;
  background: var(--nebula-modal-background) !important;
  color: var(--nebula-foreground); font-family: var(--nebula-font-sans);
  backdrop-filter: blur(var(--nebula-modal-blur)); -webkit-backdrop-filter: blur(var(--nebula-modal-blur));
  box-shadow: var(--nebula-shadow-dialog) !important;
}
.nebula-confirm::before { content: ""; position: absolute; top: 0; left: 26px; right: 26px; height: 1px; background: var(--nebula-gold); }
.nebula-confirm .nebula-confirm__header { text-align: left; gap: 14px; }
.nebula-confirm .nebula-confirm__title { margin: 0; font-size: 25px; line-height: 1.25; font-weight: 300; letter-spacing: -.025em; color: var(--nebula-foreground); overflow-wrap: anywhere; }
.nebula-confirm .nebula-confirm__description { margin: 0; font-size: 14px; line-height: 1.6; color: var(--nebula-foreground); opacity: .8; overflow-wrap: anywhere; }
.nebula-confirm__subject { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--nebula-border); font-size: 14px; overflow-wrap: anywhere; }
.nebula-confirm__footer { margin: 26px -30px -30px; padding: 20px 30px; background: color-mix(in oklch, var(--nebula-raised) 35%, transparent); }
.nebula-confirm__recovery { font-size: 13px; line-height: 1.6; margin-bottom: 18px; color: var(--nebula-foreground); opacity: .8; }
.nebula-confirm .nebula-confirm__actions { display: flex; flex-direction: row; justify-content: flex-end; gap: 10px; }
.nebula-confirm .nebula-confirm__actions button { min-height: 44px; margin: 0; padding: 10px 18px; border-radius: 6px; font-size: 14px; font-weight: 400; box-shadow: none; white-space: normal; text-transform: none; letter-spacing: normal; }
.nebula-confirm .nebula-confirm__cancel { border: 1px solid var(--nebula-border); background: transparent; color: var(--nebula-foreground); }
.nebula-confirm .nebula-confirm__primary { border: 1px solid var(--nebula-gold); background: var(--nebula-gold); color: var(--nebula-background); }
.nebula-confirm .nebula-confirm__actions button:hover:not(:disabled) { filter: brightness(1.12); }
.nebula-confirm .nebula-confirm__actions button:disabled { opacity: .5; cursor: wait; }
.nebula-confirm :is(button,input):focus-visible { outline: 2px solid var(--nebula-gold); outline-offset: 3px; }
.nebula-confirm__opt-out { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; font-size: 13px; }
.nebula-confirm__opt-out input { accent-color: var(--nebula-gold); }
@media (max-width: 600px) {
  html .nebula-confirm[data-k2-cohesion-surface="portal"] { padding: 24px 20px; }
  .nebula-confirm__footer { margin: 24px -20px -24px; padding: 20px; }
  .nebula-confirm .nebula-confirm__actions button { flex: 1; padding-inline: 12px; }
}
@media (prefers-reduced-transparency: reduce) {
  html .nebula-confirm[data-k2-cohesion-surface="portal"] { background: var(--nebula-surface) !important; backdrop-filter: none; -webkit-backdrop-filter: none; }
}
html[data-nebula-reduce-transparency="true"] .nebula-confirm[data-k2-cohesion-surface="portal"] {
  background: var(--nebula-surface) !important; backdrop-filter: none; -webkit-backdrop-filter: none;
}

/* Canonical intake stays with the film, leaving profile and utility controls
 * in their established right-hand lane. Only the title may shrink. */
.nebula-workspace-add {
  display:inline-flex; align-items:center; justify-content:center; gap:5px;
  flex:none; min-height:36px; padding:0 10px; white-space:nowrap;
  border:1px solid color-mix(in oklch, var(--nebula-gold) 48%, var(--nebula-border)); border-radius:6px;
  background:color-mix(in oklch, var(--nebula-gold) 8%, transparent); color:var(--nebula-gold);
  font:500 13px/1 var(--nebula-font-sans); cursor:pointer;
}
.nebula-workspace-add:hover {
  background:color-mix(in oklch, var(--nebula-gold) 14%, transparent);
  border-color:var(--nebula-gold);
}
.nebula-workspace-add:focus-visible { outline:2px solid var(--nebula-gold); outline-offset:2px; }
.nebula-workspace-header--with-add .nebula-workspace-brand-row { gap:12px; }
.nebula-workspace-header--with-add .nebula-workspace-film { flex:0 1 auto; overflow:hidden; }
.nebula-workspace-header--with-add .nebula-workspace-film [data-testid="project-picker-trigger"] {
  max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
/* Keep Add beside the project picker; spare header space must not move it. */
.nebula-workspace-add-slot { display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
/* Preserve the film's name before decorative brand copy consumes its lane.
 * The centered stage navigation and the account lane retain their geometry. */
@media (max-width:1600px) {
  .nebula-workspace-header--with-add .nebula-workspace-brand-row .nebula-brand > span { display:none; }
}
@media (max-width:1280px) {
  .nebula-workspace-header--with-add .nebula-workspace-brand-row .nebula-brand { display:none; }
}
@media (max-width:600px) {
  html[data-nebula-subscriber="kontagion"] .nebula-workspace-header--with-add .nebula-workspace-brand-row { gap:6px; }
  html[data-nebula-subscriber="kontagion"] .nebula-workspace-header--with-add .nebula-workspace-brand-row .nebula-brand { display:none; }
  html[data-nebula-subscriber="kontagion"] .nebula-workspace-header--with-add .nebula-workspace-film { padding-left:0; border-left:0; }
  .nebula-workspace-add { padding-inline:8px; }
}

/* September 21: all modal dialogs share the approved confirmation glass.
   Material only: individual dialogs retain geometry, controls and focus behavior.
   Modeless tool panels and menus are not modal surfaces. */
html[data-nebula-subscriber] :is(
  [data-nebula-modal-surface],
  [aria-modal="true"]:not([data-nebula-modal-overlay]), dialog:modal
) {
  background: var(--nebula-modal-background) !important;
  backdrop-filter: blur(var(--nebula-modal-blur)) !important;
  -webkit-backdrop-filter: blur(var(--nebula-modal-blur)) !important;
  border-color: var(--nebula-border) !important;
  box-shadow: var(--nebula-shadow-dialog) !important;
}
html[data-nebula-subscriber] [data-nebula-modal-overlay]:not([data-nebula-modal-overlay="container"]),
html[data-nebula-subscriber] dialog::backdrop {
  background: var(--nebula-modal-scrim) !important;
  backdrop-filter: blur(var(--nebula-modal-scrim-blur)) !important;
  -webkit-backdrop-filter: blur(var(--nebula-modal-scrim-blur)) !important;
}
@media (prefers-reduced-transparency: reduce) {
  html[data-nebula-subscriber] {
    --nebula-modal-background: var(--nebula-surface);
    --nebula-modal-blur: 0px;
    --nebula-modal-scrim-blur: 0px;
  }
}
html[data-nebula-subscriber][data-nebula-reduce-transparency="true"] {
  --nebula-modal-background: var(--nebula-surface);
  --nebula-modal-blur: 0px;
  --nebula-modal-scrim-blur: 0px;
}
