/* ===== FAST TRACK V9 — FIT PREMIUM UI START ===== */

#screen-fast-track,
#screen-fast-track * {
  box-sizing: border-box !important;
}

#screen-fast-track {
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 12% 6%, rgba(139, 92, 246, .14), transparent 34%),
    radial-gradient(circle at 92% 16%, rgba(34, 211, 238, .13), transparent 34%),
    radial-gradient(circle at 50% 100%, rgba(167, 139, 250, .10), transparent 40%),
    linear-gradient(180deg, #fbfdff 0%, #f2f7ff 46%, #eaf4fb 100%) !important;
}

#screen-fast-track.active {
  overflow: hidden !important;
  padding: 0 !important;
}

#screen-fast-track .fastv9-screen {
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  padding: 8px 14px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto auto auto !important;
  gap: 7px !important;
  overflow: hidden !important;
  color: #10182c !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
}

/* HEADER */

#screen-fast-track .fastv9-header {
  height: 40px !important;
  min-height: 40px !important;
  display: grid !important;
  grid-template-columns: 88px minmax(0, 1fr) 88px !important;
  align-items: center !important;
  gap: 8px !important;
}

#screen-fast-track .fastv9-back {
  width: 86px !important;
  height: 36px !important;
  border: 1.5px solid rgba(166, 180, 210, .74) !important;
  border-radius: 17px !important;
  background:
    radial-gradient(circle at 28% 15%, rgba(255,255,255,1), transparent 35%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(241,247,255,.94)) !important;
  box-shadow:
    0 10px 18px rgba(76, 90, 130, .15),
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -8px 14px rgba(219,228,244,.66) !important;
  color: #603ef0 !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  white-space: nowrap !important;
}

#screen-fast-track .fastv9-back span {
  font-size: 21px !important;
  line-height: 1 !important;
  transform: translateY(-1px) !important;
}

#screen-fast-track .fastv9-back strong {
  font-size: 13px !important;
  font-weight: 950 !important;
}

#screen-fast-track .fastv9-title {
  min-width: 0 !important;
  text-align: center !important;
  color: #10182c !important;
  -webkit-text-fill-color: #10182c !important;
  background: none !important;
  opacity: 1 !important;
  font-size: 19px !important;
  font-weight: 950 !important;
  letter-spacing: -.35px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.95) !important;
}

#screen-fast-track .fastv9-header-spacer {
  width: 88px !important;
  height: 36px !important;
}

/* HERO */

#screen-fast-track .fastv9-hero {
  text-align: center !important;
  padding: 0 4px !important;
  overflow: hidden !important;
}

#screen-fast-track .fastv9-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  max-width: 100% !important;
  min-height: 24px !important;
  padding: 4px 12px !important;
  border-radius: 999px !important;
  color: #6742ef !important;
  font-size: 11.5px !important;
  font-weight: 900 !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(242,247,255,.88)) !important;
  border: 1.3px solid rgba(137, 105, 255, .27) !important;
  box-shadow:
    0 8px 16px rgba(98, 88, 180, .10),
    inset 0 1px 0 rgba(255,255,255,.98) !important;
  white-space: nowrap !important;
}

#screen-fast-track .fastv9-hero h1 {
  margin: 5px 0 0 !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  background: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  font-size: 26px !important;
  line-height: 1.04 !important;
  font-weight: 950 !important;
  letter-spacing: -.75px !important;
  text-shadow:
    0 1px 0 rgba(255,255,255,.95),
    0 8px 18px rgba(35, 45, 80, .08) !important;
}

#screen-fast-track .fastv9-hero p {
  margin: 3px auto 0 !important;
  color: #4b556b !important;
  -webkit-text-fill-color: #4b556b !important;
  font-size: 13.5px !important;
  line-height: 1.15 !important;
  font-weight: 650 !important;
}

/* CARD */

