/* New Session / route launcher polish.
   Keep this surface dense and quiet while giving its primary actions distinct,
   scan-friendly treatments. This file is appended after styles.css by the
   trusted app protocol so these narrowly-scoped rules win over legacy launcher
   overrides without changing unrelated desktop chrome. */

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) {
  border-color: #31404c !important;
  background: #0b1117 !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launch-group-card {
  border-color: #334754 !important;
  background: #101820 !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launch-remove-group {
  box-sizing: border-box !important;
  width: 26px !important;
  min-width: 26px !important;
  max-width: 26px !important;
  height: 26px !important;
  min-height: 26px !important;
  max-height: 26px !important;
  aspect-ratio: 1 / 1 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-color: #b9474f !important;
  background: #3a171b !important;
  color: #ffd9dc !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launch-remove-group:hover:not(:disabled) {
  border-color: #e07b82 !important;
  background: #531c22 !important;
  color: #ffffff !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launch-remove-group .route-launch-action-icon {
  display: block !important;
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
  fill: currentColor !important;
}

/* New Team: approved peach treatment, intentionally distinct from Launch. */
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-new-team, [data-replica-id="route-launch-new-team"]).route-launch-new-team-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  border: 1px solid #e5a092 !important;
  border-radius: 4px !important;
  background: #c86f63 !important;
  color: #fffaf7 !important;
  font-weight: 700 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-new-team, [data-replica-id="route-launch-new-team"]).route-launch-new-team-button:hover:not(:disabled) {
  border-color: #f0b1a5 !important;
  background: #d47c70 !important;
  color: #ffffff !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-new-team, [data-replica-id="route-launch-new-team"]).route-launch-new-team-button:active:not(:disabled) {
  background: #b95f55 !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-new-team, [data-replica-id="route-launch-new-team"]).route-launch-new-team-button::before {
  content: "";
  width: 11px;
  height: 11px;
  flex: 0 0 11px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M11 4h2v7h7v2h-7v7h-2v-7H4v-2h7V4z%22/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M11 4h2v7h7v2h-7v7h-2v-7H4v-2h7V4z%22/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Accounts: vivid pink-violet utility action with a readable account glyph. */
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-accounts, [data-replica-id="route-launch-accounts"]).route-launch-accounts-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  border: 1px solid #f4a4ff !important;
  border-radius: 4px !important;
  background: linear-gradient(135deg, #9c3d76, #6537a5) !important;
  background-color: #7d3f8e !important;
  color: #fff0ff !important;
  font-weight: 700 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-accounts, [data-replica-id="route-launch-accounts"]).route-launch-accounts-button:hover:not(:disabled) {
  border-color: #ffccff !important;
  background: linear-gradient(135deg, #b84f8c, #8051c9) !important;
  background-color: #9950aa !important;
  color: #ffffff !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launch-action-icon {
  display: block;
  width: 13px;
  height: 13px;
  flex: 0 0 13px;
  fill: currentColor;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-accounts, [data-replica-id="route-launch-accounts"]).route-launch-accounts-button::before,
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-save-preset, [data-replica-id="route-launch-save-preset"]).route-launch-save-preset-button::before,
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-delete-preset, [data-replica-id="route-launch-delete-preset"]).route-launch-delete-preset-button::before {
  content: none !important;
}

/* Preset actions are deliberately icon-only: the title/text remains in the DOM
   for accessibility while the compact surface gets the two missing glyphs. */
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-save-preset, [data-replica-id="route-launch-save-preset"]).route-launch-save-preset-button,
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-delete-preset, [data-replica-id="route-launch-delete-preset"]).route-launch-delete-preset-button {
  width: 28px !important;
  min-width: 28px !important;
  height: 26px !important;
  min-height: 26px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 4px !important;
  font-size: 0 !important;
  line-height: 1 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-delete-preset, [data-replica-id="route-launch-delete-preset"]).route-launch-delete-preset-button[hidden] {
  display: none !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-save-preset, [data-replica-id="route-launch-save-preset"]).route-launch-save-preset-button {
  border-color: #2f8c66 !important;
  background: #123c2b !important;
  color: #dff8ec !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-save-preset, [data-replica-id="route-launch-save-preset"]).route-launch-save-preset-button:hover:not(:disabled) {
  border-color: #43a97e !important;
  background: #184b37 !important;
  color: #ffffff !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-delete-preset, [data-replica-id="route-launch-delete-preset"]).route-launch-delete-preset-button {
  border-color: #9c4147 !important;
  background: #35171a !important;
  color: #ffd9dc !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-delete-preset, [data-replica-id="route-launch-delete-preset"]).route-launch-delete-preset-button:hover:not(:disabled) {
  border-color: #bf555b !important;
  background: #471d22 !important;
  color: #ffffff !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-save-preset, [data-replica-id="route-launch-save-preset"]).route-launch-save-preset-button::before,
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-delete-preset, [data-replica-id="route-launch-delete-preset"]).route-launch-delete-preset-button::before {
  content: none !important;
}

