:root {
  --starlight-font-scale: 1;
  --starlight-ui-scale: 1;
}

html {
  scroll-behavior: smooth;
  font-size: calc(16px * var(--starlight-font-scale));
}

#learn-more {
  scroll-margin-top: 1.5rem;
}

body {
  overflow-x: hidden;
  min-height: 100vh;
  background:
    radial-gradient(
      circle at top left,
      rgba(0, 156, 255, 0.18),
      transparent 24%
    ),
    radial-gradient(
      circle at top right,
      rgba(96, 165, 250, 0.18),
      transparent 22%
    ),
    linear-gradient(180deg, #0b1220 0%, #111827 100%);
  color: #f8fafc;
}

body::before {
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  content: "";
  background:
    radial-gradient(
      circle at 8% 18%,
      rgba(255, 255, 255, 0.35) 0 1px,
      transparent 1.4px
    ),
    radial-gradient(
      circle at 74% 12%,
      rgba(125, 211, 252, 0.28) 0 1px,
      transparent 1.4px
    ),
    radial-gradient(
      circle at 88% 64%,
      rgba(94, 234, 212, 0.22) 0 1px,
      transparent 1.4px
    ),
    radial-gradient(
      circle at 28% 82%,
      rgba(255, 255, 255, 0.24) 0 1px,
      transparent 1.4px
    );
  background-size: 420px 360px;
  opacity: 0.58;
}

body,
.navbar,
.footer {
  font-family:
    Inter,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
}

.bg-glassy {
  background: rgba(15, 23, 42, 0.95) !important;
  backdrop-filter: blur(10px);
}

.app-footer {
  padding: 2rem 0 1.5rem;
  color: rgba(248, 250, 252, 0.58);
  font-size: 0.85rem;
  text-align: center;
}

body.index-page .cta-band {
  margin-bottom: 0 !important;
  padding-bottom: 0;
}

body.index-page .landing-footer {
  margin-top: clamp(3rem, 6vw, 5rem);
  background: transparent;
}

body.index-page .landing-footer a {
  color: rgba(186, 230, 253, 0.78);
  text-decoration-color: rgba(125, 211, 252, 0.36);
  text-underline-offset: 0.18em;
}

body.index-page .landing-footer a:hover,
body.index-page .landing-footer a:focus-visible {
  color: #e0f2fe;
}

body.partner-page-body main.container.pt-5 {
  padding-top: 0 !important;
}

.terms-page {
  display: grid;
  gap: 1rem;
  max-width: 920px;
  margin: 0 auto;
}

.terms-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(2rem, 5vw, 3.5rem);
  color: #f8fafc;
  background:
    linear-gradient(135deg, rgba(2, 6, 23, 0.96), rgba(8, 47, 73, 0.82)),
    linear-gradient(90deg, rgba(125, 211, 252, 0.09) 1px, transparent 1px),
    linear-gradient(0deg, rgba(94, 234, 212, 0.07) 1px, transparent 1px);
  background-size: auto, 46px 46px, 46px 46px;
  border: 1px solid rgba(125, 211, 252, 0.24);
  border-radius: 0.8rem;
  box-shadow: 0 28px 76px rgba(2, 6, 23, 0.32);
}

.terms-hero::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    radial-gradient(circle at 18% 22%, rgba(103, 232, 249, 0.24), transparent 26%),
    radial-gradient(circle at 84% 20%, rgba(94, 234, 212, 0.18), transparent 28%);
}

.terms-hero > * {
  position: relative;
  z-index: 1;
}

.terms-kicker,
.terms-version {
  display: inline-flex;
  align-items: center;
  color: #bae6fd;
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.terms-hero h1 {
  max-width: 760px;
  margin: 0.65rem 0 1rem;
  color: #ffffff;
  font-size: clamp(2.2rem, 5vw, 4rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0;
}

.terms-hero p {
  max-width: 760px;
  margin-bottom: 1rem;
  color: rgba(224, 242, 254, 0.78);
  font-size: 1.05rem;
}

.terms-body {
  display: grid;
  gap: 1rem;
}

.terms-section {
  padding: clamp(1.25rem, 3vw, 1.75rem);
  color: #0f172a;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 0.7rem;
  box-shadow: 0 18px 45px rgba(2, 6, 23, 0.12);
}

.terms-section h2 {
  margin-bottom: 0.8rem;
  color: #0f172a;
  font-size: 1.15rem;
  font-weight: 850;
  letter-spacing: 0;
}

.terms-section p {
  color: #334155;
  line-height: 1.7;
}

.terms-section p:last-child {
  margin-bottom: 0;
}

html[data-theme="dark"] .terms-section {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.84), rgba(8, 47, 73, 0.48)),
    radial-gradient(circle at 92% 0%, rgba(125, 211, 252, 0.12), transparent 28%);
  border-color: rgba(125, 211, 252, 0.22);
  box-shadow: 0 18px 46px rgba(2, 6, 23, 0.16);
}

html[data-theme="dark"] .terms-section h2 {
  color: #ffffff;
}

html[data-theme="dark"] .terms-section p {
  color: rgba(224, 242, 254, 0.76);
}

.invite-consent-panel a {
  color: #bae6fd;
  font-weight: 800;
}

.hero-section {
  padding-top: 4.5rem;
  padding-bottom: 4.5rem;
}

.landing-hero {
  position: relative;
  min-height: calc(100vh - 5.2rem);
  min-height: calc(100svh - 5.2rem);
  padding: clamp(4rem, 8vw, 8rem) 0 clamp(3rem, 6vw, 5rem);
  isolation: isolate;
}

body.index-page .landing-hero > .row > .col-lg-8,
body.index-page .landing-band > .section-heading,
body.index-page .workflow-band .kyc-roadmap,
body.index-page .coverage-copy,
body.index-page .coverage-panel,
body.index-page .epic-medical-header,
body.index-page .epic-medical-grid,
body.index-page .tutorial-copy,
body.index-page .tutorial-video,
body.index-page .cta-content {
  opacity: 0;
  transform: translateY(1.5rem);
  transition:
    opacity 0.75s ease-out,
    transform 0.75s ease-out;
}

body.index-page .landing-hero.scroll-animate > .row > .col-lg-8,
body.index-page .landing-band.scroll-animate > .section-heading,
body.index-page .workflow-band.scroll-animate .kyc-roadmap,
body.index-page .coverage-band.scroll-animate .coverage-copy,
body.index-page .coverage-band.scroll-animate .coverage-panel,
body.index-page .epic-medical-band.scroll-animate .epic-medical-header,
body.index-page .epic-medical-band.scroll-animate .epic-medical-grid,
body.index-page .tutorial-band.scroll-animate .tutorial-copy,
body.index-page .tutorial-band.scroll-animate .tutorial-video,
body.index-page .cta-band.scroll-animate .cta-content {
  opacity: 1;
  transform: translateY(0);
}

body.index-page .landing-band.scroll-animate > .section-heading,
body.index-page .coverage-band.scroll-animate .coverage-panel,
body.index-page .epic-medical-band.scroll-animate .epic-medical-grid,
body.index-page .tutorial-band.scroll-animate .tutorial-video {
  transition-delay: 0.1s;
}

@media (prefers-reduced-motion: reduce) {
  body.index-page .landing-hero > .row > .col-lg-8,
  body.index-page .hero-metrics,
  body.index-page .landing-band > .section-heading,
  body.index-page .workflow-band .kyc-roadmap,
  body.index-page .feature-card,
  body.index-page .kyc-roadmap-step,
  body.index-page .coverage-copy,
  body.index-page .coverage-panel,
  body.index-page .epic-medical-header,
  body.index-page .epic-medical-grid,
  body.index-page .tutorial-copy,
  body.index-page .tutorial-video,
  body.index-page .cta-content {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .workflow-nightscape::before,
  .workflow-starfield,
  .workflow-shooting-star {
    animation: none;
  }

  .workflow-shooting-star {
    opacity: 0.34;
  }

  .landing-hero-backdrop::before,
  .landing-hero-backdrop::after {
    animation: none;
  }
}

html[data-index-animation-quality="low"] body.index-page .landing-hero-backdrop::before,
html[data-index-animation-quality="reduced"] body.index-page .landing-hero-backdrop::before {
  opacity: 0.48;
  filter: blur(8px) saturate(110%);
  animation: none;
}

html[data-index-animation-quality="low"] body.index-page .landing-hero-backdrop::after,
html[data-index-animation-quality="reduced"] body.index-page .landing-hero-backdrop::after {
  animation: none;
}

html[data-index-animation-quality="low"] body.index-page .hero-metrics div,
html[data-index-animation-quality="low"] body.index-page .hero-metrics div::after,
html[data-index-animation-quality="reduced"] body.index-page .hero-metrics div,
html[data-index-animation-quality="reduced"] body.index-page .hero-metrics div::after {
  animation: none;
}

html[data-index-animation-quality="low"] body.index-page .hero-metrics div,
html[data-index-animation-quality="reduced"] body.index-page .hero-metrics div,
html[data-index-animation-quality="low"] body.index-page .feature-card,
html[data-index-animation-quality="reduced"] body.index-page .feature-card,
html[data-index-animation-quality="low"] body.index-page .kyc-roadmap,
html[data-index-animation-quality="reduced"] body.index-page .kyc-roadmap,
html[data-index-animation-quality="low"] body.index-page .kyc-roadmap-step,
html[data-index-animation-quality="reduced"] body.index-page .kyc-roadmap-step {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

html[data-index-animation-quality="low"] body.index-page .workflow-nightscape::before,
html[data-index-animation-quality="low"] body.index-page .workflow-starfield,
html[data-index-animation-quality="low"] body.index-page .workflow-shooting-star,
html[data-index-animation-quality="reduced"] body.index-page .workflow-nightscape::before,
html[data-index-animation-quality="reduced"] body.index-page .workflow-starfield,
html[data-index-animation-quality="reduced"] body.index-page .workflow-shooting-star {
  animation: none;
}

html[data-index-animation-quality="low"] body.index-page .workflow-starfield,
html[data-index-animation-quality="reduced"] body.index-page .workflow-starfield {
  opacity: 0.28;
}

html[data-index-animation-quality="low"] body.index-page .workflow-shooting-star,
html[data-index-animation-quality="reduced"] body.index-page .workflow-shooting-star {
  display: none;
}

html[data-index-animation-quality="low"] body.index-page .workflow-mountains::before,
html[data-index-animation-quality="reduced"] body.index-page .workflow-mountains::before {
  filter: none;
  opacity: 0.36;
}

.landing-hero-backdrop {
  position: absolute;
  inset: -5rem calc(50% - 50vw) 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(
      ellipse at 16% 28%,
      rgba(125, 211, 252, 0.12),
      transparent 36%
    ),
    linear-gradient(135deg, #05151d 0%, #0a1930 42%, #060618 70%, #030711 100%);
  background-position: center;
  background-size: cover;
}

.landing-hero-sky {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0.96;
}

.landing-hero-backdrop::before,
.landing-hero-backdrop::after {
  position: absolute;
  content: "";
  pointer-events: none;
}

.landing-hero-backdrop::before {
  inset: -20% -10% 10%;
  z-index: 1;
  background:
    radial-gradient(
      ellipse at 18% 34%,
      rgba(125, 211, 252, 0.12),
      transparent 34%
    ),
    conic-gradient(
      from 222deg at 50% 38%,
      transparent 0deg,
      rgba(56, 189, 248, 0.045) 42deg,
      rgba(125, 211, 252, 0.06) 86deg,
      rgba(56, 189, 248, 0.04) 122deg,
      transparent 168deg,
      transparent 360deg
    );
  filter: blur(16px) saturate(125%);
  mix-blend-mode: screen;
  transform-origin: 50% 38%;
  animation: hero-aurora-drift 36s ease-in-out infinite alternate;
}

.landing-hero-backdrop::after {
  inset: 0;
  z-index: 3;
  background:
    linear-gradient(
      180deg,
      rgba(3, 6, 12, 0.16) 0%,
      transparent 34%,
      rgba(3, 7, 18, 0.62) 78%,
      #00040a 100%
    ),
    radial-gradient(
      ellipse at 50% 88%,
      rgba(56, 189, 248, 0.055),
      transparent 45%
    ),
    linear-gradient(
      90deg,
      rgba(3, 6, 12, 0.58),
      transparent 28%,
      transparent 72%,
      rgba(3, 6, 12, 0.62)
    );
  animation: hero-horizon-breathe 24s ease-in-out infinite alternate;
}

@keyframes hero-aurora-drift {
  0% {
    opacity: 0.54;
    transform: translate3d(-1.5%, -1%, 0) rotate(-1deg) scale(1.02);
  }

  48% {
    opacity: 0.68;
    transform: translate3d(1.5%, 1%, 0) rotate(1.2deg) scale(1.07);
  }

  100% {
    opacity: 0.58;
    transform: translate3d(0.5%, -0.5%, 0) rotate(-0.4deg) scale(1.04);
  }
}

@keyframes hero-horizon-breathe {
  0% {
    opacity: 0.82;
  }

  100% {
    opacity: 1;
  }
}

@keyframes workflow-stars-twinkle {
  0% {
    opacity: 0.42;
    transform: translate3d(0, 0, 0) scale(1);
  }

  48% {
    opacity: 0.84;
  }

  100% {
    opacity: 0.58;
    transform: translate3d(-10px, 7px, 0) scale(1.01);
  }
}

@keyframes workflow-starfield-drift {
  from {
    background-position:
      24px 38px,
      160px 82px,
      92px 156px;
  }

  to {
    background-position:
      214px 208px,
      420px 312px,
      412px 416px;
  }
}

@keyframes workflow-shooting-star {
  0%,
  58% {
    opacity: 0;
    transform: translate3d(0, 0, 0) rotate(-18deg);
  }

  64% {
    opacity: 0.92;
  }

  74% {
    opacity: 0;
    transform: translate3d(-118vw, 38vh, 0) rotate(-18deg);
  }

  100% {
    opacity: 0;
    transform: translate3d(-118vw, 38vh, 0) rotate(-18deg);
  }
}

@keyframes fade-in-up {
  from {
    opacity: 0;
    transform: translateY(2rem);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.eyebrow {
  display: inline-flex;
  margin-bottom: 1rem;
  color: #7dd3fc;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.landing-lead {
  max-width: 760px;
  color: rgba(248, 250, 252, 0.82);
  font-size: clamp(1.15rem, 2vw, 1.35rem);
  font-weight: 300;
  line-height: 1.65;
}

.hero-actions {
  align-items: stretch;
  margin-top: 0.35rem;
}

.landing-hero .hero-actions .btn {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 10.4rem;
  min-height: 3.35rem;
  padding: 0.86rem 1.5rem;
  overflow: hidden;
  font-weight: 850;
  line-height: 1;
  letter-spacing: 0;
  border-radius: 0.62rem !important;
}

.landing-hero .hero-actions .btn::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  content: "";
  background: linear-gradient(
    110deg,
    transparent 0%,
    rgba(255, 255, 255, 0.34) 42%,
    transparent 68%
  );
  opacity: 0;
  transform: translateX(-130%);
  transition:
    opacity 0.2s ease,
    transform 0.46s ease;
}

.landing-hero .hero-actions .btn:hover::after,
.landing-hero .hero-actions .btn:focus-visible::after {
  opacity: 0.9;
  transform: translateX(130%);
}

.landing-hero .hero-actions .hero-cta-primary {
  color: #031525;
  background:
    linear-gradient(135deg, #e0f2fe 0%, #67e8f9 42%, #2dd4bf 100%),
    #67e8f9;
  border: 1px solid rgba(224, 242, 254, 0.76);
  box-shadow:
    0 18px 42px rgba(45, 212, 191, 0.24),
    0 0 26px rgba(103, 232, 249, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.68);
}

.landing-hero .hero-actions .hero-cta-primary:hover,
.landing-hero .hero-actions .hero-cta-primary:focus {
  color: #020617;
  background:
    linear-gradient(135deg, #f0f9ff 0%, #7dd3fc 40%, #5eead4 100%),
    #7dd3fc;
  box-shadow:
    0 22px 50px rgba(45, 212, 191, 0.3),
    0 0 34px rgba(103, 232, 249, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.landing-hero .hero-actions .btn-outline-light {
  color: #e0f2fe;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.54), rgba(8, 47, 73, 0.42)),
    rgba(2, 6, 23, 0.34);
  border: 1px solid rgba(186, 230, 253, 0.52);
  box-shadow:
    0 16px 36px rgba(2, 6, 23, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

.landing-hero .hero-actions .btn-outline-light:hover,
.landing-hero .hero-actions .btn-outline-light:focus {
  color: #ffffff;
  background:
    linear-gradient(135deg, rgba(8, 47, 73, 0.68), rgba(14, 116, 144, 0.42)),
    rgba(15, 23, 42, 0.5);
  border-color: rgba(224, 242, 254, 0.78);
  box-shadow:
    0 20px 44px rgba(2, 6, 23, 0.38),
    0 0 26px rgba(125, 211, 252, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.hero-metrics {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.45rem, 3vw, 1.9rem);
  width: min(100%, 32rem);
  margin-left: auto;
  padding: 0.25rem 0 0.25rem 1rem;
  overflow: visible;
  opacity: 0;
  transform: translateY(1.5rem);
  transition:
    opacity 0.8s ease-out 0.15s,
    transform 0.8s ease-out 0.15s;
}

.landing-hero.scroll-animate .hero-metrics {
  opacity: 1;
  transform: translateY(0);
}

.hero-metrics div {
  position: relative;
  z-index: 1;
  isolation: isolate;
  display: grid;
  grid-template-columns: 2.7rem minmax(0, 1fr);
  gap: 0.25rem 0.9rem;
  align-items: start;
  min-height: 0;
  padding: 1rem 1.1rem 1.05rem 1rem;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(103, 232, 249, 0.16), transparent 38%),
    linear-gradient(145deg, rgba(15, 23, 42, 0.9), rgba(8, 47, 73, 0.82) 56%, rgba(2, 6, 23, 0.92));
  border: 1px solid rgba(103, 232, 249, 0.26);
  border-left: 3px solid #67e8f9;
  border-radius: 0.5rem;
  box-shadow:
    0 18px 44px rgba(2, 6, 23, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  animation: hero-metric-idle 7s ease-in-out infinite;
  animation-play-state: paused;
}

.hero-metrics div::before,
.hero-metrics div::after {
  position: absolute;
  z-index: 0;
  pointer-events: none;
}

.hero-metrics div::before {
  top: 0.8rem;
  right: 0.95rem;
  color: rgba(186, 230, 253, 0.42);
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1;
  content: "01";
}

.hero-metrics div::after {
  inset: 0;
  content: "";
  background:
    linear-gradient(110deg, transparent 0%, rgba(186, 230, 253, 0.14) 42%, transparent 68%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 36%),
    linear-gradient(90deg, rgba(125, 211, 252, 0.13), transparent 30%);
  background-position:
    130% 0,
    0 0,
    0 0;
  background-size:
    220% 100%,
    100% 100%,
    100% 100%;
  opacity: 0;
  animation: hero-metric-sheen 8.5s ease-in-out infinite;
  animation-play-state: paused;
}

.landing-hero.scroll-animate .hero-metrics div,
.landing-hero.scroll-animate .hero-metrics div::after {
  animation-play-state: running;
}

.hero-metrics div:nth-child(2) {
  border-color: rgba(56, 189, 248, 0.28);
  border-left-color: #38bdf8;
  background:
    linear-gradient(90deg, rgba(56, 189, 248, 0.18), transparent 38%),
    linear-gradient(145deg, rgba(15, 23, 42, 0.9), rgba(12, 74, 110, 0.8) 56%, rgba(2, 6, 23, 0.92));
}

.hero-metrics div:nth-child(2)::before {
  content: "02";
}

.hero-metrics div:nth-child(2),
.hero-metrics div:nth-child(2)::after {
  animation-delay: 1.15s;
}

.hero-metrics div:nth-child(3) {
  border-color: rgba(14, 165, 233, 0.3);
  border-left-color: #0ea5e9;
  background:
    linear-gradient(90deg, rgba(14, 165, 233, 0.18), transparent 38%),
    linear-gradient(145deg, rgba(15, 23, 42, 0.9), rgba(8, 82, 120, 0.78) 56%, rgba(2, 6, 23, 0.92));
}

.hero-metrics div:nth-child(3)::before {
  content: "03";
}

.hero-metrics div:nth-child(3),
.hero-metrics div:nth-child(3)::after {
  animation-delay: 2.25s;
}

@keyframes hero-metric-idle {
  0%,
  100% {
    box-shadow:
      0 18px 44px rgba(2, 6, 23, 0.34),
      0 0 0 rgba(56, 189, 248, 0),
      inset 0 1px 0 rgba(255, 255, 255, 0.08);
  }

  50% {
    box-shadow:
      0 22px 52px rgba(2, 6, 23, 0.42),
      0 0 30px rgba(56, 189, 248, 0.16),
      inset 0 1px 0 rgba(255, 255, 255, 0.13);
  }
}

@keyframes hero-metric-sheen {
  0%,
  28% {
    background-position:
      130% 0,
      0 0,
      0 0;
    opacity: 0;
  }

  48% {
    background-position:
      18% 0,
      0 0,
      0 0;
    opacity: 0.86;
  }

  68% {
    background-position:
      -90% 0,
      0 0,
      0 0;
    opacity: 0;
  }

  100% {
    background-position:
      130% 0,
      0 0,
      0 0;
    opacity: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-metrics div,
  .hero-metrics div::after {
    animation: none;
  }
}

.hero-metric-icon {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.45rem;
  height: 2.45rem;
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(125, 211, 252, 0.22), rgba(94, 234, 212, 0.12)),
    rgba(2, 6, 23, 0.54);
  border: 1px solid rgba(186, 230, 253, 0.28);
  border-radius: 0.5rem;
  box-shadow:
    0 12px 28px rgba(2, 6, 23, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.hero-metric-icon svg {
  width: 1.25rem;
  height: 1.25rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.9;
}

.hero-metrics strong,
.hero-metrics span {
  position: relative;
  z-index: 2;
  display: block;
}

.hero-metrics .hero-metric-icon {
  display: inline-flex;
  grid-row: 1 / span 2;
}

.hero-metrics div > strong {
  grid-column: 2;
  align-self: end;
  padding-right: 2rem;
}

.hero-metrics div > span:not(.hero-metric-icon) {
  grid-column: 2;
  margin-top: 0.15rem !important;
}

.hero-metrics strong {
  margin-bottom: 0;
  color: #ffffff;
  font-size: clamp(1rem, 1.4vw, 1.12rem);
  line-height: 1.2;
}

.hero-metrics span {
  color: rgba(226, 232, 240, 0.76);
  font-size: 0.98rem;
  line-height: 1.45;
}

.landing-band,
.landing-proof {
  margin-top: 0;
  padding: clamp(2rem, 5vw, 4rem) 0;
}

.landing-band {
  position: relative;
}

.landing-band::before,
.landing-proof::before {
  position: absolute;
  inset: 0 calc(50% - 50vw);
  z-index: -1;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(
      180deg,
      rgba(6, 20, 45, 0.94) 0%,
      rgba(15, 23, 42, 0.88) 42%,
      rgba(12, 30, 58, 0.9) 100%
    ),
    radial-gradient(
      circle at 12% 28%,
      rgba(96, 165, 250, 0.14) 0 1px,
      transparent 1.5px
    ),
    radial-gradient(
      circle at 84% 18%,
      rgba(255, 255, 255, 0.24) 0 1px,
      transparent 1.5px
    ),
    radial-gradient(
      circle at 62% 74%,
      rgba(94, 234, 212, 0.2) 0 1px,
      transparent 1.5px
    );
}

.workflow-band::before {
  z-index: -3;
  background:
    radial-gradient(
      circle at 9% 7%,
      rgba(255, 255, 255, 0.46) 0 1px,
      transparent 1.5px
    ),
    radial-gradient(
      circle at 28% 15%,
      rgba(125, 211, 252, 0.36) 0 1px,
      transparent 1.5px
    ),
    radial-gradient(
      circle at 72% 9%,
      rgba(255, 255, 255, 0.38) 0 1px,
      transparent 1.5px
    ),
    radial-gradient(
      circle at 88% 24%,
      rgba(94, 234, 212, 0.28) 0 1px,
      transparent 1.5px
    ),
    linear-gradient(
      180deg,
      #00040a 0%,
      #010816 28%,
      rgba(4, 18, 42, 0.96) 54%,
      rgba(2, 6, 23, 0.98) 100%
    );
}

.workflow-band {
  isolation: isolate;
  min-height: clamp(780px, 94vh, 1060px);
  padding: clamp(5.5rem, 10vw, 8.5rem) 0 clamp(7rem, 13vw, 11rem);
}

.workflow-nightscape {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  z-index: -1;
  width: 100vw;
  overflow: hidden;
  pointer-events: none;
  transform: translateX(-50%);
}

.workflow-nightscape::before,
.workflow-nightscape::after {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
}

.workflow-nightscape::before {
  background-image:
    radial-gradient(circle at 8% 18%, rgba(255, 255, 255, 0.86) 0 1px, transparent 1.6px),
    radial-gradient(circle at 18% 42%, rgba(125, 211, 252, 0.62) 0 1px, transparent 1.5px),
    radial-gradient(circle at 31% 13%, rgba(255, 255, 255, 0.72) 0 1px, transparent 1.6px),
    radial-gradient(circle at 43% 32%, rgba(94, 234, 212, 0.58) 0 1px, transparent 1.5px),
    radial-gradient(circle at 57% 16%, rgba(255, 255, 255, 0.74) 0 1px, transparent 1.6px),
    radial-gradient(circle at 71% 38%, rgba(125, 211, 252, 0.66) 0 1px, transparent 1.5px),
    radial-gradient(circle at 86% 22%, rgba(255, 255, 255, 0.9) 0 1px, transparent 1.7px),
    radial-gradient(circle at 92% 46%, rgba(94, 234, 212, 0.5) 0 1px, transparent 1.5px);
  background-size:
    360px 280px,
    440px 320px,
    520px 360px,
    420px 310px,
    480px 340px,
    390px 280px,
    520px 380px,
    460px 330px;
  opacity: 0.7;
  animation: workflow-stars-twinkle 4.8s ease-in-out infinite alternate;
}

.workflow-nightscape::after {
  background:
    linear-gradient(180deg, rgba(2, 6, 23, 0) 0%, rgba(2, 6, 23, 0.1) 50%, rgba(2, 6, 23, 0.78) 100%),
    radial-gradient(ellipse at 52% 82%, rgba(94, 234, 212, 0.12), transparent 44%),
    radial-gradient(ellipse at 78% 66%, rgba(96, 165, 250, 0.12), transparent 36%);
}

.workflow-starfield {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle, rgba(255, 255, 255, 0.72) 0 1px, transparent 1.5px),
    radial-gradient(circle, rgba(125, 211, 252, 0.38) 0 1px, transparent 1.5px),
    radial-gradient(circle, rgba(94, 234, 212, 0.32) 0 1px, transparent 1.5px);
  background-position:
    24px 38px,
    160px 82px,
    92px 156px;
  background-size:
    190px 170px,
    260px 230px,
    320px 260px;
  opacity: 0.46;
  animation: workflow-starfield-drift 42s linear infinite;
}

.workflow-shooting-star {
  position: absolute;
  width: clamp(7rem, 14vw, 14rem);
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.98), rgba(186, 230, 253, 0.18), transparent);
  filter: drop-shadow(0 0 8px rgba(103, 232, 249, 0.72));
  opacity: 0;
  transform: translate3d(0, 0, 0) rotate(-18deg);
  transform-origin: left center;
  animation: workflow-shooting-star 8.5s linear infinite;
}

.workflow-shooting-star::after {
  position: absolute;
  top: 50%;
  left: 0;
  width: 0.45rem;
  height: 0.45rem;
  content: "";
  background: #ffffff;
  border-radius: 50%;
  box-shadow: 0 0 18px rgba(186, 230, 253, 0.9);
  transform: translateY(-50%);
}

.workflow-shooting-star-one {
  top: 15%;
  left: 94%;
  animation-delay: -1.4s;
}

.workflow-shooting-star-two {
  top: 27%;
  left: 78%;
  width: clamp(5rem, 10vw, 10rem);
  animation-duration: 10.5s;
  animation-delay: -6s;
}

.workflow-shooting-star-three {
  top: 43%;
  left: 106%;
  width: clamp(6rem, 12vw, 12rem);
  animation-duration: 12s;
  animation-delay: -9.2s;
}

.workflow-shooting-star-four {
  top: 8%;
  left: 52%;
  width: clamp(4.5rem, 9vw, 9rem);
  animation-duration: 13.5s;
  animation-delay: -3.5s;
}

.workflow-mountains {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: clamp(18rem, 36vw, 29rem);
}

.workflow-mountains::before {
  position: absolute;
  right: 0;
  bottom: 48%;
  left: 0;
  height: 30%;
  content: "";
  background:
    radial-gradient(ellipse at 35% 60%, rgba(103, 232, 249, 0.14), transparent 48%),
    radial-gradient(ellipse at 70% 52%, rgba(94, 234, 212, 0.12), transparent 44%);
  filter: blur(18px);
  opacity: 0.68;
}

.workflow-mountain {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: max(122vw, 86rem);
  transform: translateX(-50%);
}

.workflow-mountain-far {
  z-index: 1;
  height: 92%;
  background:
    linear-gradient(180deg, rgba(21, 93, 122, 0.96), rgba(8, 47, 73, 0.92)),
    radial-gradient(ellipse at 32% 28%, rgba(125, 211, 252, 0.14), transparent 36%);
  clip-path: polygon(0 54%, 5% 54%, 8% 59%, 14% 58%, 20% 50%, 26% 51%, 32% 45%, 39% 44%, 45% 38%, 51% 39%, 56% 50%, 63% 52%, 69% 58%, 75% 59%, 81% 52%, 88% 40%, 94% 42%, 100% 38%, 100% 100%, 0 100%);
  opacity: 0.78;
}

.workflow-mountain-back {
  z-index: 2;
  height: 78%;
  background:
    linear-gradient(180deg, rgba(13, 74, 104, 0.98), rgba(6, 36, 60, 0.98)),
    radial-gradient(ellipse at 76% 24%, rgba(94, 234, 212, 0.12), transparent 35%);
  clip-path: polygon(0 39%, 6% 43%, 12% 52%, 19% 52%, 26% 43%, 34% 39%, 42% 45%, 48% 42%, 55% 49%, 62% 47%, 70% 54%, 77% 52%, 85% 45%, 92% 47%, 100% 52%, 100% 100%, 0 100%);
  opacity: 0.88;
}

.workflow-mountain-mid {
  z-index: 3;
  height: 65%;
  background:
    linear-gradient(180deg, rgba(8, 58, 88, 0.98), rgba(4, 27, 45, 0.98)),
    radial-gradient(ellipse at 21% 20%, rgba(125, 211, 252, 0.1), transparent 38%);
  clip-path: polygon(0 42%, 7% 50%, 13% 56%, 21% 53%, 28% 44%, 36% 39%, 44% 47%, 52% 45%, 59% 35%, 67% 48%, 73% 49%, 80% 42%, 88% 48%, 94% 44%, 100% 51%, 100% 100%, 0 100%);
  opacity: 0.96;
}

.workflow-mountain-near {
  z-index: 4;
  height: 51%;
  background:
    linear-gradient(180deg, rgba(5, 38, 64, 0.99), rgba(3, 19, 33, 0.99));
  clip-path: polygon(0 45%, 8% 52%, 16% 51%, 24% 47%, 32% 45%, 39% 34%, 47% 31%, 56% 43%, 64% 41%, 72% 47%, 82% 42%, 90% 46%, 100% 52%, 100% 100%, 0 100%);
}

.workflow-mountain-front {
  z-index: 5;
  height: 38%;
  background:
    linear-gradient(180deg, #041925 0%, #020617 76%),
    radial-gradient(ellipse at 48% 18%, rgba(94, 234, 212, 0.08), transparent 42%);
  clip-path: polygon(0 38%, 9% 42%, 18% 44%, 26% 43%, 34% 39%, 43% 26%, 52% 21%, 60% 31%, 69% 38%, 78% 36%, 87% 43%, 94% 50%, 100% 52%, 100% 100%, 0 100%);
  box-shadow: 0 -22px 58px rgba(2, 6, 23, 0.28);
}

.workflow-band .section-heading,
.workflow-band .kyc-roadmap {
  position: relative;
  z-index: 1;
}

.workflow-band .eyebrow.text-info {
  color: #67e8f9 !important;
  text-shadow: 0 0 16px rgba(103, 232, 249, 0.74);
}

.workflow-band .section-heading h2 {
  text-shadow:
    0 0 24px rgba(103, 232, 249, 0.32),
    0 8px 24px rgba(2, 6, 23, 0.5);
}

.workflow-band .section-heading p {
  color: rgba(224, 242, 254, 0.84);
}

.section-heading {
  max-width: 760px;
  margin-bottom: 2rem;
}

.section-heading p {
  max-width: 680px;
  margin-top: 1rem;
  color: rgba(248, 250, 252, 0.72);
  font-size: 1.05rem;
  line-height: 1.65;
}

.section-heading h2,
.proof-copy h2 {
  color: #ffffff;
  font-weight: 800;
}

.feature-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.feature-card {
  position: relative;
  overflow: hidden;
  min-height: 220px;
  padding: 1.45rem;
  color: #f8fafc;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.96), rgba(30, 41, 59, 0.78)),
    radial-gradient(
      circle at 85% 14%,
      rgba(96, 165, 250, 0.22),
      transparent 30%
    );
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.9rem;
  box-shadow: 0 22px 54px rgba(2, 6, 23, 0.28);
  backdrop-filter: blur(10px);
  opacity: 0;
  transform: translateY(2rem);
  transition:
    opacity 0.6s ease-out,
    transform 0.6s ease-out;
}

.feature-card.scroll-animate {
  opacity: 1;
  transform: translateY(0);
}

.feature-card::after {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background-image:
    radial-gradient(circle, rgba(255, 255, 255, 0.5) 0 1px, transparent 1.5px),
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
  background-position:
    30px 22px,
    0 0,
    0 0;
  background-size:
    96px 88px,
    42px 42px,
    42px 42px;
  opacity: 0.38;
}

.feature-orbit {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.3rem;
  height: 2.3rem;
  margin-bottom: 1.1rem;
  color: #042f2e;
  background: linear-gradient(135deg, #7dd3fc, #5eead4);
  border: 1px solid rgba(125, 211, 252, 0.48);
  border-radius: 0.75rem;
  box-shadow: 0 0 22px rgba(125, 211, 252, 0.32);
}

.feature-orbit svg {
  width: 1.25rem;
  height: 1.25rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.feature-card h3 {
  position: relative;
  z-index: 1;
  margin-bottom: 0.85rem;
  font-size: 1.08rem;
  font-weight: 800;
}

.feature-card p {
  position: relative;
  z-index: 1;
  margin-bottom: 0;
  color: rgba(226, 232, 240, 0.78);
  line-height: 1.58;
}

.kyc-roadmap {
  --kyc-roadmap-dot-radius: 1.6rem;
  --kyc-roadmap-dot-size: 3.2rem;
  --kyc-roadmap-gap: 1rem;
  --kyc-roadmap-connector-end-adjust: 3px;
  --kyc-roadmap-line-thickness: 2px;
  --kyc-roadmap-step-padding: 1rem;
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--kyc-roadmap-gap);
  padding: 1.2rem;
  color: #f8fafc;
  background:
    linear-gradient(135deg, rgba(2, 6, 23, 0.78), rgba(8, 47, 73, 0.64)),
    radial-gradient(
      circle at 18% 18%,
      rgba(94, 234, 212, 0.22),
      transparent 34%
    ),
    radial-gradient(
      circle at 82% 22%,
      rgba(96, 165, 250, 0.24),
      transparent 30%
    );
  border: 1px solid rgba(125, 211, 252, 0.3);
  border-radius: 1rem;
  box-shadow:
    0 28px 76px rgba(2, 6, 23, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 0 36px rgba(103, 232, 249, 0.12);
  backdrop-filter: blur(18px);
}

.kyc-roadmap::before {
  display: none;
}

.kyc-roadmap-step:not(:last-child)::before {
  position: absolute;
  top: calc(var(--kyc-roadmap-step-padding) + var(--kyc-roadmap-dot-radius));
  left: calc(var(--kyc-roadmap-step-padding) + var(--kyc-roadmap-dot-radius));
  z-index: 0;
  width: calc(100% + var(--kyc-roadmap-gap) + var(--kyc-roadmap-connector-end-adjust));
  height: var(--kyc-roadmap-line-thickness);
  pointer-events: none;
  content: "";
  background: rgba(125, 211, 252, 0.78);
  opacity: 0.78;
}

.kyc-roadmap-step {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 1rem;
  min-height: 230px;
  padding: var(--kyc-roadmap-step-padding);
  background: rgba(2, 6, 23, 0.44);
  border: 1px solid rgba(226, 232, 240, 0.18);
  border-radius: 0.85rem;
  backdrop-filter: blur(12px);
  opacity: 0;
  transform: translateY(2rem);
  transition:
    opacity 0.6s ease-out,
    transform 0.6s ease-out;
}

.kyc-roadmap-step > * {
  position: relative;
  z-index: 1;
}

.kyc-roadmap-step.scroll-animate {
  opacity: 1;
  transform: translateY(0);
}

.kyc-roadmap-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--kyc-roadmap-dot-size);
  height: var(--kyc-roadmap-dot-size);
  color: #042f2e;
  font-weight: 850;
  background: linear-gradient(135deg, #67e8f9, #5eead4);
  border: 4px solid rgba(15, 23, 42, 0.92);
  border-radius: 50%;
  box-shadow:
    0 0 0 1px rgba(125, 211, 252, 0.58),
    0 0 28px rgba(94, 234, 212, 0.34);
}

.kyc-roadmap-step h3 {
  margin-bottom: 0.6rem;
  font-size: 1.02rem;
  font-weight: 850;
}

.kyc-roadmap-step p {
  margin-bottom: 0;
  color: rgba(226, 232, 240, 0.78);
  line-height: 1.55;
}

.coverage-epic-flow {
  position: relative;
}

.coverage-band {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(280px, 0.6fr);
  gap: 2rem;
  align-items: center;
  min-height: clamp(660px, 84vh, 900px);
  padding: clamp(5rem, 11vw, 8rem) 0;
}

.coverage-band::before {
  position: absolute;
  inset: 0 calc(50% - 50vw);
  z-index: -1;
  pointer-events: none;
  content: "";
  background: linear-gradient(
    180deg,
    rgba(2, 6, 23, 0.98) 0%,
    rgba(2, 6, 23, 0.62) 16%,
    rgba(2, 6, 23, 0) 34%,
    rgba(6, 20, 45, 0) 68%,
    rgba(6, 20, 45, 0.94) 100%
  );
}

.coverage-earth-bg {
  position: absolute;
  inset: 0 calc(50% - 50vw);
  z-index: -2;
  display: block;
  width: 100vw;
  height: 100%;
  pointer-events: none;
}

.coverage-copy,
.coverage-panel {
  position: relative;
  z-index: 1;
}

.coverage-copy h2,
.coverage-explorer-hero h1 {
  color: #ffffff;
  font-weight: 850;
}

.coverage-copy p,
.coverage-explorer-hero p {
  max-width: 680px;
  color: rgba(248, 250, 252, 0.75);
  font-size: 1.05rem;
  line-height: 1.7;
}

.coverage-copy a:not(.btn),
.coverage-explorer-hero a:not(.btn) {
  color: #7dd3fc;
  font-weight: 750;
}

.coverage-panel {
  display: grid;
  gap: 0.75rem;
  padding: 1rem;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.98), rgba(8, 47, 73, 0.94)),
    radial-gradient(circle at 85% 12%, rgba(94, 234, 212, 0.16), transparent 30%);
  border: 1px solid rgba(125, 211, 252, 0.3);
  border-radius: 1rem;
  box-shadow: 0 26px 70px rgba(2, 6, 23, 0.32);
}

.coverage-panel div {
  padding: 1rem;
  background: rgba(255, 255, 255, 0.11);
  border: 1px solid rgba(226, 232, 240, 0.18);
  border-radius: 0.85rem;
}

.coverage-panel strong,
.coverage-panel span {
  display: block;
}

.coverage-panel strong {
  color: #ffffff;
  font-size: 1.35rem;
  font-weight: 850;
}

.coverage-panel span {
  color: rgba(226, 232, 240, 0.74);
  line-height: 1.45;
}

.epic-medical-band {
  position: relative;
  display: grid;
  gap: 2rem;
  min-height: clamp(700px, 84vh, 920px);
  padding: clamp(4.5rem, 8vw, 6.5rem) 0 clamp(6rem, 10vw, 8rem);
  overflow: visible;
  isolation: isolate;
  background: #06142d;
}

.epic-medical-band::before {
  position: absolute;
  inset: 0 calc(50% - 50vw);
  z-index: -1;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(
      180deg,
      rgba(6, 20, 45, 0.96) 0%,
      rgba(6, 20, 45, 0.42) 16%,
      rgba(2, 6, 23, 0.16) 44%,
      rgba(2, 6, 23, 0.36) 72%,
      rgba(2, 6, 23, 0.96) 100%
    ),
    radial-gradient(circle at 50% 22%, rgba(125, 211, 252, 0.18), transparent 34%),
    radial-gradient(circle at 82% 68%, rgba(94, 234, 212, 0.12), transparent 26%);
}

.epic-medical-band::after {
  position: absolute;
  right: calc(50% - 50vw);
  bottom: -1px;
  left: calc(50% - 50vw);
  z-index: -1;
  height: clamp(9rem, 18vw, 15rem);
  pointer-events: none;
  content: "";
  background: linear-gradient(
    180deg,
    rgba(2, 6, 23, 0) 0%,
    rgba(2, 6, 23, 0.58) 48%,
    rgba(6, 20, 45, 0.96) 100%
  );
}

.epic-network-bg {
  position: absolute;
  inset: 0 calc(50% - 50vw);
  z-index: -2;
  display: block;
  width: 100vw;
  height: 100%;
  pointer-events: none;
}

.coverage-epic-flow + .landing-band {
  isolation: isolate;
}

.coverage-epic-flow + .landing-band::before {
  background:
    linear-gradient(
      180deg,
      rgba(6, 20, 45, 0.96) 0%,
      rgba(8, 47, 73, 0.72) 22%,
      rgba(15, 23, 42, 0.88) 58%,
      rgba(12, 30, 58, 0.9) 100%
    ),
    radial-gradient(
      circle at 12% 28%,
      rgba(96, 165, 250, 0.12) 0 1px,
      transparent 1.5px
    ),
    radial-gradient(
      circle at 84% 18%,
      rgba(255, 255, 255, 0.2) 0 1px,
      transparent 1.5px
    ),
    radial-gradient(
      circle at 62% 74%,
      rgba(94, 234, 212, 0.18) 0 1px,
      transparent 1.5px
    );
}

.epic-medical-header {
  max-width: 820px;
}

.epic-medical-header h2 {
  color: #ffffff;
  font-weight: 850;
}

.epic-medical-header p {
  max-width: 760px;
  color: rgba(248, 250, 252, 0.76);
  font-size: 1.05rem;
  line-height: 1.7;
}

.epic-medical-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.58fr);
  gap: 1rem;
  align-items: stretch;
}

.epic-record-board,
.epic-clinical-summary {
  border: 1px solid rgba(125, 211, 252, 0.3);
  border-radius: 0.75rem;
  box-shadow:
    0 28px 76px rgba(2, 6, 23, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.epic-record-board {
  display: grid;
  gap: 1rem;
  padding: clamp(1rem, 3vw, 1.35rem);
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.98), rgba(8, 47, 73, 0.92)),
    radial-gradient(circle at 100% 0%, rgba(96, 165, 250, 0.14), transparent 28%);
}

.epic-record-board-header {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  min-height: 4rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(125, 211, 252, 0.22);
}

.epic-record-board-header strong,
.epic-record-board-header span,
.epic-record-steps strong,
.epic-record-steps span {
  display: block;
}

.epic-record-board-header strong {
  color: #ffffff;
  font-size: 1.18rem;
  font-weight: 850;
}

.epic-record-board-header span {
  color: rgba(186, 230, 253, 0.76);
}

.epic-record-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.epic-record-steps div {
  min-height: 11rem;
  padding: 1rem;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.88), rgba(8, 47, 73, 0.72));
  border: 1px solid rgba(125, 211, 252, 0.26);
  border-radius: 0.65rem;
}

.epic-record-steps span {
  width: fit-content;
  margin-bottom: 1rem;
  padding: 0.24rem 0.48rem;
  color: #082f49;
  font-size: 0.78rem;
  font-weight: 850;
  background: #bae6fd;
  border-radius: 999px;
}

.epic-record-steps strong {
  color: #ffffff;
  font-weight: 850;
}

.epic-record-steps p {
  margin: 0.55rem 0 0;
  color: rgba(226, 232, 240, 0.76);
  line-height: 1.55;
}

.epic-clinical-summary {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 1rem;
  padding: clamp(1rem, 3vw, 1.35rem);
  color: #0f172a;
  background: #f8fafc;
}

.epic-clinical-summary dl {
  display: grid;
  gap: 0.85rem;
  margin: 0;
}

.epic-clinical-summary dl div {
  padding-left: 0.85rem;
  border-left: 4px solid #38bdf8;
}

.epic-clinical-summary dt {
  color: #0369a1;
  font-size: 1.08rem;
  font-weight: 850;
}

.epic-clinical-summary dd {
  margin: 0.15rem 0 0;
  color: #334155;
  line-height: 1.48;
}

.coverage-explorer-page {
  position: relative;
  padding: clamp(2rem, 5vw, 4rem) 0 3rem;
}

.coverage-explorer-hero {
  max-width: 780px;
  margin-bottom: 2rem;
}

.coverage-explorer-hero h1 {
  font-size: clamp(2.25rem, 6vw, 4rem);
}

.coverage-source-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.5rem;
}

.coverage-search-shell {
  display: grid;
  gap: 0.6rem;
  margin-bottom: 1rem;
  padding: 1rem;
  background: rgba(15, 23, 42, 0.72);
  border: 1px solid rgba(125, 211, 252, 0.2);
  border-radius: 1rem;
  box-shadow: 0 22px 54px rgba(2, 6, 23, 0.24);
}

.coverage-search-shell .form-label {
  margin-bottom: 0;
  color: #e0f2fe;
  font-weight: 750;
}

.coverage-provider-filter-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) minmax(180px, 0.9fr) minmax(180px, 0.7fr);
  gap: 0.85rem;
  align-items: end;
}

.coverage-provider-filter-grid > div {
  display: grid;
  gap: 0.45rem;
}

.coverage-result-count {
  min-height: 1.35rem;
  color: rgba(226, 232, 240, 0.72);
  font-size: 0.95rem;
}

.coverage-directory-note {
  margin: -0.2rem 0 0;
  color: rgba(226, 232, 240, 0.58);
  font-size: 0.88rem;
  line-height: 1.45;
}

.coverage-results {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.coverage-result-card {
  display: grid;
  gap: 1rem;
  padding: 1rem;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.94), rgba(30, 41, 59, 0.78)),
    radial-gradient(circle at 90% 12%, rgba(96, 165, 250, 0.18), transparent 32%);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.9rem;
  box-shadow: 0 18px 48px rgba(2, 6, 23, 0.24);
}

.coverage-result-card h2 {
  margin-bottom: 0.2rem;
  color: #ffffff;
  font-size: 1.12rem;
  font-weight: 850;
}

.coverage-result-card p {
  margin-bottom: 0;
  color: rgba(226, 232, 240, 0.68);
}

.coverage-result-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
  margin-bottom: 0;
}

.coverage-result-card dl div {
  display: grid;
  gap: 0.35rem;
  padding: 0.7rem;
  background: rgba(255, 255, 255, 0.065);
  border: 1px solid rgba(226, 232, 240, 0.12);
  border-radius: 0.75rem;
}

.coverage-result-card dt {
  color: rgba(226, 232, 240, 0.7);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.coverage-result-card dd {
  margin-bottom: 0;
  font-weight: 800;
}

.coverage-supported {
  color: #99f6e4;
}

.coverage-load-more-shell {
  display: flex;
  justify-content: center;
  margin-top: 1.25rem;
}

.coverage-na {
  color: rgba(226, 232, 240, 0.46);
}

.coverage-empty {
  grid-column: 1 / -1;
  padding: 1.2rem;
  color: rgba(226, 232, 240, 0.72);
  background: rgba(15, 23, 42, 0.72);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 0.9rem;
}

.coverage-loading {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 0.85rem;
  min-height: 5.5rem;
  padding: 1rem 1.15rem;
  color: rgba(226, 232, 240, 0.84);
  background:
    radial-gradient(circle at 12% 28%, rgba(125, 211, 252, 0.2), transparent 34%),
    linear-gradient(145deg, rgba(15, 23, 42, 0.88), rgba(30, 41, 59, 0.76));
  border: 1px solid rgba(125, 211, 252, 0.24);
  border-radius: 0.9rem;
  box-shadow: 0 18px 44px rgba(2, 6, 23, 0.22);
}

.coverage-loading strong,
.coverage-loading small {
  display: block;
}

.coverage-loading strong {
  color: #ffffff;
  font-weight: 850;
}

.coverage-loading small {
  margin-top: 0.15rem;
  color: rgba(226, 232, 240, 0.66);
}

.coverage-loading-orbit {
  position: relative;
  display: inline-flex;
  flex: 0 0 2.8rem;
  align-items: center;
  justify-content: center;
  width: 2.8rem;
  height: 2.8rem;
  background: rgba(14, 165, 233, 0.16);
  border: 1px solid rgba(103, 232, 249, 0.42);
  border-radius: 50%;
}

.coverage-loading-orbit::before {
  width: 0.9rem;
  height: 0.9rem;
  content: "";
  background: #67e8f9;
  border-radius: 50%;
  box-shadow: 0 0 24px rgba(103, 232, 249, 0.72);
}

.coverage-loading-orbit::after {
  position: absolute;
  inset: 0.22rem;
  content: "";
  border: 2px solid rgba(103, 232, 249, 0.68);
  border-left-color: transparent;
  border-radius: 50%;
  animation: coverage-loading-orbit-spin 0.95s linear infinite;
}

@keyframes coverage-loading-orbit-spin {
  to {
    transform: rotate(1turn);
  }
}

.landing-proof {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(320px, 0.75fr);
  gap: 2rem;
  align-items: start;
  margin-bottom: 2rem;
}

.landing-proof::after {
  position: absolute;
  inset: 1rem calc(50% - 50vw) 0;
  z-index: -2;
  content: "";
  background: linear-gradient(180deg, transparent, rgba(2, 6, 23, 0.42));
}

.proof-copy p {
  max-width: 680px;
  color: rgba(248, 250, 252, 0.75);
  font-size: 1.05rem;
  line-height: 1.7;
}

.workflow-list {
  position: relative;
  display: grid;
  gap: 0.75rem;
  padding: 0.85rem;
  background: rgba(15, 23, 42, 0.7);
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 1rem;
  box-shadow: 0 24px 64px rgba(2, 6, 23, 0.28);
}

.workflow-list::before {
  position: absolute;
  top: 2rem;
  bottom: 2rem;
  left: 2.35rem;
  width: 1px;
  content: "";
  background: linear-gradient(180deg, #60a5fa, #5eead4);
  opacity: 0.6;
}

.workflow-list div {
  position: relative;
  display: flex;
  gap: 1rem;
  align-items: center;
  padding: 1rem;
  color: #f8fafc;
  background: rgba(255, 255, 255, 0.075);
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 0.8rem;
}

.workflow-list span {
  display: inline-flex;
  flex: 0 0 2.35rem;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  color: #052e2b;
  font-weight: 800;
  background: #5eead4;
  box-shadow: 0 0 22px rgba(94, 234, 212, 0.42);
  border-radius: 50%;
}

.workflow-list strong {
  font-weight: 750;
  line-height: 1.35;
}

.tutorial-band {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(320px, 1fr);
  gap: 2rem;
  align-items: center;
  margin: 0;
  padding: clamp(2rem, 5vw, 4rem) 0;
}

.tutorial-band::before {
  position: absolute;
  inset: 0 calc(50% - 50vw);
  z-index: -1;
  content: "";
  background:
    linear-gradient(
      180deg,
      rgba(12, 30, 58, 0.9) 0%,
      rgba(8, 47, 73, 0.42) 42%,
      rgba(2, 6, 23, 0.92) 100%
    ),
    radial-gradient(
      ellipse at 78% 45%,
      rgba(96, 165, 250, 0.22),
      transparent 36%
    ),
    radial-gradient(
      ellipse at 18% 18%,
      rgba(94, 234, 212, 0.12),
      transparent 30%
    ),
    repeating-linear-gradient(
      0deg,
      rgba(248, 250, 252, 0.045) 0 1px,
      transparent 1px 18px
    );
}

.tutorial-copy h2 {
  color: #ffffff;
  font-weight: 850;
}

.tutorial-copy p {
  max-width: 620px;
  margin: 1rem 0 1.5rem;
  color: rgba(248, 250, 252, 0.76);
  font-size: 1.05rem;
  line-height: 1.7;
}

.tutorial-video {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: rgba(15, 23, 42, 0.82);
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-radius: 1rem;
  box-shadow: 0 28px 76px rgba(2, 6, 23, 0.34);
}

.tutorial-video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.cta-band {
  position: relative;
  padding: clamp(3rem, 8vw, 5rem) 0;
  text-align: center;
  margin-top: 0;
}

.cta-band::before {
  position: absolute;
  inset: 0 calc(50% - 50vw);
  z-index: -1;
  content: "";
  background:
    linear-gradient(
      180deg,
      rgba(2, 6, 23, 0.92) 0%,
      rgba(2, 6, 23, 0.98) 58%,
      rgba(1, 4, 10, 0.98) 100%
    ),
    radial-gradient(
      circle at 50% 50%,
      rgba(125, 211, 252, 0.12),
      transparent 50%
    );
}

.cta-content h2 {
  color: #ffffff;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 850;
  margin-bottom: 1rem;
}

.cta-content p {
  max-width: 600px;
  margin: 0 auto 2rem;
  color: rgba(248, 250, 252, 0.76);
  font-size: 1.1rem;
  line-height: 1.7;
}

.partner-page {
  display: grid;
  gap: 0;
  width: 100vw;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  color: #f8fafc;
  background:
    radial-gradient(circle at 78% 8%, rgba(103, 232, 249, 0.12), transparent 28rem),
    radial-gradient(circle at 14% 62%, rgba(45, 212, 191, 0.08), transparent 30rem),
    linear-gradient(180deg, #05151d 0%, #020617 32%, #0f172a 62%, #082f49 100%);
}

.partner-hero,
.partner-section {
  position: relative;
  isolation: isolate;
}

.partner-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(18rem, 0.95fr);
  gap: clamp(2rem, 6vw, 5rem);
  align-items: center;
  min-height: calc(100svh - 8.5rem);
  padding: clamp(3.5rem, 8vw, 7rem) max(1rem, calc(50vw - 570px)) clamp(3rem, 7vw, 5.5rem);
}

.partner-hero-copy,
.partner-hero-visual,
.partner-section-heading,
.partner-video-slot,
.partner-workflow-step,
.partner-payout-copy,
.partner-payout-panel > div,
.partner-application-copy,
.partner-application-panel {
  opacity: 0;
  transform: translate3d(0, 1.15rem, 0);
  will-change: transform, opacity;
}

.partner-reveal.is-visible {
  animation: partner-load-in 0.72s cubic-bezier(0.2, 0.72, 0.18, 1) forwards;
  animation-delay: var(--partner-reveal-delay, 0s);
}

.partner-hero-copy {
  --partner-reveal-delay: 0.06s;
}

.partner-hero-visual {
  --partner-reveal-delay: 0.16s;
}

.partner-video-slot {
  --partner-reveal-delay: 0.08s;
}

.partner-workflow-step:nth-child(1) {
  --partner-reveal-delay: 0.14s;
}

.partner-workflow-step:nth-child(2) {
  --partner-reveal-delay: 0.22s;
}

.partner-workflow-step:nth-child(3) {
  --partner-reveal-delay: 0.3s;
}

.partner-payout-panel > div:nth-child(1) {
  --partner-reveal-delay: 0.08s;
}

.partner-payout-panel > div:nth-child(2) {
  --partner-reveal-delay: 0.16s;
}

.partner-payout-panel > div:nth-child(3) {
  --partner-reveal-delay: 0.24s;
}

@keyframes partner-load-in {
  from {
    opacity: 0;
    transform: translate3d(0, 1.15rem, 0) scale(0.985);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

.partner-hero-sky {
  position: absolute;
  inset: -5rem calc(50% - 50vw) 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(5, 21, 29, 0.18) 0%, rgba(13, 39, 64, 0.14) 46%, rgba(2, 6, 23, 0.28) 100%),
    linear-gradient(90deg, rgba(103, 232, 249, 0.08) 1px, transparent 1px),
    linear-gradient(0deg, rgba(45, 212, 191, 0.07) 1px, transparent 1px);
  background-size:
    auto,
    72px 72px,
    72px 72px;
}

.partner-hero-sky::before {
  position: absolute;
  inset: 0;
  content: "";
  background:
    radial-gradient(circle at 12% 18%, rgba(255, 255, 255, 0.48) 0 1px, transparent 1.5px),
    radial-gradient(circle at 36% 30%, rgba(103, 232, 249, 0.42) 0 1px, transparent 1.5px),
    radial-gradient(circle at 74% 22%, rgba(125, 211, 252, 0.42) 0 1px, transparent 1.5px),
    radial-gradient(circle at 88% 66%, rgba(56, 189, 248, 0.34) 0 1px, transparent 1.5px),
    radial-gradient(circle at 26% 78%, rgba(255, 255, 255, 0.36) 0 1px, transparent 1.5px);
  background-size: 360px 280px;
  opacity: 0.68;
}

.partner-hero-sky::after {
  position: absolute;
  inset: 0;
  content: "";
  background:
    linear-gradient(180deg, rgba(2, 6, 23, 0.06), rgba(2, 6, 23, 0.22) 82%, rgba(2, 6, 23, 0.36)),
    linear-gradient(90deg, rgba(2, 6, 23, 0.55), transparent 34%, transparent 68%, rgba(2, 6, 23, 0.5));
}

.partner-star {
  position: absolute;
  z-index: 2;
  width: clamp(7rem, 12vw, 13rem);
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.96) 7%, rgba(255, 255, 255, 0.9) 13%, rgba(103, 232, 249, 0.28) 46%, transparent 100%);
  border-radius: 999px;
  opacity: 0;
  transform: rotate(-20deg);
  filter: drop-shadow(0 0 8px rgba(103, 232, 249, 0.42));
  animation: partner-comet-pass 7.8s linear infinite;
  will-change: transform, opacity;
}

.partner-star::after {
  position: absolute;
  top: 56%;
  left: 0.05rem;
  width: 0.42rem;
  height: 0.42rem;
  content: "";
  background: #ffffff;
  border-radius: 999px;
  box-shadow:
    0 0 12px rgba(255, 255, 255, 0.86),
    0 0 24px rgba(103, 232, 249, 0.56);
  transform: translateY(-50%);
}

.partner-star-one {
  top: 18%;
  right: -18rem;
  animation-duration: 8.5s;
  animation-delay: -1.2s;
}

.partner-star-two {
  top: 53%;
  right: -14rem;
  width: clamp(5.5rem, 9vw, 9rem);
  animation-duration: 10.5s;
  animation-delay: -5.8s;
}

.partner-star-three {
  top: 75%;
  right: -10rem;
  width: clamp(4.75rem, 8vw, 7rem);
  animation-duration: 9.2s;
  animation-delay: -3.4s;
}

@keyframes partner-comet-pass {
  0% {
    opacity: 0;
    transform: translate3d(12vw, -8vh, 0) rotate(-20deg);
  }

  9% {
    opacity: 0.78;
  }

  24% {
    opacity: 0.88;
  }

  42% {
    opacity: 0;
    transform: translate3d(-124vw, 46vh, 0) rotate(-20deg);
  }

  100% {
    opacity: 0;
    transform: translate3d(-124vw, 46vh, 0) rotate(-20deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .partner-hero-copy,
  .partner-hero-visual,
  .partner-section-heading,
  .partner-video-slot,
  .partner-workflow-step,
  .partner-payout-copy,
  .partner-payout-panel > div,
  .partner-application-copy,
  .partner-application-panel {
    opacity: 1;
    transform: none;
    animation: none;
  }

  .partner-star {
    opacity: 0.45;
    animation: none;
  }

  .partner-star-one {
    top: 21%;
    right: 7%;
    left: auto;
  }

  .partner-star-two {
    top: 58%;
    right: auto;
    left: 48%;
  }

  .partner-star-three {
    top: auto;
    right: 28%;
    bottom: 18%;
    left: auto;
  }
}

.partner-hero-copy h1,
.partner-section-heading h2,
.partner-payout-copy h2,
.partner-application-copy h2 {
  max-width: 13ch;
  margin: 0 0 1rem;
  color: #ffffff;
  font-size: clamp(2.7rem, 7vw, 5.8rem);
  font-weight: 900;
  line-height: 0.96;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.partner-hero-copy p,
.partner-section-heading p,
.partner-payout-copy p,
.partner-application-copy p {
  max-width: 42rem;
  color: rgba(224, 242, 254, 0.78);
  font-size: clamp(1.05rem, 2vw, 1.25rem);
  line-height: 1.7;
}

.partner-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
  margin-top: 1.7rem;
}

.partner-hero-actions .btn,
.partner-form-actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3.2rem;
  padding-right: 1.4rem;
  padding-left: 1.4rem;
  border-radius: 8px !important;
  font-weight: 850;
  letter-spacing: 0;
}

.partner-primary-action {
  color: #082f49 !important;
  background:
    linear-gradient(135deg, #e0f2fe 0%, #67e8f9 42%, #38bdf8 100%),
    #67e8f9 !important;
  border: 1px solid rgba(224, 242, 254, 0.82) !important;
  box-shadow:
    0 20px 48px rgba(45, 212, 191, 0.22),
    0 0 26px rgba(103, 232, 249, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

.partner-primary-action:hover,
.partner-primary-action:focus {
  color: #020617 !important;
  background:
    linear-gradient(135deg, #f0f9ff 0%, #7dd3fc 42%, #22d3ee 100%),
    #7dd3fc !important;
  border-color: rgba(240, 249, 255, 0.94) !important;
}

.partner-hero-visual {
  position: relative;
  display: grid;
  place-items: center;
  min-height: clamp(24rem, 42vw, 36rem);
}

.partner-hero-visual::before {
  position: absolute;
  inset: 8%;
  content: "";
  background:
    linear-gradient(90deg, rgba(103, 232, 249, 0.24) 1px, transparent 1px),
    linear-gradient(0deg, rgba(45, 212, 191, 0.2) 1px, transparent 1px);
  background-size: 34px 34px;
  border: 1px solid rgba(103, 232, 249, 0.28);
  border-radius: 8px;
  transform: rotate(-4deg);
}

.partner-hero-visual img {
  position: relative;
  z-index: 2;
  width: clamp(8rem, 16vw, 12rem);
  height: auto;
  filter:
    drop-shadow(0 0 18px rgba(103, 232, 249, 0.3))
    drop-shadow(0 22px 48px rgba(2, 6, 23, 0.46));
}

.partner-payout-orbit,
.partner-orbit-note {
  position: absolute;
  z-index: 3;
  color: #f8fafc;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.92), rgba(8, 47, 73, 0.74)),
    rgba(2, 6, 23, 0.88);
  border: 1px solid rgba(103, 232, 249, 0.3);
  border-radius: 8px;
  box-shadow:
    0 22px 54px rgba(2, 6, 23, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

.partner-payout-orbit {
  right: 0;
  bottom: 15%;
  display: grid;
  gap: 0.15rem;
  width: min(15rem, 72vw);
  padding: 1rem;
  border-left: 3px solid #67e8f9;
}

.partner-payout-orbit span {
  color: #bae6fd;
  font-size: clamp(2.2rem, 6vw, 3.4rem);
  font-weight: 950;
  line-height: 0.9;
}

.partner-payout-orbit strong,
.partner-orbit-note {
  font-weight: 850;
}

.partner-payout-orbit small {
  color: rgba(224, 242, 254, 0.68);
}

.partner-orbit-note {
  padding: 0.75rem 0.9rem;
  color: #e0f2fe;
}

.partner-orbit-note-top {
  top: 13%;
  right: 8%;
}

.partner-orbit-note-bottom {
  bottom: 10%;
  left: 4%;
  border-color: rgba(34, 211, 238, 0.34);
}

.partner-section {
  padding: clamp(3.25rem, 7vw, 6rem) max(1rem, calc(50vw - 570px));
}

.partner-section::before {
  position: absolute;
  inset: -1px calc(50% - 50vw);
  z-index: -1;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(180deg, rgba(2, 6, 23, 0.18), rgba(15, 23, 42, 0.16)),
    linear-gradient(90deg, rgba(125, 211, 252, 0.07) 1px, transparent 1px);
  background-size:
    auto,
    64px 64px;
}

.partner-section-heading {
  max-width: 760px;
  margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
}

.partner-how::before {
  background: linear-gradient(180deg, rgba(2, 6, 23, 0.18), rgba(15, 23, 42, 0.16));
}

.partner-section-heading h2,
.partner-payout-copy h2,
.partner-application-copy h2 {
  max-width: 16ch;
  font-size: clamp(2rem, 5vw, 3.5rem);
  line-height: 1;
}

.partner-how-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.86fr);
  gap: clamp(1.25rem, 4vw, 2rem);
  align-items: stretch;
}

.partner-video-slot,
.partner-workflow-step,
.partner-payout-panel > div,
.partner-application-panel {
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.88), rgba(8, 47, 73, 0.58)),
    rgba(2, 6, 23, 0.72);
  border: 1px solid rgba(125, 211, 252, 0.24);
  border-radius: 8px;
  box-shadow:
    0 24px 58px rgba(2, 6, 23, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.partner-video-slot {
  display: grid;
  align-items: center;
  min-height: 100%;
  padding: clamp(1rem, 2vw, 1.4rem);
}

.partner-video-frame {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 0.55rem;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  aspect-ratio: 16 / 9;
  box-sizing: border-box;
  color: #f8fafc;
  background:
    linear-gradient(135deg, rgba(103, 232, 249, 0.12), transparent 42%),
    linear-gradient(160deg, rgba(8, 47, 73, 0.76), rgba(2, 6, 23, 0.9)),
    linear-gradient(90deg, rgba(103, 232, 249, 0.13) 1px, transparent 1px),
    linear-gradient(0deg, rgba(125, 211, 252, 0.1) 1px, transparent 1px);
  background-size:
    auto,
    auto,
    36px 36px,
    36px 36px;
  border: 1px solid rgba(103, 232, 249, 0.24);
  border-radius: 8px;
}

.partner-play-icon {
  display: inline-flex;
  width: 4.2rem;
  height: 4.2rem;
  background: linear-gradient(135deg, #e0f2fe, #67e8f9);
  border: 1px solid rgba(255, 255, 255, 0.82);
  border-radius: 999px;
  box-shadow: 0 16px 36px rgba(45, 212, 191, 0.22);
}

.partner-play-icon::before {
  width: 0;
  height: 0;
  margin: auto auto auto 1.65rem;
  content: "";
  border-top: 0.72rem solid transparent;
  border-bottom: 0.72rem solid transparent;
  border-left: 1.05rem solid #082f49;
}

.partner-video-frame strong {
  color: #ffffff;
  font-size: 1.25rem;
}

.partner-video-frame small {
  color: rgba(224, 242, 254, 0.68);
  font-weight: 750;
}

.partner-workflow {
  display: grid;
  gap: 0.85rem;
}

.partner-workflow-step {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
  min-height: 0;
  padding: 1.1rem;
}

.partner-workflow-step span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  color: #082f49;
  font-size: 0.82rem;
  font-weight: 950;
  line-height: 1;
  background: linear-gradient(135deg, #e0f2fe 0%, #67e8f9 52%, #38bdf8 100%);
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 8px;
}

.partner-workflow-step h3 {
  margin: 0 0 0.35rem;
  color: #ffffff;
  font-size: 1.15rem;
  font-weight: 900;
}

.partner-workflow-step p {
  margin: 0;
  color: rgba(224, 242, 254, 0.72);
  line-height: 1.55;
}

.partner-payouts {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(18rem, 1fr);
  gap: clamp(1.5rem, 5vw, 3rem);
  align-items: center;
}

.partner-payouts::before {
  background: linear-gradient(
    180deg,
    rgba(15, 23, 42, 0.1) 0%,
    rgba(8, 47, 73, 0.2) 72%,
    rgba(4, 47, 46, 0.22) 100%
  );
}

.partner-payout-panel {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.9rem;
}

.partner-payout-panel > div {
  display: grid;
  gap: 0.45rem;
  min-height: 13rem;
  padding: 1.15rem;
  border-top: 3px solid #67e8f9;
}

.partner-payout-panel > div:nth-child(2) {
  border-top-color: #38bdf8;
}

.partner-payout-panel > div:nth-child(3) {
  border-top-color: #0ea5e9;
}

.partner-payout-panel span {
  color: #bae6fd;
  font-size: clamp(2rem, 5vw, 3.35rem);
  font-weight: 950;
  line-height: 0.95;
}

.partner-payout-panel > div:nth-child(2) span {
  font-size: clamp(1.35rem, 3vw, 2.1rem);
}

.partner-payout-panel strong {
  color: #ffffff;
  font-size: 1rem;
  font-weight: 900;
}

.partner-payout-panel small {
  color: rgba(224, 242, 254, 0.66);
  line-height: 1.45;
}

.partner-application-section {
  display: grid;
  grid-template-columns: minmax(0, 0.72fr) minmax(20rem, 1fr);
  gap: clamp(1.5rem, 5vw, 3rem);
  align-items: start;
  scroll-margin-top: 6rem;
}

.partner-application-section::before {
  background:
    radial-gradient(circle at 86% 24%, rgba(45, 212, 191, 0.18), transparent 24rem),
    radial-gradient(circle at 14% 78%, rgba(56, 189, 248, 0.12), transparent 22rem),
    linear-gradient(
      180deg,
      rgba(4, 47, 46, 0.22) 0%,
      rgba(8, 47, 73, 0.26) 28%,
      rgba(4, 47, 46, 0.24) 100%
    );
}

.partner-application-section::after {
  position: absolute;
  inset: 8% calc(50% - 50vw) 4%;
  z-index: 0;
  pointer-events: none;
  content: "";
  background:
    conic-gradient(from 210deg at 72% 42%, transparent 0deg, rgba(94, 234, 212, 0.24) 54deg, rgba(56, 189, 248, 0.16) 88deg, transparent 132deg),
    conic-gradient(from 35deg at 22% 62%, transparent 0deg, rgba(14, 165, 233, 0.16) 42deg, rgba(45, 212, 191, 0.18) 76deg, transparent 118deg),
    linear-gradient(120deg, transparent 0%, rgba(125, 211, 252, 0.08) 38%, rgba(45, 212, 191, 0.12) 52%, transparent 76%);
  filter: blur(22px);
  opacity: 0.78;
  transform: skewY(-5deg);
  mix-blend-mode: screen;
}

.partner-application-copy,
.partner-application-panel {
  position: relative;
  z-index: 1;
}

.partner-page .landing-footer {
  margin-top: 0;
  padding: 0.85rem 0;
  color: rgba(224, 242, 254, 0.78);
  background:
    radial-gradient(circle at 84% -25%, rgba(45, 212, 191, 0.18), transparent 20rem),
    radial-gradient(circle at 18% -10%, rgba(56, 189, 248, 0.1), transparent 18rem),
    linear-gradient(
      180deg,
      rgba(4, 47, 46, 0.24) 0%,
      rgba(4, 47, 46, 0.22) 24%,
      rgba(8, 47, 73, 0.22) 58%,
      rgba(2, 6, 23, 0.28) 100%
    );
  border-top: 0;
}

.partner-page .landing-footer a {
  color: rgba(224, 242, 254, 0.9);
  text-decoration-color: rgba(125, 211, 252, 0.42);
}

.partner-application-panel {
  padding: clamp(1.1rem, 3vw, 1.5rem);
}

.partner-application-form {
  display: grid;
  gap: 1rem;
}

.partner-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.partner-form-field {
  min-width: 0;
}

.partner-application-form .form-label {
  color: #bae6fd;
  font-size: 0.8rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.partner-application-form .form-control {
  color: #f8fafc;
  background: rgba(2, 6, 23, 0.66);
  border-color: rgba(125, 211, 252, 0.28);
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.partner-application-form .form-control:focus {
  color: #ffffff;
  background: rgba(2, 6, 23, 0.84);
  border-color: #67e8f9;
  box-shadow:
    0 0 0 0.18rem rgba(103, 232, 249, 0.16),
    0 0 28px rgba(45, 212, 191, 0.12);
}

.partner-application-form textarea.form-control {
  min-height: 9rem;
  resize: vertical;
}

.partner-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
  align-items: center;
  justify-content: space-between;
}

.partner-form-actions span {
  color: rgba(224, 242, 254, 0.68);
  font-size: 0.95rem;
  font-weight: 750;
}

@media (max-width: 1100px) {
  .partner-payout-panel {
    grid-template-columns: 1fr;
  }

  .partner-payout-panel > div {
    min-height: 0;
  }
}

@media (max-width: 991px) {
  .partner-hero,
  .partner-how-grid,
  .partner-payouts,
  .partner-application-section {
    grid-template-columns: 1fr;
  }

  .partner-hero {
    min-height: auto;
    padding-top: 3rem;
  }

  .partner-hero-visual {
    min-height: 24rem;
  }

  .partner-hero-copy h1 {
    max-width: 11ch;
  }

  .partner-payout-copy h2,
  .partner-application-copy h2,
  .partner-section-heading h2 {
    max-width: 14ch;
  }
}

@media (max-width: 767px) {
  .partner-hero,
  .partner-section {
    padding-right: 0;
    padding-left: 0;
  }

  .partner-hero-copy h1 {
    font-size: clamp(2.35rem, 12vw, 3.2rem);
  }

  .partner-hero-copy p,
  .partner-section-heading p,
  .partner-payout-copy p,
  .partner-application-copy p {
    max-width: 31ch;
  }

  .partner-hero-actions,
  .partner-form-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .partner-hero-actions .btn,
  .partner-form-actions .btn {
    width: 100%;
  }

  .partner-hero-visual {
    min-height: 21rem;
  }

  .partner-payout-orbit {
    right: auto;
    bottom: 8%;
    left: 1rem;
    width: calc(100% - 2rem);
  }

  .partner-orbit-note-top {
    top: 8%;
    right: 0.5rem;
  }

  .partner-orbit-note-bottom {
    bottom: 38%;
    left: 0.5rem;
  }

  .partner-form-grid {
    grid-template-columns: 1fr;
  }
}

.hero-card {
  background: rgba(15, 23, 42, 0.82);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 40px 100px rgba(0, 0, 0, 0.22);
}

.form-card {
  position: relative;
  overflow: hidden;
  background: linear-gradient(
    145deg,
    rgba(255, 255, 255, 0.98),
    rgba(241, 245, 249, 0.96)
  );
  border: 1px solid rgba(148, 163, 184, 0.32);
  border-radius: 1.15rem;
  box-shadow:
    0 28px 74px rgba(2, 6, 23, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.78);
  color: #111827;
}

.form-card::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    radial-gradient(
      circle at top right,
      rgba(96, 165, 250, 0.16),
      transparent 24%
    ),
    linear-gradient(90deg, rgba(15, 23, 42, 0.04) 1px, transparent 1px),
    linear-gradient(rgba(15, 23, 42, 0.04) 1px, transparent 1px);
  background-size:
    auto,
    48px 48px,
    48px 48px;
  opacity: 0.62;
}

.form-card > .card-body {
  position: relative;
  z-index: 1;
}

.form-card .form-label {
  font-weight: 600;
  letter-spacing: 0.03em;
}

.form-control {
  color: #0f172a;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(148, 163, 184, 0.55);
  border-radius: 0.75rem;
}

input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: 0.96;
  filter: invert(1) brightness(1.18) contrast(1.08);
}

input[type="date"]:disabled::-webkit-calendar-picker-indicator,
input[type="time"]:disabled::-webkit-calendar-picker-indicator {
  cursor: not-allowed;
  opacity: 0.52;
}

.form-control:focus {
  background: #ffffff;
  border-color: #60a5fa;
  box-shadow: 0 0 0 0.22rem rgba(96, 165, 250, 0.18);
}

.telegram-steps {
  display: grid;
  gap: 1rem;
}

.telegram-connected-panel {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
  background: rgba(219, 234, 254, 0.7);
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 0.85rem;
}

.telegram-connected-panel span {
  color: #0f172a;
  font-weight: 800;
}

.telegram-replace-workflow {
  transition:
    filter 0.18s ease,
    opacity 0.18s ease;
}

.telegram-replace-workflow-locked {
  opacity: 0.48;
  filter: grayscale(0.35);
}

.telegram-step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem;
  padding: 1rem;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.85rem;
}

.telegram-step-disabled {
  opacity: 0.64;
}

.telegram-step-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  color: #ffffff;
  font-weight: 800;
  background: #2563eb;
  border-radius: 50%;
}

.telegram-password-input::placeholder {
  font-size: 0.9rem;
}

.passkey-register-panel,
.passkey-list-item {
  padding: 1rem;
  background: rgba(255, 255, 255, 0.74);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.85rem;
}

.passkey-list {
  display: grid;
  gap: 0.85rem;
}

.passkey-list-item {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
}

.authenticator-setup-box {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  padding: 1rem;
  background: rgba(255, 255, 255, 0.74);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.85rem;
}

.authenticator-qr-code {
  width: 10rem;
  max-width: 100%;
  height: auto;
  padding: 0.5rem;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 0.65rem;
}

.authenticator-secret {
  display: inline-block;
  max-width: 100%;
  padding: 0.55rem 0.65rem;
  color: #0f172a;
  overflow-wrap: anywhere;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 0.5rem;
}

.invite-space-page {
  position: relative;
  min-height: calc(100vh - 5.5rem);
  isolation: isolate;
}

body.invite-intro-active {
  overflow: hidden;
}

.invite-starfield {
  position: absolute;
  top: -4rem;
  right: calc(50% - 50vw);
  bottom: -4rem;
  left: calc(50% - 50vw);
  z-index: -1;
  min-height: calc(100vh + 8rem);
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(circle at 8% 18%, rgba(255, 255, 255, 0.9) 0 1px, transparent 1.7px),
    radial-gradient(circle at 18% 62%, rgba(125, 211, 252, 0.8) 0 1px, transparent 1.6px),
    radial-gradient(circle at 36% 30%, rgba(255, 255, 255, 0.72) 0 1px, transparent 1.7px),
    radial-gradient(circle at 55% 74%, rgba(94, 234, 212, 0.75) 0 1px, transparent 1.6px),
    radial-gradient(circle at 72% 22%, rgba(255, 255, 255, 0.92) 0 1px, transparent 1.7px),
    radial-gradient(circle at 86% 58%, rgba(147, 197, 253, 0.8) 0 1px, transparent 1.6px),
    linear-gradient(135deg, #020617 0%, #0f172a 46%, #082f49 100%);
  background-size:
    260px 220px,
    320px 260px,
    360px 300px,
    280px 240px,
    420px 320px,
    340px 290px,
    auto;
}

.invite-starfield::before,
.invite-starfield::after {
  position: absolute;
  inset: 0;
  content: "";
  background:
    radial-gradient(circle, rgba(255, 255, 255, 0.78) 0 1px, transparent 1.5px),
    linear-gradient(90deg, rgba(125, 211, 252, 0.08) 1px, transparent 1px),
    linear-gradient(rgba(125, 211, 252, 0.08) 1px, transparent 1px);
  background-position:
    22px 28px,
    0 0,
    0 0;
  background-size:
    118px 96px,
    72px 72px,
    72px 72px;
  opacity: 0.42;
}

.invite-starfield::after {
  display: none;
}

@keyframes invite-star-drift {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    transform: translate3d(-72px, 36px, 0);
  }
}

.invite-shell {
  position: relative;
  overflow: hidden;
  padding: clamp(1.35rem, 3vw, 2.4rem);
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.92), rgba(15, 23, 42, 0.84)),
    radial-gradient(circle at 20% 8%, rgba(125, 211, 252, 0.18), transparent 30%);
  border: 1px solid rgba(125, 211, 252, 0.24);
  border-radius: 1rem;
  box-shadow:
    0 34px 90px rgba(2, 6, 23, 0.52),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(18px);
}

.invite-space-page-intro-pending .invite-shell {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.invite-space-page-intro-pending .invite-shell::before {
  opacity: 0;
}

.invite-space-page-intro-pending .invite-stage-wrap {
  min-height: 0;
  padding: 0;
  background: transparent;
  border-color: transparent;
}

.invite-space-page-intro-pending .invite-command-header,
.invite-space-page-intro-pending .invite-progress-timeline,
.invite-space-page-intro-pending .invite-stage-heading,
.invite-space-page-intro-pending .invite-reveal-form {
  opacity: 0;
  visibility: hidden;
  transform: translateY(1rem);
}

.invite-space-page-ready .invite-shell {
  animation: invite-panel-materialize 0.68s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.invite-space-page-ready .invite-stage-wrap {
  animation: invite-panel-materialize 0.72s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.invite-space-page-ready .invite-command-header,
.invite-space-page-ready .invite-progress-timeline,
.invite-space-page-ready .invite-stage-heading {
  animation: invite-panel-content-rise 0.58s ease both;
}

.invite-shell::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(rgba(125, 211, 252, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(125, 211, 252, 0.055) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.9), transparent 92%);
}

@keyframes invite-panel-materialize {
  from {
    opacity: 0;
    transform: translateY(1.25rem) scale(0.975);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes invite-panel-content-rise {
  from {
    opacity: 0;
    transform: translateY(0.9rem);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.invite-command-header,
.invite-progress-timeline,
.invite-stage-wrap {
  position: relative;
  z-index: 1;
}

.invite-command-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  margin-bottom: 1.35rem;
}

.invite-command-header h2 {
  color: #ffffff;
  font-size: 3rem;
  line-height: 1.05;
}

.invite-command-header p,
.invite-stage-heading p,
.invite-status-panel span,
.invite-progress-node small,
.invite-shell .form-text,
.invite-shell .form-check-label {
  color: rgba(224, 242, 254, 0.76);
}

.invite-kicker,
.invite-stage-chip,
.invite-mission-code {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.35rem 0.7rem;
  color: #67e8f9;
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: rgba(14, 165, 233, 0.12);
  border: 1px solid rgba(125, 211, 252, 0.26);
  border-radius: 999px;
}

.invite-mission-code {
  color: #ccfbf1;
  background: rgba(20, 184, 166, 0.12);
}

.invite-progress-timeline {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
  margin-bottom: 1rem;
}

.invite-progress-timeline::before {
  position: absolute;
  top: 1.45rem;
  right: 1.25rem;
  left: 1.25rem;
  height: 2px;
  pointer-events: none;
  content: "";
  background: linear-gradient(90deg, #5eead4, #67e8f9);
  opacity: 0.46;
}

.invite-progress-node {
  position: relative;
  z-index: 1;
  flex: 1 1 150px;
  min-width: 0;
  padding: 2.45rem 0.85rem 0.85rem;
  color: rgba(224, 242, 254, 0.76);
  background: rgba(15, 23, 42, 0.76);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 0.65rem;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease;
}

a.invite-progress-node {
  text-decoration: none;
}

a.invite-progress-node:hover,
a.invite-progress-node:focus {
  color: rgba(224, 242, 254, 0.9);
  border-color: rgba(103, 232, 249, 0.62);
  box-shadow: 0 0 22px rgba(14, 165, 233, 0.14);
  transform: translateY(-2px);
}

a.invite-progress-node:focus-visible {
  outline: 3px solid rgba(103, 232, 249, 0.42);
  outline-offset: 3px;
}

.invite-progress-node span,
.invite-progress-node strong,
.invite-progress-node small {
  display: block;
}

.invite-progress-node span {
  position: absolute;
  top: 0.72rem;
  left: 0.85rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.55rem;
  height: 1.55rem;
  color: #67e8f9;
  font-size: 0.78rem;
  font-weight: 900;
  background: #020617;
  border: 1px solid rgba(103, 232, 249, 0.5);
  border-radius: 50%;
}

.invite-progress-node strong {
  overflow: hidden;
  color: #f8fafc;
  font-size: 0.92rem;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.invite-progress-node.active {
  border-color: rgba(103, 232, 249, 0.72);
  box-shadow: 0 0 26px rgba(14, 165, 233, 0.18);
  transform: translateY(-2px);
}

.invite-progress-node.active::before {
  position: absolute;
  top: 1.48rem;
  right: 3.65rem;
  width: min(9rem, calc(100% - 4.6rem));
  height: 0.24rem;
  pointer-events: none;
  content: "";
  background:
    radial-gradient(circle at 100% 50%, rgba(186, 230, 253, 0.95) 0 0.12rem, transparent 0.14rem),
    linear-gradient(90deg, transparent, rgba(103, 232, 249, 0.12) 12%, rgba(103, 232, 249, 0.72) 82%, rgba(224, 242, 254, 0.9));
  border-radius: 999px;
  box-shadow:
    0 0 10px rgba(103, 232, 249, 0.34),
    0 0 18px rgba(14, 165, 233, 0.18);
}

.invite-progress-node.active::after {
  position: absolute;
  top: 0.92rem;
  right: 0.85rem;
  width: 3.15rem;
  height: 1.35rem;
  content: "";
  background:
    radial-gradient(circle at 69% 50%, #0f172a 0 0.13rem, #bae6fd 0.15rem 0.28rem, transparent 0.3rem),
    linear-gradient(135deg, transparent 0 48%, #bae6fd 49% 100%),
    linear-gradient(45deg, transparent 0 48%, #67e8f9 49% 100%),
    linear-gradient(90deg, transparent 0, rgba(103, 232, 249, 0.5) 36%, transparent 76%),
    linear-gradient(90deg, #e0f2fe 0 62%, #67e8f9 63% 100%);
  background-repeat: no-repeat;
  background-position:
    1.1rem 50%,
    0.25rem 0.02rem,
    0.25rem calc(100% - 0.02rem),
    0 50%,
    0.7rem 50%;
  background-size:
    1.6rem 0.86rem,
    0.88rem 0.48rem,
    0.88rem 0.48rem,
    0.95rem 0.28rem,
    2.1rem 0.78rem;
  border-radius: 45% 55% 55% 45% / 50%;
  clip-path: polygon(0 38%, 18% 38%, 30% 0, 76% 17%, 100% 50%, 76% 83%, 30% 100%, 18% 62%, 0 62%);
  filter: drop-shadow(0 0 10px rgba(103, 232, 249, 0.55));
}

.invite-progress-node.complete {
  border-color: rgba(94, 234, 212, 0.48);
  background:
    linear-gradient(145deg, rgba(20, 184, 166, 0.18), rgba(15, 23, 42, 0.82));
}

.invite-stage-wrap {
  min-height: 470px;
  padding: clamp(1rem, 3vw, 1.5rem);
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.82), rgba(8, 47, 73, 0.5)),
    radial-gradient(circle at 92% 0%, rgba(125, 211, 252, 0.14), transparent 28%);
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-radius: 0.85rem;
}

.invite-stage {
  animation: invite-stage-enter 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes invite-stage-enter {
  from {
    opacity: 0;
    transform: translateY(18px) scale(0.985);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.invite-stage-heading {
  max-width: 680px;
  margin-bottom: 1.25rem;
}

.invite-intro {
  position: fixed;
  inset: 0;
  z-index: 1060;
  display: grid;
  grid-template-columns: minmax(0, 720px);
  gap: clamp(0.75rem, 2vw, 1.2rem);
  align-items: center;
  justify-content: center;
  justify-items: center;
  width: 100vw;
  height: 100vh;
  min-height: 100vh;
  padding: clamp(1.25rem, 5vw, 4rem);
  overflow: hidden;
  text-align: center;
  background:
    radial-gradient(circle at 28% 42%, rgba(103, 232, 249, 0.24), transparent 28%),
    radial-gradient(circle at 76% 20%, rgba(94, 234, 212, 0.14), transparent 26%),
    radial-gradient(circle at 14% 80%, rgba(147, 197, 253, 0.16), transparent 24%),
    linear-gradient(145deg, #020617, #0f172a 54%, #082f49);
  border: 0;
  border-radius: 0;
  animation: invite-intro-arrive 0.72s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.invite-intro::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    radial-gradient(circle at 8% 18%, rgba(255, 255, 255, 0.82) 0 1px, transparent 1.6px),
    radial-gradient(circle at 18% 62%, rgba(125, 211, 252, 0.72) 0 1px, transparent 1.6px),
    radial-gradient(circle at 36% 30%, rgba(255, 255, 255, 0.64) 0 1px, transparent 1.7px),
    radial-gradient(circle at 55% 74%, rgba(94, 234, 212, 0.68) 0 1px, transparent 1.6px),
    radial-gradient(circle at 72% 22%, rgba(255, 255, 255, 0.82) 0 1px, transparent 1.7px),
    radial-gradient(circle at 86% 58%, rgba(147, 197, 253, 0.72) 0 1px, transparent 1.6px);
  background-size:
    260px 220px,
    320px 260px,
    360px 300px,
    280px 240px,
    420px 320px,
    340px 290px;
  opacity: 0.72;
}

.invite-intro-complete {
  animation: invite-intro-panel-morph 0.82s cubic-bezier(0.65, 0, 0.35, 1) both;
}

.invite-intro-orbit {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: clamp(10rem, 26vw, 16rem);
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translateY(4.75rem);
}

.invite-intro-orbit::before,
.invite-intro-orbit::after {
  position: absolute;
  inset: 30% 5%;
  z-index: 0;
  content: "";
  border: 1px solid rgba(125, 211, 252, 0.28);
  border-right-color: rgba(94, 234, 212, 0.74);
  border-left-color: rgba(94, 234, 212, 0.22);
  border-radius: 50%;
  transform: rotate(45deg) scaleY(0.42);
  animation: invite-intro-ring-orbit 14s ease-in-out infinite;
}

.invite-intro-orbit::after {
  inset: 34% 14%;
  border-color: rgba(186, 230, 253, 0.2);
  border-right-color: rgba(186, 230, 253, 0.68);
  border-left-color: rgba(186, 230, 253, 0.16);
  transform: rotate(45deg) scaleY(0.38);
  animation-duration: 18s;
  animation-delay: -5s;
}

.invite-intro-planet {
  position: relative;
  z-index: 1;
  width: clamp(5rem, 10vw, 6.6rem);
  aspect-ratio: 1;
  background:
    radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.9), transparent 0.52rem),
    linear-gradient(145deg, #67e8f9, #2563eb 58%, #0f172a);
  border-radius: 50%;
  box-shadow:
    inset -0.9rem -0.7rem 1.2rem rgba(2, 6, 23, 0.34),
    0 0 42px rgba(103, 232, 249, 0.32);
}

.invite-intro-planet::after {
  position: absolute;
  inset: 44% -34%;
  content: "";
  background: linear-gradient(90deg, transparent 0 14%, rgba(204, 251, 241, 0.42) 35%, rgba(240, 253, 250, 0.88) 50%, rgba(125, 211, 252, 0.46) 65%, transparent 86% 100%);
  background-position: 0 50%;
  background-size: 220% 100%;
  border-radius: 50%;
  transform: rotate(45deg) scaleY(0.58);
  animation: invite-intro-planet-ring-shimmer 2.8s ease-in-out infinite;
}

.invite-intro-ship {
  position: absolute;
  top: 35%;
  left: 1%;
  z-index: 2;
  width: clamp(3.7rem, 7vw, 5rem);
  height: clamp(1.55rem, 3vw, 2.1rem);
  filter: drop-shadow(0 0 16px rgba(103, 232, 249, 0.72));
  transform-origin: 65% 50%;
  animation: invite-intro-ship-pass 2.4s cubic-bezier(0.4, 0, 0.2, 1) both;
}

.invite-intro-ship::before {
  position: absolute;
  top: 50%;
  left: -0.42rem;
  width: 1.75rem;
  height: 1rem;
  content: "";
  background:
    radial-gradient(circle at 74% 50%, #fef3c7 0 0.18rem, transparent 0.2rem),
    radial-gradient(circle at 58% 50%, #facc15 0 0.34rem, transparent 0.36rem),
    linear-gradient(90deg, rgba(244, 63, 94, 0), #fb7185 18%, #f97316 52%, #facc15 100%);
  border-radius: 78% 24% 24% 78% / 50% 40% 60% 50%;
  clip-path: polygon(0 50%, 28% 18%, 72% 28%, 100% 50%, 72% 72%, 28% 82%);
  filter: blur(0.25px) drop-shadow(0 0 10px rgba(249, 115, 22, 0.78));
  transform: translateY(-50%) scaleX(1);
}

.invite-intro-ship::after {
  position: absolute;
  inset: 0;
  content: "";
  background:
    radial-gradient(circle at 64% 50%, #0f172a 0 0.13rem, #bae6fd 0.15rem 0.33rem, transparent 0.35rem),
    linear-gradient(135deg, transparent 0 44%, #14b8a6 45% 100%),
    linear-gradient(45deg, transparent 0 44%, #0ea5e9 45% 100%),
    linear-gradient(90deg, #f43f5e 0 0.18rem, transparent 0.2rem),
    linear-gradient(90deg, #e0f2fe 0 54%, #f8fafc 55% 77%, #67e8f9 78% 100%);
  background-repeat: no-repeat;
  background-position:
    57% 50%,
    0.56rem 0.05rem,
    0.56rem calc(100% - 0.05rem),
    1rem 50%,
    0.95rem 50%;
  background-size:
    1.45rem 0.95rem,
    1rem 0.62rem,
    1rem 0.62rem,
    1.8rem 0.32rem,
    3.45rem 1.08rem;
  border-radius: 50% 999px 999px 50%;
  clip-path: polygon(0 36%, 17% 36%, 29% 10%, 78% 10%, 100% 50%, 78% 90%, 29% 90%, 17% 64%, 0 64%);
}

.invite-intro-copy h3 {
  margin: 0.75rem 0 0.35rem;
  color: #ffffff;
  font-size: clamp(2.2rem, 6vw, 4.6rem);
  font-weight: 850;
  line-height: 1.05;
}

.invite-intro-copy {
  position: relative;
  z-index: 1;
  max-width: 620px;
}

.invite-intro-copy p {
  max-width: 560px;
  margin: 0 auto;
  color: rgba(224, 242, 254, 0.76);
  font-size: clamp(1rem, 2vw, 1.18rem);
}

.invite-reveal-form:not(.invite-reveal-ready) .invite-field-group {
  display: none;
}

@keyframes invite-intro-arrive {
  from {
    opacity: 0;
    transform: scale(1.02);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes invite-intro-panel-morph {
  0% {
    opacity: 1;
    border-radius: 0;
    transform: translate3d(0, 0, 0) scale(1);
  }

  54% {
    opacity: 1;
    border-radius: 1rem;
    transform: translate3d(0, 0, 0) scale(0.86);
    box-shadow: 0 34px 90px rgba(2, 6, 23, 0.46);
  }

  to {
    opacity: 0;
    border-radius: 0.85rem;
    transform: translate3d(0, 8vh, 0) scale(0.42);
    visibility: hidden;
  }
}

@keyframes invite-intro-ring-orbit {
  0%,
  100% {
    opacity: 0.72;
    border-right-color: rgba(94, 234, 212, 0.72);
    border-left-color: rgba(94, 234, 212, 0.2);
    box-shadow: 0 0 0 rgba(94, 234, 212, 0);
  }

  50% {
    opacity: 0.92;
    border-right-color: rgba(94, 234, 212, 0.24);
    border-left-color: rgba(186, 230, 253, 0.72);
    box-shadow: 0 0 18px rgba(125, 211, 252, 0.18);
  }
}

@keyframes invite-intro-planet-ring-shimmer {
  0%,
  100% {
    opacity: 0.68;
    filter: drop-shadow(0 0 0 rgba(204, 251, 241, 0));
    background-position: 0 50%;
  }

  50% {
    opacity: 1;
    filter: drop-shadow(0 0 10px rgba(204, 251, 241, 0.34));
    background-position: 100% 50%;
  }
}

@keyframes invite-intro-ship-pass {
  0% {
    opacity: 0;
    transform: translate(-34%, 44%) rotate(-35deg) scale(0.82);
  }

  18% {
    opacity: 1;
    transform: translate(6.3%, 15.8%) rotate(-35deg) scale(0.86);
  }

  78% {
    opacity: 1;
    transform: translate(154%, -87.7%) rotate(-35deg) scale(1);
  }

  100% {
    opacity: 0;
    transform: translate(190%, -112.9%) rotate(-35deg) scale(0.9);
  }
}

.invite-stage-heading h3 {
  margin: 0.75rem 0 0.35rem;
  color: #ffffff;
  font-size: 2rem;
  font-weight: 850;
  line-height: 1.15;
}

.invite-reveal-form,
.invite-action-stack {
  display: grid;
  gap: 1rem;
}

.invite-sti-form {
  display: grid;
  gap: 1.55rem;
  width: 100%;
}

.invite-sti-form .invite-field-group {
  max-width: none;
  padding: 1.05rem;
  background:
    linear-gradient(145deg, rgba(14, 116, 144, 0.16), rgba(2, 6, 23, 0.28));
  border: 1px solid rgba(125, 211, 252, 0.16);
  border-radius: 0.75rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.invite-sti-form .invite-field-group + .invite-field-group {
  margin-top: 0;
}

.invite-email-verify-form .invite-field-group:first-of-type {
  margin-bottom: 1.1rem;
}

.invite-field-group {
  display: none;
  max-width: 720px;
  animation: invite-field-pop 0.42s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.invite-field-visible {
  display: block;
}

[data-telegram-choice] .form-label {
  display: block;
  margin-bottom: 0.65rem;
}

.invite-telegram-choice-grid {
  grid-template-columns: repeat(2, minmax(0, 12rem));
}

@keyframes invite-field-pop {
  from {
    opacity: 0;
    transform: translateY(16px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.invite-shell .form-label {
  color: #bae6fd;
  font-weight: 850;
  letter-spacing: 0.08em;
}

.invite-shell .form-control {
  color: #f8fafc;
  background: rgba(2, 6, 23, 0.68);
  border: 1px solid rgba(125, 211, 252, 0.28);
  border-radius: 0.65rem;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 12px 30px rgba(2, 6, 23, 0.22);
}

.invite-shell .form-control:focus {
  color: #ffffff;
  background: rgba(2, 6, 23, 0.82);
  border-color: #67e8f9;
  box-shadow:
    0 0 0 0.18rem rgba(103, 232, 249, 0.18),
    0 0 32px rgba(14, 165, 233, 0.18);
}

.invite-password-input-wrap {
  position: relative;
}

.invite-password-input-wrap .invite-password-input {
  padding-right: 3.25rem;
}

.invite-password-toggle {
  position: absolute;
  top: 50%;
  right: 0.65rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  padding: 0;
  color: #bae6fd;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 0.5rem;
  transform: translateY(-50%);
  transition:
    color 0.15s ease,
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.invite-password-toggle svg {
  width: 1.25rem;
  height: 1.25rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.9;
}

.invite-password-toggle:hover,
.invite-password-toggle:focus-visible {
  color: #ffffff;
  background: rgba(125, 211, 252, 0.12);
  border-color: rgba(125, 211, 252, 0.3);
  box-shadow: 0 0 20px rgba(14, 165, 233, 0.18);
}

.invite-password-toggle:focus-visible {
  outline: 3px solid rgba(96, 165, 250, 0.32);
  outline-offset: 2px;
}

.invite-password-toggle-eye-off,
.invite-password-toggle[aria-pressed="true"] .invite-password-toggle-eye {
  display: none;
}

.invite-password-toggle[aria-pressed="true"] .invite-password-toggle-eye-off {
  display: block;
}

input[type="file"],
.form-control[type="file"],
.invite-file-input {
  min-height: 3.1rem;
  padding: 0.42rem 0.55rem;
  overflow: hidden;
  color: #0f172a;
  cursor: pointer;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.97), rgba(240, 249, 255, 0.9)),
    rgba(255, 255, 255, 0.94);
  border-color: rgba(14, 165, 233, 0.3);
  border-radius: 0.72rem;
  box-shadow:
    0 14px 34px rgba(15, 23, 42, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
  transition:
    background-color 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    color 0.18s ease,
    filter 0.18s ease;
}

input[type="file"]:hover,
.form-control[type="file"]:hover,
.invite-file-input:hover {
  border-color: rgba(45, 212, 191, 0.52);
  box-shadow:
    0 16px 38px rgba(15, 23, 42, 0.1),
    0 0 24px rgba(103, 232, 249, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.76);
}

input[type="file"]:focus,
input[type="file"]:focus-visible,
.form-control[type="file"]:focus,
.form-control[type="file"]:focus-visible,
.invite-file-input:focus,
.invite-file-input:focus-visible {
  color: #0f172a;
  outline: none;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 1), rgba(236, 254, 255, 0.94)),
    #ffffff;
  border-color: #22d3ee;
  box-shadow:
    0 0 0 0.2rem rgba(34, 211, 238, 0.16),
    0 0 32px rgba(45, 212, 191, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

input[type="file"]::file-selector-button,
.form-control[type="file"]::file-selector-button,
.invite-file-input::file-selector-button,
input[type="file"]::-webkit-file-upload-button,
.form-control[type="file"]::-webkit-file-upload-button,
.invite-file-input::-webkit-file-upload-button {
  min-height: 2.22rem;
  margin: 0 0.95rem 0 0;
  padding: 0.62rem 1.15rem;
  color: #031525;
  font-size: 0.93em;
  font-weight: 850;
  line-height: 1;
  letter-spacing: 0;
  cursor: pointer;
  background:
    linear-gradient(110deg, transparent 0%, rgba(255, 255, 255, 0.78) 18%, transparent 36%) -140% 0 / 220% 100% no-repeat,
    linear-gradient(135deg, #e0f2fe 0%, var(--studio-cyan, #67e8f9) 48%, var(--studio-teal, #2dd4bf) 100%),
    var(--studio-cyan, #67e8f9);
  border: 1px solid rgba(8, 47, 73, 0.12);
  border-radius: 0.56rem;
  box-shadow:
    0 12px 30px rgba(45, 212, 191, 0.2),
    0 0 18px rgba(103, 232, 249, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.76);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease,
    background-position 0.36s ease,
    filter 0.18s ease;
}

input[type="file"]:focus::file-selector-button,
.form-control[type="file"]:focus::file-selector-button,
.invite-file-input:focus::file-selector-button,
input[type="file"]::file-selector-button:hover,
.form-control[type="file"]::file-selector-button:hover,
.invite-file-input::file-selector-button:hover,
input[type="file"]:focus::-webkit-file-upload-button,
.form-control[type="file"]:focus::-webkit-file-upload-button,
.invite-file-input:focus::-webkit-file-upload-button,
input[type="file"]::-webkit-file-upload-button:hover,
.form-control[type="file"]::-webkit-file-upload-button:hover,
.invite-file-input::-webkit-file-upload-button:hover {
  color: #020617;
  background-position:
    125% 0,
    0 0,
    0 0;
  border-color: rgba(224, 242, 254, 0.82);
  box-shadow:
    0 16px 38px rgba(45, 212, 191, 0.28),
    0 0 28px rgba(103, 232, 249, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.86);
  filter: saturate(1.08);
  transform: translateY(-1px);
  animation: file-upload-scan 1.6s ease-in-out infinite;
}

input[type="file"]::file-selector-button:active,
.form-control[type="file"]::file-selector-button:active,
.invite-file-input::file-selector-button:active,
input[type="file"]::-webkit-file-upload-button:active,
.form-control[type="file"]::-webkit-file-upload-button:active,
.invite-file-input::-webkit-file-upload-button:active {
  box-shadow:
    0 9px 24px rgba(45, 212, 191, 0.2),
    0 0 18px rgba(103, 232, 249, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
  transform: translateY(0) scale(0.99);
}

input[type="file"]:disabled,
.form-control[type="file"]:disabled,
.invite-file-input:disabled {
  cursor: not-allowed;
  opacity: 0.62;
  filter: grayscale(0.25);
}

input[type="file"]:disabled::file-selector-button,
.form-control[type="file"]:disabled::file-selector-button,
.invite-file-input:disabled::file-selector-button,
input[type="file"]:disabled::-webkit-file-upload-button,
.form-control[type="file"]:disabled::-webkit-file-upload-button,
.invite-file-input:disabled::-webkit-file-upload-button {
  cursor: not-allowed;
  transform: none;
  animation: none;
}

@keyframes file-upload-scan {
  0% {
    background-position:
      -140% 0,
      0 0,
      0 0;
  }

  58%,
  100% {
    background-position:
      130% 0,
      0 0,
      0 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  input[type="file"],
  .form-control[type="file"],
  .invite-file-input,
  input[type="file"]::file-selector-button,
  .form-control[type="file"]::file-selector-button,
  .invite-file-input::file-selector-button,
  input[type="file"]::-webkit-file-upload-button,
  .form-control[type="file"]::-webkit-file-upload-button,
  .invite-file-input::-webkit-file-upload-button {
    transition: none;
    animation: none;
  }
}

.invite-password-rules {
  display: grid;
  gap: 0.55rem;
  margin-top: 0.85rem;
  padding: 0.85rem;
  color: #fee2e2;
  background: rgba(127, 29, 29, 0.28);
  border: 1px solid rgba(248, 113, 113, 0.46);
  border-radius: 0.65rem;
  box-shadow: 0 0 0 0.12rem rgba(248, 113, 113, 0.08);
}

.invite-password-rules strong {
  color: #fecaca;
  font-size: 0.9rem;
  font-weight: 850;
}

.invite-password-rules ul {
  display: grid;
  gap: 0.35rem;
  padding: 0;
  margin: 0;
  list-style: none;
}

.invite-password-rules li {
  display: flex;
  gap: 0.45rem;
  align-items: center;
  color: #fecaca;
  font-size: 0.9rem;
  font-weight: 750;
}

.invite-password-rules li::before {
  display: inline-flex;
  flex: 0 0 1.15rem;
  align-items: center;
  justify-content: center;
  width: 1.15rem;
  height: 1.15rem;
  color: #7f1d1d;
  font-size: 0.78rem;
  font-weight: 900;
  content: "!";
  background: #fecaca;
  border-radius: 50%;
}

.invite-password-rules li.complete {
  color: #bbf7d0;
}

.invite-password-rules li.complete::before {
  color: #052e2b;
  content: "✓";
  background: #5eead4;
}

.invite-password-rules.all-complete {
  color: #bbf7d0;
  background: rgba(6, 78, 59, 0.32);
  border-color: rgba(94, 234, 212, 0.48);
  box-shadow: 0 0 0 0.12rem rgba(94, 234, 212, 0.08);
}

.invite-password-rules.all-complete strong {
  color: #ccfbf1;
}

.invite-password-match {
  margin-top: 0.75rem;
  padding: 0.75rem 0.85rem;
  font-size: 0.9rem;
  font-weight: 800;
  border-radius: 0.65rem;
}

.invite-password-match.mismatch {
  color: #fecaca;
  background: rgba(127, 29, 29, 0.28);
  border: 1px solid rgba(248, 113, 113, 0.46);
}

.invite-password-match.match {
  color: #bbf7d0;
  background: rgba(6, 78, 59, 0.32);
  border: 1px solid rgba(94, 234, 212, 0.48);
}

.invite-consent-panel,
.invite-status-panel,
.invite-send-panel {
  padding: 1rem;
  background: rgba(2, 6, 23, 0.58);
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-radius: 0.7rem;
}

.invite-status-panel {
  display: grid;
  gap: 0.35rem;
  max-width: 720px;
  margin-bottom: 1rem;
}

.invite-status-panel strong {
  color: #f8fafc;
}

.invite-send-panel {
  display: flex;
  gap: 0.9rem;
  align-items: center;
  max-width: 720px;
  margin-bottom: 1rem;
}

.invite-send-panel strong,
.invite-send-panel p {
  display: block;
}

.invite-send-panel strong {
  color: #ffffff;
  font-weight: 850;
}

.invite-send-panel p {
  margin: 0.15rem 0 0;
  color: rgba(224, 242, 254, 0.74);
}

.invite-send-orbit,
.invite-send-envelope {
  position: relative;
  display: inline-flex;
  flex: 0 0 2.65rem;
  align-items: center;
  justify-content: center;
  width: 2.65rem;
  height: 2.65rem;
  border-radius: 50%;
}

.invite-send-orbit {
  background: rgba(14, 165, 233, 0.16);
  border: 1px solid rgba(103, 232, 249, 0.42);
}

.invite-send-orbit::before {
  width: 0.95rem;
  height: 0.95rem;
  content: "";
  background: #67e8f9;
  border-radius: 50%;
  box-shadow: 0 0 22px rgba(103, 232, 249, 0.65);
}

.invite-send-orbit::after {
  position: absolute;
  inset: 0.28rem;
  content: "";
  border: 2px solid rgba(103, 232, 249, 0.62);
  border-left-color: transparent;
  border-radius: 50%;
  animation: invite-orbit-spin 1s linear infinite;
}

.invite-send-envelope {
  background: rgba(20, 184, 166, 0.14);
  border: 1px solid rgba(94, 234, 212, 0.38);
  animation: invite-envelope-float 1.5s ease-in-out infinite;
}

.invite-send-envelope::before {
  width: 1.45rem;
  height: 0.95rem;
  content: "";
  background:
    linear-gradient(135deg, transparent 48%, #ccfbf1 49% 54%, transparent 55%),
    linear-gradient(45deg, transparent 48%, #ccfbf1 49% 54%, transparent 55%),
    rgba(94, 234, 212, 0.85);
  border: 1px solid rgba(204, 251, 241, 0.72);
  border-radius: 0.2rem;
  box-shadow: 0 0 20px rgba(94, 234, 212, 0.28);
}

.invite-send-panel-sent .invite-send-orbit::after,
.invite-send-panel-sent .invite-send-envelope {
  animation-duration: 2.6s;
}

@keyframes invite-orbit-spin {
  to {
    transform: rotate(1turn);
  }
}

@keyframes invite-envelope-float {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-0.24rem);
  }
}

.invite-launch-actions {
  padding-top: 0.25rem;
}

.invite-verify-submit {
  margin-top: 0.1rem;
}

.invite-shell .btn {
  border-radius: 0.6rem;
  font-weight: 850;
}

.invite-shell .btn-outline-primary {
  color: #bae6fd;
  border-color: rgba(125, 211, 252, 0.46);
}

.invite-shell .btn-outline-primary:hover,
.invite-shell .btn-outline-primary:focus {
  color: #042f2e;
  background: #67e8f9;
  border-color: #67e8f9;
}

.invite-google-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.25rem;
  align-items: end;
  max-width: 760px;
  padding: 1.1rem;
  margin: 0 0 1.3rem;
  background: rgba(15, 23, 42, 0.72);
  border: 1px solid rgba(125, 211, 252, 0.24);
  border-radius: 0.75rem;
  box-shadow: 0 18px 42px rgba(2, 6, 23, 0.2);
}

.invite-google-panel-main {
  display: grid;
  gap: 1rem;
}

.invite-google-telegram-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.invite-google-panel .invite-field-group {
  margin: 0;
}

.invite-google-panel .invite-consent-panel {
  margin: 0;
}

.invite-google-connected {
  align-items: center;
}

.invite-google-connected strong,
.invite-google-connected span {
  display: block;
}

.invite-google-connected span {
  color: rgba(224, 242, 254, 0.82);
}

.invite-auth-divider {
  max-width: 760px;
  margin: 0 0 1.3rem;
  color: rgba(224, 242, 254, 0.72);
}

@media (max-width: 767.98px) {
  .invite-google-panel,
  .invite-google-telegram-fields {
    grid-template-columns: 1fr;
  }

  .invite-google-panel .btn-google-auth {
    width: 100%;
  }
}

.invite-shell .alert {
  max-width: 720px;
}

.invite-shell .invite-sti-source-choice .alert,
.invite-shell .invite-sti-form .alert {
  width: 100%;
  max-width: none;
}

body.signup-complete-active {
  overflow: hidden;
}

.signup-complete-page {
  position: fixed;
  inset: 0;
  z-index: 1060;
  display: grid;
  place-items: center;
  width: 100vw;
  height: 100vh;
  min-height: 100vh;
  margin: 0;
  overflow: hidden;
  color: #f8fafc;
  background:
    radial-gradient(circle at 50% 82%, rgba(103, 232, 249, 0.28), transparent 26%),
    radial-gradient(circle at 18% 18%, rgba(94, 234, 212, 0.16), transparent 24%),
    linear-gradient(180deg, #020617 0%, #0f172a 54%, #082f49 100%);
  animation: signup-complete-flash 4.2s ease both;
}

.signup-complete-stars {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 8% 18%, rgba(255, 255, 255, 0.86) 0 1px, transparent 1.6px),
    radial-gradient(circle at 18% 62%, rgba(125, 211, 252, 0.72) 0 1px, transparent 1.6px),
    radial-gradient(circle at 36% 30%, rgba(255, 255, 255, 0.64) 0 1px, transparent 1.7px),
    radial-gradient(circle at 55% 74%, rgba(94, 234, 212, 0.7) 0 1px, transparent 1.6px),
    radial-gradient(circle at 72% 22%, rgba(255, 255, 255, 0.82) 0 1px, transparent 1.7px),
    radial-gradient(circle at 86% 58%, rgba(147, 197, 253, 0.72) 0 1px, transparent 1.6px);
  background-size:
    260px 220px,
    320px 260px,
    360px 300px,
    280px 240px,
    420px 320px,
    340px 290px;
  animation: signup-star-rush 4.2s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.signup-complete-panel {
  position: absolute;
  top: clamp(4rem, 10vh, 7rem);
  right: 1.25rem;
  left: 1.25rem;
  z-index: 2;
  width: min(820px, calc(100vw - 2.5rem));
  padding: clamp(1.1rem, 3vw, 1.65rem);
  margin: 0 auto;
  text-align: center;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.9), rgba(15, 23, 42, 0.78)),
    radial-gradient(circle at 78% 12%, rgba(103, 232, 249, 0.18), transparent 30%);
  border: 1px solid rgba(125, 211, 252, 0.24);
  border-radius: 0.9rem;
  box-shadow:
    0 34px 90px rgba(2, 6, 23, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(16px);
  animation: signup-panel-collapse 4.2s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.signup-complete-copy h2 {
  margin: 0.8rem 0 0.45rem;
  color: #ffffff;
  font-size: clamp(2.4rem, 7vw, 5.4rem);
  font-weight: 900;
  line-height: 1;
}

.signup-complete-copy p {
  margin: 0;
  color: rgba(224, 242, 254, 0.78);
  font-size: clamp(1rem, 2vw, 1.2rem);
}

.signup-complete-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.6rem;
  max-width: 520px;
  margin: 1.2rem auto 0;
}

.signup-complete-steps span {
  height: 0.42rem;
  background: linear-gradient(90deg, #5eead4, #67e8f9);
  border-radius: 999px;
  box-shadow: 0 0 16px rgba(103, 232, 249, 0.3);
}

.signup-complete-launch {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: min(360px, 70vw);
  height: min(520px, 66vh);
  margin-top: clamp(4rem, 10vh, 7rem);
}

.signup-complete-pad {
  position: absolute;
  bottom: 4.2rem;
  width: min(320px, 72vw);
  height: 0.45rem;
  background: linear-gradient(90deg, transparent, rgba(186, 230, 253, 0.72), transparent);
  border-radius: 999px;
  box-shadow: 0 0 34px rgba(103, 232, 249, 0.38);
  animation: signup-pad-release 4.2s ease both;
}

.signup-complete-ship {
  position: absolute;
  bottom: 4.6rem;
  width: clamp(4.4rem, 12vw, 6.6rem);
  height: clamp(7.8rem, 22vw, 11rem);
  background:
    linear-gradient(140deg, transparent 0 24%, #bae6fd 25% 42%, transparent 43%),
    linear-gradient(220deg, transparent 0 24%, #67e8f9 25% 42%, transparent 43%),
    linear-gradient(180deg, #f8fafc 0 14%, #bae6fd 15% 62%, #22d3ee 63% 100%);
  border-radius: 54% 54% 18% 18% / 34% 34% 14% 14%;
  clip-path: polygon(50% 0, 82% 28%, 86% 64%, 100% 100%, 62% 86%, 38% 86%, 0 100%, 14% 64%, 18% 28%);
  filter: drop-shadow(0 0 24px rgba(103, 232, 249, 0.7));
  animation: signup-ship-blast 4.2s cubic-bezier(0.34, 0.02, 0.2, 1) both;
}

.signup-complete-window {
  position: absolute;
  top: 29%;
  left: 50%;
  width: 1.35rem;
  aspect-ratio: 1;
  background: radial-gradient(circle at 35% 32%, #ffffff, #67e8f9 48%, #0f172a 52%);
  border: 2px solid rgba(15, 23, 42, 0.36);
  border-radius: 50%;
  transform: translateX(-50%);
}

.signup-complete-plume {
  position: absolute;
  bottom: 0.4rem;
  width: clamp(5.8rem, 20vw, 10rem);
  height: clamp(8rem, 24vw, 13rem);
  background:
    radial-gradient(ellipse at 50% 18%, rgba(255, 255, 255, 0.95), transparent 24%),
    radial-gradient(ellipse at 50% 34%, rgba(103, 232, 249, 0.78), transparent 34%),
    radial-gradient(ellipse at 50% 62%, rgba(20, 184, 166, 0.36), transparent 54%);
  border-radius: 50% 50% 44% 44%;
  filter: blur(0.5px);
  transform-origin: 50% 0;
  animation: signup-plume-bloom 4.2s ease both;
}

@keyframes signup-star-rush {
  0% {
    opacity: 0.62;
    transform: translateY(0) scale(1);
  }

  72% {
    opacity: 0.84;
  }

  100% {
    opacity: 0.18;
    transform: translateY(34vh) scale(1.25);
  }
}

@keyframes signup-panel-collapse {
  0%,
  48% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }

  68% {
    opacity: 0.96;
    transform: translateY(9vh) scale(0.72);
    border-radius: 1.1rem;
  }

  100% {
    opacity: 0;
    transform: translateY(34vh) scale(0.16);
    border-radius: 999px;
  }
}

@keyframes signup-pad-release {
  0%,
  48% {
    opacity: 1;
    transform: scaleX(1);
  }

  100% {
    opacity: 0;
    transform: scaleX(0.34);
  }
}

@keyframes signup-ship-blast {
  0% {
    transform: translateY(0) scale(0.94);
  }

  34% {
    transform: translateY(0) scale(1);
  }

  62% {
    transform: translateY(-20vh) scale(1.04);
  }

  100% {
    transform: translateY(-84vh) scale(0.72);
  }
}

@keyframes signup-plume-bloom {
  0% {
    opacity: 0;
    transform: scaleY(0.1) scaleX(0.38);
  }

  30% {
    opacity: 0.9;
  }

  62% {
    opacity: 1;
    transform: scaleY(1) scaleX(0.74);
  }

  100% {
    opacity: 0;
    transform: scaleY(1.75) scaleX(1.25);
  }
}

@keyframes signup-complete-flash {
  0%,
  80% {
    opacity: 1;
  }

  100% {
    opacity: 0.92;
    background:
      radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.7), rgba(103, 232, 249, 0.22) 26%, transparent 58%),
      linear-gradient(180deg, #020617 0%, #0f172a 54%, #082f49 100%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .invite-starfield::before,
  .invite-starfield::after,
  .invite-stage,
  .invite-field-group,
  .invite-intro,
  .invite-intro-orbit::before,
  .invite-intro-orbit::after,
  .invite-intro-planet::after,
  .invite-intro-ship,
  .invite-send-orbit::after,
  .invite-send-envelope,
  .signup-complete-page,
  .signup-complete-stars,
  .signup-complete-panel,
  .signup-complete-pad,
  .signup-complete-ship,
  .signup-complete-plume {
    animation: none;
  }
}

.collab-steps {
  display: grid;
  gap: 1rem;
}

.collab-step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem;
  padding: 1rem;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.85rem;
}

.collab-step-disabled {
  opacity: 0.64;
}

.collab-step-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  color: #ffffff;
  font-weight: 800;
  background: #2563eb;
  border-radius: 50%;
}

.collab-step-body {
  min-width: 0;
}

.collab-performer-option {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  padding: 0.7rem 0.9rem;
  color: #1e293b;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 0.55rem;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
  cursor: pointer;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.15s ease;
}

.collab-performer-grid {
  max-width: 780px;
}

.collab-performer-grid .col-sm-6 {
  flex: 0 0 auto;
  width: min(15rem, 100%);
}

.sti-performer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9.5rem, 12rem));
  gap: 0.65rem;
  align-items: stretch;
}

.collab-performer-option .collab-performer-input {
  position: absolute;
  opacity: 0;
}

.collab-performer-option:has(.collab-performer-input:checked),
.collab-performer-option-selected {
  color: #1d4ed8;
  background: #dbeafe;
  border-color: rgba(37, 99, 235, 0.42);
  box-shadow: 0 12px 24px rgba(37, 99, 235, 0.12);
}

.collab-performer-option:has(.collab-performer-input:focus-visible) {
  outline: 3px solid rgba(96, 165, 250, 0.32);
  outline-offset: 2px;
}

.collab-performer-option:hover {
  border-color: rgba(37, 99, 235, 0.34);
  transform: translateY(-1px);
}

.collab-performer-label {
  position: relative;
  z-index: 1;
}

.collab-performer-option-disabled {
  cursor: not-allowed;
  opacity: 0.62;
}

.collab-performer-option-disabled:hover {
  border-color: rgba(148, 163, 184, 0.42);
  transform: none;
}

.collab-performer-option-disabled .collab-performer-label {
  display: grid;
  gap: 0.15rem;
}

.collab-performer-option-disabled .collab-performer-label small {
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
}

.collab-activity-picker {
  display: grid;
  gap: 0.75rem;
}

.collab-activity-mode {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.collab-activity-mode-option,
.collab-activity-question label {
  display: grid;
  gap: 0.65rem;
  align-items: start;
  color: #1e293b;
  line-height: 1.3;
}

.collab-activity-mode-option,
.collab-activity-question label {
  position: relative;
  grid-template-columns: auto minmax(0, 1fr);
  min-height: 7.4rem;
  padding: 0.9rem;
  font-weight: 750;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 0.5rem;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
  cursor: pointer;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.15s ease;
}

.collab-activity-mode-option input,
.collab-activity-question input {
  position: absolute;
  margin-top: 0.15rem;
  opacity: 0;
}

.collab-activity-mode-option:has(input:checked),
.collab-activity-question label:has(input:checked) {
  background: #dbeafe;
  border-color: rgba(37, 99, 235, 0.42);
  box-shadow: 0 12px 24px rgba(37, 99, 235, 0.12);
}

.collab-activity-mode-option:has(input:focus-visible),
.collab-activity-question label:has(input:focus-visible) {
  outline: 3px solid rgba(96, 165, 250, 0.32);
  outline-offset: 2px;
}

.collab-activity-mode-option:hover,
.collab-activity-question label:hover {
  border-color: rgba(37, 99, 235, 0.34);
  transform: translateY(-1px);
}

.collab-option-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.3rem;
  height: 2.3rem;
  color: #1d4ed8;
  background: #eff6ff;
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 0.5rem;
}

.collab-option-icon svg {
  width: 1.35rem;
  height: 1.35rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.collab-option-copy {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}

.collab-option-copy strong {
  color: #0f172a;
  font-size: 0.98rem;
  line-height: 1.25;
}

.collab-option-copy small {
  color: #475569;
  font-size: 0.84rem;
  font-weight: 600;
  line-height: 1.35;
}

.collab-activity-guided,
.collab-activity-manual {
  display: grid;
  gap: 0.75rem;
}

.collab-activity-manual-suggested {
  gap: 0.35rem;
  margin-top: 0.75rem;
}

.collab-activity-manual-suggested .collab-activity-suggestions:empty {
  min-height: 0;
}

.collab-activity-guided[hidden],
.collab-activity-manual[hidden] {
  display: none;
}

.collab-activity-search-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.6rem;
  align-items: stretch;
}

.collab-activity-show-all {
  white-space: nowrap;
}

.collab-activity-question {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 0;
  padding: 0.85rem;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 0.75rem;
}

.collab-activity-question legend {
  float: none;
  grid-column: 1 / -1;
  width: auto;
  margin-bottom: 0.1rem;
  color: #0f172a;
  font-size: 0.95rem;
  font-weight: 800;
}

.collab-activity-help {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 1.25rem;
  height: 1.25rem;
  color: #2563eb;
  font-size: 0.82rem;
  font-weight: 900;
  line-height: 1;
  cursor: help;
  background: #dbeafe;
  border: 1px solid rgba(37, 99, 235, 0.3);
  border-radius: 50%;
}

.collab-activity-help::after {
  position: absolute;
  bottom: calc(100% + 0.55rem);
  left: 50%;
  z-index: 20;
  width: min(18rem, 82vw);
  padding: 0.65rem 0.75rem;
  color: #0f172a;
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1.35;
  text-transform: none;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 0.5rem;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.16);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 0.25rem);
  transition: opacity 0.15s ease, transform 0.15s ease;
  content: attr(data-help);
}

.collab-activity-help:hover::after,
.collab-activity-help:focus::after {
  opacity: 1;
  transform: translate(-50%, 0);
}

.collab-activity-select-native {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.sti-performer-select-native {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.collab-activity-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  min-height: 2.35rem;
}

.collab-activity-option {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 2.35rem;
  padding: 0.45rem 0.75rem;
  color: #1e293b;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 999px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

.collab-activity-option-selected {
  color: #1d4ed8;
  background: #dbeafe;
  border-color: rgba(37, 99, 235, 0.32);
}

.collab-activity-more {
  min-width: 2.8rem;
  justify-content: center;
}

@media (max-width: 575.98px) {
  .collab-activity-search-row {
    grid-template-columns: 1fr;
  }
}

.collab-activity-selected {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  min-height: 2.25rem;
}

.collab-activity-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  max-width: 100%;
  padding: 0.35rem 0.65rem;
  color: #1e293b;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  background: #dbeafe;
  border: 1px solid rgba(37, 99, 235, 0.24);
  border-radius: 999px;
}

.collab-activity-chip::after {
  content: "x";
  color: #2563eb;
  font-weight: 900;
}

.sti-steps {
  display: grid;
  gap: 1rem;
}

#contract-manager-steps .contract-branch:not([hidden]) {
  display: grid;
  gap: 1rem;
}

#contract-manager-steps .contract-branch[hidden] {
  display: none !important;
}

.sti-step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem;
  padding: 1rem;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.85rem;
}

.sti-step-disabled {
  opacity: 0.64;
}

.sti-step-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  color: #ffffff;
  font-weight: 800;
  background: #2563eb;
  border-radius: 50%;
}

.sti-step-body {
  min-width: 0;
}

.sti-test-picker {
  display: grid;
  gap: 0.75rem;
}

.sti-test-mode,
.sti-test-site-mode,
.sti-test-type-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.sti-test-type-options {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.sti-test-mode-option,
.sti-test-type-option {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.65rem;
  align-items: start;
  min-height: 7.4rem;
  padding: 0.9rem;
  color: #1e293b;
  font-weight: 750;
  line-height: 1.3;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 0.5rem;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
  cursor: pointer;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.15s ease;
}

.sti-test-mode-option input,
.sti-test-type-option input {
  position: absolute;
  margin-top: 0.15rem;
  opacity: 0;
}

.sti-test-mode-option:has(input:checked),
.sti-test-type-option:has(input:checked) {
  background: #dbeafe;
  border-color: rgba(37, 99, 235, 0.42);
  box-shadow: 0 12px 24px rgba(37, 99, 235, 0.12);
}

.sti-test-mode-option:has(input:focus-visible),
.sti-test-type-option:has(input:focus-visible) {
  outline: 3px solid rgba(96, 165, 250, 0.32);
  outline-offset: 2px;
}

.sti-test-mode-option:hover,
.sti-test-type-option:hover {
  border-color: rgba(37, 99, 235, 0.34);
  transform: translateY(-1px);
}

.contract-template-options {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
}

.contract-template-option {
  grid-template-columns: minmax(0, 1fr);
  min-height: 7rem;
  padding: 1rem 4.25rem 1rem 1rem;
}

.contract-template-option .collab-option-icon {
  position: absolute;
  top: 1rem;
  right: 1rem;
}

.contract-signature-panel {
  padding-top: 1rem;
  border-top: 1px solid rgba(148, 163, 184, 0.32);
}

.contract-signature-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  min-height: 2.1rem;
}

.contract-signature-chip {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 2.1rem;
  padding: 0.35rem 0.65rem;
  color: #1e293b;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 999px;
}

.onboarding-edit-section {
  display: grid;
  gap: 1rem;
  padding: 1.1rem 0;
  border-top: 1px solid rgba(148, 163, 184, 0.24);
}

.onboarding-edit-section:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.onboarding-edit-section-heading {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.85rem;
  align-items: center;
}

.onboarding-edit-section-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.65rem;
  height: 2.65rem;
  color: #075985;
  background: #e0f2fe;
  border: 1px solid rgba(14, 165, 233, 0.22);
  border-radius: 0.5rem;
}

.onboarding-edit-section-icon svg {
  width: 1.35rem;
  height: 1.35rem;
}

.onboarding-edit-section-icon path,
.onboarding-edit-section-icon circle {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.onboarding-status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.32rem 0.68rem;
  color: #92400e;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.2;
  text-transform: uppercase;
  background: #fffbeb;
  border: 1px solid rgba(217, 119, 6, 0.24);
  border-radius: 999px;
}

.onboarding-inline-panel {
  display: grid;
  gap: 0.8rem;
  padding: 1rem;
  color: #0f172a;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.5rem;
}

.onboarding-contract-mode-option {
  min-height: 6.7rem;
}

.onboarding-medication-options {
  grid-template-columns: 1fr;
}

.contract-default-panel[hidden],
.contract-custom-panel[hidden] {
  display: none;
}

.contract-builder-ai-panel {
  display: grid;
  gap: 0.95rem;
  padding: 0.25rem 0 1rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.28);
}

.contract-assistant-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
  justify-content: space-between;
}

.contract-assistant-status {
  flex: 1 1 14rem;
  min-height: 1.6rem;
}

.contract-assistant-reset {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2rem;
  padding: 0.38rem 0.82rem;
  color: #ffffff;
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.2;
  background: linear-gradient(135deg, #ef4444, #dc2626);
  border: 0;
  border-radius: 0.45rem;
  box-shadow: 0 14px 28px rgba(220, 38, 38, 0.16);
  transition:
    transform 0.18s ease,
    filter 0.18s ease,
    box-shadow 0.18s ease;
}

.contract-assistant-reset:hover:not(:disabled),
.contract-assistant-reset:focus-visible:not(:disabled) {
  color: #ffffff;
  box-shadow:
    0 16px 32px rgba(220, 38, 38, 0.22),
    0 0 0 0.18rem rgba(248, 113, 113, 0.16);
  filter: brightness(1.02);
  transform: translateY(-0.04rem);
}

.contract-assistant-reset:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.contract-assistant-messages {
  display: grid;
  gap: 0.62rem;
  max-height: 21rem;
  min-height: 8rem;
  padding: 0.2rem 0.35rem 0.55rem 0.05rem;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: transparent;
  border: 0;
  border-radius: 0;
  scroll-behavior: smooth;
  scrollbar-color: rgba(20, 184, 166, 0.56) transparent;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}

.contract-assistant-messages::-webkit-scrollbar {
  width: 0.72rem;
}

.contract-assistant-messages::-webkit-scrollbar-track {
  margin: 0.45rem 0;
  background: transparent;
  border-radius: 999px;
}

.contract-assistant-messages::-webkit-scrollbar-thumb {
  background:
    linear-gradient(180deg, rgba(45, 212, 191, 0.82), rgba(20, 184, 166, 0.72));
  border: 0.2rem solid rgba(255, 255, 255, 0.78);
  border-radius: 999px;
  box-shadow:
    0 0 10px rgba(20, 184, 166, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

.contract-assistant-messages::-webkit-scrollbar-thumb:hover {
  background:
    linear-gradient(180deg, rgba(94, 234, 212, 0.94), rgba(13, 148, 136, 0.84));
}

.contract-assistant-message {
  display: flex;
  gap: 0.55rem;
  align-items: flex-end;
  justify-self: start;
  width: min(100%, 43rem);
  max-width: min(88%, 43rem);
  animation: contract-message-in 0.22s ease-out both;
}

.contract-assistant-bubble {
  display: block;
  width: fit-content;
  max-width: min(82%, 40rem);
  padding: 0.72rem 0.92rem;
  color: #132033;
  line-height: 1.45;
  background: linear-gradient(180deg, #ffffff, #f5fbff);
  border: 1px solid rgba(20, 184, 166, 0.18);
  border-radius: 1.15rem 1.15rem 1.15rem 0.35rem;
  box-shadow:
    0 16px 34px rgba(15, 23, 42, 0.12),
    0 3px 10px rgba(20, 184, 166, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

.contract-assistant-avatar {
  display: inline-grid;
  flex: 0 0 2.2rem;
  place-items: center;
  width: 2.2rem;
  height: 2.2rem;
  color: #f8ffff;
  background:
    radial-gradient(circle at 36% 28%, rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0) 34%),
    linear-gradient(135deg, #14b8a6, #0ea5e9);
  border: 1px solid rgba(20, 184, 166, 0.28);
  border-radius: 50%;
  box-shadow:
    0 12px 24px rgba(20, 184, 166, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.contract-assistant-avatar svg {
  width: 1.55rem;
  height: 1.55rem;
  fill: currentColor;
  stroke: none;
}

.contract-bot-antenna {
  fill: none;
  stroke: currentColor;
  stroke-width: 3.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.contract-bot-eye {
  fill: #052f2f;
  stroke: none;
}

.contract-assistant-message-user {
  justify-self: end;
  justify-content: flex-end;
  margin-bottom: 0.55rem;
}

.contract-assistant-message-user .contract-assistant-bubble {
  color: #052f2f;
  background: linear-gradient(135deg, #99f6e4, #5eead4);
  border-color: rgba(20, 184, 166, 0.28);
  border-radius: 1.15rem 1.15rem 0.35rem 1.15rem;
  box-shadow: 0 12px 26px rgba(20, 184, 166, 0.14);
}

.contract-assistant-message-typing {
  gap: 0.32rem;
}

.contract-assistant-typing-bubble {
  display: inline-flex;
  gap: 0.32rem;
  align-items: center;
  min-width: 4.2rem;
}

.contract-assistant-typing-bubble span {
  width: 0.42rem;
  height: 0.42rem;
  background: #64748b;
  border-radius: 50%;
  animation: contract-typing-dot 0.9s ease-in-out infinite;
}

.contract-assistant-typing-bubble span:nth-child(2) {
  animation-delay: 0.12s;
}

.contract-assistant-typing-bubble span:nth-child(3) {
  animation-delay: 0.24s;
}

.contract-assistant-compose {
  display: block;
  margin-top: 0.15rem;
}

.contract-assistant-input-wrap {
  position: relative;
  display: grid;
  min-height: 4.35rem;
  min-width: 0;
}

.contract-assistant-input-wrap::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  border-radius: 1.1rem;
  box-shadow: 0 0 0 0 rgba(37, 99, 235, 0);
  transition: box-shadow 0.22s ease;
}

.contract-assistant-input-wrap:focus-within::before {
  box-shadow: 0 0 0 0.22rem rgba(20, 184, 166, 0.13);
  animation: contract-compose-focus 1.8s ease-in-out infinite;
}

.contract-assistant-message-input {
  height: 100%;
  min-height: 4.35rem;
  padding: 0.82rem 4.1rem 0.82rem 1rem;
  color: #0f172a;
  line-height: 1.45;
  background:
    linear-gradient(180deg, #ffffff, #f5fbff);
  border: 1px solid rgba(20, 184, 166, 0.2);
  border-radius: 1.1rem;
  box-shadow:
    0 16px 34px rgba(15, 23, 42, 0.1),
    0 3px 10px rgba(20, 184, 166, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.86);
  resize: vertical;
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    background 0.18s ease;
}

.contract-assistant-message-input:focus {
  color: #0f172a;
  background:
    linear-gradient(180deg, #ffffff, #f2fffd);
  border-color: rgba(20, 184, 166, 0.46);
  box-shadow:
    0 18px 42px rgba(20, 184, 166, 0.13),
    0 0 0 1px rgba(20, 184, 166, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.contract-assistant-message-input::placeholder {
  color: #5f7b92;
}

.contract-assistant-send {
  position: absolute;
  top: 50%;
  right: 0.8rem;
  display: inline-grid;
  place-items: center;
  width: 2.28rem;
  height: 2.28rem;
  padding: 0;
  color: #071b1f;
  background: #67e8df;
  border: 1px solid rgba(15, 118, 110, 0.18);
  border-radius: 0.18rem;
  box-shadow:
    0 10px 20px rgba(20, 184, 166, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.34);
  transform: translateY(-50%);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    background 0.18s ease,
    opacity 0.18s ease;
}

.contract-assistant-send:hover:not(:disabled),
.contract-assistant-send:focus-visible:not(:disabled) {
  transform: translateY(calc(-50% - 0.06rem)) scale(1.04);
  color: #041315;
  background: #5eead4;
  box-shadow:
    0 14px 28px rgba(20, 184, 166, 0.28),
    0 0 0 0.22rem rgba(94, 234, 212, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.contract-assistant-send:active:not(:disabled) {
  transform: translateY(-50%) scale(0.98);
}

.contract-assistant-send:disabled {
  cursor: not-allowed;
  opacity: 0.68;
}

.contract-assistant-send-icon {
  width: 1.05rem;
  height: 1.05rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.05;
  stroke-linecap: round;
  stroke-linejoin: round;
  transform: translateY(-0.02rem);
  transition: transform 0.18s ease;
}

.contract-assistant-send:hover:not(:disabled) .contract-assistant-send-icon,
.contract-assistant-send:focus-visible:not(:disabled) .contract-assistant-send-icon {
  transform: translateY(-0.08rem);
}

.contract-assistant-send-working .contract-assistant-send-icon {
  animation: contract-send-flight 0.95s ease-in-out infinite;
}

.contract-assistant-pending {
  box-shadow:
    inset 0 -1px 0 rgba(37, 99, 235, 0.16);
}

.contract-builder-additions-editor[hidden],
.contract-ai-change-log[hidden] {
  display: none;
}

.contract-builder-ai-additions-field {
  margin-top: 0.25rem;
}

.contract-ai-change-log {
  display: grid;
  gap: 0.85rem;
  padding: 0.95rem 0 0.25rem;
  border-top: 1px dashed rgba(15, 23, 42, 0.18);
}

.contract-ai-change-log-header {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.8rem;
  align-items: baseline;
  justify-content: space-between;
}

.contract-ai-change-log-header strong {
  color: #0f172a;
  font-size: 0.98rem;
  line-height: 1.2;
}

.contract-ai-change-log-header small {
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: uppercase;
}

.contract-ai-change-list {
  display: grid;
  gap: 0.68rem;
}

.contract-ai-change-item {
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr);
  gap: 0.75rem;
  align-items: start;
  padding: 0.68rem 0 0.68rem 0.72rem;
  background: transparent;
  border-left: 3px solid rgba(148, 163, 184, 0.38);
  animation: contract-change-row-in 0.28s ease-out both;
  animation-delay: calc(var(--change-index, 0) * 42ms);
}

.contract-ai-change-added {
  border-left-color: rgba(22, 163, 74, 0.52);
}

.contract-ai-change-removed {
  border-left-color: rgba(220, 38, 38, 0.52);
}

.contract-ai-change-icon {
  box-sizing: border-box;
  display: inline-grid;
  place-items: center;
  width: 1.78rem;
  height: 1.78rem;
  padding-bottom: 0.08rem;
  color: #15803d;
  font-size: 1.08rem;
  font-weight: 900;
  line-height: 0.92;
  background: #dcfce7;
  border: 1px solid rgba(22, 163, 74, 0.34);
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.28);
  animation:
    contract-change-icon-pop 0.48s cubic-bezier(0.2, 0.8, 0.2, 1.25) both,
    contract-change-plus-pulse 1.3s ease-out 0.44s 2;
}

.contract-ai-change-removed .contract-ai-change-icon {
  color: #b91c1c;
  background: #fee2e2;
  border-color: rgba(220, 38, 38, 0.34);
  box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.24);
  animation:
    contract-change-icon-pop 0.48s cubic-bezier(0.2, 0.8, 0.2, 1.25) both,
    contract-change-x-jolt 0.54s ease-out 0.38s 1;
}

.contract-ai-change-text {
  min-width: 0;
  color: #1e293b;
  font-size: 0.94rem;
  font-weight: 650;
  line-height: 1.45;
}

@keyframes contract-message-in {
  from {
    opacity: 0;
    transform: translateY(0.45rem);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes contract-typing-dot {
  0%,
  80%,
  100% {
    opacity: 0.35;
    transform: translateY(0);
  }

  40% {
    opacity: 1;
    transform: translateY(-0.18rem);
  }
}

@keyframes contract-compose-focus {
  0%,
  100% {
    opacity: 0.72;
    transform: scale(1);
  }

  50% {
    opacity: 1;
    transform: scale(1.006);
  }
}

@keyframes contract-send-flight {
  0%,
  100% {
    opacity: 0.72;
    transform: translateY(0.08rem);
  }

  45% {
    opacity: 1;
    transform: translateY(-0.14rem);
  }
}

@keyframes contract-change-row-in {
  from {
    opacity: 0;
    transform: translateX(-0.45rem);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes contract-change-icon-pop {
  0% {
    opacity: 0;
    transform: scale(0.35) rotate(-18deg);
  }

  65% {
    opacity: 1;
    transform: scale(1.12) rotate(4deg);
  }

  100% {
    opacity: 1;
    transform: scale(1) rotate(0);
  }
}

@keyframes contract-change-plus-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.28);
  }

  100% {
    box-shadow: 0 0 0 0.65rem rgba(34, 197, 94, 0);
  }
}

@keyframes contract-change-x-jolt {
  0%,
  100% {
    transform: translateX(0) rotate(0);
  }

  20% {
    transform: translateX(-0.08rem) rotate(-8deg);
  }

  45% {
    transform: translateX(0.08rem) rotate(8deg);
  }

  70% {
    transform: translateX(-0.04rem) rotate(-4deg);
  }
}

.sti-test-manual {
  display: grid;
  gap: 0.75rem;
}

.sti-test-manual[hidden] {
  display: none;
}

.sti-site-guided[hidden],
.sti-site-manual[hidden] {
  display: none;
}

.sti-test-manual-suggested {
  gap: 0.35rem;
  margin-top: 0.2rem;
}

.sti-test-manual-suggested .sti-test-suggestions:empty {
  min-height: 0;
}

.sti-test-checkboxes {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.sti-test-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  min-height: 2.35rem;
}

.sti-test-option {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 2.35rem;
  padding: 0.45rem 0.75rem;
  color: #1e293b;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 999px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

.sti-test-option-selected {
  color: #1d4ed8;
  background: #dbeafe;
  border-color: rgba(37, 99, 235, 0.32);
}

.sti-test-more {
  min-width: 2.8rem;
  justify-content: center;
}

.sti-test-selected {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  min-height: 2.25rem;
}

.sti-test-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  max-width: 100%;
  padding: 0.35rem 0.65rem;
  color: #1e293b;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  background: #dbeafe;
  border: 1px solid rgba(37, 99, 235, 0.24);
  border-radius: 999px;
}

.sti-test-chip::after {
  content: "x";
  color: #2563eb;
  font-weight: 900;
}

.sti-site-selected {
  margin-top: 0.75rem;
}

.sti-site-chip::after {
  content: none;
}

.sti-site-chip-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1rem;
  height: 1rem;
  padding: 0;
  color: #2563eb;
  font: inherit;
  font-weight: 900;
  line-height: 1;
  background: transparent;
  border: 0;
}

.sti-site-chip-remove:disabled {
  opacity: 0.55;
}

.form-check-input {
  border-color: rgba(37, 99, 235, 0.42);
}

.form-check-input:checked {
  background-color: #2563eb;
  border-color: #2563eb;
}

.bg-light {
  background: linear-gradient(
    145deg,
    rgba(248, 250, 252, 0.96),
    rgba(226, 232, 240, 0.9)
  ) !important;
  border-color: rgba(96, 165, 250, 0.18) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.list-group {
  border-radius: 0.85rem;
}

.list-group-item {
  color: #111827;
  background: rgba(255, 255, 255, 0.92);
  border-color: rgba(148, 163, 184, 0.28);
}

.badge {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 1.55rem;
  padding: 0.34rem 0.58rem;
  color: #334155;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.1;
  text-align: left;
  white-space: normal;
  background: rgba(248, 250, 252, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.34);
  border-radius: 0.45rem;
  box-shadow: none;
}

.badge.text-bg-primary,
.badge.bg-primary {
  color: #075985 !important;
  background: rgba(14, 165, 233, 0.1) !important;
  border-color: rgba(14, 165, 233, 0.26);
}

.badge.text-bg-success,
.badge.bg-success {
  color: #047857 !important;
  background: rgba(16, 185, 129, 0.12) !important;
  border-color: rgba(16, 185, 129, 0.28);
}

.badge.text-bg-secondary,
.badge.bg-secondary {
  color: #475569 !important;
  background: rgba(241, 245, 249, 0.92) !important;
  border-color: rgba(148, 163, 184, 0.34);
}

.badge.text-bg-warning,
.badge.bg-warning {
  color: #92400e !important;
  background: rgba(245, 158, 11, 0.14) !important;
  border-color: rgba(245, 158, 11, 0.3);
}

.badge.text-bg-danger,
.badge.bg-danger {
  color: #b91c1c !important;
  background: rgba(239, 68, 68, 0.12) !important;
  border-color: rgba(239, 68, 68, 0.26);
}

.badge.text-bg-info,
.badge.bg-info {
  color: #0e7490 !important;
  background: rgba(6, 182, 212, 0.12) !important;
  border-color: rgba(6, 182, 212, 0.28);
}

.link-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: flex-start;
  justify-content: flex-end;
}

.link-actions .btn {
  min-width: 136px;
  padding: 0.62rem 1rem;
}

.cancel-link-form {
  margin: 0;
}

.link-complete-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.45rem;
  padding: 0.55rem 1rem;
  color: #047857;
  font-weight: 800;
  background: #d1fae5;
  border: 1px solid #a7f3d0;
  border-radius: 999px;
}

.sti-request-complete-badge {
  min-height: 1.75rem;
  padding: 0.28rem 0.62rem;
  font-size: 0.78rem;
  line-height: 1;
}

.health-record-kicker,
.health-record-detail-label {
  display: inline-flex;
  align-items: center;
  color: #2563eb;
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.health-record-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
}

.health-record-account-actions {
  display: grid;
  gap: 0.75rem;
}

.health-record-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
}

.health-record-action-row-danger {
  padding-top: 0.75rem;
  border-top: 1px solid rgba(148, 163, 184, 0.24);
}

.health-record-connection-badges {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  align-items: flex-end;
  align-self: stretch;
  margin-left: auto;
  text-align: right;
}

.health-record-connect-icon {
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.4;
}

.health-record-source-badge {
  color: #075985 !important;
  background: rgba(14, 165, 233, 0.1) !important;
  border-color: rgba(14, 165, 233, 0.26) !important;
}

.account-settings-search {
  position: relative;
  z-index: 5;
}

.account-settings-search-box {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.75rem;
  align-items: center;
  min-height: 3.6rem;
  padding: 0.55rem 0.7rem;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.32);
  border-radius: 0.65rem;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease;
}

.account-settings-search:focus-within .account-settings-search-box {
  border-color: rgba(37, 99, 235, 0.34);
  box-shadow: 0 16px 34px rgba(37, 99, 235, 0.12);
}

.account-settings-search-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  color: #1d4ed8;
  background: #eff6ff;
  border: 1px solid rgba(37, 99, 235, 0.14);
  border-radius: 0.55rem;
}

.account-settings-search-icon svg {
  width: 1.15rem;
  height: 1.15rem;
}

.account-settings-search-input {
  width: 100%;
  min-width: 0;
  color: #0f172a;
  caret-color: #1d4ed8;
  font-size: 0.98rem;
  font-weight: 650;
  background: transparent;
  border: 0;
  outline: 0;
}

.account-settings-search-input::placeholder {
  color: #64748b;
  font-weight: 600;
}

.account-settings-search-results {
  position: absolute;
  top: calc(100% + 0.45rem);
  right: 0;
  left: 0;
  display: grid;
  gap: 0.3rem;
  max-height: min(22rem, calc(100vh - 12rem));
  padding: 0.5rem;
  overflow-y: auto;
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid rgba(96, 165, 250, 0.24);
  border-radius: 0.65rem;
  box-shadow: 0 24px 58px rgba(15, 23, 42, 0.18);
}

.account-settings-search-results[hidden] {
  display: none;
}

.account-settings-search-result {
  display: grid;
  grid-template-columns: minmax(5.5rem, auto) minmax(0, 1fr);
  gap: 0.75rem;
  align-items: center;
  padding: 0.72rem 0.78rem;
  color: #0f172a;
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: 0.5rem;
}

.account-settings-search-result:hover,
.account-settings-search-result:focus,
.account-settings-search-result[aria-selected="true"] {
  color: #0f172a;
  background: #eff6ff;
  border-color: rgba(37, 99, 235, 0.22);
}

.account-settings-search-category {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.75rem;
  padding: 0.25rem 0.5rem;
  color: #1d4ed8;
  font-size: 0.72rem;
  font-weight: 850;
  text-transform: uppercase;
  background: rgba(37, 99, 235, 0.1);
  border: 1px solid rgba(37, 99, 235, 0.16);
  border-radius: 999px;
}

.account-settings-search-result strong,
.account-settings-search-result small {
  display: block;
}

.account-settings-search-result strong {
  font-weight: 800;
  line-height: 1.25;
}

.account-settings-search-result small {
  margin-top: 0.14rem;
  color: #475569;
  line-height: 1.35;
}

.account-settings-search-empty {
  padding: 0.85rem;
  color: #475569;
  font-weight: 700;
  text-align: center;
}

.account-settings-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.45rem;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 0.75rem;
}

.account-settings-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.35rem;
  padding: 0.48rem 0.85rem;
  color: #334155;
  font-size: 0.92rem;
  font-weight: 750;
  line-height: 1.1;
  text-align: center;
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: 0.55rem;
  transition:
    color 0.16s ease,
    background-color 0.16s ease,
    border-color 0.16s ease;
}

.account-settings-tab:hover,
.account-settings-tab:focus {
  color: #0f172a;
  background: #ffffff;
  border-color: rgba(37, 99, 235, 0.18);
}

.account-settings-tab-active,
.account-settings-tab-active:hover,
.account-settings-tab-active:focus {
  color: #ffffff;
  background: #2563eb;
  border-color: #2563eb;
}

.accessibility-settings-panel {
  color: #0f172a;
}

.accessibility-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.accessibility-control,
.accessibility-toggle-list {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
  padding: 1rem;
  color: #0f172a;
  background: rgba(248, 250, 252, 0.88);
  border: 1px solid rgba(148, 163, 184, 0.26);
  border-radius: 0.75rem;
}

.accessibility-control-header {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  justify-content: space-between;
  color: #0f172a;
  font-size: 0.82rem;
  font-weight: 850;
  line-height: 1.2;
  text-transform: uppercase;
}

.accessibility-control output {
  min-width: 3rem;
  color: #1d4ed8;
  font-weight: 850;
  text-align: right;
}

.accessibility-control .form-range {
  accent-color: #2563eb;
}

.accessibility-control .form-range::-webkit-slider-runnable-track {
  height: 0.45rem;
  background: #dbeafe;
  border: 1px solid rgba(37, 99, 235, 0.14);
  border-radius: 999px;
}

.accessibility-control .form-range::-webkit-slider-thumb {
  width: 1.12rem;
  height: 1.12rem;
  margin-top: -0.4rem;
  background: #2563eb;
  border: 2px solid #ffffff;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.22);
}

.accessibility-control .form-range::-moz-range-track {
  height: 0.45rem;
  background: #dbeafe;
  border: 1px solid rgba(37, 99, 235, 0.14);
  border-radius: 999px;
}

.accessibility-control .form-range::-moz-range-thumb {
  width: 1.12rem;
  height: 1.12rem;
  background: #2563eb;
  border: 2px solid #ffffff;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.22);
}

.accessibility-color-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.65rem;
  align-items: center;
}

.accessibility-color-input {
  width: 3.2rem;
  min-height: 2.65rem;
  padding: 0.28rem;
}

.accessibility-color-input:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.accessibility-toggle-list {
  grid-column: 1 / -1;
  grid-template-columns: 1fr;
  gap: 0.75rem;
}

.accessibility-toggle-list .accessibility-switch.form-switch {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.8rem;
  align-items: flex-start;
  padding: 0.85rem;
  min-width: 0;
  margin-bottom: 0;
  background: rgba(255, 255, 255, 0.58);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 0.65rem;
}

.accessibility-toggle-list .accessibility-switch.form-switch .form-check-input {
  float: none;
  margin: 0.18rem 0 0;
}

.accessibility-switch-copy {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}

.accessibility-switch .form-check-label {
  font-weight: 750;
  line-height: 1.25;
}

.accessibility-switch-description {
  max-width: 58rem;
  color: #475569;
  font-size: 0.86rem;
  line-height: 1.45;
}

.account-sti-library {
  display: grid;
  gap: 0;
}

.account-sti-current,
.account-sti-list-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  color: #111827;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 0.65rem;
}

.account-sti-current {
  align-items: flex-start;
  border-color: rgba(37, 99, 235, 0.22);
  background: linear-gradient(145deg, rgba(239, 246, 255, 0.95), rgba(255, 255, 255, 0.92));
}

.account-sti-help-label {
  gap: 0.4rem;
}

.account-sti-help {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.account-sti-help-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.05rem;
  height: 1.05rem;
  padding: 0;
  color: #1d4ed8;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1;
  background: rgba(37, 99, 235, 0.1);
  border: 1px solid rgba(37, 99, 235, 0.32);
  border-radius: 50%;
}

.account-sti-help-trigger:focus-visible {
  outline: 2px solid rgba(37, 99, 235, 0.42);
  outline-offset: 2px;
}

.account-sti-help-tooltip {
  position: absolute;
  top: calc(100% + 0.45rem);
  left: 50%;
  z-index: 20;
  width: min(17rem, calc(100vw - 3rem));
  padding: 0.65rem 0.75rem;
  color: #f8fafc;
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.35;
  text-transform: none;
  background: #0f172a;
  border: 1px solid rgba(148, 163, 184, 0.3);
  border-radius: 0.5rem;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.22);
  opacity: 0;
  pointer-events: none;
  transform: translateX(-50%) translateY(-0.25rem);
  transition:
    opacity 0.16s ease,
    transform 0.16s ease;
}

.account-sti-help:hover .account-sti-help-tooltip,
.account-sti-help:focus-within .account-sti-help-tooltip {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

.account-sti-library-sections {
  display: grid;
  gap: 1rem;
  align-items: start;
}

.account-sti-library-section {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}

.account-sti-section-heading {
  display: grid;
  gap: 0.2rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22);
}

.account-sti-list {
  display: grid;
  gap: 0.65rem;
}

.account-sti-list-row {
  align-items: flex-start;
}

.account-sti-record-row {
  min-width: 0;
}

.account-sti-connection-actions {
  padding-top: 0.25rem;
}

.health-record-summary-grid,
.health-record-detail-grid,
.health-record-check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

.health-record-metric,
.health-record-panel,
.health-record-raw {
  color: #111827;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 0.5rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.health-record-metric,
.health-record-panel {
  padding: 1rem;
}

.health-record-metric span,
.health-record-check-row span,
.health-record-evidence-meta dt {
  display: block;
  color: #475569;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.health-record-metric strong,
.health-record-check-row strong {
  display: block;
  margin-top: 0.2rem;
  overflow-wrap: anywhere;
}

.health-record-check-row {
  display: flex;
  gap: 0.8rem;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem;
  background: rgba(248, 250, 252, 0.86);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.5rem;
}

.health-record-evidence-list {
  display: grid;
  gap: 0.75rem;
}

.health-record-evidence-item {
  padding: 0.9rem;
  background: rgba(248, 250, 252, 0.86);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.5rem;
}

.health-record-evidence-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.health-record-evidence-meta dd {
  margin-bottom: 0;
  color: #111827;
  overflow-wrap: anywhere;
}

.health-record-raw {
  overflow: hidden;
}

.health-record-raw summary {
  padding: 1rem;
  color: #0f172a;
  cursor: pointer;
  font-weight: 850;
}

.health-record-raw pre {
  max-height: 28rem;
  padding: 1rem;
  margin: 0;
  overflow: auto;
  color: #0f172a;
  white-space: pre-wrap;
  word-break: break-word;
  background: rgba(241, 245, 249, 0.92);
  border-top: 1px solid rgba(148, 163, 184, 0.28);
  font-size: 0.86rem;
  line-height: 1.55;
}

.btn-outline-danger {
  color: #b91c1c;
  background: rgba(239, 68, 68, 0.06);
  border-color: rgba(220, 38, 38, 0.38);
}

.btn-outline-danger:hover,
.btn-outline-danger:focus {
  color: #ffffff;
  background: #dc2626;
  border-color: #dc2626;
}

.btn {
  border-radius: 999px !important;
  padding: 0.85rem 1.7rem;
  font-weight: 600;
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    filter 0.18s ease;
}

.btn:hover,
.btn:focus {
  transform: translateY(-1px);
}

.btn-primary {
  background: linear-gradient(135deg, #4f46e5 0%, #2563eb 100%);
  border: none;
  box-shadow: 0 20px 42px rgba(37, 99, 235, 0.24);
}

.btn-primary:hover,
.btn-primary:focus {
  background: linear-gradient(135deg, #4338ca 0%, #1d4ed8 100%);
}

.login-submit-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.16);
}

.login-submit-content {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.5rem;
  gap: 0.55rem;
  line-height: 1;
}

.login-submit-spinner {
  display: none;
}

.login-submit-loading .login-submit-spinner {
  display: inline-block;
}

.btn-outline-light {
  border: 1px solid rgba(255, 255, 255, 0.65);
  color: #f8fafc;
  background: rgba(255, 255, 255, 0.08);
}

.btn-outline-light:hover,
.btn-outline-light:focus {
  background: rgba(255, 255, 255, 0.16);
  color: #ffffff;
}

.btn-light {
  background: #ffffff;
  color: #111827;
  border: 1px solid rgba(15, 23, 42, 0.08);
}

.btn-light:hover,
.btn-light:focus {
  background: #f8fafc;
}

.btn-outline-primary {
  border: 1px solid rgba(59, 130, 246, 0.4);
  color: #1d4ed8;
  background: rgba(37, 99, 235, 0.06);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
  color: #ffffff;
  background: #2563eb;
  border-color: #2563eb;
}

.btn-google-auth {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.72rem;
  color: #111827;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.48);
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08);
}

.btn-google-auth:hover,
.btn-google-auth:focus {
  color: #111827;
  background: #f8fafc;
  border-color: rgba(100, 116, 139, 0.62);
}

.btn-microsoft-auth {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.72rem;
  color: #111827;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.48);
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08);
}

.btn-microsoft-auth:hover,
.btn-microsoft-auth:focus {
  color: #111827;
  background: #f8fafc;
  border-color: rgba(100, 116, 139, 0.62);
}

.btn-passkey-auth {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.72rem;
  color: #0f172a;
  background: linear-gradient(135deg, #ecfeff, #f8fafc);
  border: 1px solid rgba(14, 165, 233, 0.32);
  box-shadow: 0 12px 26px rgba(14, 165, 233, 0.1);
}

.btn-passkey-auth:hover,
.btn-passkey-auth:focus {
  color: #0f172a;
  background: linear-gradient(135deg, #cffafe, #ffffff);
  border-color: rgba(14, 165, 233, 0.46);
}

.passkey-auth-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 2.5rem;
  height: 1.75rem;
  color: #0891b2;
}

.passkey-auth-mark svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.passkey-auth-ring,
.passkey-auth-key {
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.passkey-auth-dot {
  fill: currentColor;
}

.google-auth-mark {
  display: inline-grid;
  place-items: center;
  width: 1.65rem;
  height: 1.65rem;
  color: #ffffff;
  font-weight: 850;
  line-height: 1;
  background: conic-gradient(from -45deg, #4285f4 0 25%, #34a853 0 50%, #fbbc05 0 75%, #ea4335 0);
  border-radius: 50%;
}

.microsoft-auth-mark {
  display: grid;
  grid-template-columns: repeat(2, 0.68rem);
  grid-template-rows: repeat(2, 0.68rem);
  gap: 0.12rem;
  flex: 0 0 auto;
}

.microsoft-auth-mark span {
  display: block;
}

.microsoft-auth-mark span:nth-child(1) {
  background: #f25022;
}

.microsoft-auth-mark span:nth-child(2) {
  background: #7fba00;
}

.microsoft-auth-mark span:nth-child(3) {
  background: #00a4ef;
}

.microsoft-auth-mark span:nth-child(4) {
  background: #ffb900;
}

.login-auth-divider {
  display: flex;
  align-items: center;
  gap: 1rem;
  color: #64748b;
  font-size: 0.82rem;
  font-weight: 750;
  text-transform: uppercase;
}

.login-auth-divider::before,
.login-auth-divider::after {
  flex: 1;
  height: 1px;
  content: "";
  background: rgba(148, 163, 184, 0.36);
}

.site-broadcast-banner {
  position: relative;
  z-index: 1040;
  padding: 0.72rem 0;
  color: #ffffff;
  font-weight: 800;
  line-height: 1.35;
  text-align: center;
  background: #b91c1c;
  border-bottom: 1px solid rgba(127, 29, 29, 0.8);
  box-shadow: 0 12px 34px rgba(127, 29, 29, 0.26);
}

.site-broadcast-banner .container {
  overflow-wrap: anywhere;
}

.app-navbar {
  position: sticky;
  top: 0;
  z-index: 1030;
  padding: 0.8rem 0;
  background: rgba(7, 12, 24, 0.88);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(16px);
}

.app-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.72rem;
  margin-right: 1.5rem;
  color: #ffffff;
  letter-spacing: 0;
}

.app-brand:hover,
.app-brand:focus {
  color: #ffffff;
}

.brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.45rem;
  height: 2.45rem;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 0.85rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.brand-mark img {
  width: 1.45rem;
  height: 1.45rem;
  object-fit: contain;
}

.brand-text {
  font-size: 1.12rem;
  font-weight: 800;
}

.app-nav-link {
  position: relative;
  padding: 0.62rem 0.9rem !important;
  color: rgba(248, 250, 252, 0.76) !important;
  font-size: 1rem;
  font-weight: 650;
  border-radius: 999px;
}

.app-nav-link:hover,
.app-nav-link:focus {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.08);
}

.app-nav-link.active {
  color: #ffffff !important;
  background: rgba(96, 165, 250, 0.18);
}

.app-navbar-actions {
  display: inline-flex;
  order: 2;
  gap: 0.55rem;
  align-items: center;
  margin-left: auto;
}

.app-navbar-collapse {
  order: 3;
  flex-basis: 100%;
}

.nav-account {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-left: 0.85rem;
  padding-left: 1rem;
  border-left: 1px solid rgba(255, 255, 255, 0.12);
}

.account-chip {
  max-width: 220px;
  overflow: hidden;
  color: rgba(248, 250, 252, 0.72);
  font-size: 0.86rem;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nav-btn {
  min-width: 94px;
  padding: 0.58rem 1.15rem;
}

.app-navbar-toggler {
  padding: 0.55rem 0.7rem;
  border-color: rgba(255, 255, 255, 0.2);
  border-radius: 0.9rem;
}

.app-navbar-toggler:focus {
  box-shadow: 0 0 0 0.18rem rgba(96, 165, 250, 0.28);
}

.bg-soft {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.alert {
  border-radius: 1rem;
}

.record-source-choice-modal {
  z-index: 1085;
}

.record-source-choice-modal .modal-dialog {
  max-width: min(32rem, calc(100vw - 1rem));
}

.record-source-choice-modal .modal-content {
  overflow: hidden;
  color: #111827;
  background: #ffffff;
  border-color: rgba(15, 23, 42, 0.18);
  box-shadow: 0 30px 80px rgba(2, 6, 23, 0.38);
}

.record-source-modal-actions {
  gap: 0.75rem;
}

.record-source-modal-actions-primary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: flex-end;
}

@media (max-width: 575.98px) {
  .record-source-modal-actions {
    align-items: stretch;
  }

  .record-source-modal-actions .btn,
  .record-source-modal-actions-primary {
    width: 100%;
  }
}

.app-flash-stack {
  position: fixed;
  top: 5.5rem;
  left: 50%;
  z-index: 1040;
  display: grid;
  gap: 0.75rem;
  width: min(1140px, calc(100% - 2rem));
  margin-bottom: 0;
  transform: translateX(-50%);
}

.app-alert {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0;
  padding: 1rem 3rem 1rem 1.15rem;
  color: #111827;
  font-weight: 600;
  background: #ffffff;
  border: 1px solid rgba(15, 23, 42, 0.14);
  box-shadow: 0 18px 42px rgba(2, 6, 23, 0.2);
}

.app-alert .btn-close {
  top: 50%;
  transform: translateY(-50%);
  opacity: 0.75;
}

.app-alert-copy-fallback {
  align-items: flex-start;
}

.app-alert-copy-content {
  flex: 1 1 auto;
  min-width: 0;
}

.app-alert-copy-field {
  min-height: 3.25rem;
  font-size: 16px;
  font-weight: 500;
  overflow-wrap: anywhere;
  resize: vertical;
}

.app-alert-copy-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.65rem;
}

.dashboard-agent-handoff-panel {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.25rem;
  padding: 1rem;
  color: #0f172a;
  background:
    linear-gradient(135deg, rgba(236, 253, 245, 0.96), rgba(240, 249, 255, 0.96));
  border: 1px solid rgba(20, 184, 166, 0.24);
  border-radius: 0.65rem;
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.1);
}

.dashboard-agent-handoff-copy {
  min-width: min(100%, 22rem);
  flex: 1 1 24rem;
}

.dashboard-agent-handoff-kicker {
  display: block;
  margin-bottom: 0.28rem;
  color: #0f766e;
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: uppercase;
}

.dashboard-agent-handoff-panel h2 {
  margin: 0 0 0.28rem;
  color: #0f172a;
  font-size: 1rem;
  font-weight: 850;
  line-height: 1.25;
}

.dashboard-agent-handoff-panel p {
  margin: 0;
  color: #334155;
  font-size: 0.92rem;
  line-height: 1.45;
}

.dashboard-agent-handoff-actions {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: flex-end;
}

@media (max-width: 575.98px) {
  .dashboard-agent-handoff-actions,
  .dashboard-agent-handoff-actions .btn,
  .dashboard-agent-handoff-actions form {
    width: 100%;
  }
}

.app-alert-success {
  color: #0f5132;
  background: #d1e7dd;
  border-color: #a3cfbb;
}

.app-alert-warning {
  color: #664d03;
  background: #fff3cd;
  border-color: #ffda6a;
}

.app-alert-danger {
  color: #842029;
  background: #f8d7da;
  border-color: #f1aeb5;
}

.app-alert-info {
  color: #055160;
  background: #cff4fc;
  border-color: #9eeaf9;
}

.text-muted {
  color: rgba(248, 250, 252, 0.75) !important;
}

.card-title {
  color: #0f172a;
}

.form-card .card:not(.form-card) {
  overflow: hidden;
  background: linear-gradient(145deg, #ffffff, #f8fafc);
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-radius: 0.95rem;
}

.card-body {
  padding: 2rem;
}

.dashboard-page .btn {
  border-radius: 0.55rem !important;
  padding: 0.68rem 1.05rem;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.15;
  box-shadow: none;
}

.dashboard-page .btn-lg {
  padding: 0.78rem 1.15rem;
  font-size: 0.96rem;
}

.dashboard-page .btn:hover,
.dashboard-page .btn:focus {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.1);
}

.dashboard-page .btn-outline-primary {
  color: #1d4ed8;
  background: #ffffff;
  border-color: rgba(37, 99, 235, 0.34);
}

.dashboard-page .btn-outline-primary:hover,
.dashboard-page .btn-outline-primary:focus {
  color: #ffffff;
  background: #1d4ed8;
  border-color: #1d4ed8;
}

.dashboard-page .btn-outline-secondary {
  color: #475569;
  background: #ffffff;
  border-color: rgba(100, 116, 139, 0.32);
}

.dashboard-page .btn-outline-secondary:hover,
.dashboard-page .btn-outline-secondary:focus {
  color: #0f172a;
  background: #e2e8f0;
  border-color: rgba(100, 116, 139, 0.42);
}

.dashboard-search-shell {
  position: relative;
  z-index: 20;
}

.dashboard-search-backdrop {
  display: none;
}

.dashboard-search-open {
  overflow: hidden;
}

.dashboard-search-shell.dashboard-search-active {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  margin: 0 !important;
  padding: clamp(1.5rem, 7vh, 4rem) clamp(1rem, 4vw, 2rem) 2rem;
}

.dashboard-search-shell.dashboard-search-active .dashboard-search-backdrop {
  position: fixed;
  inset: 0;
  display: block;
  padding: 0;
  cursor: default;
  background: rgba(2, 6, 23, 0.62);
  border: 0;
  backdrop-filter: blur(14px);
  animation: dashboard-search-backdrop-in 0.18s ease-out both;
}

.dashboard-search-box {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  min-height: 4.1rem;
  padding: 0.7rem 0.85rem;
  color: #0f172a;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(96, 165, 250, 0.24);
  border-radius: 0.75rem;
  box-shadow: 0 18px 46px rgba(15, 23, 42, 0.14);
  transition:
    width 0.22s ease,
    max-width 0.22s ease,
    transform 0.22s ease,
    box-shadow 0.22s ease,
    background-color 0.22s ease;
}

.dashboard-search-shell.dashboard-search-active .dashboard-search-box {
  position: relative;
  z-index: 1;
  width: min(760px, 100%);
  min-height: 4.6rem;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 32px 90px rgba(2, 6, 23, 0.34);
  animation: dashboard-search-panel-in 0.22s ease-out both;
}

.dashboard-search-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.4rem;
  height: 2.4rem;
  color: #1d4ed8;
  background: #eff6ff;
  border: 1px solid rgba(37, 99, 235, 0.14);
  border-radius: 0.55rem;
}

.dashboard-search-icon svg {
  width: 1.25rem;
  height: 1.25rem;
}

.dashboard-search-input {
  width: 100%;
  min-width: 0;
  color: #0f172a;
  caret-color: #1d4ed8;
  font-size: 1rem;
  font-weight: 650;
  background: transparent;
  border: 0;
  outline: 0;
}

.dashboard-search-input::placeholder {
  color: #64748b;
  font-weight: 600;
}

.dashboard-search-shortcut {
  min-width: 4.5rem;
  padding: 0.38rem 0.55rem;
  color: #475569;
  font-family: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  text-align: center;
  background: #f1f5f9;
  border: 1px solid rgba(148, 163, 184, 0.32);
  border-radius: 0.45rem;
  box-shadow: none;
}

.dashboard-search-shell.dashboard-search-active .dashboard-search-shortcut {
  display: none;
}

.master-guide-mouth {
  fill: currentColor;
  stroke: none;
  opacity: 0.82;
  transform: scaleX(0.78) scaleY(0.18);
  transform-box: fill-box;
  transform-origin: center;
}

.dashboard-search-results {
  position: absolute;
  top: calc(100% + 0.5rem);
  right: 0;
  left: 0;
  display: grid;
  gap: 0.35rem;
  max-height: min(28rem, calc(100vh - 10rem));
  padding: 0.55rem;
  overflow-y: auto;
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid rgba(96, 165, 250, 0.24);
  border-radius: 0.75rem;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.22);
}

.dashboard-search-shell.dashboard-search-active .dashboard-search-results {
  position: relative;
  z-index: 1;
  top: auto;
  right: auto;
  left: auto;
  width: min(760px, 100%);
  max-height: min(28rem, calc(100vh - 10rem));
  margin-top: 0.75rem;
  animation: dashboard-search-panel-in 0.2s ease-out 0.04s both;
}

.dashboard-search-result {
  display: grid;
  grid-template-columns: minmax(5.5rem, auto) minmax(0, 1fr);
  gap: 0.85rem;
  align-items: center;
  padding: 0.78rem 0.85rem;
  color: #0f172a;
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: 0.55rem;
}

.dashboard-search-result:hover,
.dashboard-search-result:focus,
.dashboard-search-result[aria-selected="true"] {
  color: #0f172a;
  background: #eff6ff;
  border-color: rgba(37, 99, 235, 0.22);
}

.dashboard-search-result-category {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.8rem;
  padding: 0.28rem 0.55rem;
  color: #1d4ed8;
  font-size: 0.74rem;
  font-weight: 850;
  text-transform: uppercase;
  background: rgba(37, 99, 235, 0.1);
  border: 1px solid rgba(37, 99, 235, 0.16);
  border-radius: 999px;
}

.dashboard-search-result strong,
.dashboard-search-result small {
  display: block;
}

.dashboard-search-result strong {
  font-weight: 800;
  line-height: 1.25;
}

.dashboard-search-result small {
  margin-top: 0.16rem;
  color: #475569;
  line-height: 1.35;
}

.dashboard-search-empty {
  padding: 0.9rem;
  color: #475569;
  font-weight: 700;
  text-align: center;
}

@keyframes dashboard-search-backdrop-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes dashboard-search-panel-in {
  from {
    opacity: 0;
    transform: translateY(1rem) scale(0.98);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .dashboard-search-shell.dashboard-search-active .dashboard-search-backdrop,
  .dashboard-search-shell.dashboard-search-active .dashboard-search-box,
  .dashboard-search-shell.dashboard-search-active .dashboard-search-results {
    animation: none;
  }
}

.master-guide-shell {
  position: fixed;
  inset: 0;
  z-index: 1400;
  pointer-events: none;
}

.master-guide-backdrop {
  position: fixed;
  inset: 0;
  pointer-events: auto;
  background: transparent;
  border: 0;
}

.master-guide-mask {
  position: fixed;
  inset: 0;
  z-index: 1400;
  pointer-events: none;
}

.master-guide-mask-panel {
  position: fixed;
  background: rgba(2, 6, 23, 0.48);
  backdrop-filter: blur(6px);
}

.master-guide-highlight {
  position: fixed;
  z-index: 1401;
  pointer-events: none;
  border: 2px solid #38bdf8;
  border-radius: 0.65rem;
  box-shadow:
    0 0 0 9999px rgba(2, 6, 23, 0.36),
    0 0 0 6px rgba(56, 189, 248, 0.18),
    0 18px 44px rgba(2, 6, 23, 0.28);
}

.master-guide-panel {
  position: fixed;
  z-index: 1402;
  display: grid;
  gap: 0.75rem;
  padding: 1rem;
  color: #0f172a;
  pointer-events: auto;
  background: #ffffff;
  border: 1px solid rgba(14, 165, 233, 0.28);
  border-radius: 0.75rem;
  box-shadow: 0 28px 80px rgba(2, 6, 23, 0.32);
}

.master-guide-header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.75rem;
  align-items: start;
  padding-right: 2.7rem;
}

.master-guide-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.65rem;
  height: 2.65rem;
  color: #0369a1;
  background:
    linear-gradient(135deg, rgba(224, 242, 254, 0.96), rgba(240, 253, 250, 0.94));
  border: 1px solid rgba(14, 165, 233, 0.24);
  border-radius: 0.7rem;
  box-shadow: 0 12px 28px rgba(14, 165, 233, 0.16);
}

.master-guide-avatar svg {
  width: 1.55rem;
  height: 1.55rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.master-guide-speaking .master-guide-avatar {
  animation: guide-robot-bob 1.15s ease-in-out infinite;
}

.master-guide-speaking .master-guide-mouth {
  animation: guide-mouth-talk 0.68s ease-in-out infinite;
}

.master-guide-arrow {
  position: absolute;
  width: 0;
  height: 0;
}

.master-guide-panel[data-placement="below"] .master-guide-arrow {
  top: -11px;
  border-right: 10px solid transparent;
  border-bottom: 11px solid #ffffff;
  border-left: 10px solid transparent;
}

.master-guide-panel[data-placement="above"] .master-guide-arrow {
  bottom: -11px;
  border-top: 11px solid #ffffff;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
}

.master-guide-close {
  position: absolute;
  top: 0.55rem;
  right: 0.65rem;
  padding: 0.1rem 0.25rem;
  color: #475569;
  font-size: 0.78rem;
  font-weight: 800;
  background: transparent;
  border: 0;
}

.master-guide-progress {
  margin: 0;
  color: #0369a1;
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.master-guide-panel h2 {
  margin: 0;
  color: #0f172a;
  font-size: 1.08rem;
  font-weight: 850;
  line-height: 1.25;
}

.master-guide-copy,
.master-guide-importance {
  margin: 0;
  color: #334155;
  font-size: 0.94rem;
  line-height: 1.48;
}

.master-guide-importance {
  padding: 0.7rem;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.55rem;
}

.master-guide-importance strong {
  color: #0f172a;
}

.master-guide-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
}

@media (prefers-reduced-motion: reduce) {
  .master-guide-highlight,
  .master-guide-mask-panel {
    transition: none;
  }

  .master-guide-speaking .master-guide-avatar,
  .master-guide-speaking .master-guide-mouth {
    animation: none;
  }
}

@keyframes guide-robot-bob {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-2px);
  }
}

@keyframes guide-mouth-talk {
  0%,
  100% {
    opacity: 0.82;
    transform: scaleX(0.78) scaleY(0.18);
  }

  16% {
    opacity: 1;
    transform: scaleX(0.88) scaleY(1.05);
  }

  31% {
    opacity: 0.9;
    transform: scaleX(1.04) scaleY(0.34);
  }

  48% {
    opacity: 1;
    transform: scaleX(0.82) scaleY(1.24);
  }

  67% {
    opacity: 0.96;
    transform: scaleX(0.96) scaleY(0.58);
  }

  84% {
    opacity: 1;
    transform: scaleX(0.9) scaleY(0.92);
  }
}

.dashboard-action-card {
  display: flex;
  gap: 1rem;
  height: 100%;
  min-height: 140px;
  padding: 1.5rem;
  color: #111827;
  text-decoration: none;
  background: linear-gradient(
    145deg,
    rgba(255, 255, 255, 0.98),
    rgba(239, 246, 255, 0.94)
  );
  border: 1px solid rgba(96, 165, 250, 0.22);
  border-radius: 0.65rem;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.1);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease;
}

.dashboard-action-card:hover,
.dashboard-action-card:focus {
  color: #111827;
  border-color: rgba(37, 99, 235, 0.32);
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.14);
  transform: translateY(-2px);
}

.dashboard-action-icon {
  display: inline-flex;
  flex: 0 0 3rem;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  color: #1d4ed8;
  background: #eff6ff;
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 0.55rem;
}

.dashboard-action-icon svg {
  width: 1.6rem;
  height: 1.6rem;
}

.dashboard-action-title,
.dashboard-action-copy {
  display: block;
}

.dashboard-action-title {
  margin-bottom: 0.35rem;
  font-size: 1.05rem;
  font-weight: 700;
}

.dashboard-action-copy {
  color: #374151;
  line-height: 1.45;
}

.dashboard-agent-card .dashboard-action-icon {
  color: #1d4ed8;
  background: #eff6ff;
  border-color: rgba(37, 99, 235, 0.18);
}

.dashboard-sandbox-card .dashboard-action-icon {
  color: #1d4ed8;
  background: #eff6ff;
  border-color: rgba(37, 99, 235, 0.18);
}

.dashboard-agent-page {
  display: grid;
  gap: 1rem;
  padding-bottom: 3rem;
}

.dashboard-agent-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  color: #f8fafc;
}

.dashboard-agent-hero h2 {
  color: #ffffff;
  font-size: clamp(2rem, 4vw, 3.25rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0;
}

.dashboard-agent-hero p {
  max-width: 760px;
  color: rgba(224, 242, 254, 0.74);
  font-size: 1.02rem;
  line-height: 1.6;
}

.dashboard-agent-kicker {
  display: inline-flex;
  margin-bottom: 0.55rem;
  color: #67e8f9;
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.dashboard-agent-back {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 0.35rem;
  align-items: center;
}

.dashboard-agent-back svg {
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.dashboard-agent-shell {
  display: grid;
  gap: 0.85rem;
}

.dashboard-agent-tabs {
  display: inline-flex;
  gap: 0.3rem;
  align-items: center;
  width: max-content;
  max-width: 100%;
  padding: 0.28rem;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.65rem;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

.dashboard-agent-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 6rem;
  min-height: 2.35rem;
  padding: 0.45rem 0.9rem;
  color: #475569;
  font-weight: 850;
  line-height: 1.1;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 0.5rem;
  transition:
    color 0.18s ease,
    background-color 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease;
}

.dashboard-agent-tab:hover,
.dashboard-agent-tab:focus-visible {
  color: #0f172a;
  background: rgba(240, 249, 255, 0.82);
  border-color: rgba(14, 165, 233, 0.18);
  outline: none;
}

.dashboard-agent-tab-active,
.dashboard-agent-tab-active:hover,
.dashboard-agent-tab-active:focus-visible {
  color: #042f2e;
  background: linear-gradient(135deg, #ccfbf1, #e0f2fe);
  border-color: rgba(20, 184, 166, 0.28);
  box-shadow:
    0 10px 22px rgba(20, 184, 166, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.dashboard-agent-mode[hidden] {
  display: none !important;
}

.dashboard-agent-sandbox {
  position: relative;
  display: grid;
  grid-template-columns: minmax(13.5rem, 0.26fr) minmax(0, 1fr);
  gap: 1rem;
  min-height: min(74vh, 50rem);
}

.dashboard-agent-sandbox-has-selection {
  grid-template-columns: minmax(13.5rem, 0.26fr) minmax(0, 1fr);
}

.dashboard-agent-sandbox-has-selection::before {
  position: fixed;
  inset: 0;
  z-index: 40;
  content: "";
  background: rgba(15, 23, 42, 0.22);
  backdrop-filter: blur(7px);
}

.dashboard-agent-sandbox-has-selection .dashboard-agent-sandbox-sidebar,
.dashboard-agent-sandbox-has-selection .dashboard-agent-sandbox-stage {
  filter: blur(2px);
  pointer-events: none;
}

.dashboard-agent-sandbox-inspector[hidden] {
  display: none !important;
}

.dashboard-agent-sandbox-sidebar,
.dashboard-agent-sandbox-stage,
.dashboard-agent-sandbox-inspector {
  min-width: 0;
  color: #0f172a;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(248, 250, 252, 0.95));
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.65rem;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.1);
}

.dashboard-agent-sandbox-sidebar,
.dashboard-agent-sandbox-inspector {
  display: grid;
  align-content: start;
  gap: 0.9rem;
  padding: 1rem;
}

.dashboard-agent-sandbox .dashboard-agent-sandbox-inspector {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 41;
  box-sizing: border-box;
  width: min(42rem, calc(100vw - 2rem));
  max-height: min(44rem, calc(100vh - 2rem));
  max-height: min(44rem, calc(100dvh - 2rem));
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  transform: translate(-50%, -50%);
}

.dashboard-agent-sandbox .dashboard-agent-sandbox-inspector,
.dashboard-agent-sandbox .dashboard-agent-sandbox-palette,
.dashboard-agent-sandbox .dashboard-agent-sandbox-context-menu,
.dashboard-agent-sandbox-context-menu,
.dashboard-agent-sandbox-quick-start-card,
.dashboard-agent-sandbox-template-card,
.dashboard-agent-sandbox .dashboard-agent-sandbox-node-detail,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field textarea,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-control,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-select {
  scrollbar-color: rgba(20, 184, 166, 0.56) transparent;
  scrollbar-width: thin;
}

.dashboard-agent-sandbox .dashboard-agent-sandbox-inspector::-webkit-scrollbar,
.dashboard-agent-sandbox .dashboard-agent-sandbox-palette::-webkit-scrollbar,
.dashboard-agent-sandbox .dashboard-agent-sandbox-context-menu::-webkit-scrollbar,
.dashboard-agent-sandbox-context-menu::-webkit-scrollbar,
.dashboard-agent-sandbox-quick-start-card::-webkit-scrollbar,
.dashboard-agent-sandbox-template-card::-webkit-scrollbar,
.dashboard-agent-sandbox .dashboard-agent-sandbox-node-detail::-webkit-scrollbar,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field textarea::-webkit-scrollbar,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-control::-webkit-scrollbar,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-select::-webkit-scrollbar {
  width: 0.72rem;
  height: 0.72rem;
}

.dashboard-agent-sandbox .dashboard-agent-sandbox-inspector::-webkit-scrollbar-track,
.dashboard-agent-sandbox .dashboard-agent-sandbox-palette::-webkit-scrollbar-track,
.dashboard-agent-sandbox .dashboard-agent-sandbox-context-menu::-webkit-scrollbar-track,
.dashboard-agent-sandbox-context-menu::-webkit-scrollbar-track,
.dashboard-agent-sandbox-quick-start-card::-webkit-scrollbar-track,
.dashboard-agent-sandbox-template-card::-webkit-scrollbar-track,
.dashboard-agent-sandbox .dashboard-agent-sandbox-node-detail::-webkit-scrollbar-track,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field textarea::-webkit-scrollbar-track,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-control::-webkit-scrollbar-track,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-select::-webkit-scrollbar-track {
  margin: 0.42rem 0;
  background: transparent;
  border-radius: 999px;
}

.dashboard-agent-sandbox .dashboard-agent-sandbox-inspector::-webkit-scrollbar-thumb,
.dashboard-agent-sandbox .dashboard-agent-sandbox-palette::-webkit-scrollbar-thumb,
.dashboard-agent-sandbox .dashboard-agent-sandbox-context-menu::-webkit-scrollbar-thumb,
.dashboard-agent-sandbox-context-menu::-webkit-scrollbar-thumb,
.dashboard-agent-sandbox-quick-start-card::-webkit-scrollbar-thumb,
.dashboard-agent-sandbox-template-card::-webkit-scrollbar-thumb,
.dashboard-agent-sandbox .dashboard-agent-sandbox-node-detail::-webkit-scrollbar-thumb,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field textarea::-webkit-scrollbar-thumb,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-control::-webkit-scrollbar-thumb,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-select::-webkit-scrollbar-thumb {
  background:
    linear-gradient(180deg, rgba(45, 212, 191, 0.82), rgba(20, 184, 166, 0.72));
  border: 0.2rem solid rgba(255, 255, 255, 0.78);
  border-radius: 999px;
  box-shadow:
    0 0 10px rgba(20, 184, 166, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

.dashboard-agent-sandbox .dashboard-agent-sandbox-inspector::-webkit-scrollbar-thumb:hover,
.dashboard-agent-sandbox .dashboard-agent-sandbox-palette::-webkit-scrollbar-thumb:hover,
.dashboard-agent-sandbox .dashboard-agent-sandbox-context-menu::-webkit-scrollbar-thumb:hover,
.dashboard-agent-sandbox-context-menu::-webkit-scrollbar-thumb:hover,
.dashboard-agent-sandbox-quick-start-card::-webkit-scrollbar-thumb:hover,
.dashboard-agent-sandbox-template-card::-webkit-scrollbar-thumb:hover,
.dashboard-agent-sandbox .dashboard-agent-sandbox-node-detail::-webkit-scrollbar-thumb:hover,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field textarea::-webkit-scrollbar-thumb:hover,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-control::-webkit-scrollbar-thumb:hover,
.dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-select::-webkit-scrollbar-thumb:hover {
  background:
    linear-gradient(180deg, rgba(94, 234, 212, 0.94), rgba(13, 148, 136, 0.84));
}

.dashboard-agent-sandbox-stage {
  display: grid;
  grid-template-rows: auto auto auto auto auto minmax(28rem, 1fr);
  gap: 0.65rem;
  padding: 1rem;
}

.dashboard-agent-sandbox-panel-heading,
.dashboard-agent-sandbox-toolbar,
.dashboard-agent-sandbox-builder,
.dashboard-agent-sandbox-actions,
.dashboard-agent-sandbox-inspector-row,
.dashboard-agent-sandbox-list-tabs,
.dashboard-agent-sandbox-saved-actions,
.dashboard-agent-sandbox-modal-actions {
  display: flex;
  gap: 0.65rem;
  align-items: center;
}

.dashboard-agent-sandbox-panel-heading,
.dashboard-agent-sandbox-toolbar {
  justify-content: space-between;
}

.dashboard-agent-sandbox-builder {
  position: relative;
  align-items: stretch;
  padding: 0.78rem;
  background:
    linear-gradient(180deg, rgba(240, 253, 250, 0.92), rgba(239, 246, 255, 0.78));
  border: 1px solid rgba(20, 184, 166, 0.24);
  border-left: 0.3rem solid #0f766e;
  border-radius: 0.6rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74);
}

.dashboard-agent-sandbox-builder .form-control {
  min-width: 0;
}

.dashboard-agent-sandbox-automation-input {
  flex: 1 1 34rem;
  width: 100%;
  min-width: min(100%, 22rem);
  min-height: 2.55rem;
  max-height: 11rem;
  padding-top: 0.56rem;
  padding-bottom: 0.56rem;
  overflow-y: hidden;
  line-height: 1.25;
  resize: none;
  transition:
    height 150ms ease,
    min-height 150ms ease,
    box-shadow 150ms ease,
    border-color 150ms ease;
}

.dashboard-agent-sandbox-automation-input::placeholder {
  line-height: 1.25;
}

.dashboard-agent-sandbox-automation-focused::after {
  position: fixed;
  inset: 0;
  z-index: 44;
  content: "";
  background: rgba(15, 23, 42, 0.34);
  backdrop-filter: blur(9px);
  animation: dashboard-agent-automation-backdrop 180ms ease-out both;
}

.dashboard-agent-sandbox-automation-focused .dashboard-agent-sandbox-automation {
  position: fixed;
  top: clamp(4.5rem, 15vh, 8rem);
  left: 50%;
  z-index: 45;
  flex-wrap: wrap;
  width: min(54rem, calc(100vw - 2rem));
  padding: 1rem;
  border-color: rgba(20, 184, 166, 0.42);
  border-left-width: 0.42rem;
  box-shadow:
    0 28px 70px rgba(15, 23, 42, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.84);
  transform: translateX(-50%);
  animation: dashboard-agent-automation-pop 220ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

.dashboard-agent-sandbox-automation-focused .dashboard-agent-sandbox-automation .form-control {
  flex: 1 1 24rem;
  min-height: 3rem;
  font-size: 1rem;
}

.dashboard-agent-sandbox-automation-focused .dashboard-agent-sandbox-automation-input {
  max-height: min(16rem, 38vh);
}

.dashboard-agent-sandbox-automation-label {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  min-height: 2rem;
  color: #0f766e;
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

@keyframes dashboard-agent-automation-backdrop {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes dashboard-agent-automation-pop {
  from {
    opacity: 0;
    transform: translateX(-50%) translateY(0.6rem) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translateX(-50%) translateY(0) scale(1);
  }
}

.dashboard-agent-sandbox-small-action {
  flex: 0 0 auto;
}

.dashboard-agent-sandbox-icon-action {
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  width: 2rem;
  min-width: 2rem;
  height: 2rem;
  padding: 0;
  font-size: 1.15rem;
  line-height: 1;
}

.dashboard-agent-sandbox-palette,
.dashboard-agent-sandbox-saved-list,
.dashboard-agent-sandbox-fields {
  display: grid;
  gap: 0.55rem;
}

.dashboard-agent-sandbox-list-tabs {
  gap: 0.35rem;
  padding: 0.18rem;
  background: rgba(241, 245, 249, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 0.55rem;
}

.dashboard-agent-sandbox-list-tab {
  display: inline-flex;
  flex: 1 1 0;
  gap: 0.35rem;
  align-items: center;
  justify-content: center;
  min-height: 2rem;
  padding: 0.34rem 0.48rem;
  color: #475569;
  font-size: 0.78rem;
  font-weight: 900;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 0.42rem;
}

.dashboard-agent-sandbox-list-tab:hover,
.dashboard-agent-sandbox-list-tab:focus-visible,
.dashboard-agent-sandbox-list-tab-active {
  color: #0f766e;
  background: rgba(255, 255, 255, 0.92);
  border-color: rgba(20, 184, 166, 0.22);
  outline: none;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

.dashboard-agent-sandbox-upcoming-count {
  display: inline-grid;
  place-items: center;
  min-width: 1.18rem;
  height: 1.18rem;
  padding: 0 0.25rem;
  color: #ffffff;
  font-size: 0.68rem;
  line-height: 1;
  background: #0f766e;
  border-radius: 999px;
}

.dashboard-agent-sandbox-list-panel[hidden] {
  display: none !important;
}

.dashboard-agent-sandbox-purpose {
  padding: 0.72rem 0.78rem;
  color: #334155;
  font-size: 0.86rem;
  font-weight: 750;
  line-height: 1.45;
  background: rgba(236, 253, 245, 0.82);
  border: 1px solid rgba(20, 184, 166, 0.2);
  border-left-width: 0.28rem;
  border-radius: 0.55rem;
}

.dashboard-agent-sandbox-purpose[hidden] {
  display: none !important;
}

.dashboard-agent-sandbox-variable-chip {
  min-height: 1.85rem;
  padding: 0.24rem 0.48rem;
  color: #0f766e;
  font-size: 0.72rem;
  font-weight: 850;
  background: rgba(240, 253, 250, 0.92);
  border: 1px solid rgba(20, 184, 166, 0.24);
  border-radius: 999px;
}

.dashboard-agent-sandbox-variable-chip:hover,
.dashboard-agent-sandbox-variable-chip:focus-visible {
  color: #134e4a;
  background: #ccfbf1;
  outline: none;
}

.dashboard-agent-sandbox-variable-source {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
}

.dashboard-agent-sandbox-variable-editor {
  min-height: 2.18rem;
  line-height: 1.45;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  caret-color: #0f766e;
}

.dashboard-agent-sandbox-variable-editor:not(.dashboard-agent-sandbox-variable-editor-single) {
  min-height: 6rem;
  max-height: 14rem;
  overflow-y: auto;
}

.dashboard-agent-sandbox-variable-editor-single {
  max-height: 6rem;
  overflow-y: auto;
}

.dashboard-agent-sandbox-variable-editor:empty::before {
  color: #64748b;
  content: attr(data-placeholder);
  pointer-events: none;
}

.dashboard-agent-sandbox-variable-entity {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 0.08rem 0.38rem;
  margin: 0 0.08rem;
  color: #0f766e;
  font-size: 0.86em;
  font-weight: 900;
  line-height: 1.45;
  vertical-align: 0.08em;
  cursor: help;
  background: linear-gradient(180deg, rgba(204, 251, 241, 0.95), rgba(153, 246, 228, 0.76));
  border: 1px solid rgba(20, 184, 166, 0.34);
  border-radius: 999px;
  box-shadow: 0 6px 14px rgba(20, 184, 166, 0.14);
}

.dashboard-agent-sandbox-variable-entity:hover {
  color: #042f2e;
  background: #99f6e4;
  border-color: rgba(13, 148, 136, 0.5);
}

.dashboard-agent-sandbox-palette {
  max-height: 32rem;
  padding-right: 0.1rem;
  overflow-y: auto;
  scrollbar-color: rgba(20, 184, 166, 0.5) transparent;
  scrollbar-width: thin;
}

.dashboard-agent-sandbox-palette-block {
  position: relative;
  display: grid;
  grid-template-columns: 2.15rem minmax(0, 1fr);
  gap: 0.65rem;
  align-items: start;
  width: 100%;
  min-height: 4.45rem;
  padding: 0.78rem 2.35rem 0.78rem 0.58rem;
  color: #0f172a;
  text-align: left;
  cursor: grab;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(148, 163, 184, 0.26);
  border-radius: 0.55rem;
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.dashboard-agent-sandbox-palette-block:active {
  cursor: grabbing;
}

.dashboard-agent-sandbox-palette-block:hover,
.dashboard-agent-sandbox-palette-block:focus-visible {
  border-color: rgba(20, 184, 166, 0.38);
  outline: none;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.1);
  transform: translateY(-1px);
}

.dashboard-agent-sandbox-hotkey {
  position: absolute;
  top: 0.44rem;
  right: 0.44rem;
  display: inline-grid;
  place-items: center;
  width: 1.34rem;
  height: 1.34rem;
  color: #0f766e;
  font-size: 0.68rem;
  font-weight: 950;
  line-height: 1;
  background: rgba(204, 251, 241, 0.94);
  border: 1px solid rgba(20, 184, 166, 0.34);
  border-radius: 0.38rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
  pointer-events: none;
}

.custom-highlight {
  color: #45DFD5;
  margin-bottom: 2rem;
}

.dashboard-agent-sandbox-block-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  color: #0f172a;
  font-size: 0.7rem;
  font-weight: 900;
  line-height: 1;
  margin-top: 0.08rem;
  background: rgba(241, 245, 249, 0.94);
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 0.5rem;
}

.dashboard-agent-sandbox-block-copy,
.dashboard-agent-sandbox-saved-load {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}

.dashboard-agent-sandbox-block-copy strong,
.dashboard-agent-sandbox-saved-load strong {
  color: #0f172a;
  font-size: 0.86rem;
  font-weight: 850;
  line-height: 1.25;
  overflow-wrap: anywhere;
  white-space: normal;
}

.dashboard-agent-sandbox-block-copy small,
.dashboard-agent-sandbox-saved-load small,
.dashboard-agent-sandbox-node-detail,
.dashboard-agent-sandbox-node-meta,
.dashboard-agent-sandbox-status,
.dashboard-agent-sandbox-inspector-empty,
.dashboard-agent-sandbox-saved-empty {
  color: #64748b;
  font-size: 0.78rem;
  line-height: 1.35;
}

.dashboard-agent-sandbox-title {
  min-width: 0;
  max-width: 28rem;
  font-weight: 850;
}

.dashboard-agent-sandbox-actions {
  flex: 0 0 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.dashboard-agent-sandbox-status {
  min-height: 1.05rem;
  font-weight: 750;
}

.dashboard-agent-sandbox-run-log {
  display: inline-block;
  width: fit-content;
  max-width: min(100%, 46rem);
  padding: 0.72rem 0.78rem;
  white-space: pre-line;
  color: #334155;
  font-size: 0.86rem;
  font-weight: 750;
  line-height: 1.45;
  background: rgba(241, 245, 249, 0.86);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-left-width: 0.28rem;
  border-radius: 0.55rem;
}

.dashboard-agent-sandbox-outputs {
  display: grid;
  gap: 0.45rem;
  width: fit-content;
  max-width: min(100%, 48rem);
  padding: 0.72rem 0.78rem;
  color: #064e3b;
  font-size: 0.86rem;
  line-height: 1.45;
  background: #ecfdf5;
  border: 1px solid rgba(16, 185, 129, 0.28);
  border-left: 0.28rem solid rgba(16, 185, 129, 0.56);
  border-radius: 0.55rem;
}

.dashboard-agent-sandbox-outputs[hidden] {
  display: none !important;
}

.dashboard-agent-sandbox-output-list {
  display: grid;
  gap: 0.38rem;
  padding: 0;
  margin: 0;
  list-style: none;
}

.dashboard-agent-sandbox-output-list li {
  display: grid;
  gap: 0.12rem;
}

.dashboard-agent-sandbox-output-label {
  color: #065f46;
  font-size: 0.74rem;
  font-weight: 900;
  text-transform: uppercase;
}

.dashboard-agent-sandbox-output-value,
.dashboard-agent-sandbox-output-list a {
  overflow-wrap: anywhere;
  font-weight: 800;
}

.dashboard-agent-sandbox-run-log.text-success {
  color: #064e3b;
  background: #ecfdf5;
  border-color: rgba(16, 185, 129, 0.28);
}

.dashboard-agent-sandbox-run-log.text-danger {
  color: #7f1d1d;
  background: #fef2f2;
  border-color: rgba(239, 68, 68, 0.28);
}

.dashboard-agent-sandbox-run-log[hidden] {
  display: none !important;
}

.dashboard-agent-sandbox-canvas {
  position: relative;
  grid-row: 6;
  min-height: 34rem;
  overflow: hidden;
  background:
    linear-gradient(rgba(148, 163, 184, 0.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148, 163, 184, 0.12) 1px, transparent 1px),
    linear-gradient(180deg, rgba(248, 250, 252, 0.98), rgba(241, 245, 249, 0.95));
  background-size: 28px 28px, 28px 28px, auto;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 0.6rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
  touch-action: none;
}

.dashboard-agent-sandbox-canvas:focus-visible {
  outline: 0.18rem solid rgba(20, 184, 166, 0.32);
  outline-offset: 0.18rem;
}

.dashboard-agent-sandbox-canvas-dropping {
  border-color: rgba(20, 184, 166, 0.54);
  box-shadow:
    inset 0 0 0 0.18rem rgba(20, 184, 166, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.dashboard-agent-sandbox-canvas-space-pan,
.dashboard-agent-sandbox-canvas-pan-tool,
.dashboard-agent-sandbox-canvas-panning {
  cursor: grab;
}

.dashboard-agent-sandbox-canvas-panning {
  cursor: grabbing;
}

.dashboard-agent-sandbox-links,
.dashboard-agent-sandbox-nodes,
.dashboard-agent-sandbox-selection-box,
.dashboard-agent-sandbox-empty {
  position: absolute;
}

.dashboard-agent-sandbox-links,
.dashboard-agent-sandbox-nodes,
.dashboard-agent-sandbox-empty {
  inset: 0;
}

.dashboard-agent-sandbox-links,
.dashboard-agent-sandbox-nodes {
  transform-origin: 0 0;
}

.dashboard-agent-sandbox-links {
  z-index: 1;
  pointer-events: none;
}

.dashboard-agent-sandbox-toolbox {
  position: absolute;
  top: 0.7rem;
  right: 0.7rem;
  z-index: 8;
  display: inline-flex;
  gap: 0.22rem;
  padding: 0.22rem;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(148, 163, 184, 0.32);
  border-radius: 0.5rem;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.14);
}

.dashboard-agent-sandbox-toolbox button {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  color: #334155;
  font-size: 1rem;
  line-height: 1;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 0.35rem;
}

.dashboard-agent-sandbox-toolbox button:hover,
.dashboard-agent-sandbox-toolbox button:focus-visible,
.dashboard-agent-sandbox-tool-active {
  color: #0f766e;
  background: #ccfbf1;
  border-color: rgba(20, 184, 166, 0.34);
  outline: none;
}

.dashboard-agent-sandbox-links marker path {
  fill: #64748b;
}

.dashboard-agent-sandbox-links .dashboard-agent-sandbox-preview-marker path {
  fill: #0f766e;
}

.dashboard-agent-sandbox-link {
  fill: none;
  stroke: #94a3b8;
  stroke-linecap: round;
  stroke-width: 2.4;
  vector-effect: non-scaling-stroke;
}

.dashboard-agent-sandbox-link-selected {
  stroke: #0f766e;
  stroke-width: 3;
}

.dashboard-agent-sandbox-link-preview {
  stroke: #0f766e;
  stroke-dasharray: 7 6;
  stroke-width: 3;
}

.dashboard-agent-sandbox-link-removing {
  animation: dashboard-agent-sandbox-link-disappear 500ms ease-in forwards;
}

.dashboard-agent-sandbox-link.dashboard-agent-sandbox-link-removing {
  stroke-dasharray: 12 10;
}

.dashboard-agent-sandbox-link-label {
  fill: #0f766e;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0;
  text-rendering: geometricPrecision;
  pointer-events: none;
  stroke: #ffffff;
  stroke-linejoin: round;
  stroke-width: 4px;
  paint-order: stroke;
}

.dashboard-agent-sandbox-link-label-selected {
  fill: #115e59;
}

.dashboard-agent-sandbox-link-label.dashboard-agent-sandbox-link-removing {
  transform-box: fill-box;
  transform-origin: center;
}

@keyframes dashboard-agent-sandbox-link-disappear {
  0% {
    opacity: 1;
    stroke-dashoffset: 0;
  }
  100% {
    opacity: 0;
    stroke-dashoffset: 22;
  }
}

.dashboard-agent-sandbox-empty {
  z-index: 1;
  display: grid;
  place-items: center;
  color: #94a3b8;
  font-size: 0.9rem;
  font-weight: 850;
  pointer-events: none;
}

.dashboard-agent-sandbox-empty[hidden] {
  display: none !important;
}

.dashboard-agent-sandbox-nodes {
  z-index: 2;
}

.dashboard-agent-sandbox-selection-box {
  z-index: 3;
  background: rgba(20, 184, 166, 0.1);
  border: 1px dashed rgba(15, 118, 110, 0.82);
  border-radius: 0.35rem;
  box-shadow: 0 0 0 0.16rem rgba(20, 184, 166, 0.08);
  pointer-events: none;
}

.dashboard-agent-sandbox-selection-box[hidden] {
  display: none !important;
}

.dashboard-agent-sandbox-node {
  position: absolute;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 0.45rem;
  width: 11.8rem;
  min-height: 6.2rem;
  padding: 0.68rem 0.72rem;
  color: #0f172a;
  cursor: grab;
  user-select: none;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-left-width: 0.38rem;
  border-radius: 0.6rem;
  box-shadow: 0 16px 26px rgba(15, 23, 42, 0.12);
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease;
}

.dashboard-agent-sandbox-node-loop-scope {
  z-index: 1;
  align-content: start;
  overflow: visible;
  background:
    linear-gradient(180deg, rgba(224, 242, 254, 0.7), rgba(240, 249, 255, 0.42));
  border-color: rgba(14, 165, 233, 0.46);
  border-left-width: 0.38rem;
  border-style: dashed;
  box-shadow: inset 0 0 0 0.12rem rgba(14, 165, 233, 0.08);
}

.dashboard-agent-sandbox-node:not(.dashboard-agent-sandbox-node-loop-scope) {
  z-index: 2;
}

.dashboard-agent-sandbox-node-selected:not(.dashboard-agent-sandbox-node-loop-scope),
.dashboard-agent-sandbox-node:not(.dashboard-agent-sandbox-node-loop-scope):focus-visible {
  z-index: 3;
}

.dashboard-agent-sandbox-node-loop-scope.dashboard-agent-sandbox-node-selected,
.dashboard-agent-sandbox-node-loop-scope:focus-visible {
  z-index: 1;
}

.dashboard-agent-sandbox-node:active {
  cursor: grabbing;
}

.dashboard-agent-sandbox-node:focus-visible,
.dashboard-agent-sandbox-node-selected {
  outline: none;
  border-color: rgba(20, 184, 166, 0.54);
  box-shadow:
    0 0 0 0.18rem rgba(20, 184, 166, 0.16),
    0 18px 30px rgba(15, 23, 42, 0.14);
}

.dashboard-agent-sandbox-node:focus-visible::after,
.dashboard-agent-sandbox-node-selected::after {
  position: absolute;
  inset: -0.52rem;
  z-index: 7;
  content: "";
  pointer-events: none;
  border: 0.18rem solid #0891b2;
  border-radius: 0.9rem;
  box-shadow:
    0 0 0 0.14rem rgba(255, 255, 255, 0.96),
    0 0 0 0.42rem rgba(8, 145, 178, 0.2);
}

.dashboard-agent-sandbox-node-connecting {
  box-shadow:
    0 0 0 0.2rem rgba(14, 165, 233, 0.2),
    0 18px 30px rgba(15, 23, 42, 0.14);
}

.dashboard-agent-sandbox-node-connect-target {
  border-color: rgba(15, 118, 110, 0.76);
  box-shadow:
    0 0 0 0.24rem rgba(20, 184, 166, 0.18),
    0 20px 34px rgba(15, 23, 42, 0.16);
}

.dashboard-agent-sandbox-node-error {
  border-color: rgba(220, 38, 38, 0.82);
  box-shadow:
    0 0 0 0.22rem rgba(239, 68, 68, 0.2),
    0 20px 34px rgba(127, 29, 29, 0.18);
}

.dashboard-agent-sandbox-node-caution {
  border-color: rgba(217, 119, 6, 0.86);
  box-shadow:
    0 0 0 0.22rem rgba(245, 158, 11, 0.24),
    0 0 30px rgba(245, 158, 11, 0.28),
    0 20px 34px rgba(120, 53, 15, 0.14);
}

.dashboard-agent-sandbox-node-caution-icon {
  position: absolute;
  top: 0.46rem;
  right: 1.86rem;
  z-index: 5;
  display: inline-grid;
  place-items: center;
  width: 1.18rem;
  height: 1.18rem;
  color: #78350f;
  font-size: 0.78rem;
  font-weight: 950;
  line-height: 1;
  background: #fbbf24;
  border: 1px solid rgba(180, 83, 9, 0.48);
  border-radius: 999px;
  box-shadow: 0 6px 14px rgba(120, 53, 15, 0.24);
}

.dashboard-agent-sandbox-node-caution .dashboard-agent-sandbox-node-header {
  padding-right: 3rem;
}

.dashboard-agent-sandbox-node-header {
  display: grid;
  gap: 0.25rem;
  padding-right: 1.4rem;
}

.dashboard-agent-sandbox-node-header strong {
  overflow-wrap: anywhere;
  font-size: 0.92rem;
  font-weight: 900;
  line-height: 1.2;
}

.dashboard-agent-sandbox-node-badge {
  justify-self: start;
  max-width: 100%;
  padding: 0.16rem 0.42rem;
  overflow: hidden;
  color: #475569;
  font-size: 0.64rem;
  font-weight: 900;
  line-height: 1.1;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
  background: rgba(241, 245, 249, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 999px;
}

.dashboard-agent-sandbox-node-detail {
  display: -webkit-box;
  overflow: hidden;
  min-height: 0;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.dashboard-agent-sandbox-node-selected .dashboard-agent-sandbox-node-detail {
  display: block;
  max-height: 100%;
  padding-right: 0.12rem;
  overflow-y: auto;
  -webkit-line-clamp: unset;
}

.dashboard-agent-sandbox-node-meta {
  font-weight: 800;
}

.dashboard-agent-sandbox-handle {
  position: absolute;
  top: 50%;
  z-index: 4;
  width: 1.08rem;
  height: 1.08rem;
  padding: 0;
  background: #ffffff;
  border: 2px solid #94a3b8;
  border-radius: 999px;
  box-shadow: 0 6px 12px rgba(15, 23, 42, 0.14);
  transform: translateY(-50%);
}

.dashboard-agent-sandbox-handle:hover,
.dashboard-agent-sandbox-handle:focus-visible {
  background: #ccfbf1;
  border-color: #0f766e;
  outline: none;
}

.dashboard-agent-sandbox-node-connecting .dashboard-agent-sandbox-handle-out,
.dashboard-agent-sandbox-node-connect-target .dashboard-agent-sandbox-handle-in {
  background: #ccfbf1;
  border-color: #0f766e;
  box-shadow:
    0 0 0 0.22rem rgba(20, 184, 166, 0.18),
    0 8px 16px rgba(15, 23, 42, 0.16);
}

.dashboard-agent-sandbox-handle-in {
  left: -0.58rem;
}

.dashboard-agent-sandbox-handle-out {
  right: -0.58rem;
}

.dashboard-agent-sandbox-node-resize {
  position: absolute;
  top: 0.45rem;
  right: 0.45rem;
  z-index: 6;
  width: 1.08rem;
  height: 1.08rem;
  padding: 0;
  cursor: nwse-resize;
  background:
    linear-gradient(135deg, transparent 0 45%, #0284c7 46% 54%, transparent 55%),
    linear-gradient(135deg, transparent 0 62%, rgba(2, 132, 199, 0.72) 63% 70%, transparent 71%);
  border: 0;
  border-radius: 0.15rem;
}

.dashboard-agent-sandbox-node-resize:hover,
.dashboard-agent-sandbox-node-resize:focus-visible {
  outline: 0.16rem solid rgba(14, 165, 233, 0.24);
  outline-offset: 0.12rem;
}

.dashboard-agent-sandbox-saved-item {
  display: grid;
  gap: 0.55rem;
  padding: 0.65rem;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 0.55rem;
}

.dashboard-agent-sandbox-saved-load {
  width: 100%;
  padding: 0;
  text-align: left;
  background: transparent;
  border: 0;
}

.dashboard-agent-sandbox-saved-load:hover strong,
.dashboard-agent-sandbox-saved-load:focus-visible strong {
  color: #0f766e;
}

.dashboard-agent-sandbox-saved-load:focus-visible {
  outline: 0.16rem solid rgba(20, 184, 166, 0.24);
  outline-offset: 0.18rem;
}

.dashboard-agent-sandbox-saved-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.dashboard-agent-sandbox-upcoming-item {
  border-color: rgba(20, 184, 166, 0.28);
}

.dashboard-agent-sandbox-queue-reason,
.dashboard-agent-sandbox-queue-status {
  font-size: 0.76rem;
  line-height: 1.35;
}

.dashboard-agent-sandbox-queue-reason {
  color: #64748b;
  font-weight: 750;
}

.dashboard-agent-sandbox-queue-status {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: 0.22rem 0.45rem;
  color: #0f766e;
  font-weight: 900;
  background: rgba(204, 251, 241, 0.72);
  border: 1px solid rgba(20, 184, 166, 0.24);
  border-radius: 999px;
}

.dashboard-agent-sandbox-fields .form-label {
  margin-bottom: -0.2rem;
  color: #0f766e;
  font-size: 0.76rem;
  font-weight: 850;
}

.dashboard-agent-sandbox-field,
.dashboard-agent-sandbox-dynamic-fields {
  display: grid;
  gap: 0.42rem;
}

.dashboard-agent-sandbox-field-disabled {
  opacity: 0.56;
}

.dashboard-agent-sandbox-field-disabled .form-label {
  color: #94a3b8;
}

.dashboard-agent-sandbox-field-disabled .form-control,
.dashboard-agent-sandbox-field-disabled .form-select {
  color: #64748b;
  background: #e2e8f0;
  border-color: #cbd5e1;
  cursor: not-allowed;
}

.dashboard-agent-sandbox-no-spin {
  appearance: textfield;
  -moz-appearance: textfield;
}

.dashboard-agent-sandbox-no-spin::-webkit-inner-spin-button,
.dashboard-agent-sandbox-no-spin::-webkit-outer-spin-button {
  margin: 0;
  appearance: none;
  -webkit-appearance: none;
}

.dashboard-agent-sandbox-field input[type="date"],
.dashboard-agent-sandbox-field input[type="time"] {
  color-scheme: light;
}

.dashboard-agent-sandbox-field input[type="date"]::-webkit-calendar-picker-indicator,
.dashboard-agent-sandbox-field input[type="time"]::-webkit-calendar-picker-indicator {
  width: 1.08em;
  height: 1.08em;
  cursor: pointer;
  opacity: 0.88;
  filter: invert(1) brightness(1.18) contrast(1.08);
}

.dashboard-agent-sandbox-field input[type="date"]:disabled::-webkit-calendar-picker-indicator,
.dashboard-agent-sandbox-field input[type="time"]:disabled::-webkit-calendar-picker-indicator {
  cursor: not-allowed;
  opacity: 0.48;
}

.dashboard-agent-sandbox-field-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 0.34rem;
  align-items: center;
}

.dashboard-agent-sandbox-mini-button {
  min-height: 1.85rem;
  padding: 0.22rem 0.52rem;
  font-size: 0.72rem;
  font-weight: 850;
}

.dashboard-agent-sandbox-check,
.dashboard-agent-sandbox-platform {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  min-height: 2.2rem;
  padding: 0.45rem 0.55rem;
  color: #334155;
  font-size: 0.84rem;
  font-weight: 800;
  background: rgba(248, 250, 252, 0.88);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 0.5rem;
}

.dashboard-agent-sandbox-check .form-check-input,
.dashboard-agent-sandbox-platform .form-check-input {
  flex: 0 0 auto;
  margin-top: 0.16em;
  margin-left: 0;
}

.dashboard-agent-sandbox-check span,
.dashboard-agent-sandbox-platform span {
  min-width: 0;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.dashboard-agent-sandbox-platforms {
  display: grid;
  gap: 0.45rem;
}

.dashboard-agent-sandbox-undo-toast {
  position: fixed;
  right: clamp(1rem, 3vw, 2rem);
  bottom: clamp(1rem, 3vw, 2rem);
  z-index: 60;
  display: flex;
  gap: 0.75rem;
  align-items: center;
  max-width: min(28rem, calc(100vw - 2rem));
  padding: 0.72rem 0.78rem;
  color: #0f172a;
  font-size: 0.88rem;
  font-weight: 800;
  line-height: 1.35;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(20, 184, 166, 0.28);
  border-left: 0.28rem solid #0f766e;
  border-radius: 0.6rem;
  box-shadow: 0 20px 44px rgba(15, 23, 42, 0.18);
}

.dashboard-agent-sandbox-undo-toast[hidden] {
  display: none !important;
}

.dashboard-agent-sandbox-quick-start {
  position: fixed;
  inset: 0;
  z-index: 64;
  display: grid;
  place-items: center;
  padding: 1rem;
  background: rgba(15, 23, 42, 0.36);
  backdrop-filter: blur(9px);
}

.dashboard-agent-sandbox-quick-start[hidden] {
  display: none !important;
}

.dashboard-agent-sandbox-quick-start-card {
  display: grid;
  gap: 1rem;
  width: min(43rem, 100%);
  max-height: min(42rem, calc(100vh - 2rem));
  max-height: min(42rem, calc(100dvh - 2rem));
  padding: 1rem;
  overflow-y: auto;
  color: #0f172a;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(240, 253, 250, 0.96));
  border: 1px solid rgba(20, 184, 166, 0.28);
  border-radius: 0.65rem;
  box-shadow: 0 28px 70px rgba(15, 23, 42, 0.28);
  animation: dashboard-agent-quick-start-pop 180ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

.dashboard-agent-sandbox-quick-start-heading,
.dashboard-agent-sandbox-quick-start-actions {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  justify-content: space-between;
}

.dashboard-agent-sandbox-quick-start-heading h3 {
  margin: 0.1rem 0 0;
  font-size: 1.26rem;
  font-weight: 950;
  letter-spacing: 0;
}

.dashboard-agent-sandbox-quick-start-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.7rem;
}

.dashboard-agent-sandbox-quick-start-grid section {
  min-width: 0;
  padding: 0.8rem;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 0.55rem;
}

.dashboard-agent-sandbox-quick-start-grid h4 {
  margin: 0 0 0.32rem;
  color: #0f766e;
  font-size: 0.82rem;
  font-weight: 950;
  letter-spacing: 0;
}

.dashboard-agent-sandbox-quick-start-grid p {
  margin: 0;
  color: #334155;
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.42;
}

.dashboard-agent-sandbox-quick-start-actions {
  flex-wrap: wrap;
  padding-top: 0.2rem;
}

@keyframes dashboard-agent-quick-start-pop {
  from {
    opacity: 0;
    transform: translateY(0.5rem) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.dashboard-agent-sandbox-template-chooser {
  position: fixed;
  inset: 0;
  z-index: 65;
  display: grid;
  place-items: center;
  padding: 1rem;
  background: rgba(15, 23, 42, 0.38);
  backdrop-filter: blur(10px);
}

.dashboard-agent-sandbox-template-chooser[hidden],
.dashboard-agent-sandbox-template-list-view[hidden],
.dashboard-agent-sandbox-template-choice-grid[hidden] {
  display: none !important;
}

.dashboard-agent-sandbox-template-card {
  display: grid;
  gap: 1rem;
  width: min(54rem, 100%);
  max-height: min(46rem, calc(100vh - 2rem));
  max-height: min(46rem, calc(100dvh - 2rem));
  padding: 1rem;
  overflow-y: auto;
  color: #0f172a;
  background:
    radial-gradient(circle at 12% 0%, rgba(204, 251, 241, 0.72), transparent 26rem),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(240, 253, 250, 0.96));
  border: 1px solid rgba(20, 184, 166, 0.3);
  border-radius: 0.65rem;
  box-shadow: 0 30px 74px rgba(15, 23, 42, 0.3);
  animation: dashboard-agent-quick-start-pop 180ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

.dashboard-agent-sandbox-template-heading {
  display: flex;
  gap: 0.8rem;
  align-items: flex-start;
  justify-content: space-between;
}

.dashboard-agent-sandbox-template-heading h3 {
  margin: 0.1rem 0 0;
  font-size: 1.28rem;
  font-weight: 950;
  letter-spacing: 0;
}

.dashboard-agent-sandbox-template-heading p {
  max-width: 42rem;
  margin: 0.32rem 0 0;
  color: #334155;
  font-size: 0.92rem;
  font-weight: 750;
  line-height: 1.4;
}

.dashboard-agent-sandbox-template-choice-grid,
.dashboard-agent-sandbox-template-grid {
  display: grid;
  gap: 0.72rem;
}

.dashboard-agent-sandbox-template-choice-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-agent-sandbox-template-list-view {
  display: grid;
  gap: 0.8rem;
}

.dashboard-agent-sandbox-template-grid {
  grid-template-columns: repeat(auto-fit, minmax(10.2rem, 1fr));
}

.dashboard-agent-sandbox-template-choice,
.dashboard-agent-sandbox-template-option {
  position: relative;
  display: grid;
  min-width: 0;
  color: #0f172a;
  text-align: left;
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(148, 163, 184, 0.25);
  border-left-width: 0.34rem;
  border-radius: 0.58rem;
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.1);
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.dashboard-agent-sandbox-template-choice {
  grid-template-columns: 2.55rem minmax(0, 1fr);
  gap: 0.74rem;
  align-items: start;
  min-height: 6.4rem;
  padding: 0.92rem;
}

.dashboard-agent-sandbox-template-option {
  grid-template-rows: auto minmax(0, 1fr);
  gap: 0.65rem;
  min-height: 13rem;
  padding: 0.82rem;
}

.dashboard-agent-sandbox-template-choice:hover,
.dashboard-agent-sandbox-template-choice:focus-visible,
.dashboard-agent-sandbox-template-option:hover,
.dashboard-agent-sandbox-template-option:focus-visible {
  border-color: rgba(20, 184, 166, 0.46);
  outline: none;
  box-shadow:
    0 0 0 0.18rem rgba(20, 184, 166, 0.12),
    0 18px 38px rgba(15, 23, 42, 0.14);
  transform: translateY(-1px);
}

.dashboard-agent-sandbox-template-icon {
  display: inline-grid;
  place-items: center;
  width: 2.55rem;
  height: 2.55rem;
  color: #0f766e;
  background:
    linear-gradient(180deg, rgba(204, 251, 241, 0.96), rgba(224, 242, 254, 0.9));
  border: 1px solid rgba(20, 184, 166, 0.32);
  border-radius: 0.52rem;
  box-shadow:
    0 10px 22px rgba(20, 184, 166, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.76);
}

.dashboard-agent-sandbox-template-icon svg {
  width: 1.42rem;
  height: 1.42rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.dashboard-agent-sandbox-template-choice strong,
.dashboard-agent-sandbox-template-option strong {
  display: block;
  color: #0f172a;
  font-size: 0.92rem;
  font-weight: 920;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.dashboard-agent-sandbox-template-choice small,
.dashboard-agent-sandbox-template-copy small {
  display: block;
  color: #0f766e;
  font-size: 0.7rem;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1.1;
  text-transform: uppercase;
}

.dashboard-agent-sandbox-template-choice small {
  margin-top: 0.26rem;
  color: #64748b;
  font-size: 0.8rem;
  font-weight: 750;
  line-height: 1.35;
  text-transform: none;
}

.dashboard-agent-sandbox-template-copy {
  display: grid;
  gap: 0.28rem;
  min-width: 0;
}

.dashboard-agent-sandbox-template-copy span {
  color: #334155;
  font-size: 0.82rem;
  font-weight: 720;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.dashboard-agent-sandbox-template-back {
  justify-self: start;
}

@media (prefers-reduced-motion: reduce) {
  .dashboard-agent-sandbox-link-removing,
  .dashboard-agent-sandbox-quick-start-card,
  .dashboard-agent-sandbox-template-card {
    animation-duration: 1ms;
  }
}

.dashboard-agent-sandbox-context-menu {
  position: fixed;
  z-index: 62;
  display: grid;
  gap: 0.1rem;
  min-width: 10.5rem;
  max-height: min(28rem, calc(100vh - 1rem));
  padding: 0.28rem;
  overflow-y: auto;
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid rgba(148, 163, 184, 0.32);
  border-radius: 0.55rem;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.18);
}

.dashboard-agent-sandbox-context-menu[hidden] {
  display: none !important;
}

.dashboard-agent-sandbox-context-menu button {
  position: relative;
  display: grid;
  gap: 0.06rem;
  width: 100%;
  min-height: 2.15rem;
  padding: 0.45rem 2.35rem 0.45rem 0.58rem;
  color: #0f172a;
  font-size: 0.84rem;
  font-weight: 850;
  text-align: left;
  background: transparent;
  border: 0;
  border-radius: 0.4rem;
}

.dashboard-agent-sandbox-context-menu-heading {
  padding: 0.3rem 0.58rem 0.18rem;
  color: #0f766e;
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.dashboard-agent-sandbox-context-menu button strong,
.dashboard-agent-sandbox-context-menu button small {
  display: block;
  min-width: 0;
  line-height: 1.22;
}

.dashboard-agent-sandbox-context-menu button small {
  color: #64748b;
  font-size: 0.72rem;
  font-weight: 800;
}

.dashboard-agent-sandbox-context-menu button:hover,
.dashboard-agent-sandbox-context-menu button:focus-visible {
  color: #134e4a;
  background: #ccfbf1;
  outline: none;
}

.dashboard-agent-sandbox-platform:has(input:disabled) {
  color: #94a3b8;
  background: rgba(241, 245, 249, 0.74);
}

.dashboard-agent-sandbox-future-performer-select,
.dashboard-agent-sandbox-future-performer-choice {
  color: #064e3b;
  background: linear-gradient(135deg, rgba(204, 251, 241, 0.92), rgba(236, 253, 245, 0.94));
  border-color: rgba(20, 184, 166, 0.45);
  box-shadow: inset 0 0 0 1px rgba(20, 184, 166, 0.12);
}

.dashboard-agent-sandbox-future-performer-choice:has(input:checked) {
  border-color: rgba(15, 118, 110, 0.62);
  box-shadow:
    inset 0 0 0 1px rgba(15, 118, 110, 0.22),
    0 10px 22px rgba(20, 184, 166, 0.12);
}

.dashboard-agent-sandbox-future-performer-help {
  color: #0f766e;
  font-weight: 800;
}

.dashboard-agent-sandbox-field-help {
  color: #64748b;
  font-size: 0.76rem;
  line-height: 1.35;
}

.dashboard-agent-sandbox-inspector-row {
  flex-wrap: wrap;
}

.dashboard-agent-sandbox-save-exit {
  width: 100%;
  margin-top: 0.35rem;
}

.dashboard-agent-sandbox-node-mint {
  border-left-color: #14b8a6;
}

.dashboard-agent-sandbox-node-sky {
  border-left-color: #0ea5e9;
}

.dashboard-agent-sandbox-node-amber {
  border-left-color: #f59e0b;
}

.dashboard-agent-sandbox-node-rose {
  border-left-color: #e11d48;
}

.dashboard-agent-sandbox-node-violet {
  border-left-color: #8b5cf6;
}

.dashboard-agent-sandbox-node-slate {
  border-left-color: #64748b;
}

.dashboard-agent-sandbox-node-green {
  border-left-color: #22c55e;
}

.dashboard-agent-sandbox-node-cyan {
  border-left-color: #06b6d4;
}

.dashboard-agent-sandbox-node-yellow {
  border-left-color: #eab308;
}

.dashboard-agent-sandbox-node-orange {
  border-left-color: #f97316;
}

.dashboard-agent-sandbox-node-red {
  border-left-color: #ef4444;
}

.dashboard-agent-chat,
.dashboard-agent-panel,
.dashboard-agent-summary {
  color: #0f172a;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(248, 250, 252, 0.95));
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.65rem;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.1);
}

.dashboard-agent-chat {
  display: grid;
  gap: 1rem;
  min-height: 34rem;
  padding: 1rem;
}

.dashboard-agent-chat-wide {
  min-height: min(72vh, 49rem);
  padding: 1.1rem;
}

.dashboard-agent-chat-workbench {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem;
  align-items: stretch;
  width: 100%;
  box-sizing: border-box;
  margin-top: 0.85rem;
  padding: 0.75rem;
  background:
    linear-gradient(135deg, rgba(241, 245, 249, 0.72), rgba(236, 253, 245, 0.56));
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 0.6rem;
}

.dashboard-agent-chat-workbench .dashboard-agent-panel,
.dashboard-agent-chat-workbench .dashboard-agent-summary {
  min-width: 0;
  padding: 0.85rem;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: none;
}

.dashboard-agent-chat-workbench .dashboard-agent-summary,
.dashboard-agent-chat-workbench .dashboard-agent-artifacts-panel {
  grid-column: 1 / -1;
}

.dashboard-agent-chat-workbench .dashboard-agent-workflow-panel {
  grid-column: 1 / -1;
}

.dashboard-agent-chat-workbench .dashboard-agent-panel-heading {
  margin-bottom: 0.65rem;
}

.dashboard-agent-chat-workbench .dashboard-agent-progress-item {
  font-size: 0.84rem;
}

.dashboard-agent-chat-workbench .dashboard-agent-workflow-step {
  padding: 0.62rem;
}

.dashboard-agent-session-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.78rem 0.85rem;
  background:
    linear-gradient(135deg, rgba(236, 253, 245, 0.9), rgba(240, 249, 255, 0.9));
  border: 1px solid rgba(20, 184, 166, 0.18);
  border-radius: 0.55rem;
}

.dashboard-agent-session-bar strong,
.dashboard-agent-session-label {
  display: block;
}

.dashboard-agent-session-bar strong {
  color: #0f172a;
  font-size: 1rem;
  font-weight: 850;
  line-height: 1.2;
}

.dashboard-agent-session-label {
  color: #0f766e;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1.2;
  text-transform: uppercase;
}

.dashboard-agent-messages {
  display: grid;
  align-content: start;
  gap: 0.7rem;
  min-height: 23rem;
  max-height: 30rem;
  padding: 0.25rem 0.35rem 0.25rem 0.05rem;
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-behavior: smooth;
  scrollbar-color: rgba(20, 184, 166, 0.56) transparent;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}

.dashboard-agent-chat-wide .dashboard-agent-messages {
  min-height: min(52vh, 33rem);
  max-height: min(58vh, 36rem);
}

.dashboard-agent-message {
  width: min(100%, 44rem);
  max-width: min(92%, 44rem);
}

.dashboard-agent-chat-wide .dashboard-agent-message {
  width: min(100%, 58rem);
  max-width: min(92%, 58rem);
}

.dashboard-agent-message-workflow {
  width: min(100%, 70rem);
  max-width: 100%;
}

.dashboard-agent-chat-wide .dashboard-agent-message-workflow {
  width: 100%;
  max-width: 100%;
}

.dashboard-agent-message-user {
  justify-self: end;
  justify-content: flex-end;
  margin-bottom: 0.35rem;
}

.dashboard-agent-message-user .dashboard-agent-bubble {
  color: #052f2f;
  background: linear-gradient(135deg, #99f6e4, #67e8f9);
  border-color: rgba(20, 184, 166, 0.28);
  border-radius: 1.15rem 1.15rem 0.35rem 1.15rem;
}

.dashboard-agent-bubble {
  max-width: min(100%, 40rem);
}

.dashboard-agent-chat-wide .dashboard-agent-bubble {
  max-width: min(100%, 52rem);
  white-space: pre-line;
}

.dashboard-agent-bubble-workflow,
.dashboard-agent-chat-wide .dashboard-agent-bubble-workflow {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.dashboard-agent-bubble-text,
.dashboard-agent-response-inline,
.dashboard-agent-response-panel,
.dashboard-agent-action-row,
.dashboard-agent-chat-summary {
  display: block;
}

.dashboard-agent-response-panel {
  margin-top: 0.85rem;
  padding: 0.85rem;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 0.55rem;
}

.dashboard-agent-response-kicker,
.dashboard-agent-followup-label {
  display: block;
  color: #0f766e;
  font-size: 0.7rem;
  font-weight: 850;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: uppercase;
}

.dashboard-agent-response-kicker {
  margin-bottom: 0.45rem;
}

.dashboard-agent-bubble > .dashboard-agent-followup {
  margin-top: 1.65rem;
}

.dashboard-agent-bubble > .dashboard-agent-followup:first-child {
  margin-top: 0;
}

.dashboard-agent-followup {
  display: grid;
  gap: 0.28rem;
  padding: 0.72rem 0.78rem;
  color: #075985;
  background: #e0f2fe;
  border: 1px solid rgba(14, 165, 233, 0.24);
  border-left-width: 0.28rem;
  border-radius: 0.5rem;
}

.dashboard-agent-followup-label {
  color: #0369a1;
}

.dashboard-agent-followup-question {
  color: #0f172a;
  font-weight: 800;
  line-height: 1.45;
}

.dashboard-agent-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.8rem;
}

.dashboard-agent-quick-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.85rem;
}

.dashboard-agent-quick-option {
  min-height: 2rem;
  padding: 0.35rem 0.62rem;
  color: #0f766e;
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.2;
  background: #ecfdf5;
  border: 1px solid rgba(15, 118, 110, 0.2);
  border-radius: 0.45rem;
}

.dashboard-agent-quick-option:hover,
.dashboard-agent-quick-option:focus-visible,
.dashboard-agent-quick-option-selected {
  color: #042f2e;
  background: #99f6e4;
  border-color: rgba(15, 118, 110, 0.38);
}

.dashboard-agent-quick-submit {
  min-height: 2rem;
}

.dashboard-agent-chat-action {
  min-height: 2rem;
}

.dashboard-agent-chat-summary {
  margin-top: 0.75rem;
  padding-top: 0.7rem;
  color: #0f766e;
  font-size: 0.88rem;
  font-weight: 800;
  border-top: 1px solid rgba(20, 184, 166, 0.18);
}

.dashboard-agent-compose {
  display: grid;
  gap: 0.55rem;
  align-self: end;
}

.dashboard-agent-compose-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  justify-content: space-between;
}

.dashboard-agent-status {
  flex: 1 1 14rem;
}

.dashboard-agent-input {
  min-height: 6.2rem;
}

.dashboard-agent-limit-near .dashboard-agent-input {
  padding-bottom: 2.55rem;
}

.dashboard-agent-input-reminder {
  position: absolute;
  right: 4.2rem;
  bottom: 0.55rem;
  left: 1rem;
  z-index: 2;
  padding: 0.28rem 0.52rem;
  color: #0f766e;
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1.25;
  pointer-events: none;
  background: rgba(236, 253, 245, 0.94);
  border: 1px solid rgba(15, 118, 110, 0.16);
  border-radius: 0.45rem;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

.dashboard-agent-workbench {
  display: grid;
  gap: 1rem;
}

.dashboard-agent-panel,
.dashboard-agent-summary {
  padding: 1.1rem;
}

.dashboard-agent-panel-heading {
  display: grid;
  gap: 0.18rem;
  margin-bottom: 0.9rem;
}

.dashboard-agent-panel-kicker {
  color: #0f766e;
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.dashboard-agent-panel-heading h3 {
  margin: 0;
  color: #0f172a;
  font-size: 1rem;
  font-weight: 850;
}

.dashboard-agent-progress,
.dashboard-agent-workflow-list,
.dashboard-agent-artifact-list {
  display: grid;
  gap: 0.65rem;
  padding: 0;
  margin: 0;
  list-style: none;
}

.dashboard-agent-progress-item {
  display: grid;
  grid-template-columns: 0.9rem minmax(0, 1fr);
  gap: 0.55rem;
  align-items: start;
  color: #334155;
  font-size: 0.9rem;
  line-height: 1.45;
}

.dashboard-agent-progress-marker {
  width: 0.58rem;
  height: 0.58rem;
  margin-top: 0.32rem;
  background: #94a3b8;
  border-radius: 999px;
}

.dashboard-agent-progress-done .dashboard-agent-progress-marker {
  background: #14b8a6;
}

.dashboard-agent-progress-active .dashboard-agent-progress-marker {
  background: #0ea5e9;
  box-shadow: 0 0 0 0.25rem rgba(14, 165, 233, 0.14);
  animation: guide-robot-bob 0.8s ease-in-out infinite;
}

.dashboard-agent-progress-blocked .dashboard-agent-progress-marker,
.dashboard-agent-progress-user_action .dashboard-agent-progress-marker {
  background: #f59e0b;
}

.dashboard-agent-workflow-intro,
.dashboard-agent-empty {
  color: #475569;
  line-height: 1.55;
}

.dashboard-agent-workflow-list {
  counter-reset: dashboard-agent-workflow;
  grid-auto-columns: minmax(14rem, 1fr);
  grid-auto-flow: column;
  grid-template-columns: none;
  column-gap: 2.45rem;
  row-gap: 0.85rem;
  align-items: stretch;
  padding: 0 0.2rem 0.35rem 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-color: rgba(14, 165, 233, 0.38) transparent;
  scrollbar-width: thin;
}

.dashboard-agent-workflow-step {
  position: relative;
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr);
  gap: 0.7rem;
  align-items: start;
  height: 100%;
  padding: 0.75rem;
  background: rgba(241, 245, 249, 0.84);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 0.55rem;
}

.dashboard-agent-workflow-step:not(:last-child)::after,
.dashboard-agent-workflow-step:not(:last-child)::before {
  position: absolute;
  top: 50%;
  z-index: 2;
  content: "";
  pointer-events: none;
}

.dashboard-agent-workflow-step:not(:last-child)::after {
  left: calc(100% + 0.35rem);
  width: 1.7rem;
  height: 0.14rem;
  background: #cbd5e1;
  border-radius: 999px;
  transform: translateY(-50%);
}

.dashboard-agent-workflow-step:not(:last-child)::before {
  left: calc(100% + 1.72rem);
  width: 0.52rem;
  height: 0.52rem;
  border: solid #cbd5e1;
  border-width: 0.14rem 0.14rem 0 0;
  transform: translateY(-50%) rotate(45deg);
}

.dashboard-agent-workflow-step-done:not(:last-child)::after {
  background: #0ea5e9;
  box-shadow: 0 0 0 0.18rem rgba(14, 165, 233, 0.1);
}

.dashboard-agent-workflow-step-done:not(:last-child)::before {
  border-color: #0ea5e9;
}

.dashboard-agent-workflow-step-done {
  color: #64748b;
  background: rgba(241, 245, 249, 0.58);
  border-color: rgba(148, 163, 184, 0.16);
}

.dashboard-agent-workflow-step-active {
  background: rgba(240, 249, 255, 0.94);
  border-color: rgba(14, 165, 233, 0.34);
  box-shadow: 0 0 0 0.18rem rgba(14, 165, 233, 0.08);
}

.dashboard-agent-workflow-step-done .dashboard-agent-workflow-number {
  color: #ffffff;
  background: #94a3b8;
  border-color: rgba(100, 116, 139, 0.24);
}

.dashboard-agent-workflow-step-blocked .dashboard-agent-workflow-number,
.dashboard-agent-workflow-step-user_action .dashboard-agent-workflow-number {
  color: #78350f;
  background: #fde68a;
  border-color: rgba(245, 158, 11, 0.28);
}

.dashboard-agent-workflow-number {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  color: #0f766e;
  font-size: 0.82rem;
  font-weight: 850;
  background: #ccfbf1;
  border: 1px solid rgba(15, 118, 110, 0.16);
  border-radius: 0.5rem;
}

.dashboard-agent-workflow-copy {
  display: grid;
  gap: 0.28rem;
  min-width: 0;
}

.dashboard-agent-workflow-title-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  min-width: 0;
}

.dashboard-agent-workflow-copy strong {
  color: #0f172a;
  font-size: 0.96rem;
  line-height: 1.25;
}

.dashboard-agent-workflow-step-done .dashboard-agent-workflow-copy strong,
.dashboard-agent-workflow-step-done .dashboard-agent-workflow-copy small {
  color: #64748b;
}

.dashboard-agent-workflow-copy small {
  color: #475569;
  line-height: 1.45;
}

.dashboard-agent-workflow-status {
  display: inline-flex;
  align-items: center;
  min-height: 1.35rem;
  padding: 0.18rem 0.42rem;
  color: #475569;
  font-size: 0.68rem;
  font-weight: 850;
  line-height: 1;
  text-transform: uppercase;
  background: rgba(226, 232, 240, 0.76);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 999px;
}

.dashboard-agent-workflow-status-done {
  color: #475569;
  background: rgba(226, 232, 240, 0.86);
}

.dashboard-agent-workflow-status-active {
  color: #075985;
  background: #e0f2fe;
  border-color: rgba(14, 165, 233, 0.22);
}

.dashboard-agent-workflow-status-blocked,
.dashboard-agent-workflow-status-user_action {
  color: #78350f;
  background: #fef3c7;
  border-color: rgba(245, 158, 11, 0.24);
}

.dashboard-agent-step-link {
  justify-self: start;
  color: #0f766e;
  font-size: 0.82rem;
  font-weight: 800;
  text-decoration: none;
}

.dashboard-agent-step-link:hover,
.dashboard-agent-step-link:focus {
  color: #0d9488;
  text-decoration: underline;
}

.dashboard-agent-open {
  width: 100%;
  margin-top: 0.9rem;
}

.dashboard-agent-summary {
  color: #064e3b;
  font-weight: 750;
  line-height: 1.5;
  background: linear-gradient(180deg, #ecfdf5, #f0fdfa);
  border-color: rgba(16, 185, 129, 0.24);
}

.dashboard-agent-summary[hidden] {
  display: none;
}

.dashboard-agent-artifact-list {
  gap: 0.5rem;
}

.dashboard-agent-artifact-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 2.35rem;
  padding: 0.55rem 0.7rem;
  color: #0f766e;
  font-size: 0.86rem;
  font-weight: 800;
  text-decoration: none;
  text-transform: capitalize;
  background: rgba(236, 253, 245, 0.9);
  border: 1px solid rgba(20, 184, 166, 0.2);
  border-radius: 0.45rem;
}

.dashboard-agent-artifact-link::after {
  content: "Open";
  color: #64748b;
  font-size: 0.72rem;
  font-weight: 850;
  text-transform: uppercase;
}

.dashboard-agent-artifact-link:hover,
.dashboard-agent-artifact-link:focus {
  color: #042f2e;
  background: #99f6e4;
  border-color: rgba(20, 184, 166, 0.36);
}

.dashboard-agent-trace-list {
  gap: 0.55rem;
}

@media (max-width: 991.98px) {
  .dashboard-agent-sandbox {
    grid-template-columns: minmax(12rem, 0.34fr) minmax(0, 1fr);
  }

  .dashboard-agent-sandbox-has-selection {
    grid-template-columns: minmax(12rem, 0.34fr) minmax(0, 1fr);
  }

  .dashboard-agent-sandbox-stage {
    grid-template-rows: auto auto auto auto auto minmax(26rem, 1fr);
  }

  .dashboard-agent-sandbox-canvas {
    min-height: 31rem;
  }

  .dashboard-agent-chat {
    min-height: 28rem;
  }

  .dashboard-agent-chat-workbench {
    grid-template-columns: minmax(0, 1fr);
  }

  .dashboard-agent-chat-workbench .dashboard-agent-workflow-panel {
    grid-column: 1 / -1;
  }

  .dashboard-agent-messages {
    min-height: 17rem;
    max-height: 24rem;
  }
}

@media (max-width: 575.98px) {
  .dashboard-agent-hero {
    align-items: flex-start;
    flex-direction: column;
  }

  .dashboard-agent-chat,
  .dashboard-agent-shell,
  .dashboard-agent-sandbox-sidebar,
  .dashboard-agent-sandbox-stage,
  .dashboard-agent-sandbox-inspector {
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }

  .dashboard-agent-shell {
    width: calc(100% + 2rem);
    margin-right: -1rem;
    margin-left: -1rem;
  }

  .dashboard-agent-tabs {
    width: calc(100% - 2rem);
    margin-right: 1rem;
    margin-left: 1rem;
  }

  .dashboard-agent-tab {
    flex: 1 1 0;
    min-width: 0;
  }

  .dashboard-agent-sandbox {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }

  .dashboard-agent-sandbox-sidebar,
  .dashboard-agent-sandbox-stage,
  .dashboard-agent-sandbox-inspector {
    padding: 0.85rem;
  }

  .dashboard-agent-sandbox .dashboard-agent-sandbox-inspector {
    width: min(34rem, calc(100vw - 1rem));
    max-height: calc(100vh - 1rem);
    max-height: calc(100dvh - 1rem);
    padding: 0.9rem;
    border-radius: 0.65rem;
  }

  .dashboard-agent-sandbox-palette {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-height: none;
  }

  .dashboard-agent-sandbox-palette-block {
    grid-template-columns: 1fr;
    align-content: start;
  }

  .dashboard-agent-sandbox-toolbar,
  .dashboard-agent-sandbox-builder {
    align-items: stretch;
    flex-direction: column;
  }

  .dashboard-agent-sandbox-automation-focused .dashboard-agent-sandbox-automation {
    top: 1rem;
    width: min(34rem, calc(100vw - 1rem));
    max-height: calc(100vh - 2rem);
    max-height: calc(100dvh - 2rem);
    overflow-y: auto;
  }

  .dashboard-agent-sandbox-title {
    max-width: none;
  }

  .dashboard-agent-sandbox-actions {
    justify-content: stretch;
  }

  .dashboard-agent-sandbox-actions .btn {
    flex: 1 1 0;
  }

  .dashboard-agent-sandbox-quick-start-card {
    width: min(34rem, calc(100vw - 1rem));
    max-height: calc(100vh - 1rem);
    max-height: calc(100dvh - 1rem);
  }

  .dashboard-agent-sandbox-template-card {
    width: min(34rem, calc(100vw - 1rem));
    max-height: calc(100vh - 1rem);
    max-height: calc(100dvh - 1rem);
  }

  .dashboard-agent-sandbox-quick-start-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-agent-sandbox-template-heading {
    align-items: stretch;
  }

  .dashboard-agent-sandbox-template-choice-grid,
  .dashboard-agent-sandbox-template-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-agent-sandbox-template-option {
    grid-template-columns: 2.55rem minmax(0, 1fr);
    grid-template-rows: auto;
    min-height: 0;
  }

  .dashboard-agent-sandbox-quick-start-actions .btn {
    flex: 1 1 10rem;
  }

  .dashboard-agent-sandbox-canvas {
    min-height: 30rem;
  }

  .dashboard-agent-sandbox-node {
    width: 10.65rem;
  }

  .dashboard-agent-chat-workbench {
    grid-template-columns: 1fr;
    padding: 0.55rem;
  }

  .dashboard-agent-chat-workbench .dashboard-agent-workflow-panel {
    grid-column: auto;
  }

  .dashboard-agent-workflow-list {
    grid-auto-columns: minmax(10rem, 1fr);
    column-gap: 2.15rem;
  }

  .dashboard-agent-message {
    max-width: 96%;
  }

  .dashboard-agent-workflow-step {
    grid-template-columns: 1.8rem minmax(0, 1fr);
    padding: 0.68rem;
  }

  .dashboard-agent-workflow-number {
    width: 1.8rem;
    height: 1.8rem;
  }

  .onboarding-edit-section-heading {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .onboarding-status-pill {
    grid-column: 2;
    width: max-content;
  }
}

.performer-info-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-height: 172px;
  padding: 1.35rem;
  color: #111827;
  background: linear-gradient(
    145deg,
    rgba(255, 255, 255, 0.98),
    rgba(239, 246, 255, 0.94)
  );
  border: 1px solid rgba(96, 165, 250, 0.22);
  border-radius: 0.65rem;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.1);
}

.performer-info-card.performer-needs-onboarding,
.performer-info-card.performer-needs-changes {
  background: linear-gradient(145deg, #fff7ed, #ffffff);
  border-color: rgba(217, 119, 6, 0.78);
  box-shadow:
    0 0 0 3px rgba(245, 158, 11, 0.18),
    0 14px 32px rgba(120, 53, 15, 0.14);
}

.performer-info-card-main {
  display: flex;
  flex: 1 1 auto;
  gap: 1rem;
  min-width: 0;
  padding-right: 2.65rem;
}

.performer-info-icon {
  flex: 0 0 3rem;
}

.performer-onboarding-alert,
.performer-change-alert {
  margin: 0.7rem 0 0.75rem;
  padding: 0.72rem 0.85rem;
  color: #78350f;
  background: #fffbeb;
  border: 1px solid rgba(217, 119, 6, 0.34);
  border-left: 4px solid #d97706;
  border-radius: 0.5rem;
}

.performer-onboarding-alert strong,
.performer-onboarding-alert p,
.performer-change-alert strong,
.performer-change-alert p {
  display: block;
}

.performer-onboarding-alert p,
.performer-change-alert p {
  margin: 0.25rem 0 0;
  color: #92400e;
  line-height: 1.4;
}

.performer-onboarding-note {
  font-size: 0.9rem;
}

.performer-archive-form {
  position: absolute;
  top: 0.85rem;
  right: 0.85rem;
  z-index: 2;
  margin: 0;
}

.performer-archive-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  padding: 0;
  color: #991b1b;
  background: rgba(254, 226, 226, 0.9);
  border: 1px solid rgba(248, 113, 113, 0.3);
  border-radius: 0.55rem;
  transition:
    color 0.18s ease,
    background-color 0.18s ease,
    border-color 0.18s ease,
    transform 0.18s ease;
}

.performer-archive-button:hover,
.performer-archive-button:focus {
  color: #ffffff;
  background: #dc2626;
  border-color: #dc2626;
  transform: translateY(-1px);
}

.performer-archive-button svg {
  width: 1.18rem;
  height: 1.18rem;
}

.performer-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: stretch;
  margin-top: auto;
}

.performer-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 2.8rem;
  padding: 0.62rem 0.9rem;
  font-size: 0.92rem;
  line-height: 1.15;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
}

.performer-card-actions .copy-verify-link {
  flex: 0 1 10rem;
}

.performer-action-compact {
  min-height: 2.25rem;
  padding: 0.46rem 0.72rem;
  font-size: 0.84rem;
}

.performer-info-view-action {
  flex: 1 1 14rem;
  font-weight: 700;
}

.performer-action.btn-secondary {
  color: #ffffff;
  background: linear-gradient(135deg, #475569, #334155);
  border: 0;
}

.performer-action.btn-success {
  color: #052e2b;
  background: linear-gradient(135deg, #5eead4, #34d399);
  border: 0;
  box-shadow: 0 16px 30px rgba(20, 184, 166, 0.18);
}

.performer-action.btn-danger {
  background: linear-gradient(135deg, #ef4444, #dc2626);
  border: 0;
  box-shadow: 0 16px 30px rgba(220, 38, 38, 0.16);
}

.performer-section-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

.performer-section-choice {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  min-height: 11rem;
  padding: 1.2rem;
  color: #0f172a;
  text-decoration: none;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(96, 165, 250, 0.22);
  border-radius: 0.5rem;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.1);
  transition:
    transform 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease;
}

.performer-section-choice:hover,
.performer-section-choice:focus {
  color: #0f172a;
  border-color: rgba(37, 99, 235, 0.45);
  box-shadow: 0 22px 48px rgba(15, 23, 42, 0.14);
  transform: translateY(-2px);
}

.performer-section-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  color: #1d4ed8;
  background: #eff6ff;
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 0.55rem;
}

.performer-section-icon svg {
  width: 1.55rem;
  height: 1.55rem;
}

.performer-section-eyebrow {
  color: #2563eb;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.performer-section-choice strong {
  font-size: 1.12rem;
  line-height: 1.25;
}

.performer-section-choice span:last-child {
  color: #475569;
  line-height: 1.45;
}

@media (min-width: 768px) {
  .performer-section-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 992px) {
  .performer-section-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.performer-detail-list {
  display: grid;
  grid-template-columns: minmax(10rem, 0.42fr) minmax(0, 1fr);
  gap: 0.85rem 1.25rem;
  padding: 1.1rem;
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 0.5rem;
}

.performer-detail-list dt {
  color: #475569;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.performer-detail-list dd {
  min-width: 0;
  margin: 0;
  color: #111827;
  overflow-wrap: anywhere;
}

.performer-detail-list-compact {
  padding: 0;
  background: transparent;
  border: 0;
}

.performer-search-panel {
  padding: 1rem;
  background: rgba(248, 250, 252, 0.86);
  border: 1px solid rgba(96, 165, 250, 0.18);
  border-radius: 0.5rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.68);
}

.performer-timeline {
  --performer-timeline-gap: 1rem;
  --performer-timeline-line-x: 0.75rem;
  --performer-timeline-marker-size: 0.85rem;
  --performer-timeline-marker-top: 1.15rem;
  --performer-timeline-marker-center: 1.575rem;
  position: relative;
  display: grid;
  gap: var(--performer-timeline-gap);
}

.performer-timeline-item {
  position: relative;
  padding-left: 2.1rem;
}

.performer-timeline-item::before {
  position: absolute;
  top: 0;
  bottom: calc(-1 * var(--performer-timeline-gap));
  left: var(--performer-timeline-line-x);
  width: 2px;
  content: "";
  background: #2563eb;
  border-radius: 999px;
  transform: translateX(-50%);
}

.performer-timeline-item:first-child::before {
  top: var(--performer-timeline-marker-center);
}

.performer-timeline-item:last-child::before {
  top: 0;
  bottom: auto;
  height: var(--performer-timeline-marker-center);
}

.performer-timeline-item:first-child:last-child::before {
  top: var(--performer-timeline-marker-center);
  height: 0;
}

.performer-timeline-scroll {
  max-height: min(68vh, 720px);
  padding-right: 0.55rem;
  overflow-y: auto;
  scrollbar-width: thin;
}

.performer-timeline-marker {
  position: absolute;
  top: var(--performer-timeline-marker-top);
  left: var(--performer-timeline-line-x);
  z-index: 1;
  width: var(--performer-timeline-marker-size);
  height: var(--performer-timeline-marker-size);
  background: #2563eb;
  border: 3px solid #ffffff;
  border-radius: 999px;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.18);
  transform: translateX(-50%);
}

.performer-timeline-panel,
.performer-medical-metric {
  padding: 1.1rem;
  color: #111827;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 0.5rem;
}

.performer-expander summary {
  cursor: pointer;
  color: #1d4ed8;
  font-weight: 800;
}

.performer-expander-body {
  display: grid;
  gap: 1rem;
  padding-top: 1rem;
}

.performer-contract-list {
  padding-top: 1rem;
  border-top: 1px solid rgba(148, 163, 184, 0.22);
}

.performer-medical-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.performer-medical-metric {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-height: 7.5rem;
}

.performer-medical-metric span {
  color: #475569;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.performer-medical-metric strong {
  font-size: 1.25rem;
}

.performer-medical-metric small {
  color: #475569;
  line-height: 1.35;
}

.performer-medical-record-body {
  padding-top: 0.85rem;
  border-top: 1px solid rgba(148, 163, 184, 0.22);
}

.todo-count {
  display: inline-flex;
  align-items: center;
  min-height: 2.35rem;
  padding: 0.45rem 0.9rem;
  color: #1d4ed8;
  font-weight: 800;
  background: rgba(37, 99, 235, 0.1);
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 999px;
}

.todo-count-complete {
  color: #047857;
  background: rgba(16, 185, 129, 0.12);
  border-color: rgba(16, 185, 129, 0.22);
}

.dashboard-todo-header {
  align-items: flex-start;
}

.todo-dismiss-all {
  min-width: 132px;
  padding: 0.62rem 1rem;
  white-space: nowrap;
}

.todo-list {
  display: grid;
  gap: 0.85rem;
}

.todo-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  padding: 1rem;
  color: #111827;
  background: #f8fafc;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-left: 5px solid #2563eb;
  border-radius: 0.75rem;
}

.todo-item-priority {
  background: #fff7ed;
  border-color: rgba(217, 119, 6, 0.38);
  box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.14);
}

.todo-item-contract {
  border-left-color: #dc2626;
}

.todo-item-plan {
  border-left-color: #2563eb;
}

.todo-item-consent {
  border-left-color: #d97706;
}

.todo-item-sti {
  border-left-color: #f59e0b;
}

.todo-item-payment {
  border-left-color: #059669;
}

.todo-status {
  width: 0.85rem;
  height: 0.85rem;
  background: #ffffff;
  border: 2px solid currentColor;
  border-radius: 50%;
}

.todo-item strong,
.todo-item p {
  display: block;
}

.todo-item p {
  margin: 0.2rem 0 0;
  color: #475569;
  line-height: 1.45;
}

.todo-priority-badge {
  display: inline-flex;
  align-items: center;
  width: max-content;
  margin-bottom: 0.35rem;
  padding: 0.18rem 0.48rem;
  color: #78350f;
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.2;
  text-transform: uppercase;
  background: #fde68a;
  border: 1px solid rgba(217, 119, 6, 0.26);
  border-radius: 999px;
}

.todo-action {
  min-width: 150px;
  padding: 0.62rem 1rem;
  white-space: nowrap;
}

.todo-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  justify-content: flex-end;
}

.todo-empty {
  padding: 1rem;
  color: #065f46;
  background: #d1fae5;
  border: 1px solid #a7f3d0;
  border-radius: 0.75rem;
}

.todo-empty p {
  color: #047857;
}

.sti-requirements {
  padding: 1.25rem;
  color: #111827;
  background: #eff6ff;
  border: 2px solid rgba(37, 99, 235, 0.28);
  border-radius: 1rem;
  box-shadow: 0 16px 36px rgba(37, 99, 235, 0.12);
}

.sti-path-choice {
  display: grid;
  gap: 1rem;
  padding: 1.25rem;
  color: #111827;
  background: #eff6ff;
  border: 2px solid rgba(37, 99, 235, 0.28);
  border-radius: 1rem;
  box-shadow: 0 16px 36px rgba(37, 99, 235, 0.12);
}

.sti-path-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

.sti-path-option {
  display: grid;
  gap: 0.35rem;
  min-height: 8rem;
  padding: 1rem;
  color: #1e293b;
  text-decoration: none;
  background: #ffffff;
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 0.75rem;
  box-shadow: 0 10px 24px rgba(37, 99, 235, 0.08);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease;
}

.sti-path-option:hover,
.sti-path-option:focus,
.sti-path-option-active {
  color: #0f172a;
  border-color: rgba(37, 99, 235, 0.44);
  box-shadow: 0 18px 34px rgba(37, 99, 235, 0.16);
  transform: translateY(-1px);
}

.sti-path-option span {
  color: #0f172a;
  font-size: 1.08rem;
  font-weight: 850;
  line-height: 1.2;
}

.sti-path-option small {
  color: #475569;
  font-weight: 650;
  line-height: 1.4;
}

.exposure-scope-options {
  display: grid;
  gap: 0.65rem;
}

.exposure-platform-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.exposure-platform-option {
  display: block;
  min-width: 0;
  margin: 0;
  cursor: pointer;
}

.exposure-scope-option {
  display: block;
  margin: 0;
  cursor: pointer;
}

.exposure-platform-option .form-check-input,
.exposure-scope-option .form-check-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  border: 0 !important;
  opacity: 0;
  pointer-events: none;
}

.exposure-platform-label {
  display: grid;
  grid-template-columns: 2.45rem minmax(0, 1fr);
  gap: 0.75rem;
  align-items: center;
  width: 100%;
  min-height: 4.45rem;
  padding: 0.82rem 0.95rem;
  color: #1e293b;
  text-align: left;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.38);
  border-radius: 0.5rem;
  box-shadow:
    0 10px 24px rgba(15, 23, 42, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
  transition:
    color 0.18s ease,
    background 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.exposure-platform-mark {
  display: inline-grid;
  place-items: center;
  width: 2.45rem;
  height: 2.45rem;
  color: #1d4ed8;
  font-size: 0.82rem;
  font-weight: 900;
  line-height: 1;
  background: #dbeafe;
  border: 1px solid rgba(37, 99, 235, 0.22);
  border-radius: 50%;
}

.exposure-platform-copy {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}

.exposure-platform-copy strong,
.exposure-platform-copy small {
  display: block;
  overflow-wrap: anywhere;
}

.exposure-platform-copy strong {
  color: inherit;
  font-size: 1rem;
  font-weight: 850;
  line-height: 1.2;
}

.exposure-platform-copy small {
  color: #64748b;
  font-size: 0.84rem;
  font-weight: 650;
  line-height: 1.3;
}

.exposure-platform-option:hover .exposure-platform-label {
  border-color: rgba(37, 99, 235, 0.4);
  box-shadow: 0 16px 34px rgba(37, 99, 235, 0.12);
  transform: translateY(-1px);
}

.exposure-platform-option .form-check-input:focus-visible + .exposure-platform-label {
  outline: 3px solid rgba(96, 165, 250, 0.36);
  outline-offset: 2px;
}

.exposure-platform-option .form-check-input:checked + .exposure-platform-label {
  color: #ffffff;
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  border-color: rgba(96, 165, 250, 0.92);
  box-shadow:
    0 16px 34px rgba(37, 99, 235, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.exposure-platform-option .form-check-input:checked + .exposure-platform-label .exposure-platform-mark {
  color: #1d4ed8;
  background: #ffffff;
  border-color: rgba(255, 255, 255, 0.72);
}

.exposure-platform-option .form-check-input:checked + .exposure-platform-label .exposure-platform-copy small {
  color: rgba(255, 255, 255, 0.78);
}

.exposure-scope-label {
  display: flex;
  align-items: center;
  min-height: 3.25rem;
  width: 100%;
  padding: 0.85rem 1rem;
  color: #475569;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.25;
  text-align: left;
  background: #e5e7eb;
  border: 1px solid #cbd5e1;
  border-radius: 0.5rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.58);
  transition:
    color 0.18s ease,
    background 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    opacity 0.18s ease,
    transform 0.18s ease;
}

.exposure-scope-option .form-check-input:not(:checked) + .exposure-scope-label {
  opacity: 0.68;
}

.exposure-scope-option:hover .exposure-scope-label {
  opacity: 1;
  transform: translateY(-1px);
}

.exposure-scope-option .form-check-input:focus-visible + .exposure-scope-label {
  outline: 3px solid rgba(96, 165, 250, 0.36);
  outline-offset: 2px;
}

.exposure-scope-option .form-check-input:checked + .exposure-scope-label {
  color: #ffffff;
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  border-color: rgba(96, 165, 250, 0.92);
  box-shadow:
    0 14px 28px rgba(37, 99, 235, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
  opacity: 1;
}

@media (max-width: 575.98px) {
  .exposure-platform-options {
    grid-template-columns: 1fr;
  }
}

.epic-provider-result-card .btn {
  justify-self: start;
}

.sti-window {
  min-width: 240px;
  padding: 0.85rem 1rem;
  color: #1e3a8a;
  background: #ffffff;
  border: 1px solid rgba(37, 99, 235, 0.22);
  border-radius: 0.75rem;
}

.sti-window span,
.sti-window strong {
  display: block;
}

.sti-window span {
  margin-bottom: 0.15rem;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.sti-required-badge {
  display: inline-flex;
  align-items: center;
  min-height: 2.35rem;
  padding: 0.55rem 0.9rem;
  color: #ffffff;
  font-size: 0.98rem;
  font-weight: 800;
  background: #1d4ed8;
  border-radius: 999px;
}

.sti-upload-explainer {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  padding: 0.95rem;
  color: #0f172a;
  background: #f8fafc;
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 0.65rem;
}

.sti-upload-explainer-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.7rem;
  align-items: start;
  min-width: 0;
}

.sti-upload-explainer-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  color: #1d4ed8;
  background: #dbeafe;
  border: 1px solid rgba(37, 99, 235, 0.2);
  border-radius: 0.55rem;
}

.sti-upload-explainer-icon svg {
  width: 1.25rem;
  height: 1.25rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.sti-upload-explainer strong,
.sti-upload-explainer small {
  display: block;
}

.sti-upload-explainer strong {
  color: #0f172a;
  font-weight: 850;
  line-height: 1.25;
}

.sti-upload-explainer small {
  margin-top: 0.16rem;
  color: #475569;
  font-weight: 650;
  line-height: 1.4;
}

.sti-site-requirements {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

.sti-site-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.65rem;
  align-items: center;
  min-height: 4.8rem;
  padding: 0.75rem;
  color: #1e293b;
  background: #ffffff;
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 0.65rem;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.08);
}

.sti-site-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  color: #1d4ed8;
  background: #dbeafe;
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 0.55rem;
}

.sti-site-icon svg {
  width: 1.45rem;
  height: 1.45rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.sti-site-card strong,
.sti-site-card small {
  display: block;
}

.sti-site-card strong {
  color: #0f172a;
  font-weight: 800;
  line-height: 1.25;
}

.sti-site-card small {
  color: #475569;
  font-size: 0.82rem;
  font-weight: 650;
  line-height: 1.35;
}

.sti-testing-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 1rem;
}

.planner-calendar {
  display: grid;
  gap: 1.5rem;
}

.planner-completion-item > div:first-child {
  min-width: 0;
}

.min-width-0 {
  min-width: 0;
}

.planner-completion-action {
  display: flex;
  flex: 0 1 auto;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  justify-content: center;
  align-self: center;
  width: 100%;
  max-width: 18rem;
}

.planner-completion-action .planner-action-form {
  display: flex;
  justify-content: center;
  width: auto;
}

.planner-completion-action .btn {
  min-width: 7.75rem;
  max-width: 9.5rem;
  min-height: 2.25rem;
  padding: 0.42rem 0.7rem;
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1.15;
  white-space: normal;
}

@media (min-width: 768px) {
  .planner-completion-action {
    flex: 0 0 18rem;
    justify-content: flex-end;
    width: auto;
  }
}

.sti-upload-check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
}

.sti-upload-check {
  display: flex;
  gap: 0.55rem;
  align-items: flex-start;
  min-height: 2.7rem;
  padding: 0.65rem 0.75rem;
  color: #1e293b;
  font-weight: 700;
  line-height: 1.3;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.32);
  border-radius: 0.5rem;
}

.planner-month {
  overflow: hidden;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(96, 165, 250, 0.18);
  border-radius: 0.9rem;
}

.planner-month-header {
  padding: 1rem 1.1rem;
  color: #111827;
  font-size: 1.05rem;
  font-weight: 700;
  background: linear-gradient(145deg, #ffffff, #eff6ff);
  border-bottom: 1px solid rgba(96, 165, 250, 0.18);
}

.planner-month-title {
  line-height: 1.25;
}

.planner-weekdays,
.planner-month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.planner-weekdays {
  color: #475569;
  font-size: 0.78rem;
  font-weight: 800;
  text-align: center;
  text-transform: uppercase;
  background: #f8fafc;
  border-bottom: 1px solid rgba(148, 163, 184, 0.24);
}

.planner-weekdays span {
  padding: 0.65rem 0.3rem;
}

.calendar-controls,
.calendar-month-jump {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.calendar-page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.calendar-month-link {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.35rem 0.65rem;
  color: #1d4ed8;
  font-size: 0.85rem;
  font-weight: 700;
  text-decoration: none;
  background: #ffffff;
  border: 1px solid rgba(37, 99, 235, 0.22);
  border-radius: 999px;
}

.calendar-month-link:hover,
.calendar-month-link:focus,
.calendar-month-link.active {
  color: #ffffff;
  background: #2563eb;
  border-color: #2563eb;
}

.planner-day-cell {
  min-height: 150px;
  padding: 0.65rem;
  background: #ffffff;
  border-right: 1px solid rgba(148, 163, 184, 0.2);
  border-bottom: 1px solid rgba(148, 163, 184, 0.2);
}

.planner-day-cell:nth-child(7n) {
  border-right: 0;
}

.planner-day-cell:nth-last-child(-n + 7) {
  border-bottom: 0;
}

.planner-day-muted {
  background: #f8fafc;
}

.planner-day-muted .planner-day-number {
  color: #94a3b8;
}

.planner-day-today .planner-day-number {
  color: #ffffff;
  background: #2563eb;
}

.planner-day-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  margin-bottom: 0.5rem;
  color: #111827;
  font-weight: 800;
  border-radius: 50%;
}

.planner-day-heading {
  display: block;
}

.planner-day-mobile-label,
.planner-day-no-events,
.planner-mobile-empty {
  display: none;
}

.planner-day-events {
  display: grid;
  gap: 0.45rem;
}

.planner-calendar-event {
  min-width: 0;
  padding: 0.55rem;
  color: #111827;
  background: #eff6ff;
  border: 1px solid rgba(96, 165, 250, 0.18);
  border-left: 3px solid #2563eb;
  border-radius: 0.55rem;
}

.planner-calendar-event strong,
.planner-calendar-event-meta {
  display: block;
  overflow-wrap: anywhere;
}

.planner-calendar-event-time {
  color: #2563eb;
  font-size: 0.78rem;
  font-weight: 700;
}

.planner-calendar-event-meta {
  color: #475569;
  font-size: 0.78rem;
}

.planner-calendar-event-status {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.4rem;
}

.planner-calendar-sync {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.5rem;
}

.planner-calendar-sync a {
  display: inline-flex;
  align-items: center;
  min-height: 1.85rem;
  padding: 0.25rem 0.5rem;
  color: #1d4ed8;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.1;
  text-decoration: none;
  background: #ffffff;
  border: 1px solid rgba(37, 99, 235, 0.22);
  border-radius: 999px;
}

.planner-calendar-sync a:hover,
.planner-calendar-sync a:focus {
  color: #ffffff;
  background: #2563eb;
  border-color: #2563eb;
}

.planner-payment-pill {
  display: inline-flex;
  align-items: center;
  min-height: 1.45rem;
  padding: 0.25rem 0.45rem;
  color: #0f172a;
  font-size: 0.75rem;
  font-weight: 800;
  background: #d1fae5;
  border-radius: 999px;
}

.planner-followup-pill {
  display: inline-flex;
  align-items: center;
  min-height: 1.45rem;
  padding: 0.25rem 0.45rem;
  color: #7f1d1d;
  font-size: 0.75rem;
  font-weight: 850;
  background: #fee2e2;
  border-radius: 999px;
}

.planner-calendar-reminder {
  margin-top: 0.5rem;
  padding: 0.55rem;
  color: #7f1d1d;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.35;
  background: #fef2f2;
  border: 1px solid rgba(220, 38, 38, 0.18);
  border-radius: 0.5rem;
}

.preserve-whitespace {
  white-space: pre-wrap;
}

.payment-setup-guide {
  display: grid;
  gap: 1rem;
  padding: 1rem;
  background: rgba(14, 165, 233, 0.08);
  border: 1px solid rgba(14, 165, 233, 0.18);
  border-radius: 0.75rem;
}

.payment-setup-guide-header {
  display: flex;
  gap: 0.85rem;
  align-items: flex-start;
}

.payment-setup-steps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.payment-setup-steps div {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  min-height: 5.4rem;
  padding: 0.85rem;
  background: rgba(255, 255, 255, 0.68);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 0.65rem;
}

.payment-setup-steps p {
  margin: 0;
  color: #334155;
  line-height: 1.5;
}

.payment-setup-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 2.25rem;
  height: 2.25rem;
  color: #0369a1;
  background: #e0f2fe;
  border: 1px solid rgba(14, 165, 233, 0.22);
  border-radius: 50%;
}

.payment-setup-icon svg {
  width: 1.18rem;
  height: 1.18rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.9;
}

.contract-pdf {
  width: 100%;
  min-height: 520px;
  border: 1px solid rgba(15, 23, 42, 0.16);
  border-radius: 0.75rem;
  background: #ffffff;
}

@media (max-width: 767px) {
  body:not(.index-page) main.container {
    width: 100%;
    max-width: none;
    padding-right: 0;
    padding-left: 0;
  }

  body:not(.index-page) main.container > section.py-5 {
    padding-top: 1.25rem !important;
    padding-bottom: 2rem !important;
  }

  body:not(.index-page) main.container > section > .row {
    --bs-gutter-x: 0;
    margin-right: 0;
    margin-left: 0;
  }

  body:not(.index-page) main.container > section > .row > [class*="col-"] {
    padding-right: 0;
    padding-left: 0;
  }

  body:not(.index-page) .form-card {
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }

  body:not(.index-page) .form-card > .card-body {
    padding: 1rem !important;
  }

  body:not(.index-page) .form-card > .card-body > .border.rounded-3.bg-light {
    width: calc(100% + 2rem);
    margin-right: -1rem;
    margin-left: -1rem;
    padding: 1rem !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-radius: 0 !important;
  }

  .coverage-band,
  .epic-medical-grid,
  .epic-record-steps,
  .coverage-provider-filter-grid,
  .coverage-results {
    grid-template-columns: 1fr;
  }

  .epic-record-board-header {
    align-items: flex-start;
  }

  .epic-record-steps div {
    min-height: auto;
  }

  .coverage-result-card dl {
    grid-template-columns: 1fr;
  }

  .coverage-source-actions .btn {
    width: 100%;
  }

  .health-record-summary-grid,
  .health-record-detail-grid,
  .health-record-check-grid,
  .health-record-evidence-meta {
    grid-template-columns: 1fr;
  }

  .performer-detail-list,
  .performer-medical-summary {
    grid-template-columns: 1fr;
  }

  .performer-section-choice {
    min-height: auto;
  }

  .performer-timeline {
    --performer-timeline-line-x: 0.62rem;
  }

  .performer-timeline-item {
    padding-left: 1.8rem;
  }

  .performer-info-card-main {
    padding-right: 2.35rem;
  }

  .health-record-actions,
  .health-record-actions .btn {
    width: 100%;
  }

  .health-record-actions .btn {
    min-height: 2.65rem;
  }

  .account-sti-library-sections {
    grid-template-columns: 1fr;
  }

  .account-sti-current,
  .account-sti-list-row {
    flex-direction: column;
  }

  .account-sti-current .btn,
  .account-sti-list-row .btn {
    width: 100%;
    min-height: 2.5rem;
  }

  .account-sti-list-row > .d-flex,
  .account-sti-list-row form {
    width: 100%;
  }

  .health-record-connection-badges {
    align-items: flex-start;
    margin-left: 0;
    text-align: left;
  }

  .payment-setup-guide-header,
  .payment-setup-steps div {
    gap: 0.65rem;
  }

  .payment-setup-steps {
    grid-template-columns: 1fr;
  }

  .payment-setup-steps div {
    min-height: auto;
  }

  .account-settings-page {
    padding-top: 1.5rem !important;
    padding-bottom: 2.25rem !important;
  }

  .account-settings-page .row {
    margin-right: -0.35rem;
    margin-left: -0.35rem;
  }

  .account-settings-page [class*="col-"] {
    padding-right: 0.35rem;
    padding-left: 0.35rem;
  }

  .account-settings-body {
    padding: 1rem !important;
  }

  .account-settings-body > .d-flex:first-child {
    gap: 0.85rem !important;
    margin-bottom: 1rem !important;
  }

  .account-settings-body h2 {
    font-size: 1.55rem;
  }

  .account-settings-panel {
    padding: 1rem !important;
    margin-top: 1.25rem !important;
    border-radius: 0.75rem !important;
  }

  .account-settings-search-box {
    min-height: 3.35rem;
    gap: 0.55rem;
    padding: 0.48rem 0.58rem;
  }

  .account-settings-search-icon {
    width: 2.1rem;
    height: 2.1rem;
  }

  .account-settings-search-input {
    font-size: 0.9rem;
  }

  .account-settings-search-result {
    grid-template-columns: 1fr;
    gap: 0.42rem;
  }

  .account-settings-search-category {
    justify-content: flex-start;
    width: fit-content;
  }

  .account-settings-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.4rem;
  }

  .account-settings-tab {
    min-height: 2.55rem;
    padding: 0.5rem 0.45rem;
    font-size: 0.84rem;
  }

  .accessibility-settings-grid,
  .accessibility-toggle-list {
    grid-template-columns: 1fr;
  }

  .accessibility-control,
  .accessibility-toggle-list {
    padding: 0.85rem;
  }

  .account-theme-toggle {
    align-self: flex-start;
    gap: 0.42rem;
    min-height: 2.45rem;
    width: 6.25rem;
    padding: 0.28rem 0.46rem;
    justify-content: center;
    font-size: 0.8rem;
  }

  .account-theme-toggle .theme-toggle-track {
    width: 2.55rem;
    height: 1.42rem;
    flex: 0 0 auto;
  }

  .account-theme-toggle .theme-toggle-orbit {
    width: 0.92rem;
    height: 0.92rem;
  }

  html[data-theme="dark"] .account-theme-toggle .theme-toggle-orbit {
    transform: translateX(1.1rem) rotate(-18deg);
  }

  .account-theme-toggle .theme-toggle-label {
    display: none;
  }

  .account-theme-toggle::after {
    content: "Light";
    min-width: 2rem;
    text-align: left;
  }

  html[data-theme="dark"] .account-theme-toggle::after {
    content: "Dark";
  }

  .account-telegram-panel > .d-flex:first-child {
    gap: 0.65rem !important;
    margin-bottom: 1rem !important;
  }

  .account-telegram-panel .telegram-connected-panel {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.85rem;
    padding: 0.85rem;
  }

  .account-telegram-panel .telegram-connected-panel p {
    margin-top: 0.35rem;
    line-height: 1.45;
  }

  .account-telegram-panel .telegram-connected-panel .btn,
  .account-telegram-panel .telegram-step .btn {
    width: 100%;
    min-height: 2.65rem;
    white-space: normal;
  }

  .account-telegram-panel .telegram-steps {
    gap: 0.75rem;
  }

  .account-telegram-panel .telegram-step {
    grid-template-columns: 1fr;
    gap: 0.75rem;
    padding: 0.85rem;
    border-radius: 0.75rem;
  }

  .account-telegram-panel .telegram-step-number {
    width: 1.85rem;
    height: 1.85rem;
  }

  .account-telegram-panel .telegram-step-body {
    min-width: 0;
  }

  .account-telegram-panel .row.g-3 {
    --bs-gutter-y: 0.85rem;
  }

  .invite-shell {
    padding: 1rem;
    border-radius: 0.85rem;
  }

  .invite-command-header h2 {
    font-size: 2rem;
  }

  .invite-progress-timeline {
    display: grid;
    grid-template-columns: 1fr;
  }

  .invite-progress-timeline::before {
    display: none;
  }

  .invite-progress-node.active::before,
  .invite-progress-node.active::after {
    display: none;
  }

  .invite-stage-wrap {
    min-height: 430px;
    padding: 1rem;
  }

  .invite-intro {
    grid-template-columns: 1fr;
    min-height: 0;
    text-align: center;
  }

  .invite-intro-orbit {
    width: min(10rem, 70vw);
    margin: 0 auto;
  }

  .invite-intro-copy p {
    margin-right: auto;
    margin-left: auto;
  }

  .invite-progress-node strong {
    white-space: normal;
  }

  .collab-activity-mode,
  .collab-activity-question,
  .sti-test-mode,
  .sti-test-site-mode,
  .sti-test-type-options,
  .sti-upload-explainer,
  .sti-site-requirements,
  .sti-path-actions,
  .sti-upload-check-grid {
    grid-template-columns: 1fr;
  }

  .collab-activity-mode-option,
  .collab-activity-question label,
  .sti-test-mode-option,
  .sti-test-type-option {
    min-height: 6.4rem;
  }

  .collab-calendar-page {
    padding-top: 1.5rem !important;
    padding-bottom: 2.25rem !important;
  }

  .collab-calendar-page .row {
    margin-right: -0.35rem;
    margin-left: -0.35rem;
  }

  .collab-calendar-page [class*="col-"] {
    padding-right: 0.35rem;
    padding-left: 0.35rem;
  }

  .collab-calendar-card {
    border-radius: 0.75rem;
  }

  .collab-calendar-body {
    padding: 1rem !important;
  }

  .collab-calendar-body > .d-flex:first-child {
    gap: 0.85rem !important;
    margin-bottom: 1rem !important;
  }

  .collab-calendar-body h2 {
    font-size: 1.55rem;
  }

  .collab-calendar-body .btn {
    width: 100%;
    min-height: 2.85rem;
  }

  .hero-section {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .contract-pdf {
    min-height: 420px;
  }

  .collab-step,
  .sti-step {
    grid-template-columns: 1fr;
    width: calc(100% + 2rem);
    max-width: none;
    margin-right: -1rem;
    margin-left: -1rem;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }

  .sti-performer-grid {
    grid-template-columns: 1fr;
  }

  .performer-action-compact {
    min-height: 2.8rem;
    padding: 0.62rem 0.9rem;
    font-size: 0.92rem;
  }

  .planner-weekdays {
    display: none;
  }

  .planner-calendar {
    gap: 1rem;
  }

  .planner-month {
    overflow: visible;
    background: transparent;
    border: 0;
    border-radius: 0;
  }

  .planner-month-header {
    gap: 0.85rem !important;
    padding: 0;
    margin-bottom: 1rem;
    background: transparent;
    border-bottom: 0;
  }

  .planner-month-title {
    font-size: 1.05rem;
  }

  .calendar-controls {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65rem;
    width: 100%;
  }

  .calendar-controls > .btn {
    min-height: 2.65rem;
    padding: 0.58rem 1rem;
  }

  .calendar-month-jump {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: nowrap;
    order: 3;
    width: 100%;
    padding-bottom: 0.15rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .calendar-month-link {
    flex: 0 0 auto;
    min-height: 2.45rem;
    padding: 0.5rem 0.8rem;
    white-space: nowrap;
  }

  .planner-month-grid {
    gap: 0.85rem;
    grid-template-columns: 1fr;
  }

  .planner-day-cell,
  .planner-day-cell:nth-child(7n),
  .planner-day-cell:nth-last-child(-n + 7) {
    min-height: auto;
    padding: 0.85rem;
    background: #ffffff;
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-right: 0;
    border-bottom: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 0.75rem;
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.06);
  }

  .planner-day-empty {
    display: none;
  }

  .planner-day-muted {
    background: #ffffff;
  }

  .planner-day-heading {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin-bottom: 0.65rem;
  }

  .planner-day-number {
    flex: 0 0 auto;
    width: 2.15rem;
    height: 2.15rem;
    margin-bottom: 0;
    background: #eff6ff;
  }

  .planner-day-mobile-label {
    display: block;
    min-width: 0;
    color: #0f172a;
    font-size: 0.96rem;
    font-weight: 800;
  }

  .planner-day-no-events {
    display: block;
    color: #64748b;
    font-size: 0.9rem;
  }

  .planner-day-events {
    gap: 0.7rem;
  }

  .planner-calendar-event {
    padding: 0.85rem;
    border-left-width: 4px;
  }

  .planner-calendar-event strong {
    margin-top: 0.1rem;
    font-size: 1rem;
    line-height: 1.25;
  }

  .planner-calendar-event-time,
  .planner-calendar-event-meta {
    font-size: 0.86rem;
  }

  .planner-calendar-event-status {
    gap: 0.45rem;
  }

  .planner-calendar-event-status .badge,
  .planner-payment-pill,
  .planner-followup-pill {
    min-height: 1.75rem;
    padding: 0.35rem 0.55rem;
    line-height: 1.1;
  }

  .planner-calendar-event form {
    margin-top: 0.75rem !important;
  }

  .planner-calendar-event .btn {
    width: 100%;
    min-height: 2.45rem;
    padding: 0.5rem 1rem;
  }

  .planner-mobile-empty {
    display: block;
    padding: 1rem;
    color: #475569;
    font-weight: 700;
    text-align: center;
    background: #ffffff;
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 0.75rem;
  }

  .landing-hero {
    min-height: auto;
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  body.index-page .landing-hero > .row {
    --bs-gutter-x: 0;
    margin-right: 0;
    margin-left: 0;
  }

  body.index-page .landing-hero > .row > [class*="col-"] {
    flex: 0 0 auto;
    width: 100%;
    max-width: calc(100vw - 4rem);
    padding-right: 0;
    padding-left: 0;
  }

  .hero-metrics {
    grid-template-columns: 1fr;
    gap: 0.85rem;
    min-height: auto;
    padding: 0;
    opacity: 1;
    transform: none;
    transition: none;
  }

  .hero-metrics div,
  .hero-metrics div:nth-child(1),
  .hero-metrics div:nth-child(2),
  .hero-metrics div:nth-child(3) {
    grid-column: 1;
  }

  .workflow-band {
    min-height: 900px;
    padding-top: 4.5rem;
    padding-bottom: 13rem;
  }

  .workflow-mountains {
    height: clamp(17rem, 58vw, 24rem);
  }

  .workflow-mountain {
    width: max(170vw, 48rem);
  }

  .feature-grid,
  .kyc-roadmap,
  .tutorial-band,
  .landing-proof {
    grid-template-columns: 1fr;
  }

  .kyc-roadmap::before {
    display: none;
  }

  .kyc-roadmap-step:not(:last-child)::before {
    top: calc(var(--kyc-roadmap-step-padding) + var(--kyc-roadmap-dot-radius));
    left: calc(var(--kyc-roadmap-step-padding) + var(--kyc-roadmap-dot-radius));
    width: var(--kyc-roadmap-line-thickness);
    height: calc(100% + var(--kyc-roadmap-gap) + var(--kyc-roadmap-connector-end-adjust));
    background: rgba(125, 211, 252, 0.72);
  }

  .kyc-roadmap-step {
    grid-template-columns: auto 1fr;
    grid-template-rows: none;
    min-height: auto;
  }

  .todo-item {
    grid-template-columns: auto 1fr;
  }

  .dashboard-search-box {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .dashboard-search-shell.dashboard-search-active {
    padding: 1rem 1rem 1rem;
  }

  .dashboard-search-shell.dashboard-search-active .dashboard-search-box {
    grid-template-columns: auto minmax(0, 1fr);
    min-height: 4.25rem;
  }

  .dashboard-search-shell.dashboard-search-active .dashboard-search-results {
    max-height: calc(100vh - 7rem);
  }

  .dashboard-search-shortcut {
    display: none;
  }

  .dashboard-search-result {
    grid-template-columns: 1fr;
    gap: 0.45rem;
  }

  .dashboard-search-result-category {
    justify-content: flex-start;
    width: fit-content;
  }

  .todo-action {
    grid-column: 2;
    width: 100%;
  }

  .todo-actions {
    grid-column: 2;
    justify-content: stretch;
  }

  .todo-actions .todo-action,
  .todo-actions form {
    width: 100%;
  }

  .todo-dismiss-all {
    width: 100%;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .collab-activity-question,
  .sti-test-type-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 991px) {
  .app-navbar-collapse {
    margin-top: 0.85rem;
    padding: 0.85rem;
    background: rgba(15, 23, 42, 0.96);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 1rem;
  }

  .app-nav-link {
    padding: 0.78rem 0.9rem !important;
  }

  .app-nav-settings-item {
    margin-bottom: 0.75rem;
  }

  .app-nav-logout-item {
    margin-top: 0.75rem;
  }

  .nav-account {
    align-items: stretch;
    margin-top: 0.5rem;
    margin-left: 0;
    padding-top: 0.85rem;
    padding-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    border-left: 0;
  }

  .account-chip {
    display: none;
  }

  .nav-btn {
    width: 100%;
  }
}

@media (min-width: 992px) {
  .app-navbar-actions {
    order: 3;
    margin-left: 0.55rem;
  }

  .app-navbar-collapse {
    order: 2;
    flex-basis: auto;
  }
}

.theme-toggle {
  display: inline-flex;
  gap: 0.55rem;
  align-items: center;
  min-height: 2.65rem;
  padding: 0.34rem 0.78rem;
  color: #0f172a;
  font-size: 0.86rem;
  font-weight: 750;
  line-height: 1;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-radius: 999px;
  box-shadow:
    0 10px 24px rgba(15, 23, 42, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.34);
}

.theme-toggle:hover,
.theme-toggle:focus {
  color: #0f172a;
  border-color: rgba(125, 211, 252, 0.42);
  box-shadow:
    0 12px 28px rgba(15, 23, 42, 0.2),
    0 0 0 0.18rem rgba(103, 232, 249, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.38);
}

.theme-toggle:disabled,
.theme-toggle[aria-disabled="true"] {
  cursor: not-allowed;
}

.theme-toggle:disabled .theme-toggle-track,
.theme-toggle[aria-disabled="true"] .theme-toggle-track {
  border-style: dashed;
}

.theme-toggle-track {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: 2.9rem;
  height: 1.55rem;
  padding: 0.2rem;
  overflow: hidden;
  background:
    radial-gradient(circle at 72% 34%, rgba(255, 255, 255, 0.7) 0 1px, transparent 1.4px),
    linear-gradient(135deg, #bae6fd, #fef3c7);
  border: 1px solid rgba(251, 191, 36, 0.34);
  border-radius: 999px;
  transition:
    background 0.22s ease,
    border-color 0.22s ease;
}

.theme-toggle-orbit {
  position: relative;
  width: 1.05rem;
  height: 1.05rem;
  background: #fbbf24;
  border-radius: 50%;
  box-shadow:
    0 0 0 0.18rem rgba(251, 191, 36, 0.18),
    0 0 16px rgba(251, 191, 36, 0.58);
  transition:
    transform 0.24s ease,
    background 0.18s ease,
    box-shadow 0.18s ease;
}

.theme-toggle-orbit::before {
  position: absolute;
  inset: -0.24rem;
  content: "";
  background:
    linear-gradient(#f59e0b, #f59e0b) 50% 0 / 0.12rem 0.22rem no-repeat,
    linear-gradient(#f59e0b, #f59e0b) 50% 100% / 0.12rem 0.22rem no-repeat,
    linear-gradient(90deg, #f59e0b, #f59e0b) 0 50% / 0.22rem 0.12rem no-repeat,
    linear-gradient(90deg, #f59e0b, #f59e0b) 100% 50% / 0.22rem 0.12rem no-repeat;
  border-radius: 50%;
  opacity: 1;
  transform: rotate(45deg);
  transition:
    opacity 0.18s ease,
    transform 0.24s ease;
}

.theme-toggle-orbit::after {
  position: absolute;
  inset: 0.16rem 0.12rem auto auto;
  width: 0.28rem;
  height: 0.28rem;
  content: "";
  background: rgba(15, 23, 42, 0.28);
  border-radius: 50%;
  opacity: 0;
  box-shadow:
    -0.32rem 0.28rem 0 -0.04rem rgba(15, 23, 42, 0.24),
    0.05rem 0.52rem 0 -0.06rem rgba(15, 23, 42, 0.22);
  transition: opacity 0.18s ease;
}

html[data-theme="dark"] .theme-toggle {
  color: #ccfbf1;
  background: rgba(14, 165, 233, 0.13);
  border-color: rgba(103, 232, 249, 0.46);
}

html[data-theme="dark"] .theme-toggle-track {
  background:
    linear-gradient(135deg, #020617, #082f49);
  border-color: rgba(103, 232, 249, 0.4);
}

html[data-theme="dark"] .theme-toggle-orbit {
  background: #e0f2fe;
  box-shadow:
    0 0 18px rgba(125, 211, 252, 0.58);
  transform: translateX(1.34rem) rotate(-18deg);
}

html[data-theme="dark"] .theme-toggle-orbit::before {
  inset: -0.08rem -0.14rem auto auto;
  width: 0.92rem;
  height: 0.92rem;
  background: #082f49;
  border-radius: 50%;
  opacity: 1;
  transform: none;
}

html[data-theme="dark"] .theme-toggle-orbit::after {
  opacity: 1;
}

@media (max-width: 575px) {
  .theme-toggle {
    padding: 0.34rem 0.48rem;
  }

  .theme-toggle-label {
    display: none;
  }
}

html[data-theme="dark"] body {
  background:
    radial-gradient(circle at 12% 16%, rgba(103, 232, 249, 0.18), transparent 24%),
    radial-gradient(circle at 82% 20%, rgba(94, 234, 212, 0.13), transparent 24%),
    linear-gradient(135deg, #020617 0%, #0f172a 48%, #082f49 100%);
  color: #e0f2fe;
}

html[data-theme="dark"] .form-card,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .dropdown-menu {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.92), rgba(15, 23, 42, 0.84)),
    radial-gradient(circle at 20% 8%, rgba(125, 211, 252, 0.18), transparent 30%);
  border-color: rgba(125, 211, 252, 0.24);
  box-shadow:
    0 34px 90px rgba(2, 6, 23, 0.52),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .form-card::before,
html[data-theme="dark"] .modal-content::before {
  background:
    linear-gradient(rgba(125, 211, 252, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(125, 211, 252, 0.055) 1px, transparent 1px),
    radial-gradient(circle at top right, rgba(94, 234, 212, 0.12), transparent 28%);
  background-size:
    34px 34px,
    34px 34px,
    auto;
  opacity: 1;
}

html[data-theme="dark"] .record-source-choice-modal .modal-content {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.99), rgba(15, 23, 42, 0.97));
  border-color: rgba(125, 211, 252, 0.34);
}

html[data-theme="dark"] .record-source-choice-modal .modal-content::before {
  opacity: 0.18;
}

html[data-theme="dark"] .form-card h1,
html[data-theme="dark"] .form-card h2,
html[data-theme="dark"] .form-card h3,
html[data-theme="dark"] .form-card h4,
html[data-theme="dark"] .form-card h5,
html[data-theme="dark"] .form-card h6,
html[data-theme="dark"] .card-title {
  color: #ffffff;
}

html[data-theme="dark"] .text-dark,
html[data-theme="dark"] .form-text,
html[data-theme="dark"] .form-check-label,
html[data-theme="dark"] .card-text,
html[data-theme="dark"] .small.text-dark {
  color: rgba(224, 242, 254, 0.76) !important;
}

html[data-theme="dark"] .text-muted {
  color: rgba(224, 242, 254, 0.62) !important;
}

html[data-theme="dark"] .form-label {
  color: #bae6fd !important;
  font-weight: 800;
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .input-group-text {
  color: #f8fafc;
  background-color: rgba(2, 6, 23, 0.68);
  border-color: rgba(125, 211, 252, 0.28);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 12px 30px rgba(2, 6, 23, 0.16);
}

html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus {
  color: #ffffff;
  background-color: rgba(2, 6, 23, 0.82);
  border-color: #67e8f9;
  box-shadow:
    0 0 0 0.18rem rgba(103, 232, 249, 0.18),
    0 0 32px rgba(14, 165, 233, 0.18);
}

html[data-theme="dark"] .form-control::placeholder {
  color: rgba(186, 230, 253, 0.52);
}

html[data-theme="dark"] .login-switches .form-check-input {
  background-color: rgba(2, 6, 23, 0.7);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23bae6fd'/%3e%3c/svg%3e");
  border-color: rgba(125, 211, 252, 0.28);
  box-shadow:
    inset 0 1px 2px rgba(2, 6, 23, 0.5),
    0 0 0 1px rgba(255, 255, 255, 0.03);
}

html[data-theme="dark"] .login-switches .form-check-input:focus {
  border-color: rgba(103, 232, 249, 0.52);
  box-shadow:
    0 0 0 0.18rem rgba(103, 232, 249, 0.13),
    inset 0 1px 2px rgba(2, 6, 23, 0.5);
}

html[data-theme="dark"] .login-switches .form-check-input:checked {
  background-color: rgba(20, 184, 166, 0.32);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ccfbf1'/%3e%3c/svg%3e");
  border-color: rgba(94, 234, 212, 0.54);
  box-shadow:
    0 0 18px rgba(45, 212, 191, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .bg-light,
html[data-theme="dark"] .form-card .card:not(.form-card),
html[data-theme="dark"] .card:not(.form-card),
html[data-theme="dark"] .list-group-item,
html[data-theme="dark"] .table,
html[data-theme="dark"] .telegram-step,
html[data-theme="dark"] .passkey-register-panel,
html[data-theme="dark"] .passkey-list-item,
html[data-theme="dark"] .authenticator-setup-box,
html[data-theme="dark"] .collab-step,
html[data-theme="dark"] .sti-step,
html[data-theme="dark"] .todo-item,
html[data-theme="dark"] .performer-section-choice,
html[data-theme="dark"] .performer-detail-list,
html[data-theme="dark"] .performer-search-panel,
html[data-theme="dark"] .performer-timeline-panel,
html[data-theme="dark"] .performer-medical-metric,
html[data-theme="dark"] .sti-path-choice,
html[data-theme="dark"] .sti-requirements,
html[data-theme="dark"] .planner-month,
html[data-theme="dark"] .planner-day-cell,
html[data-theme="dark"] .planner-calendar-event,
html[data-theme="dark"] .planner-mobile-empty {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.84), rgba(8, 47, 73, 0.48)),
    radial-gradient(circle at 92% 0%, rgba(125, 211, 252, 0.12), transparent 28%) !important;
  border-color: rgba(125, 211, 252, 0.22) !important;
  box-shadow:
    0 18px 46px rgba(2, 6, 23, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .health-record-metric,
html[data-theme="dark"] .health-record-panel,
html[data-theme="dark"] .health-record-raw {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.78), rgba(8, 47, 73, 0.46)),
    radial-gradient(circle at 92% 0%, rgba(125, 211, 252, 0.11), transparent 28%);
  border-color: rgba(125, 211, 252, 0.22);
  box-shadow:
    0 18px 46px rgba(2, 6, 23, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .epic-clinical-summary {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.96), rgba(8, 47, 73, 0.9)),
    radial-gradient(circle at 92% 0%, rgba(125, 211, 252, 0.1), transparent 28%);
  border-color: rgba(125, 211, 252, 0.32);
  box-shadow:
    0 24px 62px rgba(2, 6, 23, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .epic-clinical-summary dt {
  color: #7dd3fc;
}

html[data-theme="dark"] .epic-clinical-summary dd {
  color: rgba(224, 242, 254, 0.76);
}

html[data-theme="dark"] .performer-section-choice:hover,
html[data-theme="dark"] .performer-section-choice:focus {
  color: #e0f2fe;
  border-color: rgba(125, 211, 252, 0.46);
}

html[data-theme="dark"] .performer-section-eyebrow,
html[data-theme="dark"] .performer-expander summary {
  color: #7dd3fc;
}

html[data-theme="dark"] .performer-section-choice span:last-child,
html[data-theme="dark"] .performer-detail-list dt,
html[data-theme="dark"] .performer-detail-list dd,
html[data-theme="dark"] .performer-medical-metric span,
html[data-theme="dark"] .performer-medical-metric small {
  color: rgba(224, 242, 254, 0.76);
}

html[data-theme="dark"] .performer-timeline-marker {
  background: #38bdf8;
  border-color: #082f49;
  box-shadow: 0 0 0 3px rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .performer-timeline-item::before {
  background: #38bdf8;
}

html[data-theme="dark"] .payment-setup-guide {
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.76), rgba(8, 47, 73, 0.38)),
    radial-gradient(circle at 92% 0%, rgba(125, 211, 252, 0.1), transparent 28%);
  border-color: rgba(125, 211, 252, 0.22);
  box-shadow:
    0 18px 46px rgba(2, 6, 23, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .payment-setup-steps div {
  background: rgba(2, 6, 23, 0.34);
  border-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .payment-setup-steps p {
  color: rgba(224, 242, 254, 0.76);
}

html[data-theme="dark"] .payment-setup-icon {
  color: #bae6fd;
  background: rgba(14, 165, 233, 0.22);
  border-color: rgba(125, 211, 252, 0.28);
}

html[data-theme="dark"] .health-record-kicker,
html[data-theme="dark"] .health-record-detail-label {
  color: #67e8f9;
}

html[data-theme="dark"] .health-record-source-badge {
  color: #bae6fd !important;
  background: rgba(14, 165, 233, 0.16) !important;
  border-color: rgba(125, 211, 252, 0.34) !important;
}

html[data-theme="dark"] .account-settings-tabs {
  background: rgba(2, 6, 23, 0.36);
  border-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .account-settings-tab {
  color: rgba(224, 242, 254, 0.78);
}

html[data-theme="dark"] .account-settings-tab:hover,
html[data-theme="dark"] .account-settings-tab:focus {
  color: #e0f2fe;
  background: rgba(14, 165, 233, 0.12);
  border-color: rgba(125, 211, 252, 0.24);
}

html[data-theme="dark"] .account-settings-tab-active,
html[data-theme="dark"] .account-settings-tab-active:hover,
html[data-theme="dark"] .account-settings-tab-active:focus {
  color: #f8fafc;
  background: rgba(37, 99, 235, 0.82);
  border-color: rgba(147, 197, 253, 0.46);
}

html[data-theme="dark"] .account-settings-search-box,
html[data-theme="dark"] .account-settings-search-results {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.86), rgba(15, 23, 42, 0.78)),
    radial-gradient(circle at 96% 0%, rgba(103, 232, 249, 0.1), transparent 32%);
  border-color: rgba(125, 211, 252, 0.24);
  box-shadow: 0 18px 44px rgba(2, 6, 23, 0.28);
}

html[data-theme="dark"] .account-settings-search:focus-within .account-settings-search-box {
  border-color: rgba(125, 211, 252, 0.38);
  box-shadow: 0 20px 48px rgba(2, 6, 23, 0.34);
}

html[data-theme="dark"] .account-settings-search-icon,
html[data-theme="dark"] .account-settings-search-category {
  color: #042f2e;
  background: linear-gradient(135deg, #67e8f9, #5eead4);
  border-color: rgba(125, 211, 252, 0.48);
}

html[data-theme="dark"] .account-settings-search-input {
  color: #ffffff;
  caret-color: #67e8f9;
}

html[data-theme="dark"] .account-settings-search-input::placeholder,
html[data-theme="dark"] .account-settings-search-empty,
html[data-theme="dark"] .account-settings-search-result small {
  color: rgba(224, 242, 254, 0.68);
}

html[data-theme="dark"] .account-settings-search-result {
  color: #e0f2fe;
}

html[data-theme="dark"] .account-settings-search-result:hover,
html[data-theme="dark"] .account-settings-search-result:focus,
html[data-theme="dark"] .account-settings-search-result[aria-selected="true"] {
  color: #ffffff;
  background: rgba(14, 165, 233, 0.14);
  border-color: rgba(103, 232, 249, 0.24);
}

html[data-theme="dark"] .accessibility-settings-panel,
html[data-theme="dark"] .accessibility-control,
html[data-theme="dark"] .accessibility-toggle-list {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.42), rgba(15, 23, 42, 0.3));
  border-color: rgba(125, 211, 252, 0.2);
}

html[data-theme="dark"] .accessibility-control-header {
  color: #bae6fd;
}

html[data-theme="dark"] .accessibility-control output {
  color: #67e8f9;
}

html[data-theme="dark"] .accessibility-toggle-list .accessibility-switch.form-switch {
  background: rgba(2, 6, 23, 0.32);
  border-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .accessibility-toggle-list .accessibility-switch.form-switch .form-check-input,
.studio-body .accessibility-toggle-list .accessibility-switch.form-switch .form-check-input {
  background-color: rgba(2, 6, 23, 0.78);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23bae6fd'/%3e%3c/svg%3e");
  border-color: rgba(125, 211, 252, 0.42);
  box-shadow:
    inset 0 1px 2px rgba(2, 6, 23, 0.72),
    0 0 0 1px rgba(125, 211, 252, 0.08);
}

html[data-theme="dark"] .accessibility-toggle-list .accessibility-switch.form-switch .form-check-input:focus,
.studio-body .accessibility-toggle-list .accessibility-switch.form-switch .form-check-input:focus {
  border-color: rgba(103, 232, 249, 0.78);
  box-shadow:
    0 0 0 0.18rem rgba(103, 232, 249, 0.16),
    inset 0 1px 2px rgba(2, 6, 23, 0.72);
}

html[data-theme="dark"] .accessibility-toggle-list .accessibility-switch.form-switch .form-check-input:checked,
.studio-body .accessibility-toggle-list .accessibility-switch.form-switch .form-check-input:checked {
  background-color: rgba(14, 116, 144, 0.92);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ecfeff'/%3e%3c/svg%3e");
  border-color: rgba(103, 232, 249, 0.72);
  box-shadow:
    0 0 18px rgba(56, 189, 248, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .accessibility-switch-description {
  color: rgba(224, 242, 254, 0.72) !important;
}

html[data-theme="dark"] .accessibility-control .form-range {
  accent-color: #67e8f9;
}

html[data-theme="dark"] .accessibility-control .form-range::-webkit-slider-runnable-track {
  background: rgba(2, 6, 23, 0.78);
  border-color: rgba(125, 211, 252, 0.28);
  box-shadow: inset 0 1px 2px rgba(2, 6, 23, 0.54);
}

html[data-theme="dark"] .accessibility-control .form-range::-webkit-slider-thumb {
  background: #67e8f9;
  border-color: #042f2e;
  box-shadow:
    0 0 0 0.18rem rgba(103, 232, 249, 0.16),
    0 8px 18px rgba(2, 6, 23, 0.34);
}

html[data-theme="dark"] .accessibility-control .form-range::-moz-range-track {
  background: rgba(2, 6, 23, 0.78);
  border-color: rgba(125, 211, 252, 0.28);
  box-shadow: inset 0 1px 2px rgba(2, 6, 23, 0.54);
}

html[data-theme="dark"] .accessibility-control .form-range::-moz-range-thumb {
  background: #67e8f9;
  border-color: #042f2e;
  box-shadow:
    0 0 0 0.18rem rgba(103, 232, 249, 0.16),
    0 8px 18px rgba(2, 6, 23, 0.34);
}

html[data-theme="dark"] .account-settings-page .form-switch .form-check-input {
  background-color: rgba(2, 6, 23, 0.7);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23bae6fd'/%3e%3c/svg%3e");
  border-color: rgba(125, 211, 252, 0.3);
  box-shadow:
    inset 0 1px 2px rgba(2, 6, 23, 0.5),
    0 0 0 1px rgba(255, 255, 255, 0.03);
}

html[data-theme="dark"] .account-settings-page .form-switch .form-check-input:focus {
  border-color: rgba(103, 232, 249, 0.58);
  box-shadow:
    0 0 0 0.18rem rgba(103, 232, 249, 0.15),
    inset 0 1px 2px rgba(2, 6, 23, 0.5);
}

html[data-theme="dark"] .account-settings-page .form-switch .form-check-input:checked {
  background-color: rgba(20, 184, 166, 0.36);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ccfbf1'/%3e%3c/svg%3e");
  border-color: rgba(94, 234, 212, 0.58);
  box-shadow:
    0 0 18px rgba(45, 212, 191, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .account-sti-current,
html[data-theme="dark"] .account-sti-list-row {
  color: #e0f2fe;
  background: rgba(2, 6, 23, 0.34);
  border-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .account-sti-current {
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.78), rgba(8, 47, 73, 0.46)),
    radial-gradient(circle at 92% 0%, rgba(125, 211, 252, 0.11), transparent 28%);
  border-color: rgba(125, 211, 252, 0.24);
}

html[data-theme="dark"] .account-sti-section-heading {
  border-bottom-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .account-sti-help-trigger {
  color: #bae6fd;
  background: rgba(14, 165, 233, 0.16);
  border-color: rgba(125, 211, 252, 0.34);
}

html[data-theme="dark"] .account-sti-help-trigger:focus-visible {
  outline-color: rgba(125, 211, 252, 0.46);
}

html[data-theme="dark"] .account-sti-help-tooltip {
  color: #e0f2fe;
  background: #020617;
  border-color: rgba(125, 211, 252, 0.26);
  box-shadow: 0 16px 34px rgba(2, 6, 23, 0.34);
}

html[data-theme="dark"] .health-record-action-row-danger {
  border-top-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .health-record-metric span,
html[data-theme="dark"] .health-record-check-row span,
html[data-theme="dark"] .health-record-evidence-meta dt {
  color: rgba(224, 242, 254, 0.66);
}

html[data-theme="dark"] .health-record-check-row,
html[data-theme="dark"] .health-record-evidence-item {
  color: #e0f2fe;
  background: rgba(2, 6, 23, 0.34);
  border-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .health-record-evidence-meta dd,
html[data-theme="dark"] .health-record-raw summary {
  color: #e0f2fe;
}

html[data-theme="dark"] .health-record-raw pre {
  color: #dbeafe;
  background: rgba(2, 6, 23, 0.68);
  border-top-color: rgba(125, 211, 252, 0.2);
}

html[data-theme="dark"] .table {
  --bs-table-color: #e0f2fe;
  --bs-table-bg: transparent;
  --bs-table-border-color: rgba(125, 211, 252, 0.18);
  --bs-table-striped-color: #e0f2fe;
  --bs-table-striped-bg: rgba(255, 255, 255, 0.04);
  --bs-table-hover-color: #ffffff;
  --bs-table-hover-bg: rgba(125, 211, 252, 0.08);
}

html[data-theme="dark"] .list-group-item-action:hover,
html[data-theme="dark"] .list-group-item-action:focus {
  color: #ffffff;
  background: rgba(14, 165, 233, 0.16) !important;
}

html[data-theme="dark"] .btn-light,
html[data-theme="dark"] .btn-outline-secondary,
html[data-theme="dark"] .dashboard-page .btn-outline-secondary {
  color: #bae6fd;
  background: rgba(2, 6, 23, 0.38);
  border-color: rgba(125, 211, 252, 0.34);
}

html[data-theme="dark"] .btn-light:hover,
html[data-theme="dark"] .btn-light:focus,
html[data-theme="dark"] .btn-outline-secondary:hover,
html[data-theme="dark"] .btn-outline-secondary:focus,
html[data-theme="dark"] .dashboard-page .btn-outline-secondary:hover,
html[data-theme="dark"] .dashboard-page .btn-outline-secondary:focus {
  color: #042f2e;
  background: #67e8f9;
  border-color: #67e8f9;
}

html[data-theme="dark"] .btn-primary {
  color: #04111f;
  background: linear-gradient(135deg, #67e8f9, #5eead4);
  box-shadow: 0 0 34px rgba(103, 232, 249, 0.22);
}

html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .btn-primary:focus {
  color: #020617;
  background: linear-gradient(135deg, #bae6fd, #67e8f9);
}

html[data-theme="dark"] input[type="file"],
html[data-theme="dark"] .form-control[type="file"],
html[data-theme="dark"] .invite-file-input {
  color: #e0f2fe;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.78), rgba(8, 47, 73, 0.5)),
    rgba(2, 6, 23, 0.68);
  border-color: rgba(125, 211, 252, 0.3);
  box-shadow:
    0 14px 34px rgba(2, 6, 23, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

html[data-theme="dark"] input[type="file"]:hover,
html[data-theme="dark"] .form-control[type="file"]:hover,
html[data-theme="dark"] .invite-file-input:hover {
  border-color: rgba(103, 232, 249, 0.5);
  box-shadow:
    0 16px 38px rgba(2, 6, 23, 0.24),
    0 0 28px rgba(103, 232, 249, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.09);
}

html[data-theme="dark"] input[type="file"]:focus,
html[data-theme="dark"] input[type="file"]:focus-visible,
html[data-theme="dark"] .form-control[type="file"]:focus,
html[data-theme="dark"] .form-control[type="file"]:focus-visible,
html[data-theme="dark"] .invite-file-input:focus,
html[data-theme="dark"] .invite-file-input:focus-visible {
  color: #ffffff;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.92), rgba(8, 47, 73, 0.64)),
    rgba(2, 6, 23, 0.82);
  border-color: #67e8f9;
  box-shadow:
    0 0 0 0.2rem rgba(103, 232, 249, 0.16),
    0 0 34px rgba(45, 212, 191, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] input[type="file"]::file-selector-button,
html[data-theme="dark"] .form-control[type="file"]::file-selector-button,
html[data-theme="dark"] .invite-file-input::file-selector-button,
html[data-theme="dark"] input[type="file"]::-webkit-file-upload-button,
html[data-theme="dark"] .form-control[type="file"]::-webkit-file-upload-button,
html[data-theme="dark"] .invite-file-input::-webkit-file-upload-button {
  color: #04111f;
  background:
    linear-gradient(110deg, transparent 0%, rgba(255, 255, 255, 0.78) 18%, transparent 36%) -140% 0 / 220% 100% no-repeat,
    linear-gradient(135deg, #e0f2fe 0%, var(--studio-cyan, #67e8f9) 48%, var(--studio-teal, #2dd4bf) 100%),
    var(--studio-cyan, #67e8f9);
  border-color: rgba(224, 242, 254, 0.34);
  box-shadow:
    0 12px 30px rgba(45, 212, 191, 0.2),
    0 0 22px rgba(103, 232, 249, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.76);
}

html[data-theme="dark"] input[type="file"]:focus::file-selector-button,
html[data-theme="dark"] .form-control[type="file"]:focus::file-selector-button,
html[data-theme="dark"] .invite-file-input:focus::file-selector-button,
html[data-theme="dark"] input[type="file"]::file-selector-button:hover,
html[data-theme="dark"] .form-control[type="file"]::file-selector-button:hover,
html[data-theme="dark"] .invite-file-input::file-selector-button:hover,
html[data-theme="dark"] input[type="file"]:focus::-webkit-file-upload-button,
html[data-theme="dark"] .form-control[type="file"]:focus::-webkit-file-upload-button,
html[data-theme="dark"] .invite-file-input:focus::-webkit-file-upload-button,
html[data-theme="dark"] input[type="file"]::-webkit-file-upload-button:hover,
html[data-theme="dark"] .form-control[type="file"]::-webkit-file-upload-button:hover,
html[data-theme="dark"] .invite-file-input::-webkit-file-upload-button:hover {
  color: #020617;
  background-position:
    125% 0,
    0 0,
    0 0;
  border-color: rgba(240, 249, 255, 0.86);
  box-shadow:
    0 16px 40px rgba(45, 212, 191, 0.3),
    0 0 34px rgba(103, 232, 249, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

html[data-theme="dark"] .btn-outline-primary,
html[data-theme="dark"] .dashboard-page .btn-outline-primary,
html[data-theme="dark"] .calendar-month-link,
html[data-theme="dark"] .planner-calendar-sync a {
  color: #bae6fd;
  background: rgba(14, 165, 233, 0.12);
  border-color: rgba(125, 211, 252, 0.4);
}

html[data-theme="dark"] .btn-outline-primary:hover,
html[data-theme="dark"] .btn-outline-primary:focus,
html[data-theme="dark"] .dashboard-page .btn-outline-primary:hover,
html[data-theme="dark"] .dashboard-page .btn-outline-primary:focus,
html[data-theme="dark"] .calendar-month-link:hover,
html[data-theme="dark"] .calendar-month-link:focus,
html[data-theme="dark"] .calendar-month-link.active,
html[data-theme="dark"] .planner-calendar-sync a:hover,
html[data-theme="dark"] .planner-calendar-sync a:focus {
  color: #042f2e;
  background: #67e8f9;
  border-color: #67e8f9;
}

html[data-theme="dark"] .btn-google-auth {
  color: #f8fafc;
  background: rgba(15, 23, 42, 0.86);
  border-color: rgba(203, 213, 225, 0.32);
  box-shadow: 0 14px 34px rgba(2, 6, 23, 0.34);
}

html[data-theme="dark"] .btn-google-auth:hover,
html[data-theme="dark"] .btn-google-auth:focus {
  color: #ffffff;
  background: rgba(30, 41, 59, 0.92);
  border-color: rgba(226, 232, 240, 0.44);
}

html[data-theme="dark"] .btn-microsoft-auth {
  color: #f8fafc;
  background: rgba(15, 23, 42, 0.86);
  border-color: rgba(203, 213, 225, 0.32);
  box-shadow: 0 14px 34px rgba(2, 6, 23, 0.34);
}

html[data-theme="dark"] .btn-microsoft-auth:hover,
html[data-theme="dark"] .btn-microsoft-auth:focus {
  color: #ffffff;
  background: rgba(30, 41, 59, 0.92);
  border-color: rgba(226, 232, 240, 0.44);
}

html[data-theme="dark"] .btn-passkey-auth {
  color: #e0f2fe;
  background: linear-gradient(135deg, rgba(8, 47, 73, 0.92), rgba(15, 23, 42, 0.84));
  border-color: rgba(125, 211, 252, 0.34);
  box-shadow: 0 14px 34px rgba(2, 6, 23, 0.3);
}

html[data-theme="dark"] .btn-passkey-auth:hover,
html[data-theme="dark"] .btn-passkey-auth:focus {
  color: #ffffff;
  background: linear-gradient(135deg, rgba(14, 116, 144, 0.84), rgba(15, 23, 42, 0.94));
  border-color: rgba(125, 211, 252, 0.48);
}

html[data-theme="dark"] .passkey-auth-mark {
  color: #67e8f9;
}

html[data-theme="dark"] .login-auth-divider {
  color: rgba(226, 232, 240, 0.68);
}

html[data-theme="dark"] .dashboard-search-box,
html[data-theme="dark"] .dashboard-search-results {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.86), rgba(15, 23, 42, 0.78)),
    radial-gradient(circle at 96% 0%, rgba(103, 232, 249, 0.12), transparent 32%);
  border-color: rgba(125, 211, 252, 0.26);
  box-shadow: 0 20px 54px rgba(2, 6, 23, 0.28);
}

html[data-theme="dark"] .dashboard-search-shell.dashboard-search-active .dashboard-search-box {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.96), rgba(15, 23, 42, 0.9)),
    radial-gradient(circle at 96% 0%, rgba(103, 232, 249, 0.12), transparent 32%);
  border-color: rgba(125, 211, 252, 0.32);
  box-shadow: 0 32px 90px rgba(2, 6, 23, 0.48);
}

html[data-theme="dark"] .dashboard-search-icon,
html[data-theme="dark"] .dashboard-search-result-category {
  color: #042f2e;
  background: linear-gradient(135deg, #67e8f9, #5eead4);
  border-color: rgba(125, 211, 252, 0.48);
}

html[data-theme="dark"] .dashboard-search-input {
  color: #ffffff;
  caret-color: #67e8f9;
}

html[data-theme="dark"] .dashboard-search-input::placeholder,
html[data-theme="dark"] .dashboard-search-empty,
html[data-theme="dark"] .dashboard-search-result small {
  color: rgba(224, 242, 254, 0.68);
}

html[data-theme="dark"] .dashboard-search-shortcut {
  color: #bae6fd;
  background: rgba(2, 6, 23, 0.42);
  border-color: rgba(125, 211, 252, 0.28);
}

html[data-theme="dark"] .dashboard-search-result {
  color: #e0f2fe;
}

html[data-theme="dark"] .dashboard-search-result:hover,
html[data-theme="dark"] .dashboard-search-result:focus,
html[data-theme="dark"] .dashboard-search-result[aria-selected="true"] {
  color: #ffffff;
  background: rgba(14, 165, 233, 0.14);
  border-color: rgba(103, 232, 249, 0.24);
}

html[data-theme="dark"] .master-guide-panel {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.98), rgba(15, 23, 42, 0.94)),
    linear-gradient(90deg, rgba(103, 232, 249, 0.1), rgba(251, 191, 36, 0.06));
  border-color: rgba(125, 211, 252, 0.34);
  box-shadow: 0 28px 80px rgba(2, 6, 23, 0.58);
}

html[data-theme="dark"] .master-guide-mask-panel {
  background: rgba(2, 6, 23, 0.52);
}

html[data-theme="dark"] .master-guide-avatar {
  color: #042f2e;
  background: linear-gradient(135deg, #67e8f9, #5eead4);
  border-color: rgba(125, 211, 252, 0.42);
}

html[data-theme="dark"] .master-guide-panel[data-placement="below"] .master-guide-arrow {
  border-bottom-color: #020617;
}

html[data-theme="dark"] .master-guide-panel[data-placement="above"] .master-guide-arrow {
  border-top-color: #020617;
}

html[data-theme="dark"] .master-guide-progress {
  color: #67e8f9;
}

html[data-theme="dark"] .master-guide-panel h2,
html[data-theme="dark"] .master-guide-importance strong {
  color: #ffffff;
}

html[data-theme="dark"] .master-guide-copy,
html[data-theme="dark"] .master-guide-importance,
html[data-theme="dark"] .master-guide-close {
  color: rgba(224, 242, 254, 0.78);
}

html[data-theme="dark"] .master-guide-importance {
  background: rgba(2, 6, 23, 0.46);
  border-color: rgba(125, 211, 252, 0.22);
}

html[data-theme="dark"] .authenticator-secret {
  color: #e0f2fe;
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(125, 211, 252, 0.22);
}

html[data-theme="dark"] .dashboard-action-card,
html[data-theme="dark"] .performer-info-card,
html[data-theme="dark"] .telegram-connected-panel,
html[data-theme="dark"] .collab-performer-option,
html[data-theme="dark"] .collab-activity-mode-option,
html[data-theme="dark"] .collab-activity-question label,
html[data-theme="dark"] .collab-activity-question,
html[data-theme="dark"] .collab-activity-option,
html[data-theme="dark"] .collab-activity-chip,
html[data-theme="dark"] .sti-test-mode-option,
html[data-theme="dark"] .sti-test-type-option,
html[data-theme="dark"] .sti-test-option,
html[data-theme="dark"] .sti-test-chip,
html[data-theme="dark"] .sti-upload-explainer,
html[data-theme="dark"] .sti-site-card,
html[data-theme="dark"] .sti-upload-check,
html[data-theme="dark"] .sti-path-option,
html[data-theme="dark"] .sti-window {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.74), rgba(15, 23, 42, 0.68)),
    radial-gradient(circle at 90% 10%, rgba(103, 232, 249, 0.1), transparent 34%);
  border-color: rgba(125, 211, 252, 0.24);
  box-shadow:
    0 16px 38px rgba(2, 6, 23, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .dashboard-action-card:hover,
html[data-theme="dark"] .dashboard-action-card:focus,
html[data-theme="dark"] .collab-performer-option:hover,
html[data-theme="dark"] .collab-activity-mode-option:hover,
html[data-theme="dark"] .collab-activity-question label:hover,
html[data-theme="dark"] .sti-test-mode-option:hover,
html[data-theme="dark"] .sti-test-type-option:hover,
html[data-theme="dark"] .sti-path-option:hover,
html[data-theme="dark"] .sti-path-option:focus {
  color: #ffffff;
  border-color: rgba(103, 232, 249, 0.52);
  box-shadow: 0 0 28px rgba(14, 165, 233, 0.18);
}

html[data-theme="dark"] .performer-info-card.performer-needs-onboarding,
html[data-theme="dark"] .performer-info-card.performer-needs-changes,
html[data-theme="dark"] .todo-item-priority {
  background:
    linear-gradient(145deg, rgba(69, 26, 3, 0.84), rgba(15, 23, 42, 0.84)),
    radial-gradient(circle at 90% 10%, rgba(251, 191, 36, 0.16), transparent 34%);
  border-color: rgba(251, 191, 36, 0.58);
  box-shadow:
    0 0 0 3px rgba(245, 158, 11, 0.18),
    0 16px 38px rgba(2, 6, 23, 0.3);
}

html[data-theme="dark"] .performer-onboarding-alert,
html[data-theme="dark"] .performer-change-alert {
  color: #fde68a;
  background: rgba(69, 26, 3, 0.52);
  border-color: rgba(251, 191, 36, 0.42);
  border-left-color: #f59e0b;
}

html[data-theme="dark"] .performer-onboarding-alert p,
html[data-theme="dark"] .performer-change-alert p {
  color: rgba(254, 243, 199, 0.82);
}

html[data-theme="dark"] .todo-priority-badge {
  color: #451a03;
  background: #fbbf24;
  border-color: rgba(254, 243, 199, 0.42);
}

html[data-theme="dark"] .onboarding-edit-section {
  border-top-color: rgba(125, 211, 252, 0.2);
}

html[data-theme="dark"] .onboarding-edit-section-icon {
  color: #042f2e;
  background: linear-gradient(135deg, #67e8f9, #5eead4);
  border-color: rgba(125, 211, 252, 0.48);
}

html[data-theme="dark"] .onboarding-status-pill {
  color: #fef3c7;
  background: rgba(69, 26, 3, 0.52);
  border-color: rgba(251, 191, 36, 0.42);
}

html[data-theme="dark"] .onboarding-inline-panel {
  color: #e0f2fe;
  background: rgba(2, 6, 23, 0.48);
  border-color: rgba(125, 211, 252, 0.22);
}

html[data-theme="dark"] .exposure-scope-label {
  color: rgba(203, 213, 225, 0.82);
  background: rgba(51, 65, 85, 0.68);
  border-color: rgba(148, 163, 184, 0.3);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

html[data-theme="dark"] .exposure-platform-label {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.74), rgba(15, 23, 42, 0.68)),
    radial-gradient(circle at 90% 10%, rgba(103, 232, 249, 0.1), transparent 34%);
  border-color: rgba(125, 211, 252, 0.24);
  box-shadow:
    0 16px 38px rgba(2, 6, 23, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .exposure-platform-copy small {
  color: rgba(203, 213, 225, 0.72);
}

html[data-theme="dark"] .exposure-platform-mark {
  color: #bae6fd;
  background: rgba(14, 165, 233, 0.16);
  border-color: rgba(125, 211, 252, 0.3);
}

html[data-theme="dark"] .exposure-platform-option:hover .exposure-platform-label {
  border-color: rgba(103, 232, 249, 0.52);
  box-shadow: 0 0 28px rgba(14, 165, 233, 0.18);
}

html[data-theme="dark"] .exposure-scope-option .form-check-input:not(:checked) + .exposure-scope-label {
  color: rgba(203, 213, 225, 0.66);
  background: rgba(30, 41, 59, 0.62);
  border-color: rgba(148, 163, 184, 0.2);
  opacity: 0.58;
}

html[data-theme="dark"] .exposure-platform-option .form-check-input:checked + .exposure-platform-label,
html[data-theme="dark"] .exposure-scope-option .form-check-input:checked + .exposure-scope-label {
  color: #ffffff;
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  border-color: rgba(147, 197, 253, 0.72);
  box-shadow:
    0 18px 34px rgba(37, 99, 235, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
  opacity: 1;
}

html[data-theme="dark"] .exposure-platform-option .form-check-input:checked + .exposure-platform-label .exposure-platform-mark {
  color: #1d4ed8;
  background: #ffffff;
  border-color: rgba(255, 255, 255, 0.72);
}

html[data-theme="dark"] .exposure-platform-option .form-check-input:checked + .exposure-platform-label .exposure-platform-copy small {
  color: rgba(255, 255, 255, 0.78);
}

html[data-theme="dark"] .dashboard-action-title,
html[data-theme="dark"] .performer-info-card .card-title,
html[data-theme="dark"] .telegram-connected-panel span,
html[data-theme="dark"] .collab-option-copy strong,
html[data-theme="dark"] .sti-path-option span,
html[data-theme="dark"] .sti-site-card strong,
html[data-theme="dark"] .sti-upload-explainer strong,
html[data-theme="dark"] .todo-item strong,
html[data-theme="dark"] .planner-calendar-event strong,
html[data-theme="dark"] .planner-month-header,
html[data-theme="dark"] .collab-activity-question legend {
  color: #ffffff;
}

html[data-theme="dark"] .dashboard-action-copy,
html[data-theme="dark"] .performer-info-card .card-text,
html[data-theme="dark"] .performer-info-card small,
html[data-theme="dark"] .collab-option-copy small,
html[data-theme="dark"] .sti-path-option small,
html[data-theme="dark"] .sti-site-card small,
html[data-theme="dark"] .sti-upload-explainer small,
html[data-theme="dark"] .todo-item p,
html[data-theme="dark"] .planner-calendar-event-meta,
html[data-theme="dark"] .planner-day-no-events,
html[data-theme="dark"] .planner-mobile-empty {
  color: rgba(224, 242, 254, 0.72);
}

html[data-theme="dark"] .dashboard-action-icon,
html[data-theme="dark"] .performer-section-icon,
html[data-theme="dark"] .collab-option-icon,
html[data-theme="dark"] .sti-upload-explainer-icon,
html[data-theme="dark"] .sti-site-icon,
html[data-theme="dark"] .todo-count,
html[data-theme="dark"] .planner-day-number,
html[data-theme="dark"] .collab-activity-help {
  color: #042f2e;
  background: linear-gradient(135deg, #67e8f9, #5eead4);
  border-color: rgba(125, 211, 252, 0.48);
  box-shadow: 0 0 22px rgba(103, 232, 249, 0.24);
}

html[data-theme="dark"] .dashboard-agent-chat,
html[data-theme="dark"] .dashboard-agent-panel,
html[data-theme="dark"] .dashboard-agent-summary,
html[data-theme="dark"] .dashboard-agent-sandbox-sidebar,
html[data-theme="dark"] .dashboard-agent-sandbox-stage,
html[data-theme="dark"] .dashboard-agent-sandbox-inspector {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.78), rgba(15, 23, 42, 0.7));
  border-color: rgba(125, 211, 252, 0.22);
  box-shadow:
    0 18px 42px rgba(2, 6, 23, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

html[data-theme="dark"] .dashboard-agent-tabs {
  background: rgba(2, 6, 23, 0.54);
  border-color: rgba(125, 211, 252, 0.18);
  box-shadow: 0 14px 34px rgba(2, 6, 23, 0.28);
}

html[data-theme="dark"] .dashboard-agent-tab {
  color: rgba(224, 242, 254, 0.72);
}

html[data-theme="dark"] .dashboard-agent-tab:hover,
html[data-theme="dark"] .dashboard-agent-tab:focus-visible {
  color: #ffffff;
  background: rgba(14, 165, 233, 0.12);
  border-color: rgba(125, 211, 252, 0.24);
}

html[data-theme="dark"] .dashboard-agent-tab-active,
html[data-theme="dark"] .dashboard-agent-tab-active:hover,
html[data-theme="dark"] .dashboard-agent-tab-active:focus-visible {
  color: #04111f;
  background: linear-gradient(135deg, #67e8f9, #5eead4);
  border-color: rgba(125, 211, 252, 0.42);
  box-shadow: 0 0 24px rgba(103, 232, 249, 0.18);
}

html[data-theme="dark"] .dashboard-agent-session-bar {
  background:
    linear-gradient(135deg, rgba(8, 47, 73, 0.72), rgba(15, 23, 42, 0.82));
  border-color: rgba(125, 211, 252, 0.2);
}

html[data-theme="dark"] .dashboard-agent-chat-workbench {
  background:
    linear-gradient(135deg, rgba(2, 6, 23, 0.46), rgba(8, 47, 73, 0.34));
  border-color: rgba(125, 211, 252, 0.16);
}

html[data-theme="dark"] .dashboard-agent-chat-workbench .dashboard-agent-panel,
html[data-theme="dark"] .dashboard-agent-chat-workbench .dashboard-agent-summary {
  background: rgba(2, 6, 23, 0.34);
  box-shadow: none;
}

html[data-theme="dark"] .dashboard-agent-response-panel {
  background: rgba(2, 6, 23, 0.36);
  border-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .dashboard-agent-session-bar strong {
  color: #ffffff;
}

html[data-theme="dark"] .dashboard-agent-session-label {
  color: #67e8f9;
}

html[data-theme="dark"] .dashboard-agent-sandbox-canvas {
  background:
    linear-gradient(rgba(125, 211, 252, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(125, 211, 252, 0.08) 1px, transparent 1px),
    linear-gradient(180deg, rgba(2, 6, 23, 0.88), rgba(15, 23, 42, 0.82));
  background-size: 28px 28px, 28px 28px, auto;
  border-color: rgba(125, 211, 252, 0.2);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-inspector,
html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-palette,
html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-context-menu,
html[data-theme="dark"] .dashboard-agent-sandbox-context-menu,
html[data-theme="dark"] .dashboard-agent-sandbox-quick-start-card,
html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-node-detail,
html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-field textarea,
html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-control,
html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-select {
  scrollbar-color: rgba(94, 234, 212, 0.72) transparent;
}

html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-inspector::-webkit-scrollbar-thumb,
html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-palette::-webkit-scrollbar-thumb,
html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-context-menu::-webkit-scrollbar-thumb,
html[data-theme="dark"] .dashboard-agent-sandbox-context-menu::-webkit-scrollbar-thumb,
html[data-theme="dark"] .dashboard-agent-sandbox-quick-start-card::-webkit-scrollbar-thumb,
html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-node-detail::-webkit-scrollbar-thumb,
html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-field textarea::-webkit-scrollbar-thumb,
html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-control::-webkit-scrollbar-thumb,
html[data-theme="dark"] .dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-select::-webkit-scrollbar-thumb {
  border-color: rgba(2, 6, 23, 0.82);
}

html[data-theme="dark"] .dashboard-agent-sandbox-toolbox {
  background: rgba(2, 6, 23, 0.9);
  border-color: rgba(125, 211, 252, 0.22);
  box-shadow: 0 16px 34px rgba(2, 6, 23, 0.32);
}

html[data-theme="dark"] .dashboard-agent-sandbox-toolbox button {
  color: #e0f2fe;
}

html[data-theme="dark"] .dashboard-agent-sandbox-toolbox button:hover,
html[data-theme="dark"] .dashboard-agent-sandbox-toolbox button:focus-visible,
html[data-theme="dark"] .dashboard-agent-sandbox-tool-active {
  color: #022c22;
  background: #5eead4;
  border-color: rgba(94, 234, 212, 0.42);
}

html[data-theme="dark"] .dashboard-agent-sandbox-palette-block,
html[data-theme="dark"] .dashboard-agent-sandbox-saved-item,
html[data-theme="dark"] .dashboard-agent-sandbox-node {
  color: #e0f2fe;
  background: rgba(2, 6, 23, 0.68);
  border-color: rgba(125, 211, 252, 0.2);
  box-shadow: 0 16px 30px rgba(2, 6, 23, 0.28);
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-loop-scope {
  background:
    linear-gradient(180deg, rgba(8, 47, 73, 0.42), rgba(15, 23, 42, 0.28));
  border-color: rgba(56, 189, 248, 0.54);
  box-shadow: inset 0 0 0 0.12rem rgba(56, 189, 248, 0.1);
}

html[data-theme="dark"] .dashboard-agent-sandbox-palette-block:hover,
html[data-theme="dark"] .dashboard-agent-sandbox-palette-block:focus-visible,
html[data-theme="dark"] .dashboard-agent-sandbox-node:focus-visible,
html[data-theme="dark"] .dashboard-agent-sandbox-node-selected {
  border-color: rgba(103, 232, 249, 0.5);
  box-shadow:
    0 0 0 0.18rem rgba(103, 232, 249, 0.12),
    0 16px 30px rgba(2, 6, 23, 0.3);
}

html[data-theme="dark"] .dashboard-agent-sandbox-node:focus-visible::after,
html[data-theme="dark"] .dashboard-agent-sandbox-node-selected::after {
  border-color: #67e8f9;
  box-shadow:
    0 0 0 0.14rem rgba(2, 6, 23, 0.94),
    0 0 0 0.42rem rgba(103, 232, 249, 0.24);
}

html[data-theme="dark"] .dashboard-agent-sandbox-list-tabs {
  background: rgba(2, 6, 23, 0.46);
  border-color: rgba(125, 211, 252, 0.16);
}

html[data-theme="dark"] .dashboard-agent-sandbox-list-tab {
  color: rgba(224, 242, 254, 0.76);
}

html[data-theme="dark"] .dashboard-agent-sandbox-list-tab:hover,
html[data-theme="dark"] .dashboard-agent-sandbox-list-tab:focus-visible,
html[data-theme="dark"] .dashboard-agent-sandbox-list-tab-active {
  color: #99f6e4;
  background: rgba(15, 23, 42, 0.84);
  border-color: rgba(94, 234, 212, 0.28);
  box-shadow: 0 10px 18px rgba(2, 6, 23, 0.24);
}

html[data-theme="dark"] .dashboard-agent-sandbox-upcoming-count {
  color: #042f2e;
  background: #5eead4;
}

html[data-theme="dark"] .dashboard-agent-sandbox-hotkey {
  color: #022c22;
  background: #5eead4;
  border-color: rgba(153, 246, 228, 0.58);
  box-shadow: none;
}

html[data-theme="dark"] .dashboard-agent-sandbox-block-icon,
html[data-theme="dark"] .dashboard-agent-sandbox-node-badge {
  color: #bae6fd;
  background: rgba(15, 23, 42, 0.86);
  border-color: rgba(125, 211, 252, 0.22);
}

html[data-theme="dark"] .dashboard-agent-sandbox-block-copy strong,
html[data-theme="dark"] .dashboard-agent-sandbox-saved-load strong,
html[data-theme="dark"] .dashboard-agent-sandbox-node-header strong {
  color: #ffffff;
}

html[data-theme="dark"] .dashboard-agent-sandbox-block-copy small,
html[data-theme="dark"] .dashboard-agent-sandbox-saved-load small,
html[data-theme="dark"] .dashboard-agent-sandbox-node-detail,
html[data-theme="dark"] .dashboard-agent-sandbox-node-meta,
html[data-theme="dark"] .dashboard-agent-sandbox-status,
html[data-theme="dark"] .dashboard-agent-sandbox-run-log,
html[data-theme="dark"] .dashboard-agent-sandbox-inspector-empty,
html[data-theme="dark"] .dashboard-agent-sandbox-saved-empty,
html[data-theme="dark"] .dashboard-agent-sandbox-empty,
html[data-theme="dark"] .dashboard-agent-sandbox-field-help {
  color: rgba(224, 242, 254, 0.7);
}

html[data-theme="dark"] .dashboard-agent-sandbox-run-log {
  background: rgba(2, 6, 23, 0.46);
  border-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .dashboard-agent-sandbox-queue-reason {
  color: rgba(224, 242, 254, 0.72);
}

html[data-theme="dark"] .dashboard-agent-sandbox-queue-status {
  color: #ccfbf1;
  background: rgba(6, 78, 59, 0.4);
  border-color: rgba(94, 234, 212, 0.26);
}

html[data-theme="dark"] .dashboard-agent-sandbox-outputs {
  color: #ccfbf1;
  background: rgba(6, 78, 59, 0.36);
  border-color: rgba(94, 234, 212, 0.24);
}

html[data-theme="dark"] .dashboard-agent-sandbox-output-label {
  color: #5eead4;
}

html[data-theme="dark"] .dashboard-agent-sandbox-output-list a,
html[data-theme="dark"] .dashboard-agent-sandbox-output-value {
  color: #ccfbf1;
}

html[data-theme="dark"] .dashboard-agent-sandbox-run-log.text-success {
  color: #ccfbf1;
  background: rgba(6, 78, 59, 0.36);
  border-color: rgba(94, 234, 212, 0.24);
}

html[data-theme="dark"] .dashboard-agent-sandbox-run-log.text-danger {
  color: #fecaca;
  background: rgba(127, 29, 29, 0.28);
  border-color: rgba(248, 113, 113, 0.28);
}

html[data-theme="dark"] .dashboard-agent-sandbox-undo-toast {
  color: #e0f2fe;
  background: rgba(2, 6, 23, 0.94);
  border-color: rgba(94, 234, 212, 0.26);
  border-left-color: #5eead4;
  box-shadow: 0 22px 46px rgba(2, 6, 23, 0.38);
}

html[data-theme="dark"] .dashboard-agent-sandbox-quick-start {
  background: rgba(2, 6, 23, 0.62);
}

html[data-theme="dark"] .dashboard-agent-sandbox-template-chooser {
  background: rgba(2, 6, 23, 0.64);
}

html[data-theme="dark"] .dashboard-agent-sandbox-quick-start-card {
  color: #e0f2fe;
  background:
    linear-gradient(180deg, rgba(2, 6, 23, 0.98), rgba(15, 23, 42, 0.94));
  border-color: rgba(94, 234, 212, 0.26);
  box-shadow: 0 28px 70px rgba(2, 6, 23, 0.54);
}

html[data-theme="dark"] .dashboard-agent-sandbox-template-card {
  color: #e0f2fe;
  background:
    radial-gradient(circle at 12% 0%, rgba(20, 184, 166, 0.18), transparent 25rem),
    linear-gradient(180deg, rgba(2, 6, 23, 0.98), rgba(15, 23, 42, 0.94));
  border-color: rgba(94, 234, 212, 0.26);
  box-shadow: 0 28px 70px rgba(2, 6, 23, 0.56);
}

html[data-theme="dark"] .dashboard-agent-sandbox-template-heading p,
html[data-theme="dark"] .dashboard-agent-sandbox-template-copy span,
html[data-theme="dark"] .dashboard-agent-sandbox-template-choice small {
  color: rgba(224, 242, 254, 0.74);
}

html[data-theme="dark"] .dashboard-agent-sandbox-template-choice,
html[data-theme="dark"] .dashboard-agent-sandbox-template-option {
  color: #e0f2fe;
  background: rgba(15, 23, 42, 0.78);
  border-color: rgba(125, 211, 252, 0.18);
  box-shadow: 0 18px 38px rgba(2, 6, 23, 0.3);
}

html[data-theme="dark"] .dashboard-agent-sandbox-template-choice:hover,
html[data-theme="dark"] .dashboard-agent-sandbox-template-choice:focus-visible,
html[data-theme="dark"] .dashboard-agent-sandbox-template-option:hover,
html[data-theme="dark"] .dashboard-agent-sandbox-template-option:focus-visible {
  border-color: rgba(94, 234, 212, 0.48);
  box-shadow:
    0 0 0 0.18rem rgba(94, 234, 212, 0.12),
    0 22px 44px rgba(2, 6, 23, 0.4);
}

html[data-theme="dark"] .dashboard-agent-sandbox-template-icon {
  color: #99f6e4;
  background:
    linear-gradient(180deg, rgba(6, 78, 59, 0.72), rgba(14, 116, 144, 0.42));
  border-color: rgba(94, 234, 212, 0.3);
  box-shadow:
    0 10px 22px rgba(2, 6, 23, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .dashboard-agent-sandbox-template-choice strong,
html[data-theme="dark"] .dashboard-agent-sandbox-template-option strong,
html[data-theme="dark"] .dashboard-agent-sandbox-template-heading h3 {
  color: #ffffff;
}

html[data-theme="dark"] .dashboard-agent-sandbox-template-copy small {
  color: #99f6e4;
}

html[data-theme="dark"] .dashboard-agent-sandbox-quick-start-grid section {
  background: rgba(15, 23, 42, 0.72);
  border-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .dashboard-agent-sandbox-quick-start-grid h4 {
  color: #99f6e4;
}

html[data-theme="dark"] .dashboard-agent-sandbox-quick-start-grid p {
  color: rgba(224, 242, 254, 0.76);
}

html[data-theme="dark"] .dashboard-agent-sandbox-context-menu {
  background: rgba(2, 6, 23, 0.96);
  border-color: rgba(125, 211, 252, 0.22);
  box-shadow: 0 22px 46px rgba(2, 6, 23, 0.42);
}

html[data-theme="dark"] .dashboard-agent-sandbox-context-menu button {
  color: #e0f2fe;
}

html[data-theme="dark"] .dashboard-agent-sandbox-context-menu-heading,
html[data-theme="dark"] .dashboard-agent-sandbox-context-menu button small {
  color: rgba(153, 246, 228, 0.78);
}

html[data-theme="dark"] .dashboard-agent-sandbox-context-menu button:hover,
html[data-theme="dark"] .dashboard-agent-sandbox-context-menu button:focus-visible {
  color: #022c22;
  background: #5eead4;
}

html[data-theme="dark"] .dashboard-agent-sandbox-check,
html[data-theme="dark"] .dashboard-agent-sandbox-platform {
  color: #e0f2fe;
  background: rgba(2, 6, 23, 0.42);
  border-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .dashboard-agent-sandbox-field-disabled .form-label {
  color: rgba(224, 242, 254, 0.44);
}

html[data-theme="dark"] .dashboard-agent-sandbox-field-disabled .form-control,
html[data-theme="dark"] .dashboard-agent-sandbox-field-disabled .form-select {
  color: rgba(224, 242, 254, 0.48);
  background: rgba(15, 23, 42, 0.62);
  border-color: rgba(148, 163, 184, 0.2);
}

html[data-theme="dark"] .dashboard-agent-sandbox-platform:has(input:disabled) {
  color: rgba(224, 242, 254, 0.44);
  background: rgba(15, 23, 42, 0.34);
}

html[data-theme="dark"] .dashboard-agent-sandbox-future-performer-select,
html[data-theme="dark"] .dashboard-agent-sandbox-future-performer-choice {
  color: #ccfbf1;
  background: linear-gradient(135deg, rgba(6, 78, 59, 0.52), rgba(20, 83, 45, 0.42));
  border-color: rgba(94, 234, 212, 0.42);
}

html[data-theme="dark"] .dashboard-agent-sandbox-future-performer-help {
  color: #99f6e4;
}

html[data-theme="dark"] .dashboard-agent-sandbox-has-selection::before {
  background: rgba(2, 6, 23, 0.52);
}

html[data-theme="dark"] .dashboard-agent-sandbox-purpose {
  color: #e0f2fe;
  background: rgba(6, 78, 59, 0.24);
  border-color: rgba(94, 234, 212, 0.2);
}

html[data-theme="dark"] .dashboard-agent-sandbox-builder {
  background:
    linear-gradient(180deg, rgba(6, 78, 59, 0.22), rgba(30, 41, 59, 0.54));
  border-color: rgba(94, 234, 212, 0.22);
  border-left-color: #5eead4;
}

html[data-theme="dark"] .dashboard-agent-sandbox-automation-label {
  color: #99f6e4;
}

html[data-theme="dark"] .dashboard-agent-sandbox-automation-focused::after {
  background: rgba(2, 6, 23, 0.58);
}

html[data-theme="dark"] .dashboard-agent-sandbox-variable-chip {
  color: #99f6e4;
  background: rgba(15, 23, 42, 0.72);
  border-color: rgba(94, 234, 212, 0.22);
}

html[data-theme="dark"] .dashboard-agent-sandbox-variable-chip:hover,
html[data-theme="dark"] .dashboard-agent-sandbox-variable-chip:focus-visible {
  color: #022c22;
  background: #5eead4;
}

html[data-theme="dark"] .dashboard-agent-sandbox-variable-editor {
  caret-color: #5eead4;
}

html[data-theme="dark"] .dashboard-agent-sandbox-variable-editor:empty::before {
  color: rgba(186, 230, 253, 0.52);
}

html[data-theme="dark"] .dashboard-agent-sandbox-variable-entity {
  color: #99f6e4;
  background: linear-gradient(180deg, rgba(6, 78, 59, 0.72), rgba(15, 118, 110, 0.5));
  border-color: rgba(94, 234, 212, 0.35);
  box-shadow: 0 8px 16px rgba(2, 6, 23, 0.26);
}

html[data-theme="dark"] .dashboard-agent-sandbox-variable-entity:hover {
  color: #022c22;
  background: #5eead4;
  border-color: rgba(153, 246, 228, 0.72);
}

html[data-theme="dark"] .dashboard-agent-sandbox-field input[type="date"],
html[data-theme="dark"] .dashboard-agent-sandbox-field input[type="time"] {
  color-scheme: dark;
}

html[data-theme="dark"] .dashboard-agent-sandbox-field input[type="date"]::-webkit-calendar-picker-indicator,
html[data-theme="dark"] .dashboard-agent-sandbox-field input[type="time"]::-webkit-calendar-picker-indicator {
  opacity: 1;
  filter: invert(1) brightness(1.18) contrast(1.08);
}

html[data-theme="dark"] .dashboard-agent-sandbox-handle {
  background: #020617;
  border-color: rgba(125, 211, 252, 0.42);
  box-shadow: 0 8px 16px rgba(2, 6, 23, 0.34);
}

html[data-theme="dark"] .dashboard-agent-sandbox-handle:hover,
html[data-theme="dark"] .dashboard-agent-sandbox-handle:focus-visible {
  background: #67e8f9;
  border-color: #bae6fd;
}

html[data-theme="dark"] .dashboard-agent-sandbox-link {
  stroke: rgba(148, 163, 184, 0.74);
}

html[data-theme="dark"] .dashboard-agent-sandbox-link-selected {
  stroke: #67e8f9;
}

html[data-theme="dark"] .dashboard-agent-sandbox-link-preview {
  stroke: #5eead4;
}

html[data-theme="dark"] .dashboard-agent-sandbox-link-label {
  fill: #99f6e4;
  stroke: #020617;
}

html[data-theme="dark"] .dashboard-agent-sandbox-link-label-selected {
  fill: #67e8f9;
}

html[data-theme="dark"] .dashboard-agent-sandbox-links marker path {
  fill: rgba(148, 163, 184, 0.9);
}

html[data-theme="dark"] .dashboard-agent-sandbox-links .dashboard-agent-sandbox-preview-marker path {
  fill: #5eead4;
}

html[data-theme="dark"] .dashboard-agent-sandbox-selection-box {
  background: rgba(94, 234, 212, 0.1);
  border-color: rgba(94, 234, 212, 0.72);
  box-shadow: 0 0 0 0.16rem rgba(94, 234, 212, 0.08);
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-connect-target {
  border-color: rgba(94, 234, 212, 0.72);
  box-shadow:
    0 0 0 0.24rem rgba(94, 234, 212, 0.14),
    0 18px 30px rgba(2, 6, 23, 0.32);
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-error {
  border-color: rgba(248, 113, 113, 0.78);
  box-shadow:
    0 0 0 0.22rem rgba(248, 113, 113, 0.18),
    0 18px 30px rgba(2, 6, 23, 0.32);
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-caution {
  border-color: rgba(251, 191, 36, 0.84);
  box-shadow:
    0 0 0 0.22rem rgba(251, 191, 36, 0.18),
    0 0 32px rgba(251, 191, 36, 0.24),
    0 20px 34px rgba(2, 6, 23, 0.34);
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-caution-icon {
  color: #422006;
  background: #fbbf24;
  border-color: rgba(253, 230, 138, 0.52);
  box-shadow: 0 6px 14px rgba(251, 191, 36, 0.18);
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-connecting .dashboard-agent-sandbox-handle-out,
html[data-theme="dark"] .dashboard-agent-sandbox-node-connect-target .dashboard-agent-sandbox-handle-in {
  background: #67e8f9;
  border-color: #bae6fd;
  box-shadow:
    0 0 0 0.22rem rgba(103, 232, 249, 0.16),
    0 8px 16px rgba(2, 6, 23, 0.34);
}

html[data-theme="dark"] .dashboard-agent-sandbox-fields .form-label {
  color: #67e8f9 !important;
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-mint {
  border-left-color: #2dd4bf;
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-sky {
  border-left-color: #38bdf8;
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-amber {
  border-left-color: #fbbf24;
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-rose {
  border-left-color: #fb7185;
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-violet {
  border-left-color: #a78bfa;
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-slate {
  border-left-color: #cbd5e1;
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-green {
  border-left-color: #4ade80;
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-cyan {
  border-left-color: #22d3ee;
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-yellow {
  border-left-color: #fde047;
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-orange {
  border-left-color: #fb923c;
}

html[data-theme="dark"] .dashboard-agent-sandbox-node-red {
  border-left-color: #f87171;
}

html[data-theme="dark"] .dashboard-agent-input-reminder {
  color: #99f6e4;
  background: rgba(15, 23, 42, 0.94);
  border-color: rgba(125, 211, 252, 0.22);
  box-shadow: 0 8px 18px rgba(2, 6, 23, 0.28);
}

html[data-theme="dark"] .dashboard-agent-panel-kicker,
html[data-theme="dark"] .dashboard-agent-response-kicker,
html[data-theme="dark"] .dashboard-agent-followup-label,
html[data-theme="dark"] .dashboard-agent-step-link {
  color: #67e8f9;
}

html[data-theme="dark"] .dashboard-agent-panel-heading h3,
html[data-theme="dark"] .dashboard-agent-workflow-copy strong {
  color: #ffffff;
}

html[data-theme="dark"] .dashboard-agent-status,
html[data-theme="dark"] .dashboard-agent-progress-item,
html[data-theme="dark"] .dashboard-agent-workflow-intro,
html[data-theme="dark"] .dashboard-agent-empty,
html[data-theme="dark"] .dashboard-agent-workflow-copy small {
  color: rgba(224, 242, 254, 0.74) !important;
}

html[data-theme="dark"] .dashboard-agent-chat-summary {
  color: #67e8f9;
  border-top-color: rgba(125, 211, 252, 0.2);
}

html[data-theme="dark"] .dashboard-agent-followup {
  color: #bae6fd;
  background: rgba(14, 165, 233, 0.16);
  border-color: rgba(103, 232, 249, 0.24);
}

html[data-theme="dark"] .dashboard-agent-followup-question {
  color: #ffffff;
}

html[data-theme="dark"] .dashboard-agent-quick-option {
  color: #ccfbf1;
  background: rgba(20, 184, 166, 0.14);
  border-color: rgba(125, 211, 252, 0.22);
}

html[data-theme="dark"] .dashboard-agent-quick-option:hover,
html[data-theme="dark"] .dashboard-agent-quick-option:focus-visible,
html[data-theme="dark"] .dashboard-agent-quick-option-selected {
  color: #04111f;
  background: #67e8f9;
  border-color: rgba(125, 211, 252, 0.42);
}

html[data-theme="dark"] .dashboard-agent-workflow-step {
  background: rgba(2, 6, 23, 0.36);
  border-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .dashboard-agent-workflow-step:not(:last-child)::after {
  background: rgba(148, 163, 184, 0.62);
}

html[data-theme="dark"] .dashboard-agent-workflow-step:not(:last-child)::before {
  border-color: rgba(148, 163, 184, 0.62);
}

html[data-theme="dark"] .dashboard-agent-workflow-step-done:not(:last-child)::after {
  background: #38bdf8;
  box-shadow: 0 0 0 0.18rem rgba(56, 189, 248, 0.11);
}

html[data-theme="dark"] .dashboard-agent-workflow-step-done:not(:last-child)::before {
  border-color: #38bdf8;
}

html[data-theme="dark"] .dashboard-agent-workflow-step-active {
  background: rgba(8, 47, 73, 0.44);
  border-color: rgba(103, 232, 249, 0.38);
  box-shadow: 0 0 0 0.18rem rgba(103, 232, 249, 0.08);
}

html[data-theme="dark"] .dashboard-agent-workflow-number {
  color: #04111f;
  background: linear-gradient(135deg, #67e8f9, #5eead4);
  border-color: rgba(125, 211, 252, 0.42);
}

html[data-theme="dark"] .dashboard-agent-workflow-step-done {
  color: rgba(148, 163, 184, 0.88);
  background: rgba(15, 23, 42, 0.42);
  border-color: rgba(148, 163, 184, 0.16);
}

html[data-theme="dark"] .dashboard-agent-workflow-step-done .dashboard-agent-workflow-number {
  color: #020617;
  background: #94a3b8;
  border-color: rgba(148, 163, 184, 0.26);
}

html[data-theme="dark"] .dashboard-agent-workflow-step-done .dashboard-agent-workflow-copy strong,
html[data-theme="dark"] .dashboard-agent-workflow-step-done .dashboard-agent-workflow-copy small {
  color: rgba(148, 163, 184, 0.9) !important;
}

html[data-theme="dark"] .dashboard-agent-workflow-status {
  color: rgba(224, 242, 254, 0.76);
  background: rgba(15, 23, 42, 0.74);
  border-color: rgba(125, 211, 252, 0.16);
}

html[data-theme="dark"] .dashboard-agent-workflow-status-done {
  color: rgba(226, 232, 240, 0.82);
  background: rgba(51, 65, 85, 0.76);
  border-color: rgba(148, 163, 184, 0.18);
}

html[data-theme="dark"] .dashboard-agent-workflow-status-active {
  color: #bae6fd;
  background: rgba(14, 165, 233, 0.18);
  border-color: rgba(103, 232, 249, 0.24);
}

html[data-theme="dark"] .dashboard-agent-workflow-status-blocked,
html[data-theme="dark"] .dashboard-agent-workflow-status-user_action {
  color: #fde68a;
  background: rgba(245, 158, 11, 0.16);
  border-color: rgba(245, 158, 11, 0.26);
}

html[data-theme="dark"] .dashboard-agent-summary {
  color: #ccfbf1;
  background:
    linear-gradient(145deg, rgba(6, 78, 59, 0.48), rgba(20, 83, 45, 0.32));
  border-color: rgba(94, 234, 212, 0.24);
}

html[data-theme="dark"] .dashboard-agent-artifact-link {
  color: #ccfbf1;
  background: rgba(20, 184, 166, 0.12);
  border-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .dashboard-agent-artifact-link::after {
  color: rgba(224, 242, 254, 0.58);
}

html[data-theme="dark"] .dashboard-agent-artifact-link:hover,
html[data-theme="dark"] .dashboard-agent-artifact-link:focus {
  color: #04111f;
  background: #67e8f9;
  border-color: rgba(125, 211, 252, 0.42);
}

html[data-theme="dark"] .performer-archive-button {
  color: #fecaca;
  background: rgba(127, 29, 29, 0.32);
  border-color: rgba(248, 113, 113, 0.28);
}

html[data-theme="dark"] .performer-archive-button:hover,
html[data-theme="dark"] .performer-archive-button:focus {
  color: #ffffff;
  background: #dc2626;
  border-color: #f87171;
}

html[data-theme="dark"] .collab-performer-option:has(.collab-performer-input:checked),
html[data-theme="dark"] .collab-performer-option-selected,
html[data-theme="dark"] .collab-activity-mode-option:has(input:checked),
html[data-theme="dark"] .collab-activity-question label:has(input:checked),
html[data-theme="dark"] .collab-activity-option-selected,
html[data-theme="dark"] .sti-test-mode-option:has(input:checked),
html[data-theme="dark"] .sti-test-type-option:has(input:checked),
html[data-theme="dark"] .sti-test-option-selected,
html[data-theme="dark"] .sti-test-chip,
html[data-theme="dark"] .sti-path-option-active,
html[data-theme="dark"] .collab-activity-chip {
  color: #ccfbf1;
  background:
    linear-gradient(145deg, rgba(20, 184, 166, 0.18), rgba(14, 165, 233, 0.14)),
    rgba(2, 6, 23, 0.72);
  border-color: rgba(94, 234, 212, 0.48);
}

html[data-theme="dark"] .contract-signature-panel {
  border-color: rgba(125, 211, 252, 0.24);
}

html[data-theme="dark"] .contract-signature-chip {
  color: #e0f2fe;
  background: rgba(2, 6, 23, 0.72);
  border-color: rgba(125, 211, 252, 0.24);
}

html[data-theme="dark"] .contract-builder-ai-panel {
  border-color: rgba(125, 211, 252, 0.22);
}

html[data-theme="dark"] .contract-assistant-reset {
  color: #ffffff;
  background: linear-gradient(135deg, #ef4444, #b91c1c);
  box-shadow: 0 14px 30px rgba(127, 29, 29, 0.28);
}

html[data-theme="dark"] .contract-assistant-reset:hover:not(:disabled),
html[data-theme="dark"] .contract-assistant-reset:focus-visible:not(:disabled) {
  color: #ffffff;
  box-shadow:
    0 18px 34px rgba(127, 29, 29, 0.36),
    0 0 0 0.18rem rgba(248, 113, 113, 0.18);
}

html[data-theme="dark"] .contract-assistant-messages {
  background: transparent;
  border-color: transparent;
  scrollbar-color: rgba(94, 234, 212, 0.72) transparent;
}

html[data-theme="dark"] .contract-assistant-messages::-webkit-scrollbar-track {
  background: transparent;
  box-shadow: none;
}

html[data-theme="dark"] .contract-assistant-messages::-webkit-scrollbar-thumb {
  background:
    linear-gradient(180deg, rgba(94, 234, 212, 0.84), rgba(20, 184, 166, 0.72));
  border-color: rgba(2, 6, 23, 0.74);
  box-shadow:
    0 0 14px rgba(45, 212, 191, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

html[data-theme="dark"] .contract-assistant-messages::-webkit-scrollbar-thumb:hover {
  background:
    linear-gradient(180deg, rgba(153, 246, 228, 0.94), rgba(45, 212, 191, 0.84));
}

html[data-theme="dark"] .contract-assistant-bubble {
  color: #e6fffb;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.94), rgba(2, 6, 23, 0.82));
  border-color: rgba(125, 211, 252, 0.18);
  box-shadow:
    0 18px 40px rgba(2, 6, 23, 0.34),
    0 0 0 1px rgba(94, 234, 212, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .contract-assistant-avatar {
  color: #f8ffff;
  background:
    radial-gradient(circle at 36% 28%, rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0) 34%),
    linear-gradient(135deg, rgba(20, 184, 166, 0.95), rgba(14, 165, 233, 0.8));
  border-color: rgba(125, 211, 252, 0.26);
  box-shadow:
    0 14px 28px rgba(14, 165, 233, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

html[data-theme="dark"] .contract-assistant-message-user .contract-assistant-bubble {
  color: #031716;
  background: linear-gradient(135deg, #99f6e4, #5eead4);
  border-color: rgba(94, 234, 212, 0.42);
  box-shadow: 0 14px 30px rgba(20, 184, 166, 0.18);
}

html[data-theme="dark"] .contract-assistant-typing-bubble span {
  background: #bae6fd;
}

html[data-theme="dark"] .contract-assistant-input-wrap::before {
  box-shadow: 0 0 0 0 rgba(56, 189, 248, 0);
}

html[data-theme="dark"] .contract-assistant-input-wrap:focus-within::before {
  box-shadow: 0 0 0 0.22rem rgba(94, 234, 212, 0.13);
}

html[data-theme="dark"] .contract-assistant-message-input {
  color: #e0f2fe;
  background:
    linear-gradient(180deg, rgba(15, 23, 42, 0.94), rgba(2, 6, 23, 0.82));
  border-color: rgba(125, 211, 252, 0.22);
  box-shadow:
    0 18px 40px rgba(2, 6, 23, 0.34),
    0 0 0 1px rgba(94, 234, 212, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .contract-assistant-message-input:focus {
  color: #ffffff;
  background:
    linear-gradient(180deg, rgba(15, 23, 42, 0.98), rgba(2, 6, 23, 0.88));
  border-color: rgba(94, 234, 212, 0.44);
  box-shadow:
    0 20px 48px rgba(20, 184, 166, 0.16),
    0 0 0 1px rgba(94, 234, 212, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .contract-assistant-message-input::placeholder {
  color: rgba(186, 230, 253, 0.62);
}

html[data-theme="dark"] .contract-assistant-send {
  color: #031716;
  background: #67e8df;
  border-color: rgba(94, 234, 212, 0.34);
  box-shadow:
    0 14px 30px rgba(20, 184, 166, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

html[data-theme="dark"] .contract-assistant-send:hover:not(:disabled),
html[data-theme="dark"] .contract-assistant-send:focus-visible:not(:disabled) {
  color: #031716;
  background: #5eead4;
  box-shadow:
    0 16px 34px rgba(20, 184, 166, 0.26),
    0 0 0 0.22rem rgba(94, 234, 212, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

html[data-theme="dark"] .contract-ai-change-log {
  border-color: rgba(125, 211, 252, 0.24);
}

html[data-theme="dark"] .contract-ai-change-log-header strong {
  color: #ffffff;
}

html[data-theme="dark"] .contract-ai-change-log-header small {
  color: rgba(224, 242, 254, 0.62);
}

html[data-theme="dark"] .contract-ai-change-item {
  border-left-color: rgba(125, 211, 252, 0.28);
}

html[data-theme="dark"] .contract-ai-change-added {
  border-left-color: rgba(74, 222, 128, 0.58);
}

html[data-theme="dark"] .contract-ai-change-removed {
  border-left-color: rgba(248, 113, 113, 0.58);
}

html[data-theme="dark"] .contract-ai-change-icon {
  color: #bbf7d0;
  background: rgba(22, 101, 52, 0.42);
  border-color: rgba(74, 222, 128, 0.34);
}

html[data-theme="dark"] .contract-ai-change-removed .contract-ai-change-icon {
  color: #fecaca;
  background: rgba(127, 29, 29, 0.48);
  border-color: rgba(248, 113, 113, 0.34);
}

html[data-theme="dark"] .contract-ai-change-text {
  color: #e0f2fe;
}

html[data-theme="dark"] .planner-month-header,
html[data-theme="dark"] .planner-weekdays,
html[data-theme="dark"] .planner-day-muted,
html[data-theme="dark"] .planner-day-cell.planner-day-muted {
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.82), rgba(15, 23, 42, 0.68)) !important;
  border-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .planner-weekdays,
html[data-theme="dark"] .planner-day-muted .planner-day-number {
  color: rgba(224, 242, 254, 0.58);
}

html[data-theme="dark"] .planner-calendar-event-time {
  color: #67e8f9;
}

html[data-theme="dark"] .badge {
  color: #cbd5e1;
  background: rgba(15, 23, 42, 0.68);
  border-color: rgba(148, 163, 184, 0.26);
}

html[data-theme="dark"] .badge.text-bg-primary,
html[data-theme="dark"] .badge.bg-primary {
  color: #bae6fd !important;
  background: rgba(14, 165, 233, 0.16) !important;
  border-color: rgba(125, 211, 252, 0.34);
}

html[data-theme="dark"] .badge.text-bg-success,
html[data-theme="dark"] .badge.bg-success {
  color: #bbf7d0 !important;
  background: rgba(22, 101, 52, 0.22) !important;
  border-color: rgba(74, 222, 128, 0.32);
}

html[data-theme="dark"] .badge.text-bg-secondary,
html[data-theme="dark"] .badge.bg-secondary {
  color: #cbd5e1 !important;
  background: rgba(51, 65, 85, 0.36) !important;
  border-color: rgba(148, 163, 184, 0.28);
}

html[data-theme="dark"] .badge.text-bg-warning,
html[data-theme="dark"] .badge.bg-warning {
  color: #fde68a !important;
  background: rgba(120, 53, 15, 0.3) !important;
  border-color: rgba(251, 191, 36, 0.32);
}

html[data-theme="dark"] .badge.text-bg-danger,
html[data-theme="dark"] .badge.bg-danger {
  color: #fecaca !important;
  background: rgba(127, 29, 29, 0.3) !important;
  border-color: rgba(248, 113, 113, 0.32);
}

html[data-theme="dark"] .badge.text-bg-info,
html[data-theme="dark"] .badge.bg-info {
  color: #cffafe !important;
  background: rgba(8, 145, 178, 0.18) !important;
  border-color: rgba(103, 232, 249, 0.3);
}

html[data-theme="dark"] .planner-payment-pill,
html[data-theme="dark"] .todo-empty,
html[data-theme="dark"] .link-complete-badge {
  color: #ccfbf1;
  background: rgba(6, 78, 59, 0.32);
  border: 1px solid rgba(94, 234, 212, 0.42);
}

html[data-theme="dark"] .planner-followup-pill {
  color: #fecaca;
  background: rgba(127, 29, 29, 0.34);
  border: 1px solid rgba(248, 113, 113, 0.35);
}

html[data-theme="dark"] .planner-calendar-reminder {
  color: #fecaca;
  background: rgba(127, 29, 29, 0.24);
  border-color: rgba(248, 113, 113, 0.24);
}

html[data-theme="dark"] .todo-empty p {
  color: rgba(204, 251, 241, 0.72);
}

html[data-theme="dark"] .contract-pdf,
html[data-theme="dark"] .bg-white {
  background-color: rgba(2, 6, 23, 0.68) !important;
  border-color: rgba(125, 211, 252, 0.22) !important;
}

html[data-theme="dark"] .app-alert {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.94), rgba(15, 23, 42, 0.9));
  border-color: rgba(125, 211, 252, 0.24);
}

html[data-theme="dark"] .app-alert-success {
  color: #ccfbf1;
  background: rgba(6, 78, 59, 0.92);
  border-color: rgba(94, 234, 212, 0.42);
}

html[data-theme="dark"] .app-alert-warning,
html[data-theme="dark"] .alert-warning {
  color: #fde68a;
  background: rgba(113, 63, 18, 0.78);
  border-color: rgba(251, 191, 36, 0.38);
}

html[data-theme="dark"] .app-alert-danger,
html[data-theme="dark"] .alert-danger {
  color: #fecaca;
  background: rgba(127, 29, 29, 0.82);
  border-color: rgba(248, 113, 113, 0.42);
}

html[data-theme="dark"] .app-alert-info,
html[data-theme="dark"] .alert-info {
  color: #bae6fd;
  background: rgba(8, 47, 73, 0.82);
  border-color: rgba(125, 211, 252, 0.38);
}

html[data-theme="dark"] .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
}

.support-page,
.academy-page {
  display: grid;
  gap: clamp(1.5rem, 4vw, 3rem);
  padding-bottom: 3rem;
}

.support-hero,
.academy-hero,
.academy-promo,
.support-empty,
.academy-empty {
  position: relative;
  overflow: hidden;
  padding: clamp(1.5rem, 4vw, 3rem);
  color: #f8fafc;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.92), rgba(8, 47, 73, 0.7)),
    radial-gradient(circle at 92% 8%, rgba(94, 234, 212, 0.2), transparent 30%);
  border: 1px solid rgba(125, 211, 252, 0.24);
  border-radius: 0.85rem;
  box-shadow: 0 28px 76px rgba(2, 6, 23, 0.32);
}

.support-hero {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(320px, 0.72fr);
  gap: clamp(1.25rem, 4vw, 3rem);
  align-items: center;
  min-height: 360px;
  padding: clamp(1.75rem, 5vw, 4rem);
  background:
    linear-gradient(135deg, rgba(2, 6, 23, 0.96), rgba(8, 47, 73, 0.82)),
    linear-gradient(90deg, rgba(125, 211, 252, 0.09) 1px, transparent 1px),
    linear-gradient(0deg, rgba(94, 234, 212, 0.07) 1px, transparent 1px);
  background-size: auto, 46px 46px, 46px 46px;
}

.support-hero::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    radial-gradient(circle at 18% 22%, rgba(103, 232, 249, 0.24), transparent 26%),
    radial-gradient(circle at 84% 20%, rgba(94, 234, 212, 0.18), transparent 28%);
}

.support-hero-copy,
.support-search-panel {
  position: relative;
  z-index: 1;
}

.support-hero h1,
.academy-hero h1 {
  max-width: 760px;
  margin-bottom: 1.25rem;
  color: #ffffff;
  font-size: clamp(2.3rem, 6vw, 4.4rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0;
}

.academy-hero {
  display: grid;
  justify-items: center;
  text-align: center;
}

.academy-hero p {
  margin-right: auto;
  margin-left: auto;
}

.academy-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(8rem, auto);
  gap: 0.75rem;
  width: min(760px, 100%);
  margin: 0.5rem auto 1rem;
}

.academy-search .form-control {
  min-height: 3.4rem;
  border-color: rgba(125, 211, 252, 0.38);
}

.support-hero-copy p {
  max-width: 600px;
  margin-bottom: 0;
  color: rgba(224, 242, 254, 0.78);
  font-size: 1.08rem;
  line-height: 1.7;
}

.support-search-panel {
  display: grid;
  gap: 1rem;
  padding: clamp(1rem, 3vw, 1.35rem);
  background: rgba(2, 6, 23, 0.58);
  border: 1px solid rgba(125, 211, 252, 0.28);
  border-radius: 0.75rem;
  box-shadow:
    0 22px 54px rgba(2, 6, 23, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(16px);
}

.academy-hero p,
.academy-promo p,
.support-empty p,
.academy-empty p {
  max-width: 720px;
  color: rgba(224, 242, 254, 0.76);
  font-size: 1.05rem;
  line-height: 1.7;
}

.support-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(8rem, auto);
  gap: 0.75rem;
  max-width: 100%;
}

.support-search .form-control {
  min-height: 3.4rem;
  border-color: rgba(125, 211, 252, 0.38);
}

.support-hero-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.support-hero-pills a {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.34rem 0.7rem;
  color: #ccfbf1;
  font-size: 0.78rem;
  font-weight: 850;
  text-decoration: none;
  text-transform: uppercase;
  background: rgba(20, 184, 166, 0.14);
  border: 1px solid rgba(94, 234, 212, 0.32);
  border-radius: 999px;
  transition:
    color 0.18s ease,
    background 0.18s ease,
    border-color 0.18s ease,
    transform 0.18s ease;
}

.support-hero-pills a:hover,
.support-hero-pills a:focus {
  color: #042f2e;
  background: #67e8f9;
  border-color: #67e8f9;
  transform: translateY(-1px);
}

.support-results {
  scroll-margin-top: 1.5rem;
}

.academy-promo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}

.academy-promo h2,
.support-results h2,
.academy-empty h2,
.support-empty h3 {
  color: #ffffff;
  font-weight: 850;
}

.support-result-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.support-result-card,
.academy-section,
.academy-chapter,
.admin-content-item {
  padding: 1.25rem;
  color: #0f172a;
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.7rem;
  box-shadow: 0 18px 46px rgba(2, 6, 23, 0.16);
}

.support-result-card h3,
.academy-chapter h3,
.academy-video h4 {
  color: #0f172a;
  font-weight: 850;
}

.support-result-card p,
.support-result-body,
.support-article-summary,
.support-article-body,
.academy-video p {
  color: #334155;
  line-height: 1.65;
}

.support-result-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1rem;
}

.support-result-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.8rem;
}

.support-result-meta span,
.academy-section-heading span,
.academy-video-placeholder {
  display: inline-flex;
  width: fit-content;
  color: #0f766e;
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.academy-masterclass,
.academy-chapters,
.academy-video-list,
.admin-content-list {
  display: grid;
  gap: 1rem;
}

.admin-audit-tabs .nav-link:not(.active) {
  color: #ffffff;
}

.admin-audit-tabs .nav-link:not(.active):hover,
.admin-audit-tabs .nav-link:not(.active):focus {
  color: #ffffff;
}

.admin-geo-map {
  width: 100%;
  min-height: 22rem;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.32);
  border-radius: 0.5rem;
  background: #e2e8f0;
}

.academy-section-heading {
  margin-bottom: 1rem;
}

.academy-section-heading h2 {
  margin: 0.25rem 0 0;
  color: #0f172a;
  font-weight: 900;
}

.academy-video {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.85rem;
  padding: 1rem;
  background: rgba(241, 245, 249, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 0.65rem;
}

.academy-video-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.2rem;
  height: 2.2rem;
  color: #042f2e;
  font-weight: 850;
  background: linear-gradient(135deg, #67e8f9, #5eead4);
  border-radius: 50%;
}

.academy-video-player {
  display: block;
  width: 100%;
  max-width: 760px;
  margin-top: 0.85rem;
  aspect-ratio: 16 / 9;
  background: #020617;
  border: 1px solid rgba(148, 163, 184, 0.26);
  border-radius: 0.65rem;
}

.academy-video-expanded {
  scroll-margin-top: 1.5rem;
}

.academy-video-select {
  margin-top: 0.5rem;
}

.admin-content-item summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  cursor: pointer;
}

.admin-content-item summary > span:first-child {
  min-width: 0;
  flex: 1 1 18rem;
  overflow-wrap: anywhere;
}

.admin-provider-summary-main {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
  align-items: flex-start;
}

.admin-provider-picker {
  flex: 0 0 auto;
  min-width: 5.25rem;
}

.admin-provider-summary-text {
  min-width: 0;
  flex: 1 1 14rem;
}

.admin-content-item summary strong,
.admin-content-item summary small {
  display: block;
  overflow-wrap: anywhere;
}

.admin-content-item summary .badge {
  flex: 0 0 auto;
}

.support-article-page {
  max-width: 920px;
  margin: 0 auto;
  padding-bottom: 3rem;
}

.support-article-panel {
  padding: clamp(1.5rem, 4vw, 2.5rem);
  color: #0f172a;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.8rem;
  box-shadow: 0 24px 70px rgba(2, 6, 23, 0.22);
  overflow: hidden;
}

.support-article-panel h1 {
  max-width: 760px;
  color: #0f172a;
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 900;
  line-height: 1.08;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.support-article-summary {
  max-width: 760px;
  margin: 1rem 0 1.5rem;
  font-size: 1.08rem;
  overflow-wrap: anywhere;
}

.support-article-body {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

html[data-theme="dark"] .support-result-card,
html[data-theme="dark"] .academy-section,
html[data-theme="dark"] .academy-chapter,
html[data-theme="dark"] .admin-content-item,
html[data-theme="dark"] .support-article-panel {
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.84), rgba(8, 47, 73, 0.48)),
    radial-gradient(circle at 92% 0%, rgba(125, 211, 252, 0.12), transparent 28%);
  border-color: rgba(125, 211, 252, 0.22);
}

html[data-theme="dark"] .support-result-card h3,
html[data-theme="dark"] .support-article-panel h1,
html[data-theme="dark"] .academy-section-heading h2,
html[data-theme="dark"] .academy-chapter h3,
html[data-theme="dark"] .academy-video h4 {
  color: #ffffff;
}

html[data-theme="dark"] .support-result-card p,
html[data-theme="dark"] .support-result-body,
html[data-theme="dark"] .support-article-summary,
html[data-theme="dark"] .support-article-body,
html[data-theme="dark"] .academy-video p {
  color: rgba(224, 242, 254, 0.76);
}

html[data-theme="dark"] .academy-video {
  background: rgba(2, 6, 23, 0.34);
  border-color: rgba(125, 211, 252, 0.18);
}

html[data-theme="dark"] .support-result-meta span,
html[data-theme="dark"] .academy-section-heading span,
html[data-theme="dark"] .academy-video-placeholder {
  color: #67e8f9;
}

@media (max-width: 991px) {
  .support-hero {
    grid-template-columns: 1fr;
  }

  .support-result-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .academy-promo {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 767px) {
  body.index-page main.container {
    --bs-gutter-x: 2.5rem;
  }

  .support-search,
  .academy-search,
  .support-result-grid {
    grid-template-columns: 1fr;
  }

  .support-search .btn,
  .academy-search .btn {
    width: 100%;
  }
}

.plans-page {
  display: grid;
  gap: clamp(1.5rem, 4vw, 2.5rem);
  margin-top: -3rem;
  padding: 0 0 3rem;
}

.plans-page .eyebrow {
  letter-spacing: 0;
}

.plans-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.48fr);
  gap: clamp(1rem, 4vw, 2rem);
  align-items: center;
  padding: clamp(2rem, 4vw, 3rem) 0;
  isolation: isolate;
}

.plans-hero-copy h1 {
  max-width: 760px;
  margin-bottom: 1rem;
  color: #ffffff;
  font-size: clamp(2.4rem, 6vw, 4.5rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0;
}

.plans-hero-copy p,
.plans-dev-notice p {
  color: rgba(224, 242, 254, 0.78);
  font-size: 1.05rem;
  line-height: 1.7;
}

.plans-hero-copy p {
  max-width: 720px;
  margin-bottom: 0;
}

.plans-dev-notice {
  padding: clamp(1rem, 3vw, 1.4rem);
  color: #fffbeb;
  background:
    linear-gradient(145deg, rgba(69, 26, 3, 0.48), rgba(15, 23, 42, 0.78)),
    linear-gradient(90deg, rgba(250, 204, 21, 0.2), rgba(103, 232, 249, 0.08));
  border: 1px solid rgba(251, 191, 36, 0.34);
  border-left: 4px solid #facc15;
  border-radius: 0.5rem;
  box-shadow: 0 24px 64px rgba(2, 6, 23, 0.28);
}

.plans-dev-notice strong {
  display: block;
  margin-bottom: 0.4rem;
  color: #ffffff;
  font-size: 1.02rem;
  font-weight: 850;
}

.plans-dev-notice p {
  margin-bottom: 0;
}

.plan-tier-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.plan-tier-card {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: clamp(1rem, 3vw, 1.35rem);
  color: #e0f2fe;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.94), rgba(30, 41, 59, 0.8)),
    linear-gradient(180deg, rgba(125, 211, 252, 0.08), rgba(94, 234, 212, 0.035));
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 0.5rem;
  box-shadow: 0 22px 54px rgba(2, 6, 23, 0.24);
}

.plan-tier-featured {
  border-color: rgba(94, 234, 212, 0.58);
  box-shadow:
    0 26px 70px rgba(2, 6, 23, 0.32),
    0 0 0 1px rgba(94, 234, 212, 0.12);
}

.plan-tier-header {
  padding-bottom: 0.75rem;
  margin-bottom: 0.85rem;
  border-bottom: 1px solid rgba(125, 211, 252, 0.18);
}

.plan-tier-card h2 {
  margin-bottom: 0.55rem;
  color: #ffffff;
  font-size: clamp(1.7rem, 3vw, 2.2rem);
  font-weight: 900;
  line-height: 1.05;
}

.plan-price {
  margin-bottom: 0;
  color: #ffffff;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  font-weight: 900;
  line-height: 1.08;
}

.plan-price-inline {
  color: #67e8f9;
  font-size: clamp(1.3rem, 2.25vw, 1.75rem);
  line-height: 1.2;
}

.plan-price span {
  display: block;
  margin-top: 0.35rem;
  color: rgba(224, 242, 254, 0.7);
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.4;
}

.plan-feature-list {
  display: grid;
  gap: 0.45rem;
  padding: 0;
  margin: 0 0 1.2rem;
  list-style: none;
}

.plan-feature-list li {
  position: relative;
  display: grid;
  gap: 0.2rem;
  align-content: start;
  min-height: 4.7rem;
  padding-left: 1.45rem;
  color: rgba(224, 242, 254, 0.8);
  line-height: 1.55;
}

.plan-feature-list li::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "\2713";
  color: #ffffff;
  font-weight: 900;
  line-height: 1.55;
}

.plan-feature-unavailable {
  opacity: 0.62;
}

.plan-feature-unavailable::before {
  content: "X" !important;
  color: #fecaca !important;
}

.plan-feature-label,
.plan-feature-value {
  display: block;
}

.plan-feature-label {
  color: #67e8f9;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1.2;
  text-transform: uppercase;
}

.plan-feature-value {
  color: rgba(224, 242, 254, 0.8);
  font-size: 0.94rem;
  line-height: 1.38;
}

.plan-availability {
  display: block;
  padding: 0.75rem;
  margin-top: auto;
  color: #fde68a;
  font-size: 0.88rem;
  font-weight: 850;
  text-align: center;
  background: rgba(113, 63, 18, 0.28);
  border: 1px solid rgba(251, 191, 36, 0.32);
  border-radius: 0.5rem;
}

@media (max-width: 991px) {
  .plans-hero,
  .plan-tier-grid {
    grid-template-columns: 1fr;
  }

  .plan-tier-header {
    min-height: auto;
  }
}

@media (max-width: 767px) {
  .plans-page {
    padding-top: 1rem;
  }

  .plans-hero {
    padding: 2.5rem 0;
  }

  .plans-dev-notice,
  .plan-tier-card {
    padding: 1rem;
  }

}

html[data-font-color="custom"]:not([data-high-contrast="true"]) body,
html[data-font-color="custom"]:not([data-high-contrast="true"]) body *,
html[data-font-color="custom"]:not([data-high-contrast="true"]) body *::before,
html[data-font-color="custom"]:not([data-high-contrast="true"]) body *::after {
  color: var(--starlight-font-color) !important;
}

html[data-font-color="custom"]:not([data-high-contrast="true"]) input::placeholder,
html[data-font-color="custom"]:not([data-high-contrast="true"]) textarea::placeholder,
html[data-font-color="custom"]:not([data-high-contrast="true"]) .form-control::placeholder {
  color: var(--starlight-font-color) !important;
  opacity: 0.72;
}

html[data-font-color="custom"]:not([data-high-contrast="true"]) .btn,
html[data-font-color="custom"]:not([data-high-contrast="true"]) .badge,
html[data-font-color="custom"]:not([data-high-contrast="true"]) .dropdown-item,
html[data-font-color="custom"]:not([data-high-contrast="true"]) .account-settings-tab,
html[data-font-color="custom"]:not([data-high-contrast="true"]) .form-control,
html[data-font-color="custom"]:not([data-high-contrast="true"]) .form-select,
html[data-font-color="custom"]:not([data-high-contrast="true"]) .input-group-text {
  -webkit-text-fill-color: var(--starlight-font-color);
}

html[data-ui-size] .btn,
html[data-ui-size] .dropdown-toggle,
html[data-ui-size] .account-settings-tab,
html[data-ui-size] .nav-link {
  min-height: calc(2.35rem * var(--starlight-ui-scale));
  padding: calc(0.48rem * var(--starlight-ui-scale)) calc(0.9rem * var(--starlight-ui-scale));
  font-size: calc(0.95rem * var(--starlight-ui-scale));
}

html[data-ui-size] .btn-sm,
html[data-ui-size] .dropdown-item {
  min-height: calc(2rem * var(--starlight-ui-scale));
  padding: calc(0.3rem * var(--starlight-ui-scale)) calc(0.58rem * var(--starlight-ui-scale));
  font-size: calc(0.82rem * var(--starlight-ui-scale));
}

html[data-ui-size] .btn-lg {
  min-height: calc(2.85rem * var(--starlight-ui-scale));
  padding: calc(0.62rem * var(--starlight-ui-scale)) calc(1.12rem * var(--starlight-ui-scale));
  font-size: calc(1rem * var(--starlight-ui-scale));
}

html[data-ui-size] .form-control,
html[data-ui-size] .form-select,
html[data-ui-size] .input-group-text,
html[data-ui-size] textarea {
  min-height: calc(2.65rem * var(--starlight-ui-scale));
  padding: calc(0.48rem * var(--starlight-ui-scale)) calc(0.75rem * var(--starlight-ui-scale));
  font-size: calc(1rem * var(--starlight-ui-scale));
}

html[data-ui-size] .form-control-lg,
html[data-ui-size] .form-select-lg {
  min-height: calc(3rem * var(--starlight-ui-scale));
  padding: calc(0.58rem * var(--starlight-ui-scale)) calc(0.9rem * var(--starlight-ui-scale));
  font-size: calc(1.05rem * var(--starlight-ui-scale));
}

html[data-ui-size] .form-control-sm,
html[data-ui-size] .form-select-sm {
  min-height: calc(2.15rem * var(--starlight-ui-scale));
  padding: calc(0.32rem * var(--starlight-ui-scale)) calc(0.58rem * var(--starlight-ui-scale));
  font-size: calc(0.88rem * var(--starlight-ui-scale));
}

html[data-ui-size] .form-control-color {
  width: calc(3.2rem * var(--starlight-ui-scale));
  padding: calc(0.28rem * var(--starlight-ui-scale));
}

html[data-ui-size] .form-check {
  min-height: calc(1.5rem * var(--starlight-ui-scale));
  padding-left: calc(1.5em * var(--starlight-ui-scale));
}

html[data-ui-size] .form-check-input {
  width: calc(1em * var(--starlight-ui-scale));
  height: calc(1em * var(--starlight-ui-scale));
  margin-left: calc(-1.5em * var(--starlight-ui-scale));
}

html[data-ui-size] .form-switch {
  padding-left: calc(2.5em * var(--starlight-ui-scale));
}

html[data-ui-size] .form-switch .form-check-input {
  width: calc(2em * var(--starlight-ui-scale));
  margin-left: calc(-2.5em * var(--starlight-ui-scale));
}

html[data-ui-size] .dashboard-agent-sandbox-check,
html[data-ui-size] .dashboard-agent-sandbox-platform {
  min-height: calc(2.2rem * var(--starlight-ui-scale));
  padding: calc(0.45rem * var(--starlight-ui-scale)) calc(0.55rem * var(--starlight-ui-scale));
  font-size: calc(0.84rem * var(--starlight-ui-scale));
}

html[data-ui-size] .dashboard-agent-sandbox-check .form-check-input,
html[data-ui-size] .dashboard-agent-sandbox-platform .form-check-input {
  margin-top: 0.16em;
  margin-left: 0;
}

html[data-ui-size] .dashboard-agent-sandbox-context-menu button {
  min-height: calc(2.15rem * var(--starlight-ui-scale));
  padding: calc(0.45rem * var(--starlight-ui-scale)) calc(0.58rem * var(--starlight-ui-scale));
  font-size: calc(0.84rem * var(--starlight-ui-scale));
}

html[data-ui-size] .dashboard-agent-sandbox-toolbox button {
  width: calc(2rem * var(--starlight-ui-scale));
  height: calc(2rem * var(--starlight-ui-scale));
  font-size: calc(1rem * var(--starlight-ui-scale));
}

html[data-ui-size] .theme-toggle {
  min-height: calc(2.65rem * var(--starlight-ui-scale));
  padding: calc(0.34rem * var(--starlight-ui-scale)) calc(0.78rem * var(--starlight-ui-scale));
  font-size: calc(0.86rem * var(--starlight-ui-scale));
}

html[data-ui-size] .theme-toggle-track {
  width: calc(2.9rem * var(--starlight-ui-scale));
  height: calc(1.55rem * var(--starlight-ui-scale));
  padding: calc(0.2rem * var(--starlight-ui-scale));
}

html[data-ui-size] .theme-toggle-orbit {
  width: calc(1.05rem * var(--starlight-ui-scale));
  height: calc(1.05rem * var(--starlight-ui-scale));
}

html[data-ui-size][data-theme="dark"] .theme-toggle-orbit {
  transform: translateX(calc(1.34rem * var(--starlight-ui-scale))) rotate(-18deg);
}

html[data-ui-size] .dropdown-menu {
  font-size: calc(1rem * var(--starlight-ui-scale));
}

html[data-readability="true"] body {
  font-weight: 550;
}

html[data-readability="true"] p,
html[data-readability="true"] li,
html[data-readability="true"] dd,
html[data-readability="true"] dt,
html[data-readability="true"] .form-text,
html[data-readability="true"] .card-text,
html[data-readability="true"] .dashboard-action-copy,
html[data-readability="true"] .planner-calendar-event-meta,
html[data-readability="true"] .small {
  font-weight: 600;
  line-height: 2;
  letter-spacing: 0.015em;
}

html[data-high-contrast="true"] body {
  color: #ffffff;
  background: #000000 !important;
}

html[data-high-contrast="true"] body::before,
html[data-high-contrast="true"] .form-card::before,
html[data-high-contrast="true"] .modal-content::before,
html[data-high-contrast="true"] .terms-hero::before,
html[data-high-contrast="true"] :is(
  [class*="-hero"],
  [class*="-band"],
  [class*="-backdrop"],
  [class*="-starfield"],
  [class*="-nightscape"],
  [class*="-roadmap"],
  [class*="-orbit"],
  [class*="-intro"],
  [class*="-planet"],
  [class*="-ship"],
  [class*="-plume"]
)::before,
html[data-high-contrast="true"] :is(
  [class*="-hero"],
  [class*="-band"],
  [class*="-backdrop"],
  [class*="-starfield"],
  [class*="-nightscape"],
  [class*="-roadmap"],
  [class*="-orbit"],
  [class*="-intro"],
  [class*="-planet"],
  [class*="-ship"],
  [class*="-plume"]
)::after {
  display: none !important;
}

html[data-high-contrast="true"] :is(
  [class*="-shell"],
  [class*="-panel"],
  [class*="-card"],
  [class*="-step"]
)::before,
html[data-high-contrast="true"] :is(
  [class*="-shell"],
  [class*="-panel"],
  [class*="-card"],
  [class*="-step"]
)::after {
  background: #000000 !important;
  background-image: none !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] .app-navbar,
html[data-high-contrast="true"] .app-nav-link,
html[data-high-contrast="true"] .brand-mark,
html[data-high-contrast="true"] .bg-glassy,
html[data-high-contrast="true"] .bg-white,
html[data-high-contrast="true"] .dropdown-menu,
html[data-high-contrast="true"] .alert,
html[data-high-contrast="true"] .performer-info-card,
html[data-high-contrast="true"] .dashboard-search-box,
html[data-high-contrast="true"] .dashboard-search-results,
html[data-high-contrast="true"] .dashboard-search-icon,
html[data-high-contrast="true"] .dashboard-search-shortcut,
html[data-high-contrast="true"] .dashboard-agent-bubble,
html[data-high-contrast="true"] .dashboard-agent-message-user .dashboard-agent-bubble,
html[data-high-contrast="true"] .sti-step,
html[data-high-contrast="true"] .sti-test-mode-option,
html[data-high-contrast="true"] .sti-test-type-option,
html[data-high-contrast="true"] .collab-option-icon,
html[data-high-contrast="true"] :is(
  [class*="-hero"],
  [class*="-band"],
  [class*="-backdrop"],
  [class*="-starfield"],
  [class*="-nightscape"],
  [class*="-roadmap"],
  [class*="-shell"],
  [class*="-panel"],
  [class*="-card"],
  [class*="-step"],
  [class*="-option"],
  [class*="-choice"],
  [class*="-item"],
  [class*="-summary"],
  [class*="-bar"],
  [class*="-box"],
  [class*="-tile"],
  [class*="-metric"],
  [class*="-search"],
  [class*="-result"],
  [class*="-number"],
  [class*="-icon"],
  [class*="-mark"],
  [class*="-avatar"],
  [class*="-chip"],
  [class*="-pill"],
  [class*="-badge"],
  [class*="-orbit"],
  [class*="-month"],
  [class*="-day"],
  [class*="-event"],
  [class*="-field"],
  [class*="-kicker"],
  [class*="-stage"],
  [class*="-mission"],
  [class*="-progress"],
  [class*="-node"],
  [class*="-intro"],
  [class*="-planet"],
  [class*="-ship"],
  [class*="-send"],
  [class*="-envelope"],
  [class*="-complete"],
  [class*="-pad"],
  [class*="-window"],
  [class*="-plume"]
) {
  color: #ffffff !important;
  background: #000000 !important;
  background-image: none !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] input[type="file"]::file-selector-button,
html[data-high-contrast="true"] .form-control[type="file"]::file-selector-button,
html[data-high-contrast="true"] .invite-file-input::file-selector-button {
  color: #ffffff !important;
  background: #000000 !important;
  background-image: none !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

html[data-high-contrast="true"] input[type="file"]::-webkit-file-upload-button,
html[data-high-contrast="true"] .form-control[type="file"]::-webkit-file-upload-button,
html[data-high-contrast="true"] .invite-file-input::-webkit-file-upload-button {
  color: #ffffff !important;
  background: #000000 !important;
  background-image: none !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

html[data-high-contrast="true"] .performer-info-card.performer-needs-onboarding,
html[data-high-contrast="true"] .performer-info-card.performer-needs-changes,
html[data-high-contrast="true"] .performer-onboarding-alert,
html[data-high-contrast="true"] .performer-change-alert,
html[data-high-contrast="true"] .todo-item-priority,
html[data-high-contrast="true"] .todo-priority-badge,
html[data-high-contrast="true"] .onboarding-edit-section-icon,
html[data-high-contrast="true"] .onboarding-status-pill,
html[data-high-contrast="true"] .onboarding-inline-panel {
  color: #ffffff !important;
  background: #000000 !important;
  background-image: none !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-list-tab,
html[data-high-contrast="true"] .dashboard-agent-sandbox-upcoming-count,
html[data-high-contrast="true"] .dashboard-agent-sandbox-queue-status {
  color: #ffffff !important;
  background: #000000 !important;
  background-image: none !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] .card,
html[data-high-contrast="true"] .form-card,
html[data-high-contrast="true"] .bg-light,
html[data-high-contrast="true"] .modal-content,
html[data-high-contrast="true"] .list-group-item,
html[data-high-contrast="true"] .table,
html[data-high-contrast="true"] .account-settings-tabs,
html[data-high-contrast="true"] .account-settings-search-box,
html[data-high-contrast="true"] .account-settings-search-results,
html[data-high-contrast="true"] .accessibility-settings-panel,
html[data-high-contrast="true"] .accessibility-control,
html[data-high-contrast="true"] .accessibility-toggle-list,
html[data-high-contrast="true"] .telegram-step,
html[data-high-contrast="true"] .passkey-register-panel,
html[data-high-contrast="true"] .passkey-list-item,
html[data-high-contrast="true"] .authenticator-setup-box,
html[data-high-contrast="true"] .dashboard-action-card,
html[data-high-contrast="true"] .todo-item,
html[data-high-contrast="true"] .performer-detail-list,
html[data-high-contrast="true"] .planner-month,
html[data-high-contrast="true"] .planner-month-header,
html[data-high-contrast="true"] .planner-weekdays,
html[data-high-contrast="true"] .planner-month-grid,
html[data-high-contrast="true"] .planner-day-cell,
html[data-high-contrast="true"] .planner-day-heading,
html[data-high-contrast="true"] .planner-day-number,
html[data-high-contrast="true"] .planner-calendar-event,
html[data-high-contrast="true"] .planner-calendar-sync,
html[data-high-contrast="true"] .planner-payment-pill,
html[data-high-contrast="true"] .planner-followup-pill,
html[data-high-contrast="true"] .planner-calendar-reminder,
html[data-high-contrast="true"] .planner-mobile-empty,
html[data-high-contrast="true"] .support-empty,
html[data-high-contrast="true"] .academy-promo,
html[data-high-contrast="true"] .academy-empty,
html[data-high-contrast="true"] .academy-section,
html[data-high-contrast="true"] .academy-chapter,
html[data-high-contrast="true"] .academy-video,
html[data-high-contrast="true"] .academy-video-number,
html[data-high-contrast="true"] .dashboard-agent-page,
html[data-high-contrast="true"] .dashboard-agent-tabs,
html[data-high-contrast="true"] .dashboard-agent-tab,
html[data-high-contrast="true"] .dashboard-agent-chat,
html[data-high-contrast="true"] .dashboard-agent-panel,
html[data-high-contrast="true"] .dashboard-agent-summary,
html[data-high-contrast="true"] .dashboard-agent-sandbox-sidebar,
html[data-high-contrast="true"] .dashboard-agent-sandbox-stage,
html[data-high-contrast="true"] .dashboard-agent-sandbox-inspector,
html[data-high-contrast="true"] .dashboard-agent-sandbox-canvas,
html[data-high-contrast="true"] .dashboard-agent-sandbox-palette-block,
html[data-high-contrast="true"] .dashboard-agent-sandbox-saved-item,
html[data-high-contrast="true"] .dashboard-agent-sandbox-run-log,
html[data-high-contrast="true"] .dashboard-agent-sandbox-undo-toast,
html[data-high-contrast="true"] .dashboard-agent-sandbox-quick-start-card,
html[data-high-contrast="true"] .dashboard-agent-sandbox-template-card,
html[data-high-contrast="true"] .dashboard-agent-sandbox-quick-start-grid section,
html[data-high-contrast="true"] .dashboard-agent-sandbox-template-choice,
html[data-high-contrast="true"] .dashboard-agent-sandbox-template-option,
html[data-high-contrast="true"] .dashboard-agent-sandbox-context-menu,
html[data-high-contrast="true"] .dashboard-agent-sandbox-context-menu button,
html[data-high-contrast="true"] .dashboard-agent-sandbox-toolbox,
html[data-high-contrast="true"] .dashboard-agent-sandbox-toolbox button,
html[data-high-contrast="true"] .dashboard-agent-sandbox-check,
html[data-high-contrast="true"] .dashboard-agent-sandbox-platform,
html[data-high-contrast="true"] .dashboard-agent-session-bar,
html[data-high-contrast="true"] .dashboard-agent-chat-workbench,
html[data-high-contrast="true"] .dashboard-agent-chat-workbench .dashboard-agent-panel,
html[data-high-contrast="true"] .dashboard-agent-chat-workbench .dashboard-agent-summary,
html[data-high-contrast="true"] .dashboard-agent-response-panel,
html[data-high-contrast="true"] .dashboard-agent-followup,
html[data-high-contrast="true"] .dashboard-agent-workflow-step,
html[data-high-contrast="true"] .dashboard-agent-input-reminder,
html[data-high-contrast="true"] .dashboard-agent-quick-option,
html[data-high-contrast="true"] .dashboard-agent-artifact-link,
html[data-high-contrast="true"] .dashboard-agent-handoff-panel,
html[data-high-contrast="true"] .contract-assistant-bubble,
html[data-high-contrast="true"] .contract-assistant-message-user .contract-assistant-bubble,
html[data-high-contrast="true"] .contract-assistant-message-input,
html[data-high-contrast="true"] .contract-assistant-avatar,
html[data-high-contrast="true"] .contract-assistant-send,
html[data-high-contrast="true"] .theme-toggle,
html[data-high-contrast="true"] .theme-toggle-track,
html[data-high-contrast="true"] .theme-toggle-orbit {
  color: #ffffff !important;
  background: #000000 !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] h1,
html[data-high-contrast="true"] h2,
html[data-high-contrast="true"] h3,
html[data-high-contrast="true"] h4,
html[data-high-contrast="true"] h5,
html[data-high-contrast="true"] h6,
html[data-high-contrast="true"] p,
html[data-high-contrast="true"] li,
html[data-high-contrast="true"] dd,
html[data-high-contrast="true"] dt,
html[data-high-contrast="true"] label,
html[data-high-contrast="true"] .text-dark,
html[data-high-contrast="true"] .text-muted,
html[data-high-contrast="true"] .form-text,
html[data-high-contrast="true"] .card-text,
html[data-high-contrast="true"] .small,
html[data-high-contrast="true"] .accessibility-control-header,
html[data-high-contrast="true"] .account-settings-search-input,
html[data-high-contrast="true"] .dashboard-agent-hero,
html[data-high-contrast="true"] .dashboard-agent-hero p,
html[data-high-contrast="true"] .dashboard-agent-kicker,
html[data-high-contrast="true"] .dashboard-agent-session-bar strong,
html[data-high-contrast="true"] .dashboard-agent-session-label,
html[data-high-contrast="true"] .dashboard-agent-panel-kicker,
html[data-high-contrast="true"] .dashboard-agent-response-kicker,
html[data-high-contrast="true"] .dashboard-agent-followup-label,
html[data-high-contrast="true"] .dashboard-agent-followup-question,
html[data-high-contrast="true"] .dashboard-agent-status,
html[data-high-contrast="true"] .dashboard-agent-progress-item,
html[data-high-contrast="true"] .dashboard-agent-workflow-intro,
html[data-high-contrast="true"] .dashboard-agent-empty,
html[data-high-contrast="true"] .dashboard-agent-workflow-copy strong,
html[data-high-contrast="true"] .dashboard-agent-workflow-copy small,
html[data-high-contrast="true"] .dashboard-agent-sandbox-template-heading p,
html[data-high-contrast="true"] .dashboard-agent-sandbox-template-copy span,
html[data-high-contrast="true"] .dashboard-agent-sandbox-template-choice strong,
html[data-high-contrast="true"] .dashboard-agent-sandbox-template-choice small,
html[data-high-contrast="true"] .dashboard-agent-sandbox-template-option strong,
html[data-high-contrast="true"] .dashboard-agent-sandbox-template-copy small,
html[data-high-contrast="true"] .dashboard-agent-chat-summary,
html[data-high-contrast="true"] .dashboard-agent-bubble-text,
html[data-high-contrast="true"] .dashboard-agent-followup *,
html[data-high-contrast="true"] .contract-assistant-bubble,
html[data-high-contrast="true"] .contract-assistant-message-input,
html[data-high-contrast="true"] .contract-assistant-message-input::placeholder,
html[data-high-contrast="true"] .theme-toggle-label {
  color: #ffffff !important;
}

html[data-high-contrast="true"] a:not(.btn) {
  color: #ffff66 !important;
  text-decoration: underline;
}

html[data-high-contrast="true"] .btn,
html[data-high-contrast="true"] .account-settings-tab {
  color: #ffffff !important;
  background: #000000 !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] .btn-primary,
html[data-high-contrast="true"] .btn:hover,
html[data-high-contrast="true"] .btn:focus,
html[data-high-contrast="true"] .contract-assistant-send:hover:not(:disabled),
html[data-high-contrast="true"] .contract-assistant-send:focus-visible:not(:disabled),
html[data-high-contrast="true"] .account-settings-tab-active,
html[data-high-contrast="true"] .account-settings-tab:hover,
html[data-high-contrast="true"] .account-settings-tab:focus {
  color: #000000 !important;
  background: #ffffff !important;
  border-color: #ffffff !important;
}

html[data-high-contrast="true"] .contract-assistant-send:not(:disabled) {
  color: #000000 !important;
  background: #ffffff !important;
  border-color: #ffffff !important;
}

html[data-high-contrast="true"] .account-settings-tab.account-settings-tab-active,
html[data-high-contrast="true"] .account-settings-tab.account-settings-tab-active:hover,
html[data-high-contrast="true"] .account-settings-tab.account-settings-tab-active:focus,
html[data-high-contrast="true"] .account-settings-search-result[aria-selected="true"],
html[data-high-contrast="true"] .dashboard-search-result[aria-selected="true"],
html[data-high-contrast="true"] .dashboard-agent-quick-option-selected,
html[data-high-contrast="true"] .dashboard-agent-tab-active,
html[data-high-contrast="true"] .collab-performer-option-selected,
html[data-high-contrast="true"] .collab-activity-option-selected,
html[data-high-contrast="true"] .sti-test-option-selected {
  color: #000000 !important;
  text-decoration: none !important;
  background: #00e5ff !important;
  border-color: #ffffff !important;
  box-shadow:
    0 0 0 2px #000000,
    0 0 0 5px #ffffff !important;
}

html[data-high-contrast="true"] .account-settings-search-result[aria-selected="true"] *,
html[data-high-contrast="true"] .dashboard-search-result[aria-selected="true"] *,
html[data-high-contrast="true"] .dashboard-agent-quick-option-selected *,
html[data-high-contrast="true"] .collab-performer-option-selected *,
html[data-high-contrast="true"] .collab-activity-option-selected *,
html[data-high-contrast="true"] .sti-test-option-selected * {
  color: #000000 !important;
}

html[data-high-contrast="true"] .dashboard-agent-messages,
html[data-high-contrast="true"] .contract-assistant-messages,
html[data-high-contrast="true"] .dashboard-agent-sandbox .dashboard-agent-sandbox-inspector,
html[data-high-contrast="true"] .dashboard-agent-sandbox .dashboard-agent-sandbox-palette,
html[data-high-contrast="true"] .dashboard-agent-sandbox .dashboard-agent-sandbox-context-menu,
html[data-high-contrast="true"] .dashboard-agent-sandbox-context-menu,
html[data-high-contrast="true"] .dashboard-agent-sandbox-quick-start-card,
html[data-high-contrast="true"] .dashboard-agent-sandbox-template-card,
html[data-high-contrast="true"] .dashboard-agent-sandbox .dashboard-agent-sandbox-node-detail,
html[data-high-contrast="true"] .dashboard-agent-sandbox .dashboard-agent-sandbox-field textarea,
html[data-high-contrast="true"] .dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-control,
html[data-high-contrast="true"] .dashboard-agent-sandbox .dashboard-agent-sandbox-field .form-select {
  background: #000000 !important;
  border-color: #ffffff !important;
  scrollbar-color: #ffffff #000000 !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-variable-editor:empty::before {
  color: #d1d5db !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-variable-entity {
  color: #000000 !important;
  background: #00e5ff !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-quick-start {
  background: rgba(0, 0, 0, 0.86) !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-template-chooser {
  background: rgba(0, 0, 0, 0.86) !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-hotkey,
html[data-high-contrast="true"] .dashboard-agent-sandbox-template-icon {
  color: #000000 !important;
  background: #00e5ff !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-field input[type="date"],
html[data-high-contrast="true"] .dashboard-agent-sandbox-field input[type="time"] {
  color-scheme: dark;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-field input[type="date"]::-webkit-calendar-picker-indicator,
html[data-high-contrast="true"] .dashboard-agent-sandbox-field input[type="time"]::-webkit-calendar-picker-indicator {
  opacity: 1 !important;
  filter: invert(1) contrast(1.35) !important;
}

html[data-high-contrast="true"] .dashboard-agent-workflow-step-active,
html[data-high-contrast="true"] .dashboard-agent-workflow-step-done,
html[data-high-contrast="true"] .dashboard-agent-workflow-status,
html[data-high-contrast="true"] .dashboard-agent-workflow-number {
  color: #ffffff !important;
  background: #000000 !important;
  border-color: #ffffff !important;
}

html[data-high-contrast="true"] .dashboard-agent-workflow-step:not(:last-child)::after,
html[data-high-contrast="true"] .dashboard-agent-workflow-step:not(:last-child)::before {
  background: #ffffff !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-link {
  stroke: #ffffff !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-link-preview {
  stroke: #00e5ff !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-link-label {
  fill: #00e5ff !important;
  stroke: #000000 !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-links marker path {
  fill: #ffffff !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-links .dashboard-agent-sandbox-preview-marker path {
  fill: #00e5ff !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-selection-box {
  background: rgba(0, 229, 255, 0.18) !important;
  border-color: #00e5ff !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-node-connect-target {
  border-color: #00e5ff !important;
  box-shadow: 0 0 0 4px #00e5ff !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-node-error {
  border-color: #ff6666 !important;
  box-shadow: 0 0 0 4px #ff6666 !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-node-caution {
  border-color: #ffd400 !important;
  box-shadow: 0 0 0 4px #ffd400 !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-node:focus-visible::after,
html[data-high-contrast="true"] .dashboard-agent-sandbox-node-selected::after {
  border-color: #00e5ff !important;
  box-shadow:
    0 0 0 3px #000000,
    0 0 0 7px #ffffff !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-node-caution-icon {
  color: #000000 !important;
  background: #ffd400 !important;
  border-color: #ffffff !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-tool-active,
html[data-high-contrast="true"] .dashboard-agent-sandbox-toolbox button:hover,
html[data-high-contrast="true"] .dashboard-agent-sandbox-toolbox button:focus-visible {
  color: #000000 !important;
  background: #ffffff !important;
  border-color: #ffffff !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-node-resize {
  background: #ffffff !important;
  border: 2px solid #000000 !important;
}

html[data-high-contrast="true"] .dashboard-agent-sandbox-purpose {
  color: #ffffff !important;
  background: #000000 !important;
  border-color: #ffffff !important;
}

html[data-high-contrast="true"] .contract-bot-antenna {
  stroke: #ffffff !important;
}

html[data-high-contrast="true"] .contract-bot-eye,
html[data-high-contrast="true"] .contract-assistant-typing-bubble span {
  fill: #ffffff !important;
  background: #ffffff !important;
}

html[data-high-contrast="true"] .form-check-input:checked,
html[data-high-contrast="true"] .form-switch .form-check-input:checked {
  background-color: #00e5ff !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23000000' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e") !important;
  border-color: #ffffff !important;
  box-shadow:
    0 0 0 2px #000000,
    0 0 0 5px #ffffff !important;
}

html[data-high-contrast="true"] .form-switch .form-check-input:checked {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23000000'/%3e%3c/svg%3e") !important;
}

html[data-high-contrast="true"] .form-control,
html[data-high-contrast="true"] .form-select,
html[data-high-contrast="true"] textarea,
html[data-high-contrast="true"] .input-group-text {
  color: #ffffff !important;
  background: #000000 !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] .form-control::placeholder {
  color: #d1d5db !important;
}

/* Studio Portal */
.studio-body {
  --studio-surface: rgba(15, 23, 42, 0.84);
  --studio-surface-strong: rgba(8, 47, 73, 0.72);
  --studio-surface-soft: rgba(2, 6, 23, 0.5);
  --studio-border: rgba(125, 211, 252, 0.24);
  --studio-border-strong: rgba(103, 232, 249, 0.46);
  --studio-text: #f8fafc;
  --studio-text-soft: rgba(224, 242, 254, 0.78);
  --studio-text-muted: rgba(186, 230, 253, 0.62);
  --studio-blue: #38bdf8;
  --studio-cyan: #67e8f9;
  --studio-teal: #2dd4bf;
  --studio-success: #4ade80;
  --studio-warning: #fbbf24;
  --studio-danger: #f87171;
  position: relative;
  isolation: isolate;
  min-height: 100vh;
  color: var(--studio-text);
  color-scheme: dark;
  background:
    linear-gradient(90deg, rgba(125, 211, 252, 0.06) 1px, transparent 1px),
    linear-gradient(0deg, rgba(94, 234, 212, 0.045) 1px, transparent 1px),
    radial-gradient(circle at 12% 10%, rgba(56, 189, 248, 0.24), transparent 28%),
    radial-gradient(circle at 86% 18%, rgba(45, 212, 191, 0.16), transparent 30%),
    radial-gradient(circle at 48% 96%, rgba(14, 165, 233, 0.12), transparent 36%),
    linear-gradient(180deg, #020617 0%, #07111f 48%, #020617 100%);
  background-size:
    48px 48px,
    48px 48px,
    auto,
    auto,
    auto,
    auto;
}

.studio-body::before {
  position: fixed;
  inset: 0;
  z-index: -1;
  display: block;
  pointer-events: none;
  content: "";
  background:
    radial-gradient(circle at 8% 18%, rgba(255, 255, 255, 0.34) 0 1px, transparent 1.4px),
    radial-gradient(circle at 74% 12%, rgba(125, 211, 252, 0.3) 0 1px, transparent 1.4px),
    radial-gradient(circle at 88% 64%, rgba(94, 234, 212, 0.22) 0 1px, transparent 1.4px),
    radial-gradient(circle at 28% 82%, rgba(255, 255, 255, 0.22) 0 1px, transparent 1.4px),
    linear-gradient(115deg, transparent 0 36%, rgba(56, 189, 248, 0.08) 48%, transparent 62%);
  background-size:
    420px 360px,
    390px 340px,
    460px 390px,
    360px 310px,
    auto;
  opacity: 0.74;
}

.studio-body a {
  color: var(--studio-cyan);
  text-decoration-color: rgba(103, 232, 249, 0.34);
  text-underline-offset: 0.18em;
}

.studio-body a:hover,
.studio-body a:focus-visible {
  color: #e0f2fe;
}

.studio-shell {
  display: grid;
  grid-template-columns: 17.5rem minmax(0, 1fr);
  min-height: 100vh;
}

.studio-auth-shell {
  position: relative;
  isolation: isolate;
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding: clamp(1rem, 3vw, 2.5rem);
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(2, 6, 23, 0.9), rgba(3, 7, 18, 0.97)),
    linear-gradient(90deg, rgba(125, 211, 252, 0.07) 1px, transparent 1px),
    linear-gradient(0deg, rgba(45, 212, 191, 0.055) 1px, transparent 1px),
    radial-gradient(circle at 8% 16%, rgba(255, 255, 255, 0.34) 0 1px, transparent 1.5px),
    radial-gradient(circle at 76% 10%, rgba(125, 211, 252, 0.3) 0 1px, transparent 1.5px),
    radial-gradient(circle at 86% 72%, rgba(94, 234, 212, 0.24) 0 1px, transparent 1.5px),
    #020617;
  background-size:
    auto,
    46px 46px,
    46px 46px,
    380px 320px,
    420px 360px,
    460px 390px,
    auto;
}

.studio-auth-shell::before {
  position: absolute;
  inset: -20% -10%;
  z-index: -1;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(118deg, transparent 0 32%, rgba(56, 189, 248, 0.09) 44%, transparent 58%),
    linear-gradient(22deg, transparent 0 58%, rgba(45, 212, 191, 0.08) 70%, transparent 82%);
  opacity: 0.9;
}

.studio-auth-shell > * {
  position: relative;
  z-index: 1;
}

.studio-auth-shell .studio-main {
  width: min(100%, 1280px);
  max-width: calc(100vw - 2.5rem);
  padding: 0;
}

.studio-auth-shell .studio-auth-panel {
  margin: 0 auto;
}

.studio-auth-shell .studio-login-panel {
  position: relative;
  overflow: hidden;
  padding: clamp(1.15rem, 3vw, 1.35rem);
  color: #e2e8f0;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.92), rgba(8, 47, 73, 0.68) 58%, rgba(2, 6, 23, 0.94)),
    rgba(2, 6, 23, 0.88);
  border: 1px solid rgba(125, 211, 252, 0.28);
  box-shadow:
    0 28px 72px rgba(2, 6, 23, 0.48),
    0 0 34px rgba(45, 212, 191, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.studio-auth-shell .studio-login-panel::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(90deg, rgba(125, 211, 252, 0.08) 1px, transparent 1px),
    linear-gradient(0deg, rgba(94, 234, 212, 0.06) 1px, transparent 1px),
    linear-gradient(110deg, transparent 0%, rgba(186, 230, 253, 0.12) 42%, transparent 68%);
  background-position:
    0 0,
    0 0,
    110% 0;
  background-size:
    42px 42px,
    42px 42px,
    220% 100%;
  opacity: 0.44;
}

.studio-auth-shell .studio-login-panel > * {
  position: relative;
  z-index: 1;
}

.studio-auth-shell .studio-login-panel .studio-auth-brand {
  margin-bottom: 0.75rem;
  color: #bae6fd;
}

.studio-auth-shell .studio-login-panel .studio-auth-brand img {
  filter: drop-shadow(0 0 14px rgba(103, 232, 249, 0.34));
}

.studio-auth-shell .studio-login-panel h1 {
  margin-bottom: 0.85rem;
  color: #ffffff;
  font-size: 1.68rem;
}

.studio-auth-shell .studio-login-panel .studio-form {
  gap: 0.72rem;
}

.studio-auth-shell .studio-login-panel .studio-sso-form {
  margin-bottom: 0.8rem;
}

.studio-auth-shell .studio-login-panel .studio-login-auth-divider {
  margin-bottom: 0.8rem;
  color: rgba(186, 230, 253, 0.76);
}

.studio-auth-shell .studio-login-panel .studio-form label {
  gap: 0.28rem;
}

.studio-auth-shell .studio-login-panel .studio-form label > span {
  color: rgba(186, 230, 253, 0.9);
  font-weight: 850;
}

.studio-auth-shell .studio-login-panel .form-control {
  min-height: 2.45rem;
  color: #f8fafc;
  color-scheme: dark;
  background: rgba(2, 6, 23, 0.6);
  border-color: rgba(125, 211, 252, 0.3);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.studio-auth-shell .studio-login-panel .form-control:hover {
  border-color: rgba(103, 232, 249, 0.5);
}

.studio-auth-shell .studio-login-panel .form-control:focus {
  color: #ffffff;
  background: rgba(2, 6, 23, 0.78);
  border-color: #67e8f9;
  box-shadow:
    0 0 0 0.2rem rgba(103, 232, 249, 0.14),
    0 0 24px rgba(45, 212, 191, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-auth-shell .studio-login-panel .btn-primary {
  min-height: 2.95rem;
  margin-top: 0.1rem;
  color: #031525;
  background:
    linear-gradient(135deg, #e0f2fe 0%, #67e8f9 46%, #2dd4bf 100%),
    #67e8f9;
  border: 1px solid rgba(224, 242, 254, 0.78);
  box-shadow:
    0 18px 42px rgba(45, 212, 191, 0.22),
    0 0 26px rgba(103, 232, 249, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.studio-auth-shell .studio-login-panel .btn-primary:hover,
.studio-auth-shell .studio-login-panel .btn-primary:focus {
  color: #020617;
  background:
    linear-gradient(135deg, #f0f9ff 0%, #7dd3fc 42%, #5eead4 100%),
    #7dd3fc;
  border-color: rgba(240, 249, 255, 0.9);
  box-shadow:
    0 22px 52px rgba(45, 212, 191, 0.28),
    0 0 34px rgba(103, 232, 249, 0.26),
    inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.studio-auth-shell .studio-login-panel .btn-microsoft-auth {
  min-height: 2.95rem;
  color: #0f172a;
  background: #ffffff;
  border-color: rgba(224, 242, 254, 0.82);
  box-shadow:
    0 18px 38px rgba(15, 23, 42, 0.22),
    0 0 22px rgba(125, 211, 252, 0.16);
}

.studio-auth-shell .studio-login-panel .btn-microsoft-auth:hover,
.studio-auth-shell .studio-login-panel .btn-microsoft-auth:focus {
  color: #020617;
  background: #f8fafc;
  border-color: rgba(255, 255, 255, 0.95);
}

.studio-sidebar {
  position: sticky;
  top: 0;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  height: 100vh;
  padding: 1.1rem;
  color: var(--studio-text);
  background:
    linear-gradient(180deg, rgba(15, 23, 42, 0.96), rgba(2, 6, 23, 0.94)),
    radial-gradient(circle at 20% 0%, rgba(56, 189, 248, 0.2), transparent 32%),
    rgba(2, 6, 23, 0.94);
  border-right: 1px solid var(--studio-border);
  box-shadow:
    18px 0 42px rgba(2, 6, 23, 0.34),
    inset -1px 0 0 rgba(255, 255, 255, 0.03);
}

.studio-brand {
  display: grid;
  grid-template-columns: 2.35rem minmax(0, 1fr);
  gap: 0.75rem;
  align-items: center;
  color: #ffffff !important;
  text-decoration: none;
}

.studio-brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  background:
    linear-gradient(135deg, rgba(224, 242, 254, 0.14), rgba(14, 165, 233, 0.18)),
    rgba(2, 6, 23, 0.55);
  border: 1px solid rgba(125, 211, 252, 0.32);
  border-radius: 8px;
  box-shadow:
    0 0 24px rgba(56, 189, 248, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.studio-brand-mark img {
  width: 1.45rem;
  height: 1.45rem;
  filter: drop-shadow(0 0 12px rgba(103, 232, 249, 0.42));
}

.studio-brand-mark img.studio-brand-custom-logo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 6px;
  filter: none;
}

.studio-brand strong,
.studio-brand small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.studio-brand strong {
  font-size: 0.98rem;
  line-height: 1.15;
}

.studio-brand small {
  color: var(--studio-text-muted);
  font-size: 0.78rem;
}

.studio-nav {
  display: grid;
  gap: 0.28rem;
}

.studio-nav a {
  display: flex;
  align-items: center;
  min-height: 2.35rem;
  padding: 0.55rem 0.7rem;
  color: var(--studio-text-soft);
  font-size: 0.92rem;
  font-weight: 750;
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: 8px;
  transition:
    color 0.16s ease,
    background-color 0.16s ease,
    border-color 0.16s ease,
    box-shadow 0.16s ease;
}

.studio-nav a:hover,
.studio-nav a:focus,
.studio-nav a.active {
  color: #ffffff;
  background:
    linear-gradient(90deg, rgba(56, 189, 248, 0.18), rgba(45, 212, 191, 0.08)),
    rgba(15, 23, 42, 0.64);
  border-color: rgba(125, 211, 252, 0.3);
  box-shadow:
    0 0 22px rgba(56, 189, 248, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-main {
  min-width: 0;
  padding: 1.25rem;
}

.studio-topbar {
  display: flex;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
  max-width: 1280px;
  margin: 0 auto 1rem;
  padding: 0.95rem 1rem;
  color: var(--studio-text);
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.9), rgba(8, 47, 73, 0.58)),
    rgba(2, 6, 23, 0.7);
  border: 1px solid var(--studio-border);
  border-radius: 8px;
  box-shadow:
    0 20px 54px rgba(2, 6, 23, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-topbar h1 {
  margin: 0;
  color: #ffffff;
  font-size: 1.25rem;
  font-weight: 850;
  line-height: 1.2;
}

.studio-topbar p {
  margin: 0.15rem 0 0;
  color: var(--studio-text-muted);
  font-size: 0.9rem;
}

.studio-topbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
}

.studio-credit-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
  min-width: 0;
}

.studio-credit-pill {
  display: grid;
  grid-template-columns: 2.15rem minmax(0, 1fr);
  gap: 0.58rem;
  align-items: center;
  min-height: 2.7rem;
  min-width: 9.4rem;
  padding: 0.42rem 0.72rem 0.42rem 0.5rem;
  color: var(--studio-text);
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.84), rgba(8, 47, 73, 0.46)),
    rgba(2, 6, 23, 0.62);
  border: 1px solid rgba(125, 211, 252, 0.26);
  border-radius: 8px;
  box-shadow:
    0 12px 26px rgba(2, 6, 23, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-credit-pill-icon,
.studio-credit-panel-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.studio-credit-pill-icon {
  width: 2.15rem;
  height: 2.15rem;
  color: #031525;
  background:
    linear-gradient(135deg, #e0f2fe 0%, var(--studio-cyan) 50%, var(--studio-teal) 100%),
    var(--studio-cyan);
  border: 1px solid rgba(224, 242, 254, 0.68);
  border-radius: 8px;
  box-shadow:
    0 0 20px rgba(103, 232, 249, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.58);
}

.studio-credit-pill-testing .studio-credit-pill-icon {
  background:
    linear-gradient(135deg, #ccfbf1 0%, #5eead4 50%, #38bdf8 100%),
    var(--studio-teal);
}

.studio-credit-pill-icon svg,
.studio-credit-panel-icon svg {
  width: 1.1rem;
  height: 1.1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.studio-credit-pill-copy,
.studio-credit-pill small,
.studio-credit-pill strong {
  display: block;
  min-width: 0;
}

.studio-credit-pill-copy {
  display: grid;
  gap: 0.08rem;
}

.studio-credit-pill small {
  color: rgba(186, 230, 253, 0.78);
  font-size: 0.64rem;
  font-weight: 850;
  line-height: 1.05;
  text-transform: uppercase;
  white-space: nowrap;
}

.studio-credit-pill strong {
  color: #ffffff;
  font-size: 1.18rem;
  font-weight: 900;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.studio-page,
.studio-onboarding {
  display: grid;
  gap: 1rem;
  max-width: 1280px;
  margin: 0 auto;
}

.studio-page-heading {
  display: grid;
  gap: 0.25rem;
}

.studio-heading-row {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
}

.studio-page-heading span:not(.studio-status) {
  color: var(--studio-cyan);
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.studio-page-heading h1,
.studio-page-heading h2 {
  margin: 0;
  color: #ffffff;
  font-size: 1.65rem;
  font-weight: 900;
  line-height: 1.1;
}

.studio-panel,
.studio-auth-panel,
.studio-metric,
.studio-production-card,
.studio-production-finance-card {
  color: var(--studio-text);
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.86), rgba(8, 47, 73, 0.48)),
    rgba(2, 6, 23, 0.72);
  border: 1px solid var(--studio-border);
  border-radius: 8px;
  box-shadow:
    0 22px 58px rgba(2, 6, 23, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-panel {
  position: relative;
  overflow: hidden;
  padding: 1rem;
}

.studio-panel h2 {
  margin: 0 0 0.85rem;
  color: #ffffff;
  font-size: 1rem;
  font-weight: 850;
}

.studio-panel-heading {
  display: flex;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.85rem;
}

.studio-panel-heading h2 {
  margin: 0;
}

.studio-panel-heading a {
  color: var(--studio-cyan);
  font-size: 0.86rem;
  font-weight: 800;
}

.studio-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
}

.studio-score-hero {
  --health-primary: var(--studio-cyan);
  --health-secondary: var(--studio-blue);
  --health-glow: rgba(56, 189, 248, 0.26);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem;
  align-items: center;
  padding: 1rem;
  color: var(--studio-text);
  background:
    linear-gradient(135deg, rgba(8, 47, 73, 0.86), rgba(15, 23, 42, 0.86)),
    radial-gradient(circle at 96% 0%, rgba(103, 232, 249, 0.16), transparent 32%),
    rgba(2, 6, 23, 0.78);
  border: 1px solid rgba(103, 232, 249, 0.3);
  border-radius: 8px;
  box-shadow:
    0 24px 64px rgba(2, 6, 23, 0.34),
    0 0 34px rgba(56, 189, 248, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.studio-score-hero-excellent {
  --health-primary: var(--studio-success);
  --health-secondary: var(--studio-teal);
  --health-glow: rgba(74, 222, 128, 0.3);
}

.studio-score-hero-strong {
  --health-primary: var(--studio-cyan);
  --health-secondary: var(--studio-blue);
  --health-glow: rgba(103, 232, 249, 0.28);
}

.studio-score-hero-watch {
  --health-primary: var(--studio-warning);
  --health-secondary: #facc15;
  --health-glow: rgba(251, 191, 36, 0.28);
}

.studio-score-hero-risk {
  --health-primary: #fb923c;
  --health-secondary: var(--studio-warning);
  --health-glow: rgba(251, 146, 60, 0.3);
}

.studio-score-hero-critical {
  --health-primary: var(--studio-danger);
  --health-secondary: #fb7185;
  --health-glow: rgba(248, 113, 113, 0.32);
}

.studio-score-kicker {
  display: block;
  margin-bottom: 0.15rem;
  color: var(--health-primary);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.studio-score-hero h3 {
  margin: 0 0 0.25rem;
  color: #ffffff;
  font-size: 1.55rem;
  font-weight: 950;
}

.studio-score-hero p {
  max-width: 62rem;
  margin: 0 0 0.45rem;
  color: var(--studio-text-soft);
}

.studio-compliance-state {
  font-size: 0.98rem;
}

.studio-compliance-state strong {
  color: #ffffff;
  font-weight: 900;
}

.studio-compliance-riskline {
  font-size: 0.9rem;
}

.studio-compliance-emblem {
  position: relative;
  width: 7rem;
  height: 7rem;
  overflow: hidden;
  background:
    radial-gradient(circle at 64% 32%, rgba(255, 255, 255, 0.18), transparent 0.23rem),
    radial-gradient(circle at 24% 26%, rgba(255, 255, 255, 0.14), transparent 0.13rem),
    radial-gradient(circle at 74% 76%, rgba(255, 255, 255, 0.12), transparent 0.11rem),
    radial-gradient(circle at 50% 52%, rgba(15, 23, 42, 0.2), rgba(2, 6, 23, 0.92) 68%);
  border: 1px solid rgba(125, 211, 252, 0.36);
  border-radius: 999px;
  box-shadow:
    0 0 34px var(--health-glow),
    inset 0 0 24px rgba(2, 6, 23, 0.78);
}

.studio-compliance-emblem::before {
  position: absolute;
  inset: 0.65rem;
  content: "";
  background:
    radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.32), transparent 0.1rem),
    radial-gradient(circle at 68% 28%, rgba(255, 255, 255, 0.24), transparent 0.08rem),
    radial-gradient(circle at 42% 76%, rgba(255, 255, 255, 0.18), transparent 0.07rem);
  border-radius: inherit;
}

.studio-compliance-orbit {
  position: absolute;
  inset: 1.35rem 0.75rem;
  border: 1px solid var(--health-primary);
  border-radius: 999px;
  opacity: 0.72;
  transform: rotate(-24deg);
  box-shadow: 0 0 16px var(--health-glow);
}

.studio-compliance-orbit-secondary {
  inset: 1.9rem 1.2rem;
  border-color: var(--health-secondary);
  opacity: 0.58;
  transform: rotate(26deg);
}

.studio-compliance-planet {
  position: absolute;
  inset: 50% auto auto 50%;
  width: 3.65rem;
  height: 3.65rem;
  background:
    radial-gradient(circle at 31% 28%, rgba(255, 255, 255, 0.88), transparent 0.35rem),
    radial-gradient(circle at 35% 36%, var(--health-secondary), var(--health-primary) 54%, #0f172a 100%);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 999px;
  box-shadow:
    0 0 24px var(--health-glow),
    inset -0.7rem -0.65rem 0.95rem rgba(2, 6, 23, 0.38);
  transform: translate(-50%, -50%);
}

.studio-compliance-planet::before {
  position: absolute;
  inset: 1.48rem -0.42rem auto;
  height: 0.34rem;
  content: "";
  background: rgba(255, 255, 255, 0.32);
  border-radius: 999px;
  box-shadow: 0 0 14px rgba(255, 255, 255, 0.2);
  transform: rotate(-12deg);
}

.studio-compliance-planet::after {
  position: absolute;
  inset: 0.38rem auto auto 0.54rem;
  width: 0.82rem;
  height: 0.82rem;
  content: "";
  background: rgba(255, 255, 255, 0.38);
  border-radius: 999px;
  filter: blur(0.5px);
}

.studio-compliance-moon {
  position: absolute;
  right: 1.14rem;
  bottom: 1.35rem;
  width: 0.78rem;
  height: 0.78rem;
  background: #e0f2fe;
  border-radius: 999px;
  box-shadow: 0 0 14px rgba(224, 242, 254, 0.54);
}

.studio-compliance-star {
  position: absolute;
  width: 0.32rem;
  height: 0.32rem;
  background: #ffffff;
  border-radius: 999px;
  box-shadow: 0 0 12px #ffffff;
}

.studio-compliance-star-one {
  top: 1.12rem;
  left: 1.6rem;
}

.studio-compliance-star-two {
  top: 1.75rem;
  right: 1.42rem;
  width: 0.24rem;
  height: 0.24rem;
}

.studio-compliance-star-three {
  right: 2.15rem;
  bottom: 1.1rem;
  width: 0.18rem;
  height: 0.18rem;
}

.studio-compliance-emblem-excellent .studio-compliance-star {
  box-shadow:
    0 0 12px #ffffff,
    0 0 18px var(--health-primary);
}

.studio-compliance-emblem-watch .studio-compliance-orbit-secondary,
.studio-compliance-emblem-risk .studio-compliance-orbit-secondary {
  border-style: dashed;
}

.studio-compliance-emblem-risk .studio-compliance-moon,
.studio-compliance-emblem-critical .studio-compliance-moon {
  opacity: 0.46;
}

.studio-compliance-emblem-critical .studio-compliance-orbit {
  border-style: dashed;
}

.studio-compliance-emblem-critical .studio-compliance-planet::before {
  background: rgba(2, 6, 23, 0.48);
}

.studio-compliance-emblem-critical .studio-compliance-planet::after {
  width: 1.35rem;
  height: 0.12rem;
  background: rgba(2, 6, 23, 0.58);
  border-radius: 999px;
  transform: rotate(48deg);
}

.studio-score-bar {
  width: min(100%, 42rem);
  height: 0.62rem;
  overflow: hidden;
  background: rgba(15, 23, 42, 0.9);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 999px;
  box-shadow: inset 0 1px 4px rgba(2, 6, 23, 0.8);
}

.studio-score-bar span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--health-secondary), var(--health-primary));
  border-radius: inherit;
  box-shadow: 0 0 18px var(--health-glow);
}

.studio-score-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.8rem;
  min-height: 1.65rem;
  padding: 0.2rem 0.55rem;
  color: #031525;
  font-size: 0.75rem;
  font-weight: 900;
  background:
    linear-gradient(135deg, #e0f2fe 0%, var(--studio-cyan) 58%, var(--studio-teal) 100%),
    var(--studio-cyan);
  border: 1px solid rgba(224, 242, 254, 0.72);
  border-radius: 999px;
  box-shadow:
    0 0 20px rgba(103, 232, 249, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.studio-metric {
  display: grid;
  gap: 0.3rem;
  min-height: 6rem;
  padding: 0.9rem;
  border-left: 4px solid var(--studio-cyan);
}

.studio-metric-risk {
  background:
    linear-gradient(145deg, rgba(127, 29, 29, 0.64), rgba(69, 10, 10, 0.38)),
    rgba(69, 10, 10, 0.58);
  border-color: rgba(248, 113, 113, 0.58);
  border-left-color: #ef4444;
  box-shadow:
    0 18px 46px rgba(127, 29, 29, 0.28),
    inset 0 1px 0 rgba(254, 202, 202, 0.12);
}

.studio-metric span {
  color: var(--studio-text-muted);
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.studio-metric strong {
  color: #ffffff;
  font-size: 2rem;
  font-weight: 900;
  line-height: 1;
  text-shadow: 0 0 20px rgba(103, 232, 249, 0.14);
}

.studio-metric-risk span {
  color: #fecaca;
}

.studio-metric-risk strong {
  color: #fff1f2;
  text-shadow: 0 0 22px rgba(248, 113, 113, 0.28);
}

.studio-two-column {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.studio-settings-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.45rem;
  background: rgba(2, 6, 23, 0.46);
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-radius: 8px;
}

.studio-settings-tab {
  min-height: 2.35rem;
  padding: 0.48rem 0.78rem;
  color: var(--studio-text-soft);
  font-size: 0.86rem;
  font-weight: 850;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 8px;
}

.studio-settings-tab:hover,
.studio-settings-tab:focus-visible,
.studio-settings-tab.active {
  color: #ffffff;
  background:
    linear-gradient(90deg, rgba(56, 189, 248, 0.18), rgba(45, 212, 191, 0.08)),
    rgba(15, 23, 42, 0.66);
  border-color: rgba(125, 211, 252, 0.32);
}

.studio-settings-tab-panel {
  display: grid;
  gap: 1rem;
}

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

.studio-custom-role-panel {
  grid-column: 1 / -1;
}

.studio-user-management-stack {
  display: grid;
  gap: 1rem;
  width: 100%;
}

.studio-users-role-panel {
  width: 100%;
}

.studio-user-search {
  display: grid;
  gap: 0.25rem;
  width: min(100%, 18rem);
}

.studio-user-search span {
  color: var(--studio-text-muted);
  font-size: 0.72rem;
  font-weight: 850;
  text-transform: uppercase;
}

.studio-role-permission-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

.studio-role-permission-section {
  min-width: 0;
  margin: 0;
  padding: 0.85rem;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 8px;
}

.studio-role-permission-section legend {
  float: none;
  width: auto;
  margin: 0 0 0.25rem;
  color: #ffffff;
  font-size: 0.9rem;
  font-weight: 850;
}

.studio-role-permission-section p {
  margin: 0 0 0.65rem;
  color: var(--studio-text-muted);
  font-size: 0.82rem;
}

.studio-role-permission-list {
  display: grid;
  gap: 0.5rem;
}

.studio-role-permission-choice {
  align-items: flex-start;
  margin: 0;
  padding: 0.65rem;
  background: rgba(15, 23, 42, 0.46);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 8px;
}

.studio-role-permission-choice span {
  display: grid;
  gap: 0.12rem;
}

.studio-role-permission-choice strong {
  color: #ffffff;
  font-size: 0.86rem;
}

.studio-role-permission-choice small {
  color: var(--studio-text-muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.studio-saved-role-list {
  display: grid;
  gap: 0.55rem;
  margin-top: 1rem;
}

.studio-saved-role {
  padding: 0.7rem 0.8rem;
  background: rgba(2, 6, 23, 0.32);
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 8px;
}

.studio-saved-role summary {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}

.studio-saved-role summary::marker {
  color: var(--studio-cyan);
}

.studio-saved-role summary span {
  display: grid;
  gap: 0.1rem;
}

.studio-saved-role strong {
  color: #ffffff;
  font-size: 0.9rem;
}

.studio-saved-role small,
.studio-saved-role em {
  color: var(--studio-text-muted);
  font-size: 0.78rem;
  font-style: normal;
}

.studio-saved-role-edit {
  margin-top: 0.9rem;
  padding-top: 0.85rem;
  border-top: 1px solid rgba(148, 163, 184, 0.18);
}

.studio-list {
  display: grid;
  gap: 0.55rem;
}

.studio-list-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.65rem;
  align-items: center;
  min-height: 3.3rem;
  padding: 0.65rem 0.75rem;
  color: var(--studio-text);
  background:
    linear-gradient(90deg, rgba(15, 23, 42, 0.82), rgba(8, 47, 73, 0.36)),
    rgba(2, 6, 23, 0.54);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.studio-list-row strong,
.studio-list-row small {
  display: block;
  min-width: 0;
}

.studio-list-row strong {
  color: #ffffff;
  font-size: 0.94rem;
  line-height: 1.25;
}

.studio-list-row small {
  color: var(--studio-text-muted);
  font-size: 0.78rem;
}

.studio-link-row {
  text-decoration: none;
}

.studio-link-row:hover,
.studio-link-row:focus {
  color: var(--studio-text);
  background:
    linear-gradient(90deg, rgba(56, 189, 248, 0.18), rgba(45, 212, 191, 0.08)),
    rgba(15, 23, 42, 0.78);
  border-color: var(--studio-border-strong);
  box-shadow:
    0 0 26px rgba(56, 189, 248, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-risk-fix {
  justify-self: end;
  position: relative;
}

.studio-risk-fix summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.35rem;
  min-height: 2rem;
  padding: 0.28rem 0.72rem;
  color: #04111f;
  font-size: 0.75rem;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
  list-style: none;
  cursor: pointer;
  background: #67e8f9;
  border: 1px solid rgba(186, 230, 253, 0.7);
  border-radius: 999px;
  box-shadow:
    0 0 18px rgba(103, 232, 249, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.46);
}

.studio-risk-fix summary::-webkit-details-marker {
  display: none;
}

.studio-risk-fix summary:hover,
.studio-risk-fix summary:focus {
  color: #020617;
  background: #a5f3fc;
  outline: none;
}

.studio-risk-fix[open] {
  grid-column: 1 / -1;
  justify-self: stretch;
}

.studio-risk-fix[open] summary {
  margin-left: auto;
}

.studio-risk-fix-body {
  margin-top: 0.62rem;
  padding: 0.75rem 0.85rem;
  color: var(--studio-text);
  background: rgba(2, 6, 23, 0.58);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 8px;
}

.studio-risk-fix-body strong {
  margin-bottom: 0.28rem;
  font-size: 0.9rem;
}

.studio-risk-fix-body p,
.studio-risk-fix-body li,
.studio-risk-fix-issues span {
  color: var(--studio-text-muted);
  font-size: 0.8rem;
  line-height: 1.45;
}

.studio-risk-fix-body p {
  margin: 0 0 0.5rem;
}

.studio-risk-fix-body ol,
.studio-risk-fix-body ul {
  margin: 0;
  padding-left: 1.1rem;
}

.studio-risk-fix-body li + li {
  margin-top: 0.25rem;
}

.studio-risk-fix-issues {
  margin-top: 0.65rem;
  padding-top: 0.6rem;
  border-top: 1px solid rgba(125, 211, 252, 0.16);
}

.studio-risk-fix-issues span {
  display: block;
  margin-bottom: 0.3rem;
  color: #bae6fd;
  font-weight: 850;
  text-transform: uppercase;
}

.studio-risk-fix-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2rem;
  margin-top: 0.7rem;
  padding: 0.3rem 0.72rem;
  color: #dffafe;
  font-size: 0.78rem;
  font-weight: 850;
  text-decoration: none;
  border: 1px solid rgba(103, 232, 249, 0.38);
  border-radius: 999px;
}

.studio-risk-fix-link:hover,
.studio-risk-fix-link:focus {
  color: #ffffff;
  border-color: rgba(165, 243, 252, 0.78);
}

.studio-risk-dot {
  width: 0.68rem;
  height: 0.68rem;
  border-radius: 99px;
}

.studio-risk-critical,
.studio-status-blocked {
  background: #dc2626;
}

.studio-status-blocked {
  color: #ffffff;
}

.studio-production-detail-page .studio-status-blocked {
  color: #ffffff;
}

.studio-risk-high {
  background: #ea580c;
}

.studio-risk-medium,
.studio-status-warning {
  background: #d97706;
}

.studio-risk-low,
.studio-status-pass {
  background: #16a34a;
}

.studio-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4.4rem;
  min-height: 1.65rem;
  padding: 0.2rem 0.55rem;
  color: #ffffff;
  font-size: 0.75rem;
  font-weight: 850;
  border-radius: 999px;
  box-shadow:
    0 0 18px rgba(2, 6, 23, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.studio-status-warning {
  color: #1f2937;
  background: #fbbf24;
}

.studio-status-draft,
.studio-status-pending {
  background: #475569;
}

.studio-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.studio-production-card {
  display: grid;
  gap: 0.45rem;
  min-height: 8.2rem;
  padding: 0.85rem;
  color: var(--studio-text);
  text-decoration: none;
  transition:
    transform 0.16s ease,
    border-color 0.16s ease,
    box-shadow 0.16s ease;
}

.studio-production-card[data-production-inspect-card] {
  cursor: pointer;
}

.studio-production-finance-card {
  display: grid;
  gap: 0.75rem;
  min-height: 12rem;
  padding: 0.85rem;
}

.studio-production-finance-heading {
  display: flex;
  gap: 0.75rem;
  align-items: start;
  justify-content: space-between;
}

.studio-production-finance-heading strong,
.studio-production-finance-heading small,
.studio-production-finance-card span,
.studio-production-finance-card small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.studio-production-finance-heading strong {
  display: block;
  color: #ffffff;
  font-size: 1rem;
  line-height: 1.25;
}

.studio-production-finance-heading small,
.studio-production-finance-card small {
  color: var(--studio-text-muted);
  font-size: 0.78rem;
}

.studio-finance-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.45rem;
}

.studio-finance-summary-grid > div {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
  padding: 0.55rem;
  background: rgba(2, 6, 23, 0.38);
  border: 1px solid rgba(125, 211, 252, 0.16);
  border-radius: 8px;
}

.studio-finance-summary-grid span,
.studio-finance-category-list span {
  color: var(--studio-text-muted);
  font-size: 0.72rem;
  font-weight: 850;
  text-transform: uppercase;
}

.studio-finance-summary-grid strong {
  color: #ffffff;
  font-size: 0.96rem;
}

.studio-finance-record-totals,
.studio-finance-split-notes {
  display: grid;
  gap: 0.25rem;
}

.studio-finance-category-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.38rem;
}

.studio-finance-category-list span {
  display: flex;
  gap: 0.4rem;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
  padding: 0.42rem 0.5rem;
  background: rgba(8, 47, 73, 0.34);
  border: 1px solid rgba(125, 211, 252, 0.14);
  border-radius: 8px;
}

.studio-finance-category-list strong,
.studio-finance-split-notes strong {
  color: #ffffff;
}

.studio-credit-balance-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: flex-end;
}

.studio-credit-balance-strip span {
  display: inline-flex;
  gap: 0.4rem;
  align-items: center;
  min-height: 2.25rem;
  padding: 0.42rem 0.62rem;
  color: var(--studio-text-muted);
  font-size: 0.82rem;
  font-weight: 800;
  background: rgba(2, 6, 23, 0.42);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 8px;
}

.studio-credit-balance-strip strong {
  color: #ffffff;
  font-size: 1rem;
}

.studio-credit-purchase-grid,
.studio-credit-coverage-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.studio-credit-purchase-panel {
  display: grid;
  gap: 0.85rem;
  align-content: start;
}

.studio-credits-page input[type="number"] {
  appearance: textfield;
  -moz-appearance: textfield;
}

.studio-credits-page input[type="number"]::-webkit-inner-spin-button,
.studio-credits-page input[type="number"]::-webkit-outer-spin-button {
  margin: 0;
  appearance: none;
  -webkit-appearance: none;
}

.studio-credit-panel-heading {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  gap: 0.7rem;
  align-items: center;
}

.studio-credit-panel-heading h2 {
  margin: 0;
}

.studio-credit-panel-heading p,
.studio-credit-coverage-panel p {
  margin: 0;
  color: var(--studio-text-muted);
}

.studio-credit-panel-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  color: #031525;
  background:
    linear-gradient(135deg, #e0f2fe 0%, var(--studio-cyan) 48%, var(--studio-teal) 100%),
    var(--studio-cyan);
  border: 1px solid rgba(224, 242, 254, 0.7);
  border-radius: 8px;
  box-shadow: 0 14px 32px rgba(45, 212, 191, 0.2);
}

.studio-credit-coverage-panel {
  --studio-coverage-shine-delay: 0s;
  display: grid;
  gap: 0.85rem;
  align-content: start;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.9), rgba(8, 47, 73, 0.54)),
    radial-gradient(circle at 96% 0%, rgba(103, 232, 249, 0.16), transparent 32%),
    rgba(2, 6, 23, 0.78);
  border-color: rgba(125, 211, 252, 0.3);
  box-shadow:
    0 24px 64px rgba(2, 6, 23, 0.34),
    0 0 34px rgba(56, 189, 248, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.studio-credit-coverage-panel::before {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(90deg, rgba(125, 211, 252, 0.06) 1px, transparent 1px),
    linear-gradient(0deg, rgba(94, 234, 212, 0.04) 1px, transparent 1px),
    linear-gradient(112deg, transparent 0 39%, rgba(186, 230, 253, 0.03) 48%, transparent 60%);
  background-size:
    34px 34px,
    34px 34px,
    220% 220%;
  opacity: 0.58;
  animation: studio-coverage-panel-grid-shine 1s linear both paused;
  animation-delay: var(--studio-coverage-shine-delay);
}

.studio-credit-coverage-panel::after {
  position: absolute;
  inset: -55% -35%;
  z-index: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(115deg, transparent 0 42%, rgba(224, 242, 254, 0.16) 48%, rgba(103, 232, 249, 0.1) 52%, transparent 60%);
  opacity: 0.13;
  mix-blend-mode: screen;
  animation: studio-coverage-panel-shine-scrub 1s linear both paused;
  animation-delay: var(--studio-coverage-shine-delay);
  will-change: transform;
}

@keyframes studio-coverage-panel-grid-shine {
  0% {
    background-position:
      0 0,
      0 0,
      50% 17.5%;
  }

  50% {
    background-position:
      0 0,
      0 0,
      50% 50%;
  }

  100% {
    background-position:
      0 0,
      0 0,
      50% 82.5%;
  }
}

@keyframes studio-coverage-panel-shine-scrub {
  0% {
    transform: translate3d(-6%, -9%, 0);
  }

  50% {
    transform: translate3d(0%, 0%, 0);
  }

  100% {
    transform: translate3d(6%, 9%, 0);
  }
}

.studio-credit-coverage-panel > * {
  position: relative;
  z-index: 1;
}

.studio-credit-coverage-testing {
  border-top-color: rgba(94, 234, 212, 0.54);
}

.studio-credit-coverage-scan {
  border-top-color: rgba(103, 232, 249, 0.56);
}

.studio-coverage-header {
  display: grid;
  grid-template-columns: 2.7rem minmax(0, 1fr);
  gap: 0.72rem;
  align-items: start;
}

.studio-coverage-header .studio-credit-panel-icon {
  width: 2.7rem;
  height: 2.7rem;
  box-shadow:
    0 0 24px rgba(103, 232, 249, 0.24),
    0 14px 32px rgba(45, 212, 191, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.58);
}

.studio-coverage-header h2 {
  margin: 0.12rem 0 0.35rem;
  font-size: 1.08rem;
  line-height: 1.18;
}

.studio-coverage-kicker {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: 0.18rem 0.46rem;
  color: #67e8f9;
  font-size: 0.66rem;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
  background: rgba(14, 165, 233, 0.13);
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-radius: 999px;
}

.studio-coverage-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
}

.studio-coverage-facts span {
  display: grid;
  gap: 0.16rem;
  min-width: 0;
  min-height: 3.6rem;
  padding: 0.56rem 0.62rem;
  color: var(--studio-text-muted);
  font-size: 0.74rem;
  font-weight: 800;
  line-height: 1.22;
  background:
    linear-gradient(135deg, rgba(2, 6, 23, 0.64), rgba(8, 47, 73, 0.36));
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 8px;
}

.studio-coverage-facts strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #ffffff;
  font-size: 0.92rem;
  font-weight: 900;
  line-height: 1.08;
  font-variant-numeric: tabular-nums;
}

.studio-coverage-stack,
.studio-coverage-group,
.studio-scan-coverage-list {
  display: grid;
  gap: 0.62rem;
}

.studio-coverage-group {
  padding: 0.72rem;
  background: rgba(2, 6, 23, 0.38);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 8px;
}

.studio-coverage-group-heading {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.65rem;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.58rem;
}

.studio-coverage-group-heading span {
  color: var(--studio-cyan);
  font-size: 0.68rem;
  font-weight: 900;
  text-transform: uppercase;
}

.studio-coverage-group-heading strong {
  color: rgba(224, 242, 254, 0.82);
  font-size: 0.76rem;
  font-weight: 850;
}

.studio-coverage-readout-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
}

.studio-coverage-readout {
  display: grid;
  gap: 0.26rem;
  min-width: 0;
  padding: 0.6rem;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.72), rgba(8, 47, 73, 0.32));
  border: 1px solid rgba(125, 211, 252, 0.14);
  border-left-color: rgba(94, 234, 212, 0.46);
  border-radius: 8px;
}

.studio-coverage-readout strong {
  min-width: 0;
  color: #ffffff;
  font-size: 0.86rem;
  font-weight: 900;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.studio-coverage-readout span {
  min-width: 0;
  color: var(--studio-text-muted);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.42;
  overflow-wrap: anywhere;
}

.studio-scan-coverage-list {
  grid-template-columns: 1fr;
}

.studio-scan-coverage-item {
  display: grid;
  grid-template-columns: 2.15rem minmax(0, 1fr);
  gap: 0.62rem;
  align-items: center;
  min-height: 3.4rem;
  padding: 0.58rem 0.65rem;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.76), rgba(8, 47, 73, 0.34));
  border: 1px solid rgba(125, 211, 252, 0.16);
  border-radius: 8px;
}

.studio-scan-coverage-item span {
  display: inline-grid;
  place-items: center;
  width: 2.15rem;
  height: 2.15rem;
  color: #031525;
  font-size: 0.78rem;
  font-weight: 950;
  background:
    linear-gradient(135deg, #e0f2fe 0%, var(--studio-cyan) 52%, var(--studio-teal) 100%),
    var(--studio-cyan);
  border: 1px solid rgba(224, 242, 254, 0.66);
  border-radius: 8px;
  box-shadow: 0 0 18px rgba(103, 232, 249, 0.18);
}

.studio-scan-coverage-item strong {
  min-width: 0;
  color: #ffffff;
  font-size: 0.92rem;
  font-weight: 900;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.studio-credit-list {
  display: grid;
  gap: 0.5rem;
  margin: 0;
  padding-left: 1.1rem;
  color: var(--studio-text-soft);
}

.studio-credit-list li {
  line-height: 1.45;
}

.studio-credit-list strong {
  color: #ffffff;
}

.studio-status-paid {
  background: var(--studio-success);
}

.studio-status-checkout_created {
  background: var(--studio-blue);
}

.studio-status-checkout_canceled,
.studio-status-checkout_expired,
.studio-status-payment_failed {
  background: var(--studio-danger);
}

.studio-status.studio-status-pass,
.studio-status.studio-status-blocked,
.studio-status.studio-status-paid,
.studio-status.studio-status-checkout_canceled,
.studio-status.studio-status-checkout_expired,
.studio-status.studio-status-payment_failed {
  color: #ffffff !important;
}

.studio-production-card strong,
.studio-production-card small,
.studio-production-card span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.studio-production-card strong {
  color: #ffffff;
  font-size: 1.05rem;
}

.studio-production-card small,
.studio-production-card span:not(.studio-status) {
  color: var(--studio-text-muted);
  font-size: 0.84rem;
}

.studio-production-card:hover,
.studio-production-card:focus-visible {
  color: var(--studio-text);
  transform: translateY(-2px);
  border-color: var(--studio-border-strong);
  box-shadow:
    0 26px 66px rgba(2, 6, 23, 0.38),
    0 0 30px rgba(56, 189, 248, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.studio-scene {
  display: grid;
  gap: 0.75rem;
  padding: 0.8rem 0;
  border-top: 1px solid rgba(125, 211, 252, 0.2);
}

.studio-scene:first-of-type {
  border-top: 0;
}

.studio-scene-heading {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  justify-content: space-between;
}

.studio-scene-heading strong,
.studio-scene-heading small {
  display: block;
}

.studio-scene-heading small {
  color: var(--studio-text-muted);
}

.studio-table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--studio-text-soft);
  --bs-table-border-color: rgba(125, 211, 252, 0.18);
  --bs-table-hover-bg: rgba(56, 189, 248, 0.08);
  --bs-table-hover-color: #ffffff;
  margin: 0;
  color: var(--studio-text-soft);
}

.studio-panel .table-responsive {
  border: 1px solid rgba(125, 211, 252, 0.16);
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.studio-table th {
  color: var(--studio-cyan);
  font-size: 0.75rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
  background: rgba(2, 6, 23, 0.34);
}

.studio-table td {
  color: var(--studio-text-soft);
  background: transparent;
  border-color: rgba(125, 211, 252, 0.16);
}

.studio-table td strong {
  color: #ffffff;
}

.studio-table td small {
  display: block;
  color: var(--studio-text-muted);
}

.studio-table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
}

.studio-form {
  display: grid;
  gap: 0.85rem;
}

.studio-form label {
  display: grid;
  gap: 0.35rem;
}

.studio-form label > span,
.studio-panel .form-label {
  color: var(--studio-text-muted);
  font-size: 0.82rem;
  font-weight: 800;
}

.studio-body label:has(input[required], select[required], textarea[required]) > span:first-of-type::after,
.studio-body .form-label:has(+ input[required])::after,
.studio-body .form-label:has(+ select[required])::after,
.studio-body .form-label:has(+ textarea[required])::after,
.studio-required-label::after {
  content: " *";
  color: #fca5a5;
  font-weight: 950;
}

.studio-body .studio-onboarding-form .form-label:has(+ input[required])::after,
.studio-body .studio-onboarding-form .form-label:has(+ select[required])::after,
.studio-body .studio-onboarding-form .form-label:has(+ textarea[required])::after {
  content: none;
}

.studio-required-asterisk {
  display: inline;
  color: #fca5a5;
  font-weight: 950;
}

.studio-logo-uploader {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem;
  min-width: 0;
  padding: 0.75rem;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.66), rgba(8, 47, 73, 0.3)),
    rgba(2, 6, 23, 0.48);
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.studio-logo-preview-shell {
  display: grid;
  grid-template-columns: 6rem minmax(0, 1fr);
  gap: 0.75rem;
  align-items: center;
  min-width: 0;
}

.studio-logo-preview-frame {
  display: block;
  width: 6rem;
  height: 6rem;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(224, 242, 254, 0.1), rgba(14, 165, 233, 0.15)),
    rgba(2, 6, 23, 0.62);
  border: 1px solid rgba(125, 211, 252, 0.32);
  border-radius: 8px;
  cursor: default;
  box-shadow:
    0 0 24px rgba(56, 189, 248, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.studio-logo-preview-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  user-select: none;
}

.studio-logo-current-copy {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}

.studio-logo-current-copy strong,
.studio-logo-current-copy small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.studio-logo-current-copy strong {
  color: #ffffff;
  font-size: 0.92rem;
  font-weight: 900;
  line-height: 1.2;
}

.studio-logo-current-copy small {
  color: var(--studio-text-muted);
  font-size: 0.78rem;
  font-weight: 750;
}

.studio-logo-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
}

.studio-logo-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

.studio-logo-file-button {
  min-height: 2.35rem;
}

.studio-logo-crop-modal .modal-dialog {
  max-width: min(92vw, 34rem);
}

.studio-logo-crop-modal .modal-content {
  color: var(--studio-text);
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.98), rgba(8, 47, 73, 0.9)),
    rgba(2, 6, 23, 0.98);
  border: 1px solid rgba(125, 211, 252, 0.25);
  border-radius: 8px;
  box-shadow:
    0 30px 90px rgba(2, 6, 23, 0.7),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-logo-crop-modal .modal-header,
.studio-logo-crop-modal .modal-footer {
  border-color: rgba(125, 211, 252, 0.18);
}

.studio-logo-crop-modal .modal-title {
  color: #ffffff;
  font-size: 1rem;
  font-weight: 900;
}

.studio-logo-modal-body {
  display: grid;
  gap: 1rem;
}

.studio-logo-crop-frame {
  display: block;
  width: min(100%, 22rem);
  aspect-ratio: 1;
  margin-inline: auto;
  overflow: hidden;
  background:
    linear-gradient(rgba(125, 211, 252, 0.14) 1px, transparent 1px),
    linear-gradient(90deg, rgba(125, 211, 252, 0.14) 1px, transparent 1px),
    linear-gradient(135deg, rgba(224, 242, 254, 0.1), rgba(14, 165, 233, 0.15)),
    rgba(2, 6, 23, 0.72);
  background-size:
    1.25rem 1.25rem,
    1.25rem 1.25rem,
    auto,
    auto;
  border: 1px solid rgba(125, 211, 252, 0.36);
  border-radius: 8px;
  cursor: grab;
  touch-action: none;
  box-shadow:
    0 0 34px rgba(56, 189, 248, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.studio-logo-crop-frame.is-dragging {
  cursor: grabbing;
}

.studio-logo-crop-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  user-select: none;
}

.studio-logo-modal-zoom-control {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.65rem;
  align-items: center;
  min-width: 0;
  margin: 0;
}

.studio-logo-modal-zoom-control span {
  color: var(--studio-text-muted);
  font-size: 0.78rem;
  font-weight: 850;
  white-space: nowrap;
}

.studio-logo-modal-zoom-control .form-range {
  min-width: 0;
  height: 1.25rem;
  padding: 0;
  accent-color: #2585f6;
}

.studio-logo-modal-zoom-control .form-range:focus {
  outline: 0;
}

.studio-logo-modal-zoom-control .form-range::-webkit-slider-runnable-track {
  height: 0.38rem;
  background: #dbeafe;
  border: 0;
  border-radius: 999px;
  box-shadow: inset 0 1px 1px rgba(15, 23, 42, 0.12);
}

.studio-logo-modal-zoom-control .form-range::-webkit-slider-thumb {
  width: 1rem;
  height: 1rem;
  margin-top: -0.31rem;
  background: #2585f6;
  border: 0;
  border-radius: 50%;
  box-shadow:
    0 0 0 0.12rem rgba(37, 133, 246, 0.16),
    0 5px 14px rgba(37, 133, 246, 0.32);
}

.studio-logo-modal-zoom-control .form-range:focus::-webkit-slider-thumb {
  box-shadow:
    0 0 0 0.22rem rgba(103, 232, 249, 0.2),
    0 5px 14px rgba(37, 133, 246, 0.32);
}

.studio-logo-modal-zoom-control .form-range::-moz-range-track {
  height: 0.38rem;
  background: #dbeafe;
  border: 0;
  border-radius: 999px;
  box-shadow: inset 0 1px 1px rgba(15, 23, 42, 0.12);
}

.studio-logo-modal-zoom-control .form-range::-moz-range-thumb {
  width: 1rem;
  height: 1rem;
  background: #2585f6;
  border: 0;
  border-radius: 50%;
  box-shadow:
    0 0 0 0.12rem rgba(37, 133, 246, 0.16),
    0 5px 14px rgba(37, 133, 246, 0.32);
}

.studio-logo-modal-zoom-control .form-range:focus::-moz-range-thumb {
  box-shadow:
    0 0 0 0.22rem rgba(103, 232, 249, 0.2),
    0 5px 14px rgba(37, 133, 246, 0.32);
}

.studio-logo-crop-modal .btn-close {
  box-shadow: none;
}

.studio-checkbox-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  gap: 0.45rem 0.75rem;
}

.studio-checkbox-grid .form-check {
  display: flex;
  gap: 0.45rem;
  align-items: center;
  min-height: 1.75rem;
  margin: 0;
}

.studio-checkbox-grid .form-check-input {
  flex: 0 0 auto;
  margin-top: 0;
}

.studio-checkbox-grid .form-check-label {
  color: var(--studio-text);
  font-size: 0.88rem;
  font-weight: 650;
  line-height: 1.25;
}

.studio-scene-performer-picker {
  display: grid;
  gap: 0.55rem;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.studio-scene-performer-picker legend {
  float: none;
  width: auto;
  margin: 0;
  color: var(--studio-text-muted);
  font-size: 0.82rem;
  font-weight: 800;
}

.studio-scene-performer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
  gap: 0.55rem;
}

.studio-scene-performer-choice {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.58rem;
  align-items: start;
  min-width: 0;
  min-height: 3.15rem;
  padding: 0.68rem;
  color: var(--studio-text-soft);
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.78), rgba(8, 47, 73, 0.32)),
    rgba(2, 6, 23, 0.52);
  border: 1px solid rgba(125, 211, 252, 0.2);
  border-radius: 8px;
  cursor: pointer;
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}

.studio-scene-performer-choice:hover,
.studio-scene-performer-choice:focus-within {
  color: #ffffff;
  border-color: rgba(103, 232, 249, 0.42);
  box-shadow:
    0 0 26px rgba(56, 189, 248, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transform: translateY(-1px);
}

.studio-scene-performer-choice:has(input:checked) {
  color: #ccfbf1;
  background:
    linear-gradient(145deg, rgba(20, 184, 166, 0.2), rgba(14, 165, 233, 0.14)),
    rgba(2, 6, 23, 0.72);
  border-color: rgba(94, 234, 212, 0.48);
}

.studio-scene-performer-choice .form-check-input {
  margin-top: 0.14rem;
}

.studio-scene-performer-copy {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}

.studio-scene-performer-copy strong,
.studio-scene-performer-copy small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.studio-scene-performer-copy strong {
  color: inherit;
  font-size: 0.9rem;
  line-height: 1.2;
}

.studio-scene-performer-copy small {
  color: var(--studio-text-muted);
  font-size: 0.74rem;
  font-weight: 850;
}

.studio-scene-performer-signed {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  gap: 0.38rem;
  width: fit-content;
  margin-top: 0.06rem;
  padding: 0.16rem 0.48rem 0.16rem 0.24rem;
  color: #bbf7d0 !important;
  background: rgba(22, 163, 74, 0.14);
  border: 1px solid rgba(74, 222, 128, 0.34);
  border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-scene-performer-signed-icon {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 1.05rem;
  height: 1.05rem;
  color: #052e16;
  font-size: 0.68rem;
  font-weight: 950;
  line-height: 1;
  background: #86efac;
  border-radius: 999px;
  box-shadow: 0 0 0 1px rgba(187, 247, 208, 0.55);
}

.studio-scene-sti-picker {
  display: grid;
  gap: 0.65rem;
  min-width: 0;
  padding: 0;
  border: 0;
}

.studio-scene-sti-picker legend {
  margin: 0;
  color: var(--studio-text-soft);
  font-size: 0.8rem;
  font-weight: 850;
}

.studio-sti-choice-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.52rem;
  min-width: 0;
}

.studio-sti-choice {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.46rem;
  min-height: 2.34rem;
  padding: 0.48rem 0.72rem;
  color: var(--studio-text-soft);
  font-size: 0.82rem;
  font-weight: 850;
  line-height: 1.2;
  cursor: pointer;
  user-select: none;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.82), rgba(8, 47, 73, 0.28)),
    rgba(2, 6, 23, 0.54);
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-radius: 999px;
  box-shadow:
    0 12px 28px rgba(2, 6, 23, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, transform 0.16s ease;
}

.studio-sti-choice:hover {
  color: #ffffff;
  border-color: rgba(94, 234, 212, 0.4);
  transform: translateY(-1px);
}

.studio-sti-choice input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.studio-sti-choice-mark {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 0.92rem;
  height: 0.92rem;
  border: 1px solid rgba(148, 163, 184, 0.6);
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.7);
}

.studio-sti-choice:has(input:checked) {
  color: #ccfbf1;
  background:
    linear-gradient(145deg, rgba(20, 184, 166, 0.22), rgba(14, 165, 233, 0.14)),
    rgba(2, 6, 23, 0.68);
  border-color: rgba(94, 234, 212, 0.56);
}

.studio-sti-choice:has(input:checked) .studio-sti-choice-mark {
  background: #5eead4;
  border-color: #99f6e4;
  box-shadow: 0 0 0 3px rgba(45, 212, 191, 0.14);
}

.studio-sti-choice:has(input:checked) .studio-sti-choice-mark::after {
  width: 0.34rem;
  height: 0.34rem;
  content: "";
  background: #042f2e;
  border-radius: 999px;
}

.studio-sti-test-picker {
  gap: 0.85rem;
}

.studio-body .sti-test-option,
.studio-body .sti-test-chip,
.studio-body .sti-test-type-option {
  color: var(--studio-text-soft);
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.78), rgba(8, 47, 73, 0.32)),
    rgba(2, 6, 23, 0.52);
  border-color: rgba(125, 211, 252, 0.2);
  box-shadow:
    0 14px 34px rgba(2, 6, 23, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.studio-body .sti-test-option:hover,
.studio-body .sti-test-type-option:hover {
  color: #ffffff;
  border-color: rgba(103, 232, 249, 0.42);
  box-shadow:
    0 0 26px rgba(56, 189, 248, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-body .sti-test-option-selected,
.studio-body .sti-test-chip,
.studio-body .sti-test-type-option:has(input:checked) {
  color: #ccfbf1;
  background:
    linear-gradient(145deg, rgba(20, 184, 166, 0.2), rgba(14, 165, 233, 0.14)),
    rgba(2, 6, 23, 0.72);
  border-color: rgba(94, 234, 212, 0.48);
}

.studio-body .sti-test-chip::after {
  color: var(--studio-cyan);
}

.studio-body .sti-test-type-option:has(input:focus-visible) {
  outline: 3px solid rgba(103, 232, 249, 0.24);
}

.studio-body .sti-test-type-option .collab-option-icon {
  color: #031525;
  background:
    linear-gradient(135deg, #e0f2fe 0%, var(--studio-cyan) 48%, var(--studio-teal) 100%),
    var(--studio-cyan);
  border-color: rgba(224, 242, 254, 0.62);
  box-shadow:
    0 0 20px rgba(103, 232, 249, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.68);
}

.studio-body .sti-test-type-option .collab-option-copy strong {
  color: #ffffff;
}

.studio-body .sti-test-type-option .collab-option-copy small {
  color: var(--studio-text-muted);
}

.studio-sti-site-options {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 10.5rem), 1fr));
}

.studio-sti-site-options .sti-test-type-option {
  min-height: 6.9rem;
}

.studio-metric small {
  color: var(--studio-text-muted);
  font-size: 0.82rem;
  line-height: 1.25;
}

.studio-production-workflow.studio-performer-console {
  --active-progress: 0%;
}

.studio-performer-console .studio-workflow-hero {
  grid-template-columns: minmax(15rem, 1fr) minmax(20rem, 28rem);
}

.studio-workflow-progress.studio-production-checkpoints {
  --production-checkpoint-edge-offset: 0.85rem;
  --production-checkpoint-node-width: 4.75rem;
  --production-checkpoint-node-half: 2.375rem;
  --production-checkpoint-track-inset: 1.85rem;
  --production-checkpoint-point-02: calc(20% + 1.11rem);
  --production-checkpoint-point-03: calc(40% + 0.37rem);
  --production-checkpoint-point-04: calc(60% - 0.37rem);
  --production-checkpoint-point-05: calc(80% - 1.11rem);
  grid-template-columns: none;
  justify-content: stretch;
  column-gap: 0;
}

.studio-workflow-progress.studio-production-checkpoints::before,
.studio-workflow-progress.studio-production-checkpoints::after {
  right: var(--production-checkpoint-track-inset);
  left: var(--production-checkpoint-track-inset);
}

.studio-workflow-progress.studio-production-checkpoints::after {
  width: auto;
  max-width: none;
  transform: scaleX(var(--production-active-progress-ratio, 0));
  transform-origin: left center;
}

.studio-workflow-progress.studio-production-checkpoints button {
  position: absolute;
  top: 0.8rem;
  width: var(--production-checkpoint-node-width);
  max-width: none;
  justify-items: center;
  text-align: center;
}

.studio-workflow-progress.studio-production-checkpoints button:nth-child(1) {
  left: var(--production-checkpoint-edge-offset);
  justify-items: start;
  text-align: left;
}

.studio-workflow-progress.studio-production-checkpoints button:nth-child(2) {
  left: calc(var(--production-checkpoint-point-02) - var(--production-checkpoint-node-half));
}

.studio-workflow-progress.studio-production-checkpoints button:nth-child(3) {
  left: calc(var(--production-checkpoint-point-03) - var(--production-checkpoint-node-half));
}

.studio-workflow-progress.studio-production-checkpoints button:nth-child(4) {
  left: calc(var(--production-checkpoint-point-04) - var(--production-checkpoint-node-half));
}

.studio-workflow-progress.studio-production-checkpoints button:nth-child(5) {
  left: calc(var(--production-checkpoint-point-05) - var(--production-checkpoint-node-half));
}

.studio-workflow-progress.studio-production-checkpoints button:nth-child(6) {
  right: var(--production-checkpoint-edge-offset);
  justify-items: end;
  text-align: right;
}

.studio-workflow-progress.studio-performer-checkpoints button {
  justify-items: center;
  text-align: center;
}

.studio-workflow-progress.studio-performer-checkpoints {
  grid-template-columns: repeat(4, max-content);
  justify-content: space-between;
  column-gap: clamp(0.85rem, 2vw, 1.4rem);
}

.studio-performer-checkpoints > span {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 0.42rem;
  min-width: 0;
  min-height: 3rem;
  color: rgba(224, 242, 254, 0.88);
  text-align: center;
}

.studio-performer-checkpoints > span em {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  color: #031525;
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 950;
  background: var(--studio-cyan);
  border: 1px solid rgba(224, 242, 254, 0.86);
  border-radius: 999px;
  box-shadow:
    0 0 0 0.22rem rgba(2, 6, 23, 0.86),
    0 0 24px rgba(103, 232, 249, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.studio-performer-checkpoints > span:nth-child(2) em,
.studio-performer-checkpoints > span:nth-child(3) em {
  transform: translateX(0.4rem);
}

.studio-performer-checkpoints > span strong {
  min-width: 0;
  color: inherit;
  font-size: 0.78rem;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.studio-performer-form {
  gap: 1rem;
  padding: clamp(1rem, 2.2vw, 1.45rem);
}

.studio-performer-intake-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
}

.studio-performer-field-stack {
  display: grid;
  gap: 0.9rem;
  min-width: 0;
}

.studio-performer-form-section {
  position: relative;
  display: grid;
  gap: 0.9rem;
  min-width: 0;
  padding: 0.9rem;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.72), rgba(8, 47, 73, 0.28)),
    rgba(2, 6, 23, 0.38);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-left: 3px solid rgba(103, 232, 249, 0.58);
  border-radius: 8px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 14px 34px rgba(2, 6, 23, 0.16);
  animation: studioWorkflowRowIn 0.24s ease-out both;
}

.studio-performer-identity-grid,
.studio-performer-health-grid,
.studio-performer-sti-grid,
.studio-performer-contracts {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}

.studio-performer-identity-grid {
  grid-template-columns: minmax(13rem, 1.15fr) minmax(12rem, 1fr) repeat(2, minmax(10rem, 0.9fr));
  align-items: end;
}

.studio-performer-health-grid {
  grid-template-columns: repeat(2, minmax(10rem, 14rem));
  align-items: end;
}

.studio-performer-sti-grid {
  grid-template-columns: minmax(0, 1fr);
}

.studio-performer-contracts {
  grid-template-columns: minmax(0, 1.1fr) minmax(16rem, 0.9fr);
}

.studio-performer-contracts h4 {
  margin: 0 0 0.58rem;
  color: #ffffff;
  font-size: 0.95rem;
  font-weight: 900;
}

.studio-performer-review-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.studio-contract-option-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  gap: 0.65rem;
}

.studio-contract-option {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.62rem;
  align-items: center;
  min-height: 4.65rem;
  padding: 0.72rem 0.78rem;
  overflow: hidden;
  color: var(--studio-text-soft);
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.76), rgba(8, 47, 73, 0.34)),
    rgba(2, 6, 23, 0.5);
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-radius: 8px;
  cursor: pointer;
  box-shadow:
    0 14px 34px rgba(2, 6, 23, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  transition:
    color 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.studio-contract-option::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(115deg, transparent 0 36%, rgba(103, 232, 249, 0.14) 48%, transparent 62%),
    radial-gradient(circle at 12% 0%, rgba(94, 234, 212, 0.16), transparent 48%);
  opacity: 0;
  transform: translateX(-12%);
  transition:
    opacity 0.2s ease,
    transform 0.24s ease;
}

.studio-contract-option input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.studio-contract-option-mark {
  position: relative;
  display: grid;
  place-items: center;
  width: 2.05rem;
  height: 2.05rem;
  color: rgba(186, 230, 253, 0.78);
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.9), rgba(8, 47, 73, 0.54)),
    rgba(2, 6, 23, 0.62);
  border: 1px solid rgba(125, 211, 252, 0.28);
  border-radius: 8px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.07),
    0 0 0 0 rgba(103, 232, 249, 0);
  transition:
    background-color 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.studio-contract-option-mark::before {
  width: 0.72rem;
  height: 0.42rem;
  border-bottom: 2px solid currentColor;
  border-left: 2px solid currentColor;
  content: "";
  opacity: 0;
  transform: translateY(-1px) rotate(-45deg) scale(0.72);
  transition:
    opacity 0.16s ease,
    transform 0.18s ease;
}

.studio-contract-option-copy {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}

.studio-contract-option-copy strong,
.studio-contract-option-copy small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.studio-contract-option-copy strong {
  color: #ffffff;
  font-size: 0.9rem;
  font-weight: 900;
  line-height: 1.18;
}

.studio-contract-option-copy small {
  color: var(--studio-text-muted);
  font-size: 0.73rem;
  font-weight: 850;
  line-height: 1.2;
  text-transform: uppercase;
}

.studio-contract-option:hover,
.studio-contract-option:focus-within {
  color: #ffffff;
  border-color: rgba(103, 232, 249, 0.48);
  transform: translateY(-1px);
  box-shadow:
    0 18px 42px rgba(2, 6, 23, 0.24),
    0 0 26px rgba(56, 189, 248, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-contract-option:hover::before,
.studio-contract-option:focus-within::before,
.studio-contract-option:has(input:checked)::before {
  opacity: 1;
  transform: translateX(0);
}

.studio-contract-option:has(input:focus-visible) {
  outline: 3px solid rgba(103, 232, 249, 0.24);
  outline-offset: 0.14rem;
}

.studio-contract-option:has(input:checked) {
  color: #ccfbf1;
  background:
    linear-gradient(145deg, rgba(20, 184, 166, 0.2), rgba(14, 165, 233, 0.14)),
    rgba(2, 6, 23, 0.72);
  border-color: rgba(94, 234, 212, 0.54);
  box-shadow:
    0 18px 44px rgba(2, 6, 23, 0.26),
    0 0 30px rgba(45, 212, 191, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.studio-contract-option:has(input:checked) .studio-contract-option-mark {
  color: #031525;
  background:
    linear-gradient(135deg, #e0f2fe 0%, var(--studio-cyan) 48%, var(--studio-teal) 100%),
    var(--studio-cyan);
  border-color: rgba(224, 242, 254, 0.72);
  transform: scale(1.02);
  box-shadow:
    0 0 22px rgba(103, 232, 249, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.68);
}

.studio-contract-option:has(input:checked) .studio-contract-option-mark::before {
  opacity: 1;
  transform: translateY(-1px) rotate(-45deg) scale(1);
}

.studio-roster-heading p,
.studio-card-kicker,
.studio-performer-status-item span,
.studio-performer-card-details span {
  color: var(--studio-text-muted);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.studio-performer-actions {
  position: static;
}

.studio-roster-heading {
  align-items: end;
}

.studio-roster-heading p {
  margin: 0.25rem 0 0;
}

.studio-performer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 23rem), 1fr));
  gap: 0.75rem;
}

.studio-performer-card {
  position: relative;
  display: grid;
  gap: 0.78rem;
  min-width: 0;
  padding: 0.85rem;
  color: var(--studio-text);
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.86), rgba(8, 47, 73, 0.42)),
    rgba(2, 6, 23, 0.62);
  border: 1px solid var(--studio-border);
  border-radius: 8px;
  box-shadow:
    0 18px 48px rgba(2, 6, 23, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

.studio-performer-card::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(90deg, rgba(125, 211, 252, 0.08) 1px, transparent 1px),
    linear-gradient(0deg, rgba(94, 234, 212, 0.055) 1px, transparent 1px);
  background-size: 34px 34px;
  border-radius: inherit;
  opacity: 0.38;
}

.studio-performer-card > * {
  position: relative;
  z-index: 1;
}

.studio-performer-card-header {
  display: flex;
  gap: 0.85rem;
  align-items: flex-start;
  justify-content: space-between;
}

.studio-performer-name {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}

.studio-performer-name strong {
  min-width: 0;
  color: #ffffff;
  font-size: 1.12rem;
  font-weight: 950;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.studio-performer-name small {
  min-width: 0;
  color: var(--studio-text-muted);
  overflow-wrap: anywhere;
}

.studio-performer-name-link {
  color: inherit;
  text-decoration: none;
}

.studio-performer-name-link:hover,
.studio-performer-name-link:focus {
  color: var(--studio-cyan);
  text-decoration: underline;
  text-underline-offset: 0.18rem;
}

.studio-performer-status-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.48rem;
}

.studio-performer-status-item {
  display: grid;
  gap: 0.18rem;
  min-height: 3.15rem;
  padding: 0.58rem 0.62rem;
  background: rgba(15, 23, 42, 0.56);
  border: 1px solid rgba(125, 211, 252, 0.16);
  border-left: 3px solid rgba(148, 163, 184, 0.48);
  border-radius: 8px;
}

.studio-performer-status-item.is-ready {
  border-left-color: var(--studio-success);
  background:
    linear-gradient(90deg, rgba(74, 222, 128, 0.1), transparent 78%),
    rgba(15, 23, 42, 0.56);
}

.studio-performer-status-item.is-warning {
  border-left-color: var(--studio-warning);
  background:
    linear-gradient(90deg, rgba(251, 191, 36, 0.1), transparent 78%),
    rgba(15, 23, 42, 0.56);
}

.studio-performer-status-item.is-danger {
  border-left-color: var(--studio-danger);
  background:
    linear-gradient(90deg, rgba(248, 113, 113, 0.12), transparent 78%),
    rgba(15, 23, 42, 0.56);
}

.studio-performer-status-item strong {
  min-width: 0;
  color: #ffffff;
  font-size: 0.88rem;
  font-weight: 850;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.studio-performer-card-details {
  display: grid;
  gap: 0.48rem;
}

.studio-performer-card-details div {
  display: grid;
  gap: 0.22rem;
  min-width: 0;
  padding: 0.62rem 0.68rem;
  background: rgba(2, 6, 23, 0.34);
  border: 1px solid rgba(125, 211, 252, 0.14);
  border-radius: 8px;
}

.studio-performer-card-details strong {
  min-width: 0;
  color: var(--studio-text-soft);
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.studio-performer-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  justify-content: flex-end;
  padding-top: 0.1rem;
}

.studio-performer-card-actions form {
  margin: 0;
}

.studio-performer-detail-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.studio-sti-expiration-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  min-width: 0;
  margin-bottom: 1rem;
  padding: 1.15rem 1.22rem;
  background:
    linear-gradient(135deg, rgba(8, 47, 73, 0.8), rgba(15, 23, 42, 0.66)),
    rgba(2, 6, 23, 0.58);
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-left: 5px solid var(--studio-cyan);
  border-radius: 8px;
  box-shadow: 0 16px 38px rgba(2, 6, 23, 0.24);
}

.studio-sti-expiration-hero div {
  display: grid;
  gap: 0.28rem;
  min-width: 0;
}

.studio-sti-expiration-hero span {
  color: var(--studio-cyan);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.studio-sti-expiration-hero h2 {
  margin: 0;
  color: #ffffff;
  font-size: clamp(1.55rem, 2vw, 2.3rem);
  font-weight: 950;
  line-height: 1.04;
  overflow-wrap: anywhere;
}

.studio-sti-expiration-hero p {
  max-width: 54rem;
  margin: 0;
  color: var(--studio-text-soft);
  font-size: 0.98rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.studio-sti-expiration-hero > strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 8.5rem;
  max-width: 14rem;
  min-height: 4.5rem;
  padding: 0.75rem 0.9rem;
  color: #ffffff;
  font-size: 1.15rem;
  font-weight: 950;
  line-height: 1.1;
  text-align: center;
  background: rgba(2, 6, 23, 0.46);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 8px;
  overflow-wrap: anywhere;
}

.studio-sti-expiration-clear {
  border-left-color: var(--studio-success);
}

.studio-sti-expiration-clear span {
  color: #86efac;
}

.studio-sti-expiration-warning {
  border-left-color: var(--studio-warning);
}

.studio-sti-expiration-warning span {
  color: #facc15;
}

.studio-sti-expiration-expired,
.studio-sti-expiration-missing {
  border-left-color: var(--studio-danger);
}

.studio-sti-expiration-expired span,
.studio-sti-expiration-missing span {
  color: #fca5a5;
}

.studio-veriff-media-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
  gap: 0.72rem;
}

.studio-veriff-media-card {
  display: grid;
  gap: 0.65rem;
  min-width: 0;
  padding: 0.72rem;
  background: rgba(2, 6, 23, 0.34);
  border: 1px solid rgba(125, 211, 252, 0.15);
  border-radius: 8px;
}

.studio-veriff-media-card > a:first-child {
  display: block;
  min-width: 0;
  overflow: hidden;
  background: rgba(15, 23, 42, 0.72);
  border: 1px solid rgba(125, 211, 252, 0.14);
  border-radius: 8px;
  aspect-ratio: 4 / 3;
}

.studio-veriff-media-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.studio-veriff-media-card div {
  display: grid;
  gap: 0.28rem;
  min-width: 0;
}

.studio-veriff-media-card strong,
.studio-veriff-media-card small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.studio-veriff-media-card strong {
  color: #ffffff;
  font-size: 0.9rem;
  font-weight: 900;
  line-height: 1.18;
}

.studio-veriff-media-card small {
  color: var(--studio-text-muted);
  font-size: 0.76rem;
  line-height: 1.3;
}

.studio-detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
  gap: 0.65rem;
}

.studio-detail-grid > div {
  display: grid;
  gap: 0.22rem;
  min-width: 0;
  padding: 0.68rem 0.74rem;
  background: rgba(2, 6, 23, 0.34);
  border: 1px solid rgba(125, 211, 252, 0.14);
  border-radius: 8px;
}

.studio-detail-grid span,
.studio-timeline-date {
  color: var(--studio-text-muted);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.studio-detail-grid strong {
  min-width: 0;
  color: var(--studio-text-soft);
  font-size: 0.9rem;
  font-weight: 760;
  line-height: 1.35;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.studio-detail-grid strong a,
.studio-timeline-main a {
  color: #ffffff;
  text-decoration: none;
}

.studio-detail-grid strong a:hover,
.studio-detail-grid strong a:focus,
.studio-timeline-main a:hover,
.studio-timeline-main a:focus {
  color: var(--studio-cyan);
  text-decoration: underline;
  text-underline-offset: 0.18rem;
}

.studio-detail-grid-wide {
  grid-column: 1 / -1;
}

.studio-timeline {
  display: grid;
  gap: 0.65rem;
}

.studio-timeline-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.7rem;
  align-items: start;
  min-width: 0;
  padding: 0.78rem 0.82rem;
  background: rgba(2, 6, 23, 0.34);
  border: 1px solid rgba(125, 211, 252, 0.15);
  border-left: 3px solid rgba(103, 232, 249, 0.58);
  border-radius: 8px;
}

.studio-timeline-main {
  display: grid;
  gap: 0.22rem;
  min-width: 0;
}

.studio-timeline-main strong {
  min-width: 0;
  color: #ffffff;
  font-size: 0.98rem;
  font-weight: 900;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

.studio-timeline-main small {
  min-width: 0;
  color: var(--studio-text-muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.studio-timeline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  justify-content: flex-end;
}

.studio-timeline-sublist {
  display: grid;
  grid-column: 1 / -1;
  gap: 0.45rem;
  padding-top: 0.2rem;
}

.studio-timeline-sublist > div {
  display: grid;
  gap: 0.15rem;
  min-width: 0;
  padding: 0.55rem 0.62rem;
  background: rgba(15, 23, 42, 0.5);
  border: 1px solid rgba(125, 211, 252, 0.12);
  border-radius: 8px;
}

.studio-timeline-sublist span {
  color: var(--studio-text-muted);
  font-size: 0.72rem;
  font-weight: 850;
}

.studio-timeline-sublist strong {
  color: #ffffff;
  font-size: 0.88rem;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.studio-timeline-sublist small {
  color: var(--studio-text-muted);
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.studio-json-block {
  max-height: 28rem;
  margin: 0;
  padding: 0.82rem;
  color: #dbeafe;
  background: rgba(2, 6, 23, 0.68);
  border: 1px solid rgba(125, 211, 252, 0.16);
  border-radius: 8px;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.studio-json-block-compact {
  max-height: 16rem;
  margin-top: 0.35rem;
  font-size: 0.78rem;
}

.studio-background-check-option {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  column-gap: 0.9rem;
  row-gap: 0.45rem;
  align-items: center;
  margin: 0 0 0.85rem;
  padding: 0.84rem 0.92rem;
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 8px;
  background: rgba(2, 6, 23, 0.28);
  cursor: pointer;
  transition:
    background-color 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.studio-background-check-input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.studio-background-check-option:hover,
.studio-background-check-option:focus-within {
  border-color: rgba(103, 232, 249, 0.44);
  background: rgba(8, 47, 73, 0.34);
  box-shadow:
    0 16px 36px rgba(2, 6, 23, 0.2),
    0 0 24px rgba(56, 189, 248, 0.1);
  transform: translateY(-1px);
}

.studio-background-check-option:has(.studio-background-check-input:focus-visible) {
  outline: 3px solid rgba(103, 232, 249, 0.24);
  outline-offset: 0.14rem;
}

.studio-background-check-option:has(.studio-background-check-input:checked) {
  border-color: rgba(94, 234, 212, 0.56);
  background:
    linear-gradient(145deg, rgba(20, 184, 166, 0.18), rgba(14, 165, 233, 0.12)),
    rgba(2, 6, 23, 0.54);
  box-shadow:
    0 18px 42px rgba(2, 6, 23, 0.24),
    0 0 28px rgba(45, 212, 191, 0.14);
}

.studio-background-check-icon {
  display: inline-grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  color: var(--studio-accent);
  border: 1px solid rgba(125, 211, 252, 0.2);
  border-radius: 8px;
  background: rgba(125, 211, 252, 0.08);
  transition:
    background-color 0.18s ease,
    border-color 0.18s ease,
    color 0.18s ease,
    transform 0.18s ease;
}

.studio-background-check-option:has(.studio-background-check-input:checked) .studio-background-check-icon {
  color: #031525;
  border-color: rgba(224, 242, 254, 0.72);
  background:
    linear-gradient(135deg, #e0f2fe 0%, var(--studio-cyan) 48%, var(--studio-teal) 100%),
    var(--studio-cyan);
  transform: scale(1.02);
}

.studio-background-check-icon svg {
  width: 1.1rem;
  height: 1.1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.studio-background-check-copy {
  display: grid;
  gap: 0.14rem;
  min-width: 0;
}

.studio-background-check-copy strong {
  color: var(--studio-text);
  font-size: 0.95rem;
  line-height: 1.2;
}

.studio-background-check-copy small,
.studio-background-check-balance {
  color: var(--studio-text-muted);
  font-size: 0.78rem;
  line-height: 1.25;
}

.studio-background-check-balance {
  justify-self: end;
  padding: 0.32rem 0.48rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  white-space: nowrap;
}

@media (max-width: 640px) {
  .studio-background-check-option {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .studio-background-check-balance {
    grid-column: 2;
    justify-self: start;
  }
}

.studio-legal-console .studio-workflow-hero {
  grid-template-columns: 1fr;
  min-height: 0;
}

.studio-legal-mode-prompt {
  display: grid;
  gap: clamp(0.95rem, 2vw, 1.35rem);
  justify-items: center;
  min-height: clamp(16rem, 31vw, 22rem);
  padding: clamp(1rem, 2.8vw, 2rem);
  text-align: center;
}

.studio-legal-mode-heading {
  justify-items: center;
  max-width: 38rem;
}

.studio-legal-mode-heading h3 {
  color: #ffffff;
  font-size: clamp(1.45rem, 3vw, 2.2rem);
  line-height: 1.04;
}

.studio-workflow-progress.studio-legal-mode-nav {
  align-items: stretch;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(0.7rem, 1.8vw, 1rem);
  width: min(100%, 62rem);
  min-height: 0;
  padding: 0;
  overflow: visible;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.studio-workflow-progress.studio-legal-mode-nav button {
  display: flex;
  align-items: center;
  justify-content: center;
  justify-self: stretch;
  flex-direction: column;
  gap: 0.58rem;
  width: 100%;
  min-height: 11rem;
  padding: clamp(0.95rem, 2vw, 1.35rem);
  color: #dffbff;
  text-align: center;
  background:
    linear-gradient(180deg, rgba(8, 47, 73, 0.82), rgba(3, 21, 37, 0.92)),
    rgba(3, 21, 37, 0.9);
  border: 1px solid rgba(103, 232, 249, 0.72);
  box-shadow:
    0 0 0 1px rgba(103, 232, 249, 0.16),
    0 12px 28px rgba(2, 6, 23, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
  transition:
    color 0.2s ease,
    background 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.studio-workflow-progress.studio-legal-mode-nav::before,
.studio-workflow-progress.studio-legal-mode-nav::after {
  display: none;
}

.studio-workflow-progress.studio-legal-mode-nav button:hover,
.studio-workflow-progress.studio-legal-mode-nav button:focus-visible {
  color: #ffffff;
  border-color: rgba(165, 243, 252, 0.96);
  transform: translateY(-0.28rem);
  box-shadow:
    0 0 0 1px rgba(103, 232, 249, 0.32),
    0 0 22px rgba(103, 232, 249, 0.28),
    0 14px 32px rgba(2, 6, 23, 0.26),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.studio-workflow-progress.studio-legal-mode-nav button.active {
  color: #ffffff;
  background:
    linear-gradient(180deg, rgba(14, 116, 144, 0.76), rgba(8, 47, 73, 0.94)),
    rgba(8, 47, 73, 0.95);
  border-color: rgba(224, 242, 254, 0.96);
  box-shadow:
    0 0 0 1px rgba(103, 232, 249, 0.42),
    0 0 28px rgba(103, 232, 249, 0.34),
    0 16px 36px rgba(2, 6, 23, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.studio-workflow-progress.studio-legal-mode-nav button .studio-legal-mode-icon {
  flex: 0 0 auto;
  width: 3rem;
  height: 3rem;
  color: var(--studio-cyan);
  background: rgba(2, 6, 23, 0.5);
  border: 1px solid rgba(103, 232, 249, 0.7);
  border-radius: 8px;
  box-shadow:
    0 0 18px rgba(103, 232, 249, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
  transition:
    color 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.studio-workflow-progress.studio-legal-mode-nav button .studio-legal-mode-icon svg {
  width: 1.45rem;
  height: 1.45rem;
}

.studio-workflow-progress.studio-legal-mode-nav button:hover .studio-legal-mode-icon,
.studio-workflow-progress.studio-legal-mode-nav button:focus-visible .studio-legal-mode-icon {
  color: #ffffff;
  border-color: rgba(224, 242, 254, 0.98);
  transform: scale(1.06);
  box-shadow:
    0 0 24px rgba(103, 232, 249, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.studio-workflow-progress.studio-legal-mode-nav button strong {
  width: 100%;
  color: inherit;
  font-size: 1.05rem;
  line-height: 1.05;
  text-align: center;
}

.studio-workflow-progress.studio-legal-mode-nav button small {
  max-width: 15rem;
  color: var(--studio-text-muted);
  font-size: 0.82rem;
  font-weight: 750;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.studio-workflow-progress.studio-legal-mode-nav button.active small,
.studio-workflow-progress.studio-legal-mode-nav button:hover small,
.studio-workflow-progress.studio-legal-mode-nav button:focus-visible small {
  color: rgba(224, 242, 254, 0.9);
}

.studio-workflow-progress.studio-legal-mode-nav button.active .studio-legal-mode-icon,
.studio-workflow-progress.studio-legal-mode-nav button.complete .studio-legal-mode-icon {
  color: #062235;
  background:
    linear-gradient(135deg, #e0f2fe 0%, var(--studio-cyan) 54%, var(--studio-teal) 100%),
    var(--studio-cyan);
  border-color: rgba(224, 242, 254, 0.96);
  box-shadow:
    0 0 24px rgba(103, 232, 249, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.studio-finance-mode-prompt {
  min-height: clamp(14rem, 24vw, 18rem);
  padding-block: clamp(0.85rem, 2.2vw, 1.45rem);
}

.studio-workflow-progress.studio-finance-mode-nav {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: min(100%, 62rem);
}

.studio-workflow-progress.studio-finance-mode-nav button {
  min-height: 10rem;
}

.studio-finance-detail-heading {
  margin-top: 0.15rem;
}

.studio-finance-reveal-in {
  animation: studioFinanceFieldsReveal 0.36s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.studio-legal-panels {
  display: grid;
  gap: 1rem;
  padding: clamp(1rem, 2.2vw, 1.45rem);
}

.studio-legal-panel,
.studio-legal-form,
.studio-legal-field-stack,
.studio-legal-document-list {
  display: grid;
  gap: 0.9rem;
  min-width: 0;
}

.studio-legal-panel[hidden],
.studio-legal-source-panel[hidden] {
  display: none !important;
}

.studio-legal-panel.active,
.studio-legal-source-panel.active {
  animation: studioWorkflowStepIn 0.28s ease-out both;
}

.studio-legal-intake-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.28fr) minmax(17rem, 0.72fr);
  gap: 1rem;
  align-items: start;
}

.studio-legal-form-section {
  position: relative;
  display: grid;
  gap: 0.9rem;
  min-width: 0;
  padding: 0.9rem;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.72), rgba(8, 47, 73, 0.28)),
    rgba(2, 6, 23, 0.38);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-left: 3px solid rgba(103, 232, 249, 0.58);
  border-radius: 8px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 14px 34px rgba(2, 6, 23, 0.16);
}

.studio-legal-assignment-grid,
.studio-legal-upload-grid,
.studio-legal-save-grid,
.studio-legal-library-grid {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}

.studio-legal-assignment-grid {
  grid-template-columns: minmax(13rem, 1fr) minmax(13rem, 1fr) repeat(2, minmax(8rem, 0.65fr));
  align-items: end;
}

.studio-legal-scene-field {
  grid-column: span 2;
}

.studio-legal-upload-grid {
  grid-template-columns: minmax(13rem, 1fr) minmax(13rem, 1fr);
  align-items: end;
}

.studio-legal-save-grid {
  grid-template-columns: 1fr;
  gap: 1rem;
  align-items: stretch;
}

.studio-legal-save-required-grid,
.studio-legal-save-metadata-grid {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}

.studio-legal-save-required-grid {
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  align-items: end;
}

.studio-legal-save-metadata-grid {
  grid-template-areas:
    "type status notes"
    "performer production notes"
    "scene scene notes";
  grid-template-columns: minmax(0, 0.7fr) minmax(0, 0.7fr) minmax(14rem, 1fr);
  align-items: stretch;
  padding-top: 0.95rem;
  border-top: 1px solid rgba(125, 211, 252, 0.16);
}

.studio-legal-save-type-field {
  grid-area: type;
}

.studio-legal-save-status-field {
  grid-area: status;
}

.studio-legal-save-performer-field {
  grid-area: performer;
}

.studio-legal-save-production-field {
  grid-area: production;
}

.studio-legal-save-scene-field {
  grid-area: scene;
}

.studio-legal-save-title-field .form-control,
.studio-legal-save-required-grid .studio-legal-file-field .form-control {
  min-height: 3.25rem;
}

.studio-legal-file-field,
.studio-legal-notes-field {
  grid-column: span 2;
}

.studio-legal-save-required-grid .studio-legal-file-field {
  grid-column: auto;
}

.studio-legal-save-metadata-grid .studio-legal-notes-field {
  grid-area: notes;
  grid-column: auto;
  grid-template-rows: auto minmax(0, 1fr);
}

.studio-legal-save-metadata-grid .studio-legal-notes-field textarea {
  min-height: 0;
  height: 100%;
  resize: vertical;
}

.studio-legal-library-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.studio-legal-source-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem;
}

.studio-legal-source-option {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.65rem;
  align-items: start;
  min-height: 6.6rem;
  padding: 0.82rem;
  color: var(--studio-text-soft);
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.78), rgba(8, 47, 73, 0.32)),
    rgba(2, 6, 23, 0.52);
  border: 1px solid rgba(125, 211, 252, 0.2);
  border-radius: 8px;
  box-shadow:
    0 14px 34px rgba(2, 6, 23, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  cursor: pointer;
  transition:
    color 0.16s ease,
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease,
    background-color 0.16s ease;
}

.studio-legal-source-option input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.studio-legal-source-option:hover,
.studio-legal-source-option:focus-within {
  color: #ffffff;
  transform: translateY(-1px);
  border-color: rgba(103, 232, 249, 0.42);
  box-shadow:
    0 0 26px rgba(56, 189, 248, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-legal-source-option:has(input:checked) {
  color: #ccfbf1;
  background:
    linear-gradient(145deg, rgba(20, 184, 166, 0.2), rgba(14, 165, 233, 0.14)),
    rgba(2, 6, 23, 0.72);
  border-color: rgba(94, 234, 212, 0.48);
}

.studio-legal-source-option .collab-option-copy strong {
  color: #ffffff;
}

.studio-legal-source-option .collab-option-copy small {
  color: var(--studio-text-muted);
}

.studio-legal-option-marker,
.studio-legal-doc-badge {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  color: #031525;
  font-weight: 950;
  background:
    linear-gradient(135deg, #e0f2fe 0%, var(--studio-cyan) 48%, var(--studio-teal) 100%),
    var(--studio-cyan);
  border: 1px solid rgba(224, 242, 254, 0.62);
  box-shadow:
    0 0 20px rgba(103, 232, 249, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.68);
}

.studio-legal-option-marker {
  width: 2.35rem;
  height: 2.35rem;
  color: #02111f;
  background:
    linear-gradient(135deg, #f8fdff 0%, #93efff 44%, #5eead4 100%),
    var(--studio-cyan);
  border-color: rgba(240, 249, 255, 0.92);
  border-radius: 999px;
  box-shadow:
    0 0 0 1px rgba(103, 232, 249, 0.28),
    0 0 24px rgba(103, 232, 249, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.studio-legal-mode-icon svg,
.studio-legal-option-marker svg {
  width: 1.08rem;
  height: 1.08rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.studio-legal-option-marker svg {
  width: 1.22rem;
  height: 1.22rem;
  stroke-width: 2.35;
}

.studio-legal-source-option:hover .studio-legal-option-marker,
.studio-legal-source-option:focus-within .studio-legal-option-marker,
.studio-legal-source-option:has(input:checked) .studio-legal-option-marker {
  color: #010a12;
  box-shadow:
    0 0 0 1px rgba(240, 249, 255, 0.48),
    0 0 30px rgba(103, 232, 249, 0.44),
    inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.studio-legal-doc-badge {
  min-width: 2.45rem;
  height: 2.2rem;
  padding: 0 0.35rem;
  font-size: 0.64rem;
  letter-spacing: 0;
  border-radius: 8px;
}

.studio-legal-contract-badge {
  min-width: 2.75rem;
  height: 2.75rem;
  color: #ffffff;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.96), rgba(8, 47, 73, 0.82)),
    rgba(2, 6, 23, 0.82);
  border-color: rgba(103, 232, 249, 0.58);
  box-shadow:
    0 0 24px rgba(103, 232, 249, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.studio-legal-panel[data-legal-panel="send"] .studio-legal-source-grid .studio-legal-option-marker,
.studio-legal-panel[data-legal-panel="send"] .studio-legal-source-panel .studio-legal-contract-badge {
  color: #020617;
}

.studio-legal-panel[data-legal-panel="send"] .studio-legal-source-panel .studio-legal-contract-badge {
  background:
    linear-gradient(135deg, #f8fdff 0%, #93efff 44%, #5eead4 100%),
    var(--studio-cyan);
  border-color: rgba(240, 249, 255, 0.92);
  box-shadow:
    0 0 0 1px rgba(103, 232, 249, 0.28),
    0 0 24px rgba(103, 232, 249, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.studio-legal-contract-badge svg {
  width: 1.48rem;
  height: 1.48rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.85;
}

.studio-legal-source-panel {
  display: grid;
  gap: 0.65rem;
}

.studio-legal-document-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
  gap: 0.55rem;
}

.studio-legal-document-choice,
.studio-legal-document-row {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.62rem;
  align-items: center;
  min-height: 4.25rem;
  padding: 0.7rem;
  color: var(--studio-text-soft);
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.68), rgba(8, 47, 73, 0.24)),
    rgba(2, 6, 23, 0.34);
  border: 1px solid rgba(125, 211, 252, 0.16);
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
  transition:
    color 0.16s ease,
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}

.studio-legal-document-choice {
  cursor: pointer;
}

.studio-legal-document-choice input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.studio-legal-document-choice strong,
.studio-legal-document-choice small,
.studio-legal-document-row strong,
.studio-legal-document-row small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.studio-legal-document-choice strong,
.studio-legal-document-row strong {
  color: #ffffff;
  font-size: 0.92rem;
  line-height: 1.25;
}

.studio-legal-document-choice small,
.studio-legal-document-row small {
  color: var(--studio-text-muted);
  font-size: 0.76rem;
}

.studio-legal-document-row {
  grid-template-columns: auto minmax(0, 1fr) auto;
  color: var(--studio-text-soft);
  text-decoration: none;
}

.studio-legal-document-row em {
  color: var(--studio-cyan);
  font-size: 0.74rem;
  font-style: normal;
  font-weight: 900;
  text-align: right;
  text-transform: uppercase;
}

.studio-legal-document-choice:hover,
.studio-legal-document-choice:focus-within,
.studio-legal-document-row:hover,
.studio-legal-document-row:focus-visible {
  color: #ffffff;
  transform: translateY(-1px);
  border-color: rgba(103, 232, 249, 0.38);
  box-shadow:
    0 14px 34px rgba(2, 6, 23, 0.18),
    0 0 22px rgba(56, 189, 248, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-legal-document-choice:has(input:checked) {
  color: #ccfbf1;
  background:
    linear-gradient(90deg, rgba(103, 232, 249, 0.12), transparent 72%),
    rgba(2, 6, 23, 0.62);
  border-color: rgba(94, 234, 212, 0.52);
}

.studio-legal-pdf-preview {
  --studio-legal-pdf-scrollbar-crop: 1.25rem;
  position: relative;
  display: block;
  width: 100%;
  height: 8.5rem;
  margin-top: 0.1rem;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: rgba(103, 232, 249, 0.76) rgba(2, 6, 23, 0.86);
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  color: var(--studio-text-muted);
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.72), rgba(8, 47, 73, 0.32)),
    rgba(2, 6, 23, 0.5);
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-radius: 8px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 12px 28px rgba(2, 6, 23, 0.18);
}

.studio-legal-pdf-preview::-webkit-scrollbar {
  width: 0.5rem;
  height: 0.5rem;
}

.studio-legal-pdf-preview::-webkit-scrollbar-track {
  background:
    linear-gradient(180deg, rgba(15, 23, 42, 0.9), rgba(2, 6, 23, 0.74)),
    rgba(2, 6, 23, 0.86);
  border: 1px solid rgba(125, 211, 252, 0.12);
  border-radius: 999px;
}

.studio-legal-pdf-preview::-webkit-scrollbar-thumb {
  background:
    linear-gradient(180deg, rgba(165, 243, 252, 0.9), rgba(45, 212, 191, 0.72)),
    var(--studio-cyan);
  border: 2px solid rgba(2, 6, 23, 0.66);
  border-radius: 999px;
  box-shadow: 0 0 12px rgba(103, 232, 249, 0.24);
}

.studio-legal-pdf-preview::-webkit-scrollbar-thumb:hover {
  background:
    linear-gradient(180deg, rgba(224, 242, 254, 0.96), rgba(94, 234, 212, 0.86));
}

.studio-legal-pdf-preview.has-preview {
  background: #f8fafc;
  border-color: rgba(224, 242, 254, 0.64);
}

.studio-legal-pdf-frame-crop {
  position: relative;
  display: block;
  width: 100%;
  height: 24rem;
  overflow: hidden;
  background: #f8fafc;
}

.studio-legal-pdf-frame-crop[hidden] {
  display: none;
}

.studio-legal-pdf-preview iframe {
  display: block;
  width: calc(100% + var(--studio-legal-pdf-scrollbar-crop));
  max-width: none;
  height: 24rem;
  min-height: 24rem;
  margin-right: calc(var(--studio-legal-pdf-scrollbar-crop) * -1);
  border: 0;
  pointer-events: none;
}

.studio-legal-pdf-preview-empty {
  display: grid;
  min-height: 100%;
  padding: 0.75rem;
  place-items: center;
  color: rgba(186, 230, 253, 0.76);
  font-size: 0.78rem;
  font-weight: 850;
  text-align: center;
}

.studio-legal-slate {
  position: sticky;
  top: 1rem;
  gap: 1rem;
  min-height: 19rem;
}

.studio-legal-slate-list {
  display: grid;
  gap: 0.55rem;
  margin-top: 1rem;
}

.studio-legal-slate-list div {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
  padding: 0.62rem 0.68rem;
  background:
    linear-gradient(90deg, rgba(103, 232, 249, 0.1), transparent 72%),
    rgba(2, 6, 23, 0.46);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 8px;
}

.studio-legal-slate-list span,
.studio-legal-record-details span {
  color: var(--studio-text-muted);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.studio-legal-slate-list strong {
  min-width: 0;
  color: #ffffff;
  font-size: 0.86rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.studio-legal-actions {
  position: static;
}

.studio-legal-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
  gap: 0.75rem;
}

.studio-legal-record-card {
  position: relative;
  display: grid;
  gap: 0.78rem;
  min-width: 0;
  padding: 0.85rem;
  overflow: hidden;
  color: var(--studio-text);
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.86), rgba(8, 47, 73, 0.42)),
    rgba(2, 6, 23, 0.62);
  border: 1px solid var(--studio-border);
  border-radius: 8px;
  box-shadow:
    0 18px 48px rgba(2, 6, 23, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}

.studio-legal-record-card::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(90deg, rgba(125, 211, 252, 0.08) 1px, transparent 1px),
    linear-gradient(0deg, rgba(94, 234, 212, 0.055) 1px, transparent 1px);
  background-size: 34px 34px;
  border-radius: inherit;
  opacity: 0.36;
}

.studio-legal-record-card > * {
  position: relative;
  z-index: 1;
}

.studio-legal-record-card:hover,
.studio-legal-record-card:focus-within {
  transform: translateY(-2px);
  border-color: var(--studio-border-strong);
  box-shadow:
    0 26px 66px rgba(2, 6, 23, 0.34),
    0 0 28px rgba(56, 189, 248, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.studio-legal-record-header {
  display: flex;
  gap: 0.85rem;
  align-items: flex-start;
  justify-content: space-between;
}

.studio-legal-record-details {
  display: grid;
  gap: 0.48rem;
}

.studio-legal-record-details div {
  display: grid;
  gap: 0.22rem;
  min-width: 0;
  padding: 0.62rem 0.68rem;
  background: rgba(2, 6, 23, 0.34);
  border: 1px solid rgba(125, 211, 252, 0.14);
  border-radius: 8px;
}

.studio-legal-record-details strong {
  min-width: 0;
  color: var(--studio-text-soft);
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.studio-legal-list-row {
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.studio-production-workflow {
  --active-progress: 0%;
  position: relative;
  overflow: hidden;
  padding: 0;
  background:
    linear-gradient(90deg, rgba(125, 211, 252, 0.06) 1px, transparent 1px),
    linear-gradient(0deg, rgba(94, 234, 212, 0.05) 1px, transparent 1px),
    linear-gradient(145deg, rgba(15, 23, 42, 0.92), rgba(8, 47, 73, 0.58)),
    rgba(2, 6, 23, 0.78);
  background-size:
    44px 44px,
    44px 44px,
    auto,
    auto;
}

.studio-production-workflow::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(112deg, transparent 0 34%, rgba(186, 230, 253, 0.13) 48%, transparent 62%),
    linear-gradient(180deg, rgba(2, 6, 23, 0.08), rgba(2, 6, 23, 0.44));
  background-position:
    -80% 0,
    0 0;
  background-size:
    220% 100%,
    auto;
  opacity: 0.74;
  animation: studioWorkflowSweep 40s ease-in-out infinite;
}

.studio-finance-workflow::before {
  animation-duration: 40s;
}

.studio-legal-console::before {
  animation-duration: 40s;
}

.studio-production-workflow > * {
  position: relative;
  z-index: 1;
}

.studio-workflow-hero {
  display: grid;
  grid-template-columns: minmax(15rem, 1fr) minmax(24rem, 34rem);
  gap: 1rem;
  align-items: end;
  min-height: 8.6rem;
  padding: clamp(1rem, 2.2vw, 1.45rem);
  border-bottom: 1px solid rgba(125, 211, 252, 0.2);
}

.studio-workflow-title {
  display: grid;
  gap: 0.35rem;
}

.studio-workflow-title span,
.studio-production-slate span,
.studio-draft-row-header span {
  color: var(--studio-cyan);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.studio-production-workflow .studio-workflow-title h2 {
  margin: 0;
  color: #ffffff;
  font-size: clamp(1.85rem, 4vw, 3rem);
  font-weight: 950;
  line-height: 0.98;
}

.studio-production-workflow #studio-production-workflow-form,
.studio-finance-workflow #studio-finance-workflow-form,
.studio-compliance-report-workflow #studio-compliance-report-form {
  gap: 1rem;
  padding: clamp(1rem, 2.2vw, 1.45rem);
}

.studio-workflow-progress {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.35rem;
  min-height: 4.85rem;
  padding: 0.8rem 0.85rem 0.62rem;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.82), rgba(2, 6, 23, 0.46)),
    rgba(2, 6, 23, 0.46);
  border: 1px solid rgba(103, 232, 249, 0.34);
  border-radius: 8px;
  box-shadow:
    0 18px 48px rgba(2, 6, 23, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-finance-progress {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding-right: 0.45rem;
  padding-left: 0.45rem;
  --finance-active-progress-ratio: 0;
}

.studio-compliance-checkpoints {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.studio-compliance-checkpoints button:nth-child(2) {
  justify-items: center;
  text-align: center;
}

.studio-compliance-checkpoints button:nth-child(3) {
  justify-items: end;
  text-align: right;
}

.studio-finance-progress.is-report-like {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.studio-finance-progress.is-expense {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  --finance-expense-edge-offset: 0.45rem;
  --finance-expense-node-width: clamp(4rem, 16%, 7.2rem);
  --finance-expense-point-02: calc(25% + 0.73rem);
  --finance-expense-point-03: 50%;
  --finance-expense-point-04: calc(75% - 0.73rem);
}

.studio-workflow-progress::before,
.studio-workflow-progress::after {
  position: absolute;
  right: 1.45rem;
  left: 1.45rem;
  top: 1.78rem;
  height: 1px;
  pointer-events: none;
  content: "";
}

.studio-workflow-progress::before {
  background: rgba(125, 211, 252, 0.22);
}

.studio-workflow-progress::after {
  right: auto;
  width: var(--active-progress);
  max-width: calc(100% - 2.9rem);
  background: linear-gradient(90deg, var(--studio-cyan), var(--studio-teal));
  box-shadow: 0 0 18px rgba(103, 232, 249, 0.45);
  transition: width 0.34s ease;
}

.studio-workflow-progress.studio-finance-progress::after {
  right: 1.45rem;
  width: auto;
  max-width: none;
  transform: scaleX(var(--finance-active-progress-ratio));
  transform-origin: left center;
  transition: transform 0.34s ease;
}

.studio-workflow-progress button {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: start;
  gap: 0.42rem;
  min-width: 0;
  min-height: 3rem;
  padding: 0;
  color: var(--studio-text-muted);
  text-align: left;
  background: transparent;
  border: 0;
  border-radius: 8px;
  transition:
    color 0.18s ease,
    opacity 0.18s ease,
    transform 0.18s ease;
}

.studio-workflow-progress button span {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  color: var(--studio-text-muted);
  font-size: 0.72rem;
  font-weight: 950;
  background: rgba(2, 6, 23, 0.88);
  border: 1px solid rgba(125, 211, 252, 0.28);
  border-radius: 999px;
  box-shadow:
    0 0 0 0.22rem rgba(2, 6, 23, 0.86),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transition:
    color 0.18s ease,
    background-color 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease;
}

.studio-finance-progress button:nth-child(2) {
  justify-items: center;
  text-align: center;
}

.studio-finance-progress button:nth-child(3) {
  justify-items: end;
  text-align: right;
}

.studio-finance-progress.is-report-like button:nth-child(3) {
  justify-items: center;
  text-align: center;
}

.studio-finance-progress.is-report-like button:nth-child(4) {
  justify-items: end;
  text-align: right;
}

.studio-finance-progress.is-expense button {
  position: absolute;
  top: 0.8rem;
  width: var(--finance-expense-node-width);
  max-width: none;
}

.studio-finance-progress.is-expense button:nth-child(1) {
  left: var(--finance-expense-edge-offset);
  justify-items: start;
  text-align: left;
}

.studio-finance-progress.is-expense button:nth-child(2) {
  left: var(--finance-expense-point-02);
  justify-items: center;
  text-align: center;
  transform: translateX(-50%);
}

.studio-finance-progress.is-expense button:nth-child(3) {
  left: var(--finance-expense-point-03);
  justify-items: center;
  text-align: center;
  transform: translateX(-50%);
}

.studio-finance-progress.is-expense button:nth-child(4) {
  left: var(--finance-expense-point-04);
  justify-items: center;
  text-align: center;
  transform: translateX(-50%);
}

.studio-finance-progress.is-expense button:nth-child(5) {
  right: var(--finance-expense-edge-offset);
  justify-items: end;
  text-align: right;
}

.studio-workflow-progress button strong {
  min-width: 0;
  color: inherit;
  font-size: 0.78rem;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.studio-workflow-progress button.active {
  color: #ffffff;
  transform: translateY(-1px);
}

.studio-finance-progress.is-expense button:nth-child(2).active,
.studio-finance-progress.is-expense button:nth-child(3).active,
.studio-finance-progress.is-expense button:nth-child(4).active {
  transform: translate(-50%, -1px);
}

.studio-workflow-progress button.complete {
  color: rgba(224, 242, 254, 0.88);
}

.studio-workflow-progress button.active span,
.studio-workflow-progress button.complete span {
  color: #031525;
  background: var(--studio-cyan);
  border-color: rgba(224, 242, 254, 0.86);
  box-shadow:
    0 0 0 0.22rem rgba(2, 6, 23, 0.86),
    0 0 24px rgba(103, 232, 249, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.studio-workflow-progress button:disabled {
  cursor: default;
  opacity: 0.52;
}

.studio-workflow-step,
.studio-schedule-list,
.studio-scene-builder,
.studio-review-list,
.studio-review-signoff,
.studio-production-field-stack {
  display: grid;
  gap: 0.9rem;
}

.studio-workflow-step.active {
  animation: studioWorkflowStepIn 0.32s ease-out both;
}

.studio-workflow-step-heading {
  display: grid;
  gap: 0.25rem;
  max-width: 50rem;
}

.studio-workflow-step-heading span {
  color: var(--studio-cyan);
  font-size: 0.75rem;
  font-weight: 900;
  text-transform: uppercase;
}

.studio-workflow-step-heading h3 {
  margin: 0;
  color: #ffffff;
  font-size: clamp(1.35rem, 2.5vw, 2rem);
  font-weight: 950;
  line-height: 1.05;
}

.studio-scene-selection-grid h4,
.studio-review-grid h4,
.studio-review-heading {
  margin: 0;
  color: #ffffff;
  font-size: 0.95rem;
  font-weight: 900;
}

.studio-production-title-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(16rem, 0.65fr);
  gap: 1rem;
  align-items: stretch;
}

.studio-finance-mode-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

.studio-finance-mode-choice {
  min-height: 3.3rem;
}

.studio-finance-mode-panel {
  display: grid;
  gap: 1rem;
}

.studio-finance-expense-grid,
.studio-finance-payment-grid,
.studio-budget-grid,
.studio-budget-notes-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  align-items: end;
}

.studio-finance-expense-grid {
  grid-template-columns: minmax(13rem, 1.25fr) minmax(8rem, 0.65fr) minmax(14rem, 1.2fr) repeat(2, minmax(8rem, 0.65fr));
}

.studio-finance-expense-primary {
  grid-template-columns: minmax(14rem, 0.9fr) minmax(8rem, 0.45fr);
  align-items: end;
}

.studio-finance-expense-primary .studio-floating-field:not(.studio-finance-details-field) {
  align-self: end;
}

.studio-finance-expense-primary .studio-floating-field:not(.studio-finance-details-field) .form-control {
  min-height: 3.25rem;
}

.studio-finance-occurrence-grid {
  grid-template-columns: minmax(14rem, 1.4fr) repeat(2, minmax(8rem, 0.6fr));
}

.studio-finance-expense-secondary {
  grid-template-columns: minmax(12rem, 1fr) minmax(12rem, 1fr);
  align-items: stretch;
}

.studio-finance-production-field {
  align-self: end;
  gap: 0.72rem;
  padding-top: 0.45rem;
}

.studio-finance-production-field span {
  margin-bottom: 0.1rem;
}

.studio-finance-production-field .form-select {
  min-height: 3.7rem;
  padding-top: 0.8rem;
  padding-bottom: 0.8rem;
}

.studio-budget-grid {
  grid-template-columns: repeat(3, minmax(9rem, 1fr));
}

.studio-budget-notes-grid {
  align-items: stretch;
}

.studio-budget-notes-grid textarea {
  min-height: 7rem;
  resize: vertical;
}

.studio-finance-details-field textarea,
.studio-finance-message-field textarea {
  min-height: 4.5rem;
  resize: vertical;
}

.studio-finance-receipt-upload {
  min-height: 7.25rem;
}

.studio-finance-association-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.studio-finance-assignment-preview {
  margin-top: 0;
}

.studio-finance-report-panel {
  gap: 1rem;
}

.studio-finance-report-panel .studio-report-option-grid {
  max-width: 48rem;
}

.studio-report-option-grid,
.studio-report-checkpoint-grid,
.studio-report-filter-groups {
  display: grid;
  gap: 0.9rem;
  min-width: 0;
}

.studio-report-option-grid {
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}

.studio-report-checkpoint-grid {
  grid-template-columns: 1fr;
  align-items: start;
}

.studio-report-filter-groups {
  grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
  align-items: start;
  padding-top: 0.15rem;
}

.studio-report-filter-group {
  display: grid;
  gap: 0.78rem;
  min-width: 0;
}

.studio-report-filter-group > .studio-report-option-grid {
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
}

.studio-compliance-setup-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(16rem, 0.75fr);
  gap: 1rem;
  align-items: stretch;
}

.studio-compliance-section-grid {
  display: grid;
  gap: 0.95rem;
}

.studio-compliance-section-card {
  padding: 0.9rem;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.5), rgba(8, 47, 73, 0.18)),
    rgba(2, 6, 23, 0.28);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-left: 3px solid rgba(103, 232, 249, 0.56);
  border-radius: 8px;
}

.studio-compliance-picker {
  display: grid;
  gap: 0.6rem;
  margin-top: 0.75rem;
}

.studio-compliance-date-range {
  margin-top: 0.72rem;
}

.studio-compliance-review-confirm {
  max-width: 44rem;
  padding: 0.78rem 0.86rem;
  color: var(--studio-text-soft);
  background:
    linear-gradient(135deg, rgba(14, 116, 144, 0.22), rgba(45, 212, 191, 0.08)),
    rgba(2, 6, 23, 0.46);
  border: 1px solid rgba(103, 232, 249, 0.24);
  border-radius: 8px;
}

[data-report-scope],
[data-report-filters],
[data-report-categories],
[data-report-review] {
  gap: 1.05rem;
  padding-bottom: 0.35rem;
}

[data-report-filters] {
  gap: 1.25rem;
}

[data-report-categories] {
  gap: 1.2rem;
}

[data-report-filters] .studio-workflow-step-heading,
[data-report-categories] .studio-workflow-step-heading {
  max-width: 62rem;
}

[data-report-filters] .studio-report-checkpoint-grid {
  gap: 1.15rem;
}

[data-report-filters] .studio-report-filter-group {
  gap: 0.5rem;
}

[data-report-filters] .studio-report-filter-group h4 {
  line-height: 1.1;
}

[data-report-filters] .studio-report-record-type-grid {
  margin-top: 0;
}

[data-report-categories] > .studio-report-option-grid {
  margin-top: 0.05rem;
}

[data-report-specific-categories] {
  gap: 0.5rem;
  padding-top: 0.1rem;
}

[data-report-specific-categories] .studio-report-filter-heading {
  min-height: 3rem;
  align-items: center;
}

[data-report-specific-categories] .studio-choice-search,
[data-report-specific-categories] .studio-choice-grid {
  margin-top: 0;
}

.studio-expense-type-picker {
  gap: 0.85rem;
}

.studio-expense-type-groups {
  display: grid;
  gap: 1rem;
}

.studio-expense-type-group {
  display: grid;
  gap: 0.55rem;
}

.studio-expense-type-group h4 {
  margin: 0;
  color: #ffffff;
  font-size: 0.92rem;
  font-weight: 900;
}

.studio-expense-type-grid {
  margin-top: 0;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}

.studio-expense-type-search-hint {
  margin: -0.35rem 0 0;
  font-size: 0.78rem;
}

.studio-expense-type-option {
  min-height: 4.6rem;
}

.studio-expense-documentation {
  display: grid;
  gap: 0.85rem;
  margin-top: 0.85rem;
}

.studio-expense-followup-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.82rem;
  align-items: stretch;
}

.studio-expense-guide {
  gap: 0.72rem;
  padding: 0.85rem;
  background: rgba(2, 6, 23, 0.24);
  border: 1px solid rgba(125, 211, 252, 0.16);
  border-radius: 8px;
}

.studio-expense-step-field {
  position: relative;
  gap: 0.38rem;
  min-height: 8.2rem;
  padding: 0.82rem 0.82rem 0.9rem 3.35rem;
  background: rgba(15, 23, 42, 0.38);
  border-color: rgba(125, 211, 252, 0.2);
}

.studio-expense-step-field em {
  position: absolute;
  top: 0.9rem;
  left: 0.82rem;
  display: inline-grid;
  place-items: center;
  width: 1.7rem;
  height: 1.7rem;
  color: #031525;
  font-size: 0.68rem;
  font-style: normal;
  font-weight: 950;
  background: var(--studio-cyan);
  border-radius: 999px;
}

.studio-expense-step-field .form-control {
  min-height: 3.1rem;
}

.studio-expense-step-field textarea.form-control {
  min-height: 5.5rem;
}

.studio-expense-receipt-section .studio-finance-expense-secondary {
  grid-template-columns: minmax(16rem, 24rem);
}

.studio-expense-notes-section {
  margin-top: 0.85rem;
}

.studio-expense-followup-field small,
.studio-finance-receipt-upload small {
  display: block;
  margin-top: 0.22rem;
  color: var(--studio-text-muted);
  font-size: 0.72rem;
  font-weight: 750;
  line-height: 1.25;
}

.studio-finance-receipt-upload.studio-receipt-required {
  border-color: rgba(103, 232, 249, 0.46);
  box-shadow:
    0 0 0 0.16rem rgba(103, 232, 249, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-finance-receipt-upload [data-receipt-required] {
  color: var(--studio-cyan);
}

.studio-report-filter-heading {
  display: flex;
  gap: 0.6rem;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
}

.studio-report-filter-heading h4,
.studio-report-filter-group h4 {
  margin: 0;
  color: #ffffff;
  font-size: 0.95rem;
  font-weight: 900;
}

.studio-report-filter-heading .btn {
  flex: 0 0 auto;
  white-space: nowrap;
}

.studio-report-option,
.studio-report-check-option {
  grid-template-columns: auto minmax(0, 1fr);
  min-height: 2.6rem;
  align-items: center;
  padding-block: 0.62rem;
}

.studio-report-option input[type="radio"],
.studio-report-check-option input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

.studio-report-option-icon {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  color: var(--studio-text-muted);
  background: rgba(2, 6, 23, 0.62);
  border: 1px solid rgba(125, 211, 252, 0.24);
  border-radius: 8px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 10px 24px rgba(2, 6, 23, 0.14);
  transition:
    color 0.16s ease,
    background-color 0.16s ease,
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}

.studio-report-option-icon svg {
  width: 1.12rem;
  height: 1.12rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.studio-report-option:hover .studio-report-option-icon,
.studio-report-option:focus-within .studio-report-option-icon,
.studio-report-check-option:hover .studio-report-option-icon,
.studio-report-check-option:focus-within .studio-report-option-icon {
  color: #ffffff;
  border-color: rgba(103, 232, 249, 0.48);
  transform: translateY(-1px);
}

.studio-report-option:has(input[type="radio"]:checked) .studio-report-option-icon,
.studio-report-check-option:has(input[type="checkbox"]:checked) .studio-report-option-icon {
  color: #031525;
  background:
    linear-gradient(135deg, #e0f2fe 0%, var(--studio-cyan) 58%, var(--studio-teal) 100%),
    var(--studio-cyan);
  border-color: rgba(224, 242, 254, 0.92);
  box-shadow:
    0 0 0 0.18rem rgba(103, 232, 249, 0.14),
    0 0 22px rgba(103, 232, 249, 0.36),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.studio-report-option:has(input[type="radio"]:focus-visible),
.studio-report-check-option:has(input[type="checkbox"]:focus-visible) {
  outline: 2px solid rgba(103, 232, 249, 0.72);
  outline-offset: 2px;
}

.studio-report-record-type-grid {
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  max-width: 42rem;
}

.studio-finance-history-row {
  align-items: start;
  grid-template-columns: minmax(0, 1fr) minmax(7.25rem, auto);
  overflow: hidden;
}

.studio-finance-history-amount {
  display: grid;
  gap: 0.45rem;
  justify-items: end;
  min-width: 7.25rem;
}

.studio-finance-history-amount form {
  margin: 0;
}

.studio-finance-history-amount .btn {
  max-width: 100%;
  white-space: nowrap;
}

.studio-floating-field {
  display: grid;
  gap: 0.42rem;
  min-width: 0;
}

.studio-form .studio-floating-field span,
.studio-floating-field span {
  color: rgba(186, 230, 253, 0.82);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.studio-title-field .form-control {
  min-height: 3.25rem;
  font-size: 1.12rem;
  font-weight: 850;
}

.studio-production-title-grid textarea.form-control {
  min-height: 10.25rem;
  resize: vertical;
}

.studio-production-slate {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-width: 0;
  min-height: 15.2rem;
  padding: 1rem;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(2, 6, 23, 0.28), rgba(2, 6, 23, 0.64)),
    linear-gradient(90deg, rgba(125, 211, 252, 0.1) 1px, transparent 1px),
    linear-gradient(0deg, rgba(94, 234, 212, 0.08) 1px, transparent 1px),
    rgba(8, 47, 73, 0.26);
  background-size:
    auto,
    32px 32px,
    32px 32px,
    auto;
  border: 1px solid rgba(103, 232, 249, 0.26);
  border-left: 3px solid var(--studio-cyan);
  border-radius: 8px;
  box-shadow:
    0 18px 44px rgba(2, 6, 23, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-production-slate::before {
  position: absolute;
  inset: 0.85rem 0.85rem auto auto;
  width: 3.8rem;
  height: 0.55rem;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(90deg, var(--studio-cyan), transparent 76%),
    linear-gradient(90deg, transparent 0 14%, rgba(255, 255, 255, 0.72) 14% 22%, transparent 22% 36%, rgba(255, 255, 255, 0.72) 36% 44%, transparent 44%);
  opacity: 0.78;
}

.studio-production-slate strong {
  display: block;
  min-width: 0;
  margin-top: 0.42rem;
  color: #ffffff;
  font-size: clamp(1.35rem, 2.5vw, 2.1rem);
  font-weight: 950;
  line-height: 1;
  overflow-wrap: anywhere;
}

.studio-production-slate p {
  min-width: 0;
  margin: 0.65rem 0 0;
  color: var(--studio-text-soft);
  font-size: 0.9rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.studio-schedule-row,
.studio-scene-draft,
.studio-review-item {
  position: relative;
  padding: 0.9rem;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.72), rgba(8, 47, 73, 0.28)),
    rgba(2, 6, 23, 0.38);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-left: 3px solid rgba(103, 232, 249, 0.58);
  border-radius: 8px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 14px 34px rgba(2, 6, 23, 0.16);
}

.studio-schedule-row,
.studio-scene-draft {
  animation: studioWorkflowRowIn 0.24s ease-out both;
}

.studio-draft-row-header,
.studio-scene-draft-heading {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.8rem;
}

.studio-draft-row-header .btn {
  flex: 0 0 auto;
}

.studio-schedule-fields {
  display: grid;
  grid-template-columns: minmax(14rem, 1.5fr) repeat(3, minmax(8rem, 1fr));
  gap: 0.75rem;
  align-items: end;
}

.studio-scene-fields {
  display: grid;
  grid-template-columns: minmax(13rem, 1.35fr) minmax(11rem, 1fr) repeat(3, minmax(7.2rem, 0.72fr));
  gap: 0.75rem;
  align-items: end;
}

.studio-scene-draft {
  display: grid;
  gap: 0.95rem;
}

.studio-scene-selection-grid,
.studio-review-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.75fr) minmax(0, 1fr);
  gap: 0.9rem;
}

.studio-scene-selection-grid {
  margin-top: 0.75rem;
  row-gap: 1.25rem;
}

.studio-scene-selection-grid > div {
  margin-top: 0.35rem;
}

.studio-choice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: 0.5rem;
  margin-top: 0.58rem;
}

.studio-activity-grid,
.studio-position-grid {
  max-height: 18rem;
  overflow: auto;
  padding-right: 0.35rem;
  scrollbar-color: rgba(103, 232, 249, 0.76) rgba(2, 6, 23, 0.34);
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}

.studio-production-workflow textarea.form-control {
  scrollbar-color: rgba(103, 232, 249, 0.76) rgba(2, 6, 23, 0.34);
  scrollbar-width: thin;
}

.studio-activity-grid::-webkit-scrollbar,
.studio-position-grid::-webkit-scrollbar,
.studio-production-workflow textarea.form-control::-webkit-scrollbar {
  width: 0.62rem;
}

.studio-activity-grid::-webkit-scrollbar-track,
.studio-position-grid::-webkit-scrollbar-track,
.studio-production-workflow textarea.form-control::-webkit-scrollbar-track {
  background:
    linear-gradient(180deg, rgba(15, 23, 42, 0.74), rgba(2, 6, 23, 0.42)),
    rgba(2, 6, 23, 0.34);
  border: 1px solid rgba(125, 211, 252, 0.12);
  border-radius: 999px;
}

.studio-activity-grid::-webkit-scrollbar-thumb,
.studio-position-grid::-webkit-scrollbar-thumb,
.studio-production-workflow textarea.form-control::-webkit-scrollbar-thumb {
  background:
    linear-gradient(180deg, var(--studio-cyan), var(--studio-teal)),
    var(--studio-cyan);
  border: 2px solid rgba(2, 6, 23, 0.58);
  border-radius: 999px;
  box-shadow: 0 0 14px rgba(103, 232, 249, 0.28);
}

.studio-activity-grid::-webkit-scrollbar-thumb:hover,
.studio-position-grid::-webkit-scrollbar-thumb:hover,
.studio-production-workflow textarea.form-control::-webkit-scrollbar-thumb:hover {
  background:
    linear-gradient(180deg, #e0f2fe, var(--studio-cyan) 54%, var(--studio-teal)),
    var(--studio-cyan);
}

.studio-choice-search {
  margin-top: 0.58rem;
}

.studio-choice-search .form-control {
  min-height: 2.25rem;
}

.studio-choice {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.5rem;
  align-items: start;
  min-height: 2.55rem;
  padding: 0.54rem 0.6rem;
  color: var(--studio-text-soft);
  background: rgba(15, 23, 42, 0.58);
  border: 1px solid rgba(125, 211, 252, 0.16);
  border-radius: 8px;
  cursor: pointer;
  transition:
    color 0.16s ease,
    background-color 0.16s ease,
    border-color 0.16s ease,
    transform 0.16s ease,
    box-shadow 0.16s ease;
}

.studio-choice:hover,
.studio-choice:focus-within {
  color: #ffffff;
  transform: translateY(-1px);
  border-color: rgba(103, 232, 249, 0.34);
  box-shadow: 0 12px 28px rgba(2, 6, 23, 0.18);
}

.studio-choice input,
.studio-checkbox-row input {
  width: 1rem;
  height: 1rem;
  margin-top: 0.16rem;
  accent-color: var(--studio-cyan);
}

.studio-choice span,
.studio-checkbox-row span {
  min-width: 0;
  color: inherit;
  font-size: 0.84rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.studio-choice span small {
  display: block;
  margin-top: 0.18rem;
  color: var(--studio-text-muted);
  font-size: 0.72rem;
  font-weight: 750;
  line-height: 1.2;
}

.studio-choice:has(input:checked) {
  color: #ffffff;
  background:
    linear-gradient(135deg, rgba(14, 116, 144, 0.48), rgba(45, 212, 191, 0.12)),
    rgba(15, 23, 42, 0.62);
  border-color: rgba(103, 232, 249, 0.5);
  box-shadow:
    0 12px 32px rgba(2, 6, 23, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-choice-grid.studio-field-invalid,
.studio-scene-selection-grid > div.studio-field-invalid .studio-choice-grid {
  background: rgba(127, 29, 29, 0.12);
  border-radius: 8px;
  outline: 1px solid rgba(248, 113, 113, 0.58);
  outline-offset: 0.25rem;
  box-shadow:
    0 0 0 0.2rem rgba(248, 113, 113, 0.12),
    0 0 28px rgba(248, 113, 113, 0.2);
}

.studio-sti-test-picker.studio-field-invalid,
.studio-sti-site-options.studio-field-invalid,
.studio-performer-contracts.studio-field-invalid {
  border-radius: 8px;
  outline: 1px solid rgba(248, 113, 113, 0.58);
  outline-offset: 0.25rem;
  box-shadow:
    0 0 0 0.2rem rgba(248, 113, 113, 0.12),
    0 0 28px rgba(248, 113, 113, 0.2);
}

.studio-checkbox-row.studio-field-invalid {
  padding: 0.55rem;
  background: rgba(127, 29, 29, 0.12);
  border: 1px solid rgba(248, 113, 113, 0.58);
  border-radius: 8px;
  box-shadow:
    0 0 0 0.2rem rgba(248, 113, 113, 0.12),
    0 0 24px rgba(248, 113, 113, 0.2);
}

.studio-reference-upload {
  display: grid;
  gap: 0.55rem;
  min-height: 8.4rem;
  padding: 0.75rem;
  align-content: center;
  color: var(--studio-text-soft);
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.68), rgba(8, 47, 73, 0.24)),
    rgba(2, 6, 23, 0.34);
  border: 1px dashed rgba(103, 232, 249, 0.34);
  border-radius: 8px;
}

.studio-reference-section .studio-reference-upload {
  margin-top: 0.9rem;
}

.studio-reference-upload span {
  min-width: 0;
  margin-bottom: 0.15rem;
  color: var(--studio-text-soft);
  font-size: 0.86rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.studio-add-row-button {
  justify-self: start;
}

.studio-workflow-actions {
  position: sticky;
  bottom: 0.75rem;
  z-index: 3;
  display: flex;
  gap: 0.65rem;
  justify-content: flex-end;
  padding: 0.65rem;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.84), rgba(2, 6, 23, 0.62)),
    rgba(2, 6, 23, 0.62);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 8px;
  box-shadow:
    0 16px 42px rgba(2, 6, 23, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(14px);
}

.studio-review-list {
  margin-top: 0.6rem;
}

.studio-review-grid > div {
  min-width: 0;
}

.studio-review-item {
  display: grid;
  gap: 0.25rem;
}

.studio-review-item strong {
  color: #ffffff;
}

.studio-review-item small {
  color: var(--studio-text-muted);
  overflow-wrap: anywhere;
}

.studio-review-scenes {
  margin-bottom: 0.25rem;
}

.studio-review-signoff {
  max-width: 44rem;
}

.studio-checkbox-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.55rem;
  align-items: start;
}

.studio-investigation-consent {
  margin-top: 0.9rem;
  padding: 0.78rem 0.86rem;
  color: var(--studio-text-soft);
  background:
    linear-gradient(135deg, rgba(14, 116, 144, 0.22), rgba(45, 212, 191, 0.08)),
    rgba(2, 6, 23, 0.46);
  border: 1px solid rgba(103, 232, 249, 0.24);
  border-left: 3px solid var(--studio-cyan);
  border-radius: 8px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 14px 32px rgba(2, 6, 23, 0.16);
}

.studio-investigation-consent input {
  width: 1.05rem;
  height: 1.05rem;
  margin-top: 0.16rem;
}

.studio-investigation-consent span {
  display: grid;
  gap: 0.16rem;
  min-width: 0;
}

.studio-investigation-consent strong {
  color: #ffffff;
  font-size: 0.9rem;
  font-weight: 900;
  line-height: 1.2;
}

.studio-investigation-consent small {
  color: var(--studio-text-muted);
  font-size: 0.78rem;
  font-weight: 750;
  line-height: 1.35;
}

.studio-production-staff-picker {
  display: grid;
  gap: 0.7rem;
  margin-top: 1rem;
  padding: 0.86rem;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.68), rgba(8, 47, 73, 0.28)),
    rgba(2, 6, 23, 0.42);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.studio-production-subsection-heading,
.studio-staff-group-heading,
.studio-staff-role-heading,
.studio-production-date-heading {
  display: flex;
  gap: 0.75rem;
  align-items: end;
  justify-content: space-between;
  min-width: 0;
}

.studio-production-subsection-heading span,
.studio-staff-group-heading span,
.studio-production-date-heading span {
  color: var(--studio-cyan);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.studio-production-subsection-heading h4,
.studio-staff-group-heading h3,
.studio-staff-role-heading h4,
.studio-production-date-heading h3 {
  margin: 0;
  color: #ffffff;
  font-weight: 900;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.studio-production-subsection-heading h4,
.studio-staff-role-heading h4 {
  font-size: 0.96rem;
}

.studio-staff-group-heading h3,
.studio-production-date-heading h3 {
  font-size: 1.08rem;
}

.studio-staff-role-heading span {
  color: var(--studio-text-muted);
  font-size: 0.78rem;
  font-weight: 800;
}

.studio-staff-choice strong,
.studio-staff-choice small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.studio-staff-choice strong {
  color: #ffffff;
  font-size: 0.84rem;
  line-height: 1.18;
}

.studio-staff-choice small {
  color: var(--studio-text-muted);
  font-size: 0.72rem;
  font-weight: 750;
}

.studio-staff-schedule-warning {
  margin: 0;
}

.studio-staff-shift-planner {
  margin-bottom: 0.95rem;
}

.studio-staff-shift-list {
  display: grid;
  gap: 0.68rem;
}

.studio-staff-shift-row {
  display: grid;
  gap: 0.65rem;
  min-width: 0;
  padding: 0.76rem;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.72), rgba(8, 47, 73, 0.24)),
    rgba(2, 6, 23, 0.38);
  border: 1px solid rgba(125, 211, 252, 0.16);
  border-left: 3px solid rgba(45, 212, 191, 0.58);
  border-radius: 8px;
}

.studio-staff-shift-fields {
  display: grid;
  grid-template-columns: minmax(13rem, 1.35fr) minmax(9rem, 0.9fr) repeat(2, minmax(7rem, 0.55fr));
  gap: 0.65rem;
  align-items: end;
}

.studio-staff-rate-label {
  color: var(--studio-text-muted);
  font-size: 0.76rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.studio-staff-cost-estimate {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.18rem 0.75rem;
  align-items: end;
  padding: 0.74rem 0.82rem;
  background:
    linear-gradient(135deg, rgba(14, 116, 144, 0.28), rgba(45, 212, 191, 0.1)),
    rgba(2, 6, 23, 0.42);
  border: 1px solid rgba(103, 232, 249, 0.22);
  border-radius: 8px;
}

.studio-staff-cost-estimate small,
.studio-staff-cost-estimate span {
  min-width: 0;
  color: var(--studio-text-muted);
  font-weight: 800;
  overflow-wrap: anywhere;
}

.studio-staff-cost-estimate small {
  font-size: 0.72rem;
  text-transform: uppercase;
}

.studio-staff-cost-estimate strong {
  grid-row: span 2;
  color: #ffffff;
  font-size: 1.28rem;
  font-weight: 950;
  line-height: 1;
  white-space: nowrap;
}

.studio-production-script-upload {
  display: grid;
  gap: 0.7rem;
  max-width: 42rem;
}

.studio-script-upload {
  min-height: 9.4rem;
}

.studio-production-calendar {
  display: grid;
  gap: 1rem;
}

.studio-production-date-group {
  display: grid;
  gap: 0.72rem;
}

.studio-production-date-heading {
  padding: 0.72rem 0.82rem;
  background:
    linear-gradient(135deg, rgba(14, 116, 144, 0.26), rgba(45, 212, 191, 0.08)),
    rgba(2, 6, 23, 0.38);
  border: 1px solid rgba(103, 232, 249, 0.2);
  border-radius: 8px;
}

.studio-production-calendar-card {
  gap: 0.58rem;
}

.studio-production-card-date {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  justify-content: space-between;
  padding: 0.48rem 0.58rem;
  color: #ffffff;
  background:
    linear-gradient(135deg, rgba(8, 47, 73, 0.84), rgba(14, 116, 144, 0.36)),
    rgba(2, 6, 23, 0.52);
  border: 1px solid rgba(103, 232, 249, 0.24);
  border-radius: 8px;
}

.studio-production-card-date span {
  color: #ffffff;
  font-size: 0.82rem;
  font-weight: 900;
}

.studio-production-card-date small {
  color: var(--studio-text-muted);
  font-size: 0.72rem;
  font-weight: 800;
}

.studio-production-card-people {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem;
}

.studio-production-card-people div {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
  padding: 0.56rem;
  background: rgba(2, 6, 23, 0.34);
  border: 1px solid rgba(125, 211, 252, 0.14);
  border-radius: 8px;
}

.studio-production-card-people small {
  color: var(--studio-cyan);
  font-size: 0.68rem;
  font-weight: 900;
  text-transform: uppercase;
}

.studio-production-card-people span {
  color: var(--studio-text-soft);
  font-size: 0.78rem;
  line-height: 1.28;
  overflow-wrap: anywhere;
}

.studio-production-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  justify-content: flex-end;
  margin-top: 0.15rem;
}

.studio-production-card-actions .btn {
  min-width: 6.2rem;
  white-space: nowrap;
}

.studio-staff-primary-grid,
.studio-staff-compensation-grid,
.studio-staff-schedule-grid {
  display: grid;
  gap: 0.75rem;
  align-items: end;
}

.studio-staff-primary-grid {
  grid-template-columns: minmax(14rem, 1.4fr) minmax(11rem, 1fr) minmax(8rem, 0.7fr) minmax(11rem, 1fr);
}

.studio-staff-schedule-grid {
  grid-template-columns: minmax(13rem, 1fr) repeat(2, minmax(7rem, 0.5fr));
}

.studio-staff-compensation-grid {
  grid-template-columns: minmax(11rem, 0.8fr) minmax(11rem, 0.8fr) minmax(16rem, 1.4fr);
}

.studio-staff-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0.5rem;
}

.studio-staff-groups {
  display: grid;
  gap: 1rem;
}

.studio-staff-department {
  display: grid;
  gap: 0.72rem;
  padding: 0.8rem;
  background: rgba(2, 6, 23, 0.3);
  border: 1px solid rgba(125, 211, 252, 0.14);
  border-radius: 8px;
}

.studio-staff-role-group {
  display: grid;
  gap: 0.62rem;
}

.studio-staff-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
  gap: 0.72rem;
}

.studio-staff-card {
  display: grid;
  gap: 0.68rem;
  min-width: 0;
  padding: 0.75rem;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.74), rgba(8, 47, 73, 0.28)),
    rgba(2, 6, 23, 0.46);
  border: 1px solid rgba(125, 211, 252, 0.16);
  border-radius: 8px;
}

.studio-staff-card-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: start;
}

.studio-staff-card-main strong,
.studio-staff-card-main small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.studio-staff-card-main strong {
  color: #ffffff;
  font-weight: 900;
}

.studio-staff-card-main small {
  color: var(--studio-text-muted);
  font-size: 0.78rem;
  font-weight: 750;
}

.studio-staff-edit {
  display: grid;
  gap: 0.7rem;
}

.studio-staff-edit summary {
  color: var(--studio-cyan);
  font-size: 0.82rem;
  font-weight: 900;
  cursor: pointer;
}

.studio-staff-edit[open] {
  padding-top: 0.55rem;
  border-top: 1px solid rgba(125, 211, 252, 0.14);
}

.studio-staff-edit .studio-form {
  margin-top: 0.68rem;
}

.studio-production-team-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem;
}

.studio-production-team-section {
  display: grid;
  gap: 0.62rem;
  min-width: 0;
}

.studio-configure-form {
  gap: 1rem;
}

.studio-configure-section {
  display: grid;
  gap: 1rem;
  padding: 1.05rem;
}

.studio-configure-section-heading,
.studio-production-scene-editor-heading {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
}

.studio-configure-section-heading div,
.studio-production-scene-editor-heading div {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}

.studio-configure-section-heading span,
.studio-production-scene-editor-heading span {
  color: var(--studio-cyan);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.studio-configure-section-heading h3,
.studio-production-scene-editor-heading h4 {
  margin: 0;
  color: #ffffff;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.studio-configure-section-heading small,
.studio-production-scene-editor-heading small {
  color: var(--studio-text-muted);
  font-size: 0.78rem;
  font-weight: 800;
  white-space: nowrap;
}

.studio-configure-grid {
  gap: 1rem;
}

.studio-configure-meta-grid,
.studio-scene-editor-grid,
.studio-scene-editor-notes-grid {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}

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

.studio-production-config-page .studio-production-staff-picker,
.studio-configure-inline-fieldset {
  display: grid;
  gap: 0.72rem;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.studio-production-config-page .studio-production-staff-picker legend,
.studio-configure-inline-fieldset legend {
  margin: 0;
  color: var(--studio-text-muted);
  font-size: 0.82rem;
  font-weight: 850;
}

.studio-production-staff-choice-grid,
.studio-production-scene-editor-list {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}

.studio-production-staff-choice-grid {
  grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
}

.studio-production-staff-choice {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.65rem;
  align-items: flex-start;
  min-width: 0;
  min-height: 5.25rem;
  padding: 0.72rem;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.72), rgba(8, 47, 73, 0.28)),
    rgba(2, 6, 23, 0.42);
  border: 1px solid rgba(125, 211, 252, 0.16);
  border-radius: 8px;
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}

.studio-production-staff-choice:hover,
.studio-production-staff-choice:focus-within {
  border-color: rgba(103, 232, 249, 0.44);
  box-shadow:
    0 14px 34px rgba(2, 6, 23, 0.22),
    0 0 22px rgba(103, 232, 249, 0.12);
  transform: translateY(-1px);
}

.studio-production-staff-choice:has(input:checked) {
  border-color: rgba(94, 234, 212, 0.52);
  background:
    linear-gradient(135deg, rgba(13, 148, 136, 0.18), rgba(14, 165, 233, 0.14)),
    rgba(2, 6, 23, 0.5);
}

.studio-production-staff-choice .form-check-input {
  margin-top: 0.16rem;
}

.studio-staff-budget-update-option {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.65rem;
  align-items: flex-start;
  min-width: 0;
  padding: 0.78rem 0.84rem;
  color: var(--studio-text-soft);
  background:
    linear-gradient(135deg, rgba(14, 165, 233, 0.14), rgba(45, 212, 191, 0.08)),
    rgba(15, 23, 42, 0.58);
  border: 1px solid rgba(125, 211, 252, 0.2);
  border-radius: 8px;
}

.studio-staff-budget-update-option input {
  width: 1rem;
  height: 1rem;
  margin-top: 0.16rem;
  accent-color: var(--studio-cyan);
}

.studio-staff-budget-update-option span {
  display: grid;
  gap: 0.16rem;
  min-width: 0;
}

.studio-staff-budget-update-option strong,
.studio-staff-budget-update-option small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.studio-staff-budget-update-option strong {
  color: #ffffff;
  font-size: 0.88rem;
  font-weight: 900;
}

.studio-staff-budget-update-option small {
  color: var(--studio-text-muted);
  font-size: 0.76rem;
  font-weight: 750;
  line-height: 1.3;
}

.studio-staff-budget-update-option:has(input:checked) {
  border-color: rgba(94, 234, 212, 0.52);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-production-staff-copy {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}

.studio-production-staff-copy strong,
.studio-production-staff-copy small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.studio-production-staff-copy strong {
  color: #ffffff;
  font-size: 0.9rem;
}

.studio-production-staff-copy small {
  color: var(--studio-text-muted);
  font-size: 0.76rem;
  line-height: 1.25;
}

.studio-production-scene-editor {
  display: grid;
  gap: 0.9rem;
  min-width: 0;
  padding: 0.88rem;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.76), rgba(8, 47, 73, 0.3)),
    rgba(2, 6, 23, 0.46);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.studio-production-scene-editor-heading {
  padding-bottom: 0.72rem;
  border-bottom: 1px solid rgba(125, 211, 252, 0.14);
}

.studio-scene-editor-grid {
  grid-template-columns: minmax(14rem, 1.3fr) minmax(8rem, 0.65fr) minmax(9rem, 0.7fr) minmax(9rem, 0.7fr);
  align-items: end;
}

.studio-scene-editor-notes-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.studio-scene-editor-notes-grid textarea {
  min-height: 6.4rem;
  resize: vertical;
}

.studio-configure-save-bar {
  position: sticky;
  bottom: 0.85rem;
  z-index: 5;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
  justify-content: flex-end;
  padding: 0.75rem;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.92), rgba(8, 47, 73, 0.68)),
    rgba(2, 6, 23, 0.86);
  border: 1px solid rgba(125, 211, 252, 0.26);
  border-radius: 8px;
  box-shadow:
    0 18px 42px rgba(2, 6, 23, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-configure-production-button {
  display: inline-flex;
  gap: 0.42rem;
  align-items: center;
}

.studio-button-icon {
  display: inline-flex;
  flex: 0 0 auto;
  width: 1rem;
  height: 1rem;
  color: currentColor;
}

.studio-button-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.studio-script-meta {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.8fr) minmax(0, 0.7fr);
  gap: 0.65rem;
  margin-bottom: 0.75rem;
}

.studio-script-meta article {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
  padding: 0.64rem 0.7rem;
  background: rgba(2, 6, 23, 0.34);
  border: 1px solid rgba(125, 211, 252, 0.14);
  border-radius: 8px;
}

.studio-script-meta small {
  color: var(--studio-cyan);
  font-size: 0.68rem;
  font-weight: 900;
  text-transform: uppercase;
}

.studio-script-meta strong {
  min-width: 0;
  color: #ffffff;
  font-size: 0.86rem;
  line-height: 1.22;
  overflow-wrap: anywhere;
}

.studio-script-preview {
  max-height: 30rem;
  margin: 0;
  padding: 0.9rem;
  overflow: auto;
  color: var(--studio-text-soft);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.76), rgba(8, 47, 73, 0.26)),
    rgba(2, 6, 23, 0.46);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-left: 3px solid var(--studio-cyan);
  border-radius: 8px;
}

.studio-warning-text {
  color: var(--studio-warning) !important;
}

@media (max-width: 980px) {
  .studio-staff-primary-grid,
  .studio-staff-compensation-grid,
  .studio-staff-schedule-grid,
  .studio-staff-shift-fields,
  .studio-production-card-people,
  .studio-production-team-grid,
  .studio-configure-meta-grid,
  .studio-scene-editor-grid,
  .studio-scene-editor-notes-grid,
  .studio-script-meta {
    grid-template-columns: 1fr;
  }

  .studio-staff-cost-estimate {
    grid-template-columns: 1fr;
  }

  .studio-staff-cost-estimate strong {
    grid-row: auto;
  }

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

@keyframes studioWorkflowSweep {
  0%,
  45%,
  100% {
    background-position:
      -80% 0,
      0 0;
  }

  70% {
    background-position:
      140% 0,
      0 0;
  }
}

@keyframes studioWorkflowStepIn {
  from {
    opacity: 0;
    transform: translateY(0.65rem);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes studioWorkflowRowIn {
  from {
    opacity: 0;
    transform: translateY(0.4rem);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes studioFinanceFieldsReveal {
  from {
    opacity: 0;
    transform: translateY(0.8rem);
    filter: blur(3px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

.studio-scene-notes {
  display: grid;
  gap: 0.45rem;
  padding: 0.7rem;
  color: var(--studio-text-muted);
  background: rgba(2, 6, 23, 0.36);
  border: 1px solid rgba(125, 211, 252, 0.14);
  border-radius: 8px;
}

.studio-scene-notes p {
  margin: 0;
  overflow-wrap: anywhere;
}

.studio-scene-notes strong {
  color: #ffffff;
}

.studio-body .form-control,
.studio-body .form-select {
  color: var(--studio-text);
  color-scheme: dark;
  background: rgba(2, 6, 23, 0.62);
  border-color: rgba(125, 211, 252, 0.26);
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.studio-body .form-control::placeholder {
  color: rgba(203, 213, 225, 0.52);
}

.studio-body .form-control:hover,
.studio-body .form-select:hover {
  border-color: rgba(103, 232, 249, 0.44);
}

.studio-body .form-control:focus,
.studio-body .form-select:focus {
  color: #ffffff;
  background: rgba(2, 6, 23, 0.78);
  border-color: var(--studio-cyan);
  box-shadow:
    0 0 0 0.2rem rgba(103, 232, 249, 0.14),
    0 0 24px rgba(45, 212, 191, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-body .form-control.studio-field-invalid,
.studio-body .form-select.studio-field-invalid,
.studio-body .studio-field-invalid > .form-control,
.studio-body .studio-field-invalid > .form-select {
  border-color: rgba(248, 113, 113, 0.86);
  box-shadow:
    0 0 0 0.2rem rgba(248, 113, 113, 0.16),
    0 0 26px rgba(248, 113, 113, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-body .form-select option {
  color: #e0f2fe;
  background: #07111f;
}

.studio-body .form-control[readonly],
.studio-body .form-control:disabled,
.studio-body .form-select:disabled {
  color: rgba(224, 242, 254, 0.72);
  background: rgba(15, 23, 42, 0.72);
  border-color: rgba(125, 211, 252, 0.18);
}

.studio-body .form-control-color {
  min-height: 2.5rem;
  padding: 0.28rem;
}

.studio-body input[type="color"]::-webkit-color-swatch-wrapper {
  padding: 0;
}

.studio-body input[type="color"]::-webkit-color-swatch {
  border: 1px solid rgba(224, 242, 254, 0.36);
  border-radius: 6px;
}

.studio-body input[type="color"]::-moz-color-swatch {
  border: 1px solid rgba(224, 242, 254, 0.36);
  border-radius: 6px;
}

.studio-body .btn {
  border-radius: 8px;
  font-weight: 800;
}

.studio-body .btn-primary {
  color: #031525;
  background:
    linear-gradient(135deg, #e0f2fe 0%, var(--studio-cyan) 46%, var(--studio-teal) 100%),
    var(--studio-cyan);
  border: 1px solid rgba(224, 242, 254, 0.78);
  box-shadow:
    0 18px 42px rgba(45, 212, 191, 0.2),
    0 0 26px rgba(103, 232, 249, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.studio-body .btn-primary:hover,
.studio-body .btn-primary:focus {
  color: #020617;
  background:
    linear-gradient(135deg, #f0f9ff 0%, #7dd3fc 42%, #5eead4 100%),
    #7dd3fc;
  border-color: rgba(240, 249, 255, 0.9);
  box-shadow:
    0 22px 52px rgba(45, 212, 191, 0.26),
    0 0 34px rgba(103, 232, 249, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.studio-body .studio-configure-production-button,
.studio-body .studio-configure-production-button span,
.studio-body .studio-configure-production-button:hover,
.studio-body .studio-configure-production-button:hover span,
.studio-body .studio-configure-production-button:focus,
.studio-body .studio-configure-production-button:focus span {
  color: #031525;
}

.studio-body .btn-outline-primary,
.studio-body .btn-outline-secondary {
  color: var(--studio-cyan);
  background: rgba(2, 6, 23, 0.36);
  border-color: rgba(125, 211, 252, 0.42);
}

.studio-body .btn-outline-primary:hover,
.studio-body .btn-outline-primary:focus,
.studio-body .btn-outline-secondary:hover,
.studio-body .btn-outline-secondary:focus {
  color: #031525;
  background: var(--studio-cyan);
  border-color: var(--studio-cyan);
  box-shadow: 0 0 26px rgba(103, 232, 249, 0.22);
}

.studio-auth-panel {
  width: min(100%, 28rem);
  padding: 1.35rem;
}

.studio-auth-panel h1 {
  margin: 0 0 1rem;
  color: #ffffff;
  font-size: 1.75rem;
  font-weight: 900;
}

.studio-auth-brand {
  display: flex;
  gap: 0.55rem;
  align-items: center;
  margin-bottom: 1rem;
  color: var(--studio-text-muted);
  font-weight: 850;
}

.studio-auth-brand img {
  width: 1.8rem;
  height: 1.8rem;
}

.studio-grid-form {
  display: grid;
  gap: 1rem;
}

.studio-performer-onboarding-form fieldset {
  display: grid;
  gap: 0.85rem;
  min-width: 0;
  margin: 0;
  padding: 0.95rem;
  border: 1px solid rgba(125, 211, 252, 0.2);
  border-radius: 8px;
  background: rgba(2, 6, 23, 0.28);
}

.studio-performer-onboarding-form legend {
  float: none;
  width: auto;
  margin: 0;
  padding: 0 0.25rem;
  color: #ffffff;
  font-size: 0.9rem;
  font-weight: 850;
}

.studio-performer-onboarding-form .form-check {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 0.55rem;
  margin: 0;
}

.studio-performer-onboarding-form .form-check-input {
  margin: 0.2rem 0 0;
}

.studio-muted {
  color: var(--studio-text-muted) !important;
}

.studio-flashes {
  display: grid;
  gap: 0.5rem;
  max-width: 1280px;
  margin: 0 auto 1rem;
}

.studio-alert {
  margin: 0;
  color: var(--studio-text);
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.92), rgba(8, 47, 73, 0.62)),
    rgba(2, 6, 23, 0.82);
  border-color: var(--studio-border);
  border-radius: 8px;
  box-shadow:
    0 18px 44px rgba(2, 6, 23, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.studio-alert.alert-success {
  color: #dcfce7;
  border-color: rgba(74, 222, 128, 0.38);
}

.studio-alert.alert-warning {
  color: #fef3c7;
  border-color: rgba(251, 191, 36, 0.4);
}

.studio-alert.alert-danger {
  color: #fee2e2;
  border-color: rgba(248, 113, 113, 0.44);
}

.studio-alert.alert-info {
  color: #e0f2fe;
  border-color: rgba(125, 211, 252, 0.42);
}

.studio-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: flex-end;
}

.studio-structure-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
}

.studio-structure-grid div {
  display: grid;
  gap: 0.25rem;
  min-height: 4.4rem;
  padding: 0.75rem;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.78), rgba(8, 47, 73, 0.32)),
    rgba(2, 6, 23, 0.52);
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 8px;
}

.studio-structure-grid strong {
  color: #ffffff;
}

.studio-structure-grid span,
.studio-logistics-row > span {
  min-width: 0;
  color: var(--studio-text-muted);
  overflow-wrap: anywhere;
}

@media (max-width: 1100px) {
  .studio-shell {
    grid-template-columns: 1fr;
  }

  .studio-sidebar {
    position: static;
    height: auto;
  }

  .studio-nav {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .studio-metric-grid,
  .studio-structure-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .studio-scene-selection-grid,
  .studio-review-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .studio-workflow-hero,
  .studio-production-title-grid,
  .studio-compliance-setup-grid,
  .studio-finance-expense-grid,
  .studio-finance-payment-grid,
  .studio-report-checkpoint-grid,
  .studio-report-filter-groups,
  .studio-budget-grid,
  .studio-budget-notes-grid,
  .studio-performer-intake-grid,
  .studio-performer-sti-grid,
  .studio-performer-contracts {
    grid-template-columns: 1fr;
  }

  .studio-performer-identity-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .studio-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .studio-main {
    padding: 0.8rem;
  }

  .studio-nav,
  .studio-metric-grid,
  .studio-score-hero,
  .studio-two-column,
  .studio-settings-tabs,
  .studio-role-permission-grid,
  .studio-card-grid,
  .studio-structure-grid,
  .studio-workflow-hero,
  .studio-production-title-grid,
  .studio-compliance-setup-grid,
  .studio-finance-mode-grid,
  .studio-finance-expense-grid,
  .studio-finance-payment-grid,
  .studio-finance-association-grid,
  .studio-expense-followup-grid,
  .studio-report-option-grid,
  .studio-report-checkpoint-grid,
  .studio-report-filter-groups,
  .studio-budget-grid,
  .studio-budget-notes-grid,
  .studio-credit-purchase-grid,
  .studio-credit-coverage-grid,
  .studio-production-finance-grid,
  .studio-finance-summary-grid,
  .studio-finance-category-list,
  .studio-performer-intake-grid,
  .studio-performer-identity-grid,
  .studio-performer-health-grid,
  .studio-performer-sti-grid,
  .studio-performer-contracts,
  .studio-performer-status-grid,
  .studio-schedule-fields,
  .studio-scene-fields,
  .studio-scene-selection-grid,
  .studio-review-grid,
  .studio-sti-expiration-hero,
  .studio-heading-row {
    grid-template-columns: 1fr;
  }

  .studio-settings-tabs {
    display: grid;
  }

  .studio-topbar,
  .studio-scene-heading,
  .studio-panel-heading,
  .studio-configure-section-heading,
  .studio-production-scene-editor-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .studio-topbar-actions,
  .studio-credit-summary,
  .studio-credit-balance-strip {
    justify-content: stretch;
    width: 100%;
  }

  .studio-credit-pill,
  .studio-credit-balance-strip span {
    flex: 1 1 10rem;
  }

  .studio-coverage-facts,
  .studio-coverage-readout-grid {
    grid-template-columns: 1fr;
  }

  .studio-compliance-emblem {
    justify-self: center;
  }

  .studio-sidebar {
    gap: 0.75rem;
    width: 100%;
    max-width: 100vw;
    padding: 0.85rem;
    overflow: hidden;
  }

  .studio-nav {
    display: flex;
    gap: 0.45rem;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding-bottom: 0.15rem;
    overflow-x: auto;
    scrollbar-width: thin;
  }

  .studio-nav a {
    flex: 0 0 auto;
    min-height: 2.2rem;
    white-space: nowrap;
  }

  .studio-list-row {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .studio-timeline-item {
    grid-template-columns: 1fr;
  }

  .studio-timeline-actions {
    justify-content: stretch;
  }

  .studio-timeline-actions .btn {
    flex: 1 1 10rem;
  }

  .studio-configure-save-bar .btn {
    flex: 1 1 12rem;
  }

  .studio-sti-expiration-hero > strong {
    width: 100%;
    max-width: none;
    min-height: 3.4rem;
    justify-content: flex-start;
  }

  .studio-finance-history-row {
    grid-template-columns: minmax(0, 1fr) minmax(7.25rem, auto);
  }

  .studio-risk-fix {
    grid-column: 2;
    justify-self: start;
  }

  .studio-risk-fix[open] {
    grid-column: 1 / -1;
  }

  .studio-list-row > span:last-child {
    grid-column: 2;
  }

  .studio-workflow-actions,
  .studio-draft-row-header,
  .studio-scene-draft-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .studio-production-workflow .studio-workflow-title h2 {
    font-size: clamp(1.8rem, 13vw, 2.55rem);
  }

  .studio-workflow-progress {
    min-height: 4.35rem;
    padding: 0.72rem 0.62rem 0.56rem;
  }

  .studio-workflow-progress.studio-production-checkpoints {
    --production-checkpoint-edge-offset: 0.62rem;
    --production-checkpoint-node-width: 3.7rem;
    --production-checkpoint-node-half: 1.85rem;
    --production-checkpoint-track-inset: 1.47rem;
    --production-checkpoint-point-02: calc(20% + 0.88rem);
    --production-checkpoint-point-03: calc(40% + 0.29rem);
    --production-checkpoint-point-04: calc(60% - 0.29rem);
    --production-checkpoint-point-05: calc(80% - 0.88rem);
  }

  .studio-finance-progress {
    padding-right: 0.3rem;
    padding-left: 0.3rem;
  }

  .studio-finance-progress.is-expense {
    --finance-expense-edge-offset: 0.3rem;
    --finance-expense-node-width: 3.6rem;
    --finance-expense-point-02: calc(25% + 0.58rem);
    --finance-expense-point-03: 50%;
    --finance-expense-point-04: calc(75% - 0.58rem);
  }

  .studio-workflow-progress::before,
  .studio-workflow-progress::after {
    right: 1.15rem;
    left: 1.15rem;
    top: 1.58rem;
  }

  .studio-workflow-progress::after {
    max-width: calc(100% - 2.3rem);
  }

  .studio-workflow-progress.studio-finance-progress::after {
    max-width: none;
  }

  .studio-workflow-progress button {
    gap: 0.34rem;
  }

  .studio-workflow-progress.studio-production-checkpoints button {
    top: 0.72rem;
  }

  .studio-workflow-progress button span {
    width: 1.7rem;
    height: 1.7rem;
    font-size: 0.65rem;
  }

  .studio-finance-progress.is-expense button {
    top: 0.72rem;
  }

  .studio-workflow-progress button strong {
    font-size: 0.68rem;
  }

  .studio-production-slate {
    min-height: 11rem;
  }

  .studio-workflow-actions .btn {
    width: 100%;
  }

  .studio-performer-form {
    padding: 0.85rem;
  }

  .studio-performer-checkpoints {
    min-height: 4.35rem;
    padding: 0.72rem 0.62rem 0.56rem;
  }

  .studio-performer-checkpoints em {
    width: 1.7rem;
    height: 1.7rem;
    font-size: 0.65rem;
  }

  .studio-performer-card-header,
  .studio-performer-card-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .studio-performer-card-actions .btn,
  .studio-performer-card-actions form {
    width: 100%;
  }
}

@media (max-width: 1100px) {
  .studio-legal-intake-grid,
  .studio-legal-library-grid,
  .studio-legal-source-grid {
    grid-template-columns: 1fr;
  }

  .studio-legal-save-required-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .studio-legal-save-metadata-grid {
    grid-template-areas:
      "type status"
      "performer production"
      "scene scene"
      "notes notes";
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .studio-legal-assignment-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .studio-legal-scene-field,
  .studio-legal-file-field {
    grid-column: auto;
  }

  .studio-legal-slate {
    position: static;
  }
}

@media (max-width: 760px) {
  .studio-legal-panels {
    padding: 0.85rem;
  }

  .studio-legal-mode-prompt {
    min-height: auto;
    padding: 0.75rem 0;
  }

  .studio-workflow-progress.studio-legal-mode-nav {
    grid-template-columns: 1fr;
  }

  .studio-workflow-progress.studio-legal-mode-nav button {
    min-height: 8.5rem;
  }

  .studio-legal-assignment-grid,
  .studio-legal-upload-grid,
  .studio-legal-save-required-grid,
  .studio-legal-document-row,
  .studio-legal-list-row,
  .studio-legal-record-header {
    grid-template-columns: 1fr;
  }

  .studio-legal-save-metadata-grid {
    grid-template-areas:
      "type"
      "status"
      "performer"
      "production"
      "scene"
      "notes";
    grid-template-columns: 1fr;
  }

  .studio-legal-document-row em,
  .studio-legal-list-row > span:last-child {
    text-align: left;
  }

  .studio-legal-record-header {
    align-items: stretch;
    flex-direction: column;
  }

  .studio-user-search {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-production-workflow::before,
  .studio-workflow-step.active,
  .studio-schedule-row,
  .studio-scene-draft,
  .studio-legal-panel.active,
  .studio-legal-source-panel.active,
  .studio-legal-record-card {
    animation: none;
  }

  .studio-workflow-progress::after,
  .studio-workflow-progress button,
  .studio-workflow-progress button span,
  .studio-workflow-progress.studio-legal-mode-nav button .studio-legal-mode-icon,
  .studio-choice,
  .studio-legal-source-option,
  .studio-legal-document-choice,
  .studio-legal-document-row,
  .studio-legal-record-card {
    transition: none;
  }

  .studio-workflow-progress.studio-legal-mode-nav button:hover,
  .studio-workflow-progress.studio-legal-mode-nav button:focus-visible,
  .studio-workflow-progress.studio-legal-mode-nav button:hover .studio-legal-mode-icon,
  .studio-workflow-progress.studio-legal-mode-nav button:focus-visible .studio-legal-mode-icon {
    transform: none;
  }
}

html[data-high-contrast="true"] .studio-body {
  --studio-surface: #000000;
  --studio-surface-strong: #000000;
  --studio-surface-soft: #000000;
  --studio-border: #ffffff;
  --studio-border-strong: #ffffff;
  --studio-text: #ffffff;
  --studio-text-soft: #ffffff;
  --studio-text-muted: #e5e7eb;
  --studio-blue: #00e5ff;
  --studio-cyan: #00e5ff;
  --studio-teal: #00e5ff;
  --studio-success: #00ff66;
  --studio-warning: #ffd400;
  --studio-danger: #ff6666;
  color: #ffffff !important;
  background: #000000 !important;
  background-image: none !important;
}

html[data-high-contrast="true"] .studio-body::before,
html[data-high-contrast="true"] .studio-auth-shell::before,
html[data-high-contrast="true"] .studio-auth-shell .studio-login-panel::before,
html[data-high-contrast="true"] .studio-production-workflow::before,
html[data-high-contrast="true"] .studio-score-hero::before,
html[data-high-contrast="true"] .studio-legal-record-card::before,
html[data-high-contrast="true"] .studio-onboarding-hero::before,
html[data-high-contrast="true"] .studio-onboarding-screen .studio-panel::before,
html[data-high-contrast="true"] .studio-setup-unavailable::before {
  display: none !important;
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] .studio-shell,
html[data-high-contrast="true"] .studio-auth-shell,
html[data-high-contrast="true"] .studio-sidebar,
html[data-high-contrast="true"] .studio-main,
html[data-high-contrast="true"] .studio-topbar,
html[data-high-contrast="true"] .studio-settings-tabs,
html[data-high-contrast="true"] .studio-settings-tab,
html[data-high-contrast="true"] .studio-user-search,
html[data-high-contrast="true"] .studio-panel,
html[data-high-contrast="true"] .studio-auth-panel,
html[data-high-contrast="true"] .studio-metric,
html[data-high-contrast="true"] .studio-score-hero,
html[data-high-contrast="true"] .studio-production-card,
html[data-high-contrast="true"] .studio-production-finance-card,
html[data-high-contrast="true"] .studio-list-row,
html[data-high-contrast="true"] .studio-table,
html[data-high-contrast="true"] .studio-table th,
html[data-high-contrast="true"] .studio-table td,
html[data-high-contrast="true"] .studio-structure-grid div,
html[data-high-contrast="true"] .studio-credit-pill,
html[data-high-contrast="true"] .studio-credit-pill-icon,
html[data-high-contrast="true"] .studio-credit-panel-icon,
html[data-high-contrast="true"] .studio-brand-mark,
html[data-high-contrast="true"] .studio-role-permission-section,
html[data-high-contrast="true"] .studio-role-permission-choice,
html[data-high-contrast="true"] .studio-saved-role,
html[data-high-contrast="true"] .studio-production-workflow,
html[data-high-contrast="true"] .studio-workflow-step,
html[data-high-contrast="true"] .studio-workflow-progress,
html[data-high-contrast="true"] .studio-workflow-progress button,
html[data-high-contrast="true"] .studio-workflow-progress button span,
html[data-high-contrast="true"] .studio-choice,
html[data-high-contrast="true"] .studio-legal-source-option,
html[data-high-contrast="true"] .studio-legal-document-choice,
html[data-high-contrast="true"] .studio-legal-document-row,
html[data-high-contrast="true"] .studio-legal-form-section,
html[data-high-contrast="true"] .studio-legal-panel,
html[data-high-contrast="true"] .studio-legal-source-panel,
html[data-high-contrast="true"] .studio-legal-record-card,
html[data-high-contrast="true"] .studio-production-slate,
html[data-high-contrast="true"] .studio-report-filter-group,
html[data-high-contrast="true"] .studio-expense-guide,
html[data-high-contrast="true"] .studio-reference-upload,
html[data-high-contrast="true"] .studio-script-upload,
html[data-high-contrast="true"] .studio-schedule-row,
html[data-high-contrast="true"] .studio-scene-draft,
html[data-high-contrast="true"] .studio-review-list,
html[data-high-contrast="true"] .studio-staff-cost-estimate,
html[data-high-contrast="true"] .studio-finance-summary-grid > div,
html[data-high-contrast="true"] .studio-finance-record-totals,
html[data-high-contrast="true"] .studio-finance-split-notes,
html[data-high-contrast="true"] .studio-onboarding-hero,
html[data-high-contrast="true"] .studio-onboarding-screen .studio-panel,
html[data-high-contrast="true"] .studio-onboarding-progress span,
html[data-high-contrast="true"] .studio-setup-step,
html[data-high-contrast="true"] .studio-setup-unavailable {
  color: #ffffff !important;
  background: #000000 !important;
  background-image: none !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

html[data-high-contrast="true"] .studio-sidebar {
  border-right: 2px solid #ffffff !important;
}

html[data-high-contrast="true"] .studio-nav a {
  color: #ffffff !important;
  background: #000000 !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] .studio-nav a:hover,
html[data-high-contrast="true"] .studio-nav a:focus,
html[data-high-contrast="true"] .studio-nav a:focus-visible,
html[data-high-contrast="true"] .studio-nav a.active,
html[data-high-contrast="true"] .studio-settings-tab:hover,
html[data-high-contrast="true"] .studio-settings-tab:focus-visible,
html[data-high-contrast="true"] .studio-settings-tab.active {
  color: #000000 !important;
  background: #ffffff !important;
  background-image: none !important;
  border-color: #ffffff !important;
  box-shadow:
    0 0 0 2px #000000,
    0 0 0 5px #ffffff !important;
}

html[data-high-contrast="true"] .studio-brand,
html[data-high-contrast="true"] .studio-brand strong,
html[data-high-contrast="true"] .studio-brand small,
html[data-high-contrast="true"] .studio-topbar h1,
html[data-high-contrast="true"] .studio-topbar p,
html[data-high-contrast="true"] .studio-page-heading span,
html[data-high-contrast="true"] .studio-page-heading h1,
html[data-high-contrast="true"] .studio-page-heading h2,
html[data-high-contrast="true"] .studio-panel h2,
html[data-high-contrast="true"] .studio-muted,
html[data-high-contrast="true"] .studio-list-row strong,
html[data-high-contrast="true"] .studio-list-row small,
html[data-high-contrast="true"] .studio-production-card strong,
html[data-high-contrast="true"] .studio-production-card small,
html[data-high-contrast="true"] .studio-production-card span,
html[data-high-contrast="true"] .studio-credit-pill small,
html[data-high-contrast="true"] .studio-credit-pill strong,
html[data-high-contrast="true"] .studio-role-permission-choice strong,
html[data-high-contrast="true"] .studio-role-permission-choice small {
  color: #ffffff !important;
}

html[data-high-contrast="true"] .studio-status,
html[data-high-contrast="true"] .studio-score-badge,
html[data-high-contrast="true"] .studio-legal-doc-badge,
html[data-high-contrast="true"] .studio-card-kicker,
html[data-high-contrast="true"] .studio-score-kicker {
  color: #000000 !important;
  background: #ffd400 !important;
  background-image: none !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] .studio-button-icon,
html[data-high-contrast="true"] .studio-credit-pill-icon svg,
html[data-high-contrast="true"] .studio-credit-panel-icon svg,
html[data-high-contrast="true"] .studio-legal-mode-icon svg,
html[data-high-contrast="true"] .studio-legal-option-marker svg,
html[data-high-contrast="true"] .studio-reference-upload svg {
  color: currentColor !important;
  stroke: currentColor !important;
}

html[data-high-contrast="true"] .studio-workflow-progress::before,
html[data-high-contrast="true"] .studio-workflow-progress::after {
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] .studio-workflow-progress button.active,
html[data-high-contrast="true"] .studio-workflow-progress button:hover,
html[data-high-contrast="true"] .studio-workflow-progress button:focus-visible,
html[data-high-contrast="true"] .studio-choice:has(input:checked),
html[data-high-contrast="true"] .studio-legal-source-option:has(input:checked),
html[data-high-contrast="true"] .studio-legal-document-choice:has(input:checked) {
  color: #000000 !important;
  background: #ffffff !important;
  background-image: none !important;
  border-color: #ffffff !important;
}

html[data-high-contrast="true"] .studio-workflow-progress button.active *,
html[data-high-contrast="true"] .studio-workflow-progress button:hover *,
html[data-high-contrast="true"] .studio-workflow-progress button:focus-visible *,
html[data-high-contrast="true"] .studio-choice:has(input:checked) *,
html[data-high-contrast="true"] .studio-legal-source-option:has(input:checked) *,
html[data-high-contrast="true"] .studio-legal-document-choice:has(input:checked) * {
  color: #000000 !important;
}

.studio-onboarding-screen {
  width: calc(100vw - 2.5rem);
  max-width: 1180px;
  gap: 1rem;
  overflow-x: hidden;
  color: #e0f2fe;
}

.studio-onboarding-hero,
.studio-onboarding-screen .studio-panel,
.studio-setup-unavailable {
  position: relative;
  overflow: hidden;
  color: #e2e8f0;
  background:
    linear-gradient(145deg, rgba(15, 23, 42, 0.9), rgba(8, 47, 73, 0.66) 58%, rgba(2, 6, 23, 0.92)),
    rgba(2, 6, 23, 0.86);
  border: 1px solid rgba(125, 211, 252, 0.26);
  box-shadow:
    0 28px 72px rgba(2, 6, 23, 0.44),
    0 0 32px rgba(45, 212, 191, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.09);
}

.studio-onboarding-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(16rem, 26rem);
  gap: clamp(1rem, 3vw, 2rem);
  align-items: end;
  width: 100%;
  max-width: 100%;
  min-height: 16rem;
  padding: clamp(1.2rem, 3vw, 2rem);
  border-radius: 8px;
}

.studio-onboarding-hero::before,
.studio-onboarding-screen .studio-panel::before,
.studio-setup-unavailable::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(90deg, rgba(125, 211, 252, 0.08) 1px, transparent 1px),
    linear-gradient(0deg, rgba(94, 234, 212, 0.06) 1px, transparent 1px),
    linear-gradient(110deg, transparent 0%, rgba(186, 230, 253, 0.1) 42%, transparent 68%);
  background-position:
    0 0,
    0 0,
    110% 0;
  background-size:
    42px 42px,
    42px 42px,
    220% 100%;
  opacity: 0.42;
}

.studio-onboarding-hero > *,
.studio-onboarding-screen .studio-panel > *,
.studio-setup-unavailable > * {
  position: relative;
  z-index: 1;
}

.studio-onboarding-copy {
  min-width: 0;
}

.studio-onboarding-brand {
  margin-bottom: 0.8rem;
  color: #bae6fd;
}

.studio-onboarding-brand img {
  filter: drop-shadow(0 0 14px rgba(103, 232, 249, 0.34));
}

.studio-onboarding-kicker {
  display: inline-flex;
  color: #67e8f9;
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0;
  text-transform: uppercase;
}

.studio-onboarding-copy h1 {
  max-width: 780px;
  margin: 0.6rem 0 0.75rem;
  color: #ffffff;
  font-size: clamp(2.1rem, 5vw, 3.9rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.studio-onboarding-copy p {
  max-width: 650px;
  margin: 0;
  color: rgba(224, 242, 254, 0.78);
  font-size: 1rem;
  line-height: 1.65;
}

.studio-onboarding-progress {
  display: grid;
  gap: 0.55rem;
}

.studio-onboarding-progress span {
  display: grid;
  grid-template-columns: 2.45rem minmax(0, 1fr);
  gap: 0.65rem;
  align-items: center;
  min-height: 3rem;
  padding: 0.55rem 0.65rem;
  color: rgba(224, 242, 254, 0.86);
  font-size: 0.88rem;
  font-weight: 850;
  background:
    linear-gradient(90deg, rgba(103, 232, 249, 0.13), transparent 72%),
    rgba(2, 6, 23, 0.5);
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-left: 3px solid #67e8f9;
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-onboarding-progress strong,
.studio-setup-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  color: #031525;
  font-size: 0.75rem;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, #e0f2fe 0%, #67e8f9 48%, #2dd4bf 100%);
  border: 1px solid rgba(224, 242, 254, 0.78);
  border-radius: 8px;
  box-shadow:
    0 0 18px rgba(103, 232, 249, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.studio-onboarding-form {
  gap: 0.9rem;
}

.studio-onboarding-screen .studio-panel {
  width: 100%;
  max-width: 100%;
  padding: clamp(1rem, 2vw, 1.25rem);
  border-radius: 8px;
}

.studio-setup-panel-heading {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 1rem;
  padding-bottom: 0.95rem;
  border-bottom: 1px solid rgba(125, 211, 252, 0.18);
}

.studio-setup-title {
  display: flex;
  gap: 0.65rem;
  align-items: center;
  min-width: 0;
}

.studio-setup-title h2,
.studio-onboarding-screen .studio-panel h2 {
  margin: 0;
  color: #ffffff;
  font-size: 1.08rem;
  font-weight: 900;
  line-height: 1.2;
}

.studio-setup-panel-heading p {
  max-width: 35rem;
  margin: 0;
  color: rgba(186, 230, 253, 0.72);
  font-size: 0.88rem;
  line-height: 1.5;
  text-align: right;
}

.studio-onboarding-screen .studio-panel .form-label {
  color: rgba(186, 230, 253, 0.88);
  font-size: 0.82rem;
  font-weight: 850;
}

.studio-onboarding-screen .form-control,
.studio-onboarding-screen .form-select {
  color: #f8fafc;
  color-scheme: dark;
  background: rgba(2, 6, 23, 0.6);
  border-color: rgba(125, 211, 252, 0.26);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.studio-onboarding-screen textarea.form-control {
  min-height: 6.35rem;
  resize: vertical;
}

.studio-onboarding-screen .form-control:hover,
.studio-onboarding-screen .form-select:hover {
  border-color: rgba(103, 232, 249, 0.46);
}

.studio-onboarding-screen .form-control:focus,
.studio-onboarding-screen .form-select:focus {
  color: #ffffff;
  background: rgba(2, 6, 23, 0.78);
  border-color: #67e8f9;
  box-shadow:
    0 0 0 0.2rem rgba(103, 232, 249, 0.14),
    0 0 24px rgba(45, 212, 191, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.studio-onboarding-screen .form-control::placeholder {
  color: rgba(203, 213, 225, 0.55);
}

.studio-onboarding-screen .form-control-color {
  width: 100%;
  min-height: 2.85rem;
  padding: 0.35rem;
}

.studio-onboarding-screen input[type="color"]::-webkit-color-swatch-wrapper {
  padding: 0;
}

.studio-onboarding-screen input[type="color"]::-webkit-color-swatch {
  border: 1px solid rgba(224, 242, 254, 0.36);
  border-radius: 6px;
}

.studio-onboarding-screen input[type="color"]::-moz-color-swatch {
  border: 1px solid rgba(224, 242, 254, 0.36);
  border-radius: 6px;
}

.studio-onboarding-actions {
  display: flex;
  justify-content: flex-end;
}

.studio-onboarding-submit {
  min-height: 3.15rem;
  padding-right: 1.4rem;
  padding-left: 1.4rem;
}

.studio-onboarding-screen .btn-primary {
  color: #031525;
  background:
    linear-gradient(135deg, #e0f2fe 0%, #67e8f9 46%, #2dd4bf 100%),
    #67e8f9;
  border: 1px solid rgba(224, 242, 254, 0.78);
  box-shadow:
    0 18px 42px rgba(45, 212, 191, 0.22),
    0 0 26px rgba(103, 232, 249, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.studio-onboarding-screen .btn-primary:hover,
.studio-onboarding-screen .btn-primary:focus {
  color: #020617;
  background:
    linear-gradient(135deg, #f0f9ff 0%, #7dd3fc 42%, #5eead4 100%),
    #7dd3fc;
  border-color: rgba(240, 249, 255, 0.9);
  box-shadow:
    0 22px 52px rgba(45, 212, 191, 0.28),
    0 0 34px rgba(103, 232, 249, 0.26),
    inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.studio-setup-unavailable {
  width: min(100%, 30rem);
  padding: 1.35rem;
  border-radius: 8px;
}

.studio-setup-unavailable h1 {
  color: #ffffff;
}

.studio-setup-unavailable .studio-muted {
  color: rgba(224, 242, 254, 0.76);
}

@media (max-width: 900px) {
  .studio-onboarding-hero {
    grid-template-columns: 1fr;
  }

  .studio-onboarding-progress {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .studio-onboarding-progress span {
    grid-template-columns: 1fr;
    align-items: start;
  }
}

@media (max-width: 760px) {
  .studio-auth-shell {
    padding: 0.75rem;
  }

  .studio-auth-shell .studio-main {
    max-width: calc(100vw - 1.5rem);
  }

  .studio-onboarding-screen {
    width: calc(100vw - 1.5rem) !important;
    max-width: calc(100vw - 1.5rem) !important;
  }

  .studio-onboarding-hero {
    width: calc(100vw - 1.5rem) !important;
    max-width: calc(100vw - 1.5rem) !important;
    min-height: 0;
    padding: 1rem;
  }

  .studio-onboarding-screen .studio-panel {
    width: calc(100vw - 1.5rem) !important;
    max-width: calc(100vw - 1.5rem) !important;
  }

  .studio-onboarding-copy h1 {
    max-width: 9.5ch;
    font-size: clamp(1.9rem, 9vw, 2.35rem);
  }

  .studio-onboarding-copy p {
    max-width: 30ch;
  }

  .studio-onboarding-progress {
    grid-template-columns: 1fr;
    max-width: calc(100vw - 3.5rem);
  }

  .studio-setup-panel-heading {
    flex-direction: column;
    align-items: stretch;
    max-width: calc(100vw - 3.5rem);
  }

  .studio-setup-panel-heading p {
    max-width: 30ch;
    text-align: left;
  }

  .studio-onboarding-screen .row {
    --bs-gutter-x: 0;
  }

  .studio-onboarding-screen .form-control,
  .studio-onboarding-screen .form-select {
    max-width: calc(100vw - 3.5rem);
  }

  .studio-onboarding-actions,
  .studio-onboarding-submit {
    width: 100%;
  }
}

html[data-high-contrast="true"] .studio-credit-balance-strip span,
html[data-high-contrast="true"] .studio-credit-coverage-panel,
html[data-high-contrast="true"] .studio-coverage-kicker,
html[data-high-contrast="true"] .studio-coverage-facts span,
html[data-high-contrast="true"] .studio-coverage-group,
html[data-high-contrast="true"] .studio-coverage-readout,
html[data-high-contrast="true"] .studio-scan-coverage-item,
html[data-high-contrast="true"] .studio-legal-form-section,
html[data-high-contrast="true"] .studio-legal-source-option,
html[data-high-contrast="true"] .studio-legal-document-choice,
html[data-high-contrast="true"] .studio-legal-document-row,
html[data-high-contrast="true"] .studio-legal-pdf-preview,
html[data-high-contrast="true"] .studio-legal-slate-list div,
html[data-high-contrast="true"] .studio-production-slate,
html[data-high-contrast="true"] .studio-schedule-row,
html[data-high-contrast="true"] .studio-scene-draft,
html[data-high-contrast="true"] .studio-review-item,
html[data-high-contrast="true"] .studio-production-staff-picker,
html[data-high-contrast="true"] .studio-staff-shift-row,
html[data-high-contrast="true"] .studio-staff-cost-estimate,
html[data-high-contrast="true"] .studio-production-date-heading,
html[data-high-contrast="true"] .studio-production-card-date,
html[data-high-contrast="true"] .studio-production-card-people div,
html[data-high-contrast="true"] .studio-workflow-actions {
  color: #ffffff !important;
  background: #000000 !important;
  background-image: none !important;
  border-color: #ffffff !important;
  box-shadow: none !important;
  text-shadow: none !important;
  backdrop-filter: none !important;
}

html[data-high-contrast="true"] .studio-credit-coverage-panel::before,
html[data-high-contrast="true"] .studio-credit-coverage-panel::after,
html[data-high-contrast="true"] .studio-production-slate::before,
html[data-high-contrast="true"] .studio-legal-record-card::before {
  display: none !important;
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-high-contrast="true"] .studio-scan-coverage-item span,
html[data-high-contrast="true"] .studio-legal-option-marker,
html[data-high-contrast="true"] .studio-legal-contract-badge,
html[data-high-contrast="true"] .studio-background-check-icon {
  background-image: none !important;
  box-shadow: none !important;
}