#screen-fast-track .fastv9-card {
  min-width: 0 !important;
  min-height: 0 !important;
  border-radius: 26px !important;
  padding: 13px 14px 11px !important;
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 20% 8%, rgba(255,255,255,.98), transparent 30%),
    linear-gradient(145deg, rgba(255,255,255,.92), rgba(241,247,255,.80)) !important;
  border: 1.6px solid rgba(255,255,255,.88) !important;
  box-shadow:
    0 16px 34px rgba(82, 96, 132, .14),
    inset 0 2px 0 rgba(255,255,255,.96),
    inset 0 -14px 24px rgba(211,222,240,.38) !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  gap: 7px !important;
}

#screen-fast-track .fastv9-card::before {
  content: "" !important;
  position: absolute !important;
  inset: 6px !important;
  border-radius: 21px !important;
  pointer-events: none !important;
  border: 1px solid rgba(255,255,255,.62) !important;
}

#screen-fast-track .fastv9-card-head {
  position: relative !important;
  z-index: 3 !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 8px !important;
}

#screen-fast-track .fastv9-card-left {
  min-width: 0 !important;
}

#screen-fast-track .fastv9-card-title {
  color: #613ef0 !important;
  -webkit-text-fill-color: #613ef0 !important;
  font-size: 20px !important;
  line-height: 1.05 !important;
  font-weight: 950 !important;
  letter-spacing: -.42px !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.9) !important;
}

#screen-fast-track .fastv9-ai-btn {
  width: auto !important;
  max-width: 116px !important;
  min-height: 36px !important;
  padding: 0 10px !important;
  border-radius: 15px !important;
  border: 1.6px solid rgba(255,255,255,.78) !important;
  background:
    radial-gradient(circle at 30% 12%, rgba(255,255,255,.46), transparent 31%),
    linear-gradient(135deg, #c052ff 0%, #7c3df2 54%, #2f6fff 100%) !important;
  color: #fff !important;
  font-size: 11.5px !important;
  font-weight: 950 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  box-shadow:
    0 10px 20px rgba(109, 61, 242, .24),
    inset 0 2px 0 rgba(255,255,255,.32),
    inset 0 -8px 14px rgba(44, 32, 120, .22) !important;
  white-space: nowrap !important;
}

#screen-fast-track .fastv9-ai-icon {
  font-size: 15px !important;
}

#screen-fast-track .fastv9-selected-chip {
  margin-top: 5px !important;
  min-height: 27px !important;
  max-width: 100% !important;
  padding: 4px 9px !important;
  border-radius: 999px !important;
  border: 1.7px solid rgba(111, 67, 244, .48) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(244,239,255,.86)) !important;
  color: #5933e7 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  box-shadow:
    0 7px 14px rgba(103, 75, 215, .14),
    inset 0 1px 0 rgba(255,255,255,.96) !important;
}

#screen-fast-track .fastv9-selected-chip button {
  width: 18px !important;
  height: 18px !important;
  border: none !important;
  border-radius: 999px !important;
  background: rgba(111, 67, 244, .10) !important;
  color: #613ef0 !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
}

#screen-fast-track .fastv9-selected-chip.is-empty {
  color: #6b7280 !important;
  border-color: rgba(160, 170, 190, .35) !important;
}

#screen-fast-track .fastv9-guide {
  position: relative !important;
  z-index: 3 !important;
  min-width: 0 !important;
  color: #4d566d !important;
  font-size: 12px !important;
  line-height: 1.22 !important;
  font-weight: 600 !important;
  overflow: hidden !important;
}

#screen-fast-track .fastv9-guide p {
  margin: 0 0 4px !important;
}

#screen-fast-track .fastv9-example {
  color: #6745f4 !important;
  font-size: 12px !important;
  line-height: 1.22 !important;
  font-style: italic !important;
  font-weight: 650 !important;
}

#screen-fast-track .fastv9-example b {
  color: #565d72 !important;
  font-style: normal !important;
  margin-right: 4px !important;
}

#screen-fast-track .fastv9-example span {
  display: inline !important;
}

