/*
  Edit Bay pipeline tool treatment.
  Additive styling for FrameDNA, CinePrompt, Consistency Keeper, Script to Shots,
  and CineBible. This preserves tool scripts, local storage, IndexedDB, counters,
  and handoff links.
*/

body.eb-pipeline-page {
  --eb-display: Cinzel, Georgia, serif;
  --eb-gold: #d7a945;
  --eb-copper: #ff6b35;
  --eb-cyan: #39f5d4;
  --eb-pink: #ff4fa0;
  background:
    radial-gradient(ellipse 48% 28% at 82% 12%, rgba(57,245,212,.09), transparent 68%),
    radial-gradient(ellipse 42% 28% at 16% 10%, rgba(215,169,69,.12), transparent 68%),
    linear-gradient(180deg, #010204, #06080c 48%, #010204) !important;
}

body.eb-pipeline-page::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.024) 0 1px, transparent 1px 58px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.016) 0 1px, transparent 1px 58px);
  opacity: .5;
}

body.eb-pipeline-page header,
body.eb-pipeline-page nav,
body.eb-pipeline-page .topbar {
  background: linear-gradient(180deg, rgba(1,2,4,.92), rgba(1,2,4,.68)) !important;
  border-bottom: 1px solid rgba(215,169,69,.16) !important;
  box-shadow: 0 18px 54px rgba(0,0,0,.32);
}

body.eb-pipeline-page main,
body.eb-pipeline-page .main,
body.eb-pipeline-page .hero,
body.eb-pipeline-page footer,
body.eb-pipeline-page .vault-pane,
body.eb-pipeline-page .form-pane {
  position: relative;
  z-index: 2;
}

body.eb-pipeline-page .hero {
  background:
    radial-gradient(ellipse 52% 38% at 50% 28%, rgba(255,107,53,.08), transparent 70%),
    linear-gradient(180deg, rgba(1,2,4,.18), rgba(1,2,4,.08)) !important;
}

body.eb-pipeline-page h1,
body.eb-pipeline-page .hero h1,
body.eb-pipeline-page .brand-title {
  font-family: var(--eb-display) !important;
  font-weight: 600 !important;
  letter-spacing: .035em !important;
  text-transform: none !important;
  color: #fff4e3 !important;
  text-shadow: 0 22px 70px rgba(0,0,0,.55);
}

body.eb-pipeline-page h1 span,
body.eb-pipeline-page h1 .ac,
body.eb-pipeline-page h1 .accent,
body.eb-pipeline-page .brand span,
body.eb-pipeline-page .current,
body.eb-pipeline-page .accent,
body.eb-pipeline-page .gradient-text {
  color: var(--eb-copper) !important;
}

body.eb-pipeline-page .section-label,
body.eb-pipeline-page .eyebrow,
body.eb-pipeline-page .hero-label,
body.eb-pipeline-page .ver-badge,
body.eb-pipeline-page .tbadge {
  font-family: "DM Mono", monospace !important;
  letter-spacing: .16em !important;
}

body.eb-pipeline-page .card,
body.eb-pipeline-page .luxury-card,
body.eb-pipeline-page .panel,
body.eb-pipeline-page .mode-panel,
body.eb-pipeline-page .input-card,
body.eb-pipeline-page .output-card,
body.eb-pipeline-page .platform-card,
body.eb-pipeline-page .ref-card,
body.eb-pipeline-page .shot-card,
body.eb-pipeline-page .recipe-card,
body.eb-pipeline-page .project-card,
body.eb-pipeline-page .step-card,
body.eb-pipeline-page .controls,
body.eb-pipeline-page .toolbar,
body.eb-pipeline-page .tabbar,
body.eb-pipeline-page .sidebar {
  border-color: rgba(255,255,255,.12) !important;
  border-radius: 16px !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.024) 44%, rgba(255,255,255,.052)),
    radial-gradient(circle at 12% 0%, rgba(215,169,69,.11), transparent 38%),
    rgba(10, 12, 14, .78) !important;
  box-shadow: 0 22px 64px rgba(0,0,0,.38), inset 0 1px rgba(255,255,255,.07) !important;
}

body.eb-pipeline-page input,
body.eb-pipeline-page textarea,
body.eb-pipeline-page select {
  border-color: rgba(255,255,255,.12) !important;
  background: rgba(1,2,4,.52) !important;
  border-radius: 10px !important;
}