/* Launch is the sole orange CTA. It intentionally has NO icon. */
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-load, [data-replica-id="route-launch-load"]).modal-save-button {
  border: 1px solid #e08a36 !important;
  border-radius: 4px !important;
  background: #b85c17 !important;
  color: #fff8ef !important;
  font-weight: 750 !important;
  text-shadow: none !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-load, [data-replica-id="route-launch-load"]).modal-save-button:hover:not(:disabled) {
  border-color: #f0a04e !important;
  background: #ca6a20 !important;
  color: #ffffff !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-load, [data-replica-id="route-launch-load"]).modal-save-button:active:not(:disabled) {
  background: #9f4b10 !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-load, [data-replica-id="route-launch-load"]).modal-save-button::before,
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(#route-launch-load, [data-replica-id="route-launch-load"]).modal-save-button::after {
  content: none !important;
  display: none !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .modal-close-button {
  border-color: #874047 !important;
  background: #281517 !important;
  color: #f5dde0 !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .modal-close-button:hover:not(:disabled) {
  border-color: #a94e56 !important;
  background: #351a1e !important;
  color: #ffffff !important;
}

/* The legacy launcher stylesheet hides edit controls while a staged launch is
   running. These rules repeat that contract after the new flex declarations so
   the polish layer can never make those controls reappear. */
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]).launching :is(#route-launch-new-team, [data-replica-id="route-launch-new-team"]).route-launch-new-team-button,
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]).launching :is(#route-launch-accounts, [data-replica-id="route-launch-accounts"]).route-launch-accounts-button {
  display: none !important;
}

/* Keep the visible header controls tight. When Delete is hidden, its named
   grid area must not leave a phantom column between Save and New Team. */
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launcher-head {
  grid-template-columns: max-content max-content max-content minmax(0, 1fr) max-content !important;
  grid-template-areas: "presets save new badges accounts" !important;
  column-gap: 3px !important;
  row-gap: 4px !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launcher-head:has(.route-launch-delete-preset-button:not([hidden])) {
  grid-template-columns: max-content max-content max-content max-content minmax(0, 1fr) max-content !important;
  grid-template-areas: "presets save delete new badges accounts" !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]).modal-panel-route-launcher[data-modal-size-category="large"] {
  --route-launch-content-pad-x: 1px;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launch-team-panel {
  padding-left: 3px !important;
  padding-right: 3px !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launch-team-panel[data-launch-mode="groups"] .route-launch-team-list:has(> .empty-state) {
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  justify-content: center !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launch-team-panel[data-launch-mode="groups"] .route-launch-team-list:has(> .empty-state) > .empty-state {
  grid-column: 1 / -1 !important;
  justify-self: stretch !important;
  text-align: center !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launcher-head .route-launch-preset-select,
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launcher-head .route-launch-save-preset-button,
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launcher-head .route-launch-new-team-button {
  box-sizing: border-box !important;
  height: var(--route-launch-control-height) !important;
  min-height: var(--route-launch-control-height) !important;
  border-radius: 4px !important;
}

/* Reserve a separate chevron gutter without widening the preset control. */
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) .route-launcher-head .route-launch-preset-select {
  padding-left: 5px !important;
  padding-right: 18px !important;
  text-align: left !important;
  text-align-last: left !important;
}

/* New Session scrim: 66% on the launcher frame, 78% on its inner work cards. */
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]),
:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) > .modal-body-route-launcher {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.66), rgba(0, 0, 0, 0.66)),
    url("./assets/slate_seamless_v3.webp") !important;
  background-repeat: repeat, repeat !important;
  background-position: top left, top left !important;
  background-size: 100% 100%, 25% 25% !important;
  background-color: #050507 !important;
}

:is(#modal-layer, [data-replica-id="modal-layer"]) > :is(#modal-route-launcher, [data-replica-id="modal-route-launcher"]) :is(
  .route-launch-team-panel,
  .route-launch-group-card,
  .route-launch-plan,
  .route-launch-pool-actions,
  .modal-actions
) {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.78), rgba(0, 0, 0, 0.78)),
    url("./assets/slate_seamless_v3.webp") !important;
  background-repeat: repeat, repeat !important;
  background-position: top left, top left !important;
  background-size: 100% 100%, 25% 25% !important;
  background-color: #050507 !important;
}