#screen-fast-track .fastv9-textarea-shell {
  position: relative !important;
  z-index: 3 !important;
  min-width: 0 !important;
  min-height: 86px !important;
  border-radius: 19px !important;
  padding: 11px 11px 31px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,1), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(249,251,255,.90)) !important;
  border: 1.4px solid rgba(207, 216, 235, .74) !important;
  box-shadow:
    inset 0 2px 8px rgba(92, 110, 145, .055),
    inset 0 -8px 15px rgba(224,232,245,.45),
    0 7px 16px rgba(88, 105, 145, .07) !important;
  overflow: hidden !important;
}

#screen-fast-track .fastv9-textarea {
  width: 100% !important;
  height: 100% !important;
  min-height: 52px !important;
  resize: none !important;
  border: none !important;
  outline: none !important;
  background: transparent !important;
  color: #172033 !important;
  -webkit-text-fill-color: #172033 !important;
  font-size: 13.5px !important;
  line-height: 1.32 !important;
  font-weight: 650 !important;
  font-family: inherit !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

#screen-fast-track .fastv9-textarea::placeholder {
  color: #8d98ad !important;
  -webkit-text-fill-color: #8d98ad !important;
  opacity: .98 !important;
  font-weight: 650 !important;
}

#screen-fast-track .fastv9-textarea-footer {
  position: absolute !important;
  left: 11px !important;
  right: 11px !important;
  bottom: 7px !important;
  padding-top: 6px !important;
  border-top: 1px solid rgba(190, 202, 224, .42) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
}

#screen-fast-track .fastv9-voice-hint {
  min-width: 0 !important;
  color: #747f96 !important;
  font-size: 9.8px !important;
  line-height: 1.05 !important;
  font-weight: 650 !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#screen-fast-track .fastv9-counter {
  color: #596377 !important;
  font-size: 10.8px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

/* TOPICS */

#screen-fast-track .fastv9-topics {
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

#screen-fast-track .fastv9-topic {
  min-width: 0 !important;
  min-height: 44px !important;
  border-radius: 15px !important;
  padding: 5px 5px !important;
  border: 1.4px solid rgba(204, 214, 233, .76) !important;
  background:
    radial-gradient(circle at 30% 12%, rgba(255,255,255,1), transparent 31%),
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(243,248,255,.90)) !important;
  box-shadow:
    0 8px 16px rgba(88, 105, 145, .10),
    inset 0 1px 0 rgba(255,255,255,.98),
    inset 0 -6px 11px rgba(221,230,244,.56) !important;
  color: #172033 !important;
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 5px !important;
  text-align: left !important;
  overflow: hidden !important;
}

#screen-fast-track .fastv9-topic span {
  font-size: 17px !important;
  line-height: 1 !important;
  text-align: center !important;
}

#screen-fast-track .fastv9-topic strong {
  min-width: 0 !important;
  font-size: 10.8px !important;
  line-height: 1.06 !important;
  font-weight: 950 !important;
  letter-spacing: -.12px !important;
  overflow: hidden !important;
}

#screen-fast-track .fastv9-topic.is-active {
  color: #4c28e8 !important;
  border: 2px solid rgba(101, 62, 240, .86) !important;
  background:
    radial-gradient(circle at 30% 12%, rgba(255,255,255,1), transparent 31%),
    linear-gradient(180deg, rgba(255,255,255,.97), rgba(246,240,255,.92)) !important;
  box-shadow:
    0 9px 20px rgba(101, 62, 240, .19),
    0 0 0 3px rgba(101, 62, 240, .075),
    inset 0 1px 0 rgba(255,255,255,.98),
    inset 0 -6px 11px rgba(221,230,244,.56) !important;
}

/* ACTIONS */

#screen-fast-track .fastv9-actions {
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: 1.18fr 1fr !important;
  gap: 9px !important;
  padding-top: 1px !important;
}