body.eb-pipeline-page button,
body.eb-pipeline-page .btn,
body.eb-pipeline-page .btn-primary,
body.eb-pipeline-page .action-btn,
body.eb-pipeline-page .btn-cp {
  border-radius: 999px !important;
}

body.eb-pipeline-page footer {
  border-top: 1px solid rgba(215,169,69,.16) !important;
  background:
    linear-gradient(180deg, rgba(1,2,4,.4), rgba(1,2,4,.88)),
    radial-gradient(ellipse 42% 80% at 18% 0%, rgba(215,169,69,.08), transparent 72%) !important;
}

body.eb-pipeline-page footer span[style*="background:#0d1929"],
body.eb-pipeline-page footer span[style*="background: #0d1929"] {
  border: 1px solid rgba(215,169,69,.28) !important;
  border-right: 0 !important;
  border-radius: 999px 0 0 999px !important;
  background: rgba(0,0,0,.38) !important;
  color: #b9aa91 !important;
  padding: 6px 11px !important;
  font-family: "DM Mono", monospace !important;
  letter-spacing: .13em;
  text-transform: uppercase;
}

body.eb-pipeline-page #dvp-view-count {
  border: 1px solid rgba(215,169,69,.28) !important;
  border-left: 0 !important;
  border-radius: 0 999px 999px 0 !important;
  background: rgba(0,0,0,.38) !important;
  color: #fff4e3 !important;
  padding: 6px 11px !important;
  font-family: var(--eb-display) !important;
}

@media (max-width: 720px) {
  body.eb-pipeline-page {
    overflow-x: hidden;
  }

  body.eb-pipeline-page h1,
  body.eb-pipeline-page .hero h1 {
    font-size: clamp(2.55rem, 13vw, 4.4rem) !important;
    line-height: 1.02 !important;
    overflow-wrap: anywhere;
  }

  body.eb-pipeline-page .card,
  body.eb-pipeline-page .luxury-card,
  body.eb-pipeline-page .panel,
  body.eb-pipeline-page .mode-panel,
  body.eb-pipeline-page .input-card,
  body.eb-pipeline-page .output-card,
  body.eb-pipeline-page .platform-card,
  body.eb-pipeline-page .ref-card,
  body.eb-pipeline-page .shot-card,
  body.eb-pipeline-page .recipe-card,
  body.eb-pipeline-page .project-card,
  body.eb-pipeline-page .step-card,
  body.eb-pipeline-page .controls,
  body.eb-pipeline-page .toolbar,
  body.eb-pipeline-page .tabbar,
  body.eb-pipeline-page .sidebar {
    border-radius: 14px !important;
  }

  body.eb-pipeline-page .toolbar,
  body.eb-pipeline-page .tabbar,
  body.eb-pipeline-page .actions,
  body.eb-pipeline-page .button-row {
    flex-wrap: wrap;
  }

  body.eb-pipeline-page .header-inner {
    max-width: 100%;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start !important;
    gap: 10px !important;
  }

  body.eb-pipeline-page .header-inner > div:last-child,
  body.eb-pipeline-page .nav-tools {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 2px;
    scrollbar-width: none;
  }

  body.eb-pipeline-page .header-inner > div:last-child::-webkit-scrollbar,
  body.eb-pipeline-page .nav-tools::-webkit-scrollbar {
    display: none;
  }

  body.eb-pipeline-page.eb-cineprompt-page nav {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
    overflow: hidden !important;
  }

  body.eb-pipeline-page.eb-cineprompt-page nav > div:last-child {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    padding-bottom: 2px;
    scrollbar-width: none;
  }

  body.eb-pipeline-page.eb-cineprompt-page nav > div:last-child::-webkit-scrollbar {
    display: none;
  }

  body.eb-pipeline-page .refcard-overlay {
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }

  body.eb-pipeline-page .refcard-modal {
    width: calc(100vw - 32px) !important;
    max-width: 720px !important;
  }

  body.eb-pipeline-page button,
  body.eb-pipeline-page .btn,
  body.eb-pipeline-page .btn-primary,
  body.eb-pipeline-page .action-btn,
  body.eb-pipeline-page .btn-cp {
    max-width: 100%;
    white-space: normal;
  }
}