#screen-fast-track .fastv9-generate,
#screen-fast-track .fastv9-voice {
  width: 100% !important;
  min-width: 0 !important;
  height: 66px !important;
  border-radius: 21px !important;
  border: 1.7px solid rgba(255,255,255,.72) !important;
  color: #fff !important;
  font-family: inherit !important;
  position: relative !important;
  overflow: hidden !important;
  box-shadow:
    0 14px 27px rgba(68, 54, 160, .22),
    inset 0 2px 0 rgba(255,255,255,.34),
    inset 0 -11px 18px rgba(25, 20, 90, .22) !important;
}

#screen-fast-track .fastv9-generate::before,
#screen-fast-track .fastv9-voice::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(135deg, transparent 34%, rgba(255,255,255,.25) 52%, transparent 70%) !important;
  opacity: .72 !important;
  pointer-events: none !important;
}

#screen-fast-track .fastv9-generate {
  background:
    radial-gradient(circle at 28% 20%, rgba(255,255,255,.24), transparent 28%),
    linear-gradient(135deg, #d54cff 0%, #7b3ff2 48%, #224cff 100%) !important;
  font-size: 19px !important;
  font-weight: 950 !important;
  letter-spacing: -.3px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  text-shadow: 0 2px 10px rgba(24, 20, 92, .28) !important;
}

#screen-fast-track .fastv9-generate-icon {
  font-size: 25px !important;
  line-height: 1 !important;
}

#screen-fast-track .fastv9-generate:disabled {
  opacity: .84 !important;
  filter: saturate(.94) !important;
  cursor: default !important;
}

#screen-fast-track .fastv9-generate:disabled::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: rgba(255,255,255,.07) !important;
  pointer-events: none !important;
}

#screen-fast-track .fastv9-voice {
  background:
    radial-gradient(circle at 25% 18%, rgba(255,255,255,.25), transparent 28%),
    linear-gradient(135deg, #20d7ff 0%, #3868ff 45%, #cf43ff 100%) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  text-align: center !important;
  text-shadow: 0 2px 10px rgba(20, 36, 100, .25) !important;
}

#screen-fast-track .fastv9-voice-icon {
  font-size: 25px !important;
  line-height: 1 !important;
  filter: drop-shadow(0 8px 12px rgba(24, 20, 92, .25)) !important;
}

#screen-fast-track .fastv9-voice-title {
  font-size: 17px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
}

#screen-fast-track .fastv9-voice-sub {
  font-size: 8.8px !important;
  line-height: 1.05 !important;
  font-weight: 750 !important;
  color: rgba(255,255,255,.88) !important;
}

#screen-fast-track .fastv9-privacy {
  min-width: 0 !important;
  text-align: center !important;
  color: #8b95a8 !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
  font-weight: 650 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* ACTIVE STATES */

#screen-fast-track .fastv9-back,
#screen-fast-track .fastv9-ai-btn,
#screen-fast-track .fastv9-topic,
#screen-fast-track .fastv9-generate,
#screen-fast-track .fastv9-voice {
  transition:
    transform .14s ease,
    box-shadow .14s ease,
    filter .14s ease !important;
}

#screen-fast-track .fastv9-back:active,
#screen-fast-track .fastv9-ai-btn:active,
#screen-fast-track .fastv9-topic:active,
#screen-fast-track .fastv9-generate:active,
#screen-fast-track .fastv9-voice:active {
  transform: translateY(1px) scale(.992) !important;
}

/* EXTRA COMPACT */

@media (max-height: 700px) {
  #screen-fast-track .fastv9-screen {
    padding: 6px 11px calc(6px + env(safe-area-inset-bottom, 0px)) !important;
    gap: 5px !important;
  }

  #screen-fast-track .fastv9-header {
    height: 36px !important;
    min-height: 36px !important;
  }

  #screen-fast-track .fastv9-back {
    height: 32px !important;
    width: 76px !important;
    font-size: 12px !important;
  }

  #screen-fast-track .fastv9-title {
    font-size: 17px !important;
  }

  #screen-fast-track .fastv9-badge {
    min-height: 21px !important;
    font-size: 10px !important;
    padding: 3px 9px !important;
  }

  #screen-fast-track .fastv9-hero h1 {
    font-size: 22px !important;
    margin-top: 3px !important;
  }

  #screen-fast-track .fastv9-hero p {
    font-size: 12px !important;
  }

  #screen-fast-track .fastv9-card {
    padding: 10px 11px 9px !important;
    gap: 5px !important;
  }

  #screen-fast-track .fastv9-guide p {
    display: none !important;
  }

  #screen-fast-track .fastv9-example span:nth-of-type(n+3) {
    display: none !important;
  }

  #screen-fast-track .fastv9-card-title {
    font-size: 18px !important;
  }

  #screen-fast-track .fastv9-ai-btn {
    min-height: 31px !important;
    font-size: 10.5px !important;
  }

  #screen-fast-track .fastv9-textarea-shell {
    min-height: 70px !important;
    padding-bottom: 28px !important;
  }

  #screen-fast-track .fastv9-topic {
    min-height: 38px !important;
  }

  #screen-fast-track .fastv9-generate,
  #screen-fast-track .fastv9-voice {
    height: 58px !important;
  }

  #screen-fast-track .fastv9-privacy {
    display: none !important;
  }
}

/* AI BUTTON STATES */

#screen-fast-track .fastv9-ai-btn.is-ready {
  filter: brightness(1.18) saturate(1.18) !important;
  box-shadow:
    0 12px 24px rgba(109, 61, 242, .32),
    inset 0 2px 0 rgba(255,255,255,.32),
    inset 0 -8px 14px rgba(44, 32, 120, .22) !important;
}

#screen-fast-track .fastv9-ai-btn.is-nudge {
  animation: fastv9-ai-pulse 2.6s ease-in-out infinite !important;
}

@keyframes fastv9-ai-pulse {
  0%, 100% {
    box-shadow:
      0 10px 20px rgba(109, 61, 242, .24),
      inset 0 2px 0 rgba(255,255,255,.32),
      inset 0 -8px 14px rgba(44, 32, 120, .22);
    filter: brightness(1) saturate(1);
  }
  50% {
    box-shadow:
      0 14px 30px rgba(109, 61, 242, .42),
      0 0 0 4px rgba(109, 61, 242, .12),
      inset 0 2px 0 rgba(255,255,255,.32),
      inset 0 -8px 14px rgba(44, 32, 120, .22);
    filter: brightness(1.25) saturate(1.2);
  }
}

#screen-fast-track .fastv9-ai-btn.is-loading {
  pointer-events: none !important;
  cursor: default !important;
  filter: brightness(.92) !important;
  transition: none !important;
}

#screen-fast-track .fastv9-ai-btn.is-loading .fastv9-ai-icon {
  animation: fastv9-spin 1s linear infinite !important;
  display: inline-block !important;
}

@keyframes fastv9-spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* VOICE BUTTON STATES */

#screen-fast-track .fastv9-voice.is-loading {
  pointer-events: none !important;
  cursor: default !important;
  filter: brightness(.88) !important;
}

#screen-fast-track .fastv9-voice.is-loading .fastv9-voice-icon {
  animation: fastv9-spin 1s linear infinite !important;
  display: inline-block !important;
}

/* GENERATE BUTTON — disabled polish */

#screen-fast-track .fastv9-generate:disabled {
  opacity: .84 !important;
  filter: saturate(.94) !important;
  cursor: default !important;
}

#screen-fast-track .fastv9-generate:disabled::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: rgba(255,255,255,.07) !important;
  pointer-events: none !important;
}

#screen-fast-track .fastv9-generate:not(:disabled) {
  filter: brightness(1.08) !important;
  box-shadow:
    0 16px 32px rgba(68, 54, 160, .30),
    inset 0 2px 0 rgba(255,255,255,.34),
    inset 0 -11px 18px rgba(25, 20, 90, .22) !important;
}

/* ===== FAST TRACK V9 — FIT PREMIUM UI END ===== */