@font-face {
  font-family: "Twemoji Country Flags";
  src: url("/static/fonts/TwemojiCountryFlags.woff2") format("woff2");
  unicode-range: U+1F1E6-1F1FF, U+1F3F4, U+E0062-E0063, U+E0065, U+E0067,
    U+E006C, U+E006E, U+E0073-E0074, U+E0077, U+E007F;
  font-display: swap;
}

:root {
  color-scheme: dark;
  --bg: #0f1419;
  --fg: #e7e9ea;
  --muted: #8b98a5;
  --accent: #1d9bf0;
  --err: #f4212e;
  --warn: #e8a85c;
  --border: #38444d;
  --theme-top-bg: rgba(15, 20, 25, 0.96);
  --theme-top-bg-elevated: rgba(21, 32, 43, 0.98);
  --theme-nav-bg: rgba(21, 32, 43, 0.62);
  --theme-nav-hover-bg: rgba(36, 48, 65, 0.78);
  --theme-active-bg: rgba(29, 155, 240, 0.16);
  --theme-active-border: rgba(29, 155, 240, 0.42);
  --theme-active-fg: #eaf6ff;
  --theme-control-bg: #15202b;
  --theme-control-bg-strong: #0f1419;
  --theme-control-hover-bg: #172536;
  --theme-control-placeholder: rgba(139, 152, 165, 0.82);
  --theme-card-bg: #15202b;
  --theme-shadow-strong: rgba(0, 0, 0, 0.35);
  --theme-focus-ring: rgba(29, 155, 240, 0.18);
  --theme-on-accent: #061118;
}

* { box-sizing: border-box; }
/* .btn задаёт display:inline-flex — без !important скрытие по атрибуту [hidden] может не срабатывать */
[hidden] {
  display: none !important;
}
body {
  margin: 0;
  font-family: "Twemoji Country Flags", ui-sans-serif, system-ui, sans-serif;
  background: var(--bg);
  color: var(--fg);
  line-height: 1.5;
}
.top {
  display: grid;
  grid-template-columns: minmax(300px, auto) minmax(280px, 1fr) auto;
  align-items: center;
  gap: 1rem;
  min-height: 58px;
  padding: 0.55rem 1rem;
  border-bottom: 1px solid var(--border);
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  position: sticky;
  top: 0;
  z-index: 180;
  isolation: isolate;
}
.top::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: var(--theme-top-bg);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}
.top > .top-inner {
  position: relative;
  z-index: 1;
}
.top-left,
.top-center,
.top-actions {
  display: flex;
  align-items: center;
  min-width: 0;
}
.top-left {
  gap: 0.9rem;
}
.top-center {
  justify-content: center;
}
.top-actions {
  gap: 0.65rem;
  justify-content: flex-end;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  color: var(--fg);
  text-decoration: none;
  white-space: nowrap;
}
.brand:hover { color: var(--fg); opacity: 0.94; }
.brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 0.65rem;
  overflow: hidden;
  background: #0f1419;
  box-shadow: 0 8px 22px rgba(29, 155, 240, 0.22);
}
.brand-mark img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.brand-word {
  font-weight: 760;
  letter-spacing: 0;
  font-size: 0.98rem;
}
.logout-form {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}
.current-user {
  color: var(--muted);
  font-size: 0.84rem;
  white-space: nowrap;
  max-width: 12rem;
  overflow: hidden;
  text-overflow: ellipsis;
}
.top-nav,
.top-quick-nav {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.2rem;
  border: 1px solid rgba(56, 68, 77, 0.72);
  border-radius: 0.8rem;
  background: var(--theme-nav-bg);
}
.nav-icon-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.55rem;
  border: 1px solid transparent;
  border-radius: 0.65rem;
  color: var(--muted) !important;
  text-decoration: none;
  background: transparent;
  cursor: pointer;
  font-family: inherit;
}
.nav-icon-link svg {
  width: 1.05rem;
  height: 1.05rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: 0 0 auto;
}
.nav-icon-label {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}
.nav-icon-link:hover,
.nav-icon-link:focus-visible {
  color: var(--fg) !important;
  background: var(--theme-nav-hover-bg);
  border-color: rgba(74, 92, 106, 0.75);
  outline: none;
}
.nav-icon-link.is-active {
  color: var(--theme-active-fg) !important;
  background: var(--theme-active-bg);
  border-color: var(--theme-active-border);
}
.nav-icon-link--button {
  min-width: 2.25rem;
}
.top-quick-nav {
  flex: 0 0 auto;
  padding: 0;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}
.top-quick-nav .top-quick-link {
  width: 2.35rem;
  min-width: 2.35rem;
  padding: 0;
}
.top-quick-nav .top-quick-link.is-active {
  color: var(--theme-active-fg) !important;
  background: transparent;
  border-color: transparent;
}
.top-menu {
  position: relative;
}
.top-menu-trigger {
  width: 2.35rem;
  padding: 0;
  transition:
    color 150ms ease,
    background-color 150ms ease,
    border-color 150ms ease,
    box-shadow 180ms ease,
    transform 180ms cubic-bezier(0.2, 0, 0, 1);
}
.top-menu-trigger::-webkit-details-marker {
  display: none;
}
.top-menu-trigger::marker {
  content: "";
}
.top-menu-trigger svg {
  overflow: visible;
}
.top-menu-trigger svg path {
  transform-box: view-box;
  transform-origin: 12px 12px;
  transition:
    opacity 140ms ease,
    transform 220ms cubic-bezier(0.2, 0, 0, 1);
}
.top-menu[open] .top-menu-trigger {
  color: var(--theme-active-fg) !important;
  background: var(--theme-active-bg);
  border-color: var(--theme-active-border);
}
.top-menu.is-open .top-menu-trigger {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(29, 155, 240, 0.16);
}
.top-menu.is-open .top-menu-trigger svg path:nth-child(1) {
  transform: translateY(5px) rotate(45deg);
}
.top-menu.is-open .top-menu-trigger svg path:nth-child(2) {
  opacity: 0;
  transform: scaleX(0.25);
}
.top-menu.is-open .top-menu-trigger svg path:nth-child(3) {
  transform: translateY(-5px) rotate(-45deg);
}
.top-menu-panel {
  position: absolute;
  top: calc(100% + 0.55rem);
  left: 0;
  z-index: 320;
  width: max-content;
  min-width: 14.5rem;
  max-width: min(18rem, calc(100vw - 2rem));
  padding: 0.35rem;
  border: 1px solid rgba(56, 68, 77, 0.82);
  border-radius: 0.85rem;
  background: var(--theme-top-bg-elevated);
  box-shadow: 0 18px 40px var(--theme-shadow-strong);
}
.top-menu--enhanced .top-menu-panel {
  opacity: 0;
  pointer-events: none;
  transform: translateY(-0.45rem) scale(0.98);
  transform-origin: top left;
  clip-path: inset(0 0 100% 0 round 0.85rem);
  transition:
    opacity 150ms ease,
    transform 190ms cubic-bezier(0.2, 0, 0, 1),
    clip-path 190ms cubic-bezier(0.2, 0, 0, 1);
  will-change: opacity, transform, clip-path;
}
.top-menu--enhanced.is-open .top-menu-panel {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
  clip-path: inset(0 0 0 0 round 0.85rem);
}
.top-menu--enhanced.is-closing .top-menu-panel {
  opacity: 0;
  transform: translateY(-0.32rem) scale(0.985);
  clip-path: inset(0 0 100% 0 round 0.85rem);
  transition-duration: 120ms, 160ms, 160ms;
}
.top-menu-list {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}
.top-menu-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 1.8rem;
  align-items: center;
  gap: 0.1rem;
  border-radius: 0.65rem;
}
.top-menu-link {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-height: 2.45rem;
  padding: 0.5rem 0.7rem;
  border: 1px solid transparent;
  border-radius: 0.65rem;
  color: var(--muted) !important;
  text-decoration: none;
  white-space: nowrap;
}
.top-menu--enhanced[open] .top-menu-item {
  opacity: 0;
  transform: translateY(-0.25rem);
}
.top-menu--enhanced.is-open .top-menu-item {
  animation: top-menu-link-in 220ms cubic-bezier(0.2, 0, 0, 1) both;
}
.top-menu--enhanced.is-open .top-menu-item:nth-child(1) { animation-delay: 20ms; }
.top-menu--enhanced.is-open .top-menu-item:nth-child(2) { animation-delay: 35ms; }
.top-menu--enhanced.is-open .top-menu-item:nth-child(3) { animation-delay: 50ms; }
.top-menu--enhanced.is-open .top-menu-item:nth-child(4) { animation-delay: 65ms; }
.top-menu--enhanced.is-open .top-menu-item:nth-child(5) { animation-delay: 80ms; }
.top-menu--enhanced.is-open .top-menu-item:nth-child(6) { animation-delay: 95ms; }
.top-menu--enhanced.is-open .top-menu-item:nth-child(7) { animation-delay: 110ms; }
.top-menu--enhanced.is-open .top-menu-item:nth-child(8) { animation-delay: 125ms; }
.top-menu--enhanced.is-open .top-menu-item:nth-child(9) { animation-delay: 140ms; }
@keyframes top-menu-link-in {
  from {
    opacity: 0;
    transform: translateY(-0.25rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.top-menu-link svg {
  width: 1.05rem;
  height: 1.05rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: 0 0 auto;
}
.top-menu-link:hover,
.top-menu-link:focus-visible {
  color: var(--fg) !important;
  background: var(--theme-nav-hover-bg);
  border-color: rgba(74, 92, 106, 0.75);
  outline: none;
}
.top-menu-link.is-active {
  color: var(--theme-active-fg) !important;
  background: var(--theme-active-bg);
  border-color: var(--theme-active-border);
}
.top-menu-link-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.top-menu-pin-toggle {
  display: inline-grid;
  place-items: center;
  width: 1.65rem;
  height: 1.65rem;
  margin-right: 0.1rem;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-family: inherit;
  font-size: 1rem;
  font-weight: 750;
  line-height: 1;
  opacity: 0.42;
  transition:
    opacity 150ms ease,
    color 150ms ease,
    background-color 150ms ease,
    border-color 150ms ease;
}
.top-menu-item:hover .top-menu-pin-toggle,
.top-menu-pin-toggle:focus-visible {
  opacity: 0.9;
}
.top-menu-pin-toggle:hover,
.top-menu-pin-toggle:focus-visible {
  color: var(--fg);
  background: var(--theme-nav-hover-bg);
  border-color: rgba(74, 92, 106, 0.75);
  outline: none;
}
.top-menu-pin-toggle.is-pinned {
  opacity: 0.36;
}
.top-menu-pin-toggle.is-pinned:hover,
.top-menu-pin-toggle.is-pinned:focus-visible {
  opacity: 0.85;
}
.top-menu-pin-symbol {
  transform: translateY(-0.03rem);
}
@media (prefers-reduced-motion: reduce) {
  .top-menu-trigger,
  .top-menu-trigger svg path,
  .top-menu-panel {
    transition: none;
  }
  .top-menu--enhanced[open] .top-menu-item,
  .top-menu--enhanced.is-open .top-menu-item {
    animation: none;
    opacity: 1;
    transform: none;
  }
}
.nav-app-search {
  position: relative;
  width: min(100%, 42rem);
  min-width: 16rem;
}
.nav-app-search-icon {
  position: absolute;
  left: 0.82rem;
  top: 50%;
  width: 0.82rem;
  height: 0.82rem;
  border: 2px solid var(--muted);
  border-radius: 50%;
  pointer-events: none;
  transform: translateY(-52%);
  opacity: 0.78;
}
.nav-app-search-icon::after {
  content: "";
  position: absolute;
  right: -0.36rem;
  bottom: -0.22rem;
  width: 0.5rem;
  height: 2px;
  background: var(--muted);
  border-radius: 999px;
  transform: rotate(45deg);
}
.nav-app-search-input {
  width: 100%;
  box-sizing: border-box;
  padding: 0.55rem 0.85rem 0.55rem 2.35rem;
  font-size: 0.94rem;
  line-height: 1.35;
  background: rgba(21, 32, 43, 0.72);
  border: 1px solid rgba(56, 68, 77, 0.9);
  color: var(--fg);
  border-radius: 0.85rem;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
}
.nav-app-search-input:focus {
  outline: none;
  border-color: rgba(29, 155, 240, 0.78);
  box-shadow: 0 0 0 3px rgba(29, 155, 240, 0.15), inset 0 1px 0 rgba(255,255,255,0.04);
  background: rgba(21, 32, 43, 0.96);
}
.nav-app-search-input::placeholder {
  color: var(--muted);
}
/* Индикатор запроса: тонкая полоска под полем (пока грузятся подсказки). */
.nav-app-search-busy-bar {
  position: relative;
  height: 3px;
  margin-top: 2px;
  border-radius: 2px;
  background: #243041;
  overflow: hidden;
}
.nav-app-search-busy-bar[hidden] {
  display: none !important;
}
.nav-app-search-busy-bar-fill {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 38%;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--accent), #7cc8f8);
  animation: nav-app-search-busy-slide 0.9s ease-in-out infinite;
}
@keyframes nav-app-search-busy-slide {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(280%);
  }
}
.nav-app-search-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 7px;
  max-height: min(50vh, 20rem);
  overflow-y: auto;
  background: #15202b;
  border: 1px solid var(--border);
  border-radius: 0.85rem;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  z-index: 200;
}
.nav-app-search-loading-hint {
  margin: 0;
  padding: 0.55rem 0.75rem 0.65rem;
  font-size: 0.85rem;
  color: var(--muted);
}
.nav-app-search-recent-heading {
  margin: 0;
  padding: 0.45rem 0.75rem 0.2rem;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}
.nav-app-search-results {
  list-style: none;
  margin: 0;
  padding: 0.25rem 0;
}
.nav-app-search-result-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: stretch;
  border-bottom: 1px solid #243041;
}
.nav-app-search-result-row:hover,
.nav-app-search-result-row:focus-within {
  background: #1a2733;
}
.nav-app-search-result-row--no-actions {
  grid-template-columns: minmax(0, 1fr);
}
.nav-app-search-item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 0.6rem;
  padding: 0.45rem 0.65rem;
  min-width: 0;
  text-decoration: none;
  color: var(--fg) !important;
}
.nav-app-search-item-icon-wrap {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: linear-gradient(110deg, #162231 8%, #203146 18%, #162231 33%);
  background-size: 200% 100%;
  animation: progressive-icon-shimmer 1.1s linear infinite;
}
.nav-app-search-item-icon {
  display: block;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  object-fit: cover;
  background: #1a2733;
}
.nav-app-search-item-icon--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: #1a2733;
  color: var(--muted);
  font-size: 0.75rem;
}
.nav-app-search-item-body {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  min-width: 0;
  flex: 1;
}
.nav-app-search-results li:last-child .nav-app-search-result-row {
  border-bottom: none;
}
.nav-app-search-item:hover,
.nav-app-search-item:focus {
  background: transparent;
}
.nav-app-search-actions {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.25rem;
  padding: 0.42rem 0.55rem 0.42rem 0;
}
.nav-app-search-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.62rem;
  padding: 0.18rem 0.46rem;
  border: 1px solid rgba(143, 211, 255, 0.28);
  border-radius: 7px;
  background: rgba(143, 211, 255, 0.08);
  color: #b8e3ff;
  font-size: 0.74rem;
  font-weight: 700;
  line-height: 1.1;
  text-decoration: none;
  white-space: nowrap;
}
.nav-app-search-action:hover,
.nav-app-search-action:focus-visible {
  outline: none;
  border-color: rgba(143, 211, 255, 0.52);
  background: rgba(143, 211, 255, 0.08);
}
.nav-app-search-item-title {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
  font-size: 0.9rem;
}
.nav-app-search-item-meta {
  display: block;
  overflow: visible;
  overflow-wrap: anywhere;
  white-space: normal;
  line-height: 1.3;
  font-size: 0.78rem;
  color: var(--muted);
}
.nav-app-search-empty {
  padding: 0.65rem 0.75rem;
  font-size: 0.88rem;
  color: var(--muted);
}
.nav-app-search-err {
  color: var(--err);
}
.container { max-width: 960px; margin: 0 auto; padding: 1.25rem; }
/* /apps — сводная таблица по всем запускам: 10 колонок, длинные email-ы, иконки и пилюли.
   Ограничение 960px на этой странице режет полезное пространство, поэтому расширяем
   контейнер на всю ширину окна (до 1920px как потолок, чтобы на ультрашироких мониторах
   строки не растягивались до нечитаемых «лент»). */
body.page-apps .container {
  max-width: min(100%, 1920px);
  padding: 1.25rem 1.5rem;
}
body.page-apple-accounts .container {
  max-width: min(100%, 1920px);
  padding: 1.25rem 1.5rem 2rem;
}
body.page-analytics .container,
body.page-smart-analysis .container {
  max-width: min(100%, 1440px);
  padding: 1.25rem 1.5rem 2rem;
}
body.page-binom .container {
  max-width: min(100%, 2048px);
  padding: 0;
}
h1 { font-size: 1.5rem; margin-top: 0; }

.analytics-hero {
  display: grid;
  grid-template-columns: 1fr;
  align-items: stretch;
  gap: 1rem;
  margin-bottom: 1.25rem;
  padding: 1rem 1.15rem;
  border: 1px solid rgba(124, 200, 248, 0.22);
  border-radius: 10px;
  background: #111a24;
  box-shadow: none;
}
.analytics-hero-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 1.5rem;
  flex-wrap: wrap;
}
.analytics-hero h1 {
  margin-bottom: 0.25rem;
}
.analytics-hero-copy {
  max-width: 760px;
  margin: 0;
}
.eyebrow {
  margin: 0 0 0.25rem;
  color: var(--accent);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.analytics-kpis {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.analytics-kpi,
.analytics-card {
  border: 1px solid var(--border);
  border-radius: 14px;
  background: linear-gradient(180deg, #15202b 0%, #111a23 100%);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
}
.analytics-kpi {
  position: relative;
  padding: 0.9rem 1rem;
  overflow: hidden;
  background:
    radial-gradient(circle at 88% 16%, hsl(var(--kpi-hue), 70%, 48%, 0.28), transparent 34%),
    linear-gradient(180deg, hsl(var(--kpi-hue), 34%, 20%) 0%, #111a23 100%);
  border-color: hsl(var(--kpi-hue), 38%, 32%);
}
.analytics-kpi::after {
  content: "";
  position: absolute;
  inset: auto -1.5rem -2rem auto;
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  background: hsl(var(--kpi-hue), 72%, 52%, 0.12);
  pointer-events: none;
}
.analytics-kpi--runs { --kpi-hue: 204; }
.analytics-kpi--success { --kpi-hue: 138; }
.analytics-kpi--units { --kpi-hue: 265; }
.analytics-kpi--managers { --kpi-hue: 32; }
.analytics-kpi--asc { --kpi-hue: 188; }
.analytics-kpi--locales { --kpi-hue: 312; }
.analytics-kpi-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  margin-bottom: 0.55rem;
  border-radius: 10px;
  background: hsl(var(--kpi-hue), 70%, 52%, 0.18);
  color: hsl(var(--kpi-hue), 90%, 82%);
  box-shadow: inset 0 0 0 1px hsl(var(--kpi-hue), 58%, 52%, 0.28);
  font-weight: 800;
  line-height: 1;
}
.analytics-kpi-label {
  display: block;
  color: hsl(var(--kpi-hue), 62%, 82%);
  font-size: 0.82rem;
}
.analytics-kpi strong {
  display: block;
  margin-top: 0.25rem;
  font-size: 1.55rem;
  line-height: 1.1;
}
.analytics-kpi--success strong {
  color: #7ee787;
}
.analytics-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0;
  padding: 0.35rem;
  border: 1px solid rgba(124, 200, 248, 0.18);
  border-radius: 10px;
  background: rgba(15, 24, 34, 0.58);
}
.analytics-tab {
  appearance: none;
  display: inline-flex;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 0.55rem 0.85rem;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 0.9rem;
  font-weight: 650;
  cursor: pointer;
  text-decoration: none;
}
.analytics-tab:hover,
.analytics-tab:focus-visible {
  color: var(--fg);
  border-color: #2f3d4a;
  outline: none;
}
.analytics-tab.is-active {
  color: #d9f1ff;
  background: #152536;
  border-color: #2f81c7;
  box-shadow: 0 0 0 3px rgba(29, 155, 240, 0.14);
}
.page-analytics .analytics-tab-panel {
  display: none;
}
.page-analytics .analytics-tab-panel.is-active {
  display: block !important;
}
.analytics-tab-panel[hidden] {
  display: none;
}
.analytics-date-filter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.analytics-date-presets,
.analytics-date-range-form {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}
.analytics-date-preset {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.35rem 0.65rem;
  border: 1px solid transparent;
  border-radius: 999px;
  color: var(--muted);
  text-decoration: none;
  font-size: 0.86rem;
  font-weight: 650;
}
.analytics-date-preset:hover,
.analytics-date-preset:focus-visible {
  color: var(--fg);
  border-color: #2f3d4a;
}
.analytics-date-preset.is-active {
  color: #d9f1ff;
  background: #152536;
  border-color: #2f81c7;
}
.analytics-date-range-form label {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  color: var(--muted);
  font-size: 0.84rem;
}
.analytics-date-range-form input[type="date"] {
  min-height: 2rem;
  padding: 0.25rem 0.45rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #182638;
  color: var(--fg);
  color-scheme: dark;
  accent-color: var(--accent);
  font: inherit;
  font-size: 0.86rem;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}
.analytics-date-range-form input[type="date"]:hover,
.analytics-date-range-form input[type="date"]:focus {
  border-color: #2f81c7;
  outline: none;
  background: #1b2b3f;
}
.analytics-date-range-form input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 1;
  cursor: pointer;
  filter: invert(72%) sepia(44%) saturate(1422%) hue-rotate(174deg) brightness(101%) contrast(92%);
  border-radius: 6px;
  padding: 0.12rem;
}
.analytics-date-range-form input[type="date"]::-webkit-calendar-picker-indicator:hover {
  background: rgba(124, 200, 248, 0.16);
}
.analytics-date-current {
  margin-left: 0.25rem;
  white-space: nowrap;
}
.analytics-dimension-filter {
  margin: 0;
}
.analytics-filter-toolbar {
  gap: 0.75rem;
}
.analytics-filter-form-controls {
  display: contents;
}
.analytics-date-menu {
  flex: 0 1 14rem;
  min-width: min(100%, 12rem);
}
.page-analytics .analytics-date-menu .apps-filter-menu-panel {
  min-width: max(100%, 17rem);
}
.page-analytics .analytics-hero .analytics-dimension-filter {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.page-analytics .analytics-filter-drop summary {
  box-sizing: border-box;
  height: 56px;
  min-height: 56px;
  padding: 7px 32px 7px 11px;
}
.page-analytics .analytics-date-menu summary {
  box-sizing: border-box;
  height: 56px;
  min-height: 56px;
}
.page-analytics .analytics-filter-submit,
.page-analytics .portfolio-filters-clear {
  align-self: stretch;
  min-height: 56px;
  border-radius: 9px;
}
.analytics-filter-body {
  max-height: 320px;
}
.analytics-filter-row {
  align-items: center;
}
.analytics-filter-option-count {
  margin-left: auto;
  color: #93c5fd;
  font-size: 0.76rem;
  font-variant-numeric: tabular-nums;
}
.analytics-filter-empty {
  display: block;
  min-width: 13rem;
  padding: 0.35rem 0.15rem;
}
.analytics-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.9rem;
  margin-bottom: 1rem;
}
.analytics-grid--time {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.analytics-card {
  padding: 1rem;
}
.analytics-card h2 {
  margin: 0 0 0.75rem;
  font-size: 1rem;
}
.analytics-card-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.75rem;
}
.analytics-card-heading h2 {
  margin-bottom: 0;
}
.analytics-line-max {
  color: var(--muted);
  font-size: 0.78rem;
  white-space: nowrap;
}
.analytics-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin: 1.1rem 0 0.75rem;
}
.analytics-section-heading h2 {
  margin: 0;
  font-size: 1.15rem;
}
.analytics-section-heading .hint {
  max-width: 620px;
  margin: 0;
}
.analytics-pie-layout {
  display: grid;
  grid-template-columns: 8.5rem minmax(0, 1fr);
  align-items: center;
  gap: 1rem;
}
.analytics-pie {
  width: 8.5rem;
  aspect-ratio: 1;
  border-radius: 50%;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.08),
    0 12px 28px rgba(0, 0, 0, 0.25);
  position: relative;
}
.analytics-pie::after {
  content: "";
  position: absolute;
  inset: 28%;
  border-radius: 50%;
  background: #111a23;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
}
.analytics-pie-legend {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0.45rem;
}
.analytics-pie-legend-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.45rem;
  cursor: pointer;
  border-radius: 8px;
  padding: 0.1rem 0.15rem;
}
.analytics-pie-legend-row:hover,
.analytics-pie-legend-row:focus-visible {
  background: rgba(255, 255, 255, 0.05);
}
.analytics-pie-swatch {
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 999px;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.12);
}
.analytics-drilldown > summary {
  list-style: none;
}
.analytics-drilldown > summary::-webkit-details-marker {
  display: none;
}
.analytics-drilldown-list {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  max-height: 16rem;
  overflow: auto;
}
.analytics-drilldown-list li {
  display: grid;
  gap: 0.08rem;
  padding: 0.45rem 0.55rem;
  border: 1px solid #253341;
  border-radius: 9px;
  background: rgba(17, 24, 32, 0.82);
}
.analytics-drilldown-list a {
  color: var(--fg);
  font-weight: 700;
  text-decoration: none;
}
.analytics-drilldown-list a:hover,
.analytics-drilldown-list a:focus-visible {
  color: var(--accent);
  text-decoration: underline;
}
.analytics-drilldown-list span,
.analytics-drilldown-list small {
  color: var(--muted);
  font-size: 0.78rem;
}
.analytics-drilldown-list em {
  color: #ffb3b3;
  font-size: 0.78rem;
  font-style: normal;
}
.analytics-drilldown-empty {
  margin: 0.45rem 0 0;
}
.analytics-bars,
.analytics-status-list {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}
.analytics-bar-meta,
.analytics-status-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}
.analytics-bar-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}
.analytics-bar-value,
.analytics-status-item strong {
  flex-shrink: 0;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 600;
}
.analytics-bar-track {
  width: 100%;
  height: 0.55rem;
  margin-top: 0.35rem;
  overflow: hidden;
  border-radius: 999px;
  background: #253341;
}
.analytics-bar-fill {
  display: block;
  width: max(0.25rem, var(--bar-pct));
  max-width: 100%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent), #7cc8f8);
}
.analytics-line-card {
  min-height: 18rem;
}
.analytics-line-plot {
  position: relative;
  height: 13rem;
  margin-top: 0.5rem;
  padding-left: 2.9rem;
  border: 1px solid #253341;
  border-radius: 12px;
  background:
    linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px) 0 0 / 100% 25%,
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px) 0 0 / 25% 100%,
    #111820;
  overflow: visible;
}
.analytics-line-y-axis {
  position: absolute;
  top: 0.75rem;
  bottom: 0.75rem;
  left: 0;
  width: 2.9rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-right: 0.45rem;
  border-right: 1px solid rgba(255, 255, 255, 0.08);
  color: var(--muted);
  font-size: 0.68rem;
  line-height: 1;
  text-align: right;
  pointer-events: none;
}
.analytics-line-y-axis span {
  display: block;
  transform: translateY(50%);
}
.analytics-line-y-axis span:first-child {
  transform: translateY(-50%);
}
.analytics-line-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.analytics-line-svg polyline {
  fill: none;
  stroke: #7cc8f8;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 4px 8px rgba(29, 155, 240, 0.22));
}
.analytics-line-point-wrap {
  position: absolute;
  left: var(--point-x);
  top: var(--point-y);
  transform: translate(-50%, -50%);
  z-index: 2;
}
.analytics-line-point-summary {
  cursor: help;
  position: relative;
}
.analytics-line-point {
  display: block;
  width: 0.72rem;
  height: 0.72rem;
  padding: 0;
  border: 2px solid #d9f1ff;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 4px rgba(29, 155, 240, 0.16);
}
.analytics-line-point-summary:hover .analytics-line-point,
.analytics-line-point-summary:focus-visible .analytics-line-point {
  outline: none;
  transform: scale(1.18);
}
.analytics-line-tooltip {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 0.65rem);
  transform: translateX(-50%);
  width: max-content;
  max-width: min(22rem, 70vw);
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #0b1117;
  color: var(--fg);
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.45);
  font-size: 0.82rem;
  line-height: 1.35;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  z-index: 20;
}
.analytics-line-tooltip strong,
.analytics-line-tooltip span {
  display: block;
}
.analytics-line-tooltip > span {
  color: var(--muted);
  margin-top: 0.15rem;
}
.analytics-line-point-wrap:hover .analytics-line-tooltip,
.analytics-line-point-summary:focus-visible .analytics-line-tooltip,
.analytics-line-point-wrap[open] .analytics-line-tooltip {
  opacity: 1;
  visibility: visible;
}
.analytics-drilldown-panel {
  position: absolute;
  z-index: 30;
  width: min(24rem, 78vw);
  padding: 0.65rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #0b1117;
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.5);
}
.analytics-line-drilldown-panel {
  left: 50%;
  top: calc(100% + 0.8rem);
  transform: translateX(-50%);
}
.analytics-line-tooltip-managers {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  margin-top: 0.5rem;
}
.analytics-line-tooltip-managers span {
  color: var(--fg);
}
.analytics-line-tooltip-managers i {
  display: inline-block;
  width: 0.55rem;
  height: 0.55rem;
  margin-right: 0.3rem;
  border-radius: 50%;
  vertical-align: 0;
}
.analytics-line-axis {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 0.45rem;
  color: var(--muted);
  font-size: 0.76rem;
}
.analytics-stacked-card {
  min-height: 18rem;
}
.analytics-stacked-plot {
  display: flex;
  align-items: flex-end;
  gap: clamp(0.12rem, 0.5vw, 0.5rem);
  height: 13rem;
  padding: 0.75rem 0.75rem 1.8rem;
  border: 1px solid #253341;
  border-radius: 12px;
  background:
    linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px) 0 0 / 100% 25%,
    #111820;
  min-width: 0;
  overflow: visible;
}
.analytics-stacked-column-wrap {
  position: relative;
  display: block;
  flex: 1 1 0;
  min-width: 0;
  height: 100%;
}
.analytics-stacked-summary {
  position: relative;
  display: flex;
  height: 100%;
  align-items: flex-end;
  justify-content: center;
  cursor: pointer;
}
.analytics-stacked-column {
  display: flex;
  flex-direction: column-reverse;
  width: clamp(0.42rem, 74%, 1.8rem);
  height: max(0.3rem, var(--column-height));
  overflow: hidden;
  border-radius: 8px 8px 3px 3px;
  background: #253341;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.24);
  transition: transform 0.12s ease, filter 0.12s ease;
}
.analytics-stacked-column-wrap:hover .analytics-stacked-column,
.analytics-stacked-column-wrap:focus-within .analytics-stacked-column {
  transform: translateY(-2px);
  filter: brightness(1.08);
}
.analytics-stacked-segment {
  display: block;
  min-height: 2px;
  height: var(--segment-height);
  background: var(--segment-color);
}
.analytics-stacked-label {
  position: absolute;
  top: calc(100% + 0.35rem);
  left: 50%;
  transform: translateX(-50%) rotate(-35deg);
  transform-origin: top left;
  color: var(--muted);
  font-size: 0.68rem;
  white-space: nowrap;
}
.analytics-stacked-label--hidden {
  display: none;
}
.analytics-stacked-label--edge-start {
  left: 0;
  transform: rotate(-35deg);
}
.analytics-stacked-label--edge-end {
  left: auto;
  right: 0;
  transform: rotate(-35deg);
  transform-origin: top right;
}
.analytics-stacked-tooltip {
  bottom: calc(100% + 0.5rem);
}
.analytics-stacked-column-wrap:hover .analytics-stacked-tooltip,
.analytics-stacked-column-wrap:focus-within .analytics-stacked-tooltip {
  opacity: 1;
  visibility: visible;
}
.analytics-stacked-drilldown-panel {
  left: 50%;
  bottom: calc(100% + 0.65rem);
  transform: translateX(-50%);
}
.analytics-status-card {
  margin-bottom: 0.5rem;
}
.analytics-status-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
}
.analytics-status-item .analytics-bar-track {
  grid-column: 1 / -1;
  margin-top: 0;
}
.analytics-units-card {
  overflow: hidden;
}
.analytics-unit-columns {
  display: grid;
  grid-template-columns: repeat(var(--unit-count), minmax(13rem, 1fr));
  gap: 0.75rem;
  overflow-x: auto;
  padding-bottom: 0.25rem;
}
.analytics-unit-column {
  min-width: 13rem;
  padding: 0.85rem;
  border: 1px solid color-mix(in srgb, var(--unit-color), #253341 55%);
  border-radius: 12px;
  background:
    radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--unit-color), transparent 72%), transparent 32%),
    #111820;
}
.analytics-unit-column-head {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.75rem;
}
.analytics-unit-column-head h3 {
  margin: 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.95rem;
}
.analytics-unit-metrics {
  display: grid;
  gap: 0.5rem;
  margin: 0;
}
.analytics-unit-metric {
  display: grid;
  gap: 0.18rem;
  padding: 0.5rem 0.55rem;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.035);
}
.analytics-unit-metric dt {
  color: var(--muted);
  font-size: 0.74rem;
}
.analytics-unit-metric dd {
  margin: 0;
}
.analytics-unit-metric strong {
  display: flex;
  align-items: baseline;
  gap: 0.35rem;
  flex-wrap: wrap;
  color: var(--fg);
  font-size: 1.18rem;
  line-height: 1.1;
}
.analytics-unit-percent {
  color: var(--percent-color);
  font-size: 0.82rem;
  font-weight: 800;
}
.analytics-unit-metric dd > span {
  display: block;
  margin-top: 0.12rem;
  color: var(--muted);
  font-size: 0.72rem;
  line-height: 1.25;
}
.analytics-unit-metric--success strong {
  color: #7ee4a1;
}
.analytics-unit-metric--danger strong {
  color: #ff9b9b;
}
.analytics-unit-metric--warning strong {
  color: #ffc978;
}
.analytics-unit-metric--money strong {
  color: #9be7ff;
}

.smart-analysis-history-panel,
.smart-analysis-new-panel,
.smart-analysis-chat-panel {
  border: 1px solid var(--border);
  border-radius: 14px;
  background: #0f1822;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.16);
}

.smart-analysis-workspace {
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
  gap: 0.9rem;
  align-items: start;
}

.smart-analysis-main-column {
  display: grid;
  min-width: 0;
  gap: 0.9rem;
}

.page-smart-analysis .smart-analysis-history-panel,
.page-smart-analysis .smart-analysis-new-panel,
.page-smart-analysis .smart-analysis-chat-panel {
  margin-bottom: 0;
}

.page-smart-analysis .smart-analysis-history-panel {
  position: sticky;
  top: 5.25rem;
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 6.5rem);
  min-height: 24rem;
}

.page-smart-analysis .smart-analysis-history-list {
  flex: 1 1 auto;
  grid-template-columns: 1fr;
  min-height: 0;
  overflow: auto;
  padding-right: 0.1rem;
}

.smart-analysis-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}

.smart-analysis-panel-head h2 {
  margin: 0;
  font-size: 1.05rem;
}

.smart-analysis-history-panel {
  margin-bottom: 0.9rem;
  padding: 1rem;
}

.smart-analysis-history-head,
.smart-analysis-chat-head,
.smart-analysis-actions,
.smart-analysis-compose-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.smart-analysis-history-head h2,
.smart-analysis-chat-head h2 {
  margin: 0 0 0.2rem;
  font-size: 1.05rem;
}

.smart-analysis-history-head .hint,
.smart-analysis-chat-head .hint {
  margin: 0;
}

.smart-analysis-history-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 0.65rem;
  margin-top: 0.85rem;
}

.smart-analysis-history-item {
  display: grid;
  gap: 0.22rem;
  min-height: 5.8rem;
  padding: 0.75rem;
  border: 1px solid rgba(140, 146, 154, 0.28);
  border-radius: 12px;
  background: #111a23;
  color: var(--fg);
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.smart-analysis-history-item:hover,
.smart-analysis-history-item:focus-visible,
.smart-analysis-history-item.is-active {
  border-color: #2f81c7;
  background: #142334;
  outline: none;
}

.smart-analysis-history-item strong,
.smart-analysis-history-item span,
.smart-analysis-history-item small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.smart-analysis-history-item strong {
  color: var(--fg);
  white-space: nowrap;
}

.smart-analysis-history-item span {
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.3;
}

.smart-analysis-history-item small {
  color: #93c5fd;
  font-size: 0.76rem;
}

.smart-analysis-empty {
  margin: 0;
  padding: 0.65rem 0;
}

.smart-analysis-new-panel {
  margin-bottom: 0.9rem;
  padding: 1rem;
}

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

.smart-analysis-new-form label,
.smart-analysis-compose label {
  display: grid;
  gap: 0.3rem;
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 650;
}

.smart-analysis-new-form input[type="text"],
.smart-analysis-new-form textarea,
.smart-analysis-compose textarea {
  width: 100%;
  min-height: var(--density-control-height);
  border: 1px solid rgba(140, 146, 154, 0.34);
  border-radius: 8px;
  background: var(--surface-container-high);
  color: var(--on-surface);
  font: inherit;
  padding: 0.58rem 0.7rem;
}

.smart-analysis-new-form textarea,
.smart-analysis-compose textarea {
  min-height: 6.8rem;
  resize: vertical;
}

.smart-analysis-wide,
.smart-analysis-file,
.smart-analysis-attachments,
.smart-analysis-actions {
  grid-column: 1 / -1;
}

.smart-analysis-file input[type="file"],
.smart-analysis-file-button input[type="file"] {
  width: 100%;
  color: var(--muted);
}

.smart-analysis-file-button {
  position: relative;
  overflow: hidden;
  min-width: 5.5rem;
  justify-content: center;
}

.smart-analysis-file-button input[type="file"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.smart-analysis-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  min-height: 0.35rem;
}

.smart-analysis-attachment-chip {
  max-width: 16rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border: 1px solid rgba(158, 202, 255, 0.28);
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.08);
  color: #d9f1ff;
  font-size: 0.78rem;
  font-weight: 650;
  padding: 0.24rem 0.55rem;
}

.smart-analysis-chat-panel {
  overflow: hidden;
}

.page-smart-analysis .smart-analysis-chat-panel {
  min-height: 28rem;
}

.smart-analysis-chat-head {
  align-items: center;
  padding: 0.9rem 1rem;
  border-bottom: 1px solid rgba(140, 146, 154, 0.2);
}

.smart-analysis-messages {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  max-height: min(62vh, 720px);
  overflow: auto;
  padding: 1rem;
  background: #0b1117;
}

.page-smart-analysis .smart-analysis-messages {
  max-height: min(60vh, 760px);
}

.smart-analysis-message {
  display: grid;
  gap: 0.35rem;
  max-width: min(860px, 88%);
}

.smart-analysis-message--user {
  align-self: flex-end;
}

.smart-analysis-message--assistant {
  align-self: flex-start;
}

.smart-analysis-message-role {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.smart-analysis-message-body {
  white-space: normal;
  overflow-wrap: anywhere;
  border: 1px solid rgba(140, 146, 154, 0.24);
  border-radius: 12px;
  background: #111a23;
  color: var(--fg);
  line-height: 1.48;
  padding: 0.75rem 0.85rem;
}

.smart-analysis-message--user .smart-analysis-message-body {
  white-space: pre-wrap;
  border-color: rgba(158, 202, 255, 0.34);
  background: #16273a;
}

.smart-analysis-message-body--progress {
  border-color: rgba(158, 202, 255, 0.2);
  background: #0d1721;
  color: #b9c7d3;
}

.smart-analysis-progress-stream {
  display: grid;
  gap: 0.35rem;
  font-size: 0.92rem;
}

.smart-analysis-progress-stream::before {
  content: "Поток Codex";
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.smart-analysis-message--assistant .smart-analysis-message-body > :first-child {
  margin-top: 0;
}

.smart-analysis-message--assistant .smart-analysis-message-body > :last-child {
  margin-bottom: 0;
}

.smart-analysis-message-body p,
.smart-analysis-message-body ul,
.smart-analysis-message-body ol,
.smart-analysis-message-body blockquote,
.smart-analysis-message-body pre,
.smart-analysis-message-body table {
  margin: 0.55rem 0;
}

.smart-analysis-message-body ul,
.smart-analysis-message-body ol {
  padding-left: 1.25rem;
}

.smart-analysis-message-body li {
  margin: 0.22rem 0;
}

.smart-analysis-message-body code {
  border: 1px solid rgba(140, 146, 154, 0.22);
  border-radius: 5px;
  padding: 0.06rem 0.28rem;
  background: rgba(255, 255, 255, 0.06);
  color: #d9f1ff;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.92em;
}

.smart-analysis-message-body pre {
  overflow: auto;
  border: 1px solid rgba(140, 146, 154, 0.22);
  border-radius: 8px;
  padding: 0.68rem 0.75rem;
  background: #081019;
}

.smart-analysis-message-body pre code {
  border: 0;
  padding: 0;
  background: transparent;
  white-space: pre;
}

.smart-analysis-message-body blockquote {
  border-left: 3px solid rgba(158, 202, 255, 0.42);
  padding-left: 0.8rem;
  color: #c8d7e3;
}

.smart-analysis-message-body table {
  display: block;
  max-width: 100%;
  overflow: auto;
  border-collapse: collapse;
}

.smart-analysis-message-body th,
.smart-analysis-message-body td {
  border: 1px solid rgba(140, 146, 154, 0.24);
  padding: 0.4rem 0.55rem;
  text-align: left;
  vertical-align: top;
}

.smart-analysis-message-body a {
  color: #8fd3ff;
}

.smart-analysis-md-fallback {
  margin: 0;
  white-space: pre-wrap;
  font: inherit;
}

.smart-analysis-message-images {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.smart-analysis-message-images img {
  display: block;
  width: 92px;
  height: 92px;
  border: 1px solid rgba(140, 146, 154, 0.28);
  border-radius: 10px;
  object-fit: cover;
}

.smart-analysis-message-error {
  margin: 0;
  color: #ffb3b3;
  font-size: 0.84rem;
}

.smart-analysis-compose {
  display: grid;
  gap: 0.7rem;
  padding: 1rem;
  border-top: 1px solid rgba(140, 146, 154, 0.2);
  background: #0f1822;
}

.smart-analysis-compose textarea {
  min-height: 5.4rem;
}

.smart-analysis-compose-row {
  align-items: center;
}

.smart-analysis-compose-row .smart-analysis-attachments {
  flex: 1 1 auto;
}

.is-smart-busy .smart-analysis-message--assistant:last-child .smart-analysis-message-body:empty::after {
  content: "Ответ формируется...";
  color: var(--muted);
}

@media (max-width: 1100px) {
  .analytics-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .analytics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .analytics-grid--time {
    grid-template-columns: 1fr;
  }
  .smart-analysis-workspace {
    grid-template-columns: 1fr;
  }
  .page-smart-analysis .smart-analysis-history-panel {
    position: static;
    max-height: none;
    min-height: 0;
  }
  .page-smart-analysis .smart-analysis-history-list {
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
}
@media (max-width: 720px) {
  .analytics-hero,
  .analytics-hero-head,
  .analytics-card-heading,
  .analytics-section-heading {
    flex-direction: column;
    align-items: stretch;
  }
  .analytics-date-filter,
  .analytics-date-presets,
  .analytics-date-range-form,
  .analytics-filter-toolbar {
    align-items: stretch;
  }
  .analytics-date-range-form label {
    flex: 1 1 10rem;
  }
  .analytics-date-range-form input[type="date"] {
    width: 100%;
  }
  .analytics-kpis,
  .analytics-grid {
    grid-template-columns: 1fr;
  }
  .analytics-pie-layout {
    grid-template-columns: 1fr;
  }
  .analytics-pie {
    width: min(12rem, 70vw);
    margin: 0 auto;
  }
  .smart-analysis-history-head,
  .smart-analysis-chat-head,
  .smart-analysis-actions,
  .smart-analysis-compose-row {
    align-items: stretch;
    flex-direction: column;
  }
  .smart-analysis-new-form {
    grid-template-columns: 1fr;
  }
  .page-smart-analysis .smart-analysis-history-list {
    grid-template-columns: 1fr;
  }
  .smart-analysis-message {
    max-width: 100%;
  }
}
.table {
  width: 100%;
  border-collapse: collapse;
}
.table th, .table td {
  border-bottom: 1px solid var(--border);
  padding: 0.5rem 0.75rem;
  text-align: left;
}
/* таблица: ссылки — через .btn (см. ниже) */
.pill {
  display: inline-block;
  padding: 0.1rem 0.5rem;
  border-radius: 999px;
  background: #203047;
  font-size: 0.85rem;
}
.form label {
  display: block;
  margin-bottom: 0.75rem;
}
.form input, .form textarea, .form select {
  width: 100%;
  max-width: 40rem;
  margin-top: 0.25rem;
  padding: 0.4rem 0.5rem;
  background: var(--theme-control-bg);
  border: 1px solid var(--border);
  color: var(--fg);
  border-radius: 4px;
}
/* Только «голые» кнопки без class — основной стиль задаётся .btn-* */
.form button:not([class]) {
  margin-top: 0.5rem;
  padding: 0.5rem 1rem;
  background: var(--accent);
  border: none;
  color: #fff;
  border-radius: 6px;
  cursor: pointer;
}
.form .btn-primary,
.form .btn-secondary {
  margin-top: 0.5rem;
}
.login-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at 18% 20%, var(--theme-login-glow-primary, rgba(29, 155, 240, 0.18)), transparent 28rem),
    radial-gradient(circle at 80% 10%, var(--theme-login-glow-secondary, rgba(0, 186, 124, 0.14)), transparent 24rem),
    var(--bg);
}
.login-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 2rem 1rem;
}
.login-card {
  width: min(26rem, 100%);
  padding: 1.75rem;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: var(--theme-card-bg);
  box-shadow: 0 18px 50px var(--theme-shadow-strong);
}
.login-card h1 {
  margin: 0.35rem 0 0.5rem;
}
.login-form {
  display: grid;
  gap: 0.9rem;
  margin-top: 1.25rem;
}
.login-form label {
  display: grid;
  gap: 0.35rem;
  font-weight: 700;
}
.login-form input {
  width: 100%;
  padding: 0.65rem 0.75rem;
  background: var(--theme-control-bg-strong);
  border: 1px solid var(--border);
  color: var(--fg);
  border-radius: 8px;
}
.alert {
  padding: 0.75rem 0.85rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.alert-error {
  border-color: var(--danger-border, rgba(244, 33, 46, 0.5));
  background: var(--danger-bg, rgba(244, 33, 46, 0.12));
  color: var(--danger, #ffb3ba);
}
.error { color: var(--err); }
.hidden { display: none !important; }
.verify-gitlab-status { margin-top: 0.5rem; font-size: 0.9rem; }
.verify-gitlab-status.ok { color: #00ba7c; }
.verify-gitlab-status.err { color: var(--err); }
.verify-gitlab-status .gitlab-instruction-steps,
.gitlab-instruction-steps {
  margin: 0.75rem 0 0;
  padding-left: 1.25rem;
  max-width: 42rem;
}
.verify-gitlab-status .gitlab-instruction-steps li,
.gitlab-instruction-steps li { margin-bottom: 0.75rem; }
.account-gitlab-hint-steps { margin-top: 0.25rem; max-width: 42rem; }

.form-account-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.75rem;
}
.account-save-status {
  flex-basis: 100%;
  margin: 0 0 0.25rem 0;
  font-size: 0.95rem;
  color: var(--muted);
  min-height: 1.35em;
}
.account-save-status--active {
  color: var(--fg);
}
.account-save-status--active::before {
  content: "";
  display: inline-block;
  width: 0.85em;
  height: 0.85em;
  margin-right: 0.45em;
  vertical-align: -0.12em;
  border: 2px solid var(--border);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: account-save-spin 0.65s linear infinite;
}
@keyframes account-save-spin {
  to { transform: rotate(360deg); }
}
.form-account--submitting .btn-primary {
  cursor: wait;
}
.hint { color: var(--muted); font-size: 0.9rem; }
.draft-status {
  font-size: 0.85rem;
  margin: 0 0 0.75rem 0;
}
.draft-status.error {
  color: var(--err);
}
.toolbar-hint {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
}
pre.yaml {
  white-space: pre-wrap;
  word-break: break-word;
  background: #15202b;
  border: 1px solid var(--border);
  padding: 1rem;
  border-radius: 6px;
  font-size: 0.85rem;
}

/* Страница запуска: блок YAML (details), правка в textarea */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.run-detail-config-section {
  margin-bottom: 1rem;
}
.run-detail-config-yaml-inner {
  padding: 0 1rem 1rem;
}
.run-detail-config-yaml-inner .hint {
  margin-top: 0;
  margin-bottom: 0.65rem;
}
.run-detail-config-yaml-inner .yaml {
  margin: 0;
  max-height: min(70vh, 32rem);
  overflow: auto;
}
.run-config-yaml-bar {
  margin: 0.5rem 0 0 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
}
.run-config-yaml-textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: 12rem;
  max-height: min(70vh, 40rem);
  box-sizing: border-box;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.85rem;
  line-height: 1.45;
  padding: 0.75rem 1rem;
  color: var(--fg);
  background: #15202b;
  border: 1px solid var(--border);
  border-radius: 6px;
  resize: vertical;
}
.run-config-yaml-textarea:focus {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}
.run-config-yaml-status.run-config-yaml-status--err {
  color: var(--err);
}
.meta { color: var(--muted); }
.steps li { margin-bottom: 0.5rem; }

.intro-panel {
  background: #15202b;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1rem 1.25rem;
  margin-bottom: 1.5rem;
}
.intro-heading { font-size: 1.1rem; margin: 0 0 0.75rem 0; }
.intro-steps {
  margin: 0;
  padding-left: 1.25rem;
}
.intro-steps li { margin-bottom: 0.6rem; }
.intro-steps a { margin: 0 0.15rem; vertical-align: baseline; }

.fieldset {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1rem 1.25rem;
  margin-bottom: 1.25rem;
}
.fieldset legend {
  padding: 0 0.35rem;
  font-weight: 600;
}
.field { margin-bottom: 1rem; }
.field:last-child { margin-bottom: 0; }

.platform-device-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: end;
  margin-bottom: 0.4rem;
}

.platform-device-row .field {
  margin-bottom: 0;
}

.platform-ipad-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  min-height: var(--density-control-height);
  box-sizing: border-box;
  padding: 0 0.9rem;
  border: 1px solid rgba(140, 146, 154, 0.34);
  border-radius: var(--shape-sm);
  background: var(--surface-container-high);
  color: var(--on-surface);
  font-weight: 650;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: var(--theme-field-shadow);
  transition: border-color 0.14s ease, background 0.14s ease, box-shadow 0.14s ease;
}

.platform-ipad-toggle:hover {
  border-color: var(--theme-active-border);
  background: var(--theme-active-bg);
}

.form .platform-ipad-toggle input[type="checkbox"] {
  flex: 0 0 auto;
  width: 1.05rem;
  height: 1.05rem;
  min-height: 0;
  margin: 0;
  padding: 0;
  border-radius: 0.25rem;
  box-shadow: none;
  accent-color: var(--m3-primary);
}

.platform-ipad-toggle:has(input:checked) {
  border-color: var(--theme-active-border);
  background: var(--theme-active-bg);
  color: var(--m3-primary);
}

.platform-ipad-toggle:has(input:focus-visible) {
  outline: 3px solid var(--theme-focus-ring);
  outline-offset: 2px;
}

.platform-device-hint {
  margin: 0 0 var(--space-5);
}

@media (max-width: 720px) {
  .platform-device-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .platform-ipad-toggle {
    width: fit-content;
  }
}

.field-label-row {
  display: flex;
  align-items: flex-start;
  gap: 0.35rem;
  margin-bottom: 0.35rem;
  flex-wrap: wrap;
}
.field-label-row--below {
  margin-top: 0.35rem;
  margin-bottom: 0;
}
.field-label-row--below .field-help {
  position: relative;
}
.field-label-row--below .field-help[open] {
  flex-basis: 100%;
}
.field-label-row--below .field-help-text {
  width: min(100%, 42rem);
}
.field-title { font-weight: 500; }

.field-help {
  display: inline-block;
  margin: 0;
  vertical-align: middle;
}
.field-help > summary {
  list-style: none;
  cursor: help;
}
.field-help > summary::-webkit-details-marker { display: none; }
.field-help-q {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  background: #38444d;
  color: var(--fg);
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1;
  user-select: none;
}
.field-help-q.inline { display: inline-flex; vertical-align: middle; }
.field-help-q:hover { background: #4a5c6a; }
.field-help-text {
  margin-top: 0.5rem;
  padding: 0.6rem 0.75rem;
  background: #1a2733;
  border-radius: 6px;
  font-size: 0.9rem;
  color: var(--muted);
  max-width: 42rem;
  white-space: pre-line;
}

.form textarea.mono {
  font-family: ui-monospace, monospace;
  font-size: 0.8rem;
  max-width: 48rem;
}

details.advanced summary {
  cursor: pointer;
  font-weight: 600;
  padding: 0.35rem 0;
}
details.advanced .field { margin-top: 0.75rem; }

/* ----- Кнопки: <button> и <a class="btn"> ----- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  text-decoration: none;
  font-weight: 500;
  font-size: 0.95rem;
  line-height: 1.35;
  border-radius: 6px;
  cursor: pointer;
  border: 1px solid transparent;
  transition: background 0.15s ease, border-color 0.15s ease, filter 0.15s ease;
  box-sizing: border-box;
  font-family: inherit;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
/* Касание: достаточная зона для CI и основных действий (≈ Apple HIG 44pt) */
.step-ci-refresh-actions .btn,
.form .btn-primary,
.gen-toolbar .btn-secondary {
  min-height: 44px;
  padding-left: 1rem;
  padding-right: 1rem;
}
.btn--busy {
  opacity: 0.92;
}
a.btn { color: inherit; }

button.btn {
  font-family: inherit;
}

.btn-primary {
  font-size: 1rem;
  padding: 0.6rem 1.25rem;
  background: var(--accent);
  color: #fff !important;
  border-color: #1a8cd8;
}
.btn-primary:hover:not(:disabled) {
  filter: brightness(1.08);
}
.btn-primary:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.btn-secondary {
  padding: 0.5rem 1rem;
  background: #38444d;
  border-color: var(--border);
  color: var(--fg) !important;
}
.btn-secondary:hover:not(:disabled) {
  background: #4a5c6a;
}

.btn-danger {
  padding: 0.5rem 1rem;
  background: #6b2a2a;
  border-color: #8a3a3a;
  color: #fff !important;
}
.btn-danger:hover:not(:disabled) {
  background: #843030;
}

.step-actions-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin: 0.75rem 0 1.25rem;
  padding: 0.85rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: #111a24;
}

.step-actions-bar--store-refresh .step-actions-bar__busy-hint {
  flex: 1 1 12rem;
  margin: 0;
}

.store-refresh-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: var(--space-3);
  margin: var(--space-4) 0 0;
}
.form-store-refresh > .store-refresh-actions > .btn {
  min-height: 2.75rem;
  padding: 0.62rem 1.25rem;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.25;
  flex: 1 1 11rem;
}
.form-store-refresh > .store-refresh-actions > .btn-primary,
.form-store-refresh > .store-refresh-actions > .btn-secondary {
  font-size: 0.95rem;
  padding: 0.62rem 1.25rem;
}
@media (min-width: 36rem) {
  .form-store-refresh > .store-refresh-actions > .btn {
    flex: none;
    width: auto;
  }
}

.step-exec-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

/* После успеха: «К следующему шагу» — главное; «Повторить» — приглушённый серый */
.step-exec-actions .step-next-btn.btn-primary {
  font-weight: 600;
}

.step-exec-actions #step-repeat-btn.step-repeat-muted,
.step-exec-actions .btn-secondary.step-repeat-muted {
  opacity: 1;
  background: #2c3339 !important;
  color: #8b98a3 !important;
  border-color: #3d4c58 !important;
  font-weight: 500;
}
.step-exec-actions #step-repeat-btn.step-repeat-muted:hover:not(:disabled),
.step-exec-actions .btn-secondary.step-repeat-muted:hover:not(:disabled) {
  background: #343c44 !important;
  color: #a8b4bd !important;
  border-color: #4a5c6a !important;
}

.btn-nav {
  padding: 0.4rem 0.9rem;
  font-size: 0.9rem;
  font-weight: 500;
  background: #1a2733;
  color: var(--fg) !important;
  border-color: var(--border);
}
.btn-nav:hover {
  background: #243041;
  border-color: #4a5c6a;
}

.btn-breadcrumb {
  padding: 0.35rem 0.75rem;
  font-size: 0.85rem;
  font-weight: 500;
  background: #1a2733;
  color: var(--fg) !important;
  border-color: var(--border);
}
.btn-breadcrumb:hover {
  background: #243041;
  border-color: #4a5c6a;
}

.btn-inline {
  padding: 0.25rem 0.65rem;
  font-size: 0.88rem;
  font-weight: 500;
  background: #1a2733;
  color: var(--fg) !important;
  border-color: var(--border);
  vertical-align: baseline;
}
.btn-inline:hover {
  background: #243041;
  border-color: #4a5c6a;
}

.btn-ghost {
  background: #1a2733;
  color: var(--fg) !important;
  border-color: var(--border);
}
.btn-ghost:hover {
  background: #243041;
  border-color: #4a5c6a;
}

@media (max-width: 1100px) {
  .top {
    grid-template-columns: auto 1fr auto;
    gap: 0.75rem;
  }
  .brand-word {
    display: none;
  }
  .nav-icon-link {
    width: 2.25rem;
    padding: 0;
  }
}

@media (max-width: 760px) {
  .top {
    grid-template-columns: auto 1fr;
    align-items: stretch;
  }
  .top-left {
    grid-column: 1 / 2;
  }
  .top-actions {
    grid-column: 2 / 3;
  }
  .top-center {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  .nav-app-search {
    width: 100%;
  }
  .current-user {
    max-width: 8rem;
  }
}
@media (max-width: 420px) {
  .top-left {
    gap: 0.45rem;
  }
  .top-quick-nav {
    gap: 0.1rem;
    padding: 0.1rem;
  }
  .top-quick-nav .top-quick-link {
    width: 2.2rem;
    min-width: 2.2rem;
  }
}

.btn-small {
  padding: 0.35rem 0.65rem;
  font-size: 0.85rem;
}

.btn-table {
  padding: 0.3rem 0.65rem;
  font-size: 0.88rem;
  font-weight: 500;
  background: #1a2733;
  color: var(--fg) !important;
  border-color: var(--border);
}
.btn-table:hover {
  background: #243041;
  border-color: #4a5c6a;
}

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.9rem;
  color: var(--muted);
  margin: 0 0 1rem 0;
}
.breadcrumb .bc-sep {
  color: var(--muted);
  user-select: none;
  font-weight: 400;
}
.breadcrumb .bc-current {
  color: var(--muted);
  font-weight: 500;
  padding: 0.35rem 0;
}

.page-run-detail .container,
.page-step-detail .container,
.page-accounts .container {
  max-width: 1180px;
}

/* Страница шага: поток секций и пер-тематические герои */
.step-detail-flow {
  display: flex;
  flex-direction: column;
  gap: 1.35rem;
  margin-top: 0.25rem;
}

.step-detail-surface {
  margin: 0;
}

.step-detail-surface__header {
  margin-bottom: 0.85rem;
}

.step-detail-surface__title {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 650;
  letter-spacing: -0.02em;
  color: var(--fg);
}

.step-detail-surface__lead {
  margin: 0.35rem 0 0;
  font-size: 0.88rem;
  color: var(--muted);
  line-height: 1.45;
  max-width: 52rem;
}

.step-detail-purpose {
  margin: 0.5rem 0 0;
  font-size: 0.95rem;
  color: #a8c4dd;
  line-height: 1.45;
  max-width: 44rem;
}

.page-step-detail--docs .detail-hero--step {
  background:
    radial-gradient(circle at 0% 0%, rgba(46, 180, 140, 0.2), transparent 32rem),
    linear-gradient(135deg, #121c1a 0%, #101820 55%, #0d141c 100%);
  border-color: rgba(80, 140, 120, 0.55);
}

.page-step-detail--docs .eyebrow {
  color: #6ed4b0;
}

.page-step-detail--graphics .detail-hero--step {
  background:
    radial-gradient(circle at 100% 0%, rgba(160, 110, 220, 0.22), transparent 28rem),
    linear-gradient(135deg, #151222 0%, #101820 54%, #0d141c 100%);
  border-color: rgba(120, 100, 160, 0.5);
}

.page-step-detail--graphics .eyebrow {
  color: #c4a8f5;
}

.page-step-detail--full .detail-hero--step {
  background:
    radial-gradient(circle at top left, rgba(29, 155, 240, 0.18), transparent 34rem),
    linear-gradient(135deg, #131c27 0%, #101720 54%, #0d141c 100%);
}

.page-step-detail--ci_monitor .detail-hero--step {
  background:
    radial-gradient(circle at 80% 10%, rgba(230, 170, 70, 0.18), transparent 26rem),
    linear-gradient(135deg, #1a1814 0%, #101820 55%, #0d141c 100%);
  border-color: rgba(140, 120, 80, 0.5);
}

.page-step-detail--ci_monitor .eyebrow {
  color: #e8b86a;
}

.page-step-detail--store_refresh .detail-hero--step {
  background:
    radial-gradient(circle at 15% 90%, rgba(220, 100, 130, 0.16), transparent 30rem),
    linear-gradient(135deg, #1a1418 0%, #101820 55%, #0d141c 100%);
  border-color: rgba(140, 90, 110, 0.45);
}

.page-step-detail--store_refresh .eyebrow {
  color: #f0a0b8;
}

.page-step-detail--docs .step-detail-surface--actions {
  border-color: rgba(80, 140, 120, 0.35);
}

.page-step-detail--graphics .step-detail-surface--actions {
  border-color: rgba(120, 100, 160, 0.35);
}

.page-step-detail--ci_monitor .step-detail-surface--actions {
  border-color: rgba(140, 120, 80, 0.35);
}

.page-step-detail--store_refresh .step-detail-surface--actions {
  border-color: rgba(140, 90, 110, 0.35);
}

.step-detail-surface--primary .step-md-block--response {
  margin-top: 0;
}

.step-detail-surface--agent-stream .step-msg-scroll {
  margin-top: 0;
}

.step-detail-surface--ci-phase.step-ci-phase-progress:not(:empty) {
  padding: 1rem 1.1rem;
}

.step-detail-surface--gitlab-sync {
  padding: 1rem 1.1rem;
  border: 1px solid rgba(83, 124, 156, 0.38);
  border-radius: 8px;
  background: rgba(18, 28, 38, 0.62);
}

.step-gitlab-sync__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.step-gitlab-sync__header .form-gitlab-sync {
  flex: 0 0 auto;
}

.step-gitlab-sync__status {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0.7rem 0 0;
  color: var(--muted);
}

.step-gitlab-sync__status strong {
  color: var(--fg);
}

.step-gitlab-sync__status--running strong,
.step-gitlab-sync__status--pending strong {
  color: #8ec7ff;
}

.step-gitlab-sync__status--completed strong {
  color: #76d39b;
}

.step-gitlab-sync__status--failed strong {
  color: #ff9d9d;
}

.step-gitlab-sync__fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  gap: 0.55rem;
  margin: 0.9rem 0 0;
}

.step-gitlab-sync__fields div {
  min-width: 0;
  padding: 0.55rem 0.65rem;
  border: 1px solid rgba(120, 145, 170, 0.22);
  border-radius: 8px;
  background: rgba(7, 13, 20, 0.32);
}

.step-gitlab-sync__fields dt {
  margin: 0 0 0.2rem;
  color: var(--muted);
  font-size: 0.74rem;
}

.step-gitlab-sync__fields dd {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--fg);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.82rem;
}

.step-gitlab-sync__log {
  margin-top: 0.85rem;
}

.step-gitlab-sync__messages {
  margin-top: 0.7rem;
}

@media (max-width: 720px) {
  .step-gitlab-sync__header {
    flex-direction: column;
  }

  .step-gitlab-sync__header .form-gitlab-sync,
  .step-gitlab-sync__header .btn {
    width: 100%;
  }
}

.detail-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(16rem, 22rem);
  gap: 1rem;
  align-items: stretch;
  margin: 0 0 1.25rem;
  padding: 1.15rem;
  border: 1px solid rgba(82, 100, 118, 0.75);
  border-radius: 16px;
  background:
    radial-gradient(circle at top left, rgba(29, 155, 240, 0.18), transparent 34rem),
    linear-gradient(135deg, #131c27 0%, #101720 54%, #0d141c 100%);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.22);
}

.detail-hero-main {
  min-width: 0;
}

.detail-hero-breadcrumb {
  margin-bottom: 1rem;
}

.detail-hero h1 {
  margin: 0;
  font-size: clamp(1.65rem, 3vw, 2.45rem);
  line-height: 1.08;
  letter-spacing: -0.03em;
}

.run-detail-apple-email {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0.45rem 0 0;
  font-size: 0.92rem;
  color: var(--muted);
  line-height: 1.35;
}
.run-detail-apple-email-label {
  display: inline-block;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 0.72rem;
  color: #7ab8e8;
}
.run-detail-apple-email-link,
.run-detail-apple-email-value {
  font: inherit;
  color: #9fd6ff;
  word-break: break-word;
  text-align: left;
}
.run-detail-apple-email-link {
  text-decoration: underline dotted;
  text-underline-offset: 2px;
}
.run-detail-apple-email-link:hover,
.run-detail-apple-email-link:focus-visible {
  color: #c9e9ff;
  text-decoration: underline;
  outline: none;
}
.run-detail-apple-email-copy.apple-icon-button {
  flex: 0 0 auto;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
}
.run-detail-apple-email-feedback {
  font-size: 0.78rem;
  color: #86efac;
}

.eyebrow {
  margin: 0 0 0.35rem;
  color: #7ab8e8;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.detail-subtitle {
  margin: 0.55rem 0 0;
  color: var(--muted);
  font-size: 0.98rem;
}

.detail-hero-side {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.65rem;
  align-content: start;
}

.detail-stat-card {
  min-height: 4.7rem;
  padding: 0.8rem 0.9rem;
  border: 1px solid rgba(82, 100, 118, 0.75);
  border-radius: 12px;
  background: rgba(12, 18, 26, 0.72);
}

.detail-stat-card--status {
  background: rgba(15, 28, 42, 0.82);
}

.detail-stat-label {
  display: block;
  margin-bottom: 0.4rem;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.detail-stat-card strong {
  display: block;
  font-size: 1.25rem;
  line-height: 1.1;
}

.detail-hero-action {
  width: 100%;
  min-height: 42px;
}

.run-detail-push-plan-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.run-detail-push-plan-action strong {
  display: inline-grid;
  min-width: 1.7rem;
  height: 1.7rem;
  padding: 0 0.35rem;
  place-items: center;
  border-radius: 999px;
  color: #dbeafe;
  background: rgba(96, 165, 250, 0.18);
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
}

.run-detail-push-plan-action strong svg {
  width: 0.9rem;
  height: 0.9rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.detail-hero.detail-hero--run {
  display: block;
  padding: 1rem;
}

.run-detail-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  align-items: end;
  gap: 1rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid rgba(98, 121, 142, 0.38);
}

.detail-hero--run .detail-hero-breadcrumb {
  margin-bottom: 0.65rem;
}

.detail-hero--run h1 {
  font-size: clamp(1.65rem, 2.5vw, 2.2rem);
}

.detail-hero--run .detail-hero-side {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  align-content: center;
  flex-wrap: wrap;
  gap: 0.45rem;
  max-width: 47rem;
}

.run-detail-column-pill {
  --col-accent: #7cc8f8;
  --col-accent-dim: rgba(124, 200, 248, 0.15);
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  min-height: 2.35rem;
  border: 1px solid color-mix(in srgb, var(--col-accent) 48%, rgba(82, 100, 118, 0.75));
  border-radius: 999px;
  background: linear-gradient(90deg, var(--col-accent-dim) 0%, rgba(12, 18, 26, 0.78) 82%);
  box-shadow: inset 2px 0 0 var(--col-accent);
}

.run-detail-column-pill {
  padding: 0.4rem 0.75rem;
  color: #e5eef8;
  font-size: 0.75rem;
  font-weight: 760;
}

.run-detail-column-pill__icon {
  font-size: 0.95rem;
  line-height: 1;
}

.detail-hero--run .detail-status-pill {
  min-height: 1.55rem;
  padding: 0.16rem 0.48rem;
  font-size: 0.72rem;
}

.detail-hero--run .detail-hero-action {
  width: auto;
  min-height: 2.35rem;
  border-radius: 999px;
  padding: 0.42rem 0.8rem;
  font-size: 0.78rem;
}

.run-pipeline-state {
  --run-pipeline-color: #94a3b8;
  --run-pipeline-soft: rgba(148, 163, 184, 0.13);
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
  min-height: 2.35rem;
  padding: 0.32rem 0.65rem 0.32rem 0.38rem;
  border: 1px solid color-mix(in srgb, var(--run-pipeline-color) 42%, #526476);
  border-radius: 999px;
  background: linear-gradient(180deg, var(--run-pipeline-soft), rgba(12, 18, 26, 0.78));
  color: #e5edf5;
  text-decoration: none;
  box-shadow: 0 5px 12px rgba(0, 0, 0, 0.12);
  transition: border-color 150ms ease, background-color 150ms ease, transform 150ms ease;
}

.run-pipeline-state:hover,
.run-pipeline-state:focus-visible {
  border-color: color-mix(in srgb, var(--run-pipeline-color) 76%, #dbeafe);
  color: #ffffff;
  transform: translateY(-1px);
}

.run-pipeline-state:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--run-pipeline-color) 72%, #ffffff);
  outline-offset: 2px;
}

.run-pipeline-state__icon {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 50%;
  background: color-mix(in srgb, var(--run-pipeline-color) 18%, transparent);
  color: var(--run-pipeline-color);
}

.run-pipeline-state__icon svg {
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.run-pipeline-state__label {
  color: var(--run-pipeline-color);
  font-size: 0.8rem;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.run-pipeline-state__progress,
.run-pipeline-state__action {
  padding-left: 0.48rem;
  border-left: 1px solid color-mix(in srgb, var(--run-pipeline-color) 28%, transparent);
  font-size: 0.73rem;
  font-weight: 680;
  line-height: 1;
  white-space: nowrap;
}

.run-pipeline-state__progress {
  color: #cbd5e1;
}

.run-pipeline-state__action {
  color: var(--run-pipeline-color);
  font-weight: 800;
}

.run-pipeline-state--success {
  --run-pipeline-color: #4ade80;
  --run-pipeline-soft: rgba(34, 197, 94, 0.13);
}

.run-pipeline-state--running {
  --run-pipeline-color: #60a5fa;
  --run-pipeline-soft: rgba(59, 130, 246, 0.14);
}

.run-pipeline-state--warning {
  --run-pipeline-color: #fbbf24;
  --run-pipeline-soft: rgba(245, 158, 11, 0.14);
}

.run-pipeline-state--failed {
  --run-pipeline-color: #fb7185;
  --run-pipeline-soft: rgba(244, 63, 94, 0.14);
}

.run-pipeline-state--pending {
  --run-pipeline-color: #7dd3fc;
  --run-pipeline-soft: rgba(14, 165, 233, 0.12);
}

.run-pipeline-state--running .run-pipeline-state__icon svg {
  animation: factory-busy-spin 0.9s linear infinite;
}

#pipeline-steps {
  scroll-margin-top: 5rem;
}

.detail-hero--run .run-detail-push-plan-action {
  min-width: 7.8rem;
}

.run-ops-summary {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(16rem, 1.2fr) minmax(14rem, 0.9fr) minmax(13rem, 0.8fr);
  gap: 0.65rem;
  min-width: 0;
  padding-top: 0.85rem;
  border-top: 0;
}

.run-ops-panel {
  min-width: 0;
  padding: 0.72rem;
  border: 1px solid rgba(82, 100, 118, 0.66);
  border-radius: 12px;
  background: rgba(10, 17, 24, 0.62);
}

.run-ops-panel__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
  gap: 0.65rem;
  margin-bottom: 0.65rem;
}

.run-ops-panel__label {
  color: #a8c4dd;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.065em;
  text-transform: uppercase;
}

.run-ops-column,
.run-ops-chip,
.run-ops-status,
.run-ops-reason {
  display: inline-flex;
  align-items: center;
  min-height: 1.65rem;
  border: 1px solid rgba(124, 200, 248, 0.24);
  border-radius: 999px;
  padding: 0.2rem 0.55rem;
  color: #dbeafe;
  background: rgba(29, 155, 240, 0.1);
  font-size: 0.72rem;
  font-weight: 720;
  line-height: 1.15;
}

.run-ops-column {
  max-width: 11rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.run-ops-identity {
  display: flex;
  align-items: flex-start;
  min-width: 0;
  gap: 0.7rem;
}

.run-ops-icon {
  flex: 0 0 auto;
  width: 3.5rem;
  height: 3.5rem;
  border: 1px solid rgba(124, 200, 248, 0.22);
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 0.45rem 1rem rgba(0, 0, 0, 0.24);
}

.run-ops-identity__body {
  min-width: 0;
  flex: 1 1 auto;
}

.run-ops-chips,
.run-ops-reasons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.run-ops-facts {
  display: grid;
  gap: 0.35rem;
  margin: 0.65rem 0 0;
}

.run-ops-facts--asc {
  margin: 0 0 0.65rem;
}

.run-ops-facts div {
  display: grid;
  grid-template-columns: minmax(5rem, auto) minmax(0, 1fr);
  align-items: baseline;
  gap: 0.55rem;
}

.run-ops-facts dt {
  color: var(--muted);
  font-size: 0.7rem;
}

.run-ops-facts dd {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  color: var(--fg);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.75rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.run-ops-status-row {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 0.45rem;
}

.run-ops-status {
  max-width: 100%;
}

.run-ops-status--success {
  border-color: rgba(74, 222, 128, 0.34);
  color: #bbf7d0;
  background: rgba(34, 197, 94, 0.12);
}

.run-ops-status--warning,
.run-ops-status--running {
  border-color: rgba(250, 204, 21, 0.34);
  color: #fef08a;
  background: rgba(234, 179, 8, 0.12);
}

.run-ops-status--failed {
  border-color: rgba(248, 113, 113, 0.34);
  color: #fecaca;
  background: rgba(239, 68, 68, 0.12);
}

.run-ops-reasons {
  margin-top: 0.55rem;
}

.run-ops-reason {
  min-height: 1.45rem;
  border-color: rgba(248, 113, 113, 0.26);
  color: #fecaca;
  background: rgba(127, 29, 29, 0.18);
  font-size: 0.66rem;
}

.run-ops-refresh {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  min-height: 2rem;
  padding: 0;
  border: 1px solid rgba(124, 200, 248, 0.32);
  border-radius: 8px;
  color: #bfdbfe;
  background: rgba(29, 155, 240, 0.1);
  font: inherit;
  font-size: 0.72rem;
  font-weight: 750;
  cursor: pointer;
}

.run-ops-refresh svg {
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.run-ops-refresh:hover:not(:disabled),
.run-ops-refresh:focus-visible {
  border-color: rgba(124, 200, 248, 0.62);
  color: #eff6ff;
  background: rgba(29, 155, 240, 0.2);
  outline: none;
}

.run-ops-refresh:focus-visible,
.run-ops-action:focus-visible,
.run-ops-activity__toggle:focus-visible {
  box-shadow: 0 0 0 2px rgba(124, 200, 248, 0.2);
}

.run-ops-refresh:disabled {
  opacity: 0.48;
  cursor: not-allowed;
}

.run-ops-panel__hint,
.run-ops-link-preview,
.run-ops-feedback {
  margin: 0.45rem 0 0;
  color: var(--muted);
  font-size: 0.72rem;
  line-height: 1.35;
}

.run-ops-link-preview {
  overflow: hidden;
  color: #9fd6ff;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.run-ops-fact-link,
.run-ops-panel-action {
  color: #9fd6ff;
  text-decoration: underline dotted;
  text-underline-offset: 2px;
}

.run-ops-fact-link:hover,
.run-ops-fact-link:focus-visible,
.run-ops-panel-action:hover,
.run-ops-panel-action:focus-visible {
  color: #d8efff;
  text-decoration: underline;
  outline: none;
}

.run-ops-panel--webview {
  display: flex;
  flex-direction: column;
}

.run-ops-panel-action {
  align-self: flex-start;
  margin-top: auto;
  padding-top: 0.55rem;
  font-size: 0.72rem;
  font-weight: 720;
}

.run-ops-feedback:empty {
  display: none;
}

.run-ops-toolbar {
  grid-column: 1 / -1;
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  min-width: 0;
  position: relative;
  z-index: 12;
}

.run-ops-actions {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.run-ops-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 2.1rem;
  gap: 0.38rem;
  padding: 0.35rem 0.68rem;
  font-size: 0.78rem;
}

.run-ops-action__icon,
.run-ops-action__status {
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
}

.run-ops-action__icon svg,
.run-ops-action__status svg {
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.run-ops-action__status {
  margin-left: 0.06rem;
}

.run-ops-action__status--neutral {
  color: #94a3b8;
}

.run-ops-action__status--running {
  color: #7dd3fc;
}

.run-ops-action__status--running svg {
  animation: factory-busy-spin 0.75s linear infinite;
}

.run-ops-action__status--success {
  color: #86efac;
}

.run-ops-action__status--failed {
  color: #fca5a5;
}

.run-ops-action--disabled {
  cursor: not-allowed;
  opacity: 0.48;
}

.run-ops-action--quiet {
  margin-left: auto;
}

.run-ops-activity {
  position: static;
  flex: 0 0 auto;
}

.run-ops-activity__toggle {
  display: inline-grid;
  width: 2.1rem;
  min-width: 2.1rem;
  height: 2.1rem;
  min-height: 2.1rem;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(82, 100, 118, 0.58);
  border-radius: 999px;
  color: #bfdbfe;
  background: rgba(96, 165, 250, 0.14);
  font: inherit;
  font-size: 0.72rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}

.run-ops-activity__toggle:hover,
.run-ops-activity__toggle:focus-visible,
.run-ops-activity.is-open .run-ops-activity__toggle {
  border-color: rgba(124, 200, 248, 0.62);
  color: #eff6ff;
  background: rgba(29, 155, 240, 0.22);
  outline: none;
}

.run-ops-activity__popover {
  position: absolute;
  top: calc(100% + 0.55rem);
  right: 0;
  width: min(42rem, calc(100vw - 3rem));
  max-height: min(30rem, calc(100vh - 7rem));
  overflow: auto;
  overscroll-behavior: contain;
  border: 1px solid rgba(82, 100, 118, 0.72);
  border-radius: 14px;
  background: #0c131a;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.42);
}

.run-ops-activity__popover[hidden] {
  display: none;
}

.run-ops-activity__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.8rem;
  border-bottom: 1px solid rgba(82, 100, 118, 0.44);
  color: #cfe6f8;
  font-size: 0.8rem;
  font-weight: 760;
}

.run-ops-activity__heading span {
  color: var(--muted);
  font-size: 0.7rem;
  font-variant-numeric: tabular-nums;
}

.run-ops-activity__body {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(15rem, 0.75fr);
  gap: 0.9rem;
  padding: 0.8rem;
}

.run-ops-activity__list {
  display: grid;
  gap: 0.4rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.run-ops-activity__list li {
  display: grid;
  grid-template-columns: 6.1rem minmax(0, 1fr);
  gap: 0.55rem;
  padding: 0.45rem 0.55rem;
  border-radius: 8px;
  color: #cbd5e1;
  background: rgba(15, 23, 32, 0.72);
  font-size: 0.73rem;
  line-height: 1.35;
}

.run-ops-activity__list time {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.run-ops-comment label {
  display: block;
  margin-bottom: 0.4rem;
  color: #cfe6f8;
  font-size: 0.75rem;
  font-weight: 720;
}

.run-ops-comment__controls {
  display: flex;
  align-items: stretch;
  gap: 0.45rem;
}

.run-ops-comment__controls input {
  min-width: 0;
  flex: 1 1 auto;
}

.run-ops-comment__controls .btn {
  flex: 0 0 auto;
}

@media (max-width: 980px) {
  .run-detail-header {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .detail-hero--run .detail-hero-side {
    justify-content: flex-start;
    max-width: none;
  }

  .run-ops-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .run-ops-panel--identity {
    grid-column: 1 / -1;
  }
}

@media (max-width: 680px) {
  .detail-hero.detail-hero--run {
    padding: 0.85rem;
  }

  .run-detail-header {
    gap: 0.75rem;
  }

  .detail-hero--run .detail-hero-side {
    gap: 0.4rem;
  }

  .run-pipeline-state {
    max-width: 100%;
    min-height: 2.75rem;
  }

  #pipeline-steps {
    scroll-margin-top: 7.5rem;
  }

  .detail-hero--run .run-detail-apple-email-label {
    display: none;
  }

  .run-ops-summary,
  .run-ops-activity__body {
    grid-template-columns: 1fr;
  }

  .run-ops-panel--identity {
    grid-column: auto;
  }

  .run-ops-action--quiet {
    margin-left: 0;
  }

  .run-ops-activity__popover {
    right: -1.9rem;
    width: calc(100vw - 2rem);
    max-height: calc(100vh - 5rem);
  }

  .run-ops-activity__list li {
    grid-template-columns: 1fr;
    gap: 0.2rem;
  }

  .run-ops-comment__controls {
    flex-direction: column;
  }
}

@media (pointer: coarse) {
  .run-detail-apple-email-copy.apple-icon-button {
    width: 44px;
    height: 44px;
  }

  .run-ops-refresh,
  .run-ops-action,
  .run-ops-activity__toggle,
  .run-ops-comment__controls .btn {
    min-height: 44px;
  }

  .run-ops-activity__toggle {
    width: 44px;
    height: 44px;
  }
}

.btn-integration-test {
  background: linear-gradient(135deg, #22d3ee 0%, #0ea5e9 54%, #2563eb 100%);
  border: 1px solid rgba(125, 211, 252, 0.72);
  color: #f8fdff !important;
  box-shadow: 0 10px 24px rgba(14, 165, 233, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

.btn-integration-test:hover:not(:disabled) {
  filter: brightness(1.06);
  transform: translateY(-1px);
}

.btn-integration-test:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  filter: none;
}

.detail-stat-card--integration-test {
  border-color: rgba(14, 165, 233, 0.4);
  background: rgba(14, 165, 233, 0.08);
}

.integration-test-callout {
  list-style: none;
  margin: 0.72rem 0 0.82rem;
  padding: 0;
}

.integration-test-callout .run-integration-test--inline {
  border: 1px solid rgba(56, 189, 248, 0.34);
  background:
    radial-gradient(circle at 8% 20%, rgba(34, 211, 238, 0.15), transparent 34%),
    linear-gradient(135deg, rgba(14, 165, 233, 0.13), rgba(15, 23, 42, 0.82));
  border-radius: 18px;
  padding: 0.95rem;
  box-shadow: 0 14px 28px rgba(2, 8, 23, 0.26);
}

.integration-test-inline-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.85rem;
}

.integration-test-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.45rem;
  height: 2.45rem;
  border: 1px solid rgba(125, 211, 252, 0.5);
  border-radius: 0.95rem;
  background:
    linear-gradient(145deg, rgba(34, 211, 238, 0.24), rgba(14, 165, 233, 0.08)),
    #0f2534;
  color: #e0f7ff;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.integration-test-badge--large {
  width: 3.4rem;
  height: 3.4rem;
  border-radius: 1.2rem;
  font-size: 1rem;
}

.integration-test-inline-copy {
  min-width: 0;
}

.integration-test-callout .detail-stat-label {
  display: block;
  color: #7dd3fc;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.integration-test-callout .detail-stat-hint {
  margin: 0.18rem 0 0;
  max-width: 64rem;
}

.integration-test-callout .run-integration-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.85rem;
}

.integration-meta-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.32rem;
  min-height: 2rem;
  padding: 0.32rem 0.58rem;
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-radius: 999px;
  background: rgba(8, 47, 73, 0.36);
  color: #b6c3cf;
  font-size: 0.87rem;
  line-height: 1.25;
}

.integration-meta-chip strong {
  color: #e6f8ff;
}

.integration-meta-chip--file {
  max-width: min(100%, 34rem);
  border-radius: 0.9rem;
}

.integration-meta-chip--file a {
  min-width: 0;
  overflow: hidden;
  color: #7dd3fc;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 760px) {
  .integration-test-inline-head {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .integration-test-inline-head > .btn {
    grid-column: 1 / -1;
    justify-self: stretch;
  }
}

.detail-stat-hint {
  margin: 0 0 0.55rem;
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.35;
}

.detail-status-pill {
  font-weight: 700;
  border: 1px solid transparent;
  text-transform: lowercase;
}

.detail-status-pill--completed,
.detail-status-pill--success,
.detail-status-pill--passed {
  background: #103a24;
  color: #7ee4a1;
  border-color: rgba(126, 228, 161, 0.22);
}

.detail-status-pill--warning,
.detail-status-pill--waiting {
  background: #3a2a10;
  color: #ffc978;
  border-color: rgba(255, 201, 120, 0.28);
}

.detail-status-pill--running,
.detail-status-pill--in_progress {
  background: #1a2d4a;
  color: #8fc1ff;
  border-color: rgba(143, 193, 255, 0.28);
}

.detail-status-pill--failed,
.detail-status-pill--error,
.detail-status-pill--cancelled {
  background: #3a1010;
  color: #ff9b9b;
  border-color: rgba(255, 155, 155, 0.28);
}

.detail-status-pill--pending,
.detail-status-pill--queued,
.detail-status-pill--not_started {
  background: #2a2f36;
  color: #b6c2cc;
  border-color: rgba(182, 194, 204, 0.16);
}

.detail-alert {
  margin: 0 0 1rem;
  padding: 0.8rem 1rem;
  border-radius: 12px;
}
.detail-alert--error {
  border: 1px solid rgba(244, 33, 46, 0.35);
  background: rgba(80, 18, 24, 0.38);
}
.detail-alert--warning {
  border: 1px solid rgba(255, 201, 120, 0.38);
  background: rgba(58, 42, 16, 0.45);
  color: var(--warn);
}

.section-heading-row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin: 1.3rem 0 0.75rem;
}

.section-heading-row h2 {
  margin: 0;
}

.run-publication-card {
  margin: 0 0 1.35rem;
  padding: 1rem;
  border: 1px solid rgba(82, 100, 118, 0.72);
  border-radius: 16px;
  background:
    radial-gradient(circle at top right, rgba(126, 228, 161, 0.10), transparent 22rem),
    #101822;
}

.run-publication-heading {
  margin: 0 0 0.85rem;
}

.run-publication-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  gap: 0.75rem;
}

.run-link-card {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  min-width: 0;
  min-height: 8.5rem;
  padding: 0.9rem;
  border: 1px solid rgba(82, 100, 118, 0.68);
  border-radius: 14px;
  background: rgba(12, 18, 26, 0.74);
}

.run-link-card--pages {
  grid-column: span 2;
  background:
    linear-gradient(135deg, rgba(29, 155, 240, 0.18), rgba(12, 18, 26, 0.78)),
    rgba(12, 18, 26, 0.74);
}

.run-link-card-label {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.run-link-card strong {
  font-size: 1rem;
  line-height: 1.2;
}

.run-link-card-url {
  display: block;
  margin-top: auto;
  padding-top: 0.35rem;
  color: #7ab8e8;
  font-size: 0.86rem;
  line-height: 1.35;
  word-break: break-all;
  text-decoration: none;
}

.run-link-card-url:hover,
.run-link-card-url:focus-visible {
  color: #a8d8ff;
  text-decoration: underline;
}

@media (max-width: 820px) {
  .detail-hero {
    grid-template-columns: 1fr;
    padding: 0.95rem;
  }

  .page-apps .detail-hero--apps {
    grid-template-columns: 1fr;
  }

  .detail-hero-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-apps .detail-hero--apps .detail-hero-side {
    grid-template-columns: 1fr;
  }

  .detail-hero-action {
    grid-column: 1 / -1;
  }

  .run-link-card--pages {
    grid-column: span 1;
  }
}

@media (max-width: 560px) {
  .detail-hero-side {
    grid-template-columns: 1fr;
  }
}

.account-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
  gap: 1rem;
  padding: 0;
  margin: 0;
  list-style: none;
}
.account-list-item {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  min-width: 0;
  padding: 1rem;
  border: 1px solid rgba(82, 100, 118, 0.72);
  border-radius: 16px;
  background:
    radial-gradient(circle at top left, rgba(29, 155, 240, 0.10), transparent 18rem),
    #111a24;
}

/* Аватары аккаунтов (инициалы + цвет из имени, в духе GitLab) */
.account-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  vertical-align: middle;
  line-height: 0;
}
.account-avatar svg,
svg.account-avatar-svg {
  display: block;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.account-title-with-avatar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-top: 0;
}
.account-toolbar-avatar {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.account-card-head {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  min-width: 0;
}
.account-card-avatar {
  width: 48px;
  height: 48px;
}
.account-card-title {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}
.account-card-name {
  color: var(--fg);
  font-size: 1.1rem;
  font-weight: 750;
  line-height: 1.2;
  text-decoration: none;
  overflow-wrap: anywhere;
}
.account-card-name:hover,
.account-card-name:focus-visible {
  color: #a8d8ff;
  text-decoration: underline;
}
.account-card-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-top: auto;
}
.account-delete-form {
  display: inline-flex;
}
.empty-state-card {
  margin-top: 1rem;
  padding: 1.25rem;
  border: 1px dashed rgba(139, 152, 165, 0.55);
  border-radius: 16px;
  background: #101822;
}
.empty-state-card h2 {
  margin: 0 0 0.4rem;
}

.page-error .container {
  max-width: 980px;
}

.error-page-shell {
  display: grid;
  grid-template-columns: minmax(8rem, 14rem) minmax(0, 1fr);
  gap: var(--space-6);
  align-items: center;
  min-height: min(62vh, 34rem);
  margin: var(--space-8) 0;
  padding: var(--space-8);
  border: 1px solid rgba(140, 146, 154, 0.24);
  border-radius: var(--shape-xl);
  background:
    linear-gradient(135deg, rgba(158, 202, 255, 0.12) 0%, transparent 44%),
    var(--surface-container-low);
  box-shadow: var(--elevation-2);
}

.error-page-code {
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  border: 1px solid rgba(158, 202, 255, 0.28);
  border-radius: var(--shape-xl);
  background: var(--surface-container);
  color: var(--m3-primary);
  font-size: clamp(2.9rem, 8vw, 5.6rem);
  font-weight: 800;
  line-height: 1;
  box-shadow: var(--elevation-1);
}

.error-page-content {
  min-width: 0;
}

.error-page-content h1 {
  margin: 0;
  color: var(--on-surface);
  font-size: clamp(1.7rem, 4vw, 2.8rem);
  line-height: 1.08;
  letter-spacing: 0;
}

.error-page-message {
  max-width: 42rem;
  margin: var(--space-4) 0 0;
  color: var(--on-surface-variant);
  font-size: 1rem;
  line-height: 1.55;
}

.error-page-detail {
  max-width: 42rem;
  margin: var(--space-4) 0 0;
  padding: var(--space-3) var(--space-4);
  border: 1px solid rgba(140, 146, 154, 0.24);
  border-radius: var(--shape-md);
  background: rgba(48, 54, 60, 0.42);
  color: var(--on-surface-variant);
  overflow-wrap: anywhere;
}

.error-page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: var(--space-6);
}

@media (max-width: 760px) {
  .error-page-shell {
    grid-template-columns: 1fr;
    gap: var(--space-5);
    min-height: auto;
    margin: var(--space-4) 0;
    padding: var(--space-5);
  }

  .error-page-code {
    width: min(10rem, 100%);
  }

  .error-page-actions .btn {
    width: 100%;
    justify-content: center;
  }
}

.admin-section {
  margin-top: 1.4rem;
}
.admin-section h2 {
  margin: 0 0 0.8rem;
}
.page-idea-pool .idea-pool-hero {
  grid-template-columns: minmax(0, 1fr) minmax(24rem, 30rem);
  align-items: center;
}
.page-idea-pool .idea-pool-hero .detail-hero-side {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}
.page-idea-pool .idea-pool-hero .detail-stat-card {
  min-height: 4.2rem;
}
.page-idea-pool .idea-pool-hero .detail-hero-action {
  grid-column: 1 / -1;
}
.idea-pool-toolbar {
  margin-top: 0;
  padding: 0.9rem;
  border: 1px solid rgba(82, 100, 118, 0.66);
  border-radius: 12px;
  background: #111a24;
}
.idea-pool-search-form {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.65rem;
}
.idea-pool-search-form .field {
  flex: 1 1 24rem;
  margin: 0;
}
.idea-pool-search-form .btn {
  min-height: 2.7rem;
}
.idea-pool-group-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0.9rem 0 1rem;
}
.idea-pool-group-nav a {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-height: 2rem;
  border: 1px solid rgba(82, 100, 118, 0.68);
  border-radius: 999px;
  padding: 0.28rem 0.42rem 0.28rem 0.65rem;
  background: rgba(17, 26, 36, 0.78);
  color: var(--fg);
  font-size: 0.8rem;
  text-decoration: none;
}
.idea-pool-group-nav a:hover,
.idea-pool-group-nav a:focus-visible {
  border-color: rgba(112, 199, 173, 0.7);
  background: rgba(112, 199, 173, 0.1);
  outline: none;
}
.idea-pool-group-nav strong {
  display: inline-grid;
  min-width: 1.4rem;
  min-height: 1.4rem;
  place-items: center;
  border-radius: 999px;
  padding: 0 0.3rem;
  background: rgba(112, 199, 173, 0.16);
  color: #9fe0cd;
  font-size: 0.72rem;
}
.idea-pool-groups {
  display: grid;
  gap: 0.85rem;
  margin-bottom: 1.5rem;
}
.idea-pool-group {
  scroll-margin-top: 1rem;
  border: 1px solid rgba(82, 100, 118, 0.72);
  border-radius: 12px;
  overflow: hidden;
  background: #111a24;
}
.idea-pool-group > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 3.3rem;
  padding: 0.7rem 0.9rem;
  background: rgba(19, 29, 40, 0.96);
  cursor: pointer;
  list-style: none;
}
.idea-pool-group > summary::-webkit-details-marker {
  display: none;
}
.idea-pool-group > summary span {
  font-size: 1rem;
  font-weight: 780;
}
.idea-pool-group > summary strong {
  display: inline-grid;
  min-width: 2rem;
  min-height: 1.8rem;
  place-items: center;
  border-radius: 999px;
  padding: 0 0.45rem;
  background: rgba(29, 155, 240, 0.14);
  color: #9fd6ff;
  font-size: 0.78rem;
}
.idea-pool-group[open] > summary {
  border-bottom: 1px solid rgba(82, 100, 118, 0.62);
}
.idea-pool-list {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: idea-pool-item;
}
.idea-pool-item {
  position: relative;
  counter-increment: idea-pool-item;
  padding: 0.9rem 1rem 0.95rem 3.35rem;
  background: rgba(12, 18, 26, 0.46);
}
.idea-pool-item + .idea-pool-item {
  border-top: 1px solid rgba(82, 100, 118, 0.42);
}
.idea-pool-item::before {
  content: counter(idea-pool-item);
  position: absolute;
  top: 0.95rem;
  left: 1rem;
  display: grid;
  width: 1.6rem;
  height: 1.6rem;
  place-items: center;
  border: 1px solid rgba(112, 199, 173, 0.36);
  border-radius: 999px;
  background: rgba(112, 199, 173, 0.09);
  color: #9fe0cd;
  font-size: 0.7rem;
  font-weight: 800;
}
.idea-pool-item__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.55rem 1rem;
}
.idea-pool-item__head h2 {
  flex: 1 1 18rem;
  margin: 0;
  font-size: 1rem;
  line-height: 1.3;
}
.idea-pool-item__badges {
  display: flex;
  flex: 0 1 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.35rem;
}
.idea-pool-item__badges code,
.idea-pool-item__badges span {
  display: inline-flex;
  align-items: center;
  min-height: 1.55rem;
  border: 1px solid rgba(82, 100, 118, 0.54);
  border-radius: 999px;
  padding: 0.18rem 0.48rem;
  background: rgba(31, 42, 54, 0.7);
  color: var(--muted);
  font-size: 0.7rem;
  line-height: 1.2;
}
.idea-pool-item__badges code {
  color: #9fd6ff;
}
.idea-pool-item__brief {
  margin: 0.55rem 0 0;
  color: var(--fg);
  font-size: 0.9rem;
  line-height: 1.5;
}
.idea-pool-item__mechanic {
  margin: 0.48rem 0 0;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.45;
}
.idea-pool-item__mechanic span {
  display: inline-block;
  margin-right: 0.45rem;
  color: #9fe0cd;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.idea-pool-empty {
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .page-idea-pool .idea-pool-hero {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 620px) {
  .page-idea-pool .idea-pool-hero .detail-hero-side {
    grid-template-columns: 1fr;
  }
  .page-idea-pool .idea-pool-hero .detail-hero-action {
    grid-column: auto;
  }
  .idea-pool-search-form .field,
  .idea-pool-search-form .btn {
    flex: 1 1 100%;
    width: 100%;
  }
  .idea-pool-item {
    padding-left: 1rem;
  }
  .idea-pool-item::before {
    display: none;
  }
  .idea-pool-item__badges {
    justify-content: flex-start;
  }
}
.page-codegraph .detail-hero--codegraph {
  grid-template-columns: minmax(0, 1fr) minmax(22rem, 30rem);
  align-items: center;
  margin-bottom: 0.75rem;
  padding: 0.85rem 1rem;
  border-radius: 12px;
}
.page-codegraph .detail-hero--codegraph h1 {
  font-size: clamp(1.85rem, 2.4vw, 2.25rem);
}
.page-codegraph .detail-hero--codegraph .detail-subtitle {
  margin-top: 0.38rem;
  font-size: 0.9rem;
}
.page-codegraph .detail-hero--codegraph .detail-hero-side {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}
.page-codegraph .detail-hero--codegraph .detail-stat-card {
  min-height: 3.3rem;
  padding: 0.55rem 0.65rem;
  border-radius: 8px;
}
.page-codegraph .detail-hero--codegraph .detail-stat-label {
  margin-bottom: 0.25rem;
  font-size: 0.68rem;
}
.page-codegraph .detail-hero--codegraph .detail-stat-card strong {
  font-size: 1.08rem;
}
.page-codegraph .detail-hero--codegraph .detail-hero-action {
  min-height: 100%;
}
.page-codegraph .codegraph-toolbar {
  margin-top: 0.7rem;
}
.codegraph-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 0.75rem;
}
.codegraph-limit-form {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.75rem;
}
.codegraph-limit-form .field {
  margin: 0;
  width: min(12rem, 100%);
}
.codegraph-error {
  padding: 1rem;
  border: 1px solid rgba(213, 108, 93, 0.42);
  border-radius: 8px;
  background: rgba(55, 24, 24, 0.42);
}
.codegraph-shell {
  display: grid;
  grid-template-columns: minmax(18rem, 21rem) minmax(0, 1fr);
  height: min(74vh, 52rem);
  min-height: 34rem;
  margin-top: 1rem;
  border: 1px solid rgba(82, 100, 118, 0.72);
  border-radius: 8px;
  overflow: hidden;
  background: #121923;
}
.codegraph-sidebar {
  min-width: 0;
  overflow: auto;
  padding: 0.9rem;
  border-right: 1px solid rgba(82, 100, 118, 0.72);
  background: #101820;
}
.codegraph-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem;
  margin-bottom: 0.85rem;
}
.codegraph-metric {
  min-height: 3.6rem;
  padding: 0.65rem 0.7rem;
  border: 1px solid rgba(82, 100, 118, 0.64);
  border-radius: 8px;
  background: rgba(24, 32, 42, 0.78);
}
.codegraph-metric strong {
  display: block;
  font-size: 1.05rem;
  line-height: 1.18;
}
.codegraph-metric span {
  display: block;
  margin-top: 0.18rem;
  color: var(--muted);
  font-size: 0.72rem;
}
.codegraph-search-field {
  margin: 0 0 0.75rem;
}
.codegraph-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.45rem;
  margin-bottom: 0.9rem;
}
.codegraph-actions .btn {
  width: 100%;
  min-width: 0;
  justify-content: center;
  padding-inline: 0.45rem;
}
.codegraph-filter-group {
  margin-top: 0.9rem;
}
.codegraph-filter-group h2,
.codegraph-selection h2 {
  margin: 0 0 0.45rem;
  color: var(--muted);
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.codegraph-check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.45rem;
}
.codegraph-check {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
  min-height: 2.15rem;
  padding: 0.45rem 0.5rem;
  border: 1px solid rgba(56, 68, 77, 0.82);
  border-radius: 8px;
  background: rgba(13, 18, 24, 0.72);
  color: var(--fg);
  font-size: 0.8rem;
}
.codegraph-check input {
  flex: 0 0 auto;
  margin: 0;
  accent-color: #70c7ad;
}
.codegraph-check span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.codegraph-check--wide {
  width: 100%;
}
.codegraph-swatch {
  width: 0.58rem;
  height: 0.58rem;
  border-radius: 999px;
  flex: 0 0 auto;
}
.codegraph-swatch--muted {
  background: linear-gradient(135deg, #70c7ad 0 48%, #53606d 48% 52%, #8fc7ff 52% 100%);
}
.codegraph-block-list {
  display: grid;
  gap: 0.5rem;
}
.codegraph-block {
  border: 1px solid rgba(56, 68, 77, 0.82);
  border-radius: 8px;
  background: rgba(13, 18, 24, 0.72);
}
.codegraph-block[open] {
  background: rgba(20, 27, 35, 0.86);
}
.codegraph-block.is-active {
  border-color: rgba(112, 199, 173, 0.86);
}
.codegraph-block.is-empty {
  opacity: 0.58;
}
.codegraph-block summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem 0.6rem;
  cursor: pointer;
}
.codegraph-block summary::-webkit-details-marker {
  display: none;
}
.codegraph-block-toggle {
  margin: 0;
  accent-color: #70c7ad;
}
.codegraph-block-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.8rem;
}
.codegraph-block-count {
  color: var(--muted);
  font-size: 0.72rem;
}
.codegraph-block-body {
  display: grid;
  gap: 0.55rem;
  padding: 0 0.65rem 0.65rem;
  color: var(--muted);
  font-size: 0.76rem;
  line-height: 1.35;
}
.codegraph-block-body dl {
  display: grid;
  grid-template-columns: 4.1rem minmax(0, 1fr);
  gap: 0.28rem 0.45rem;
  margin: 0;
}
.codegraph-block-body dt {
  color: var(--fg);
}
.codegraph-block-body dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
}
.codegraph-block-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.4rem;
}
.codegraph-block-actions .btn {
  min-width: 0;
  justify-content: center;
  padding-inline: 0.45rem;
}
.codegraph-selection {
  margin-top: 1rem;
  padding-top: 0.85rem;
  border-top: 1px solid rgba(82, 100, 118, 0.64);
}
.codegraph-selection dl {
  display: grid;
  grid-template-columns: 4.25rem minmax(0, 1fr);
  gap: 0.35rem 0.6rem;
  margin: 0;
}
.codegraph-selection dt {
  color: var(--muted);
}
.codegraph-selection dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
}
.codegraph-stage {
  position: relative;
  min-width: 0;
  min-height: 0;
  background:
    linear-gradient(rgba(143, 199, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(143, 199, 255, 0.035) 1px, transparent 1px),
    #12100d;
  background-size: 24px 24px;
}
#cg-canvas {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  cursor: grab;
  touch-action: none;
}
#cg-canvas:active {
  cursor: grabbing;
}
.codegraph-tooltip {
  position: fixed;
  z-index: 1200;
  display: none;
  max-width: min(22rem, calc(100vw - 2rem));
  padding: 0.55rem 0.65rem;
  border: 1px solid rgba(82, 100, 118, 0.82);
  border-radius: 8px;
  background: #1c1712;
  color: var(--fg);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.36);
  pointer-events: none;
}
.codegraph-tooltip .muted {
  color: var(--muted);
}
@media (max-width: 980px) {
  .page-codegraph .detail-hero--codegraph {
    grid-template-columns: 1fr;
  }
  .page-codegraph .detail-hero--codegraph .detail-hero-side {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .codegraph-shell {
    grid-template-columns: 1fr;
    height: auto;
  }
  .codegraph-sidebar {
    max-height: 24rem;
    border-right: 0;
    border-bottom: 1px solid rgba(82, 100, 118, 0.72);
  }
  .codegraph-stage,
  #cg-canvas {
    height: 34rem;
    min-height: 34rem;
  }
}
@media (max-width: 620px) {
  .page-codegraph .detail-hero--codegraph .detail-hero-side {
    grid-template-columns: 1fr;
  }
  .codegraph-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .codegraph-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .codegraph-check-grid {
    grid-template-columns: 1fr;
  }
}
.admin-user-list {
  display: grid;
  gap: 1rem;
}
.admin-user-form {
  display: grid;
  gap: 0.9rem;
  padding: 1rem;
  border: 1px solid rgba(82, 100, 118, 0.72);
  border-radius: 16px;
  background: #111a24;
}
.admin-user-form--create {
  background:
    radial-gradient(circle at top right, rgba(45, 212, 191, 0.10), transparent 18rem),
    #111a24;
}
.admin-user-form__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}
.admin-user-form__head h3 {
  margin: 0;
  font-size: 1.05rem;
}
.admin-user-form__toggles {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.75rem;
}
.admin-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  gap: 0.75rem;
  align-items: end;
}
.admin-form-grid .field {
  margin: 0;
}
.admin-switch {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.4rem;
  color: var(--fg);
}
.admin-switch input {
  width: 1rem;
  height: 1rem;
  accent-color: var(--accent);
}
.admin-switch--full {
  font-weight: 650;
}
.admin-access-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
  gap: 0.5rem;
}
.admin-access-check {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-width: 0;
  min-height: 3rem;
  padding: 0.7rem 0.75rem;
  border: 1px solid rgba(56, 68, 77, 0.82);
  border-radius: 0.75rem;
  background: rgba(15, 20, 25, 0.44);
}
.admin-access-check input {
  margin-top: 0.18rem;
  accent-color: var(--accent);
  flex: 0 0 auto;
}
.admin-access-check span {
  display: grid;
  gap: 0.16rem;
  min-width: 0;
}
.admin-access-check strong {
  font-size: 0.95rem;
  line-height: 1.25;
}
.admin-table-wrap {
  overflow-x: auto;
  border: 1px solid rgba(82, 100, 118, 0.72);
  border-radius: 8px;
  background: #111a24;
}
.admin-users-table {
  width: 100%;
  min-width: 128rem;
  border-collapse: collapse;
  table-layout: fixed;
}
.admin-users-table th,
.admin-users-table td {
  padding: 0.7rem 0.65rem;
  border-bottom: 1px solid rgba(56, 68, 77, 0.68);
  border-right: 1px solid rgba(56, 68, 77, 0.48);
  vertical-align: middle;
}
.admin-users-table th:last-child,
.admin-users-table td:last-child {
  border-right: 0;
}
.admin-users-table tbody tr:last-child th,
.admin-users-table tbody tr:last-child td {
  border-bottom: 0;
}
.admin-users-table thead th {
  background: rgba(15, 23, 32, 0.96);
  color: var(--fg);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
  box-shadow: 0 1px 0 rgba(56, 68, 77, 0.9), 0 10px 18px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.admin-table-sticky-head {
  position: fixed;
  z-index: 120;
  overflow: hidden;
  border: 1px solid rgba(82, 100, 118, 0.72);
  border-radius: 8px 8px 0 0;
  background: #111a24;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.32);
}
.admin-table-sticky-head[hidden] {
  display: none !important;
}
.sticky-table-head table {
  width: auto;
  min-width: 0;
}
.sticky-table-head th,
.sticky-table-head td {
  box-sizing: border-box;
}
.admin-table-sticky-head .admin-users-table {
  width: auto;
  min-width: 0;
}
.admin-table-sticky-head .admin-users-table th {
  border-bottom: 0;
}
.admin-users-table thead th:first-child {
  text-align: left;
}
.admin-users-table thead th span {
  display: block;
  overflow-wrap: anywhere;
  white-space: normal;
}
.admin-users-table tbody tr {
  background: rgba(17, 26, 36, 0.76);
}
.admin-users-table tbody tr:nth-child(even) {
  background: rgba(14, 22, 31, 0.76);
}
.admin-users-table tbody tr.is-disabled {
  opacity: 0.62;
}
.admin-users-table__login-col {
  width: 14.5rem;
}
.admin-users-table__manager-col {
  width: 12rem;
}
.admin-users-table__state-col {
  width: 5.75rem;
}
.admin-users-table__access-col {
  width: 10rem;
}
.admin-users-table__password-col {
  width: 13rem;
}
.admin-users-table__binom-col {
  width: 16rem;
}
.admin-users-table__actions-col {
  width: 7rem;
}
.admin-users-table__user {
  text-align: left;
}
.admin-users-table__manager {
  text-align: left;
}
.admin-users-table__binom {
  text-align: left;
}
.admin-users-table__user .hint {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.72rem;
}
.admin-users-table__center,
.admin-users-table__actions {
  text-align: center;
}
.admin-table-input {
  width: 100%;
  min-width: 0;
  padding: 0.52rem 0.6rem;
  border: 1px solid rgba(82, 100, 118, 0.8);
  border-radius: 6px;
  background: #0d141c;
  color: var(--fg);
  font-size: 0.88rem;
}
.admin-table-input:focus-visible {
  outline: 2px solid rgba(45, 212, 191, 0.54);
  outline-offset: 1px;
}
.admin-users-table__password .admin-table-input {
  margin-bottom: 0.45rem;
}
.admin-table-select {
  appearance: auto;
}
.admin-table-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
}
.admin-table-check input,
.admin-table-mini-check input {
  width: 1rem;
  height: 1rem;
  accent-color: var(--accent);
}
.admin-table-check--full input {
  outline: 1px solid rgba(45, 212, 191, 0.35);
  outline-offset: 2px;
}
.admin-table-mini-check {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: var(--muted);
  font-size: 0.76rem;
  line-height: 1.2;
}
.admin-form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
}
.admin-generated-password {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
  margin: 1rem 0;
  padding: 0.8rem 1rem;
  border: 1px solid rgba(45, 212, 191, 0.42);
  border-radius: 14px;
  background: rgba(45, 212, 191, 0.10);
}
.admin-generated-password__label {
  color: var(--muted);
}

.run-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.run-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--border);
}
.run-list li:last-child {
  border-bottom: none;
}
.run-list-icon {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  object-fit: cover;
  flex-shrink: 0;
  border: 1px solid var(--border);
}
.progressive-icon {
  opacity: 0.55;
  transform: scale(0.97);
  background: linear-gradient(110deg, #162231 8%, #203146 18%, #162231 33%);
  background-size: 200% 100%;
  animation: progressive-icon-shimmer 1.1s linear infinite;
  transition: opacity 0.18s ease, transform 0.18s ease;
}
.progressive-icon--loaded {
  opacity: 1;
  transform: scale(1);
  animation: none;
  background: #1a2733;
}
html.factory-img-fade-enabled img:not(.factory-img-loaded):not([data-no-img-fade]) {
  opacity: 0;
}
html.factory-img-fade-enabled img.factory-img-fade {
  transition: opacity 0.2s ease;
}
html.factory-img-fade-enabled img.factory-img-loaded {
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  html.factory-img-fade-enabled img.factory-img-fade {
    transition: none;
  }
}
@keyframes progressive-icon-shimmer {
  to {
    background-position-x: -200%;
  }
}
.form-store-refresh .block-label {
  display: block;
  margin: 0.5rem 0;
}
.form-store-refresh .wide {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.store-refresh-product-card,
.sr-product-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: var(--space-4);
  align-items: center;
  margin: var(--space-4) 0 var(--space-5);
  padding: var(--space-4);
  border: 1px solid var(--m3-outline-variant);
  border-radius: var(--shape-lg);
  background: var(--m3-surface-container);
  box-shadow: var(--elevation-1);
}
.sr-product-badge {
  display: inline-flex;
  align-items: center;
  min-height: 1.85rem;
  padding: 0 var(--space-3);
  border-radius: var(--shape-pill);
  font-size: 0.78rem;
  font-weight: 700;
}
.sr-product-badge--primary {
  border: 1px solid color-mix(in srgb, var(--m3-primary) 55%, transparent);
  background: var(--m3-primary-container);
  color: var(--m3-on-primary-container);
}
.sr-surface {
  margin-bottom: var(--space-4);
  padding: var(--space-4);
  border: 1px solid var(--m3-outline-variant);
  border-radius: var(--shape-lg);
  background: var(--m3-surface-container-low);
  box-shadow: var(--elevation-0);
}
.sr-surface__head {
  margin: 0 0 var(--space-3);
}
.sr-surface__title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--m3-on-surface);
}
.sr-surface__lead {
  margin: var(--space-1) 0 0;
  color: var(--m3-on-surface-variant);
  font-size: 0.86rem;
  line-height: 1.45;
}
.sr-icon-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-4);
  align-items: center;
}
.sr-icon-preview {
  width: 5rem;
  height: 5rem;
  border-radius: var(--shape-xl);
  overflow: hidden;
  background: var(--m3-surface-container-highest);
  box-shadow: var(--elevation-1);
}
.sr-icon-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sr-global-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  gap: var(--space-3);
}
.sr-global-grid--asc {
  margin-top: var(--space-3);
}
.sr-field {
  display: grid;
  gap: var(--space-1);
  margin: 0;
}
.sr-field__label {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--m3-on-surface);
}
.sr-field__label-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
}
.sr-field__hint {
  color: var(--m3-on-surface-variant);
  font-size: 0.76rem;
  line-height: 1.35;
}
.sr-protect-tools {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
.sr-protect-btn {
  min-height: 1.65rem;
  padding: 0.18rem 0.48rem;
  border: 1px solid rgba(124, 200, 248, 0.36);
  border-radius: 999px;
  background: rgba(124, 200, 248, 0.13);
  color: #bfe5ff;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 700;
  cursor: pointer;
}
.sr-protect-btn:hover,
.sr-protect-btn:focus-visible {
  border-color: rgba(124, 200, 248, 0.72);
  background: rgba(124, 200, 248, 0.22);
}
.sr-protect-btn--ghost {
  border-color: rgba(148, 163, 184, 0.32);
  background: rgba(15, 23, 32, 0.42);
  color: var(--m3-on-surface-variant);
}
.sr-protected-status {
  min-height: 1rem;
  color: var(--m3-on-surface-variant);
  font-size: 0.72rem;
}
.sr-protected-status[data-status-kind="error"] {
  color: #fca5a5;
}
.sr-protected-status[data-status-kind="ready"] {
  color: #9bd7ff;
}
.sr-protected-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
.sr-protected-chips[hidden] {
  display: none;
}
.sr-protected-chip {
  max-width: 100%;
  padding: 0.16rem 0.45rem;
  border: 1px solid rgba(124, 200, 248, 0.34);
  border-radius: 999px;
  background: rgba(124, 200, 248, 0.12);
  color: #d6efff;
  font-size: 0.72rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.sr-variant-intro {
  margin: 0 0 var(--space-3);
  color: var(--m3-on-surface-variant);
  font-size: 0.88rem;
  line-height: 1.45;
}
.sr-variant-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
  align-items: start;
}
.sr-variant {
  min-width: 0;
  padding: var(--space-4);
  border: 1px solid var(--m3-outline-variant);
  border-radius: var(--shape-lg);
  background: var(--m3-surface-container);
  box-shadow: var(--elevation-1);
}
.sr-variant__head {
  margin-bottom: var(--space-3);
}
.sr-variant__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.sr-variant--light .sr-variant__title {
  color: var(--m3-primary);
}
.sr-variant--hard .sr-variant__title {
  color: #ffb4a8;
}
.sr-variant__lead {
  margin: var(--space-1) 0 0;
  color: var(--m3-on-surface-variant);
  font-size: 0.8rem;
  line-height: 1.4;
}
.sr-variant__fields {
  display: grid;
  gap: var(--space-3);
}
.sr-surface--release {
  margin-bottom: var(--space-4);
}
.sr-release-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3);
  align-items: stretch;
}
.sr-release-panel {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
  padding: var(--space-3);
  border: 1px solid var(--m3-outline-variant);
  border-radius: var(--shape-lg);
  background: var(--m3-surface-container);
}
.sr-release-panel--whats-new {
  border-color: color-mix(in srgb, var(--m3-primary) 28%, var(--m3-outline-variant));
}
.sr-release-panel--review {
  border-color: color-mix(in srgb, #fbbf24 22%, var(--m3-outline-variant));
}
.sr-release-panel--review.is-asc-enabled {
  border-color: color-mix(in srgb, #fbbf24 48%, var(--m3-outline-variant));
  background: color-mix(in srgb, #fbbf24 6%, var(--m3-surface-container));
}
.sr-release-panel__head {
  display: grid;
  gap: var(--space-2);
}
.sr-release-panel__title {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--m3-on-surface);
  line-height: 1.3;
}
.sr-release-panel__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}
.form-store-refresh .sr-release-panel__toolbar label {
  display: inline-flex;
  margin: 0;
  width: auto;
  max-width: none;
}
.form-store-refresh .sr-release-panel__toolbar label input {
  margin-top: 0;
  width: 1px;
  height: 1px;
  min-height: 0;
  max-width: none;
  padding: 0;
}
.sr-release-tool {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  box-sizing: border-box;
  height: 2rem;
  min-height: 2rem;
  margin: 0;
  padding: 0 0.75rem;
  border: 1px solid var(--m3-outline-variant);
  border-radius: var(--shape-pill);
  background: var(--m3-surface-container-highest);
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1;
  color: var(--m3-on-surface-variant);
  vertical-align: middle;
}
button.sr-release-tool.btn {
  padding: 0 0.75rem;
  font-size: 0.78rem;
  line-height: 1;
  min-height: 2rem;
}
.sr-release-tool--check {
  padding: 0 0.7rem 0 0.55rem;
  cursor: pointer;
  user-select: none;
}
.sr-release-tool--check input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  opacity: 0;
  pointer-events: none;
}
.sr-release-tool__box {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 0.85rem;
  width: 0.85rem;
  height: 0.85rem;
  border: 1px solid rgba(139, 152, 165, 0.76);
  border-radius: 3px;
  background: rgba(7, 12, 18, 0.96);
  box-sizing: border-box;
}
.sr-release-tool--check:has(input:checked) {
  border-color: color-mix(in srgb, #fbbf24 50%, var(--m3-outline-variant));
  background: color-mix(in srgb, #fbbf24 14%, var(--m3-surface-container-highest));
  color: var(--m3-on-surface);
}
.sr-release-tool--check:has(input:checked) .sr-release-tool__box {
  border-color: #ca8a04;
  background-color: #fbbf24;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%23101820' d='M4.45 8.55 2.1 6.2l.95-.95 1.4 1.4 3.5-3.5.95.95z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.62rem 0.62rem;
}
.sr-release-tool__text {
  white-space: nowrap;
}
.form-store-refresh .sr-release-panel__toolbar .sr-release-tool {
  min-height: 2rem;
  height: 2rem;
  margin-top: 0;
}
.sr-release-panel__hint {
  margin: 0;
  font-size: 0.76rem;
  line-height: 1.35;
  color: var(--m3-on-surface-variant);
}
.sr-release-panel .store-refresh-ai-status {
  margin: 0;
  min-height: 1.1rem;
}
.sr-release-panel .store-refresh-ai-status[data-status-kind="loading"] {
  color: var(--m3-primary);
}
.sr-release-panel .store-refresh-ai-status[data-status-kind="ready"] {
  color: #86efac;
}
.sr-release-panel .store-refresh-ai-status[data-status-kind="error"] {
  color: var(--err);
}
.sr-release-panel__input {
  min-height: 6.5rem;
  resize: vertical;
}
.sr-graphics-preview .store-refresh-graphics-preview {
  margin: 0;
}
.sr-graphics-preview .step-graphics-grid {
  max-height: 14rem;
  overflow: auto;
}
@media (max-width: 900px) {
  .sr-release-grid {
    grid-template-columns: 1fr;
  }
}
.sr-shot-composer__subhead {
  margin: 0;
  font-size: 0.9rem;
}
.form-store-refresh .sr-shots-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap: var(--space-4);
  margin-top: var(--space-4);
  align-items: start;
}
.form-store-refresh .sr-shots-row > .sr-shots-unified {
  min-width: 0;
}
.sr-shots-unified {
  display: grid;
  gap: var(--space-3);
  min-width: 0;
  padding: var(--space-3);
  border: 1px solid var(--m3-outline-variant);
  border-radius: var(--shape-lg);
  background: var(--m3-surface-container-low);
}
.sr-shots-unified__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-3);
}
.sr-shots-unified__title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--m3-on-surface);
}
.sr-shots-unified__lead {
  margin: 0.2rem 0 0;
  font-size: 0.78rem;
  line-height: 1.35;
  color: var(--m3-on-surface-variant);
}
.sr-shots-unified__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
}
.sr-shots-unified__toolbar .btn {
  flex: 0 0 auto;
  min-height: 2.5rem;
  padding: 0.45rem 1rem;
  line-height: 1.15;
  transform: none !important;
}
.sr-shots-unified__toolbar [data-sr-shots-open-modal] {
  min-width: 7.4rem;
}
.sr-shots-unified__toolbar [data-sr-shots-clear-all] {
  min-width: 10.5rem;
}
.sr-shots-unified__upload {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
.sr-shots-unified__upload input[type="file"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}
.sr-shots-unified__panel {
  display: grid;
  gap: var(--space-3);
  min-width: 0;
}
.sr-shots-unified__section-label {
  margin: 0 0 var(--space-2);
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--m3-on-surface);
}
.sr-shots-unified__section-hint {
  font-weight: 500;
  color: var(--m3-on-surface-variant);
}
.sr-shots-unified__sources-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr));
  gap: var(--space-2);
}
.sr-shots-source-card {
  position: relative;
  display: grid;
  gap: 0.3rem;
  margin: 0;
  padding: 0.4rem;
  border: 1px solid var(--m3-outline-variant);
  border-radius: var(--shape-md);
  background: var(--m3-surface);
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.sr-shots-source-card input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.sr-shots-source-card.is-in-queue,
.sr-shots-source-card:has(input:checked) {
  border-color: var(--m3-primary);
  background: color-mix(in srgb, var(--m3-primary-container) 55%, var(--m3-surface));
}
.sr-shots-source-card__frame {
  display: grid;
  place-items: center;
  min-height: 6.5rem;
  border-radius: var(--shape-sm);
  background: var(--m3-surface-container-highest);
  overflow: hidden;
}
.sr-shots-source-card__frame img {
  max-width: 100%;
  max-height: 7.5rem;
  object-fit: contain;
}
.sr-shots-source-card__label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.68rem;
  color: var(--m3-on-surface-variant);
}
.sr-shots-unified__queue {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  box-sizing: border-box;
  padding: var(--space-3);
  border: 1px dashed var(--m3-outline-variant);
  border-radius: var(--shape-md);
  background: var(--m3-surface);
}
.sr-shots-unified__queue-list:empty {
  min-height: 0;
}
.sr-shots-unified__queue-empty {
  margin: 0;
}
.sr-shots-queue-thumb {
  position: relative;
}
.sr-shots-queue-thumb a[data-lightbox-trigger] {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  cursor: zoom-in;
}
.sr-shots-queue-thumb a[data-lightbox-trigger]:focus-visible {
  outline: 2px solid var(--m3-primary);
  outline-offset: 2px;
}
.sr-shots-queue-remove {
  position: absolute;
  top: 0.12rem;
  right: 0.12rem;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 1.35rem;
  height: 1.35rem;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: var(--shape-pill);
  background: rgba(15, 23, 32, 0.88);
  color: #fecaca;
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
}
.sr-shots-queue-remove:hover {
  background: rgba(185, 28, 28, 0.92);
  color: #fff;
}
.sr-shots-modal {
  width: min(52rem, calc(100vw - 2rem));
  max-height: calc(100vh - 2rem);
  margin: auto;
  padding: var(--space-4);
  border: 1px solid var(--m3-outline-variant);
  border-radius: var(--shape-lg);
  background: var(--m3-surface-container-high);
  color: var(--m3-on-surface);
  box-sizing: border-box;
}
.sr-shots-modal::backdrop {
  background: rgba(0, 0, 0, 0.55);
}
.sr-shots-modal__panel {
  display: grid;
  gap: var(--space-3);
  padding: 0;
  margin: 0;
}
.sr-shots-modal__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-2);
}
.sr-shots-modal__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}
.sr-shots-modal__close {
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: var(--shape-pill);
  background: transparent;
  color: var(--m3-on-surface-variant);
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
}
.sr-shots-modal__close:hover {
  background: var(--m3-surface-container-highest);
  color: var(--m3-on-surface);
}
.sr-shots-modal__lead {
  margin: 0;
}
.sr-shots-modal__upload-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}
.sr-shots-modal__upload {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
.sr-shots-modal__upload input[type="file"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}
.sr-shots-modal__upload-progress {
  margin: -0.2rem 0 0;
  min-height: 1.1rem;
  font-size: 0.78rem;
}
.sr-shots-modal__upload-progress[data-status-kind="loading"] {
  color: var(--m3-primary);
}
.sr-shots-modal__upload-progress[data-status-kind="ready"] {
  color: #86efac;
}
.sr-shots-modal__upload-progress[data-status-kind="error"] {
  color: var(--err);
}
.sr-shots-modal__assets {
  max-height: min(24rem, 50vh);
  overflow: auto;
  padding: var(--space-2) var(--space-1);
}
.sr-shots-modal__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr));
  gap: var(--space-2);
}
.sr-shots-modal__section {
  margin-top: var(--space-4);
}
.sr-shots-modal__section-title {
  margin: 0 0 var(--space-2);
  color: var(--m3-on-surface-variant);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0;
}
.sr-shots-modal__asset {
  position: relative;
  display: grid;
  gap: 0.3rem;
  margin: 0;
  padding: 0.4rem;
  border: 1px solid var(--m3-outline-variant);
  border-radius: var(--shape-md);
  background: var(--m3-surface);
  cursor: pointer;
  text-align: left;
  transition: border-color 0.15s, background 0.15s;
}
.sr-shots-modal__asset:hover,
.sr-shots-modal__asset.is-in-queue {
  border-color: var(--m3-primary);
  background: color-mix(in srgb, var(--m3-primary-container) 50%, var(--m3-surface));
}
.sr-shots-modal__asset-badge {
  position: absolute;
  top: 0.35rem;
  left: 0.35rem;
  z-index: 1;
  padding: 0.08rem 0.35rem;
  border-radius: var(--shape-pill);
  background: var(--m3-primary);
  color: var(--m3-on-primary);
  font-size: 0.62rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sr-shots-modal__asset-badge--upload {
  background: #0f766e;
  color: #ecfeff;
}
.sr-shots-modal__asset-frame {
  display: grid;
  place-items: center;
  min-height: 6.5rem;
  border-radius: var(--shape-sm);
  background: var(--m3-surface-container-highest);
  overflow: hidden;
}
.sr-shots-modal__asset-frame[style*="--graphics-ratio"] {
  min-height: 0;
  aspect-ratio: var(--graphics-ratio);
}
.sr-shots-modal__asset-frame[style*="--graphics-ratio"] img,
.sr-shots-modal__asset-frame[style*="--graphics-ratio"] video {
  width: 100%;
  height: 100%;
  max-height: none;
}
.sr-shots-modal__asset--landscape {
  grid-column: span 2;
}
.sr-shots-modal__asset-frame img,
.sr-shots-modal__asset-frame video {
  max-width: 100%;
  max-height: 7.5rem;
  object-fit: contain;
}
.sr-shots-modal__asset-frame[style*="--graphics-ratio"] img,
.sr-shots-modal__asset-frame[style*="--graphics-ratio"] video {
  max-height: none;
}
.sr-shots-modal__asset-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.68rem;
  color: var(--m3-on-surface-variant);
}
.sr-shots-modal__foot {
  display: flex;
  justify-content: flex-end;
}
@media (max-width: 720px) {
  .form-store-refresh .sr-shots-row {
    grid-template-columns: 1fr;
  }
}
.store-refresh-locale-row.is-primary {
  border-color: color-mix(in srgb, var(--m3-primary) 55%, transparent);
  background: color-mix(in srgb, var(--m3-primary-container) 45%, transparent);
  box-shadow: inset 3px 0 0 var(--m3-primary);
}
.store-refresh-locale-translate {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.35rem;
  justify-self: end;
  align-self: center;
  margin-left: 0;
  padding: 0.1rem 0.35rem;
  border-radius: var(--shape-sm);
  font-size: 0.72rem;
  color: var(--m3-on-surface-variant);
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
  min-width: max-content;
  max-width: none;
  line-height: 1;
  z-index: 2;
}
.store-refresh-locale-translate[hidden] {
  display: none !important;
}
.store-refresh-locale-row:not(.is-primary):has(> input[data-store-refresh-locale-code]:checked)
  .store-refresh-locale-translate {
  display: inline-flex !important;
}
.store-refresh-locale-row:not(.is-primary):has(> input[data-store-refresh-locale-code]:checked)
  .store-refresh-locale-translate[hidden] {
  display: inline-flex !important;
}
.store-refresh-locale-translate input {
  flex-shrink: 0;
  width: 0.9rem;
  height: 0.9rem;
  margin: 0;
  opacity: 1;
  pointer-events: auto;
  position: static;
  accent-color: var(--m3-primary);
  cursor: pointer;
}
.store-refresh-locale-translate__text {
  line-height: 1.2;
}
.sr-localize-progress[data-status-kind="loading"] {
  color: var(--m3-primary);
}
.sr-localize-progress[data-status-kind="error"] {
  color: #b91c1c;
}
.sr-localize-progress[data-status-kind="ready"] {
  color: var(--m3-primary);
}
.form-store-refresh > .store-refresh-actions {
  max-width: none;
}
.form-store-refresh > .store-refresh-actions [data-store-refresh-translate-btn] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.form-store-refresh > .store-refresh-actions [data-store-refresh-translate-btn].is-action-required {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--m3-primary) 55%, transparent);
}
.form-store-refresh > .store-refresh-actions.is-locked > [data-store-refresh-save-btn],
.form-store-refresh > .store-refresh-actions.is-locked > [data-store-refresh-asc-btn] {
  opacity: 0.42 !important;
  cursor: not-allowed !important;
  filter: grayscale(0.35);
  pointer-events: none !important;
}
.form-store-refresh[data-store-refresh-submit-locked="1"] [data-store-refresh-save-btn],
.form-store-refresh[data-store-refresh-submit-locked="1"] [data-store-refresh-asc-btn] {
  opacity: 0.42 !important;
  cursor: not-allowed !important;
  filter: grayscale(0.35);
  pointer-events: none !important;
}
.store-refresh-locale-preview-btn {
  justify-self: end;
  align-self: center;
  position: relative;
  z-index: 2;
  padding: 0.12rem 0.45rem;
  border-radius: 6px;
  border: 1px solid var(--m3-outline-variant);
  background: var(--m3-surface-container-high);
  color: var(--m3-primary);
  font-size: 0.68rem;
  font-weight: 600;
  text-decoration: none;
  line-height: 1.3;
  white-space: nowrap;
  z-index: 1;
}
.store-refresh-locale-preview-btn:hover {
  border-color: var(--m3-primary);
  background: color-mix(in srgb, var(--m3-primary) 12%, var(--m3-surface-container-high));
}
.store-refresh-locale-primary-badge {
  display: inline-flex;
  align-items: center;
  justify-self: end;
  align-self: center;
  flex-shrink: 0;
  margin: 0;
  padding: 0.12rem 0.5rem;
  border-radius: var(--shape-pill);
  background: var(--m3-primary);
  color: var(--m3-on-primary);
  font-size: 0.65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  line-height: 1;
  white-space: nowrap;
}
@media (max-width: 1080px) {
  .sr-variant-grid {
    grid-template-columns: 1fr;
  }
}
.store-refresh-product-icon {
  display: grid;
  place-items: center;
  width: 4.4rem;
  height: 4.4rem;
  border-radius: 18px;
  overflow: hidden;
  background: linear-gradient(145deg, #f8fafc, #93c5fd 48%, #1d4ed8);
  color: rgba(15, 23, 42, 0.88);
  font-size: 2rem;
  font-weight: 800;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
}
.store-refresh-product-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.store-refresh-product-main {
  min-width: 0;
}
.store-refresh-product-eyebrow {
  margin: 0 0 0.12rem;
  color: #8fc1ff;
  font-size: 0.76rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0;
}
.store-refresh-product-main h3 {
  margin: 0;
  font-size: 1.28rem;
  line-height: 1.2;
}
.store-refresh-product-main p {
  margin: 0.22rem 0 0;
  color: var(--muted);
}
.store-refresh-product-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.35rem;
}
.store-refresh-product-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 1.8rem;
  padding: 0 0.55rem;
  border: 1px solid rgba(124, 200, 248, 0.22);
  border-radius: 999px;
  background: rgba(15, 23, 32, 0.56);
  color: #dbeafe;
  font-size: 0.78rem;
}
.store-refresh-appstore-panel {
  margin: 0.9rem 0 1rem;
  border: 1px solid rgba(70, 84, 98, 0.86);
  border-radius: 14px;
  background: rgba(11, 18, 26, 0.78);
  overflow: hidden;
}
.store-refresh-tabbar {
  display: flex;
  gap: 0.2rem;
  padding: 0.38rem;
  border-bottom: 1px solid rgba(70, 84, 98, 0.76);
  background: rgba(229, 236, 244, 0.08);
}
.store-refresh-tab {
  flex: 1 1 0;
  min-height: 2.45rem;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #a9b7c5;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.store-refresh-tab:hover,
.store-refresh-tab:focus-visible {
  color: #eff6ff;
  background: rgba(255, 255, 255, 0.06);
  outline: none;
}
.store-refresh-tab.is-active {
  background: rgba(248, 250, 252, 0.94);
  color: #101828;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.2);
}
.store-refresh-tab-panel {
  padding: 0.9rem;
}
.store-refresh-tab-panel[hidden] {
  display: none !important;
}
.store-refresh-panel-head {
  margin: 0 0 0.8rem;
}
.store-refresh-panel-head h3 {
  margin: 0;
  font-size: 1.05rem;
}
.store-refresh-panel-head p {
  margin: 0.2rem 0 0;
  color: var(--muted);
}
.store-refresh-appstore-toolbar {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
  padding: 0.28rem;
  margin-bottom: 0.85rem;
  border: 1px solid rgba(70, 84, 98, 0.58);
  border-radius: 12px;
  background: rgba(8, 13, 19, 0.42);
}
.store-refresh-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-height: 2.35rem;
  margin: 0;
  padding: 0.25rem 0.72rem;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: #aab7c5;
  font-size: 0.88rem;
  font-weight: 700;
  cursor: pointer;
  transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}
.store-refresh-pill input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}
.store-refresh-pill::before {
  content: "";
  width: 0.82rem;
  height: 0.82rem;
  border: 1px solid rgba(139, 152, 165, 0.76);
  border-radius: 999px;
  background: rgba(15, 23, 32, 0.95);
  box-shadow: inset 0 0 0 3px rgba(15, 23, 32, 0.95);
}
.store-refresh-pill:has(input:checked) {
  border-color: rgba(29, 155, 240, 0.5);
  background: rgba(29, 155, 240, 0.14);
  color: #d9f0ff;
}
.store-refresh-pill:has(input:checked)::before {
  border-color: #38bdf8;
  background: #38bdf8;
}
.store-refresh-settings-grid,
.store-refresh-inline-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  gap: 0.75rem;
}
.store-refresh-settings-grid {
  margin-bottom: 0.75rem;
}
.store-refresh-scope-help {
  display: grid;
  gap: 0.4rem;
  margin: 0.65rem 0 0.75rem;
}
.store-refresh-scope-help p,
.store-refresh-panel-head p[data-store-refresh-screenshots-help] {
  margin: 0;
  color: #9aa7b4;
  font-size: 0.86rem;
  line-height: 1.45;
}
.store-refresh-scope-help strong {
  color: #d9f0ff;
}
.store-refresh-card-grid {
  display: grid;
  gap: 0.75rem;
}
.store-refresh-card-grid--metadata {
  grid-template-columns: minmax(0, 0.9fr) minmax(18rem, 1.1fr);
  align-items: stretch;
  margin-bottom: 0.75rem;
}
.store-refresh-form-card {
  min-width: 0;
  padding: 0.78rem;
  border: 1px solid rgba(70, 84, 98, 0.62);
  border-radius: 12px;
  background: rgba(8, 13, 19, 0.42);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.store-refresh-form-card-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  margin: 0 0 0.65rem;
}
.store-refresh-form-card-head h4 {
  margin: 0;
  color: #f2f6fb;
  font-size: 0.95rem;
}
.store-refresh-form-card-head span {
  color: #8b98a5;
  font-size: 0.74rem;
  font-weight: 700;
  text-transform: uppercase;
  white-space: nowrap;
}
.store-refresh-mode-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.45rem;
}
.store-refresh-mode-card,
.store-refresh-toggle-card {
  position: relative;
  min-width: 0;
  margin: 0;
  border: 1px solid rgba(70, 84, 98, 0.54);
  border-radius: 10px;
  background: rgba(15, 23, 32, 0.46);
  cursor: pointer;
  transition: border-color 0.16s ease, background-color 0.16s ease, color 0.16s ease;
}
.store-refresh-mode-card {
  display: grid;
  gap: 0.14rem;
  padding: 0.72rem 0.72rem 0.72rem 2.05rem;
}
.store-refresh-mode-card input,
.store-refresh-toggle-card input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}
.store-refresh-mode-card::before,
.store-refresh-toggle-card::before {
  content: "";
  position: absolute;
  left: 0.72rem;
  top: 0.82rem;
  width: 0.78rem;
  height: 0.78rem;
  border: 1px solid rgba(139, 152, 165, 0.76);
  background: rgba(7, 12, 18, 0.96);
  box-shadow: inset 0 0 0 2px rgba(7, 12, 18, 0.96);
}
.store-refresh-mode-card::before {
  border-radius: 999px;
}
.store-refresh-toggle-card::before {
  border-radius: 4px;
}
.store-refresh-mode-card span,
.store-refresh-toggle-card span {
  color: #eff6ff;
  font-weight: 800;
}
.store-refresh-mode-card small,
.store-refresh-toggle-card small {
  color: #8b98a5;
  font-size: 0.76rem;
  line-height: 1.25;
}
.store-refresh-mode-card:has(input:checked),
.store-refresh-toggle-card:has(input:checked) {
  border-color: rgba(56, 189, 248, 0.48);
  background: rgba(29, 155, 240, 0.12);
}
.store-refresh-mode-card:has(input:checked)::before,
.store-refresh-toggle-card:has(input:checked)::before {
  border-color: #38bdf8;
  background: #38bdf8;
}
.store-refresh-fixed-terms {
  margin-top: 0.7rem;
  transition: opacity 0.16s ease;
}
.store-refresh-name-localization:not(:has(input[value="partial"]:checked)) .store-refresh-fixed-terms,
.store-refresh-fixed-terms.is-disabled {
  opacity: 0.45;
}
.store-refresh-fixed-terms.is-disabled input {
  cursor: not-allowed;
}
.store-refresh-split-name-fields {
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(70, 84, 98, 0.46);
}
.store-refresh-field-note {
  grid-column: 1 / -1;
  margin: -0.2rem 0 0;
  color: #8b98a5;
  font-size: 0.78rem;
  line-height: 1.35;
}
.store-refresh-input-hint {
  display: block;
  margin-top: 0.25rem;
  color: #8b98a5;
  font-size: 0.74rem;
  line-height: 1.25;
}
.store-refresh-toggle-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem;
  margin-bottom: 0.75rem;
}
.store-refresh-toggle-card {
  display: grid;
  gap: 0.12rem;
  padding: 0.68rem 0.72rem 0.68rem 2.05rem;
}
.store-refresh-toggle-card--wide {
  margin-bottom: 0.65rem;
}
.store-refresh-metadata-fields {
  display: grid;
  gap: 0.65rem;
}
.store-refresh-whats-new-box {
  display: grid;
  gap: 0.5rem;
  margin-top: 0.85rem;
}
.store-refresh-whats-new-head {
  align-items: end;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
}
.store-refresh-whats-new-head .block-label {
  margin: 0;
}
.store-refresh-ai-status {
  margin: 0;
}
.store-refresh-ai-status[data-status-kind="ready"] {
  color: #88d69a;
}
.store-refresh-ai-status[data-status-kind="error"] {
  color: #ff9a9a;
}
.store-refresh-screenshot-ai-settings {
  margin-bottom: 0.85rem;
}
.store-refresh-submit-card {
  display: grid;
  grid-template-columns: minmax(13rem, 0.65fr) minmax(16rem, 0.9fr);
  gap: 0.75rem;
  align-items: start;
  padding: 0.85rem;
  border: 1px solid rgba(70, 84, 98, 0.62);
  border-radius: 12px;
  background: rgba(8, 13, 19, 0.42);
}
.store-refresh-submit-copy h4 {
  margin: 0 0 0.28rem;
  color: #f2f6fb;
  font-size: 0.96rem;
}
.store-refresh-submit-copy p {
  margin: 0;
  color: #8b98a5;
  font-size: 0.82rem;
  line-height: 1.38;
}
.store-refresh-submit-toggle {
  margin: 0;
}
.store-refresh-submit-card textarea {
  grid-column: 1 / -1;
}
.store-refresh-submit-card textarea[disabled] {
  opacity: 0.46;
  cursor: not-allowed;
}
.store-refresh-split-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}
.form-store-refresh[data-store-refresh-scope-mode="primary"] .store-refresh-split-grid {
  grid-template-columns: minmax(0, 1fr);
}
.form-store-refresh[data-store-refresh-scope-mode="primary"] .sr-shots-row {
  grid-template-columns: minmax(0, 1fr);
}
.form-store-refresh[data-store-refresh-scope-mode="primary"] [data-store-refresh-light-card] .sr-protect-tools {
  display: none !important;
}
.form-store-refresh[data-store-refresh-scope-mode="primary"] [data-store-refresh-light-card] [data-store-refresh-protect-selection],
.form-store-refresh[data-store-refresh-scope-mode="primary"] [data-store-refresh-light-card] [data-store-refresh-protect-clear] {
  display: none !important;
}
.form-store-refresh[data-store-refresh-scope-mode="primary"] [data-store-refresh-hard-card],
.form-store-refresh[data-store-refresh-scope-mode="primary"] [data-store-refresh-shot-composer="hard"],
.form-store-refresh[data-store-refresh-scope-mode="primary"] [data-store-refresh-split-only],
.form-store-refresh[data-store-refresh-scope-mode="primary"] [data-store-refresh-locale-picker],
.form-store-refresh[data-store-refresh-scope-mode="primary"] [data-store-refresh-translate-btn],
.form-store-refresh[data-store-refresh-scope-mode="split"] [data-store-refresh-primary-only] {
  display: none !important;
}
.store-refresh-split-card {
  border: 1px solid rgba(70, 84, 98, 0.78);
  border-radius: 12px;
  padding: 0.75rem;
  background: rgba(8, 12, 16, 0.34);
}
.store-refresh-split-card h3 {
  margin: 0 0 0.35rem;
  font-size: 0.95rem;
}
.store-refresh-split-card--hard h3 {
  color: #fca5a5;
}
.store-refresh-split-card--light h3 {
  color: #93c5fd;
}
.store-refresh-locale-picker {
  margin: 0.35rem 0 0.65rem;
  border: 1px solid rgba(70, 84, 98, 0.56);
  border-radius: 10px;
  background: rgba(8, 13, 19, 0.54);
  overflow: hidden;
}
.store-refresh-locale-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  padding: 0.5rem;
  border-bottom: 1px solid rgba(70, 84, 98, 0.52);
}
.store-refresh-locale-tool {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid rgba(82, 96, 107, 0.78);
  border-radius: 7px;
  background: rgba(15, 23, 32, 0.88);
  color: #c8d7e2;
  cursor: pointer;
}
.store-refresh-locale-tool--text {
  width: auto;
  min-width: 2.7rem;
  padding: 0 0.62rem;
  font-size: 0.82rem;
  font-weight: 800;
}
.store-refresh-locale-tool--translate {
  min-width: 6.8rem;
  border-color: rgba(134, 239, 172, 0.48);
  color: #b8f7c8;
}
.store-refresh-locale-tool:hover,
.store-refresh-locale-tool:focus-visible {
  border-color: rgba(56, 189, 248, 0.75);
  background: rgba(29, 155, 240, 0.16);
  color: #d9f0ff;
  outline: none;
}
.store-refresh-locale-tool svg {
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.store-refresh-locale-status {
  min-width: 0;
  color: #8b98a5;
  font-size: 0.78rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.store-refresh-locale-status[data-status-kind="ready"] {
  color: #88d69a;
}
.store-refresh-locale-status[data-status-kind="error"] {
  color: #ff9a9a;
}
.store-refresh-locale-modes {
  display: flex;
  gap: 0.35rem;
  padding: 0.5rem;
  border-bottom: 1px solid rgba(70, 84, 98, 0.52);
}
.store-refresh-locale-mode {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  min-height: 1.75rem;
  margin: 0;
  padding: 0.16rem 0.62rem;
  border: 1px solid rgba(82, 96, 107, 0.72);
  border-radius: 999px;
  background: rgba(17, 26, 36, 0.88);
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
}
.store-refresh-locale-mode input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}
.store-refresh-locale-mode::before {
  content: "";
  width: 0.78rem;
  height: 0.78rem;
  border: 1px solid rgba(139, 152, 165, 0.76);
  border-radius: 4px;
  background: rgba(15, 23, 32, 0.95);
  box-shadow: inset 0 0 0 2px rgba(15, 23, 32, 0.95);
}
.store-refresh-locale-mode:has(input:checked) {
  border-color: rgba(29, 155, 240, 0.82);
  background: rgba(29, 155, 240, 0.16);
  color: #d9f0ff;
}
.store-refresh-locale-mode:has(input:checked)::before {
  border-color: #38bdf8;
  background: #38bdf8;
}
.store-refresh-locale-mode.is-disabled,
.store-refresh-locale-row.is-disabled {
  cursor: not-allowed;
  opacity: 0.34;
}
.store-refresh-locale-mode.is-disabled:hover,
.store-refresh-locale-row.is-disabled:hover {
  border-color: transparent;
  background: rgba(15, 23, 32, 0.28);
}
.store-refresh-locale-grid {
  display: grid;
  /* ~15rem: two locale rows fit in half-width Light/Hard panel; 20rem forced a single column */
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: 0.28rem;
  max-height: 16rem;
  overflow: auto;
  padding: 0.5rem;
}
.store-refresh-locale-row {
  display: grid;
  position: relative;
  grid-template-columns: 0.9rem 3.6rem minmax(0, 1fr) minmax(5.5rem, max-content);
  grid-template-rows: 2rem;
  align-items: center;
  gap: 0.3rem 0.45rem;
  min-height: 2rem;
  margin: 0;
  padding: 0.28rem 0.48rem;
  border: 1px solid transparent;
  border-radius: 8px;
  background: rgba(15, 23, 32, 0.28);
  font-size: 0.82rem;
  cursor: pointer;
  transition: background-color 0.14s ease, border-color 0.14s ease, color 0.14s ease;
}
.store-refresh-locale-row.is-recommended {
  padding-right: 1.85rem;
}
.store-refresh-locale-recommendation {
  position: absolute;
  top: 50%;
  right: 0.48rem;
  z-index: 3;
  display: inline-grid;
  width: 1rem;
  height: 1rem;
  place-items: center;
  color: #ffc978;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1;
  transform: translateY(-50%);
  text-shadow: 0 0 8px rgba(255, 201, 120, 0.38);
  cursor: help;
  animation: store-refresh-recommendation-pop 220ms ease-out;
}
@keyframes store-refresh-recommendation-pop {
  0% { transform: translateY(-50%) scale(0.55) rotate(-12deg); opacity: 0; }
  70% { transform: translateY(-50%) scale(1.15) rotate(4deg); opacity: 1; }
  100% { transform: translateY(-50%) scale(1) rotate(0); opacity: 1; }
}
.store-refresh-locale-row > input[data-store-refresh-locale-code] {
  grid-column: 1;
  grid-row: 1;
  place-self: stretch stretch;
  width: auto;
  height: auto;
  min-width: 0;
  min-height: 0;
  margin: 0;
  opacity: 0;
  pointer-events: none;
  z-index: 1;
}
.store-refresh-locale-row::before {
  content: "";
  grid-column: 1;
  grid-row: 1;
  place-self: center;
  width: 0.82rem;
  height: 0.82rem;
  border: 1px solid rgba(139, 152, 165, 0.72);
  border-radius: 4px;
  background: rgba(7, 12, 18, 0.94);
  box-shadow: inset 0 0 0 2px rgba(7, 12, 18, 0.94);
  pointer-events: none;
}
.store-refresh-locale-row:hover {
  border-color: rgba(56, 189, 248, 0.26);
  background: rgba(29, 155, 240, 0.08);
}
.store-refresh-locale-row:has(> input[data-store-refresh-locale-code]:checked) {
  border-color: rgba(56, 189, 248, 0.42);
  background: rgba(29, 155, 240, 0.12);
}
.store-refresh-locale-row:has(> input[data-store-refresh-locale-code]:checked)::before {
  border-color: #38bdf8;
  background: #38bdf8;
}
.store-refresh-locale-row.is-primary {
  border-color: rgba(56, 189, 248, 0.75);
  background: rgba(29, 155, 240, 0.2);
  box-shadow: inset 4px 0 0 #38bdf8;
}
.store-refresh-locale-row.is-primary:hover {
  border-color: rgba(56, 189, 248, 0.85);
  background: rgba(29, 155, 240, 0.26);
}
.store-refresh-locale-row.is-primary:has(> input[data-store-refresh-locale-code]:checked) {
  border-color: rgba(56, 189, 248, 0.9);
  background: rgba(29, 155, 240, 0.3);
  box-shadow: inset 4px 0 0 #38bdf8;
}
.store-refresh-locale-row.is-primary .store-refresh-locale-code {
  color: #e0f2fe;
  font-weight: 700;
}
.store-refresh-locale-row.is-primary .store-refresh-locale-name {
  color: #f0f9ff;
  font-weight: 600;
}
.store-refresh-locale-code {
  grid-column: 2;
  grid-row: 1;
  font-family: ui-monospace, monospace;
  color: rgba(165, 215, 252, 0.95);
  white-space: nowrap;
  letter-spacing: 0;
}
.store-refresh-locale-name {
  grid-column: 3;
  grid-row: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.store-refresh-locale-translate {
  grid-column: 4;
  grid-row: 1;
}
.store-refresh-locale-primary-badge {
  grid-column: 4;
  grid-row: 1;
}
.store-refresh-locale-preview-btn {
  grid-column: 4;
  grid-row: 1;
  justify-self: end;
}
.store-refresh-locale-row:has(.store-refresh-locale-preview-btn) {
  grid-template-columns: 0.9rem 3.6rem minmax(0, 1fr) minmax(5.5rem, max-content) minmax(4.5rem, max-content);
}
.store-refresh-locale-row:has(.store-refresh-locale-preview-btn) .store-refresh-locale-translate {
  grid-column: 4;
}
.store-refresh-locale-row:has(.store-refresh-locale-preview-btn) .store-refresh-locale-preview-btn {
  grid-column: 5;
}
.sr-translate-hint[data-status-kind="error"] {
  color: #b91c1c;
}
.form-store-refresh .store-refresh-pill,
.form-store-refresh .store-refresh-locale-mode,
.form-store-refresh .store-refresh-mode-card,
.form-store-refresh .store-refresh-toggle-card {
  display: inline-flex;
  margin-bottom: 0;
}
.form-store-refresh .store-refresh-mode-card,
.form-store-refresh .store-refresh-toggle-card {
  display: grid;
}
.form-store-refresh .store-refresh-locale-row {
  display: grid;
  margin-bottom: 0;
}
.store-refresh-upload-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 0.4rem 0 1rem;
}
.store-refresh-shot-composer {
  display: grid;
  gap: 0.65rem;
  min-width: 0;
}
.store-refresh-shot-composer[hidden] {
  display: none;
}
.store-refresh-shot-composer .store-refresh-upload-card {
  margin: 0;
}
.store-refresh-upload-card {
  display: grid;
  align-content: start;
  gap: 0.36rem;
  min-height: 5.2rem;
  padding: 0.7rem;
  border: 1px dashed rgba(124, 200, 248, 0.34);
  border-radius: 12px;
  background: rgba(15, 23, 32, 0.48);
}
.store-refresh-upload-card > span {
  color: #f2f6fb;
  font-weight: 800;
}
.store-refresh-upload-card > small {
  color: #8b98a5;
  font-size: 0.75rem;
  line-height: 1.28;
}
.store-refresh-hard-existing {
  margin: 0 0 1rem;
  padding: 0.75rem;
  border: 1px solid rgba(248, 113, 113, 0.26);
  border-radius: 12px;
  background: rgba(127, 29, 29, 0.08);
}
.store-refresh-shot-composer .store-refresh-hard-existing {
  margin: 0;
}
.store-refresh-hard-existing-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.65rem;
}
.store-refresh-hard-existing-head h4 {
  margin: 0 0 0.2rem;
  color: #fecaca;
  font-size: 0.92rem;
}
.store-refresh-hard-existing-head p {
  margin: 0;
  color: #9aa7b3;
  font-size: 0.78rem;
  line-height: 1.35;
}
.store-refresh-hard-existing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(7.25rem, 1fr));
  gap: 0.55rem;
}
.store-refresh-existing-shot {
  position: relative;
  display: grid;
  gap: 0.35rem;
  margin: 0;
  padding: 0.45rem;
  border: 1px solid rgba(82, 96, 107, 0.7);
  border-radius: 10px;
  background: rgba(8, 13, 19, 0.55);
  cursor: pointer;
}
.store-refresh-existing-shot:has(input:disabled) {
  cursor: default;
  opacity: 0.58;
}
.store-refresh-existing-shot.is-dragging {
  opacity: 0.55;
}
.store-refresh-existing-shot input {
  position: absolute;
  top: 0.45rem;
  left: 0.45rem;
  z-index: 1;
  width: 1rem;
  height: 1rem;
  accent-color: #f87171;
}
.store-refresh-existing-shot:has(input:checked) {
  border-color: rgba(248, 113, 113, 0.72);
  background: rgba(248, 113, 113, 0.13);
}
.store-refresh-existing-shot-frame {
  display: grid;
  place-items: center;
  min-height: 8rem;
  border-radius: 8px;
  background: #0d1218;
  overflow: hidden;
}
.store-refresh-existing-shot-frame img {
  max-width: 100%;
  max-height: 10rem;
  object-fit: contain;
}
.store-refresh-existing-shot-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #c8d7e2;
  font-size: 0.72rem;
}
.store-refresh-hard-existing-empty,
.store-refresh-hard-existing-status {
  grid-column: 1 / -1;
  margin: 0;
}
.store-refresh-hard-existing-status {
  margin-top: 0.55rem;
}
.store-refresh-combined-order {
  padding: 0.65rem;
  border: 1px solid rgba(82, 96, 107, 0.62);
  border-radius: 10px;
  background: rgba(8, 13, 19, 0.48);
}
.store-refresh-combined-order[hidden] {
  display: none;
}
.sr-shots-unified__panel--devices {
  gap: var(--space-3);
}
.sr-shots-device-group {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
  padding: 0.7rem;
  border: 1px solid color-mix(in srgb, var(--m3-outline-variant) 78%, transparent);
  border-radius: var(--shape-md);
  background: color-mix(in srgb, var(--m3-surface) 72%, transparent);
}
.sr-shots-device-group__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  min-width: 0;
}
.sr-shots-device-group__identity {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  min-width: 0;
  color: var(--m3-on-surface);
}
.sr-shots-device-group__identity > span:last-child {
  display: grid;
  gap: 0.08rem;
  min-width: 0;
}
.sr-shots-device-group__identity strong {
  font-size: 0.84rem;
  line-height: 1.15;
}
.sr-shots-device-group__identity small {
  color: var(--m3-on-surface-variant);
  font-size: 0.68rem;
  line-height: 1.2;
}
.sr-shots-device-group__icon {
  display: inline-grid;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  flex: 0 0 1.75rem;
  border: 1px solid color-mix(in srgb, var(--m3-primary) 45%, var(--m3-outline-variant));
  border-radius: 0.48rem;
  background: color-mix(in srgb, var(--m3-primary-container) 58%, transparent);
  color: var(--m3-primary);
  font-size: 1.05rem;
  line-height: 1;
}
.sr-shots-device-group__icon--ipad {
  font-size: 1.18rem;
}
.sr-shots-device-group__actions {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex: 0 0 auto;
}
.sr-shots-device-group__count {
  flex: 0 0 auto;
  padding: 0.28rem 0.5rem;
  border-radius: 999px;
  background: var(--m3-surface-container-high);
  color: var(--m3-on-surface-variant);
  font-size: 0.68rem;
  font-weight: 700;
  white-space: nowrap;
}
.sr-shots-device-group__clear {
  min-height: 1.75rem;
  padding: 0.25rem 0.48rem;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--m3-on-surface-variant);
  font: inherit;
  font-size: 0.68rem;
  font-weight: 700;
  cursor: pointer;
}
.sr-shots-device-group__clear:hover,
.sr-shots-device-group__clear:focus-visible {
  border-color: var(--m3-outline-variant);
  background: var(--m3-surface-container-high);
  color: var(--m3-on-surface);
  outline: none;
}
.sr-shots-device-group .store-refresh-combined-order {
  padding: 0.6rem;
}
.sr-shots-device-group .sr-shots-unified__section-label {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.3rem 0.7rem;
}
.screenshot-order {
  margin-top: 0.55rem;
  padding: 0.65rem;
  border: 1px solid rgba(82, 96, 107, 0.62);
  border-radius: 10px;
  background: rgba(8, 13, 19, 0.48);
}
.screenshot-order-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
}
.screenshot-order-head span {
  color: #f2f6fb;
  font-size: 0.84rem;
  font-weight: 800;
}
.screenshot-order-head small {
  color: #8b98a5;
  font-size: 0.74rem;
}
.screenshot-order-list {
  display: grid;
  gap: 0.4rem;
}
.screenshot-order-item {
  display: grid;
  grid-template-columns: 2.2rem 3rem minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.5rem;
  min-height: 3.4rem;
  padding: 0.35rem 0.45rem;
  border: 1px solid rgba(70, 84, 98, 0.58);
  border-radius: 8px;
  background: rgba(15, 23, 32, 0.62);
}
.screenshot-order-item.is-dragging {
  opacity: 0.55;
}
.screenshot-order-num {
  color: #9fd6ff;
  font-family: ui-monospace, monospace;
  font-weight: 800;
}
.screenshot-order-thumb {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  border-radius: 7px;
  background: #0d1218;
  overflow: hidden;
}
.screenshot-order-thumb img,
.screenshot-order-thumb video {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.screenshot-order-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #c8d7e2;
  font-size: 0.8rem;
}
.screenshot-order-name strong {
  display: inline-block;
  margin-right: 0.3rem;
  color: #9fd6ff;
  font-size: 0.68rem;
  text-transform: uppercase;
}
.screenshot-order-actions {
  display: inline-flex;
  gap: 0.25rem;
}
.screenshot-order-btn {
  display: inline-grid;
  place-items: center;
  width: 1.8rem;
  height: 1.8rem;
  padding: 0;
  border: 1px solid rgba(82, 96, 107, 0.72);
  border-radius: 6px;
  background: rgba(8, 13, 19, 0.72);
  color: #c8d7e2;
  cursor: pointer;
}
.screenshot-order-btn:hover,
.screenshot-order-btn:focus-visible {
  border-color: rgba(56, 189, 248, 0.75);
  background: rgba(29, 155, 240, 0.16);
  color: #d9f0ff;
  outline: none;
}
.screenshot-order-status {
  margin: 0.45rem 0 0;
}
.sr-shots-unified__queue-list.screenshot-order-list {
  --sr-shots-queue-image-height: 11rem;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0.65rem;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 13.35rem;
  padding-bottom: 0.35rem;
  box-sizing: border-box;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: rgba(124, 200, 248, 0.45) rgba(15, 20, 25, 0.35);
}
.sr-shots-unified__queue-list.screenshot-order-list::-webkit-scrollbar {
  height: 7px;
}
.sr-shots-unified__queue-list.screenshot-order-list::-webkit-scrollbar-thumb {
  background: rgba(124, 200, 248, 0.4);
  border-radius: 4px;
}
.sr-shots-unified__queue-list .sr-shots-unified__queue-empty {
  align-self: center;
}
.sr-shots-unified__queue-list .sr-shots-queue-item {
  --graphics-ratio: 0.46;
  position: relative;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  width: clamp(
    6.4rem,
    calc(var(--sr-shots-queue-image-height) * var(--graphics-ratio)),
    min(44vw, 18rem)
  );
  height: auto;
  max-width: none;
  min-height: 0;
  gap: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #15202b;
  scroll-snap-align: start;
  cursor: grab;
  transition:
    transform 180ms cubic-bezier(0.2, 0, 0, 1),
    opacity 140ms ease,
    border-color 140ms ease,
    box-shadow 140ms ease;
  will-change: transform;
}
.sr-shots-unified__queue-list .sr-shots-queue-item.is-dragging {
  opacity: 0.42;
  border-color: rgba(124, 200, 248, 0.72);
  box-shadow: 0 0 0 1px rgba(124, 200, 248, 0.18);
  cursor: grabbing;
}
.sr-shots-unified__queue-list .sr-shots-queue-item.is-dragging.is-drag-current {
  opacity: 0.78;
  border-color: rgba(159, 214, 255, 0.9);
  box-shadow:
    0 0 0 2px rgba(124, 200, 248, 0.22),
    0 12px 28px rgba(29, 155, 240, 0.14);
}
.sr-shots-unified__queue-list.is-drag-previewing .sr-shots-queue-item:not(.is-dragging) {
  transition:
    transform 180ms cubic-bezier(0.2, 0, 0, 1),
    opacity 140ms ease,
    border-color 140ms ease,
    box-shadow 140ms ease;
}
.sr-shots-queue-placeholder {
  position: relative;
  flex: 0 0 auto;
  width: 7.6rem;
  height: 12.75rem;
  max-width: min(30vw, 8.75rem);
  border: 1px dashed rgba(124, 200, 248, 0.78);
  border-radius: 8px;
  background: rgba(29, 155, 240, 0.1);
  box-shadow:
    inset 0 0 0 1px rgba(124, 200, 248, 0.16),
    0 0 0 1px rgba(124, 200, 248, 0.08);
  scroll-snap-align: start;
  transition:
    transform 180ms cubic-bezier(0.2, 0, 0, 1),
    opacity 140ms ease,
    border-color 140ms ease,
    background 140ms ease;
  will-change: transform;
}
.sr-shots-queue-placeholder::before {
  content: "";
  position: absolute;
  inset: 0.55rem;
  border: 1px solid rgba(124, 200, 248, 0.22);
  border-radius: 6px;
  background: rgba(124, 200, 248, 0.055);
}
.sr-shots-unified__queue-list .sr-shots-queue-thumb {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: var(--sr-shots-queue-image-height);
  min-height: var(--sr-shots-queue-image-height);
  border-radius: 0;
  background: #0d1218;
}
.sr-shots-unified__queue-list .sr-shots-queue-thumb a[data-lightbox-trigger] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  aspect-ratio: var(--graphics-ratio);
}
.sr-shots-unified__queue-list .sr-shots-queue-thumb img,
.sr-shots-unified__queue-list .sr-shots-queue-thumb video {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 11rem;
  object-fit: contain;
  background: #0d1218;
}
.sr-shots-unified__queue-list .sr-shots-queue-caption {
  flex-shrink: 0;
  display: block;
  max-width: 100%;
  padding: 0.25rem 0.35rem;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.68rem;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: normal;
}
.sr-shots-unified__queue-list .sr-shots-queue-num {
  position: absolute;
  top: 0.35rem;
  left: 0.35rem;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 2rem;
  height: 1.45rem;
  border: 1px solid rgba(124, 200, 248, 0.38);
  border-radius: 999px;
  background: rgba(8, 13, 19, 0.76);
  color: #9fd6ff;
  font-size: 0.76rem;
  line-height: 1;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
}
.sr-shots-unified__queue-list .sr-shots-queue-remove {
  top: 0.35rem;
  right: 0.35rem;
  width: 1.7rem;
  height: 1.7rem;
  border: 1px solid rgba(254, 202, 202, 0.35);
  background: rgba(8, 13, 19, 0.78);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
}
.screenshot-existing-order-form {
  margin: 0.9rem 0 1rem;
  padding: 0.75rem;
  border: 1px solid rgba(82, 96, 107, 0.62);
  border-radius: 12px;
  background: rgba(8, 13, 19, 0.42);
}
.screenshot-existing-order-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.65rem;
}
.screenshot-existing-order-head h3 {
  margin: 0 0 0.2rem;
  color: #f2f6fb;
  font-size: 0.92rem;
}
.screenshot-existing-order-head p {
  margin: 0;
  color: #8b98a5;
  font-size: 0.78rem;
  line-height: 1.35;
}
.screenshot-existing-order-grid {
  display: grid;
  gap: 0.45rem;
}
.screenshot-existing-order-item {
  display: grid;
  grid-template-columns: 2.1rem 4rem minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.55rem;
  padding: 0.45rem;
  border: 1px solid rgba(70, 84, 98, 0.58);
  border-radius: 9px;
  background: rgba(15, 23, 32, 0.62);
}
.screenshot-existing-order-item.is-dragging {
  opacity: 0.55;
}
.screenshot-existing-order-num {
  color: #9fd6ff;
  font-family: ui-monospace, monospace;
  font-weight: 800;
}
.screenshot-existing-order-frame {
  display: grid;
  place-items: center;
  width: 4rem;
  height: 4rem;
  border-radius: 8px;
  background: #0d1218;
  overflow: hidden;
}
.screenshot-existing-order-frame img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.screenshot-existing-order-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #c8d7e2;
  font-size: 0.78rem;
}
.screenshot-existing-order-actions {
  display: inline-flex;
  gap: 0.25rem;
}
.screenshot-existing-order-queue {
  margin-top: 0.65rem;
}
.screenshot-existing-order-form .screenshot-existing-order-grid.sr-shots-unified__queue-list {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0.65rem;
}
.screenshot-existing-order-form .screenshot-existing-order-item.sr-shots-queue-item {
  display: flex;
  grid-template-columns: none;
  align-items: stretch;
  gap: 0;
  min-height: 0;
  padding: 0;
}
.store-refresh-graphics-preview {
  margin: 0.75rem 0 0;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(70, 84, 98, 0.68);
}
.store-refresh-graphics-preview .step-graphics-grid {
  margin-top: 0.35rem;
}
.step-graphics-grid.store-refresh-screenshots-carousel {
  --store-refresh-screenshots-image-height: 11.5rem;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0.65rem;
  padding-bottom: 0.35rem;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: rgba(124, 200, 248, 0.45) rgba(15, 20, 25, 0.35);
}
.step-graphics-grid.store-refresh-screenshots-carousel::-webkit-scrollbar {
  height: 7px;
}
.step-graphics-grid.store-refresh-screenshots-carousel::-webkit-scrollbar-thumb {
  background: rgba(124, 200, 248, 0.4);
  border-radius: 4px;
}
.step-graphics-grid.store-refresh-screenshots-carousel .step-graphics-item {
  --graphics-ratio: 0.46;
  flex: 0 0 auto;
  width: clamp(
    6.4rem,
    calc(var(--store-refresh-screenshots-image-height) * var(--graphics-ratio)),
    min(44vw, 18rem)
  );
  max-width: none;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
}
.step-graphics-grid.store-refresh-screenshots-carousel .step-graphics-item a,
.step-graphics-grid.store-refresh-screenshots-carousel .step-graphics-item video {
  flex: 0 0 auto;
  min-height: 0;
  width: 100%;
  height: var(--store-refresh-screenshots-image-height);
  aspect-ratio: var(--graphics-ratio);
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0d1218;
}
.step-graphics-grid.store-refresh-screenshots-carousel .step-graphics-item img,
.step-graphics-grid.store-refresh-screenshots-carousel .step-graphics-item video {
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: contain;
}
.step-graphics-grid.store-refresh-screenshots-carousel .step-graphics-caption {
  flex-shrink: 0;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 760px) {
  .store-refresh-product-card {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .store-refresh-product-meta {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
  .store-refresh-tabbar {
    overflow-x: auto;
  }
  .store-refresh-tab {
    flex-basis: 8rem;
  }
  .store-refresh-split-grid {
    grid-template-columns: 1fr;
  }
  .store-refresh-card-grid--metadata,
  .store-refresh-submit-card,
  .store-refresh-toggle-row,
  .store-refresh-mode-grid {
    grid-template-columns: 1fr;
  }
  .store-refresh-upload-grid {
    grid-template-columns: 1fr;
  }
}

.run-list-store-preview {
  flex: 1 0 100%;
  margin: 0.2rem 0 0;
  max-width: 100%;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

#step-progress-root[data-step-progress-state="loading"] .step-msg-scroll {
  border-color: var(--accent);
  opacity: 0.95;
}

.step-msg--loading {
  padding: 0.65rem 0.85rem 0.75rem;
  border-bottom: none;
}

.step-progress-indeterminate {
  height: 5px;
  border-radius: 3px;
  background: #203047;
  overflow: hidden;
  position: relative;
  margin-bottom: 0.45rem;
}

.step-progress-indeterminate::after {
  content: "";
  position: absolute;
  left: -35%;
  top: 0;
  height: 100%;
  width: 38%;
  border-radius: 3px;
  background: linear-gradient(90deg, transparent, var(--accent), transparent);
  animation: step-progress-slide 1.15s ease-in-out infinite;
}

@keyframes step-progress-slide {
  0% {
    left: -38%;
  }
  100% {
    left: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .step-progress-indeterminate::after {
    animation: none;
    left: 0;
    width: 100%;
    background: var(--accent);
    opacity: 0.35;
  }
}

.step-progress-loading-label {
  display: block;
  font-size: 0.82rem;
  color: var(--muted);
}

/* Прогресс-бар «n из N готово» для шага иконки и AI-скриншотов. */
.step-progress-bar {
  margin: 0.5rem 0 0.75rem;
  display: block;
}

.step-progress-bar__label {
  font-size: 0.82rem;
  color: var(--muted);
  margin-bottom: 0.3rem;
}

.step-progress-bar__track {
  height: 6px;
  border-radius: 3px;
  background: #203047;
  overflow: hidden;
  position: relative;
}

.step-progress-bar__fill {
  height: 100%;
  background: var(--accent);
  border-radius: 3px;
  transition: width 0.3s ease-out;
  width: 0;
}

/* CI wait: GitLab + Codemagic weighted progress */
.step-ci-phase-progress {
  margin: 0 0 1rem;
  padding: 1rem;
  background: #111a24;
  border: 1px solid var(--border);
  border-radius: 8px;
}
.step-ci-phase-progress__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.75rem;
}
.step-ci-phase-progress__title {
  margin: 0 0 0.35rem;
  font-size: 1rem;
}
.step-ci-phase-progress__hint {
  margin: 0 0 0.65rem !important;
}
.step-ci-phase-progress__total {
  margin-bottom: 0.85rem;
}
.step-ci-phase-progress__total-track {
  height: 10px;
  border-radius: 5px;
  background: #203047;
  overflow: hidden;
}
.step-ci-phase-progress__total-fill {
  height: 100%;
  background: linear-gradient(90deg, #3d8bfd, var(--accent));
  border-radius: 5px;
  transition: width 0.35s ease-out;
}
.step-ci-phase-progress__total-label {
  font-size: 0.82rem;
  color: var(--muted);
  margin-top: 0.35rem;
}
.step-ci-phase-progress__track {
  margin-bottom: 0.75rem;
  padding: 0.75rem;
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
}
.step-ci-phase-progress__track:last-child {
  margin-bottom: 0;
}
.step-ci-phase-progress__track-head {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  font-size: 0.84rem;
  margin-bottom: 0.25rem;
}
.step-ci-phase-progress__track-title {
  font-weight: 600;
}
.step-ci-phase-progress__track-meta {
  color: var(--muted);
  font-size: 0.78rem;
}
.step-ci-phase-progress__track-bar {
  height: 5px;
  border-radius: 3px;
  background: #203047;
  overflow: hidden;
  margin-bottom: 0.35rem;
}
.step-ci-phase-progress__track-fill {
  height: 100%;
  background: rgba(61, 139, 253, 0.85);
  transition: width 0.3s ease-out;
}
.step-ci-phase-progress__subs {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 0.78rem;
}
.step-ci-phase-progress__sub {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.2rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.step-ci-phase-progress__sub:last-child {
  border-bottom: none;
}
.step-ci-sub--pending .step-ci-phase-progress__sub-state {
  color: var(--muted);
}
.step-ci-sub--running .step-ci-phase-progress__sub-state {
  color: #ffc107;
}
.step-ci-sub--success .step-ci-phase-progress__sub-state {
  color: #6bcf7f;
}
.step-ci-sub--warning .step-ci-phase-progress__sub-state {
  color: #ffc978;
}
.step-ci-sub--failed .step-ci-phase-progress__sub-state {
  color: #f87171;
}
.step-ci-sub--skipped .step-ci-phase-progress__sub-state {
  color: #94a3b8;
}

.step-msg-scroll {
  background: #15202b;
  border: 1px solid var(--border);
  border-radius: 6px;
  margin-bottom: 1rem;
}
.step-msg-list.step-msg-scroll-inner {
  list-style: none;
  padding: 0;
  margin: 0;
  max-height: min(28rem, 72vh);
  overflow-y: auto;
  overflow-x: hidden;
  scroll-behavior: smooth;
  overscroll-behavior: contain;
}
.step-msg {
  padding: 0.45rem 0.85rem;
  border-bottom: 1px solid var(--border);
  font-size: 0.875rem;
  line-height: 1.45;
}
.step-msg--with-time {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 0.65rem;
  align-items: start;
}
.step-msg--time-suppressed {
  padding-left: calc(0.85rem + 4.25rem);
}
.step-msg-time {
  margin-top: 0.08rem;
  color: var(--muted);
  opacity: 0.78;
  font-size: 0.68rem;
  line-height: 1.35;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.step-msg--phase {
  color: var(--muted);
  background: rgba(255, 255, 255, 0.025);
}
.step-msg--result {
  background: rgba(158, 202, 255, 0.035);
}
.step-msg--thought {
  color: var(--muted);
  background: rgba(255, 255, 255, 0.018);
}
.step-msg--tool {
  background: rgba(134, 239, 172, 0.026);
}
.step-msg--queue {
  color: #fbbf24;
  background: rgba(245, 181, 0, 0.08);
  box-shadow: inset 3px 0 0 rgba(245, 181, 0, 0.55);
}
.step-msg:last-child {
  border-bottom: none;
}
.step-msg-md {
  min-height: 0;
  min-width: 0;
}
.step-msg-md p {
  margin: 0 0 0.5rem;
}
.step-msg-md p:last-child {
  margin-bottom: 0;
}
.step-msg-md pre,
.step-md-block pre {
  margin: 0.5rem 0;
  padding: 0.65rem 0.75rem;
  background: #0d1218;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow-x: auto;
  font-size: 0.82rem;
  line-height: 1.35;
}
.step-msg-md code {
  font-family: ui-monospace, monospace;
  font-size: 0.88em;
  padding: 0.12rem 0.28rem;
  background: #0d1218;
  border-radius: 4px;
}
.step-msg-md pre code {
  padding: 0;
  background: none;
}
.step-tool-fold {
  margin: 0.45rem 0 0.15rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: rgba(13, 18, 24, 0.72);
}
.step-tool-fold summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 2.1rem;
  padding: 0.42rem 0.65rem;
  cursor: pointer;
  color: var(--text);
  font-weight: 600;
}
.step-tool-fold summary::marker {
  color: var(--muted);
}
.step-tool-fold summary small {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 500;
  white-space: nowrap;
}
.step-tool-fold pre {
  margin: 0;
  border-width: 1px 0 0;
  border-radius: 0 0 6px 6px;
  max-height: min(52vh, 34rem);
}
.step-msg-md ul,
.step-msg-md ol,
.step-md-block ul,
.step-md-block ol {
  margin: 0.35rem 0 0.5rem;
  padding-left: 1.35rem;
}
.step-msg-md li,
.step-md-block li {
  margin: 0.2rem 0;
}
.step-md-empty {
  color: var(--muted);
  font-style: italic;
  margin: 0;
}
.step-md-fallback {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
}
.step-md-block {
  padding: 0.75rem 1rem;
  background: #15202b;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 0.9rem;
  line-height: 1.5;
}
.step-md-block h1,
.step-md-block h2,
.step-md-block h3 {
  font-size: 1rem;
  margin: 0.75rem 0 0.4rem;
}
.step-md-block h1:first-child,
.step-md-block h2:first-child,
.step-md-block h3:first-child {
  margin-top: 0;
}
.step-fold {
  margin: 1rem 0 1.25rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #121820;
}
.step-fold-summary {
  cursor: pointer;
  font-weight: 600;
  padding: 0.65rem 1rem;
  list-style: none;
  user-select: none;
}
.step-fold-summary::-webkit-details-marker {
  display: none;
}
.step-fold-summary::before {
  content: "▸ ";
  opacity: 0.7;
}
.step-fold[open] .step-fold-summary::before {
  content: "▾ ";
}
.step-fold--prompt .step-md-block {
  margin: 0 1rem 1rem;
  border-radius: 6px;
}
.step-fold--edit .form-step-edit {
  padding: 0 1rem 1rem;
}
.step-fold-summary__hint {
  margin-left: 0.45rem;
  font-weight: 500;
  font-size: 0.78rem;
  color: var(--muted);
}
.step-fold__lead {
  margin: 0 1rem 0.75rem;
}
.step-fold__body {
  margin: 0;
  border: none;
  box-shadow: none;
}
.step-fold--agent-stream .step-msg-scroll,
.step-fold--response .step-md-block--response {
  margin: 0 1rem 1rem;
}
.step-fold--additional .step-additional-mount {
  padding: 0 0.65rem 0.85rem;
}
.step-fold--additional .step-fold {
  margin: 0.65rem 0;
}
.step-fold--additional > .step-fold-summary {
  font-size: 0.95rem;
}
.form-step-edit label {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.9rem;
}
.form-step-edit .step-edit-textarea {
  width: 100%;
  max-width: 40rem;
  min-height: 7rem;
  padding: 0.5rem 0.6rem;
  background: #15202b;
  border: 1px solid var(--border);
  color: var(--fg);
  border-radius: 4px;
  font-family: ui-monospace, monospace;
  resize: vertical;
}
.step-edit-attachments {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px dashed rgba(122, 138, 156, 0.75);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(16, 23, 32, 0.95), rgba(12, 18, 26, 0.85));
  transition:
    border-color 0.15s ease,
    background-color 0.15s ease,
    box-shadow 0.15s ease;
}
.step-edit-attachments.is-drag-over {
  border-color: rgba(89, 154, 255, 0.95);
  box-shadow: 0 0 0 2px rgba(89, 154, 255, 0.12) inset;
  background: linear-gradient(180deg, rgba(18, 28, 40, 0.98), rgba(12, 18, 26, 0.9));
}
.step-edit-attachments__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.step-edit-attachments__copy {
  max-width: 42rem;
}
.step-edit-attachments__copy strong {
  display: block;
  margin-bottom: 0.25rem;
}
.step-edit-attachments__hint {
  margin: 0;
}
.step-edit-attachments__actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.step-edit-attachments__pick {
  white-space: nowrap;
}
.step-edit-attachment-list {
  list-style: none;
  margin: 0.85rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: 0.75rem;
}
.step-edit-attachment-empty {
  margin: 0;
  padding: 0.85rem 0.95rem;
  border-radius: 10px;
  border: 1px solid rgba(122, 138, 156, 0.45);
  color: rgba(215, 226, 235, 0.78);
  background: rgba(10, 15, 22, 0.45);
}
.step-edit-attachment-item {
  border: 1px solid rgba(122, 138, 156, 0.55);
  border-radius: 10px;
  overflow: hidden;
  background: rgba(13, 19, 27, 0.96);
}
.step-edit-attachment-thumb {
  aspect-ratio: 4 / 3;
  background: #0b1118;
  border-bottom: 1px solid rgba(122, 138, 156, 0.42);
}
.step-edit-attachment-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.step-edit-attachment-meta {
  padding: 0.6rem 0.7rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}
.step-edit-attachment-name {
  font-size: 0.82rem;
  line-height: 1.35;
  word-break: break-word;
}
.step-edit-attachment-size {
  font-size: 0.75rem;
  color: rgba(215, 226, 235, 0.76);
}
.step-edit-attachment-remove {
  align-self: flex-start;
}
.step-flash-ok {
  color: #00ba7c;
}
.step-md-block--response {
  max-height: min(36rem, 80vh);
  overflow: auto;
}

.step-docs-hint {
  margin-bottom: 0.75rem;
}

.step-doc-links-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: 1rem;
  margin-top: 0.5rem;
}

.step-doc-links-grid--reference {
  margin-top: 0.35rem;
}

.step-doc-card {
  border: 1px solid rgba(82, 100, 118, 0.75);
  border-radius: 12px;
  padding: 1rem 1.1rem;
  background: rgba(12, 18, 26, 0.88);
}

.step-doc-card--pending {
  border-style: dashed;
  background: rgba(15, 22, 30, 0.55);
}

.step-doc-card__title {
  margin: 0 0 0.45rem;
  font-size: 1rem;
  font-weight: 650;
}

.step-doc-card__path {
  margin: 0 0 0.6rem;
  font-size: 0.8rem;
  color: var(--muted);
}

.step-doc-card__placeholder {
  margin: 0;
  font-size: 0.88rem;
  color: #9aa8b3;
  line-height: 1.45;
}

.step-doc-card__link {
  margin-top: 0.2rem;
}

.step-url-patch-panel {
  margin-bottom: 1.25rem;
  padding: 1rem 1.15rem;
  border: 1px solid rgba(29, 155, 240, 0.32);
  border-radius: 14px;
  background: rgba(12, 28, 45, 0.4);
}

.step-detail-surface--nested {
  margin-bottom: 0;
}

.step-graphics-mount {
  margin-top: 0.35rem;
}

.run-graphics-version-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.run-graphics-version {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: rgba(15, 23, 34, 0.58);
  overflow: hidden;
}

.run-graphics-version[open] {
  padding-bottom: 0.85rem;
}

.run-graphics-version-summary {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.8rem 0.95rem;
  cursor: pointer;
  list-style: none;
}

.run-graphics-version-summary::-webkit-details-marker {
  display: none;
}

.run-graphics-version-summary::before {
  content: "▸";
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 0.82rem;
}

.run-graphics-version[open] > .run-graphics-version-summary::before {
  content: "▾";
}

.run-graphics-version-title {
  min-width: 0;
  flex: 1 1 auto;
  font-weight: 650;
  color: var(--fg);
}

.run-graphics-version-badge,
.run-graphics-version-count {
  flex: 0 0 auto;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 999px;
  padding: 0.12rem 0.5rem;
  font-size: 0.72rem;
  color: var(--muted);
}

.run-graphics-version--current .run-graphics-version-badge {
  border-color: rgba(88, 166, 255, 0.42);
  color: #9dccff;
}

.run-graphics-version-description {
  margin: -0.2rem 0.95rem 0.75rem !important;
}

.run-graphics-version .run-graphics-grid {
  --run-graphics-image-height: 8rem;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0.55rem;
  margin: 0 0.95rem;
  padding-bottom: 0.35rem;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: rgba(124, 200, 248, 0.45) rgba(15, 20, 25, 0.35);
}

.run-graphics-version .run-graphics-grid::-webkit-scrollbar {
  height: 7px;
}

.run-graphics-version .run-graphics-grid::-webkit-scrollbar-thumb {
  background: rgba(124, 200, 248, 0.4);
  border-radius: 4px;
}

.run-graphics-version .run-graphics-grid .step-graphics-item {
  --graphics-ratio: 0.46;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  width: clamp(
    4.8rem,
    calc(var(--run-graphics-image-height) * var(--graphics-ratio)),
    min(28vw, 12rem)
  );
  max-width: none;
  scroll-snap-align: start;
}

.run-graphics-version .run-graphics-grid .step-graphics-item a,
.run-graphics-version .run-graphics-grid .step-graphics-item video {
  flex: 0 0 auto;
  width: 100%;
  height: var(--run-graphics-image-height);
  min-height: var(--run-graphics-image-height);
  aspect-ratio: var(--graphics-ratio);
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0d1218;
}

.run-graphics-version .run-graphics-grid .step-graphics-item img,
.run-graphics-version .run-graphics-grid .step-graphics-item video {
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: contain;
}

.run-graphics-version .run-graphics-grid .step-graphics-caption {
  flex-shrink: 0;
  max-width: 100%;
  padding: 0.22rem 0.34rem;
  overflow: hidden;
  font-size: 0.66rem;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.step-graphics-icon-hero {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  padding: 0;
  border: 0;
  background: transparent;
  margin-bottom: 0;
}

.step-graphics-icon-hero .step-graphics-item {
  max-width: 15rem;
  flex: 1 1 10rem;
}

.step-graphics-subblock {
  margin-top: 0.25rem;
}

.step-graphics-subhead {
  margin: 0 0 0.5rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--fg);
}

.step-graphics-subhint {
  margin: 0;
  text-align: center;
  width: 100%;
}

.step-graphics-grid--secondary .step-graphics-item img {
  max-height: 12rem;
  object-fit: contain;
}

.step-graphics-split {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.step-graphics-panel {
  border-radius: 12px;
  padding: 0.85rem 1rem 1rem;
  border: 1px solid var(--border);
}

.step-graphics-panel--marketing {
  background: rgba(14, 38, 30, 0.4);
  border-color: rgba(70, 150, 110, 0.38);
}

.step-graphics-panel--archive {
  background: rgba(38, 30, 22, 0.55);
  border-color: rgba(140, 100, 65, 0.42);
}

.step-graphics-archive-fold {
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.step-graphics-archive-fold__body {
  padding: 0 1rem 1rem;
}

.step-screenshot-order-groups .screenshot-existing-order-form:first-child {
  margin-top: 0;
}

.screenshot-existing-order-form--empty {
  border-style: dashed;
}

.step-graphics-panel-hint {
  margin: 0 0 0.75rem !important;
  font-size: 0.86rem !important;
}

.step-graphics-grid--archived .step-graphics-item {
  opacity: 0.72;
  filter: grayscale(0.3);
  position: relative;
}

.step-graphics-grid--archived .step-graphics-item::after {
  content: "архив";
  position: absolute;
  top: 0.35rem;
  right: 0.35rem;
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  padding: 0.12rem 0.38rem;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.58);
  color: #c8c8c8;
}

.step-graphics-item--screenshot_raw img {
  opacity: 0.88;
}

.step-doc-links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.step-doc-links li {
  margin: 0.4rem 0;
}
.step-doc-links a {
  font-weight: 500;
}

.step-graphics-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
  align-items: start;
  gap: 1rem 1rem;
  margin-top: 0.75rem;
}
.step-graphics-item {
  --graphics-ratio: 0.5625;
  margin: 0;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  background: #15202b;
}
.step-graphics-item img,
.step-graphics-item video {
  display: block;
  width: 100%;
  height: auto;
  max-height: 14rem;
  object-fit: contain;
  background: #0d1218;
}
.step-graphics-item a {
  display: block;
}
.step-graphics-item[style*="--graphics-ratio"] a[data-lightbox-trigger] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: var(--graphics-ratio);
  background: #0d1218;
}
.step-graphics-item[style*="--graphics-ratio"] img {
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: contain;
}
.step-graphics-grid:not(.store-refresh-screenshots-carousel):not(.portfolio-board-screenshots-carousel):not(.run-graphics-grid) .step-graphics-item--portrait {
  justify-self: start;
  width: 100%;
  max-width: 10rem;
}
.step-graphics-grid:not(.store-refresh-screenshots-carousel):not(.portfolio-board-screenshots-carousel):not(.run-graphics-grid) .step-graphics-item--square {
  justify-self: start;
  width: 100%;
  max-width: 11rem;
}
.step-graphics-grid:not(.store-refresh-screenshots-carousel):not(.portfolio-board-screenshots-carousel):not(.run-graphics-grid) .step-graphics-item--landscape {
  grid-column: span 2;
}
@media (max-width: 760px) {
  .sr-shots-modal__asset--landscape,
  .step-graphics-grid:not(.store-refresh-screenshots-carousel):not(.portfolio-board-screenshots-carousel):not(.run-graphics-grid) .step-graphics-item--landscape {
    grid-column: span 1;
  }
}
.step-graphics-caption {
  font-size: 0.72rem;
  color: var(--muted);
  padding: 0.35rem 0.45rem;
  word-break: break-all;
  line-height: 1.3;
}
.step-graphics-item a[data-lightbox-trigger] {
  cursor: zoom-in;
}

/* Встроенный просмотрщик графики (lightbox с prev/next и клавиатурой) */
.step-lightbox-overlay {
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
}
.step-lightbox-overlay[hidden] { display: none !important; }
.step-lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 11, 16, 0.92);
  backdrop-filter: blur(2px);
}
.step-lightbox-figure {
  position: relative;
  z-index: 1;
  margin: 0;
  max-width: min(92vw, 1100px);
  max-height: 92vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}
.step-lightbox-img {
  display: block;
  max-width: 100%;
  max-height: calc(92vh - 3rem);
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.6);
  background: #0d1218;
}
.step-lightbox-caption {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.85rem;
  color: var(--fg);
  background: rgba(0, 0, 0, 0.55);
  padding: 0.4rem 0.7rem;
  border-radius: 999px;
  max-width: 100%;
}
.step-lightbox-counter {
  font-variant-numeric: tabular-nums;
  color: var(--muted);
  font-size: 0.78rem;
  white-space: nowrap;
}
.step-lightbox-label {
  word-break: break-all;
  line-height: 1.25;
}
.step-lightbox-close,
.step-lightbox-nav {
  position: absolute;
  z-index: 2;
  background: rgba(20, 25, 32, 0.7);
  color: var(--fg);
  border: 1px solid var(--border);
  border-radius: 999px;
  cursor: pointer;
  font-size: 1.5rem;
  line-height: 1;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.12s ease, transform 0.12s ease;
}
.step-lightbox-close:hover,
.step-lightbox-nav:hover {
  background: rgba(40, 50, 60, 0.9);
}
.step-lightbox-close:focus-visible,
.step-lightbox-nav:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.step-lightbox-close {
  top: 1rem;
  right: 1rem;
  width: 2.4rem;
  height: 2.4rem;
  font-size: 1.7rem;
}
.step-lightbox-nav {
  top: 50%;
  transform: translateY(-50%);
  width: 3rem;
  height: 3rem;
}
.step-lightbox-nav--prev { left: 1rem; }
.step-lightbox-nav--next { right: 1rem; }
@media (max-width: 640px) {
  .step-lightbox-overlay { padding: 0.5rem; }
  .step-lightbox-nav {
    width: 2.4rem;
    height: 2.4rem;
    font-size: 1.3rem;
  }
  .step-lightbox-nav--prev { left: 0.4rem; }
  .step-lightbox-nav--next { right: 0.4rem; }
  .step-lightbox-close {
    top: 0.4rem;
    right: 0.4rem;
    width: 2rem;
    height: 2rem;
  }
}
body.body-lightbox-open {
  overflow: hidden;
}
.inline-pre {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, monospace;
}

.run-assets-links {
  margin: 0;
  padding-left: 1.25rem;
}

.run-list-item--highlight {
  background: rgba(29, 155, 240, 0.1);
  border-radius: 6px;
  padding-left: 0.5rem !important;
  margin-left: -0.5rem;
  border-bottom-color: transparent !important;
}

/* Подсветка только что созданного запуска в таблице /apps и /accounts/{id}/runs
   (см. ?highlight=<run_id>). Используем мягкий синий фон на всю строку и лёгкий
   левый бордер-акцент, чтобы не перекрасить колонки. */
.apps-row--highlight > td {
  background: rgba(29, 155, 240, 0.10);
}
.apps-row--highlight > td:first-child {
  box-shadow: inset 3px 0 0 0 rgb(29, 155, 240);
}
.apps-row--flash > td,
.apple-row--flash > td {
  animation: factory-row-highlight-flash 0.82s ease-in-out 4;
}
@keyframes factory-row-highlight-flash {
  0%,
  100% {
    background-color: rgba(29, 155, 240, 0.10);
  }
  50% {
    background-color: rgba(29, 155, 240, 0.28);
  }
}

.form-run-execute-all {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.75rem;
  margin: 1rem 0 1.25rem;
}

.steps-phases .step-row {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.65rem;
  padding: 0.75rem;
  border: 1px solid rgba(82, 100, 118, 0.65);
  border-radius: 14px;
  background: #111a24;
}
.steps-phases .step-row:last-child {
  margin-bottom: 0;
}
.steps-phases .step-row--completed {
  border-color: rgba(126, 228, 161, 0.22);
}
.steps-phases .step-row--running {
  border-color: rgba(143, 193, 255, 0.42);
  background: linear-gradient(90deg, rgba(29, 155, 240, 0.12), #111a24 38%);
}
.steps-phases .step-row--failed {
  border-color: rgba(255, 155, 155, 0.34);
}
.steps-phases .step-row--warning {
  border-color: rgba(255, 201, 120, 0.32);
}
.steps-phases .step-row--webview {
  border-color: rgba(168, 85, 247, 0.34);
  background:
    linear-gradient(90deg, rgba(168, 85, 247, 0.14), #111a24 42%);
}
.step-row-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  background: #1a2733;
  color: #b6c2cc;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.step-row-number--webview {
  background: #231634;
  color: #f4e8ff;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
}
.step-row-main {
  min-width: 0;
}
.steps-phases .step-phase-title {
  display: inline-block;
  font-weight: 600;
  line-height: 1.25;
}
.steps-phases a.step-phase-title--link {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
.steps-phases a.step-phase-title--link:hover {
  border-bottom-color: var(--accent);
}
.step-row-error {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.86rem;
  line-height: 1.35;
}
.step-row-error--warning {
  color: var(--warn);
}
.step-row-meta {
  display: block;
  margin-top: 0.25rem;
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.35;
}
.step-row-meta code {
  max-width: min(100%, 48rem);
  display: inline-block;
  overflow: hidden;
  vertical-align: bottom;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.steps-phases .step-actions {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  justify-content: flex-end;
}
@media (max-width: 760px) {
  .steps-phases .step-row {
    grid-template-columns: 2.25rem minmax(0, 1fr);
  }

  .steps-phases .step-row > .pill,
  .steps-phases .step-actions {
    grid-column: 2;
    justify-content: flex-start;
  }
}

.steps a.btn {
  margin-right: 0.35rem;
}

.field-email-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.5rem 0.75rem;
  margin-bottom: 1rem;
}
.field-email-row .field-pair {
  flex: 1 1 220px;
  min-width: min(100%, 220px);
}
.btn-email-chain {
  flex: 0 0 auto;
  align-self: center;
  margin-top: 1.45rem;
  padding: 0.15rem 0.3rem;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  line-height: 0;
  opacity: 0.55;
  transition: opacity 0.15s ease, color 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}
.btn-email-chain:hover,
.btn-email-chain:focus-visible {
  opacity: 1;
  color: var(--fg);
  background: rgba(26, 39, 51, 0.55);
  border-color: var(--border);
  outline: none;
}
.btn-email-chain[aria-pressed="false"] {
  opacity: 0.45;
}
.btn-email-chain svg {
  display: block;
}
.field-email-row:not(.is-unlinked) .icon-chain-broken {
  display: none;
}
.field-email-row.is-unlinked .icon-chain {
  display: none;
}
.field-email-row.is-unlinked .icon-chain-broken {
  display: block;
}

.gen-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.gen-live-log {
  margin-bottom: 1rem;
  max-height: 14rem;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 0.82rem;
  line-height: 1.35;
  background: #0d1218;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.6rem 0.75rem;
  color: var(--muted);
}

.gen-details {
  margin-bottom: 1rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.5rem 0.75rem;
  background: #15202b;
}
.gen-details summary { cursor: pointer; font-weight: 600; }
.gen-details .yaml { margin-top: 0.5rem; }

/* Step 2 idea-mode tabs (Поля-подсказки / Свой промпт). */
.idea-mode-tabs {
  display: flex;
  gap: 0.25rem;
  margin: 0.5rem 0 1rem;
  border-bottom: 1px solid var(--border);
}
.idea-mode-tab {
  appearance: none;
  background: transparent;
  border: 1px solid transparent;
  border-bottom: none;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  padding: 0.5rem 0.95rem;
  font: inherit;
  color: var(--muted);
  cursor: pointer;
  margin-bottom: -1px;
  transition: background 120ms ease, color 120ms ease, border-color 120ms ease;
}
.idea-mode-tab:hover {
  color: var(--fg);
  background: rgba(255, 255, 255, 0.04);
}
.idea-mode-tab:focus-visible {
  outline: 2px solid var(--accent, #4c6ef5);
  outline-offset: 2px;
}
.idea-mode-tab--active {
  color: var(--fg);
  background: var(--bg, #15202b);
  border-color: var(--border);
  border-bottom: 1px solid var(--bg, #15202b);
  font-weight: 600;
}
.idea-mode-pane {
  margin-bottom: 0.5rem;
}
.idea-mode-pane--hidden {
  display: none !important;
}
.store-refresh-scope-tabs {
  margin: 1rem 0 0.85rem;
}
#field-user-full-prompt {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.92rem;
  line-height: 1.45;
}
#user-full-prompt-counter.error {
  color: var(--danger, #c75252);
}

.ssh-guide-body {
  margin-top: 0.75rem;
  font-size: 0.92rem;
  color: var(--fg);
}
.ssh-guide-short p {
  margin: 0.55rem 0;
  line-height: 1.45;
}
.ssh-guide-short p:first-child {
  margin-top: 0;
}
.ssh-guide-code {
  margin: 0.4rem 0;
  padding: 0.65rem 0.85rem;
  background: #0d1218;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow-x: auto;
  font-size: 0.82rem;
  line-height: 1.35;
}
.ssh-guide-code code {
  font-family: ui-monospace, monospace;
  font-size: inherit;
}
.ssh-guide-body code {
  font-family: ui-monospace, monospace;
  font-size: 0.88em;
  padding: 0.1rem 0.25rem;
  background: #15202b;
  border-radius: 4px;
}
.field-ssh-codemagic .gen-details {
  margin-top: 0.75rem;
}
.field-ssh-codemagic .ssh-guide-block {
  margin-bottom: 1rem;
}

.gen-toolbar .btn-secondary {
  margin-top: 0;
}

.run-create-overlay,
.factory-busy-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(15, 20, 25, 0.85);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.run-create-overlay[hidden] {
  display: none !important;
}
.run-create-overlay-inner {
  background: #15202b;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1.5rem 2rem;
  max-width: 22rem;
  text-align: center;
}
.run-create-overlay-title {
  font-weight: 600;
  margin: 0 0 0.35rem 0;
}
.factory-busy-spinner {
  width: 2.25rem;
  height: 2.25rem;
  margin: 0.75rem auto;
  border: 3px solid rgba(255, 255, 255, 0.15);
  border-top-color: var(--accent, #1d9bf0);
  border-radius: 50%;
  animation: factory-busy-spin 0.75s linear infinite;
}
@keyframes factory-busy-spin {
  to {
    transform: rotate(360deg);
  }
}
.factory-busy-hint {
  margin: 0.5rem 0 0 0;
  max-width: 22rem;
}

/* Шаг «Пуш и статус GitLab / Codemagic» — кнопки обновления JSON */
.step-ci-refresh {
  margin: 1.5rem 0;
  padding: 1rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #101820;
}
.step-ci-refresh h2 {
  font-size: 1.1rem;
  margin: 0 0 0.35rem 0;
}
.step-ci-refresh-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0.75rem 0 1rem;
}
.step-ci-retry-hint {
  margin: -0.35rem 0 1rem;
  font-size: 0.88rem;
}
.step-ci-refresh-panels {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}
@media (min-width: 720px) {
  .step-ci-refresh-panels {
    grid-template-columns: 1fr 1fr;
  }
}
.step-ci-refresh-h3 {
  font-size: 0.95rem;
  font-weight: 600;
  margin: 0 0 0.35rem 0;
  color: var(--muted);
}
.step-ci-json {
  margin: 0;
  padding: 0.75rem;
  max-height: 22rem;
  overflow: auto;
  font-size: 0.78rem;
  line-height: 1.4;
  background: #15202b;
  border: 1px solid var(--border);
  border-radius: 8px;
  white-space: pre-wrap;
  word-break: break-word;
}

.ci-refresh-panel {
  min-height: 2rem;
}
.ci-status-wrap {
  display: grid;
  gap: 0.85rem;
}
.ci-empty-card {
  padding: 0.85rem;
  border: 1px solid rgba(248, 113, 113, 0.35);
  border-radius: 8px;
  background: rgba(248, 113, 113, 0.08);
}
.ci-empty-card strong {
  display: block;
  margin-bottom: 0.25rem;
}
.ci-empty-card p {
  margin: 0.2rem 0 0;
}
.ci-summary-card {
  padding: 0.85rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #15202b;
}
.ci-summary-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}
.ci-service-label {
  font-size: 0.92rem;
  font-weight: 700;
}
.ci-summary-card__actions {
  margin: 0.75rem 0 0;
}
.ci-meta-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem 0.9rem;
  margin: 0;
}
@media (max-width: 520px) {
  .ci-meta-grid {
    grid-template-columns: 1fr;
  }
}
.ci-meta-grid div {
  min-width: 0;
}
.ci-meta-grid dt {
  margin: 0 0 0.18rem;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 600;
  text-transform: uppercase;
}
.ci-meta-grid dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
}
.ci-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.55rem;
  padding: 0.12rem 0.5rem;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}
.ci-status-pill--success {
  background: rgba(47, 171, 106, 0.18);
  color: #8fd9a8;
}
.ci-status-pill--failed,
.ci-status-pill--cancelled {
  background: rgba(248, 113, 113, 0.16);
  color: #f0a8a8;
}
.ci-status-pill--running {
  background: rgba(61, 139, 253, 0.16);
  color: #9ec5ff;
}
.ci-status-pill--pending,
.ci-status-pill--warning {
  background: rgba(231, 174, 74, 0.16);
  color: #e7c98a;
}
.ci-status-pill--skipped,
.ci-status-pill--unknown {
  background: rgba(148, 163, 184, 0.14);
  color: #c6d0db;
}
.ci-gitlab-wrap,
.ci-cm-wrap {
  font-size: 0.9rem;
}
.ci-pipeline-dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.25rem 1rem;
  margin: 0 0 0.75rem 0;
  align-items: baseline;
}
.ci-pipeline-dl dt {
  margin: 0;
  color: var(--muted);
  font-weight: 500;
}
.ci-pipeline-dl dd {
  margin: 0;
  word-break: break-word;
}
.ci-subh {
  font-size: 0.95rem;
  font-weight: 600;
  margin: 0.75rem 0 0.35rem 0;
}
.ci-job-list {
  display: grid;
  gap: 0.45rem;
}
.ci-job-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.65rem;
  align-items: center;
  padding: 0.6rem 0.65rem;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.025);
}
@media (max-width: 520px) {
  .ci-job-card {
    grid-template-columns: 1fr;
  }
}
.ci-job-card__main {
  min-width: 0;
}
.ci-job-card__main strong {
  display: block;
  overflow-wrap: anywhere;
}
.ci-job-card__stage,
.ci-job-card__time,
.ci-cm-step-time {
  color: var(--muted);
  font-size: 0.78rem;
}
.ci-job-card__side {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.45rem;
  flex-wrap: wrap;
}
.step-ci-log {
  margin: 0;
  padding: 0.75rem;
  max-height: min(70vh, 28rem);
  overflow: auto;
  font-size: 0.75rem;
  line-height: 1.35;
  background: #0a0e12;
  border: 1px solid var(--border);
  border-radius: 8px;
  white-space: pre-wrap;
  word-break: break-word;
}
.ci-warn {
  color: #e7ae4a;
}
.ci-json-details {
  margin-top: 0.75rem;
}
.ci-json-details summary,
.ci-log-details summary {
  cursor: pointer;
  color: var(--accent);
  font-size: 0.9rem;
}
.ci-log-details {
  margin-top: 0.85rem;
}
.ci-updated-at {
  margin: 0.35rem 0 0;
  font-size: 0.78rem;
}
.step-ci-json-inner {
  margin: 0.5rem 0 0 0;
  padding: 0.75rem;
  max-height: 16rem;
  overflow: auto;
  font-size: 0.72rem;
  background: #15202b;
  border: 1px solid var(--border);
  border-radius: 8px;
  white-space: pre-wrap;
  word-break: break-word;
}
.ci-cm-source {
  margin: 0 0 0.5rem 0;
}

.step-icon-upload {
  margin: 1.5rem 0;
  padding: 1rem;
  border: 1px solid rgba(82, 100, 118, 0.72);
  border-radius: 14px;
  background: #111a24;
}
.step-icon-upload h2 {
  margin-top: 0;
}
.form-icon-upload .btn {
  min-height: 44px;
}

/* Step 4: compact screenshot generation and manual upload workspace. */
.step-screenshots-ai-settings {
  display: grid;
  gap: 1rem;
}

.step-screenshots-ai-settings > .step-detail-surface__header {
  margin-bottom: 0;
}

.screenshots-ai-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: end;
  padding: 1rem;
  border: 1px solid rgba(82, 100, 118, 0.68);
  border-radius: 14px;
  background: rgba(17, 26, 36, 0.72);
}

.screenshots-ai-toolbar__fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(12rem, 1fr));
  gap: 0.9rem;
  min-width: 0;
  max-width: 40rem;
}

.form .screenshots-ai-field {
  margin: 0;
  color: #c8d2dc;
  font-size: 0.86rem;
  font-weight: 650;
}

.form .screenshots-ai-field select {
  width: 100%;
  max-width: none;
  min-height: 2.8rem;
  margin-top: 0.4rem;
  padding: 0.55rem 0.75rem;
  border-radius: 10px;
}

.screenshots-ai-toolbar__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.65rem;
}

.form .screenshots-ai-toolbar__actions .btn {
  min-height: 2.8rem;
  margin: 0;
  padding: 0.58rem 1rem;
  white-space: nowrap;
}

.screenshots-upload-section {
  min-width: 0;
}

.screenshots-upload-section__header {
  margin: 0;
  padding: 0.25rem 0 0.7rem;
}

.screenshots-upload-section__header h3 {
  margin: 0;
  color: var(--fg);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.screenshots-upload-section__header p {
  margin: 0.18rem 0 0;
  color: var(--muted);
  font-size: 0.82rem;
}

.screenshots-upload-list {
  overflow: hidden;
  border-top: 1px solid rgba(82, 100, 118, 0.52);
  border-bottom: 1px solid rgba(82, 100, 118, 0.52);
}

.screenshots-upload-row {
  display: grid;
  grid-template-columns: minmax(9rem, 0.42fr) minmax(18rem, 1.35fr) auto;
  gap: 1rem;
  align-items: center;
  min-width: 0;
  padding: 1rem 0;
}

.screenshots-upload-row + .screenshots-upload-row {
  border-top: 1px solid rgba(82, 100, 118, 0.52);
}

.screenshots-upload-device {
  display: grid;
  gap: 0.08rem;
  min-width: 0;
}

.screenshots-upload-device strong {
  color: var(--fg);
  font-size: 1rem;
  font-weight: 700;
}

.screenshots-upload-device span {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.screenshots-upload-file {
  position: relative;
  min-width: 0;
}

.form .screenshots-upload-input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  border: 0;
  opacity: 0;
  white-space: nowrap;
}

.screenshots-file-picker {
  display: flex !important;
  align-items: center;
  min-width: 0;
  min-height: 2.8rem;
  margin: 0 !important;
  overflow: hidden;
  border: 1px solid rgba(82, 100, 118, 0.72);
  border-radius: 10px;
  background: var(--theme-control-bg);
  cursor: pointer;
  transition: border-color 0.16s ease, background-color 0.16s ease, box-shadow 0.16s ease;
}

.screenshots-file-picker:hover {
  border-color: rgba(126, 169, 211, 0.74);
  background: var(--theme-control-hover-bg);
}

.screenshots-upload-input:focus-visible + .screenshots-file-picker {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--theme-focus-ring);
}

.screenshots-file-picker__button {
  align-self: stretch;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  padding: 0.55rem 0.82rem;
  border-right: 1px solid rgba(82, 100, 118, 0.72);
  background: rgba(139, 152, 165, 0.16);
  color: var(--fg);
  font-size: 0.84rem;
  font-weight: 700;
}

.screenshots-file-picker__status {
  min-width: 0;
  overflow: hidden;
  padding: 0.55rem 0.75rem;
  color: var(--muted);
  font-size: 0.84rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.form .screenshots-upload-submit {
  min-height: 2.8rem;
  margin: 0;
  padding: 0.58rem 0.95rem;
  white-space: nowrap;
}

.screenshots-upload-file > .screenshot-order {
  margin-top: 0.75rem;
}

html[data-theme="light"] .screenshots-ai-toolbar {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .form .screenshots-ai-field,
html[data-theme="light"] .screenshots-upload-section__header h3,
html[data-theme="light"] .screenshots-upload-device strong {
  color: var(--on-surface);
}

html[data-theme="light"] .screenshots-upload-list,
html[data-theme="light"] .screenshots-upload-row + .screenshots-upload-row,
html[data-theme="light"] .screenshots-file-picker,
html[data-theme="light"] .screenshots-file-picker__button {
  border-color: var(--outline-variant);
}

@media (max-width: 980px) {
  .screenshots-ai-toolbar {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .screenshots-ai-toolbar__fields {
    max-width: none;
  }

  .screenshots-ai-toolbar__actions {
    justify-content: flex-start;
  }

  .screenshots-upload-row {
    grid-template-columns: minmax(8rem, 0.35fr) minmax(15rem, 1fr);
  }

  .form .screenshots-upload-submit {
    grid-column: 2;
    justify-self: start;
  }
}

@media (max-width: 680px) {
  .screenshots-ai-toolbar__fields,
  .screenshots-upload-row {
    grid-template-columns: 1fr;
  }

  .screenshots-ai-toolbar__actions .btn,
  .form .screenshots-upload-submit {
    width: 100%;
  }

  .form .screenshots-upload-submit {
    grid-column: auto;
  }
}

/* Codemagic: collapsible JSON tree */
.json-tree-root {
  font-size: 0.8rem;
  line-height: 1.45;
  max-height: min(70vh, 32rem);
  overflow: auto;
  padding: 0.5rem 0.75rem;
  background: #0a0e12;
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-top: 0.35rem;
}
.json-tree-node {
  margin: 0.15rem 0 0.15rem 0.5rem;
  border-left: 1px solid #2f3d4a;
  padding-left: 0.45rem;
}
.json-tree-node > summary {
  cursor: pointer;
  color: var(--accent);
  font-weight: 500;
  list-style: none;
}
.json-tree-node > summary::-webkit-details-marker {
  display: none;
}
.json-tree-node > summary::before {
  content: "▸ ";
  display: inline-block;
  width: 0.9em;
  color: var(--muted);
}
.json-tree-node[open] > summary::before {
  content: "▾ ";
}
.json-tree-children {
  margin-top: 0.25rem;
}
.json-tree-row {
  margin: 0.1rem 0;
  padding-left: 0.25rem;
}
.json-tree-key {
  color: #7ab8e8;
  font-weight: 500;
}
.json-str {
  color: #9ee6a8;
  word-break: break-word;
}
.json-num {
  color: #e7ae4a;
}
.json-bool,
.json-null {
  color: #c49ee6;
}
.json-empty {
  color: var(--muted);
}
.json-tree-max {
  color: var(--muted);
}

.ci-cm-log-steps {
  margin: 0.5rem 0 1rem 0;
}
.ci-cm-log-step {
  margin-bottom: 0.75rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--border);
}
.ci-cm-log-step:last-child {
  border-bottom: none;
}
.ci-cm-log-step-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin-bottom: 0.35rem;
}
.ci-cm-log-step--clickable {
  cursor: pointer;
  border-radius: 6px;
  padding: 0.25rem 0.35rem;
  margin-left: -0.35rem;
  margin-right: -0.35rem;
}
.ci-cm-log-step--clickable:hover {
  background: rgba(255, 255, 255, 0.04);
}
.ci-cm-step-status {
  font-size: 0.72rem;
  font-weight: 600;
  padding: 0.15rem 0.45rem;
  border-radius: 4px;
  min-width: 4.5rem;
  text-align: center;
  flex-shrink: 0;
}
.ci-cm-step-status--unknown {
  background: #2a3540;
  color: var(--muted);
}
.ci-cm-step-status--ok {
  background: #1e3d2e;
  color: #8fd9a8;
}
.ci-cm-step-status--fail {
  background: #3d1e24;
  color: #f0a8a8;
}
.ci-cm-step-status--run {
  background: #2a3040;
  color: #9ec5ff;
}
.ci-cm-step-status--queued {
  background: #353028;
  color: #e7c98a;
}
.ci-cm-step-name {
  font-weight: 500;
  flex: 1;
  min-width: 8rem;
}
.ci-cm-step-name--sub {
  padding-left: 0.65rem;
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 400;
}
.ci-cm-no-log {
  font-size: 0.82rem;
  white-space: nowrap;
}
.ci-cm-step-log-pre {
  margin: 0.35rem 0 0 0;
  padding: 0.65rem;
  max-height: min(60vh, 24rem);
  overflow: auto;
  font-size: 0.75rem;
  line-height: 1.35;
  background: #0a0e12;
  border: 1px solid var(--border);
  border-radius: 6px;
  white-space: pre-wrap;
  word-break: break-word;
}

/* Пошаговые формы (новый аккаунт, новый запуск) */
.wizard-progress-line {
  font-size: 0.9rem;
  color: var(--muted);
  margin: 0 0 0.5rem 0;
}
.wizard-progress-track {
  height: 4px;
  background: #203047;
  border-radius: 2px;
  margin-bottom: 1.25rem;
  overflow: hidden;
}
.wizard-progress-bar {
  height: 100%;
  width: 25%;
  background: var(--accent);
  border-radius: 2px;
  transition: width 0.2s ease;
}
.generated-app-summary {
  position: sticky;
  top: 0.75rem;
  z-index: 20;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1rem 0;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(74, 158, 255, 0.38);
  border-radius: 8px;
  background: rgba(18, 31, 44, 0.88);
}
.generated-app-summary[hidden] {
  display: none !important;
}
.generated-app-summary__body {
  min-width: 0;
}
.generated-app-summary__eyebrow {
  margin: 0 0 0.45rem 0;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.35;
}
.generated-app-summary__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.7rem 1rem;
  margin: 0;
}
.generated-app-summary__item {
  min-width: 0;
}
.generated-app-summary__item dt {
  margin: 0 0 0.18rem 0;
  color: var(--muted);
  font-size: 0.78rem;
  text-transform: uppercase;
}
.generated-app-summary__item dd {
  margin: 0;
  color: var(--on-surface);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.94rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.generated-app-summary__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
}
.run-locale-picker {
  display: grid;
  gap: 0.55rem;
}
.run-locale-primary-row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  width: min(100%, 44rem);
}
.run-locale-primary-row .locale-select {
  flex: 1 1 auto;
  min-width: 0;
}
.run-locale-primary-row .factory-select {
  flex: 1 1 auto;
  min-width: 0;
}
.run-locale-primary-row .factory-select__button {
  min-height: 2.75rem;
}
.run-locale-primary-row .run-locale-add-btn {
  flex: 0 0 2.75rem;
  width: 2.75rem;
  min-width: 2.75rem;
  min-height: 2.75rem;
  height: 2.75rem;
  padding-left: 0;
  padding-right: 0;
  font-size: 1.2rem;
  line-height: 1;
  transform: none !important;
}
.run-locale-extra-panel[hidden] {
  display: none !important;
}
.run-locale-extra-panel {
  display: grid;
  gap: 0.45rem;
  padding: 0.65rem 0 0 0;
}
.run-locale-extra-label {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.35;
}
.run-locale-extra-panel select {
  min-height: 10.5rem;
}
.run-locale-extra-status {
  min-height: 1.1rem;
}
.wizard-step[hidden] {
  display: none !important;
}
.apple-account-picker {
  margin-bottom: 1rem;
}
.apple-account-picker__search {
  margin-bottom: 0.35rem;
}
.apple-account-picker select {
  margin-top: 0;
}
.wizard-inline-error {
  margin: 0 0 0.75rem 0;
}
.iap-settings[hidden],
.iap-settings-body[hidden],
.iap-plan-preview[hidden] {
  display: none !important;
}
.form label.iap-toggle-card {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.8rem;
  margin-bottom: 0;
  padding: 0.8rem 0.9rem;
  border: 1px solid rgba(140, 146, 154, 0.3);
  border-radius: 8px;
  background: rgba(21, 32, 43, 0.52);
  cursor: pointer;
  user-select: none;
  transition:
    border-color 0.15s ease,
    background 0.15s ease;
}
.form label.iap-toggle-card:hover {
  border-color: rgba(29, 155, 240, 0.42);
  background: rgba(21, 32, 43, 0.68);
}
.iap-toggle-card input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 0;
  max-width: none;
  margin: 0;
  padding: 0;
  opacity: 0;
  pointer-events: none;
}
.iap-toggle-control {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  width: 2.55rem;
  height: 1.45rem;
  border: 1px solid rgba(140, 146, 154, 0.46);
  border-radius: 999px;
  background: rgba(140, 146, 154, 0.22);
  transition:
    border-color 0.15s ease,
    background 0.15s ease,
    box-shadow 0.15s ease;
}
.iap-toggle-control::after {
  content: "";
  position: absolute;
  top: 0.17rem;
  left: 0.18rem;
  width: 1rem;
  height: 1rem;
  border-radius: 999px;
  background: #c9d1d9;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  transition:
    transform 0.15s ease,
    background 0.15s ease;
}
.iap-toggle-card input[type="checkbox"]:checked + .iap-toggle-control {
  border-color: rgba(29, 155, 240, 0.76);
  background: rgba(29, 155, 240, 0.86);
}
.iap-toggle-card input[type="checkbox"]:checked + .iap-toggle-control::after {
  transform: translateX(1.06rem);
  background: #fff;
}
.iap-toggle-card input[type="checkbox"]:focus-visible + .iap-toggle-control {
  box-shadow: 0 0 0 3px rgba(29, 155, 240, 0.25);
}
.iap-toggle-copy {
  display: grid;
  min-width: 0;
  gap: 0.12rem;
}
.iap-toggle-copy strong {
  line-height: 1.25;
}
.iap-toggle-copy small {
  color: var(--muted);
  line-height: 1.35;
}
.iap-settings-body {
  margin-top: 0.75rem;
  padding: 0.9rem;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  background: rgba(10, 14, 18, 0.24);
}
.iap-product-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.8rem;
  margin-bottom: 0.75rem;
}
.iap-product-title {
  margin: 0 0 0.25rem 0;
  font-weight: 600;
}
.iap-products-list {
  display: grid;
  gap: 0.75rem;
}
.iap-product-row {
  display: grid;
  grid-template-columns: minmax(16rem, 1.4fr) minmax(13rem, 0.8fr) auto;
  gap: 0.65rem;
  align-items: end;
  padding: 0.75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #101820;
}
.iap-product-row .field {
  margin-bottom: 0;
}
.iap-remove-product {
  min-height: 38px;
  white-space: nowrap;
}
.iap-plan-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.7rem;
  margin: 0.9rem 0 0;
}
.iap-plan-preview {
  margin-top: 0.75rem;
}
.iap-asc-check {
  margin-top: 0.9rem;
  padding: 0.75rem;
  border: 1px solid rgba(140, 146, 154, 0.22);
  border-radius: 8px;
  background: rgba(15, 23, 31, 0.58);
}
.iap-asc-check__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.8rem;
}
.iap-asc-summary {
  display: grid;
  gap: 0.65rem;
  margin-top: 0.7rem;
}
.iap-asc-summary[hidden] {
  display: none !important;
}
.iap-asc-summary__meta {
  padding: 0.55rem 0.65rem;
  border-radius: 8px;
  background: rgba(255,255,255,0.035);
}
.iap-asc-summary__meta p {
  margin: 0;
}
.iap-asc-card {
  display: grid;
  gap: 0.28rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--border);
  border-left-width: 3px;
  border-radius: 8px;
  background: #101820;
}
.iap-asc-card--ok {
  border-left-color: #00ba7c;
}
.iap-asc-card--warning {
  border-left-color: #f0b429;
}
.iap-asc-card--error {
  border-left-color: var(--err);
}
.iap-asc-card p {
  margin: 0;
}
.iap-asc-price {
  color: #f5f8fa;
  font-weight: 600;
}
.iap-asc-messages {
  margin: 0.25rem 0 0;
  padding-left: 1.1rem;
  font-size: 0.9rem;
}
.iap-asc-messages--warn {
  color: #f0b429;
}
.iap-asc-messages--error {
  color: var(--err);
}
@media (max-width: 980px) {
  .iap-product-row {
    grid-template-columns: 1fr;
  }
  .iap-product-head {
    flex-direction: column;
  }
  .iap-asc-check__head {
    flex-direction: column;
  }
}
.wizard-account-summary {
  margin: 0.35rem 0 0;
  padding-left: 1.2rem;
  line-height: 1.5;
  list-style: disc;
}
.wizard-account-summary li {
  margin: 0.4rem 0;
  word-break: break-word;
}
.wizard-nav {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.75rem;
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}
.wizard-nav-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
}
.wizard-nav-actions .btn {
  min-height: 44px;
  padding: 0.6rem 1.25rem;
  font-size: 1rem;
  line-height: 1.25;
}
.wizard-nav-actions .btn-secondary {
  padding: 0.6rem 1.25rem;
}

@media (max-width: 760px) {
  .generated-app-summary {
    flex-direction: column;
  }
  .generated-app-summary__grid {
    grid-template-columns: 1fr;
  }
  .generated-app-summary__actions {
    justify-content: flex-start;
  }
}

.gitlab-pat-scopes-figure {
  margin: 0.75rem 0 0 0;
  max-width: min(100%, 28rem);
}
.gitlab-pat-scopes-figure img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px;
  border: 1px solid var(--border);
}
.gitlab-pat-scopes-figure figcaption {
  margin-top: 0.35rem;
}
.wizard-gitlab-instructions {
  margin-top: 0.75rem;
}

details.codemagic-settings-help {
  margin: 0.75rem 0 1rem 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.5rem 0.75rem;
  background: #15202b;
}
details.codemagic-settings-help[open] {
  padding-bottom: 0.75rem;
}
.codemagic-settings-help-summary {
  cursor: pointer;
  font-weight: 500;
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0;
  color: var(--accent);
}
.codemagic-settings-help-summary::-webkit-details-marker {
  display: none;
}
.codemagic-settings-help-summary::before {
  content: "❯";
  display: inline-block;
  font-size: 0.75rem;
  transition: transform 0.15s ease;
  opacity: 0.85;
}
details.codemagic-settings-help[open] .codemagic-settings-help-summary::before {
  transform: rotate(90deg);
}
.codemagic-help-steps {
  margin-top: 0.5rem;
}


/* ── /apps — сводная таблица всех запусков ────────────────────────────── */
.apps-table-wrap {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #111a24;
}
.apps-totals {
  margin-bottom: 1rem;
}
.apps-totals strong {
  color: var(--fg);
}
.apps-page-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  margin-bottom: 0.85rem;
}
.apps-page-toolbar .hint {
  margin: 0;
}
.page-apps .detail-hero--apps {
  grid-template-columns: minmax(0, 1fr) minmax(13rem, 18rem);
  align-items: start;
  border-radius: 10px;
  background: #111a24;
  box-shadow: none;
}
.page-apps .detail-hero--apps h1 {
  font-size: clamp(2.1rem, 4vw, 3rem);
  letter-spacing: 0;
}
.apps-hero-main {
  min-width: 0;
}
.apps-hero-actions {
  align-content: start;
}
.apps-hero-actions .apps-new-run-menu {
  width: 100%;
}
.apps-hero-actions .apps-new-run-menu summary {
  display: flex;
  align-items: center;
  justify-content: center;
}
.apps-hero-breadcrumb {
  margin: 0 0 0.85rem;
}
.apps-hero-title {
  margin: 0;
}
.apps-hero-title .account-avatar {
  flex: 0 0 auto;
}
.apps-hero-links {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0.75rem 0 0;
}
.apps-totals--hero,
.apps-hero-filters {
  grid-column: 1 / -1;
}
.apps-totals--hero {
  margin: 0;
  padding-top: 0.15rem;
  line-height: 1.5;
}
.detail-hero--apps .apps-filter-bar {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.detail-hero--apps .apps-filter-menu {
  flex: 0 0 15rem;
  max-width: 16rem;
}
.detail-hero--apps .apps-filter-menu summary,
.detail-hero--apps .apps-filter-reset {
  box-sizing: border-box;
  min-height: 56px;
}
.apps-new-run-menu {
  position: relative;
}
.apps-new-run-menu summary {
  list-style: none;
  cursor: pointer;
}
.apps-new-run-menu summary::-webkit-details-marker {
  display: none;
}
.apps-new-run-menu-list {
  position: absolute;
  right: 0;
  z-index: 20;
  min-width: 240px;
  margin-top: 0.45rem;
  padding: 0.4rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #111a24;
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.35);
}
.apps-new-run-menu-item {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.45rem 0.55rem;
  border-radius: 6px;
  color: var(--fg);
  text-decoration: none;
}
.apps-new-run-menu-item:hover {
  background: #172433;
}
.apps-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  margin-top: 1rem;
  margin-bottom: 0.25rem;
}
.apps-pagination-summary {
  margin: 0;
}
.apps-pagination-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.apps-table {
  min-width: 960px;
}
.apps-table th:first-child,
.apps-table td.apps-unit-cell {
  min-width: 13rem;
}
.apps-table td, .apps-table th {
  vertical-align: top;
  white-space: nowrap;
}
.apps-table th.num, .apps-table td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.delete-app-status {
  display: block;
  margin-top: 0.35rem;
  font-size: 0.8rem;
  line-height: 1.25;
  white-space: normal;
}
.delete-app-status[data-kind="running"] {
  color: #8fc1ff;
}
.delete-app-status[data-kind="running"]::before {
  content: "";
  display: inline-block;
  width: 0.72em;
  height: 0.72em;
  margin-right: 0.35em;
  border: 2px solid rgba(143, 193, 255, 0.32);
  border-top-color: #8fc1ff;
  border-radius: 50%;
  vertical-align: -0.12em;
  animation: factory-busy-spin 0.75s linear infinite;
}
.delete-app-status[data-kind="ok"] {
  color: #7ee4a1;
}
.delete-app-status[data-kind="error"] {
  color: #ff9b9b;
}
.apps-table td.apps-problems {
  white-space: normal;
  max-width: 320px;
}
.apps-subline {
  margin-top: 0.2rem;
  font-size: 0.82rem;
}
.apps-icon {
  display: inline-block;
}
.apps-icon--empty {
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  color: var(--muted);
  background: #0f1822;
  border: 1px dashed var(--border);
  border-radius: 8px;
}
.apps-steps-sep {
  color: var(--muted);
  margin: 0 0.15rem;
}
.account-avatar--xs {
  width: 24px;
  height: 24px;
  display: inline-flex;
  vertical-align: middle;
  margin-right: 0.3rem;
}
.pill--success {
  background: #103a24;
  color: #7ee4a1;
}
.pill--failed {
  background: #3a1010;
  color: #ff9b9b;
}
.pill--running {
  background: #1a2d4a;
  color: #8fc1ff;
}
.pill--neutral {
  background: #2a2f36;
  color: var(--muted);
}
/* Пилюля для «на рассмотрении» — тёплый янтарный: между run/success/fail. */
.pill--warning {
  background: #3a2a10;
  color: #ffc978;
}

.pill--waiting {
  background: #3a2a10;
  color: #ffc978;
}
/* Пилюля юнита: каждый юнит получает свой стабильный оттенок через CSS-переменную
   --unit-hue (выставляется inline-стилем из шаблона, фильтр `unit_hue` в Python
   хэширует имя юнита в 0..359). Все цвета строятся как hsl(var(--unit-hue), …),
   поэтому при добавлении нового юнита никаких правок в палитре не требуется.

   Фоллбэк: если --unit-hue не задан (старая вёрстка / кеш браузера) — остаётся
   прежний приглушённо-фиолетовый (265).
   Пилюля — ссылка на URL фильтра ?unit=<id>: hover-подсветка должна дать понять, что
   кликабельно. */
.pill--unit {
  --unit-hue: 265;
  background: hsl(var(--unit-hue), 38%, 22%);
  color: hsl(var(--unit-hue), 80%, 82%);
  border: 1px solid hsl(var(--unit-hue), 42%, 30%);
  text-decoration: none;
}
.apps-unit-pill:hover,
.apps-unit-pill:focus-visible {
  background: hsl(var(--unit-hue), 44%, 30%);
  color: hsl(var(--unit-hue), 90%, 90%);
  border-color: hsl(var(--unit-hue), 52%, 42%);
  text-decoration: underline;
}
.apps-unit-cell {
  min-width: 7rem;
  white-space: nowrap;
}
.apps-proxy-cell {
  min-width: 7rem;
  white-space: nowrap;
}
.apps-unit-cell--multi-account {
  border-right: 1px solid var(--border);
}
.apps-unit-empty {
  color: var(--muted);
}

/* Инлайн-редактор юнита в ячейке таблицы /apps: скрытая форма раскрывается над
   view-строкой (pill/«Задать юнит») по клику на ✎, появляется поле ввода
   c datalist-подсказками и кнопки Сохранить/Убрать/Отмена. */
.apps-unit-view {
  display: inline-flex;
  gap: 0.35rem;
  align-items: center;
}
.apps-unit-edit-btn {
  background: transparent;
  border: 1px solid transparent;
  color: var(--muted);
  cursor: pointer;
  padding: 0 0.25rem;
  border-radius: 4px;
  font-size: 0.85rem;
  line-height: 1.4;
}
.apps-unit-edit-btn:hover,
.apps-unit-edit-btn:focus-visible {
  color: var(--on-surface);
  border-color: var(--border);
  background: #111820;
}
.apps-unit-editor[hidden],
.apps-saler-editor[hidden],
.apps-proxy-editor[hidden] { display: none; }
.apps-unit-editor,
.apps-saler-editor,
.apps-proxy-editor {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}
.apps-unit-editor-input,
.apps-saler-editor-input,
.apps-saler-editor-select,
.apps-proxy-editor-input {
  min-width: 8rem;
  max-width: 14rem;
  padding: 0.25rem 0.4rem;
  font-size: 0.9rem;
}
.apps-saler-editor-select {
  min-width: 10rem;
  color: var(--fg);
  background: #15202b;
  border: 1px solid var(--border);
  border-radius: 6px;
}
.apps-unit-editor-status,
.apps-saler-editor-status,
.apps-proxy-editor-status {
  font-size: 0.8rem;
}
.apps-unit-editor-status[data-kind="error"],
.apps-saler-editor-status[data-kind="error"],
.apps-proxy-editor-status[data-kind="error"] {
  color: #ffb3b3;
}

.apps-proxy-view {
  display: inline-flex;
  gap: 0.35rem;
  align-items: center;
}
.apps-proxy-name {
  font-size: 0.9rem;
  color: var(--on-surface);
  background: rgba(255, 255, 255, 0.06);
  padding: 0.15rem 0.45rem;
  border-radius: 4px;
}

/* --- /apps: панель фильтров над таблицей ------------------------------------
  Дата идеи, Unit и Saler выглядят как единый набор компактных контролов.
  Кнопка «Сбросить» (.apps-filter-reset) появляется, только если фильтр активен. */
.apps-filter-bar {
  display: flex;
  align-items: stretch;
  gap: 0.65rem;
  flex-wrap: wrap;
  margin: 0 0 1rem;
  padding: 0.65rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #0f1822;
}
.apps-filter-menu {
  display: flex;
  flex-direction: column;
  gap: 0.24rem;
  min-width: 13rem;
}
.apps-filter-menu summary > span {
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.1;
}
.apps-filter-menu {
  position: relative;
  flex: 0 1 15rem;
}
.apps-filter-menu summary {
  position: relative;
  display: grid;
  align-content: center;
  min-height: 3.55rem;
  padding: 0.44rem 2rem 0.44rem 0.72rem;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: #15202b;
  color: var(--fg);
  cursor: pointer;
  list-style: none;
}
.apps-filter-menu summary::-webkit-details-marker {
  display: none;
}
.apps-filter-menu summary::after {
  content: "";
  position: absolute;
  right: 0.78rem;
  top: 50%;
  width: 0.48rem;
  height: 0.48rem;
  border-right: 1.5px solid var(--muted);
  border-bottom: 1.5px solid var(--muted);
  transform: translateY(-60%) rotate(45deg);
  transition: transform 0.14s ease;
}
.apps-filter-menu[open] summary::after {
  transform: translateY(-35%) rotate(225deg);
}
.apps-filter-menu summary strong {
  display: block;
  min-width: 0;
  margin-top: 0.16rem;
  overflow: hidden;
  color: var(--fg);
  font-size: 0.92rem;
  font-weight: 650;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apps-filter-menu--active summary {
  border-color: rgba(29, 155, 240, 0.62);
  box-shadow: 0 0 0 1px rgba(29, 155, 240, 0.18);
}
.apps-filter-menu-panel {
  position: absolute;
  z-index: 30;
  top: calc(100% + 0.35rem);
  left: 0;
  display: grid;
  gap: 0.25rem;
  min-width: max(100%, 18rem);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 0.45rem;
  background: #0d1721;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.38);
}
.apps-filter-menu-panel--select {
  max-height: min(370px, 54vh);
  overflow: auto;
}
.apps-filter-menu-options-form {
  display: grid;
  gap: 0.25rem;
  margin: 0;
}
.apps-filter-menu-option {
  display: block;
  min-height: 2.25rem;
  padding: 0.48rem 0.6rem;
  border-radius: 6px;
  color: var(--fg);
  text-decoration: none;
}
button.apps-filter-menu-option {
  width: 100%;
  border: 0;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.apps-filter-menu-option:hover,
.apps-filter-menu-option:focus-visible {
  background: rgba(255, 255, 255, 0.05);
  outline: none;
}
.apps-filter-menu-option.is-active {
  background: rgba(29, 155, 240, 0.14);
  color: #8fd3ff;
  font-weight: 700;
}
.apps-date-range-form {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.25rem;
  padding-top: 0.45rem;
  border-top: 1px solid rgba(139, 152, 165, 0.16);
}
.apps-date-range-form label {
  display: grid;
  gap: 0.22rem;
  color: var(--muted);
  font-size: 0.82rem;
}
.apps-filter-label {
  color: var(--muted);
  font-size: 0.85rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-weight: 600;
}
.apps-filter-date {
  width: 100%;
  min-height: 2.15rem;
  padding: 0.3rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #15202b;
  color: var(--fg);
  color-scheme: dark;
  accent-color: var(--accent);
  font: inherit;
  font-size: 0.86rem;
}
.apps-filter-date:hover,
.apps-filter-date:focus {
  border-color: #2f81c7;
  outline: none;
  background: #172536;
}
.apps-date-bound {
  text-transform: none;
  letter-spacing: 0;
}
.apps-filter-reset {
  align-self: stretch;
  min-height: 3.55rem;
}

/* --- Витрина /apps: сгруппированная таблица с аккордеоном по аккаунтам --- */
.apps-table--grouped tbody tr.apps-account-header > th {
  padding: 0;
  border-top: 1px solid var(--border);
  background: #111820;
}
.apps-account-cell {
  padding: 0;
}
.apps-account-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.65rem 0.9rem;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  text-align: left;
  font: inherit;
}
.apps-account-toggle:hover {
  background: #17212b;
}
.apps-account-caret {
  display: inline-block;
  width: 1em;
  color: var(--muted);
}
.apps-account-name {
  font-weight: 600;
}
.apps-account-name a {
  color: inherit;
  text-decoration: none;
}
.apps-account-name a:hover {
  text-decoration: underline;
}
.apps-account-count {
  margin-left: 0.5rem;
}
.apps-account-indent {
  display: inline-block;
  width: 1.5rem;
}
/* Первая колонка «Аккаунт (ASC)»: рендерим email всегда в том же стиле, что и у
   соло-строк. Для групп из нескольких приложений используем rowspan — ячейка
   визуально охватывает все строки группы, как «объединение ячеек» в Excel. */
.apps-asc-email-cell {
  min-width: 12rem;
  white-space: nowrap;
  overflow: visible;
}
.apps-asc-email {
  display: inline-block;
  max-width: 12rem;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: bottom;
  font-family: var(--mono, ui-monospace, SFMono-Regular, Menlo, monospace);
  color: var(--muted);
  font-size: 0.95em;
}
.apps-saler-inline {
  display: inline-flex;
  align-items: flex-start;
  gap: 0.25rem;
  margin-top: 0.35rem;
  white-space: normal;
}
.apps-saler-view {
  display: inline-flex;
  gap: 0.35rem;
  align-items: center;
}
.apps-saler-pill {
  max-width: 12rem;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
}
/* Группа из нескольких приложений: email-ячейка выровнена по верху, с лёгким
   фоном и тонким правым бордером — чтобы «слияние» ячеек считывалось как в Excel. */
.apps-asc-email-cell--merged {
  vertical-align: top;
  padding-top: 0.9rem;
  background: #111820;
  border-right: 1px solid var(--border);
}
/* Колонка «Менеджер»: небольшой аватар + имя factory-аккаунта (ответственного за запуск).
   Та же история, что и с .apps-app-cell: flex — на inner-span, сам <td> остаётся table-cell,
   иначе менеджер и приложение «слипаются» в одну визуальную колонку. */
.apps-manager-cell {
  white-space: nowrap;
  min-width: 9rem;
}
.apps-manager-inner {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  max-width: 100%;
}
.apps-manager-name {
  color: inherit;
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
}
.apps-manager-name:hover {
  text-decoration: underline;
}
/* В ячейке приложения иконка и имя должны стоять в ряд — но flex применяем к внутреннему
   span, а не к самому <td>. Иначе у некоторых браузеров (Safari, WebKit старых версий)
   <td> с display:flex выпадает из колоночной раскладки таблицы и визуально склеивается
   с соседней ячейкой. Держим TD как table-cell, flex — на .apps-app-inner. */
.apps-app-cell { /* table-cell по умолчанию — не перекрываем */ }
.apps-app-inner {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  max-width: 100%;
}
.apps-app-name-wrap {
  display: inline-flex;
  flex-direction: column;
  min-width: 0;
}
/* ID запуска слева от названия: тот же кегль/жирность, что у .btn-table, цвета как у pill юнита. */
.apps-app-title-row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
  max-width: 22rem;
}
.apps-app-id-pill {
  display: inline-block;
  flex-shrink: 0;
  box-sizing: border-box;
  font-size: 0.88rem;
  font-weight: 500;
  line-height: 1.25;
  padding: 0.3rem 0.55rem;
  border-radius: 999px;
  white-space: nowrap;
  /* Цвет текста/фона: .apps-app-id-pill--no-unit в CSS; с юнитом — inline hsl в шаблоне. */
}
/* Нет юнита — не подкрашиваем случайным hue; текст ID белый на нейтральном фоне. */
.apps-app-id-pill--no-unit {
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.22);
}
html[data-theme="light"] .apps-app-id-pill--no-unit {
  background: var(--m3-surface-container-low);
  color: var(--m3-on-surface);
  border-color: var(--m3-outline-variant);
}
.apps-app-title-row .apps-app-name {
  flex: 1 1 auto;
  min-width: 0;
  max-width: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apps-app-name {
  max-width: 18rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apps-app-meta {
  display: block;
  font-size: 0.88em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 22rem;
}
.apps-build-status-cell {
  min-width: 7rem;
  width: 1%;
  vertical-align: top;
}
.apps-asc-cell {
  min-width: 18rem;
}
.apps-release-cell {
  min-width: 14rem;
  max-width: 18rem;
  white-space: normal;
}
.apps-release-cell--empty {
  min-width: 5rem;
  text-align: center;
  vertical-align: middle;
}
.apps-release-card {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.apps-release-statuses {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}
.apps-asc-status-line {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}
.apps-asc-meta,
.apps-build-meta {
  margin-top: 0.25rem;
}
.apps-asc-meta > summary,
.apps-build-meta > summary {
  cursor: pointer;
  list-style: none;
  font-size: 0.8em;
  display: inline-block;
  padding: 0.05rem 0.3rem;
  border-radius: 4px;
}
.apps-asc-meta > summary::-webkit-details-marker,
.apps-build-meta > summary::-webkit-details-marker {
  display: none;
}
.apps-asc-meta > summary::before,
.apps-build-meta > summary::before {
  content: "▸ ";
  color: var(--muted);
}
.apps-asc-tracking-paused {
  margin-left: 0.25rem;
  color: #ff9b9b;
  font-size: 0.9em;
  vertical-align: middle;
}
.apps-asc-meta[open] > summary::before,
.apps-build-meta[open] > summary::before {
  content: "▾ ";
}
.apps-asc-meta > summary:hover,
.apps-asc-meta > summary:focus-visible,
.apps-build-meta > summary:hover,
.apps-build-meta > summary:focus-visible {
  background: #111820;
}
.apps-asc-meta-list {
  list-style: none;
  margin: 0.25rem 0 0;
  padding: 0;
  font-size: 0.85em;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}
.apps-asc-meta-list li {
  white-space: nowrap;
}
.apps-asc-meta-key {
  margin-right: 0.25rem;
}
.apps-asc-refresh-btn {
  background: transparent;
  border: 1px solid transparent;
  color: var(--muted);
  cursor: pointer;
  padding: 0 0.3rem;
  border-radius: 4px;
  font-size: 0.95rem;
  line-height: 1.4;
}
.apps-asc-refresh-btn:hover,
.apps-asc-refresh-btn:focus-visible {
  color: var(--on-surface);
  border-color: var(--border);
  background: #111820;
}
.apps-asc-refresh-btn:disabled,
.apps-asc-refresh-btn.is-busy {
  cursor: progress;
  opacity: 0.7;
}
.apps-asc-manual-reason {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  max-width: 24rem;
}
.apps-asc-manual-reason-view {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  flex-wrap: wrap;
}
.apps-asc-manual-reason-item {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
}
.pill--asc-manual-reason {
  max-width: 16rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: #2b2138;
  color: #d8c4ff;
  border: 1px solid #46335f;
}
.apps-asc-manual-reason-edit-btn {
  background: transparent;
  border: 1px solid transparent;
  color: var(--muted);
  cursor: pointer;
  padding: 0 0.25rem;
  border-radius: 4px;
  font-size: 0.85rem;
  line-height: 1.4;
}
.apps-asc-manual-reason-remove-btn {
  width: 1.25rem;
  height: 1.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid transparent;
  color: var(--muted);
  cursor: pointer;
  padding: 0;
  border-radius: 4px;
  font-size: 0.9rem;
  line-height: 1;
}
.apps-asc-manual-reason-edit-btn:hover,
.apps-asc-manual-reason-edit-btn:focus-visible,
.apps-asc-manual-reason-remove-btn:hover,
.apps-asc-manual-reason-remove-btn:focus-visible {
  color: var(--on-surface);
  border-color: var(--border);
  background: #111820;
}
.apps-asc-manual-reason-editor[hidden] { display: none; }
.apps-asc-manual-reason-editor {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}
.apps-asc-manual-reason-input {
  min-width: 14rem;
  max-width: 24rem;
  padding: 0.25rem 0.4rem;
  font-size: 0.9rem;
}
.apps-asc-manual-reason-status {
  font-size: 0.8rem;
}
.apps-asc-manual-reason-status[data-kind="error"] {
  color: #ffb3b3;
}
.apps-asc-reject {
  margin-top: 0.25rem;
}
.apps-asc-reject-text {
  font-size: 0.85em;
  max-width: 22rem;
  white-space: normal;
  margin-top: 0.25rem;
  color: var(--muted);
}
.apps-problem-details--inline {
  display: block;
  margin-top: 0.2rem;
}
.apps-problem-details summary {
  cursor: pointer;
  list-style: none;
}
.apps-problem-details summary::-webkit-details-marker {
  display: none;
}
.apps-problem-list {
  margin: 0.5rem 0 0;
  padding: 0;
  list-style: none;
  font-size: 0.85rem;
}
.apps-problem-list li + li {
  margin-top: 0.45rem;
}
.apps-problem-total {
  margin-left: 0.4rem;
}
.apps-problem-item {
  border-left: 2px solid transparent;
  padding: 0.2rem 0 0.2rem 0.6rem;
}
.apps-problem-item--active {
  border-left-color: #ff6b6b;
  color: #ff9b9b;
}
.apps-problem-item--resolved {
  border-left-color: #3a6d4a;
  color: var(--muted);
}
.apps-problem-item--cancelled {
  border-left-color: #c7b26b;
}
.apps-problem-item--reset {
  border-left-color: #8fc1ff;
}
.apps-problem-head {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  align-items: baseline;
}
.apps-problem-kind {
  font-weight: 600;
}
.apps-problem-resolved {
  margin-left: 0.2rem;
  font-size: 0.72rem;
}
.apps-problem-text {
  margin-top: 0.15rem;
  white-space: normal;
  word-break: break-word;
}
.apps-problem-item--resolved .apps-problem-text {
  text-decoration: line-through;
  text-decoration-thickness: 1px;
  opacity: 0.78;
}
.run-app-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}
.factory-app-archive-box {
  margin-top: 0.75rem;
  max-width: 24rem;
}
.factory-app-archive-line {
  margin: 0 0 0.35rem 0;
  font-size: 0.9rem;
  color: var(--muted);
}
.factory-app-archive-bar {
  display: block;
  width: 100%;
  height: 0.5rem;
  vertical-align: middle;
  accent-color: var(--accent);
}
.factory-app-archive-err {
  color: var(--err);
  margin-top: 0.5rem;
  margin-bottom: 0;
}

/* Первый запуск: CTA с инструкцией Apple Developer / ASC */
.first-app-guide-banner {
  margin: 1rem 0 0.5rem 0;
  padding: 1rem 1.1rem 1.1rem;
  border-radius: 10px;
  border: 1px solid rgba(74, 158, 255, 0.45);
  background: linear-gradient(135deg, rgba(25, 80, 140, 0.35) 0%, rgba(12, 28, 48, 0.65) 100%);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2) inset;
}
.first-app-guide-banner__text {
  margin: 0 0 0.9rem 0;
  color: #e8f0ff;
  line-height: 1.45;
  font-size: 0.95rem;
  max-width: 52em;
}
.btn-first-app {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0.65rem 1.4rem;
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.2;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  text-decoration: none;
  color: #0a1628;
  background: linear-gradient(180deg, #ffe066 0%, #f5b000 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.35) inset, 0 2px 8px rgba(0, 0, 0, 0.35);
  transition: filter 0.12s ease, transform 0.1s ease;
}
.btn-first-app:hover {
  filter: brightness(1.06);
  text-decoration: none;
  color: #071018;
  transform: translateY(-1px);
}
.btn-first-app:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* Страница-инструкция */
.first-app-guide .lead {
  font-size: 1.05rem;
  line-height: 1.5;
  color: var(--muted);
  max-width: 50em;
  margin: 0.5rem 0 1.25rem 0;
}
.first-app-guide-section {
  margin: 1.5rem 0 1.25rem 0;
  max-width: 52em;
}
.first-app-guide-section h2 {
  margin: 0 0 0.5rem 0;
  font-size: 1.2rem;
}
.first-app-guide-steps {
  margin: 0.5rem 0 0 0;
  padding-left: 1.25rem;
  line-height: 1.45;
  color: #dbe6f0;
}
.first-app-guide-steps li {
  margin: 0.4rem 0;
}
.first-app-guide-steps ul {
  margin: 0.35rem 0 0.25rem 0;
  padding-left: 1.1rem;
}
.first-app-guide-figures {
  margin: 1.5rem 0 2rem 0;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.first-app-guide-figure {
  margin: 0;
  max-width: min(100%, 960px);
}
.first-app-guide-figure img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px;
  border: 1px solid var(--border);
}
.first-app-guide-figure figcaption {
  margin-top: 0.4rem;
  font-size: 0.9rem;
  color: var(--muted);
  line-height: 1.4;
}
.first-app-guide-back {
  margin: 1.5rem 0 2rem 0;
}

body.portfolio-modal-open,
body.portfolio-action-hint-open {
  overflow: hidden;
}

/* Доска портфеля (/portfolio) */
body.page-portfolio-board {
  background:
    radial-gradient(ellipse 120% 80% at 15% 0%, rgba(29, 155, 240, 0.14) 0%, transparent 52%),
    radial-gradient(ellipse 90% 60% at 95% 40%, rgba(139, 92, 246, 0.1) 0%, transparent 45%),
    var(--bg);
}

body.page-portfolio-board .container {
  max-width: min(100%, 1920px);
  padding: 1.25rem 1.25rem 2rem;
}

.portfolio-board-hero {
  display: grid;
  grid-template-columns: 1fr;
  align-items: stretch;
  gap: 1rem;
  margin-bottom: 1.25rem;
  padding: 1rem 1.15rem;
  border-radius: 10px;
  border: 1px solid rgba(124, 200, 248, 0.22);
  background: #111a24;
  box-shadow: none;
}
.portfolio-board-hero-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 1.5rem;
}
.portfolio-board-hero-text {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  flex: 1 1 280px;
}
.portfolio-board-hero-icon {
  font-size: 2rem;
  line-height: 1;
  filter: drop-shadow(0 2px 6px rgba(29, 155, 240, 0.35));
}
.portfolio-board-hero h1 {
  margin: 0 0 0.35rem 0;
  font-size: 1.45rem;
  letter-spacing: -0.02em;
}
.portfolio-board-hero-desc {
  margin: 0;
  font-size: 0.88rem;
  color: var(--muted);
  line-height: 1.45;
  max-width: 42rem;
}
.portfolio-board-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  align-self: center;
}
.portfolio-board-btn-refresh {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.portfolio-board-btn-glyph {
  font-size: 1.1rem;
  opacity: 0.9;
}

.portfolio-board-filters-wrap {
  margin-top: 0.85rem;
  padding: 0.65rem 0.85rem;
  border-radius: 12px;
  border: 1px solid rgba(56, 68, 77, 0.75);
  background: rgba(17, 24, 32, 0.65);
}
.page-portfolio-board .portfolio-board-filters-wrap {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.15rem;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.portfolio-board-filters-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.85rem;
}
.page-portfolio-board .portfolio-board-filters-toolbar {
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0.75rem;
  overflow: visible;
}
.portfolio-date-menu {
  flex: 0 1 14rem;
  min-width: min(100%, 12rem);
}
.portfolio-board-filters-toolbar .portfolio-date-menu summary {
  box-sizing: border-box;
  height: 56px;
  min-height: 56px;
  padding: 7px 32px 7px 11px;
}
.portfolio-board-filters-toolbar .portfolio-date-menu summary > span {
  font-size: 11px;
}
.portfolio-board-filters-toolbar .portfolio-date-menu summary strong {
  font-size: 13px;
}
.portfolio-board-filters-toolbar .portfolio-date-menu .apps-filter-menu-panel {
  min-width: max(100%, 17rem);
}
.portfolio-board-filters-heading {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  font-weight: 700;
  font-size: 0.88rem;
  line-height: 1.2;
}
.portfolio-board-filters-heading .portfolio-filter-total-badge {
  margin-left: 0.35rem;
  font-weight: 800;
  font-size: 0.92em;
  font-variant-numeric: tabular-nums;
  color: #fbbf24;
  letter-spacing: 0.02em;
}
.portfolio-board-filter-count {
  font-size: 0.76rem;
  color: #93c5fd;
}
.portfolio-board-text-filter {
  flex: 0 1 22rem;
  width: min(22rem, 100%);
  min-width: min(100%, 12rem);
  max-width: min(100%, 22rem);
  box-sizing: border-box;
  height: 56px;
  min-height: 56px;
  border: 1px solid rgba(56, 68, 77, 0.95);
  border-radius: 8px;
  padding: 7px 11px;
  background: rgba(15, 20, 25, 0.65);
  color: var(--fg);
  font: inherit;
  font-size: 13px;
}
.portfolio-board-text-filter:focus {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}
.portfolio-board-text-filter::placeholder {
  color: var(--muted);
}
.portfolio-filter-drop {
  position: relative;
}
.portfolio-filter-drop summary {
  cursor: pointer;
  list-style: none;
  font-size: 0.82rem;
  font-weight: 600;
  padding: 0.35rem 0.55rem;
  border-radius: 8px;
  background: rgba(29, 155, 240, 0.12);
  border: 1px solid rgba(124, 200, 248, 0.28);
  color: #bae6fd;
}
.page-portfolio-board .portfolio-filter-drop summary {
  box-sizing: border-box;
  height: 56px;
  min-height: 56px;
  padding: 7px 32px 7px 11px;
}
.portfolio-filter-drop summary::-webkit-details-marker {
  display: none;
}
.portfolio-filter-drop summary::after {
  content: " ▾";
  font-size: 0.7rem;
  opacity: 0.85;
}
.portfolio-filter-drop[open] summary::after {
  content: " ▴";
}
.portfolio-filter-drop--active > summary {
  background: rgba(251, 191, 36, 0.22);
  border-color: rgba(253, 224, 71, 0.55);
  color: #fffbeb;
  box-shadow: 0 0 0 1px rgba(251, 191, 36, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.portfolio-filter-drop--active[open] > summary {
  background: rgba(251, 191, 36, 0.28);
  border-color: rgba(253, 224, 71, 0.68);
}
.portfolio-filter-body {
  position: absolute;
  z-index: 40;
  left: 0;
  top: calc(100% + 4px);
  min-width: min(320px, 92vw);
  max-height: 280px;
  overflow-y: auto;
  padding: 0.45rem 0.55rem;
  border-radius: 10px;
  border: 1px solid rgba(56, 68, 77, 0.95);
  background: rgba(15, 21, 28, 0.98);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}
.portfolio-filter-row {
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
  font-size: 0.8rem;
  padding: 0.28rem 0;
  cursor: pointer;
}
.portfolio-filter-row-label {
  flex: 1;
  line-height: 1.35;
  word-break: break-word;
}
.portfolio-filter-drop .portfolio-filter-body .portfolio-filter-cb {
  margin-top: 0.2rem;
}
.portfolio-filters-clear {
  margin-left: auto;
}
.page-portfolio-board .portfolio-filters-clear {
  display: inline-flex;
  flex: 0 0 56px;
  align-items: center;
  justify-content: center;
  width: 56px;
  min-width: 56px;
  align-self: stretch;
  min-height: 56px;
  border-radius: 9px;
  padding: 0;
  font-size: 1.05rem;
  line-height: 1;
}
.page-portfolio-board .portfolio-board-filter-count {
  flex: 0 0 auto;
  align-self: center;
  white-space: nowrap;
}

.portfolio-board-shell {
  margin-top: 0.35rem;
  min-height: calc(100vh - 14rem);
}

.portfolio-board-columns {
  position: relative;
  display: flex;
  flex-direction: row;
  gap: 0.85rem;
  overflow-x: auto;
  overflow-y: visible;
  padding: 0.35rem 0.15rem 1rem;
  align-items: stretch;
  scroll-snap-type: x proximity;
  min-height: calc(100vh - 14rem);
}
.portfolio-board-columns.is-dragging-board {
  scroll-snap-type: none;
  scroll-behavior: auto;
}
.portfolio-board-columns.is-auto-scroll-left {
  box-shadow: inset 18px 0 18px -18px rgba(124, 200, 248, 0.7);
}
.portfolio-board-columns.is-auto-scroll-right {
  box-shadow: inset -18px 0 18px -18px rgba(124, 200, 248, 0.7);
}

.portfolio-board-col {
  --col-accent: var(--accent);
  --col-accent-dim: rgba(29, 155, 240, 0.15);
  position: relative;
  flex: 0 0 278px;
  max-width: min(278px, 92vw);
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - 14.5rem);
  border-radius: 14px;
  padding: 0 0 0.65rem;
  border: 1px solid rgba(56, 68, 77, 0.85);
  background: linear-gradient(180deg, rgba(22, 30, 40, 0.92) 0%, rgba(15, 21, 28, 0.85) 100%);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.portfolio-board-col[data-column-key="generation"],
.run-detail-column-pill[data-column-key="generation"] {
  --col-accent: #6366f1;
  --col-accent-dim: rgba(99, 102, 241, 0.18);
}
.portfolio-board-col[data-column-key="review_release"],
.run-detail-column-pill[data-column-key="review_release"] {
  --col-accent: #eab308;
  --col-accent-dim: rgba(234, 179, 8, 0.15);
}
.portfolio-board-col[data-column-key="reject_release"],
.run-detail-column-pill[data-column-key="reject_release"] {
  --col-accent: #f43f5e;
  --col-accent-dim: rgba(244, 63, 94, 0.15);
}
.portfolio-board-col[data-column-key="app_store"],
.run-detail-column-pill[data-column-key="app_store"] {
  --col-accent: #22c55e;
  --col-accent-dim: rgba(34, 197, 94, 0.15);
}
.portfolio-board-col[data-column-key="review_update"],
.run-detail-column-pill[data-column-key="review_update"] {
  --col-accent: #06b6d4;
  --col-accent-dim: rgba(6, 182, 212, 0.15);
}
.portfolio-board-col[data-column-key="reject_update"],
.run-detail-column-pill[data-column-key="reject_update"] {
  --col-accent: #f97316;
  --col-accent-dim: rgba(249, 115, 22, 0.15);
}
.portfolio-board-col[data-column-key="updated"],
.run-detail-column-pill[data-column-key="updated"] {
  --col-accent: #10b981;
  --col-accent-dim: rgba(16, 185, 129, 0.15);
}
.portfolio-board-col[data-column-key="stock"],
.run-detail-column-pill[data-column-key="stock"] {
  --col-accent: #94a3b8;
  --col-accent-dim: rgba(148, 163, 184, 0.16);
}
.portfolio-board-col[data-column-key="push"],
.run-detail-column-pill[data-column-key="push"] {
  --col-accent: #8b5cf6;
  --col-accent-dim: rgba(139, 92, 246, 0.15);
}
.portfolio-board-col[data-column-key="cash"],
.run-detail-column-pill[data-column-key="cash"] {
  --col-accent: #84cc16;
  --col-accent-dim: rgba(132, 204, 22, 0.15);
}
.portfolio-board-col[data-column-key="bin"],
.run-detail-column-pill[data-column-key="bin"] {
  --col-accent: #ef4444;
  --col-accent-dim: rgba(239, 68, 68, 0.16);
}
.portfolio-board-col[data-column-key="ban"],
.run-detail-column-pill[data-column-key="ban"] {
  --col-accent: #64748b;
  --col-accent-dim: rgba(100, 116, 139, 0.2);
}

.portfolio-board-col-header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
  padding: 0.65rem 0.75rem 0.55rem;
  margin: 0;
  border-radius: 13px 13px 0 0;
  border-bottom: 1px solid rgba(56, 68, 77, 0.65);
  background: linear-gradient(
    90deg,
    var(--col-accent-dim) 0%,
    rgba(21, 32, 43, 0.98) 65%
  );
  border-left: 3px solid var(--col-accent);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.portfolio-board-col-header.is-board-col-header-sticky {
  --portfolio-sticky-header-radius: var(--shape-lg, 16px);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 40;
  isolation: isolate;
  overflow: hidden;
  clip-path: inset(
    0 round var(--portfolio-sticky-header-radius) var(--portfolio-sticky-header-radius) 0 0
  );
}

/* Keep one opaque screen-space layer underneath every fixed header. It hides
   both the rounded corner cut-outs and any gap below the top app bar while the
   columns continue scrolling behind them. */
body.portfolio-board-has-sticky-headers::before {
  content: "";
  position: fixed;
  z-index: 39;
  top: 0;
  right: 0;
  left: 0;
  height: calc(
    var(--portfolio-board-sticky-top, 0px) +
      var(--portfolio-sticky-header-radius, var(--shape-lg, 16px))
  );
  pointer-events: none;
  background: var(--bg);
}

.portfolio-board-col-header-spacer {
  flex: 0 0 auto;
  display: block;
  width: 100%;
  height: 0;
}
.portfolio-board-col-emoji {
  font-size: 1.15rem;
  line-height: 1;
}
.portfolio-board-col-title {
  font-size: 0.93rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  flex: 1 1 auto;
}
.portfolio-board-col-count {
  min-width: 1.55rem;
  padding: 0.1rem 0.42rem;
  border-radius: 999px;
  color: #e5eef8;
  text-align: center;
  font-size: 0.72rem;
  font-weight: 700;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
}
.portfolio-board-auto-tag,
.portfolio-board-manual-tag {
  font-size: 0.65rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.12rem 0.4rem;
  border-radius: 999px;
  margin-left: auto;
}
.portfolio-board-auto-tag {
  color: #bfe9ff;
  background: rgba(29, 155, 240, 0.18);
  border: 1px solid rgba(124, 200, 248, 0.35);
}
.portfolio-board-manual-tag {
  color: var(--muted);
  border: 1px solid var(--border);
  background: rgba(0, 0, 0, 0.2);
}
.portfolio-board-col-collapse {
  width: 100%;
  margin-top: 0.15rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  padding: 0.28rem 0.5rem;
  color: #cbd5e1;
  background: rgba(0, 0, 0, 0.22);
  font-size: 0.72rem;
  font-weight: 700;
  cursor: pointer;
}
.portfolio-board-col-collapse:hover {
  color: #ffffff;
  border-color: var(--col-accent);
  background: var(--col-accent-dim);
}

.portfolio-board-col-body {
  flex: 1 1 auto;
  min-height: 26rem;
  border-radius: 0 0 10px 10px;
  padding: 0.45rem 0.45rem 0.15rem;
}
.portfolio-board-col.is-collapsed {
  flex-basis: 11rem;
}
.portfolio-board-col.is-collapsed .portfolio-board-col-body {
  min-height: 12rem;
  display: flex;
  align-items: stretch;
}
.portfolio-board-collapsed-placeholder {
  width: 100%;
  min-height: 10rem;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  border: 1px dashed rgba(255, 255, 255, 0.14);
  border-radius: 10px;
  padding: 0.75rem;
  color: var(--muted);
  background: rgba(0, 0, 0, 0.16);
  text-align: center;
  font-size: 0.78rem;
  line-height: 1.35;
}
.portfolio-board-col.is-drag-over,
.portfolio-board-col-body.is-drag-over {
  outline: 2px dashed var(--col-accent);
  outline-offset: 2px;
  background: var(--col-accent-dim);
}

/* Карточка на доске */
.portfolio-board-card {
  position: relative;
  border-radius: 12px;
  margin-bottom: 0.5rem;
  cursor: grab;
  overflow: hidden;
  border: 1px solid rgba(56, 68, 77, 0.75);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.22);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.portfolio-board-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
  border-color: rgba(124, 200, 248, 0.35);
}
.portfolio-board-card:active {
  cursor: grabbing;
}
.portfolio-board-card.is-dragging {
  opacity: 0.65;
  transform: scale(0.98);
}
.portfolio-board-card.is-highlighted {
  box-shadow: 0 0 0 2px var(--accent), 0 8px 28px rgba(29, 155, 240, 0.25);
}
.portfolio-board-card--asc-tracking-broken {
  border-color: rgba(248, 113, 113, 0.78);
  box-shadow:
    0 0 0 1px rgba(248, 113, 113, 0.2),
    0 8px 26px rgba(127, 29, 29, 0.24);
}
.portfolio-board-card--asc-tracking-broken:hover {
  border-color: rgba(252, 165, 165, 0.9);
  box-shadow:
    0 0 0 1px rgba(248, 113, 113, 0.28),
    0 12px 34px rgba(127, 29, 29, 0.3);
}

.portfolio-board-launch-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  margin-bottom: 0.65rem;
  padding: 0.78rem;
  overflow: hidden;
  border-radius: 12px;
  border: 1px solid rgba(45, 212, 191, 0.55);
  color: #ecfeff;
  text-decoration: none;
  background:
    linear-gradient(135deg, rgba(6, 78, 59, 0.96) 0%, rgba(14, 116, 144, 0.76) 52%, rgba(30, 41, 59, 0.95) 100%),
    #123238;
  box-shadow:
    0 10px 32px rgba(20, 184, 166, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.portfolio-board-launch-card:hover,
.portfolio-board-launch-card:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(110, 231, 183, 0.86);
  color: #ffffff;
  outline: none;
  box-shadow:
    0 16px 38px rgba(20, 184, 166, 0.28),
    0 0 0 1px rgba(167, 243, 208, 0.2) inset;
}
.portfolio-board-launch-card-glow {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(250, 204, 21, 0.22), transparent 38%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.12), transparent 45%);
}
.portfolio-board-launch-card-head,
.portfolio-board-launch-card-description,
.portfolio-board-launch-card-manager,
.portfolio-board-launch-card-cta {
  position: relative;
  z-index: 1;
}
.portfolio-board-launch-card-head {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.portfolio-board-launch-card-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 2.35rem;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 10px;
  color: #042f2e;
  background: linear-gradient(135deg, #fef08a, #5eead4);
  font-size: 1.85rem;
  line-height: 1;
  font-weight: 800;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.28);
}
.portfolio-board-launch-card-titlewrap {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
}
.portfolio-board-launch-card-eyebrow {
  color: rgba(204, 251, 241, 0.82);
  font-size: 0.68rem;
  line-height: 1.15;
  font-weight: 800;
}
.portfolio-board-launch-card-title {
  color: inherit;
  font-size: 1rem;
  line-height: 1.15;
}
.portfolio-board-launch-card-description {
  color: rgba(236, 254, 255, 0.86);
  font-size: 0.74rem;
  line-height: 1.35;
}
.portfolio-board-launch-card-manager {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 1.35rem;
  padding: 0.16rem 0.44rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-radius: 999px;
  color: #d1fae5;
  background: rgba(15, 23, 42, 0.3);
  border: 1px solid rgba(204, 251, 241, 0.22);
  font-size: 0.7rem;
  font-weight: 800;
}
.portfolio-board-launch-card-cta {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  min-height: 2rem;
  padding: 0.42rem 0.55rem;
  border-radius: 9px;
  color: #042f2e;
  background: rgba(240, 253, 250, 0.94);
  font-size: 0.76rem;
  font-weight: 800;
}
.portfolio-board-launch-card-cta-icon {
  font-size: 1.1rem;
  line-height: 1;
}

.portfolio-board-card-bg {
  position: absolute;
  inset: -12%;
  background-position: center;
  background-size: cover;
  opacity: 0.28;
  filter: saturate(1.15) blur(0.5px);
  transform: scale(1.05);
}
.portfolio-board-card-bg--empty {
  opacity: 1;
  background: radial-gradient(circle at 30% 20%, rgba(29, 155, 240, 0.18), transparent 55%),
    radial-gradient(circle at 80% 80%, rgba(139, 92, 246, 0.12), transparent 45%),
    linear-gradient(145deg, #1a2431 0%, #121920 100%);
}
.portfolio-board-card-scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    165deg,
    rgba(15, 20, 25, 0.35) 0%,
    rgba(15, 20, 25, 0.82) 55%,
    rgba(15, 20, 25, 0.94) 100%
  );
  pointer-events: none;
}

.portfolio-board-card-content {
  position: relative;
  z-index: 1;
  padding: 0.55rem 0.6rem 0.45rem;
}
.portfolio-board-card-content:has(.portfolio-board-card-menu[open]) {
  z-index: 4;
}
.portfolio-board-card-top {
  display: flex;
  gap: 0.55rem;
  align-items: flex-start;
}
.portfolio-board-card-thumb {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  object-fit: cover;
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}
.portfolio-board-card-thumb--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  font-size: 1.25rem;
  background: rgba(29, 155, 240, 0.12);
  border: 1px dashed rgba(124, 200, 248, 0.35);
}
.portfolio-board-card-text {
  min-width: 0;
  flex: 1;
}
.portfolio-board-card-title {
  font-weight: 700;
  font-size: 0.88rem;
  line-height: 1.25;
  padding-right: 2.9rem;
}
.portfolio-board-card--has-top-iap .portfolio-board-card-title {
  padding-right: 5.85rem;
}
.portfolio-board-card--has-top-alert .portfolio-board-card-title {
  padding-right: 4.5rem;
}
.portfolio-board-card--has-top-alert.portfolio-board-card--has-top-iap .portfolio-board-card-title {
  padding-right: 7.25rem;
}
.portfolio-board-card-id {
  font-family: ui-monospace, monospace;
  font-weight: 600;
  font-size: 0.76rem;
  color: rgba(180, 215, 248, 0.95);
  margin-right: 0.2rem;
}
.portfolio-board-card-id-link {
  display: inline-flex;
  align-items: center;
  border-radius: 0.25rem;
  padding-inline: 0.12rem;
  margin-left: -0.12rem;
  text-decoration: none;
  text-underline-offset: 0.14em;
  cursor: pointer;
  transition: color 140ms ease, background-color 140ms ease, box-shadow 140ms ease;
}
.portfolio-board-card-id-link:hover {
  color: #eef7ff;
  background: rgba(124, 200, 248, 0.12);
  text-decoration: underline;
}
.portfolio-board-card-id-link:focus-visible {
  color: #eef7ff;
  background: rgba(124, 200, 248, 0.14);
  outline: none;
  box-shadow: 0 0 0 2px rgba(124, 200, 248, 0.46);
}
.portfolio-board-card-meta {
  font-size: 0.74rem;
  display: flex;
  flex-direction: column;
  gap: 0.24rem;
  margin-top: 0.28rem;
  line-height: 1.35;
  color: var(--muted);
}
.portfolio-board-card-badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.24rem;
  max-width: 100%;
}
.portfolio-board-card-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  max-width: 100%;
  min-height: 1.25rem;
  padding: 0.1rem 0.42rem;
  border-radius: 999px;
  font-size: 0.66rem;
  font-weight: 800;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.portfolio-board-card-badge--platform {
  color: #dbeafe;
  border: 1px solid rgba(148, 163, 184, 0.34);
  background: rgba(30, 41, 59, 0.72);
}
.portfolio-board-card-badge--platform-swiftui {
  color: #bae6fd;
  border-color: rgba(56, 189, 248, 0.42);
  background: rgba(8, 47, 73, 0.62);
}
.portfolio-board-card-badge--platform-local-web-swift {
  color: #ddd6fe;
  border-color: rgba(167, 139, 250, 0.42);
  background: rgba(59, 7, 100, 0.54);
}
.portfolio-board-card-badge--platform-flutter {
  color: #ccfbf1;
  border-color: rgba(45, 212, 191, 0.4);
  background: rgba(19, 78, 74, 0.56);
}
.portfolio-board-card-badge--platform-react-native {
  color: #e0f2fe;
  border-color: rgba(125, 211, 252, 0.4);
  background: rgba(12, 74, 110, 0.54);
}
.portfolio-board-card-badge--platform-kmp {
  color: #fed7aa;
  border-color: rgba(251, 146, 60, 0.4);
  background: rgba(124, 45, 18, 0.5);
}
.portfolio-board-card-badge--locale {
  font-family: ui-monospace, monospace;
  color: #bfdbfe;
  border: 1px solid rgba(96, 165, 250, 0.36);
  background: rgba(30, 58, 138, 0.38);
}
.portfolio-board-card-badge--locale-all {
  color: #e0e7ff;
  border-color: rgba(129, 140, 248, 0.38);
  background: rgba(49, 46, 129, 0.42);
}
.portfolio-board-card-badge--unit {
  max-width: 9.5rem;
}
.pill.portfolio-board-card-badge--iap {
  width: 1.55rem;
  min-width: 1.55rem;
  max-width: 1.55rem;
  height: 1.38rem;
  min-height: 1.38rem;
  padding: 0;
  color: #ffd34d;
  border: 1px solid rgba(250, 204, 21, 0.55);
  background: rgba(80, 45, 8, 0.78);
  box-shadow:
    0 0 0 1px rgba(250, 204, 21, 0.12) inset,
    0 0.25rem 0.7rem rgba(250, 204, 21, 0.08);
}
.portfolio-board-card-iap-icon {
  display: block;
  flex: 0 0 1.05rem;
  width: 1.05rem;
  height: 1.05rem;
}
.portfolio-board-card-iap-icon-wallet {
  fill: currentColor;
}
.portfolio-board-card-iap-icon-pocket {
  fill: rgba(61, 34, 5, 0.92);
}
.portfolio-board-card-iap-icon-dot {
  fill: #ffe58a;
}
.portfolio-board-card-badge--asc {
  max-width: 11rem;
  color: #dbeafe;
  border: 1px solid rgba(148, 163, 184, 0.34);
  background: rgba(15, 23, 42, 0.58);
}
.portfolio-board-card-badge--asc-published,
.portfolio-board-card-badge--asc-ready-for-sale {
  color: #bbf7d0;
  border-color: rgba(74, 222, 128, 0.4);
  background: rgba(20, 83, 45, 0.5);
}
.portfolio-board-card-badge--asc-in-review {
  color: #fde68a;
  border-color: rgba(250, 204, 21, 0.42);
  background: rgba(113, 63, 18, 0.48);
}
.portfolio-board-card-badge--asc-rejected,
.portfolio-board-card-badge--asc-removed {
  color: #fecaca;
  border-color: rgba(248, 113, 113, 0.44);
  background: rgba(127, 29, 29, 0.48);
}
.portfolio-board-card-badge--reason {
  display: inline-block;
  max-width: 9.75rem;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}
.portfolio-board-card-secondary {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: rgba(203, 213, 225, 0.86);
  font-size: 0.72rem;
  font-weight: 650;
}
.portfolio-board-card-secondary--people,
.portfolio-board-card-secondary--info {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.2rem 0.32rem;
  white-space: normal;
}
.portfolio-board-card-secondary--email {
  display: flex;
  align-items: center;
}
.portfolio-board-card-secondary-item,
.portfolio-board-card-platform-text {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.portfolio-board-card-secondary-item--unit {
  color: rgba(186, 230, 253, 0.9);
}
.portfolio-board-card-secondary-sep {
  color: rgba(148, 163, 184, 0.74);
  flex: 0 0 auto;
}
.portfolio-board-card-platform-text {
  color: rgba(203, 213, 225, 0.82);
  font-size: 0.69rem;
  font-weight: 700;
}
.portfolio-board-card-revenue-text {
  flex: 0 0 auto;
  font-size: 0.68rem;
  font-weight: 800;
  line-height: 1.2;
  color: rgba(203, 213, 225, 0.82);
}
.portfolio-board-card-revenue-text--profit {
  color: #6ee7a5;
}
.portfolio-board-card-revenue-text--error {
  color: #fca5a5;
}
.portfolio-board-card-reason {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.25rem;
  margin-top: 0.3rem;
  font-size: 0.68rem;
  line-height: 1.3;
}
.portfolio-board-card-reason-k {
  color: rgba(139, 152, 165, 0.95);
  font-weight: 600;
  flex-shrink: 0;
}
.portfolio-board-card-reason-pill {
  max-width: 100%;
}
.portfolio-board-card-fw {
  color: #7cc8f8;
  font-weight: 600;
}
.portfolio-board-card-coverage {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: rgba(139, 152, 165, 0.92);
  font-size: 0.7rem;
}
.portfolio-board-card-locales {
  display: inline-flex;
  flex-wrap: wrap;
  max-width: 100%;
  gap: 0.22rem;
  margin-top: 0.12rem;
  vertical-align: middle;
}
.portfolio-board-card-locale-summary {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  max-width: 100%;
  gap: 0.18rem 0.3rem;
  color: rgba(214, 226, 236, 0.92);
  font-size: 0.69rem;
  line-height: 1.25;
}
.portfolio-board-card-locale-label {
  color: rgba(148, 163, 184, 0.95);
  font-size: 0.64rem;
  font-weight: 800;
  text-transform: uppercase;
}
.portfolio-board-card-locale-code {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: ui-monospace, monospace;
  font-size: 0.68rem;
  font-weight: 800;
  color: rgba(191, 219, 254, 0.98);
}
.portfolio-board-card-hard-locales {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.18rem 0.28rem;
  min-width: 0;
}
.portfolio-board-card-locale-sep {
  color: rgba(148, 163, 184, 0.68);
}
.portfolio-board-card-locale-all,
.portfolio-board-card-hard-more {
  color: rgba(203, 213, 225, 0.88);
  font-size: 0.68rem;
  font-weight: 800;
}
.portfolio-locale-chip {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 1.18rem;
  gap: 0.22rem;
  padding: 0.08rem 0.34rem 0.08rem 0.12rem;
  border: 1px solid rgba(82, 96, 107, 0.86);
  border-radius: 7px;
  background: rgba(15, 23, 32, 0.74);
  color: rgba(214, 226, 236, 0.95);
  font-size: 0.68rem;
  line-height: 1.1;
  white-space: nowrap;
}
.portfolio-locale-chip--light {
  border-color: rgba(56, 189, 248, 0.36);
  background: rgba(8, 47, 73, 0.42);
}
.portfolio-locale-chip--hard {
  border-color: rgba(244, 114, 182, 0.38);
  background: rgba(80, 7, 36, 0.34);
}
.portfolio-locale-chip--all,
.portfolio-locale-chip--more {
  padding-left: 0.34rem;
  color: #c8d7e2;
}
.portfolio-locale-chip-variant {
  display: inline-grid;
  place-items: center;
  min-width: 1rem;
  height: 1rem;
  border-radius: 5px;
  color: #06111b;
  background: rgba(186, 230, 253, 0.95);
  font-size: 0.6rem;
  font-weight: 800;
}
.portfolio-locale-chip--hard .portfolio-locale-chip-variant {
  background: rgba(251, 207, 232, 0.96);
}
.portfolio-locale-chip-code {
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: ui-monospace, monospace;
  font-weight: 700;
}
.portfolio-locale-chip-state {
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.8);
}
.portfolio-locale-chip.is-localized .portfolio-locale-chip-state {
  background: #4ade80;
  box-shadow: 0 0 0 2px rgba(74, 222, 128, 0.16);
}
.portfolio-locale-chip.is-unlocalized .portfolio-locale-chip-state {
  background: #fbbf24;
  box-shadow: 0 0 0 2px rgba(251, 191, 36, 0.14);
}
.portfolio-board-card-apple-link {
  display: inline-flex;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  color: #9fd6ff;
  font-weight: 700;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.portfolio-board-card-account-flag {
  display: inline-block;
  flex: 0 0 auto;
  margin-right: 0.3rem;
  font-size: 0.88rem;
  line-height: 1;
  vertical-align: -0.08em;
}
.portfolio-board-card-apple-link:hover,
.portfolio-board-card-apple-link:focus-visible {
  color: #d7efff;
  text-decoration: underline;
  outline: none;
}
.portfolio-board-card-top-actions {
  position: absolute;
  top: 0.48rem;
  right: 0.5rem;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.24rem;
  max-width: calc(100% - 1rem);
}
.portfolio-board-card-top-actions .portfolio-board-card-webview-pill {
  flex: 0 0 auto;
}
.portfolio-board-card-top-actions .portfolio-board-card-badge--iap {
  flex: 0 0 auto;
}
.portfolio-board-card-asc-broken {
  display: inline-grid;
  place-items: center;
  flex: 0 0 1.55rem;
  width: 1.55rem;
  height: 1.38rem;
  border: 1px solid rgba(248, 113, 113, 0.68);
  border-radius: 999px;
  color: #fee2e2;
  background: rgba(127, 29, 29, 0.84);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1;
  box-shadow:
    0 0 0 1px rgba(254, 202, 202, 0.14) inset,
    0 0.35rem 0.85rem rgba(127, 29, 29, 0.28);
}
.portfolio-board-card-asc {
  margin-top: 0.45rem;
}
.portfolio-board-card-status-row {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 0.26rem;
}
.portfolio-board-card-menu {
  position: relative;
  z-index: 8;
  flex: 0 0 auto;
  margin-left: auto;
}
.portfolio-board-card-direct-actions {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.18rem;
  margin-left: auto;
}
.portfolio-board-card-direct-action {
  display: inline-grid;
  flex: 0 0 auto;
  width: 1.45rem;
  height: 1.45rem;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 999px;
  color: var(--muted);
  background: transparent;
  text-decoration: none;
  transition: border-color 140ms ease, background-color 140ms ease, color 140ms ease;
}
.portfolio-board-card-direct-action svg {
  display: block;
  width: 0.82rem;
  height: 0.82rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}
.portfolio-board-card-direct-action:hover,
.portfolio-board-card-direct-action:focus-visible {
  border-color: rgba(124, 200, 248, 0.5);
  color: #eef7ff;
  background: rgba(29, 155, 240, 0.2);
  outline: none;
}
.portfolio-board-card-direct-action:focus-visible {
  box-shadow: 0 0 0 2px rgba(124, 200, 248, 0.18);
}
.portfolio-board-card-direct-action--push {
  display: inline-flex;
  width: auto;
  gap: 0.22rem;
  padding: 0.1rem 0.18rem 0.1rem 0.42rem;
  border-color: rgba(124, 200, 248, 0.24);
  color: #dbeafe;
  background: rgba(29, 155, 240, 0.1);
  font-size: 0.62rem;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}
.portfolio-board-card-direct-action--push strong {
  display: inline-grid;
  min-width: 1rem;
  height: 1rem;
  padding: 0 0.18rem;
  place-items: center;
  border-radius: 999px;
  color: #eef7ff;
  background: rgba(124, 200, 248, 0.16);
  font-variant-numeric: tabular-nums;
}
.portfolio-board-card-menu > summary {
  display: inline-grid;
  width: 1.45rem;
  height: 1.45rem;
  place-items: center;
  list-style: none;
  border: 1px solid transparent;
  border-radius: 999px;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
  transition: border-color 140ms ease, background-color 140ms ease, color 140ms ease;
}
.portfolio-board-card-menu > summary::-webkit-details-marker {
  display: none;
}
.portfolio-board-card-menu > summary::marker {
  content: "";
}
.portfolio-board-card-menu > summary svg {
  display: block;
  width: 0.82rem;
  height: 0.82rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-width: 1.8;
}
.portfolio-board-card-menu > summary:hover,
.portfolio-board-card-menu > summary:focus-visible,
.portfolio-board-card-menu[open] > summary {
  border-color: rgba(124, 200, 248, 0.58);
  color: #eef7ff;
  background: rgba(29, 155, 240, 0.24);
  outline: none;
}
.portfolio-board-card-menu > summary:focus-visible {
  box-shadow: 0 0 0 2px rgba(124, 200, 248, 0.18);
}
.portfolio-board-card-menu-list {
  position: absolute;
  right: 0;
  bottom: calc(100% + 0.34rem);
  z-index: 12;
  display: grid;
  min-width: 10.8rem;
  gap: 0.15rem;
  padding: 0.35rem;
  border: 1px solid rgba(56, 68, 77, 0.82);
  border-radius: 0.72rem;
  background: var(--theme-top-bg-elevated);
  box-shadow: 0 0.85rem 2rem var(--theme-shadow-strong);
  animation: portfolio-board-card-menu-in 170ms cubic-bezier(0.2, 0, 0, 1) both;
}
.portfolio-board-card-menu-item {
  display: grid;
  grid-template-columns: 1rem minmax(0, 1fr) auto;
  align-items: center;
  width: 100%;
  min-height: 2rem;
  gap: 0.55rem;
  padding: 0.38rem 0.55rem;
  border: 1px solid transparent;
  border-radius: 0.55rem;
  color: var(--muted);
  background: transparent;
  font-size: 0.66rem;
  font-weight: 800;
  line-height: 1.15;
  text-decoration: none;
  white-space: nowrap;
}
.portfolio-board-card-menu-item:hover,
.portfolio-board-card-menu-item:focus-visible {
  border-color: rgba(74, 92, 106, 0.75);
  color: var(--fg);
  background: var(--theme-nav-hover-bg);
  outline: none;
}
.portfolio-board-card-menu-item:focus-visible {
  box-shadow: inset 0 0 0 1px rgba(124, 200, 248, 0.34);
}
.portfolio-board-card-menu-item svg {
  display: block;
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}
.portfolio-board-card-menu-meta {
  color: rgba(191, 219, 254, 0.82);
  font-size: 0.6rem;
  font-weight: 850;
  font-variant-numeric: tabular-nums;
}
@keyframes portfolio-board-card-menu-in {
  from {
    opacity: 0;
    transform: translateY(0.3rem) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
.portfolio-board-card-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  max-width: 100%;
  font-size: 0.68rem;
  font-weight: 600;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  background: rgba(29, 155, 240, 0.18);
  border: 1px solid rgba(124, 200, 248, 0.28);
  color: #dbeafe;
  white-space: nowrap;
}
.portfolio-board-card-asc-refresh {
  appearance: none;
  -webkit-appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.34rem;
  border: 1px solid currentColor;
  font: inherit;
  line-height: 1;
  cursor: pointer;
}
.portfolio-board-card-asc-refresh:hover:not(:disabled),
.portfolio-board-card-asc-refresh:focus-visible {
  filter: brightness(1.08);
  outline: none;
}
.portfolio-board-card-asc-refresh:disabled {
  cursor: wait;
  opacity: 0.7;
}
.portfolio-board-card-asc-refresh-icon {
  flex: 0 0 auto;
  font-size: 0.82rem;
  font-weight: 900;
  line-height: 1;
}
.portfolio-board-card-asc-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.portfolio-board-card-refresh-status {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.68rem;
  color: var(--muted);
}
.portfolio-board-card-refresh-status[data-kind="running"] {
  color: #8fc1ff;
}
.portfolio-board-card-refresh-status[data-kind="ok"] {
  color: #7ee4a1;
}
.portfolio-board-card-refresh-status[data-kind="error"] {
  color: #ff9b9b;
}
.portfolio-board-age {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 0.92rem;
  min-height: 0.92rem;
  margin-left: 0;
}
.portfolio-board-age-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0.92rem;
  height: 0.92rem;
  padding: 0 0.24rem;
  border-radius: 999px;
  border: 1px solid currentColor;
  background: color-mix(in srgb, currentColor 16%, transparent);
  font-size: 0.62rem;
  line-height: 1;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: currentColor;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.portfolio-board-age--day-1 {
  color: #22c55e;
}
.portfolio-board-age--day-2 {
  color: #84cc16;
}
.portfolio-board-age--day-3 {
  color: #eab308;
}
.portfolio-board-age--day-4 {
  color: #f97316;
}
.portfolio-board-age--day-5,
.portfolio-board-age--bar {
  color: #ef4444;
}
.portfolio-board-card[data-asc-status="published"] .portfolio-board-card-pill {
  background: rgba(34, 197, 94, 0.18);
  border-color: rgba(74, 222, 128, 0.35);
  color: #bbf7d0;
}
.portfolio-board-card[data-asc-status="in_review"] .portfolio-board-card-pill {
  background: rgba(234, 179, 8, 0.18);
  border-color: rgba(253, 224, 71, 0.35);
  color: #fef08a;
}
.portfolio-board-card[data-asc-status="rejected"] .portfolio-board-card-pill,
.portfolio-board-card[data-asc-status="removed"] .portfolio-board-card-pill {
  background: rgba(244, 63, 94, 0.18);
  border-color: rgba(251, 113, 133, 0.35);
  color: #fecdd3;
}
.portfolio-board-card[data-asc-tracking-broken="1"] .portfolio-board-card-asc-refresh {
  background: rgba(127, 29, 29, 0.64);
  border-color: rgba(248, 113, 113, 0.68);
  color: #fee2e2;
}
.portfolio-board-card[data-asc-status] .portfolio-board-card-asc-status--sales-closed,
.portfolio-board-card-asc-status--sales-closed {
  background: rgba(244, 63, 94, 0.22);
  border-color: rgba(251, 113, 133, 0.58);
  color: #fecdd3;
}
.portfolio-board-card[data-asc-tracking-broken="1"] .portfolio-board-card-asc-status--tracking-paused,
.portfolio-board-card-asc-status--tracking-error,
.portfolio-board-card-asc-status--tracking-paused {
  background: rgba(249, 115, 22, 0.22);
  border-color: rgba(251, 146, 60, 0.60);
  color: #fed7aa;
}
/* Модальное окно карточки (центр экрана) */
.portfolio-modal {
  position: fixed;
  inset: 0;
  z-index: 260;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(1rem, env(safe-area-inset-bottom));
}

.portfolio-modal-backdrop {
  position: absolute;
  inset: 0;
  background: linear-gradient(145deg, rgba(8, 12, 18, 0.88) 0%, rgba(15, 22, 32, 0.92) 45%, rgba(29, 155, 240, 0.06) 100%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.portfolio-modal-dialog {
  position: relative;
  z-index: 1;
  width: min(540px, calc(100vw - 2rem));
  height: min(88vh, 860px);
  height: min(88dvh, 860px);
  max-height: calc(100vh - 2rem);
  max-height: calc(100dvh - 2rem);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  border-radius: 18px;
  overflow: hidden;
  background: linear-gradient(180deg, #1b2735 0%, #121920 42%, #0f1419 100%);
  border: 1px solid rgba(124, 200, 248, 0.28);
  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.65),
    0 0 0 1px rgba(255, 255, 255, 0.06) inset,
    0 -20px 60px rgba(29, 155, 240, 0.06) inset;
}

.portfolio-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 0.5rem;
  padding: 0;
  flex-shrink: 0;
  position: relative;
  width: 100%;
}
.portfolio-modal-header-main {
  flex: 1;
  min-width: 0;
  position: relative;
  overflow: hidden;
}

.portfolio-modal-loading-hero {
  box-sizing: border-box;
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  min-height: 6.5rem;
  padding: 1rem 3rem 1rem 1.1rem;
  background: linear-gradient(180deg, rgba(18, 26, 36, 0.45) 0%, rgba(18, 26, 36, 0.92) 70%, rgba(18, 26, 36, 1) 100%);
}

.portfolio-modal-loading-icon {
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  border: 2px solid rgba(124, 200, 248, 0.22);
  border-radius: 16px;
  background: rgba(124, 200, 248, 0.1);
}

.portfolio-modal-loading-copy {
  display: grid;
  min-width: 0;
  gap: 0.7rem;
  padding-top: 0.15rem;
}

.portfolio-modal-loading-line {
  display: block;
  width: min(13rem, 42vw);
  height: 0.65rem;
  border-radius: 999px;
  background: rgba(124, 200, 248, 0.12);
}

.portfolio-modal-hero-bg {
  position: absolute;
  inset: 0;
  opacity: 0.35;
  background-position: center;
  background-size: cover;
  filter: saturate(1.1);
}
.portfolio-modal-hero-bg--empty {
  opacity: 1;
  background: radial-gradient(circle at 20% 30%, rgba(29, 155, 240, 0.25), transparent 55%),
    radial-gradient(circle at 90% 70%, rgba(139, 92, 246, 0.18), transparent 50%),
    linear-gradient(165deg, #1e3a5f 0%, #15202b 55%);
}
.portfolio-modal-hero-inner {
  position: relative;
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  padding: 1rem 3rem 1rem 1.1rem;
  background: linear-gradient(180deg, rgba(18, 26, 36, 0.45) 0%, rgba(18, 26, 36, 0.92) 70%, rgba(18, 26, 36, 1) 100%);
}
.portfolio-modal-app-icon {
  flex-shrink: 0;
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  border: 2px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
}
.portfolio-modal-app-icon--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  background: rgba(29, 155, 240, 0.12);
  border: 2px dashed rgba(124, 200, 248, 0.35);
}
.portfolio-modal-hero-text {
  min-width: 0;
}
.portfolio-modal-title {
  margin: 0 0 0.35rem 0;
  font-size: 1.2rem;
  line-height: 1.25;
}
.portfolio-modal-run-id {
  font-family: ui-monospace, monospace;
  font-weight: 600;
  font-size: 0.92em;
  color: rgba(165, 215, 252, 0.96);
  margin-right: 0.35rem;
}
/* Карусель скриншотов в модалке доски: один ряд, без высокой сетки */
.portfolio-modal-section-screenshots {
  --portfolio-screenshots-content-height: 13.35rem;
  --portfolio-screenshots-image-height: 11rem;
}
#portfolio-screenshots-content {
  min-height: var(--portfolio-screenshots-content-height);
}
.portfolio-screenshots-placeholder {
  min-height: var(--portfolio-screenshots-content-height);
  display: flex;
  align-items: center;
  padding: 0.85rem;
  margin-top: 0.65rem;
  border: 1px dashed rgba(124, 200, 248, 0.24);
  border-radius: 8px;
  background: rgba(13, 18, 24, 0.55);
}
.step-graphics-grid.portfolio-board-screenshots-carousel {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0.65rem;
  margin-top: 0.65rem;
  min-height: var(--portfolio-screenshots-content-height);
  padding-bottom: 0.35rem;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: rgba(124, 200, 248, 0.45) rgba(15, 20, 25, 0.35);
}
.step-graphics-grid.portfolio-board-screenshots-carousel::-webkit-scrollbar {
  height: 7px;
}
.step-graphics-grid.portfolio-board-screenshots-carousel::-webkit-scrollbar-thumb {
  background: rgba(124, 200, 248, 0.4);
  border-radius: 4px;
}
.step-graphics-grid.portfolio-board-screenshots-carousel .step-graphics-item {
  flex: 0 0 auto;
  --shot-ratio: 0.46;
  width: clamp(6.4rem, calc(var(--portfolio-screenshots-image-height) * var(--shot-ratio)), min(44vw, 18rem));
  min-width: 6.4rem;
  height: auto;
  max-width: min(44vw, 18rem);
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
}
.step-graphics-grid.portfolio-board-screenshots-carousel .step-graphics-item a,
.step-graphics-grid.portfolio-board-screenshots-carousel .step-graphics-item > video {
  flex: 0 0 auto;
  height: var(--portfolio-screenshots-image-height);
  min-height: var(--portfolio-screenshots-image-height);
  width: 100%;
  aspect-ratio: var(--shot-ratio);
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0d1218;
  overflow: hidden;
}
.step-graphics-grid.portfolio-board-screenshots-carousel .step-graphics-item img,
.step-graphics-grid.portfolio-board-screenshots-carousel .step-graphics-item > video {
  width: 100%;
  object-fit: contain;
}
.step-graphics-grid.portfolio-board-screenshots-carousel .step-graphics-item img {
  height: 100%;
}
.step-graphics-grid.portfolio-board-screenshots-carousel .step-graphics-item > video {
  height: var(--portfolio-screenshots-image-height);
}
.step-graphics-grid.portfolio-board-screenshots-carousel .step-graphics-caption {
  flex-shrink: 0;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0.25rem 0.35rem;
  font-size: 0.68rem;
}
.portfolio-modal-subtitle {
  margin: 0 0 0.45rem 0;
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.4;
}
.portfolio-modal-badges {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin: 0;
}
.portfolio-modal-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.76rem;
  font-weight: 600;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  background: rgba(29, 155, 240, 0.16);
  border: 1px solid rgba(124, 200, 248, 0.28);
  color: #bae6fd;
}
.portfolio-modal-asc-refresh {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  border: 1px solid rgba(124, 200, 248, 0.28);
  border-radius: 999px;
  background: rgba(15, 23, 32, 0.72);
  color: #dbeafe;
  font-size: 0.84rem;
  line-height: 1;
  cursor: pointer;
}
.portfolio-modal-asc-refresh:hover:not(:disabled),
.portfolio-modal-asc-refresh:focus-visible {
  background: rgba(29, 155, 240, 0.24);
  border-color: rgba(124, 200, 248, 0.55);
  outline: none;
}
.portfolio-modal-asc-refresh:disabled {
  cursor: wait;
  opacity: 0.72;
}
.portfolio-modal-asc-broken {
  display: inline-grid;
  place-items: center;
  width: 1.65rem;
  height: 1.65rem;
  border: 1px solid rgba(248, 113, 113, 0.68);
  border-radius: 999px;
  color: #fee2e2;
  background: rgba(127, 29, 29, 0.78);
  font-size: 1.02rem;
  font-weight: 950;
  line-height: 1;
}
.portfolio-modal-refresh-status {
  font-size: 0.74rem;
  color: var(--muted);
}
.portfolio-modal-refresh-status[data-kind="running"] {
  color: #8fc1ff;
}
.portfolio-modal-refresh-status[data-kind="ok"] {
  color: #7ee4a1;
}
.portfolio-modal-refresh-status[data-kind="error"] {
  color: #ff9b9b;
}

.portfolio-modal-close {
  position: absolute;
  top: 0.55rem;
  right: 0.55rem;
  z-index: 4;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(15, 20, 25, 0.75);
  color: var(--fg);
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.portfolio-modal-close:hover {
  background: rgba(244, 33, 46, 0.25);
  border-color: rgba(251, 113, 133, 0.45);
}

.portfolio-action-hint-modal {
  position: fixed;
  inset: 0;
  z-index: 270;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(0.75rem, env(safe-area-inset-top)) 1rem max(0.75rem, env(safe-area-inset-bottom));
}

.portfolio-action-hint-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(8, 12, 18, 0.76);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  opacity: 0;
}

.portfolio-action-hint-dialog {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: min(440px, calc(100vw - 2rem));
  max-height: calc(100vh - 1.5rem);
  max-height: calc(100dvh - 1.5rem);
  border-radius: 12px;
  border: 1px solid rgba(124, 200, 248, 0.3);
  background: linear-gradient(180deg, #1b2735 0%, #121920 58%, #10161d 100%);
  box-shadow:
    0 22px 70px rgba(0, 0, 0, 0.58),
    0 0 0 1px rgba(255, 255, 255, 0.05) inset;
  padding: 1.15rem;
  color: var(--fg);
  overflow: hidden;
  opacity: 0;
  transform: translateY(10px) scale(0.985);
}

.portfolio-action-hint-modal.is-open .portfolio-action-hint-backdrop {
  animation: portfolio-action-hint-backdrop-in 160ms ease-out forwards;
}

.portfolio-action-hint-modal.is-open .portfolio-action-hint-dialog {
  animation: portfolio-action-hint-dialog-in 190ms cubic-bezier(0.2, 0.9, 0.25, 1) forwards;
}

.portfolio-action-hint-modal.is-closing .portfolio-action-hint-backdrop {
  animation: portfolio-action-hint-backdrop-out 140ms ease-in forwards;
}

.portfolio-action-hint-modal.is-closing .portfolio-action-hint-dialog {
  animation: portfolio-action-hint-dialog-out 140ms ease-in forwards;
}

@keyframes portfolio-action-hint-backdrop-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes portfolio-action-hint-backdrop-out {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes portfolio-action-hint-dialog-in {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes portfolio-action-hint-dialog-out {
  from {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  to {
    opacity: 0;
    transform: translateY(8px) scale(0.99);
  }
}

.portfolio-action-hint-close {
  position: absolute;
  top: 0.6rem;
  right: 0.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  background: rgba(15, 20, 25, 0.74);
  color: var(--fg);
  cursor: pointer;
}

.portfolio-action-hint-close:hover,
.portfolio-action-hint-close:focus-visible {
  outline: none;
  background: rgba(244, 33, 46, 0.22);
  border-color: rgba(251, 113, 133, 0.45);
}

.portfolio-action-hint-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.2rem;
  height: 2.2rem;
  margin-bottom: 0.65rem;
  border-radius: 8px;
  background: rgba(29, 155, 240, 0.16);
  border: 1px solid rgba(124, 200, 248, 0.28);
  font-size: 1.2rem;
}

.portfolio-action-hint-eyebrow {
  margin: 0 2.7rem 0.25rem 0;
  color: #8fc1ff;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.portfolio-action-hint-title {
  margin: 0;
  padding-right: 2.7rem;
  font-size: 1.12rem;
  line-height: 1.25;
}

.portfolio-action-hint-text {
  margin: 0.65rem 0 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.45;
}

.portfolio-action-hint-app {
  margin-top: 0.8rem;
  padding: 0.55rem 0.65rem;
  border-radius: 8px;
  background: rgba(13, 18, 24, 0.66);
  border: 1px solid rgba(56, 68, 77, 0.72);
  color: #dbeafe;
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.portfolio-action-hint-app[hidden] {
  display: none;
}

.portfolio-action-hint-context {
  flex: 1 1 auto;
  margin-top: 0.75rem;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: 0.15rem;
  scrollbar-gutter: stable;
}

.portfolio-action-hint-form {
  display: grid;
  gap: 0.5rem;
  padding: 0.7rem;
  border-radius: 8px;
  border: 1px solid rgba(56, 68, 77, 0.72);
  background: rgba(13, 18, 24, 0.48);
}

.portfolio-action-hint-label {
  color: #cbd5e1;
  font-size: 0.75rem;
  font-weight: 800;
}

.portfolio-action-hint-input,
.portfolio-action-hint-textarea {
  width: 100%;
  border: 1px solid rgba(124, 200, 248, 0.25);
  border-radius: 8px;
  background: rgba(7, 12, 18, 0.82);
  color: var(--fg);
  font: inherit;
  font-size: 0.86rem;
  line-height: 1.35;
  padding: 0.55rem 0.65rem;
  outline: none;
}

.portfolio-action-hint-textarea {
  resize: vertical;
  min-height: 5.4rem;
}

.portfolio-action-hint-input:focus,
.portfolio-action-hint-textarea:focus {
  border-color: rgba(124, 200, 248, 0.7);
  box-shadow: 0 0 0 3px rgba(29, 155, 240, 0.14);
}

.portfolio-action-hint-textarea--compact {
  min-height: 4.2rem;
}

.portfolio-action-hint-segmented {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.28rem;
  padding: 0.25rem;
  border-radius: 8px;
  border: 1px solid rgba(124, 200, 248, 0.24);
  background: rgba(7, 12, 18, 0.62);
}

.portfolio-action-hint-segment {
  min-height: 2.15rem;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: #cbd5e1;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.15;
  overflow-wrap: anywhere;
  padding: 0.35rem 0.4rem;
  cursor: pointer;
}

.portfolio-action-hint-segment:hover,
.portfolio-action-hint-segment:focus-visible {
  outline: none;
  border-color: rgba(124, 200, 248, 0.38);
  background: rgba(29, 155, 240, 0.12);
  color: #e0f2fe;
}

.portfolio-action-hint-segment.is-active {
  border-color: rgba(124, 200, 248, 0.62);
  background: linear-gradient(180deg, rgba(47, 141, 245, 0.86), rgba(29, 95, 208, 0.86));
  color: #ffffff;
  box-shadow: 0 8px 20px rgba(29, 155, 240, 0.18);
}

.portfolio-action-hint-country-picker {
  position: relative;
}

.portfolio-action-hint-picker-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 2.45rem;
  border: 1px solid rgba(124, 200, 248, 0.25);
  border-radius: 8px;
  background: rgba(7, 12, 18, 0.82);
  color: var(--fg);
  font: inherit;
  font-size: 0.86rem;
  line-height: 1.35;
  padding: 0.55rem 0.65rem;
  text-align: left;
  cursor: pointer;
}

.portfolio-action-hint-picker-button::after {
  content: "▾";
  margin-left: 0.5rem;
  color: #8fc1ff;
  font-size: 0.72rem;
}

.portfolio-action-hint-picker-button[aria-expanded="true"]::after {
  content: "▴";
}

.portfolio-action-hint-picker-button:hover,
.portfolio-action-hint-picker-button:focus-visible {
  outline: none;
  border-color: rgba(124, 200, 248, 0.58);
  box-shadow: 0 0 0 3px rgba(29, 155, 240, 0.12);
}

.portfolio-action-hint-country-panel {
  position: absolute;
  z-index: 5;
  top: calc(100% + 0.35rem);
  left: 0;
  right: 0;
  display: grid;
  gap: 0.45rem;
  max-height: min(17rem, 42vh);
  padding: 0.5rem;
  border-radius: 8px;
  border: 1px solid rgba(56, 68, 77, 0.95);
  background: rgba(15, 21, 28, 0.98);
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.46);
}

.portfolio-action-hint-country-options {
  display: grid;
  gap: 0.35rem;
  min-height: 0;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.portfolio-action-hint-country-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  min-height: 2.35rem;
  border: 1px solid rgba(124, 200, 248, 0.18);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.03);
  color: #dbeafe;
  font: inherit;
  font-size: 0.82rem;
  padding: 0.5rem 0.58rem;
  text-align: left;
  cursor: pointer;
}

.portfolio-action-hint-country-option strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.portfolio-action-hint-country-option span {
  flex: 0 0 auto;
  color: #93c5fd;
  font-size: 0.75rem;
  font-weight: 800;
}

.portfolio-action-hint-country-option:hover,
.portfolio-action-hint-country-option:focus-visible,
.portfolio-action-hint-country-option.is-selected {
  outline: none;
  border-color: rgba(124, 200, 248, 0.52);
  background: rgba(29, 155, 240, 0.14);
}

.portfolio-action-hint-country-empty {
  margin: 0.15rem 0 0;
  color: var(--muted);
  font-size: 0.8rem;
}

.portfolio-action-hint-quick-row,
.portfolio-action-hint-inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.portfolio-action-hint-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.8rem;
  padding: 0.35rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(124, 200, 248, 0.24);
  background: rgba(29, 155, 240, 0.1);
  color: #bfdbfe;
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1.15;
  cursor: pointer;
}

.portfolio-action-hint-chip:hover,
.portfolio-action-hint-chip:focus-visible {
  outline: none;
  border-color: rgba(124, 200, 248, 0.55);
  background: rgba(29, 155, 240, 0.2);
}

.portfolio-action-hint-status {
  min-height: 1.15rem;
  margin: 0;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.portfolio-action-hint-status[data-kind="ok"] {
  color: #86efac;
}

.portfolio-action-hint-status[data-kind="error"] {
  color: #fca5a5;
}

.portfolio-action-hint-side-note {
  display: grid;
  gap: 0.2rem;
  margin-top: 0.65rem;
  padding: 0.62rem 0.7rem;
  border-radius: 8px;
  border: 1px solid rgba(56, 68, 77, 0.72);
  background: rgba(13, 18, 24, 0.42);
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.35;
}

.portfolio-action-hint-side-note strong {
  color: #dbeafe;
}

.portfolio-action-hint-side-note--ok {
  border-color: rgba(74, 222, 128, 0.28);
  background: rgba(22, 101, 52, 0.12);
  color: #bbf7d0;
}

.portfolio-action-hint-adspower {
  margin-top: 0.65rem;
  border-color: rgba(251, 113, 133, 0.28);
  background: rgba(127, 29, 29, 0.1);
}

.portfolio-action-hint-adspower-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
}

.portfolio-action-hint-adspower-head span {
  display: grid;
  min-width: 0;
  gap: 0.15rem;
}

.portfolio-action-hint-adspower-head strong {
  color: #fecdd3;
  font-size: 0.82rem;
}

.portfolio-action-hint-adspower-head small {
  min-width: 0;
  overflow: hidden;
  color: #fda4af;
  font-size: 0.76rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.portfolio-action-hint-actions {
  flex-shrink: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(56, 68, 77, 0.55);
}

.portfolio-action-hint-actions[hidden] {
  display: none;
}

.portfolio-action-hint-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.35rem;
  min-width: 0;
  padding: 0.55rem 0.85rem;
  border-radius: 8px;
  border: 1px solid rgba(124, 200, 248, 0.28);
  background: rgba(15, 23, 32, 0.76);
  color: #dbeafe;
  font-size: 0.86rem;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

.portfolio-action-hint-action:hover,
.portfolio-action-hint-action:focus-visible {
  outline: none;
  border-color: rgba(124, 200, 248, 0.58);
  background: rgba(29, 155, 240, 0.18);
}

.portfolio-action-hint-action:disabled,
.portfolio-action-hint-action.is-busy {
  cursor: wait;
  opacity: 0.62;
}

.portfolio-action-hint-action-primary {
  border-color: rgba(124, 200, 248, 0.62);
  background: linear-gradient(180deg, #2f8df5 0%, #1d5fd0 100%);
  color: #ffffff;
  box-shadow: 0 10px 28px rgba(29, 155, 240, 0.22);
}

.portfolio-action-hint-action-primary:hover,
.portfolio-action-hint-action-primary:focus-visible {
  background: linear-gradient(180deg, #4aa3ff 0%, #2472e2 100%);
}

.portfolio-action-hint-action-danger {
  border-color: rgba(251, 113, 133, 0.56);
  background: rgba(127, 29, 29, 0.36);
  color: #fecdd3;
}

.portfolio-action-hint-action-danger:hover,
.portfolio-action-hint-action-danger:focus-visible {
  border-color: rgba(251, 113, 133, 0.82);
  background: rgba(185, 28, 28, 0.42);
}

@media (max-width: 520px) {
  .portfolio-action-hint-dialog {
    padding: 1rem;
  }
  .portfolio-action-hint-adspower-head {
    align-items: stretch;
    flex-direction: column;
  }
  .portfolio-action-hint-actions {
    flex-direction: column;
  }
  .portfolio-action-hint-action {
    width: 100%;
  }
}

@media (max-height: 760px) {
  .portfolio-action-hint-dialog {
    padding: 0.9rem;
  }
  .portfolio-action-hint-icon {
    width: 1.9rem;
    height: 1.9rem;
    margin-bottom: 0.45rem;
  }
  .portfolio-action-hint-text {
    margin-top: 0.45rem;
  }
  .portfolio-action-hint-app,
  .portfolio-action-hint-context {
    margin-top: 0.55rem;
  }
  .portfolio-action-hint-form {
    gap: 0.42rem;
    padding: 0.62rem;
  }
  .portfolio-action-hint-textarea {
    min-height: 4.6rem;
  }
  .portfolio-action-hint-side-note,
  .portfolio-action-hint-adspower {
    margin-top: 0.5rem;
  }
}

.portfolio-modal-body {
  padding: 0 1.05rem 1.15rem;
  overflow-y: auto;
  flex: 1;
  min-height: 0;
  scrollbar-gutter: stable;
  scroll-padding-bottom: 1.15rem;
}
.portfolio-modal-body.has-manual-reason-editor-open {
  padding-bottom: min(8rem, 22vh);
  scroll-padding-bottom: min(8rem, 22vh);
}

.portfolio-modal-loading {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  min-height: 100%;
  margin: 0;
  padding: 2rem 1rem;
  color: var(--muted);
  text-align: center;
}

.portfolio-modal-loading-spinner {
  width: 1rem;
  height: 1rem;
  border: 2px solid rgba(124, 200, 248, 0.2);
  border-top-color: var(--accent, #1d9bf0);
  border-radius: 50%;
  animation: factory-busy-spin 0.75s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
  .portfolio-modal-loading-spinner {
    animation: none;
  }
}

.portfolio-modal-section {
  margin-bottom: 1.15rem;
  padding: 0.85rem 0.95rem;
  border-radius: 12px;
  background: rgba(21, 32, 43, 0.55);
  border: 1px solid rgba(56, 68, 77, 0.65);
}
.portfolio-modal-section-title {
  margin: 0 0 0.65rem 0;
  font-size: 0.92rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}
.portfolio-modal-kv {
  display: grid;
  gap: 0.45rem;
  margin-bottom: 0.65rem;
}
.portfolio-modal-kv > div {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.65rem;
  align-items: baseline;
  font-size: 0.84rem;
}
.portfolio-modal-k {
  color: var(--muted);
  min-width: 7rem;
}
.portfolio-modal-v {
  word-break: break-word;
}
.portfolio-modal-apple-account {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
}
.portfolio-modal-figma-row {
  align-items: center;
}
.portfolio-modal-figma-control {
  display: flex;
  flex: 1 1 18rem;
  gap: 0.45rem;
  min-width: min(100%, 18rem);
}
.portfolio-modal-figma-control .portfolio-modal-input {
  flex: 1 1 14rem;
  min-width: 0;
}
.portfolio-modal-figma-control .btn {
  flex: 0 0 auto;
  white-space: nowrap;
}
.portfolio-modal-brand-row {
  align-items: center;
}
.portfolio-modal-brand-control {
  display: block;
  flex: 1 1 18rem;
  min-width: min(100%, 18rem);
}
.portfolio-modal-brand-control .factory-select,
.portfolio-modal-brand-control .factory-select__button {
  width: 100%;
}
.portfolio-modal-brand-control .factory-select__button {
  min-height: 2.35rem;
}
.portfolio-modal-brand-create {
  margin: 0.35rem 0 0;
  padding: 0.55rem;
  border-top: 1px solid rgba(77, 91, 105, 0.72);
}
.run-brand-create {
  margin: 0.35rem 0 0;
  padding: 0.55rem;
  border-top: 1px solid rgba(77, 91, 105, 0.72);
}
.portfolio-modal-brand-create-label {
  display: block;
  margin: 0 0 0.35rem;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.run-brand-create__label {
  display: block;
  margin: 0 0 0.35rem;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.portfolio-modal-brand-create-row {
  display: grid;
  grid-template-columns: minmax(9rem, 1fr) auto;
  gap: 0.4rem;
  align-items: center;
}
.run-brand-create__row {
  display: grid;
  grid-template-columns: minmax(8rem, 1fr) minmax(7rem, 0.7fr) auto;
  gap: 0.4rem;
  align-items: center;
}
.portfolio-modal-brand-new-input {
  min-height: 2.35rem;
}
.run-brand-create__input,
.run-brand-create__unit {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 2.35rem;
  margin: 0;
}
.portfolio-modal-brand-create-btn {
  min-height: 2.35rem;
  white-space: nowrap;
}
.run-brand-create__btn {
  min-height: 2.35rem;
  white-space: nowrap;
}
.run-brand-create__hint {
  margin: 0.35rem 0 0;
}
@media (max-width: 640px) {
  .portfolio-modal-brand-create-row {
    grid-template-columns: 1fr;
  }
  .run-brand-create__row {
    grid-template-columns: 1fr;
  }
  .portfolio-modal-brand-create-btn {
    width: 100%;
  }
  .run-brand-create__btn {
    width: 100%;
  }
}
.portfolio-modal-manual-reason-row {
  align-items: flex-start;
}
.portfolio-modal-manual-reason-row .portfolio-modal-k {
  padding-top: 0.42rem;
}
.portfolio-modal-manual-reason-control {
  flex: 1 1 18rem;
  min-width: min(100%, 18rem);
  word-break: normal;
  overflow-wrap: normal;
}
.portfolio-modal-manual-reason {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.45rem;
  width: 100%;
  max-width: 100%;
}
.portfolio-modal-manual-reason.is-editing .apps-asc-manual-reason-edit-btn,
.portfolio-modal-manual-reason.is-editing .apps-asc-manual-reason-assign-btn {
  display: none;
}
.portfolio-modal-manual-reason .apps-asc-manual-reason-view {
  width: 100%;
  gap: 0.35rem;
}
.portfolio-modal-manual-reason .apps-asc-manual-reason-item {
  max-width: 100%;
}
.portfolio-modal-manual-reason .apps-asc-manual-reason-pill {
  max-width: min(100%, 26rem);
}
.portfolio-modal-manual-reason .apps-asc-manual-reason-editor {
  display: flex;
  flex-wrap: wrap;
  align-items: start;
  width: 100%;
  gap: 0.45rem;
}
.portfolio-modal-manual-reason .apps-asc-manual-reason-editor[hidden] {
  display: none;
}
.portfolio-modal-manual-reason .factory-combobox {
  flex: 1 1 22rem;
  min-width: min(100%, 16rem);
  width: auto;
}
.portfolio-modal-manual-reason .factory-combobox__panel {
  position: static;
  min-width: 0;
  margin-top: 0.45rem;
}
.portfolio-modal-manual-reason .factory-combobox__list {
  max-height: min(13rem, 30vh);
  padding-bottom: 0.4rem;
}
.portfolio-modal-manual-reason .apps-asc-manual-reason-input {
  width: 100%;
  min-width: 0;
  max-width: none;
}
.portfolio-modal-manual-reason .apps-asc-manual-reason-editor .btn {
  flex: 0 0 auto;
  min-width: max-content;
  white-space: nowrap;
  word-break: normal;
  overflow-wrap: normal;
}
.portfolio-modal-manual-reason .apps-asc-manual-reason-status {
  flex: 1 0 100%;
  min-height: 1rem;
  word-break: normal;
  overflow-wrap: anywhere;
}
.portfolio-modal-account-link {
  color: #9fd6ff;
  font-weight: 700;
  text-decoration: none;
}
.portfolio-modal-account-link:hover,
.portfolio-modal-account-link:focus-visible {
  color: #d7efff;
  text-decoration: underline;
  outline: none;
}
.portfolio-modal-account-list-link,
.portfolio-modal-account-copy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.58rem;
  padding: 0.14rem 0.52rem;
  border: 1px solid rgba(143, 211, 255, 0.28);
  border-radius: 7px;
  background: rgba(143, 211, 255, 0.08);
  color: #b8e3ff;
  font-size: 0.74rem;
  font-weight: 800;
  line-height: 1.1;
  text-decoration: none;
  white-space: nowrap;
  word-break: normal;
}
.portfolio-modal-account-copy {
  width: 1.75rem;
  flex: 0 0 1.75rem;
  padding: 0;
  cursor: pointer;
}
.portfolio-modal-account-copy svg {
  width: 0.9rem;
  height: 0.9rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.portfolio-modal-account-list-link:hover,
.portfolio-modal-account-list-link:focus-visible,
.portfolio-modal-account-copy:hover,
.portfolio-modal-account-copy:focus-visible {
  border-color: rgba(143, 211, 255, 0.52);
  color: #d7efff;
  text-decoration: none;
  outline: none;
}
.portfolio-modal-account-copy:disabled {
  cursor: wait;
  opacity: 0.55;
}
.portfolio-modal-row {
  margin: 0.35rem 0;
}
.portfolio-modal-link-store {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 600;
  color: #7dd3fc;
}
.portfolio-modal-link-store:hover {
  color: #bae6fd;
}

.portfolio-modal-label {
  display: block;
  font-size: 0.78rem;
  margin: 0.45rem 0 0.2rem;
  color: var(--muted);
}
.portfolio-modal-input,
.portfolio-modal-textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid rgba(56, 68, 77, 0.95);
  border-radius: 8px;
  padding: 0.4rem 0.55rem;
  font: inherit;
  background: rgba(15, 20, 25, 0.65);
  color: inherit;
}
.portfolio-modal-select {
  min-height: 3.55rem;
}
.portfolio-modal-locale-status {
  border: 1px solid rgba(56, 68, 77, 0.95);
  border-radius: 8px;
  background: rgba(15, 20, 25, 0.48);
  padding: 0.55rem;
}
.portfolio-modal-locale-status--collapsed {
  padding: 0;
}
.portfolio-modal-locale-status--empty {
  color: var(--muted);
}
.portfolio-modal-locale-summary {
  display: flex;
  align-items: center;
  min-height: 2.2rem;
  padding: 0.5rem 0.65rem;
  color: rgba(214, 226, 236, 0.94);
  font-size: 0.84rem;
  font-weight: 800;
  cursor: pointer;
  list-style-position: inside;
}
.portfolio-modal-locale-summary:hover,
.portfolio-modal-locale-summary:focus-visible {
  color: #bae6fd;
  outline: none;
}
.portfolio-modal-locale-status--collapsed .portfolio-modal-locale-grid {
  padding: 0 0.55rem 0.55rem;
}
.portfolio-modal-locale-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
  gap: 0.35rem;
}
.portfolio-modal-locale-row {
  display: grid;
  grid-template-columns: 3.4rem 4.7rem minmax(0, 1fr) max-content;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.2rem;
  padding: 0.36rem 0.48rem;
  border: 1px solid rgba(56, 68, 77, 0.72);
  border-radius: 8px;
  background: rgba(15, 23, 32, 0.42);
  font-size: 0.84rem;
}
.portfolio-modal-locale-row--light {
  border-color: rgba(56, 189, 248, 0.28);
}
.portfolio-modal-locale-row--hard {
  border-color: rgba(244, 114, 182, 0.3);
}
.portfolio-modal-locale-variant {
  display: inline-flex;
  justify-content: center;
  padding: 0.15rem 0.34rem;
  border-radius: 6px;
  background: rgba(56, 189, 248, 0.18);
  color: #bae6fd;
  font-weight: 800;
}
.portfolio-modal-locale-row--hard .portfolio-modal-locale-variant {
  background: rgba(244, 114, 182, 0.18);
  color: #fbcfe8;
}
.portfolio-modal-locale-code {
  font-family: ui-monospace, monospace;
  color: rgba(165, 215, 252, 0.95);
  font-weight: 800;
  white-space: nowrap;
}
.portfolio-modal-locale-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: rgba(214, 226, 236, 0.94);
}
.portfolio-modal-locale-state {
  justify-self: end;
  padding: 0.14rem 0.4rem;
  border-radius: 999px;
  background: rgba(251, 191, 36, 0.13);
  color: #facc15;
  font-size: 0.72rem;
  font-weight: 800;
  white-space: nowrap;
}
.portfolio-modal-locale-row.is-localized .portfolio-modal-locale-state {
  background: rgba(74, 222, 128, 0.12);
  color: #86efac;
}
.portfolio-modal-coverage-row {
  display: grid;
  grid-template-columns: minmax(8rem, 0.42fr) minmax(0, 1fr);
  gap: 0.45rem;
}
.portfolio-modal-coverage-picker {
  border: 1px solid rgba(56, 68, 77, 0.95);
  border-radius: 8px;
  background: rgba(15, 20, 25, 0.48);
  overflow: hidden;
}
.portfolio-modal-coverage-modes {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  padding: 0.55rem;
  border-bottom: 1px solid rgba(56, 68, 77, 0.7);
}
.portfolio-modal-coverage-mode {
  display: inline-flex;
  align-items: center;
  gap: 0.32rem;
  min-height: 2rem;
  padding: 0.2rem 0.48rem;
  border: 1px solid rgba(82, 96, 107, 0.85);
  border-radius: 7px;
  background: rgba(29, 155, 240, 0.06);
  font-size: 0.86rem;
  cursor: pointer;
}
.portfolio-modal-coverage-mode:has(input:checked) {
  border-color: rgba(29, 155, 240, 0.82);
  background: rgba(29, 155, 240, 0.16);
  color: #d9f0ff;
}
.portfolio-modal-coverage-tools {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin-left: 0.2rem;
}
.portfolio-modal-coverage-icon-btn {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid rgba(82, 96, 107, 0.85);
  border-radius: 7px;
  background: rgba(15, 20, 25, 0.62);
  color: #c8d7e2;
  cursor: pointer;
}
.portfolio-modal-coverage-icon-btn:hover,
.portfolio-modal-coverage-icon-btn:focus-visible {
  border-color: rgba(29, 155, 240, 0.82);
  background: rgba(29, 155, 240, 0.16);
  color: #d9f0ff;
  outline: none;
}
.portfolio-modal-coverage-icon-btn svg {
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.portfolio-modal-coverage-icon-btn--text {
  width: auto;
  min-width: 2.4rem;
  padding: 0 0.5rem;
  font-size: 0.76rem;
  font-weight: 700;
}
.portfolio-modal-coverage-regions {
  max-height: 17.5rem;
  overflow: auto;
  padding: 0.45rem;
}
.portfolio-modal-coverage-regions.is-disabled {
  opacity: 0.48;
}
.portfolio-modal-country-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
  gap: 0.25rem 0.4rem;
  padding: 0.05rem 0.1rem 0.1rem;
}
.portfolio-modal-country-row {
  display: grid;
  grid-template-columns: 0.9rem 4.7rem minmax(0, 1fr);
  align-items: center;
  gap: 0.55rem;
  min-height: 2rem;
  margin: 0;
  padding: 0.28rem 0.48rem;
  border: 1px solid transparent;
  border-radius: 8px;
  background: rgba(15, 23, 32, 0.28);
  font-size: 0.84rem;
  cursor: pointer;
}
.portfolio-modal-country-row input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}
.portfolio-modal-country-row::before {
  content: "";
  width: 0.82rem;
  height: 0.82rem;
  border: 1px solid rgba(139, 152, 165, 0.72);
  border-radius: 4px;
  background: rgba(7, 12, 18, 0.94);
  box-shadow: inset 0 0 0 2px rgba(7, 12, 18, 0.94);
}
.portfolio-modal-country-row:hover {
  border-color: rgba(56, 189, 248, 0.26);
  background: rgba(29, 155, 240, 0.08);
}
.portfolio-modal-country-row:has(input:checked) {
  border-color: rgba(56, 189, 248, 0.42);
  background: rgba(29, 155, 240, 0.12);
}
.portfolio-modal-country-row:has(input:checked)::before {
  border-color: #38bdf8;
  background: #38bdf8;
}
.portfolio-modal-country-code {
  font-family: ui-monospace, monospace;
  color: rgba(165, 215, 252, 0.95);
  white-space: nowrap;
}
.portfolio-modal-country-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.portfolio-modal-country-row {
  display: grid;
}
@media (max-width: 640px) {
  .portfolio-modal-locale-grid {
    grid-template-columns: 1fr;
  }
  .portfolio-modal-locale-row {
    grid-template-columns: 3.4rem minmax(4.2rem, 0.45fr) minmax(0, 1fr);
  }
  .portfolio-modal-locale-state {
    grid-column: 1 / -1;
    justify-self: start;
  }
  .portfolio-modal-coverage-row {
    grid-template-columns: 1fr;
  }
  .portfolio-modal-country-grid {
    grid-template-columns: 1fr;
  }
  .portfolio-modal-figma-control {
    flex-direction: column;
    align-items: stretch;
  }
  .portfolio-modal-manual-reason .apps-asc-manual-reason-editor {
    grid-template-columns: 1fr;
  }
  .portfolio-modal-manual-reason .apps-asc-manual-reason-editor .btn {
    width: 100%;
  }
}
.portfolio-modal-textarea {
  resize: vertical;
}
.portfolio-modal-actions-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.portfolio-modal-btn-sales-highlight-reset {
  border-color: rgba(245, 181, 0, 0.58);
  background:
    linear-gradient(180deg, rgba(245, 181, 0, 0.22), rgba(180, 83, 9, 0.16)),
    rgba(30, 24, 14, 0.82);
  color: #fde68a;
  font-weight: 700;
  box-shadow: inset 0 0 0 1px rgba(245, 181, 0, 0.14);
}

.portfolio-modal-btn-sales-highlight-reset:hover:not(:disabled) {
  border-color: rgba(245, 181, 0, 0.82);
  background:
    linear-gradient(180deg, rgba(245, 181, 0, 0.30), rgba(180, 83, 9, 0.22)),
    rgba(36, 26, 12, 0.92);
  color: #fffbeb;
}

.portfolio-toast {
  position: fixed;
  z-index: 12000;
  left: 50%;
  bottom: 1.25rem;
  transform: translateX(-50%);
  max-width: min(28rem, calc(100vw - 2rem));
  padding: 0.55rem 1rem;
  border-radius: 8px;
  background: rgba(22, 32, 42, 0.96);
  border: 1px solid rgba(125, 211, 252, 0.35);
  color: #e8f4ff;
  font-size: 0.88rem;
  line-height: 1.35;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
  pointer-events: none;
}

.portfolio-modal-secret {
  font-family: ui-monospace, monospace;
  word-break: break-all;
  font-size: 0.82rem;
}

.portfolio-activity-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.portfolio-activity-item {
  display: flex;
  gap: 0.55rem;
  align-items: flex-start;
  font-size: 0.81rem;
  line-height: 1.35;
  padding: 0.45rem 0;
  border-bottom: 1px solid rgba(56, 68, 77, 0.55);
}
.portfolio-activity-item--comment {
  margin: 0.35rem 0;
  padding: 0.62rem 0.72rem 0.62rem 0.68rem;
  border: 1px solid rgba(125, 211, 252, 0.28);
  border-left: 3px solid #7dd3fc;
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(14, 116, 144, 0.20), rgba(14, 165, 233, 0.07)),
    rgba(15, 23, 32, 0.52);
}
.portfolio-activity-glyph {
  flex-shrink: 0;
  font-size: 1rem;
  line-height: 1.2;
  opacity: 0.95;
}
.portfolio-activity-item--comment .portfolio-activity-glyph {
  color: #7dd3fc;
  opacity: 1;
}
.portfolio-activity-body {
  min-width: 0;
}
.portfolio-activity-ts {
  color: var(--muted);
  font-size: 0.72rem;
}
.portfolio-activity-kind {
  font-weight: 600;
}
.portfolio-activity-item--comment .portfolio-activity-kind {
  color: #bae6fd;
}
.portfolio-activity-text {
  margin-top: 0.15rem;
}
.portfolio-activity-item--comment .portfolio-activity-text {
  color: #e8f4ff;
  font-size: 0.9rem;
  line-height: 1.45;
}
.portfolio-activity-actor {
  color: var(--muted);
}
.portfolio-activity-details {
  display: grid;
  gap: 0.18rem;
  margin: 0.1rem 0 0;
}
.portfolio-activity-details > div {
  display: grid;
  grid-template-columns: minmax(7rem, 0.42fr) 1fr;
  gap: 0.45rem;
}
.portfolio-activity-details dt {
  color: var(--muted);
}
.portfolio-activity-details dd {
  margin: 0;
  word-break: break-word;
}

.run-board-link-row {
  margin: 0.25rem 0 0.75rem;
}

/* WebView интеграция — пост-пайплайновое действие. На доске это бейдж
   Added/Done, а не отдельная lifecycle-колонка. */
.run-webview-integration {
  --webview-accent: #a855f7;
  --webview-accent-2: #7c3aed;
  border: 1px solid rgba(168, 85, 247, 0.34);
  border-radius: 20px;
  padding: 1rem;
  margin: 1rem 0;
  background:
    radial-gradient(circle at 8% 18%, rgba(168, 85, 247, 0.16), transparent 34%),
    linear-gradient(135deg, rgba(168, 85, 247, 0.12), rgba(15, 23, 42, 0.82));
  box-shadow: 0 14px 28px rgba(2, 8, 23, 0.26);
}

.run-webview-integration--page {
  border-radius: 14px;
  padding: 1.15rem;
}

.webview-badge--large {
  width: 2.65rem;
  height: 2.65rem;
}

.webview-page-head {
  align-items: start;
}

.webview-page-actions {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.45rem;
}

.detail-stat-card--webview-tested .pill--webview {
  align-self: flex-start;
  margin-top: 0.15rem;
}

.btn-webview-tested {
  border-color: rgba(74, 222, 128, 0.44);
  background: rgba(34, 197, 94, 0.14);
  color: #bbf7d0;
}

.btn-webview-tested:hover:not(:disabled),
.btn-webview-tested:focus-visible {
  border-color: rgba(74, 222, 128, 0.76);
  background: rgba(34, 197, 94, 0.22);
}

.btn-webview-tested-reset {
  border-color: rgba(250, 204, 21, 0.42);
  background: rgba(250, 204, 21, 0.12);
  color: #fde68a;
}

.btn-webview-tested-reset:hover:not(:disabled),
.btn-webview-tested-reset:focus-visible {
  border-color: rgba(250, 204, 21, 0.72);
  background: rgba(250, 204, 21, 0.2);
}

.webview-hero-link {
  display: block;
  max-width: 16rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.run-webview-integration .webview-page-row {
  margin-left: calc(2.65rem + 0.85rem);
}

.webview-inline-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.85rem;
}

.webview-badge {
  border-color: rgba(216, 180, 254, 0.48);
  background:
    linear-gradient(145deg, rgba(168, 85, 247, 0.24), rgba(124, 58, 237, 0.08)),
    #231634;
  color: #f4e8ff;
}

.webview-inline-copy {
  min-width: 0;
}

.run-webview-integration .detail-stat-label {
  display: block;
  color: #d8b4fe;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.run-webview-integration .detail-stat-hint {
  margin: 0.18rem 0 0;
  max-width: 68rem;
}

.btn-webview-action {
  background: linear-gradient(135deg, #c084fc 0%, #a855f7 52%, #7c3aed 100%);
  border: 1px solid rgba(216, 180, 254, 0.72);
  color: #fdf7ff !important;
  box-shadow: 0 10px 24px rgba(168, 85, 247, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

.btn-webview-action:hover:not(:disabled) {
  filter: brightness(1.06);
  transform: translateY(-1px);
}

.btn-webview-action:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  filter: none;
}
.run-webview-integration .webview-row {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  margin-top: 0.65rem;
  margin-left: calc(2.45rem + 0.85rem);
}
.run-webview-integration .webview-meta-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0;
}
.run-webview-integration .webview-link-view {
  display: inline-flex;
  align-items: center;
  flex: 0 1 auto;
  gap: 0.4rem;
  flex-wrap: wrap;
}
.run-webview-integration .webview-link-editor {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex-wrap: wrap;
  flex: 1 1 100%;
}
.run-webview-integration .webview-link-block {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}
.run-webview-integration .webview-link-view[hidden],
.run-webview-integration .webview-link-editor[hidden] {
  display: none;
}
.run-webview-integration .webview-link-input {
  flex: 1 1 320px;
  min-width: 0;
  padding: 0.3rem 0.5rem;
  border-radius: 6px;
  border: 1px solid rgba(168, 85, 247, 0.4);
  font-family: inherit;
  font-size: 0.95rem;
}
.run-webview-integration .webview-rotation-input {
  flex: 0 1 12rem;
}
.run-webview-integration .webview-meta-chip {
  border-color: rgba(216, 180, 254, 0.22);
  background: rgba(88, 28, 135, 0.26);
}
.run-webview-integration .webview-meta-chip code,
.run-webview-integration .webview-meta-chip strong {
  min-width: 0;
  overflow: hidden;
  color: #f4e8ff;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.run-webview-integration .webview-meta-chip--wide {
  max-width: min(100%, 56rem);
  border-radius: 0.9rem;
}
.run-webview-integration a.webview-meta-chip {
  color: #d8b4fe;
  text-decoration: none;
}
.run-webview-integration a.webview-meta-chip:hover {
  border-color: rgba(216, 180, 254, 0.42);
  background: rgba(88, 28, 135, 0.36);
}
.run-webview-integration .webview-error {
  color: #c0392b;
}
.run-webview-integration .webview-bundle-sample-row {
  margin-top: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem;
  max-width: 100%;
}
.run-webview-integration .webview-bundle-sample-copy {
  display: inline-flex;
  align-items: center;
  gap: 0.32rem;
  margin: 0;
  padding: 0.32rem 0.58rem;
  color: #d8b4fe;
  text-decoration: none;
  cursor: pointer;
  font: inherit;
  text-align: left;
}
.run-webview-integration .webview-bundle-sample-copy:hover,
.run-webview-integration .webview-bundle-sample-copy:focus {
  border-color: rgba(216, 180, 254, 0.42);
  background: rgba(88, 28, 135, 0.36);
}
.run-webview-integration .webview-bundle-sample-feedback {
  min-height: 1.25em;
  margin: 0;
}
.run-webview-integration .webview-status-note {
  margin: 0.55rem 0 0;
}

@media (max-width: 760px) {
  .run-webview-integration .webview-row {
    margin-left: 0;
  }

  .webview-inline-head {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .webview-inline-head > .btn {
    grid-column: 1 / -1;
    justify-self: stretch;
  }

  .webview-page-actions {
    grid-column: 1 / -1;
    justify-content: stretch;
  }

  .webview-page-actions > .btn {
    flex: 1 1 12rem;
  }
}

.run-integration-test {
  --integration-accent: #0ea5e9;
  border: 1px solid rgba(14, 165, 233, 0.35);
  border-radius: 8px;
  padding: 0.75rem 1rem;
  margin: 1rem 0;
  background: rgba(14, 165, 233, 0.06);
}
.run-integration-test h2 {
  margin-top: 0;
  color: var(--integration-accent);
}
.run-integration-test .run-integration-meta {
  display: grid;
  gap: 0.2rem;
  margin-top: 0.4rem;
}

/* Пилюля WebView: Added ждёт ручной проверки, Done подтверждён оператором. */
.pill--webview {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: #facc15;
  color: #1f1600;
  border: 1px solid #fde047;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2), 0 0 0 1px rgba(31, 22, 0, 0.12) inset;
  cursor: default;
  position: relative;
  vertical-align: baseline;
}

.pill--ipad {
  border-color: rgba(96, 165, 250, 0.45);
  background: rgba(37, 99, 235, 0.14);
  color: #bfdbfe;
  font-size: 0.68rem;
  letter-spacing: 0.02em;
}
.pill--webview-done {
  background: #22c55e;
  color: #03170b;
  border-color: #4ade80;
}
.pill--webview[data-webview-pill]:hover,
.pill--webview[data-webview-pill]:focus {
  background: #fde047;
}
.pill--webview-done[data-webview-pill]:hover,
.pill--webview-done[data-webview-pill]:focus {
  background: #4ade80;
}
.pill--webview-with-action {
  padding-right: 0.2rem;
}
.portfolio-webview-pill-test,
.portfolio-webview-pill-reset {
  display: inline-grid;
  place-items: center;
  width: 1.1rem;
  height: 1.1rem;
  padding: 0;
  border: 1px solid rgba(31, 22, 0, 0.28);
  border-radius: 999px;
  background: rgba(31, 22, 0, 0.1);
  color: currentColor;
  font: inherit;
  font-size: 0.72rem;
  line-height: 1;
  cursor: pointer;
}
.portfolio-webview-pill-reset {
  color: #7f1d1d;
  font-weight: 800;
}
.portfolio-webview-pill-test:hover,
.portfolio-webview-pill-test:focus-visible,
.portfolio-webview-pill-reset:hover,
.portfolio-webview-pill-reset:focus-visible {
  background: rgba(31, 22, 0, 0.2);
  border-color: rgba(31, 22, 0, 0.42);
  outline: none;
}
.pill--revenue {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  background: rgba(15, 118, 110, 0.16);
  color: #a7f3d0;
  border: 1px solid rgba(20, 184, 166, 0.42);
  vertical-align: baseline;
}
.pill--revenue-profit {
  background: #16a34a;
  color: #03170b;
  border-color: #4ade80;
}
.pill--revenue-revenue,
.pill--revenue-clicks {
  background: rgba(14, 165, 233, 0.18);
  color: #bae6fd;
  border-color: rgba(56, 189, 248, 0.42);
}
.pill--revenue-empty,
.pill--revenue-pending {
  background: rgba(148, 163, 184, 0.16);
  color: #dbeafe;
  border-color: rgba(148, 163, 184, 0.38);
}
.pill--revenue-error {
  background: rgba(239, 68, 68, 0.18);
  color: #fecaca;
  border-color: rgba(248, 113, 113, 0.44);
}
.apps-revenue-pill,
.portfolio-board-card-revenue-pill,
.portfolio-modal-revenue-pill {
  flex: 0 0 auto;
}
.revenue-sync-status {
  min-width: 0;
}
.revenue-sync-status[data-kind="running"] {
  color: #facc15;
}
.revenue-sync-status[data-kind="ok"] {
  color: #86efac;
}
.revenue-sync-status[data-kind="error"] {
  color: #fecaca;
}

/* ── /binom — local Bitrack/Binom operator table ─────────────────────── */
.binom-shell {
  min-height: calc(100vh - 4rem);
  background: #20232c;
  color: #c9cbd1;
  overflow-x: hidden;
}
.binom-actions,
.binom-filters,
.binom-summary {
  display: flex;
  align-items: center;
}
.binom-section-tabs {
  display: flex;
  align-items: center;
  gap: 2.2rem;
  min-height: 4rem;
  padding: 0 1.6rem;
  background: #151a20;
  border-bottom: 1px solid #242b34;
  overflow-x: auto;
}
.binom-section-tab {
  display: inline-flex;
  align-items: center;
  min-height: 4rem;
  color: #c7c9ce;
  text-decoration: none;
  font-size: 1rem;
  font-weight: 700;
  border-bottom: 3px solid transparent;
  white-space: nowrap;
}
.binom-section-tab:hover,
.binom-section-tab.is-active {
  color: #ffffff;
  border-bottom-color: #ffffff;
}
.binom-actions {
  flex-wrap: wrap;
  gap: 0.65rem;
  padding: 1.15rem 1.6rem 0.45rem;
  background: #20232c;
}
.binom-filters {
  flex-wrap: wrap;
  gap: 0.65rem;
  padding: 0 1.6rem 1rem;
  background: #20232c;
}
.binom-grouping-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
  min-width: min(100%, 40rem);
}
.binom-btn,
.binom-search,
.binom-select {
  min-height: 2.35rem;
  border-radius: 7px;
  font-family: inherit;
  font-size: 0.92rem;
  font-weight: 700;
}
.binom-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 0.48rem 1.2rem;
  border: 1px solid #747987;
  background: #252a36;
  color: #d7dbe4;
  text-decoration: none;
  cursor: pointer;
}
.binom-btn:hover,
.binom-btn:focus-visible {
  background: #303746;
  outline: none;
}
.binom-btn:disabled {
  opacity: 0.55;
  cursor: wait;
}
.binom-btn-green {
  background: #a6dc74;
  border-color: #a6dc74;
  color: #08203a;
}
.binom-btn-green:hover,
.binom-btn-green:focus-visible {
  background: #b7ea82;
}
.binom-btn-blue {
  background: #159be8;
  border-color: #159be8;
  color: #ffffff;
}
.binom-btn-blue:hover,
.binom-btn-blue:focus-visible {
  background: #26a8f2;
}
.binom-search,
.binom-select {
  border: 1px solid #515869;
  background: #394052;
  color: #d8dbe3;
}
.binom-search {
  width: min(100%, 18rem);
  padding: 0 0.9rem;
  border-color: #159be8;
}
.binom-search::placeholder {
  color: #aab0bd;
}
.binom-select {
  width: 12rem;
  padding: 0 2rem 0 0.8rem;
}
.binom-group-filter {
  position: relative;
  width: 15.6rem;
  z-index: 30;
}
.binom-group-filter-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  width: 100%;
  color: #d8dbe3;
  text-align: left;
  cursor: pointer;
}
.binom-group-filter-button span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.binom-group-filter-chevron {
  flex: 0 0 auto;
  color: #aab0bd;
}
.binom-group-filter.is-open .binom-group-filter-chevron {
  transform: rotate(180deg);
}
.binom-group-filter-menu {
  position: absolute;
  top: calc(100% + 0.55rem);
  left: 0;
  width: min(32rem, calc(100vw - 2rem));
  max-height: min(28rem, 70vh);
  overflow: auto;
  padding: 1.45rem 1.45rem 1.2rem;
  border: 1px solid #515869;
  border-radius: 8px;
  background: #252b36;
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.42);
}
.binom-group-search {
  width: 100%;
  margin-bottom: 1.05rem;
}
.binom-group-filter-options {
  display: grid;
  gap: 0.86rem;
}
.binom-group-check {
  display: flex;
  align-items: center;
  gap: 0.72rem;
  min-height: 1.95rem;
  color: #cfd3dc;
  font-size: 1rem;
  font-weight: 700;
}
.binom-group-check--all {
  margin-bottom: 1rem;
}
.binom-group-check input {
  width: 1.35rem;
  height: 1.35rem;
  margin: 0;
  accent-color: #a6dc74;
}
.binom-group-check.is-hidden {
  display: none;
}
.binom-grouping-select {
  width: 13.8rem;
}
.binom-income-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.58rem;
  min-height: 2.35rem;
  padding: 0 0.85rem;
  border: 1px solid #515869;
  border-radius: 7px;
  background: #394052;
  color: #d8dbe3;
  font-size: 0.92rem;
  font-weight: 700;
  cursor: pointer;
}
.binom-income-toggle input {
  width: 1.1rem;
  height: 1.1rem;
  margin: 0;
  accent-color: #a6dc74;
}
.binom-summary {
  flex-wrap: wrap;
  gap: 1.1rem;
  min-height: 2.8rem;
  padding: 0.55rem 1.6rem;
  border-top: 1px solid #2f3540;
  border-bottom: 1px solid #343a45;
  background: #222731;
  color: #b9bdc6;
}
.binom-summary strong {
  color: #ffffff;
  font-variant-numeric: tabular-nums;
}
.binom-selection-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 2.8rem;
  padding: 0.75rem 1.6rem 0;
}
.binom-selection-count {
  color: #aeb6c6;
  font-size: 0.9rem;
  font-weight: 700;
}
.binom-selection-actions .binom-btn:disabled {
  cursor: default;
}
.binom-alert {
  margin: 0.75rem 1.6rem 0;
  padding: 0.65rem 0.8rem;
  border: 1px solid rgba(248, 113, 113, 0.45);
  border-radius: 6px;
  background: rgba(127, 29, 29, 0.36);
  color: #fecaca;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.binom-sync-status {
  min-width: 0;
  font-size: 0.88rem;
  color: #9ca3af;
}
.binom-sync-status[data-kind="running"] { color: #facc15; }
.binom-sync-status[data-kind="ok"] { color: #86efac; }
.binom-sync-status[data-kind="error"] { color: #fecaca; }
.binom-dashboard-region {
  min-height: 14rem;
  transition: opacity 0.16s ease;
}
.binom-dashboard-region.is-loading {
  opacity: 0.72;
}
.binom-loading {
  display: flex;
  align-items: center;
  min-height: 10rem;
  margin: 0.8rem 1.6rem 1.6rem;
  padding: 0 1.1rem;
  border-left: 3px solid #e5e7eb;
  background: #20232c;
  color: #aeb6c6;
  font-weight: 700;
}
.binom-table-wrap {
  width: calc(100% - 3.2rem);
  margin: 0.8rem 1.6rem 1.6rem;
  overflow: auto;
  border-left: 3px solid #e5e7eb;
}
.binom-table-wrap.has-binom-pagination {
  margin-bottom: 0;
}
.binom-pagination {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  width: calc(100% - 3.2rem);
  min-height: 2.85rem;
  margin: 0 1.6rem 1.6rem;
  padding: 0.45rem 0.8rem;
  border: 1px solid #3b414d;
  border-left: 3px solid #e5e7eb;
  border-top: 0;
  background: #20232c;
  color: #c8cad0;
  box-sizing: border-box;
}
.binom-pagination-controls {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.binom-pagination-btn,
.binom-pagination-size {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.15rem;
  height: 2rem;
  border: 1px solid #515869;
  border-radius: 7px;
  background: #394052;
  color: #d8dbe3;
  font: inherit;
  font-weight: 700;
}
.binom-pagination-btn {
  cursor: pointer;
}
.binom-pagination-btn:hover,
.binom-pagination-btn:focus-visible {
  border-color: #159be8;
  color: #ffffff;
  outline: none;
}
.binom-pagination-btn:disabled {
  cursor: default;
  opacity: 0.45;
}
.binom-pagination-current,
.binom-pagination-range {
  color: #aeb6c6;
  font-weight: 700;
  white-space: nowrap;
}
.binom-pagination-range {
  margin-left: auto;
}
.binom-table {
  width: 100%;
  min-width: 1320px;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 0.95rem;
  line-height: 1.25;
  color: #c8cad0;
}
.binom-table-clicklog {
  min-width: 1780px;
}
.binom-table-report {
  min-width: 1560px;
}
.binom-table th,
.binom-table td {
  height: 2.15rem;
  padding: 0.28rem 0.52rem;
  border-bottom: 1px solid #3b414d;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}
.binom-table th {
  position: relative;
  color: #9fa7b7;
  font-size: 0.84rem;
  font-weight: 700;
  text-align: left;
  background: #20232c;
  user-select: none;
}
.binom-sortable {
  cursor: pointer;
  padding-right: 1.7rem !important;
}
.binom-sortable:hover {
  color: #dce3ef;
}
.binom-sortable:focus-visible {
  outline: 2px solid #1da1f2;
  outline-offset: -2px;
}
.binom-sort-indicator {
  position: absolute;
  right: 0.58rem;
  top: 50%;
  transform: translateY(-50%);
  width: 0.7rem;
  color: #1da1f2;
  font-size: 0.78rem;
  line-height: 1;
  text-align: center;
  pointer-events: none;
}
.binom-col-resizer {
  position: absolute;
  top: 0;
  right: -0.22rem;
  z-index: 2;
  width: 0.44rem;
  height: 100%;
  cursor: col-resize;
  touch-action: none;
}
.binom-col-resizer::after {
  content: "";
  position: absolute;
  top: 0.35rem;
  bottom: 0.35rem;
  left: 50%;
  width: 1px;
  background: transparent;
}
.binom-col-resizer:hover::after,
.binom-table th.is-resizing .binom-col-resizer::after {
  background: #1da1f2;
}
.binom-column-resizing,
.binom-column-resizing * {
  cursor: col-resize !important;
  user-select: none !important;
}
.binom-table tbody tr {
  background: #20232c;
}
.binom-table tbody tr:nth-child(even) {
  background: #232733;
}
.binom-table tbody tr:hover {
  background: #314051;
}
.binom-table .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.binom-row-check {
  display: inline-flex;
  align-items: center;
  gap: 0.48rem;
  max-width: 100%;
  min-width: 0;
  cursor: pointer;
}
.binom-row-check--head {
  font-weight: 700;
}
.binom-row-check input {
  flex: 0 0 auto;
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: #a6dc74;
}
.binom-row-check input:disabled {
  cursor: default;
  opacity: 0.45;
}
.binom-row-check span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.binom-tree-cell {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 0.35rem;
}
.binom-tree-level-0 {
  padding-left: 0;
}
.binom-tree-level-1 {
  padding-left: 1.6rem;
}
.binom-tree-level-2 {
  padding-left: 3.2rem;
}
.binom-tree-toggle {
  flex: 0 0 1rem;
  width: 1rem;
  height: 1.3rem;
  padding: 0;
  border: 0;
  text-align: center;
  color: #d5d9e2;
  font-size: 0.9rem;
  line-height: 1;
  background: transparent;
  cursor: pointer;
  transform: rotate(0deg);
  transition: transform 0.12s ease, color 0.12s ease;
}
.binom-tree-toggle:hover,
.binom-tree-toggle:focus-visible {
  color: #ffffff;
  outline: none;
}
.binom-tree-toggle.is-collapsed {
  transform: rotate(90deg);
}
.binom-tree-toggle--empty {
  opacity: 0;
  cursor: default;
}
.binom-tree-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.binom-report-level-0 .binom-tree-label {
  font-weight: 700;
  color: #d7dce7;
}
.binom-report-level-1 .binom-tree-label {
  color: #c9ceda;
}
.binom-report-level-2 .binom-tree-label {
  color: #bfc5d2;
}
.binom-name {
  color: #d7dce7;
  text-decoration: none;
  font-weight: 600;
}
.binom-name:hover,
.binom-name:focus-visible {
  color: #ffffff;
  text-decoration: underline;
}
.binom-link-pill,
.binom-tags {
  display: inline-block;
  max-width: 100%;
  padding: 0.16rem 0.45rem;
  border-radius: 6px;
  background: #4a5265;
  color: #dbe1ec;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}
.binom-tags {
  background: #303746;
  color: #aeb6c6;
}
.binom-muted {
  color: #91a0b3;
}
.binom-profit {
  color: #00c46a;
  font-weight: 700;
}
.binom-row-profit {
  background: rgba(110, 139, 96, 0.68) !important;
}
.binom-row-profit .binom-profit {
  color: #00e676;
}
.binom-row-error {
  background: rgba(127, 29, 29, 0.34) !important;
}
.binom-row-empty {
  color: #a8adb8;
}
.binom-empty {
  height: 4rem !important;
  text-align: center;
  color: #9ca3af;
}
@media (max-width: 900px) {
  .binom-section-tabs,
  .binom-actions,
  .binom-filters,
  .binom-summary {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .binom-section-tabs {
    gap: 1.2rem;
  }
  .binom-search,
  .binom-select,
  .binom-grouping-controls,
  .binom-income-toggle,
  .binom-btn {
    width: 100%;
  }
  .binom-grouping-select {
    width: 100%;
  }
  .binom-loading {
    margin-left: 1rem;
    margin-right: 1rem;
  }
  .binom-selection-actions {
    padding-left: 1rem;
    padding-right: 1rem;
    flex-wrap: wrap;
  }
  .binom-table-wrap {
    width: calc(100% - 2rem);
    margin-left: 1rem;
    margin-right: 1rem;
  }
  .binom-pagination {
    width: calc(100% - 2rem);
    margin-left: 1rem;
    margin-right: 1rem;
    flex-wrap: wrap;
  }
  .binom-pagination-range {
    margin-left: 0;
  }
}
.apps-webview-popover {
  position: absolute;
  z-index: 50;
  background: var(--bg, #fff);
  border: 1px solid rgba(168, 85, 247, 0.4);
  border-radius: 8px;
  padding: 0.5rem 0.75rem;
  min-width: 280px;
  max-width: 480px;
  font-size: 0.9rem;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.18);
  display: none;
}
.apps-webview-popover.is-open {
  display: block;
}
.apps-webview-popover code {
  word-break: break-all;
  display: block;
  margin: 0.2rem 0;
}
.apps-webview-popover .apps-webview-input {
  width: 100%;
  padding: 0.3rem 0.5rem;
  border: 1px solid rgba(168, 85, 247, 0.4);
  border-radius: 6px;
  margin-top: 0.3rem;
}

.page-integration-test .detail-hero {
  margin-bottom: 0.9rem;
}
.page-integration-test.is-simulator-tab .container {
  max-width: min(100%, 118rem);
}
.integration-test-run-shell {
  display: grid;
  gap: 1rem;
}
.ai-sim-tabs {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  width: fit-content;
  max-width: 100%;
  padding: 0.22rem;
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-radius: 8px;
  background: rgba(6, 13, 22, 0.72);
}
.ai-sim-tab {
  min-height: 2.2rem;
  padding: 0.45rem 0.8rem;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: #b8c6d3;
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}
.ai-sim-tab:hover {
  color: #f0f9ff;
  background: rgba(125, 211, 252, 0.08);
}
.ai-sim-tab.is-active {
  border-color: rgba(125, 211, 252, 0.28);
  background: rgba(14, 165, 233, 0.18);
  color: #e6f8ff;
}
.ai-sim-panel {
  display: grid;
  gap: 1rem;
}
.simulator-console-panel {
  gap: 0.75rem;
}
.integration-test-run-card {
  border: 1px solid rgba(56, 189, 248, 0.34);
  border-radius: 20px;
  padding: 1.15rem;
  background:
    radial-gradient(circle at 8% 8%, rgba(34, 211, 238, 0.14), transparent 32%),
    linear-gradient(145deg, rgba(14, 165, 233, 0.11), rgba(15, 23, 42, 0.78));
  box-shadow: 0 20px 42px rgba(2, 8, 23, 0.26);
}
.integration-test-card-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.9rem;
  align-items: start;
}
.integration-test-card-head .eyebrow {
  margin-bottom: 0.18rem;
}
.integration-test-run-card h2,
.integration-test-video-wrap h2 {
  margin: 0;
}
.integration-test-card-head .hint {
  max-width: 66rem;
  margin-top: 0.45rem;
}
.integration-test-run-meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem;
  margin: 0.85rem 0 0.2rem;
}
.integration-test-run-meta p {
  display: grid;
  gap: 0.16rem;
  margin: 0;
  min-width: 0;
  padding: 0.62rem 0.68rem;
  border: 1px solid rgba(125, 211, 252, 0.18);
  border-radius: 0.9rem;
  background: rgba(8, 47, 73, 0.26);
  font-size: 0.93rem;
}
.integration-test-run-meta span {
  color: #90a4b8;
  font-size: 0.78rem;
}
.integration-test-run-meta strong {
  min-width: 0;
  overflow: hidden;
  color: #e6f8ff;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.integration-test-run-status {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0.75rem 0 0.45rem;
  color: #dbeafe;
}
.integration-test-run-status span {
  display: inline-flex;
  gap: 0.28rem;
  align-items: center;
  padding: 0.28rem 0.5rem;
  border-radius: 999px;
  background: rgba(14, 165, 233, 0.12);
  color: #b9c7d4;
  font-size: 0.9rem;
}
.integration-test-run-status strong {
  color: #f0f9ff;
}
.integration-test-run-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin: 0.9rem 0 0;
}
.integration-test-run-error {
  color: #ffb4b4;
  margin-top: 0.35rem;
}
.integration-test-run-card progress {
  width: 100%;
  height: 0.64rem;
  overflow: hidden;
  border: none;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.78);
}
.integration-test-run-card progress::-webkit-progress-bar {
  background: rgba(15, 23, 42, 0.78);
}
.integration-test-run-card progress::-webkit-progress-value {
  border-radius: 999px;
  background: linear-gradient(90deg, #22d3ee, #0ea5e9, #2563eb);
}
.integration-test-run-card progress::-moz-progress-bar {
  border-radius: 999px;
  background: linear-gradient(90deg, #22d3ee, #0ea5e9, #2563eb);
}
.integration-test-video-wrap {
  border: 1px solid rgba(14, 165, 233, 0.3);
  border-radius: 18px;
  padding: 0.9rem;
  background: rgba(14, 165, 233, 0.06);
}
.integration-test-video-wrap video {
  width: 100%;
  max-width: 100%;
  aspect-ratio: var(--video-ratio, auto);
  object-fit: contain;
  border-radius: 14px;
  background: #020617;
}
.integration-test-video-wrap.is-portrait video {
  width: min(100%, 420px);
}
.integration-test-video-wrap.is-square video {
  width: min(100%, 640px);
}
.simulator-console-card {
  border: 1px solid rgba(52, 211, 153, 0.34);
  border-radius: 8px;
  padding: 1.15rem;
  background: rgba(8, 22, 20, 0.82);
  box-shadow: 0 18px 38px rgba(2, 8, 23, 0.22);
}
.simulator-console-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.9rem;
  align-items: start;
}
.simulator-console-head h2 {
  margin: 0;
}
.simulator-console-head .hint {
  max-width: 66rem;
  margin-top: 0.45rem;
}
.simulator-console-badge {
  background: linear-gradient(135deg, #10b981, #14b8a6);
  box-shadow: 0 0 0 1px rgba(20, 184, 166, 0.34), 0 12px 22px rgba(16, 185, 129, 0.2);
}
.simulator-console-toolbar {
  display: flex;
  align-items: end;
  gap: 0.55rem;
  flex-wrap: wrap;
  margin-top: 1rem;
}
.simulator-console-icon-btn {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 2.35rem;
  min-width: 2.35rem;
  padding: 0;
  font-size: 1.1rem;
  line-height: 1;
}
.simulator-console-icon-btn span {
  display: block;
  transform: translateY(-0.02rem);
}
.simulator-console-icon-btn svg {
  width: 1.4rem;
  height: 1.4rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.25;
  vector-effect: non-scaling-stroke;
}
.simulator-console-record-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  gap: 0.42rem;
  width: 3rem;
  min-width: 3rem;
  min-height: 2.35rem;
  padding: 0;
  overflow: hidden;
  transition: width 0.16s ease, min-width 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}
.simulator-console-record-btn.is-recording {
  width: 6.7rem;
  min-width: 6.7rem;
  border-color: rgba(248, 113, 113, 0.55);
  background: rgba(127, 29, 29, 0.24);
  color: #fee2e2;
}
.simulator-console-record-icon {
  position: relative;
  display: inline-block;
  width: 2rem;
  height: 1.35rem;
  color: currentColor;
  flex: 0 0 auto;
}
.simulator-console-record-btn.is-recording .simulator-console-record-icon {
  display: none;
}
.simulator-console-record-icon-body {
  position: absolute;
  left: 0;
  top: 0.15rem;
  width: 1.42rem;
  height: 1.04rem;
  border: 2.6px solid currentColor;
  border-radius: 0.28rem;
}
.simulator-console-record-icon-lens {
  position: absolute;
  top: 0.33rem;
  right: 0.02rem;
  width: 0;
  height: 0;
  border-top: 0.36rem solid transparent;
  border-bottom: 0.36rem solid transparent;
  border-left: 0.58rem solid currentColor;
}
.simulator-console-record-icon-dot {
  position: absolute;
  left: 0.52rem;
  top: 0.52rem;
  width: 0.36rem;
  height: 0.36rem;
  border-radius: 999px;
  background: #ef4444;
  box-shadow: 0 0 0 1px rgba(239, 68, 68, 0.22);
}
.simulator-console-record-dot {
  display: none;
  width: 0.76rem;
  height: 0.76rem;
  border-radius: 999px;
  background: #ef4444;
  box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.42);
}
.simulator-console-record-btn.is-recording .simulator-console-record-dot {
  display: inline-block;
  animation: simulator-record-pulse 1.05s ease-in-out infinite;
}
.simulator-console-record-time {
  display: none;
  min-width: 3.25rem;
  color: #fff1f2;
  font-variant-numeric: tabular-nums;
  font-size: 0.86rem;
  font-weight: 750;
  line-height: 1;
}
.simulator-console-record-btn.is-recording .simulator-console-record-time {
  display: inline-block;
}
@keyframes simulator-record-pulse {
  0%, 100% {
    opacity: 1;
    box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.42);
  }
  50% {
    opacity: 0.42;
    box-shadow: 0 0 0 0.34rem rgba(239, 68, 68, 0);
  }
}
.simulator-console-device-label {
  display: grid;
  gap: 0.24rem;
  min-width: min(25rem, 100%);
  flex: 1 1 24rem;
  color: #9fb3c3;
  font-size: 0.8rem;
}
.simulator-console-device-label select {
  width: 100%;
  min-height: 2.35rem;
  border: 1px solid rgba(148, 163, 184, 0.38);
  border-radius: 6px;
  padding: 0.45rem 0.55rem;
  background: #0a1219;
  color: #edf9f6;
  font: inherit;
}
.simulator-console-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem;
  margin: 0.9rem 0 0;
}
.simulator-console-status-grid p {
  display: grid;
  gap: 0.16rem;
  min-width: 0;
  margin: 0;
  padding: 0.62rem 0.68rem;
  border: 1px solid rgba(52, 211, 153, 0.16);
  border-radius: 8px;
  background: rgba(6, 18, 24, 0.7);
}
.simulator-console-status-grid span {
  color: #94a3b8;
  font-size: 0.78rem;
}
.simulator-console-status-grid strong {
  min-width: 0;
  overflow: hidden;
  color: #ecfdf5;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.simulator-console-artifacts {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.8rem;
}
.simulator-console-artifacts[hidden] {
  display: none;
}
.simulator-console-artifacts-title {
  color: #94a3b8;
  font-size: 0.78rem;
}
.simulator-console-artifact-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.simulator-console-artifact-link {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 2.1rem;
  padding: 0.4rem 0.6rem;
  overflow: hidden;
  border: 1px solid rgba(52, 211, 153, 0.2);
  border-radius: 6px;
  background: rgba(6, 18, 24, 0.82);
  color: #d9fff4;
  font-size: 0.86rem;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.simulator-console-artifact-link:hover {
  border-color: rgba(52, 211, 153, 0.42);
  color: #ffffff;
}
.simulator-console-frame-shell {
  height: clamp(64rem, 94vh, 90rem);
  min-height: 64rem;
  overflow: hidden;
  border: 1px solid rgba(52, 211, 153, 0.28);
  border-radius: 8px;
  background: #020617;
}
.simulator-console-frame-shell iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 64rem;
  border: 0;
  background: #020617;
}

@media (max-width: 900px) {
  .integration-test-run-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .simulator-console-status-grid {
    grid-template-columns: 1fr;
  }
  .simulator-console-frame-shell {
    height: clamp(44rem, 86vh, 64rem);
    min-height: 44rem;
  }
  .simulator-console-frame-shell iframe {
    min-height: 44rem;
  }
}

@media (max-width: 560px) {
  .integration-test-run-meta {
    grid-template-columns: 1fr;
  }
  .ai-sim-tabs {
    width: 100%;
  }
  .ai-sim-tab {
    flex: 1 1 0;
  }
  .simulator-console-toolbar .btn {
    flex: 1 1 8rem;
  }
  .simulator-console-frame-shell {
    height: 82vh;
    min-height: 36rem;
  }
  .simulator-console-frame-shell iframe {
    min-height: 36rem;
  }
}

/* Apple ID pool */
.page-apple-accounts .detail-hero {
  position: relative;
  grid-template-columns: minmax(0, 1fr);
  align-content: space-between;
  border-radius: 10px;
  background: #111a24;
  box-shadow: none;
}
.page-apple-accounts .detail-hero h1 {
  font-size: clamp(2.1rem, 4vw, 3rem);
  letter-spacing: 0;
}
.page-apple-accounts .detail-subtitle {
  max-width: 48rem;
  font-size: 1rem;
}
.page-apple-accounts .detail-hero-side {
  align-content: stretch;
}
.apple-filter-bar {
  display: grid;
  grid-template-columns: repeat(2, minmax(12rem, 1fr)) max-content max-content;
  gap: 0.75rem;
  align-items: end;
  margin: 1rem 0 1.15rem;
  width: 100%;
}
.apple-filter-bar--hero {
  grid-column: 1 / -1;
  margin: 0.25rem 0 0;
  grid-template-columns: minmax(11rem, 0.8fr) minmax(18rem, 1.45fr) minmax(11rem, 0.8fr) max-content max-content;
}
.apple-filter-bar--hero .apple-unit-entity-filter {
  grid-column: 1 / -1;
  min-height: 2.55rem;
}
.apple-status-filter-row {
  grid-column: 1 / -1;
  min-width: 0;
}
.apple-status-filter-row .apple-status-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas:
    "statuses";
  align-items: center;
  gap: 0.55rem 1rem;
  padding: 0;
  border: 0;
  background: transparent;
}
.apple-status-filter-row .apple-status-summary:has(.apple-unit-finance-summary) {
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas:
    "statuses";
}
.apple-status-filter-row .apple-summary-overview {
  position: absolute;
  top: 1.75rem;
  right: 1.85rem;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  max-width: min(58rem, 58vw);
}
.apple-status-filter-row .apple-summary-section {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.28rem;
}
.apple-status-filter-row .apple-summary-section > h3 {
  margin: 0;
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
}
.apple-status-filter-row .apple-summary-section--finance {
  padding-left: 0.85rem;
  border-left: 1px solid rgba(139, 152, 165, 0.2);
}
.apple-status-filter-row .apple-summary-metrics {
  justify-content: flex-end;
  white-space: nowrap;
}
.apple-status-filter-row .apple-status-summary-list {
  grid-area: statuses;
}
.apple-status-filter-row .apple-unit-finance-summary {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.55rem;
  max-width: 100%;
  margin-top: 0;
  padding-top: 0;
  padding-left: 0;
  border-top: 0;
  border-left: 0;
}
.apple-status-filter-row .apple-unit-finance-summary h4 {
  flex: 0 0 auto;
  margin: 0;
  white-space: nowrap;
}
.apple-status-filter-row .apple-unit-finance-list {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.35rem;
  max-width: min(42rem, 100%);
  overflow-x: auto;
  scrollbar-width: thin;
}
.apple-status-filter-row .apple-unit-finance-item {
  flex: 0 0 auto;
  min-width: 5.8rem;
  padding: 0.34rem 0.48rem;
}
.apple-status-filter-row .apple-unit-finance-item strong {
  font-size: 0.88rem;
}
.apple-filter-add-btn {
  width: auto;
}
.apple-filter-bar > label,
.apple-mini-form,
.apple-multi-filter {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.apple-filter-bar > label > span,
.apple-multi-filter summary > span {
  font-size: 0.82rem;
  color: var(--muted, #667085);
}
.apple-filter-bar input,
.apple-filter-bar select,
.apple-mini-form input,
.apple-mini-form select {
  min-height: 2.25rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.35rem 0.55rem;
  background: #15202b;
  color: var(--fg);
  color-scheme: dark;
  font: inherit;
}
.apple-filter-bar input,
.apple-filter-bar select {
  width: 100%;
}
.apple-multi-filter {
  position: relative;
  min-width: 0;
}
.apple-multi-filter summary {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: center;
  min-height: 2.25rem;
  border: 1px solid var(--border);
  border-radius: 9px;
  padding: 0.38rem 2rem 0.38rem 0.65rem;
  background: #15202b;
  color: var(--fg);
  cursor: pointer;
  list-style: none;
}
.apple-multi-filter summary::-webkit-details-marker {
  display: none;
}
.apple-multi-filter summary::after {
  content: "";
  position: absolute;
  right: 0.72rem;
  top: 50%;
  width: 0.48rem;
  height: 0.48rem;
  border-right: 1.5px solid var(--muted);
  border-bottom: 1.5px solid var(--muted);
  transform: translateY(-60%) rotate(45deg);
  transition: transform 0.14s ease;
}
.apple-multi-filter[open] summary::after {
  transform: translateY(-35%) rotate(225deg);
}
.apple-multi-filter summary strong {
  display: block;
  margin-top: 0.1rem;
  overflow: hidden;
  color: var(--fg);
  font-size: 0.92rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apple-multi-filter--active summary {
  border-color: rgba(29, 155, 240, 0.62);
  box-shadow: 0 0 0 1px rgba(29, 155, 240, 0.18);
}
.apple-multi-filter-panel {
  position: absolute;
  z-index: 30;
  top: calc(100% + 0.35rem);
  left: 0;
  min-width: max(100%, 16rem);
  max-height: 18rem;
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 0.45rem;
  background: #0d1721;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.38);
}
.apple-filter-option {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  align-items: center;
  justify-content: flex-start;
  min-height: 2.35rem;
  padding: 0.42rem 0.55rem;
  border-radius: 6px;
  cursor: pointer;
  text-align: left;
}
.apple-filter-option--all {
  margin-bottom: 0.25rem;
  border-bottom: 1px solid rgba(139, 152, 165, 0.16);
  border-radius: 6px 6px 2px 2px;
}
.apple-filter-option:hover {
  background: rgba(255, 255, 255, 0.05);
}
.apple-filter-option input {
  flex: 0 0 1rem;
  width: 1rem;
  height: 1rem;
  min-height: 1rem;
  accent-color: #1d9bf0;
  border-radius: 4px;
  margin: 0;
  padding: 0;
}
.apple-filter-option span {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  font-size: 0.92rem;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apple-filter-empty {
  margin: 0.35rem 0.45rem;
}
.apple-unit-entity-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-content: center;
  align-items: center;
  min-width: 0;
  min-height: 3.55rem;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
}
.apple-unit-entity-chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  max-width: 13rem;
  min-height: 1.75rem;
  border: 1px solid rgba(139, 152, 165, 0.26);
  border-radius: 999px;
  background: rgba(139, 152, 165, 0.08);
  color: var(--muted);
  cursor: pointer;
  padding: 0.22rem 0.55rem;
}
.apple-unit-entity-chip:hover,
.apple-unit-entity-chip:focus-within {
  border-color: rgba(29, 155, 240, 0.48);
  color: #d7ecff;
}
.apple-unit-entity-chip.is-active {
  border-color: rgba(29, 155, 240, 0.58);
  background: rgba(29, 155, 240, 0.15);
  color: #ffffff;
}
.apple-unit-entity-chip input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}
.apple-unit-entity-chip span {
  min-width: 0;
  overflow: hidden;
  font-size: 0.8rem;
  font-weight: 800;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apple-filter-bar input::placeholder {
  color: var(--muted);
}
.apple-filter-bar input:focus,
.apple-filter-bar select:focus,
.apple-multi-filter summary:focus,
.apple-mini-form input:focus,
.apple-mini-form select:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(29, 155, 240, 0.18);
}
.apple-filter-bar .btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  min-height: 3.55rem;
  border-radius: 9px;
  padding: 0 0.95rem;
  line-height: 1;
  white-space: nowrap;
}
.page-administration .admin-binom-filter {
  min-width: 0;
}
.page-administration .admin-form-grid > .admin-binom-filter {
  align-self: end;
}
.admin-users-table__binom .admin-binom-filter summary {
  min-height: 2.7rem;
  padding-top: 0.32rem;
  padding-bottom: 0.32rem;
}
.admin-users-table__binom .admin-binom-filter-panel {
  right: 0;
  left: auto;
  z-index: 90;
  min-width: max(100%, 18rem);
  max-height: 16rem;
}
.apple-table-shell {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #111a24;
}
.apple-table-shell.is-filtering {
  opacity: 0.62;
  transition: opacity 120ms ease;
}
.apple-accounts-loader {
  display: flex;
  min-height: 3.5rem;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  color: var(--muted);
  font-size: 0.84rem;
}
.apple-accounts-loader[hidden] {
  display: none;
}
.apple-pagination {
  margin: 0.9rem 0 1.5rem;
}
.apple-summary-block {
  min-width: 0;
}
.apple-summary-block--loading,
.apple-summary-block--error {
  min-height: 4.5rem;
  padding: 0.75rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #111a24;
}
.apple-summary-block h2 {
  margin: 0 0 0.5rem;
  font-size: 1rem;
  letter-spacing: 0;
}
.apple-summary-placeholder {
  margin: 0;
}
.apple-status-summary {
  padding: 0.75rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #111a24;
}
.apple-summary-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.65rem;
}
.apple-summary-heading h2 {
  margin: 0;
}
.apple-summary-metrics {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.35rem 0.7rem;
}
.apple-summary-total {
  color: var(--muted);
  font-size: 0.86rem;
}
.apple-summary-money {
  color: var(--muted);
  font-size: 0.86rem;
}
.apple-summary-total strong,
.apple-summary-money strong {
  color: var(--fg);
}
.apple-status-summary-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
}
.apple-status-summary-item {
  position: relative;
  display: inline-flex;
  min-width: 0;
  min-height: 1.75rem;
  max-width: 13rem;
  align-items: center;
  gap: 0.35rem;
  border: 1px solid rgba(139, 152, 165, 0.2);
  border-radius: 999px;
  padding: 0.22rem 0.55rem;
  background: rgba(139, 152, 165, 0.08);
  color: inherit;
  line-height: 1.15;
  text-decoration: none;
  cursor: pointer;
  transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease,
    color 0.16s ease, transform 0.16s ease;
}
.apple-status-summary-item:hover,
.apple-status-summary-item:focus-visible {
  border-color: rgba(var(--apple-status-rgb, 143, 211, 255), 0.48);
  background: rgba(var(--apple-status-rgb, 143, 211, 255), 0.13);
  outline: none;
}
.apple-status-summary-item span {
  display: inline-block;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 800;
  line-height: 1.15;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}
.apple-status-summary-item strong {
  display: inline-block;
  margin-top: 0;
  color: var(--fg);
  font-size: 0.8rem;
  font-weight: 800;
  line-height: 1.15;
}
.apple-status-summary-item--free {
  --apple-status-rgb: 34, 197, 94;
  border-color: rgba(34, 197, 94, 0.26);
  background: rgba(34, 197, 94, 0.1);
}
.apple-status-summary-item--booked,
.apple-status-summary-item--reserved {
  --apple-status-rgb: 29, 155, 240;
  border-color: rgba(29, 155, 240, 0.28);
  background: rgba(29, 155, 240, 0.1);
}
.apple-status-summary-item--blocked {
  --apple-status-rgb: 244, 33, 46;
  border-color: rgba(244, 33, 46, 0.28);
  background: rgba(244, 33, 46, 0.1);
}
.apple-status-summary-item--active {
  border-color: rgba(var(--apple-status-rgb, 143, 211, 255), 0.96);
  background: rgba(var(--apple-status-rgb, 143, 211, 255), 0.38);
  box-shadow:
    0 0 0 2px rgba(var(--apple-status-rgb, 143, 211, 255), 0.18),
    0 5px 14px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.14);
  transform: translateY(-1px);
}
.apple-status-summary-item--active:hover,
.apple-status-summary-item--active:focus-visible {
  border-color: rgb(var(--apple-status-rgb, 143, 211, 255));
  background: rgba(var(--apple-status-rgb, 143, 211, 255), 0.46);
}
.apple-status-summary-item--active span,
.apple-status-summary-item--active strong {
  color: #ffffff;
}
.apple-status-summary-item--active::before {
  content: "✓";
  display: inline-grid;
  width: 1rem;
  height: 1rem;
  flex: 0 0 1rem;
  place-items: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.22);
  color: #ffffff;
  font-size: 0.68rem;
  font-weight: 900;
  line-height: 1;
}
.apple-unit-finance-summary {
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(139, 152, 165, 0.2);
}
.apple-unit-finance-summary h4 {
  margin: 0 0 0.5rem;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}
.apple-unit-finance-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.45rem;
}
.apple-unit-finance-item {
  min-width: 0;
  padding: 0.5rem 0.55rem;
  border: 1px solid rgba(139, 152, 165, 0.18);
  border-radius: 8px;
  background: rgba(139, 152, 165, 0.07);
}
.apple-unit-finance-item span {
  display: block;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apple-unit-finance-item strong {
  display: block;
  margin-top: 0.18rem;
  color: var(--fg);
  font-size: 0.98rem;
}
.apple-accounts-table {
  width: max-content;
  min-width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
  table-layout: auto;
}
.apple-accounts-table th,
.apple-accounts-table td {
  padding: 0.65rem 0.7rem;
  border-bottom: 1px solid var(--border);
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.apple-row.is-busy {
  opacity: 0.72;
}
.apple-row--blocked td {
  background: rgba(244, 33, 46, 0.07);
}
.apple-row--blocked td:first-child {
  box-shadow: inset 3px 0 0 rgba(244, 33, 46, 0.72);
}
.apple-row--blocked .apple-email-link {
  color: #ffc2c2;
}
.apple-row--free td {
  background: rgba(34, 197, 94, 0.08);
}
.apple-row--free td:first-child {
  box-shadow: inset 3px 0 0 rgba(34, 197, 94, 0.72);
}
.apple-row--free .apple-email-link {
  color: #a7f3d0;
}
.apple-row--highlight > td {
  background: rgba(29, 155, 240, 0.11);
}
.apple-row--highlight > td:first-child {
  box-shadow: inset 3px 0 0 0 rgb(29, 155, 240);
}
.apple-accounts-table th {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0;
  color: var(--muted);
  background: #111820;
}
.apple-sort-link {
  color: inherit;
  text-decoration: none;
}
.apple-sort-link--active {
  color: #8fd3ff;
}
.apple-accounts-table th:nth-child(1),
.apple-accounts-table td:nth-child(1) {
  width: 17%;
}
.apple-accounts-table th:nth-child(2),
.apple-accounts-table td:nth-child(2) {
  width: 9%;
}
.apple-accounts-table th:nth-child(3),
.apple-accounts-table td:nth-child(3) {
  width: 6%;
}
.apple-accounts-table th:nth-child(4),
.apple-accounts-table td:nth-child(4) {
  width: 5%;
}
.apple-accounts-table th:nth-child(5),
.apple-accounts-table td:nth-child(5) {
  width: 8%;
}
.apple-accounts-table th:nth-child(6),
.apple-accounts-table td:nth-child(6) {
  width: 7%;
}
.apple-accounts-table th:nth-child(7),
.apple-accounts-table td:nth-child(7) {
  width: 13%;
}
.apple-accounts-table th:nth-child(8),
.apple-accounts-table td:nth-child(8) {
  width: 9%;
}
.apple-accounts-table th:nth-child(9),
.apple-accounts-table td:nth-child(9) {
  width: 5%;
}
.apple-accounts-table th:nth-child(10),
.apple-accounts-table td:nth-child(10) {
  width: 11%;
  min-width: 13rem;
}
.apple-accounts-table th:nth-child(11),
.apple-accounts-table td:nth-child(11) {
  width: 6%;
}
.apple-accounts-table th:nth-child(12),
.apple-accounts-table td:nth-child(12) {
  width: 7%;
  min-width: 9rem;
}
.apple-accounts-table th:nth-child(13),
.apple-accounts-table td:nth-child(13) {
  width: 4%;
}
.apple-accounts-table--bulk th:nth-child(1),
.apple-accounts-table--bulk td:nth-child(1) {
  width: 2.75rem;
  min-width: 2.75rem;
  text-align: center;
}
.apple-accounts-table--bulk th:nth-child(2),
.apple-accounts-table--bulk td:nth-child(2) {
  width: 17%;
}
.apple-accounts-table--bulk th:nth-child(3),
.apple-accounts-table--bulk td:nth-child(3) {
  width: 9%;
}
.apple-accounts-table--bulk th:nth-child(4),
.apple-accounts-table--bulk td:nth-child(4) {
  width: 6%;
}
.apple-accounts-table--bulk th:nth-child(5),
.apple-accounts-table--bulk td:nth-child(5) {
  width: 5%;
}
.apple-accounts-table--bulk th:nth-child(6),
.apple-accounts-table--bulk td:nth-child(6) {
  width: 8%;
}
.apple-accounts-table--bulk th:nth-child(7),
.apple-accounts-table--bulk td:nth-child(7) {
  width: 7%;
}
.apple-accounts-table--bulk th:nth-child(8),
.apple-accounts-table--bulk td:nth-child(8) {
  width: 13%;
}
.apple-accounts-table--bulk th:nth-child(9),
.apple-accounts-table--bulk td:nth-child(9) {
  width: 9%;
}
.apple-accounts-table--bulk th:nth-child(10),
.apple-accounts-table--bulk td:nth-child(10) {
  width: 5%;
  min-width: 0;
}
.apple-accounts-table--bulk th:nth-child(11),
.apple-accounts-table--bulk td:nth-child(11) {
  width: 11%;
  min-width: 13rem;
}
.apple-accounts-table--bulk th:nth-child(12),
.apple-accounts-table--bulk td:nth-child(12) {
  width: 6%;
}
.apple-accounts-table--bulk th:nth-child(13),
.apple-accounts-table--bulk td:nth-child(13) {
  width: 7%;
  min-width: 9rem;
}
.apple-accounts-table--bulk th:nth-child(14),
.apple-accounts-table--bulk td:nth-child(14) {
  width: 4%;
}
.apple-bulk-toolbar-row th {
  background: rgba(29, 155, 240, 0.08);
  border-bottom-color: rgba(143, 211, 255, 0.26);
  text-transform: none;
}
.apple-bulk-count-cell {
  color: var(--fg);
  font-size: 0.82rem;
  font-weight: 800;
}
.apple-accounts-table--bulk .apple-bulk-count-cell {
  width: auto;
  min-width: 0;
}
.apple-accounts-table--bulk .apple-bulk-price-cell {
  width: 6%;
  min-width: 7.5rem;
}
.apple-bulk-select-heading,
.apple-bulk-select-cell {
  padding-left: 0.45rem;
  padding-right: 0.45rem;
}
.apple-bulk-checkbox {
  width: 1rem;
  height: 1rem;
  margin: 0;
  vertical-align: middle;
  accent-color: #1d9bf0;
}
.apple-bulk-price-input {
  width: 7rem;
  max-width: 100%;
  border: 1px solid rgba(143, 211, 255, 0.34);
  border-radius: 7px;
  padding: 0.42rem 0.5rem;
  background: rgba(5, 10, 17, 0.72);
  color: var(--fg);
  font: inherit;
  letter-spacing: 0;
}
.apple-bulk-price-input:focus {
  border-color: rgba(143, 211, 255, 0.62);
  box-shadow: 0 0 0 3px rgba(29, 155, 240, 0.18);
  outline: none;
}
.apple-bulk-save {
  min-height: 2rem;
  padding: 0.4rem 0.75rem;
}
.apple-email-link {
  display: inline-block;
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  color: #9fd6ff;
  font-weight: 700;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apple-email-link:hover,
.apple-email-link:focus-visible {
  color: #d7efff;
  text-decoration: underline;
  outline: none;
}
.apple-email-cell {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
}
.apple-email-copy {
  flex: 0 0 2rem;
}
.apple-row-status {
  display: block;
  margin-top: 0.3rem;
  overflow: hidden;
  font-size: 0.75rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apple-row-status--error {
  color: #ff9b9b;
}
.apple-country-cell {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  gap: 0.35rem;
  min-width: 0;
}
.apple-country-cell > span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.apple-country-flag {
  flex: 0 0 auto;
  font-size: 1.05rem;
  line-height: 1;
}
.apple-type-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid rgba(139, 152, 165, 0.22);
  border-radius: 8px;
  background: rgba(139, 152, 165, 0.08);
  color: #b8c5d3;
}
.apple-type-icon svg {
  width: 1.05rem;
  height: 1.05rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.apple-type-icon--corporate {
  border-color: rgba(143, 211, 255, 0.26);
  background: rgba(29, 155, 240, 0.1);
  color: #9fd6ff;
}
.apple-type-icon--individual {
  border-color: rgba(190, 242, 100, 0.22);
  background: rgba(132, 204, 22, 0.1);
  color: #d6f8a5;
}
.apple-status {
  display: inline-flex;
  align-items: center;
  min-height: 1.35rem;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 0.1rem 0.5rem;
  font-size: 0.78rem;
  font-weight: 700;
}
.apple-status--free {
  color: #86efac;
  background: rgba(34, 197, 94, 0.12);
  border-color: rgba(34, 197, 94, 0.24);
}
.apple-status--booked,
.apple-status--reserved {
  color: #8fc1ff;
  background: rgba(29, 155, 240, 0.14);
  border-color: rgba(29, 155, 240, 0.28);
}
.apple-status--blocked {
  color: var(--muted);
  background: rgba(139, 152, 165, 0.12);
  border-color: rgba(139, 152, 165, 0.24);
}
.apple-account-status-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1rem;
  border: 1px solid rgba(139, 152, 165, 0.26);
  border-radius: 8px;
  padding: 0.9rem 1rem;
  background: rgba(17, 26, 36, 0.92);
}
.apple-account-status-banner--free {
  border-color: rgba(34, 197, 94, 0.34);
  background: rgba(18, 48, 31, 0.78);
}
.apple-account-status-banner--booked,
.apple-account-status-banner--reserved {
  border-color: rgba(29, 155, 240, 0.34);
  background: rgba(15, 39, 60, 0.82);
}
.apple-account-status-banner--blocked {
  border-color: rgba(244, 33, 46, 0.48);
  background: rgba(68, 20, 24, 0.9);
}
.apple-account-status-banner__body {
  min-width: 0;
}
.apple-account-status-banner__eyebrow {
  display: block;
  margin-bottom: 0.25rem;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 700;
  text-transform: uppercase;
}
.apple-account-status-banner__title {
  display: block;
  color: var(--fg);
  font-size: 1.05rem;
}
.apple-account-status-banner__text {
  display: block;
  margin-top: 0.25rem;
  color: #c7d2de;
  font-size: 0.9rem;
}
.apple-account-status-banner__action {
  flex: 0 0 auto;
  margin: 0;
}
.apple-cell-stack {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
  width: 100%;
  flex-wrap: nowrap;
}
.apple-cell-form {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
  min-width: 0;
  width: 100%;
}
.apple-cell-stack .apple-cell-form {
  flex: 0 0 auto;
  width: auto;
}
.apple-cell-select {
  width: 100%;
  min-height: 2rem;
  max-width: 100%;
  border: 1px solid var(--border);
  border-radius: 7px;
  padding: 0.25rem 1.75rem 0.25rem 0.45rem;
  background: #15202b;
  color: var(--fg);
  color-scheme: dark;
  font: inherit;
}
.apple-cell-select:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(29, 155, 240, 0.18);
}
.apple-booking-date-input {
  width: 100%;
  min-height: 2rem;
  max-width: 8.5rem;
  border: 1px solid var(--border);
  border-radius: 7px;
  padding: 0.25rem 0.45rem;
  background: #15202b;
  color: var(--fg);
  color-scheme: dark;
  font: inherit;
}
.apple-booking-date-input--manual {
  border-color: rgba(143, 211, 255, 0.46);
  background: rgba(29, 155, 240, 0.12);
}
.apple-booking-date-input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(29, 155, 240, 0.18);
}
.apple-status-select {
  font-weight: 700;
}
.apple-status-select,
.apple-unit-select,
.apple-manager-select {
  padding-right: 1.75rem;
  padding-left: 0.45rem;
  font-size: inherit;
}
.apple-status-select--free {
  color: #86efac;
}
.apple-status-select--booked,
.apple-status-select--reserved {
  color: #8fc1ff;
}
.apple-status-select--blocked {
  color: var(--muted);
}
.apple-unit-select--assigned {
  border-color: hsl(var(--unit-hue), 42%, 32%);
  background:
    linear-gradient(0deg, hsl(var(--unit-hue), 38%, 18%), hsl(var(--unit-hue), 38%, 18%)),
    #15202b;
  color: hsl(var(--unit-hue), 82%, 86%);
  font-weight: 700;
}
.apple-unit-select--assigned:focus {
  border-color: hsl(var(--unit-hue), 56%, 44%);
  box-shadow: 0 0 0 3px hsla(var(--unit-hue), 78%, 58%, 0.18);
}
.apple-cell-button {
  min-height: 1.8rem;
  max-width: 100%;
  border: 1px solid rgba(143, 211, 255, 0.28);
  border-radius: 7px;
  padding: 0.2rem 0.5rem;
  background: rgba(29, 155, 240, 0.08);
  color: #8fd3ff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.apple-cell-stack .mono,
.apple-cell-stack .btn-inline {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.apple-supplier-value,
.apple-status-value,
.apple-proxy-name,
.apple-proxy-meta {
  display: inline-block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apple-supplier-value {
  max-width: 100%;
}
.apple-apps-cell {
  overflow: visible;
  text-align: center;
  white-space: normal;
}
.apple-apps-cell-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  min-width: 0;
}
.apple-external-app-add {
  flex: 0 0 auto;
}
.apple-apps-toggle {
  cursor: pointer;
  min-width: 2rem;
  justify-content: center;
  border-color: rgba(29, 155, 240, 0.35);
  background: rgba(29, 155, 240, 0.12);
  color: #cbe8ff;
}
.apple-apps-toggle:hover,
.apple-apps-toggle:focus-visible,
.apple-apps-toggle.is-active {
  border-color: rgba(29, 155, 240, 0.6);
  background: rgba(29, 155, 240, 0.18);
  color: #ffffff;
  outline: none;
}
.apple-apps-popover {
  position: absolute;
  z-index: 60;
  display: none;
  width: min(24rem, calc(100vw - 1rem));
  max-width: calc(100vw - 1rem);
}
.apple-apps-popover.is-open {
  display: block;
}
.apple-apps-popover-surface {
  position: relative;
  padding: 0.8rem 0.85rem 0.75rem;
  border: 1px solid rgba(29, 155, 240, 0.35);
  border-radius: 0.9rem;
  background: #111a24;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.35);
  max-height: min(24rem, calc(100vh - 1.5rem));
  overflow: auto;
}
.apple-apps-popover-close {
  position: absolute;
  top: 0.35rem;
  right: 0.35rem;
  min-width: 1.5rem;
  height: 1.5rem;
  padding: 0;
  justify-content: center;
}
.apple-apps-popover-body {
  display: block;
}
.apple-apps-popover-content {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding-right: 1.4rem;
  text-align: left;
}
.apple-apps-popover-title {
  margin: 0;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.apple-apps-popover-email {
  margin: 0;
  color: #d9e6f2;
  font-size: 0.8rem;
  word-break: break-all;
}
.apple-apps-popover-list {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin-top: 0.2rem;
}
.apple-apps-popover-list .apple-run-chip {
  width: 100%;
  max-width: none;
  justify-content: flex-start;
}
.apple-external-app-dialog .aso-modal-body {
  max-height: calc(min(760px, 100vh - 40px) - 58px);
  overflow: auto;
}
.apple-external-app-account {
  display: grid;
  gap: 0.2rem;
  border: 1px solid rgba(139, 152, 165, 0.22);
  border-radius: 8px;
  background: rgba(139, 152, 165, 0.08);
  padding: 0.65rem 0.75rem;
}
.apple-external-app-account span,
.apple-external-app-search label > span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.apple-external-app-account strong {
  min-width: 0;
  overflow: hidden;
  color: var(--on-surface, var(--fg));
  font-size: 0.9rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apple-external-app-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.6rem;
  align-items: end;
}
.apple-external-app-search label {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
}
.apple-external-app-search input {
  width: 100%;
  min-height: 2.35rem;
  border: 1px solid var(--outline-variant, var(--border));
  border-radius: 8px;
  background: var(--surface-container-highest, #15202b);
  color: var(--text, var(--fg));
  font: inherit;
  padding: 0.45rem 0.6rem;
}
.apple-external-app-results {
  display: grid;
  gap: 0.45rem;
  min-height: 3.5rem;
}
.apple-external-app-results .hint {
  margin: 0.25rem 0;
}
.apple-external-app-result {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 0.65rem;
  align-items: center;
  min-width: 0;
  border: 1px solid rgba(139, 152, 165, 0.22);
  border-radius: 8px;
  background: rgba(139, 152, 165, 0.07);
  padding: 0.55rem;
}
.apple-external-app-result__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  overflow: hidden;
  border-radius: 9px;
  background: rgba(29, 155, 240, 0.16);
  color: #d7ecff;
  font-weight: 900;
}
.apple-external-app-result__icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.apple-external-app-result__copy {
  display: grid;
  gap: 0.15rem;
  min-width: 0;
}
.apple-external-app-result__copy strong,
.apple-external-app-result__copy small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apple-external-app-result__copy strong {
  color: var(--on-surface, var(--fg));
  font-size: 0.9rem;
  font-weight: 900;
}
.apple-external-app-result__copy small {
  color: var(--muted);
  font-size: 0.76rem;
}
.apple-external-app-status {
  min-height: 1.1rem;
  margin: 0;
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 750;
}
.apple-external-app-status.is-error {
  color: var(--danger, #ff8b8b);
}
.form-apple-account .factory-select__option[data-value="__app_store_import__"] {
  margin-top: 0.35rem;
  border-top: 1px solid var(--outline-variant, var(--border));
  color: var(--primary, #7cc4ff);
  font-weight: 850;
}
.apple-external-app-selection-status {
  display: block;
  min-height: 1.1rem;
  margin-top: 0.35rem;
}
.apple-phone-expiry-cell {
  text-align: center;
}
.apple-phone-expiry-value {
  display: inline-block;
  min-width: 1.5ch;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.apple-phone-availability-value {
  display: inline-block;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.apple-phone-expiry-value--ok {
  color: #86efac;
}
.apple-phone-expiry-value--warning {
  color: #f59e0b;
}
.apple-phone-expiry-value--error {
  color: #ff9b9b;
}
.apple-status-value {
  flex: 1 1 auto;
}
.apple-proxy-value {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  flex-direction: column;
  gap: 0.1rem;
  line-height: 1.2;
}
.apple-proxy-name,
.apple-proxy-meta {
  max-width: 100%;
}
.apple-proxy-meta {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 700;
}
.apple-status-value--ok {
  color: #86efac;
}
.apple-status-value--error {
  color: #ff9b9b;
}
.apple-status-value--rate_limited {
  color: #facc15;
}
.apple-status-value--deleted {
  color: #ffb4b4;
}
.apple-status-value--missing {
  color: #ffb4b4;
}
.apple-cell-button:hover,
.apple-cell-button:focus-visible {
  background: rgba(29, 155, 240, 0.16);
  border-color: rgba(143, 211, 255, 0.42);
  outline: none;
}
.apple-cell-button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.apple-icon-button {
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 2rem;
  border: 1px solid rgba(143, 211, 255, 0.28);
  border-radius: 7px;
  padding: 0;
  background: rgba(29, 155, 240, 0.08);
  color: #8fd3ff;
  cursor: pointer;
  text-decoration: none;
}
.apple-icon-button svg {
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.apple-icon-button:hover,
.apple-icon-button:focus-visible {
  background: rgba(29, 155, 240, 0.16);
  border-color: rgba(143, 211, 255, 0.42);
  outline: none;
}
.apple-icon-button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.apple-adspower-delete {
  border-color: rgba(255, 155, 155, 0.38);
  background: rgba(244, 33, 46, 0.1);
  color: #ffb4b4;
}
.apple-adspower-delete:hover,
.apple-adspower-delete:focus-visible {
  border-color: rgba(255, 155, 155, 0.56);
  background: rgba(244, 33, 46, 0.18);
  color: #ffd1d1;
}
.apple-accounts-table .apple-block-heading,
.apple-accounts-table .apple-block-cell {
  text-align: center;
}
.apple-block-heading-icon {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: middle;
}
.apple-block-form {
  justify-content: center;
}
.apple-block-toggle {
  border-color: rgba(139, 152, 165, 0.28);
  background: rgba(139, 152, 165, 0.08);
  color: var(--muted);
}
.apple-block-toggle:hover,
.apple-block-toggle:focus-visible {
  border-color: rgba(255, 155, 155, 0.42);
  background: rgba(244, 33, 46, 0.12);
  color: #ffb4b4;
}
.apple-block-toggle--active {
  border-color: rgba(255, 155, 155, 0.48);
  background: rgba(244, 33, 46, 0.18);
  color: #ffb4b4;
}
.apple-block-toggle--active:hover,
.apple-block-toggle--active:focus-visible {
  border-color: rgba(134, 239, 172, 0.44);
  background: rgba(34, 197, 94, 0.12);
  color: #9df4ba;
}
.apple-inline-list {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  flex: 1 1 auto;
}
.apple-run-chip,
.apple-name-chip,
.apple-count-pill {
  min-width: 0;
  max-width: 8.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apple-name-chip,
.apple-count-pill {
  display: inline-flex;
  align-items: center;
  min-height: 1.7rem;
  border: 1px solid rgba(139, 152, 165, 0.22);
  border-radius: 999px;
  padding: 0.15rem 0.45rem;
  color: var(--fg);
  background: rgba(139, 152, 165, 0.08);
  font-size: 0.78rem;
  font-weight: 700;
}
.apple-count-pill {
  flex: 0 0 auto;
  color: var(--muted);
}
.apple-run-select {
  width: 9.5rem;
}
.apple-manager-select {
  width: 8.5rem;
}
.apple-cell-stack--runs .apple-cell-form,
.apple-cell-stack--managers .apple-cell-form {
  flex: 0 0 auto;
}
.apple-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: flex-start;
  min-width: 36rem;
}
.apple-mini-form {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}
.apple-mini-form input {
  width: 5.5rem;
}
.apple-mini-form .apple-run-select {
  width: min(16rem, 100%);
}
.apple-form-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin: 1rem 0 2rem;
}
.page-apple-account-form .container {
  max-width: min(88rem, calc(100vw - 3rem));
}
.form-apple-account {
  max-width: 78rem;
}
.form-apple-account .fieldset {
  background: #0f1419;
}
.form-apple-account .field-pair-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: 0.9rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.form-apple-account .field-pair-row:last-child {
  margin-bottom: 0;
}
.form-apple-account .field-pair,
.form-apple-account .field-pair-row .field {
  min-width: 0;
  margin-bottom: 0;
}
.form-apple-account input,
.form-apple-account select,
.form-apple-account textarea {
  max-width: 100%;
  min-height: 2.45rem;
  border-radius: 8px;
  padding: 0.55rem 0.7rem;
  color-scheme: dark;
}
.form-apple-account textarea {
  min-height: 8rem;
}
.apple-form-inline-link {
  display: inline-block;
  margin-top: 0.35rem;
  color: #9fd6ff;
  font-size: 0.9rem;
  font-weight: 700;
  text-decoration: none;
}
.apple-form-inline-link:hover,
.apple-form-inline-link:focus-visible {
  color: #d7efff;
  text-decoration: underline;
  outline: none;
}
.form-apple-account .hint {
  margin-top: 0;
}
.apple-secret-field {
  position: relative;
  display: block;
}
.apple-secret-field input {
  width: 100%;
  padding-right: 3rem;
}
.apple-password-toggle {
  position: absolute;
  top: 50%;
  right: 0.45rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  transform: translateY(-50%);
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}
.apple-password-toggle:hover,
.apple-password-toggle:focus-visible,
.apple-password-toggle.is-visible {
  color: var(--fg);
  background: rgba(139, 152, 165, 0.14);
}
.apple-password-toggle:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}
.apple-password-toggle svg {
  width: 1.2rem;
  height: 1.2rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.apple-inline-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin: 0.25rem 0 1rem;
}
.apple-action-status {
  min-height: 1.35rem;
  color: var(--muted);
  font-size: 0.9rem;
}
.apple-action-status.is-ok {
  color: #86efac;
}
.apple-action-status.is-error {
  color: #ff9b9b;
}
.apple-action-status.is-busy {
  color: #8fd3ff;
}
.apple-transfer-dialog {
  width: min(42rem, calc(100vw - 2rem));
  max-height: calc(100vh - 4rem);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0;
  color: var(--fg);
  background: #0f1419;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.42);
}
.apple-transfer-dialog::backdrop {
  background: rgba(0, 0, 0, 0.58);
  backdrop-filter: blur(3px);
}
.apple-transfer-dialog__form {
  margin: 0;
}
.apple-transfer-dialog__head,
.apple-transfer-dialog__actions {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  border-bottom: 1px solid var(--border);
}
.apple-transfer-dialog__head h2 {
  margin: 0 0 0.35rem;
  font-size: 1.15rem;
}
.apple-transfer-dialog__body {
  display: grid;
  gap: 1rem;
  padding: 1rem;
}
.apple-transfer-dialog__actions {
  align-items: center;
  justify-content: flex-end;
  border-top: 1px solid var(--border);
  border-bottom: 0;
}
.apple-transfer-dialog__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--border);
  border-radius: 7px;
  color: var(--muted);
  background: rgba(139, 152, 165, 0.08);
  cursor: pointer;
}
.apple-transfer-run-list {
  display: grid;
  gap: 0.5rem;
}
.apple-transfer-run {
  display: flex;
  gap: 0.65rem;
  align-items: flex-start;
  padding: 0.7rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(17, 26, 36, 0.78);
}
.apple-transfer-run input {
  margin-top: 0.2rem;
}
.apple-transfer-run span {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.apple-transfer-run small {
  color: var(--muted);
}
.apple-linked-runs {
  margin-top: 1rem;
}
.apple-linked-runs-title {
  display: block;
  margin-bottom: 0.4rem;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
}
.apple-advanced-details,
.adspower-settings-details,
.adspower-profile-panel {
  margin-top: 1rem;
}
.apple-advanced-details > summary,
.adspower-settings-details > summary,
.adspower-schema-details > summary,
.adspower-profile-details > summary {
  cursor: pointer;
  font-weight: 700;
}
.apple-advanced-details[open] > summary {
  margin-bottom: 0.8rem;
}
.adspower-settings-pre,
.adspower-profile-json {
  max-height: 24rem;
  overflow: auto;
}
.adspower-profile-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: 0.75rem;
  margin: 0.75rem 0;
}
.adspower-profile-grid div {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.6rem 0.7rem;
  background: #111a24;
}
.adspower-profile-grid dt {
  color: var(--muted);
  font-size: 0.78rem;
  margin-bottom: 0.25rem;
}
.adspower-profile-grid dd {
  margin: 0;
  word-break: break-word;
}
@media (max-width: 1100px) {
  .page-apple-accounts .detail-hero {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .page-apple-accounts .detail-hero-main {
    max-width: none;
  }
  .apple-filter-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) max-content max-content;
  }
  .apple-filter-bar--hero {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .apple-status-filter-row .apple-status-summary {
    grid-template-columns: 1fr;
    grid-template-areas:
      "statuses"
      "overview";
  }
  .apple-status-filter-row .apple-summary-overview {
    position: static;
    z-index: auto;
    grid-area: overview;
    flex-direction: column;
    align-items: flex-start;
    max-width: 100%;
  }
  .apple-status-filter-row .apple-summary-section {
    align-items: flex-start;
  }
  .apple-status-filter-row .apple-summary-section--finance {
    width: 100%;
    padding-top: 0.75rem;
    padding-left: 0;
    border-top: 1px solid rgba(139, 152, 165, 0.2);
    border-left: 0;
  }
  .apple-status-filter-row .apple-summary-metrics {
    justify-content: flex-start;
    white-space: normal;
  }
  .apple-status-filter-row .apple-unit-finance-summary {
    position: static;
    width: auto;
    display: block;
    justify-self: stretch;
    margin-top: 0.2rem;
    padding-top: 0.75rem;
    padding-left: 0;
    border-top: 1px solid rgba(139, 152, 165, 0.2);
    border-left: 0;
  }
  .apple-status-filter-row .apple-unit-finance-summary h4 {
    margin-bottom: 0.5rem;
  }
  .apple-status-filter-row .apple-unit-finance-list {
    max-width: 100%;
  }
  .apple-unit-entity-filter {
    grid-column: 1 / -1;
  }
  .apple-status-summary-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .apple-row-actions,
  .apple-mini-form {
    flex-direction: column;
  }
}
@media (max-width: 720px) {
  body.page-apple-accounts .container {
    padding: 1rem;
  }
  .apple-filter-bar {
    grid-template-columns: 1fr;
  }
  .apple-unit-entity-filter {
    min-height: 0;
  }
  .apple-external-app-search,
  .apple-external-app-result {
    grid-template-columns: 1fr;
  }
  .apple-external-app-result__icon {
    display: none;
  }
  .apple-status-summary-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .apple-account-status-banner {
    align-items: stretch;
    flex-direction: column;
  }
  .apple-account-status-banner__action .btn {
    width: 100%;
  }
}
.page-run-repair .detail-hero-side form {
  margin: 0;
}

.run-repair-summary,
.run-repair-stream,
.run-repair-result,
.run-repair-followup {
  margin-top: 18px;
}

.run-repair-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px;
  margin: 12px 0 16px;
}

.run-repair-facts span {
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-muted);
  min-width: 0;
}

.run-repair-facts code {
  overflow-wrap: anywhere;
}

.run-repair-error {
  padding: 10px 12px;
  border: 1px solid var(--danger-border, #f2b8b5);
  border-radius: 8px;
  background: var(--danger-bg, #fff4f3);
  color: var(--danger, #b42318);
}

.run-repair-problems {
  display: grid;
  gap: 10px;
}

.run-repair-problem {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface);
}

.run-repair-problem h3 {
  margin: 0 0 8px;
  font-size: 15px;
}

.run-repair-problem pre,
.run-repair-response,
.run-repair-msg-pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.run-repair-response {
  min-height: 90px;
  margin: 0;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-muted);
}

.run-repair-msg-pre {
  margin: 0;
  font-family: inherit;
}

.run-repair-followup-form textarea {
  resize: vertical;
}

/* Material 3 desktop migration layer */
:root {
  color-scheme: dark;
  --m3-surface: #101418;
  --m3-surface-container-lowest: #0b0f13;
  --m3-surface-container-low: #171c20;
  --m3-surface-container: #1b2024;
  --m3-surface-container-high: #252a2f;
  --m3-surface-container-highest: #30363c;
  --m3-on-surface: #e2e2e5;
  --m3-on-surface-variant: #c2c7cf;
  --m3-outline: #8c929a;
  --m3-outline-variant: #434a51;
  --m3-primary: #9ecaff;
  --m3-on-primary: #003257;
  --m3-primary-container: #0f4778;
  --m3-on-primary-container: #d2e4ff;
  --m3-secondary: #bec9d7;
  --m3-on-secondary: #28323d;
  --m3-secondary-container: #3e4752;
  --m3-on-secondary-container: #dae5f3;
  --m3-error: #ffb4ab;
  --m3-on-error: #690005;
  --m3-error-container: #93000a;
  --m3-on-error-container: #ffdad6;

  --surface: var(--m3-surface-container);
  --surface-muted: var(--m3-surface-container-low);
  --surface-container: var(--m3-surface-container);
  --surface-container-low: var(--m3-surface-container-low);
  --surface-container-high: var(--m3-surface-container-high);
  --surface-container-highest: var(--m3-surface-container-highest);
  --on-surface: var(--m3-on-surface);
  --on-surface-variant: var(--m3-on-surface-variant);
  --outline: var(--m3-outline);
  --outline-variant: var(--m3-outline-variant);
  --primary: var(--m3-primary);
  --primary-container: var(--m3-primary-container);
  --secondary: var(--m3-secondary);
  --secondary-container: var(--m3-secondary-container);
  --error: var(--m3-error);
  --danger: var(--m3-error);
  --danger-bg: rgba(147, 0, 10, 0.18);
  --danger-border: rgba(255, 180, 171, 0.42);
  --success: #86efac;
  --success-bg: rgba(34, 197, 94, 0.14);
  --success-border: rgba(134, 239, 172, 0.34);
  --warning: #fbbf24;
  --warning-bg: rgba(245, 181, 0, 0.14);
  --warning-border: rgba(245, 181, 0, 0.34);
  --theme-top-bg: rgba(16, 20, 24, 0.92);
  --theme-top-bg-elevated: rgba(21, 32, 43, 0.98);
  --theme-top-border: rgba(140, 146, 154, 0.28);
  --theme-nav-bg: var(--surface-container);
  --theme-nav-hover-bg: var(--surface-container-high);
  --theme-nav-border: rgba(140, 146, 154, 0.24);
  --theme-active-bg: rgba(158, 202, 255, 0.16);
  --theme-active-border: rgba(158, 202, 255, 0.36);
  --theme-active-fg: var(--m3-on-primary-container);
  --theme-control-bg: var(--surface-container-high);
  --theme-control-bg-strong: var(--m3-surface-container-lowest);
  --theme-control-hover-bg: #172536;
  --theme-control-placeholder: rgba(194, 199, 207, 0.72);
  --theme-card-bg: var(--surface-container-low);
  --theme-shadow-strong: rgba(0, 0, 0, 0.35);
  --theme-focus-ring: rgba(158, 202, 255, 0.28);
  --theme-on-accent: #061118;
  --theme-field-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
  --theme-row-hover: rgba(158, 202, 255, 0.045);
  --theme-login-glow-primary: rgba(29, 155, 240, 0.18);
  --theme-login-glow-secondary: rgba(0, 186, 124, 0.14);

  --shape-xs: 4px;
  --shape-sm: 8px;
  --shape-md: 12px;
  --shape-lg: 16px;
  --shape-xl: 24px;
  --shape-pill: 999px;

  --elevation-0: none;
  --elevation-1: 0 1px 2px rgba(0, 0, 0, 0.34), 0 1px 3px rgba(0, 0, 0, 0.22);
  --elevation-2: 0 3px 8px rgba(0, 0, 0, 0.30), 0 1px 3px rgba(0, 0, 0, 0.28);
  --elevation-3: 0 8px 18px rgba(0, 0, 0, 0.32), 0 2px 6px rgba(0, 0, 0, 0.24);

  --density-control-height: 40px;
  --density-control-height-compact: 32px;
  --density-table-row: 44px;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;

  --bg: var(--m3-surface);
  --fg: var(--m3-on-surface);
  --muted: var(--m3-on-surface-variant);
  --accent: var(--m3-primary);
  --border: var(--m3-outline-variant);
  --err: var(--m3-error);
  --warn: var(--warning);
  --text: var(--on-surface);
  --text-secondary: var(--on-surface-variant);
}

html[data-theme="light"] {
  color-scheme: light;
  --m3-surface: #f8fafc;
  --m3-surface-container-lowest: #ffffff;
  --m3-surface-container-low: #f3f6fa;
  --m3-surface-container: #eef3f8;
  --m3-surface-container-high: #e4ebf2;
  --m3-surface-container-highest: #d9e2eb;
  --m3-on-surface: #111820;
  --m3-on-surface-variant: #4b5563;
  --m3-outline: #6b7280;
  --m3-outline-variant: #cbd5e1;
  --m3-primary: #006aa9;
  --m3-on-primary: #ffffff;
  --m3-primary-container: #d7eaff;
  --m3-on-primary-container: #001d36;
  --m3-secondary: #536471;
  --m3-on-secondary: #ffffff;
  --m3-secondary-container: #d8e4f1;
  --m3-on-secondary-container: #101d29;
  --m3-error: #b42318;
  --m3-on-error: #ffffff;
  --m3-error-container: #ffdad6;
  --m3-on-error-container: #410002;
  --danger-bg: #fff4f3;
  --danger-border: #f2b8b5;
  --success: #047857;
  --success-bg: rgba(16, 185, 129, 0.12);
  --success-border: rgba(4, 120, 87, 0.28);
  --warning: #a15c00;
  --warning-bg: rgba(245, 158, 11, 0.14);
  --warning-border: rgba(161, 92, 0, 0.28);
  --theme-top-bg: rgba(255, 255, 255, 0.88);
  --theme-top-bg-elevated: rgba(255, 255, 255, 0.98);
  --theme-top-border: rgba(100, 116, 139, 0.22);
  --theme-nav-bg: rgba(241, 245, 249, 0.86);
  --theme-nav-hover-bg: rgba(226, 232, 240, 0.86);
  --theme-nav-border: rgba(148, 163, 184, 0.34);
  --theme-active-bg: rgba(0, 106, 169, 0.10);
  --theme-active-border: rgba(0, 106, 169, 0.28);
  --theme-active-fg: #004a78;
  --theme-control-bg: #ffffff;
  --theme-control-bg-strong: #f8fafc;
  --theme-control-hover-bg: #f1f5f9;
  --theme-control-placeholder: rgba(75, 85, 99, 0.68);
  --theme-card-bg: #ffffff;
  --theme-shadow-strong: rgba(15, 23, 42, 0.13);
  --theme-focus-ring: rgba(0, 106, 169, 0.20);
  --theme-on-accent: #ffffff;
  --theme-field-shadow: inset 0 1px 0 rgba(15, 23, 42, 0.03);
  --theme-row-hover: rgba(0, 106, 169, 0.055);
  --theme-login-glow-primary: rgba(0, 106, 169, 0.12);
  --theme-login-glow-secondary: rgba(16, 185, 129, 0.10);
  --elevation-1: 0 1px 2px rgba(15, 23, 42, 0.08), 0 1px 3px rgba(15, 23, 42, 0.07);
  --elevation-2: 0 8px 18px rgba(15, 23, 42, 0.10), 0 2px 6px rgba(15, 23, 42, 0.08);
  --elevation-3: 0 18px 42px rgba(15, 23, 42, 0.12), 0 4px 12px rgba(15, 23, 42, 0.08);
}

body {
  background:
    linear-gradient(180deg, var(--m3-surface-container-lowest) 0%, var(--m3-surface) 18rem),
    var(--m3-surface);
  color: var(--on-surface);
}

.top {
  display: block;
  min-height: 64px;
  padding: var(--space-2) var(--space-6);
  border-bottom-color: var(--theme-top-border);
  background: transparent;
  box-shadow: var(--elevation-1);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.factory-shell {
  min-height: 100vh;
}

.top-inner {
  display: grid;
  grid-template-columns: minmax(300px, auto) minmax(320px, 1fr) auto;
  align-items: center;
  gap: var(--space-4);
  width: min(100%, 1680px);
  margin: 0 auto;
}

.top-left,
.top-center,
.top-actions {
  min-width: 0;
}

.top-center {
  justify-content: center;
}

.top-actions {
  justify-content: flex-end;
}

.top-nav,
.top-quick-nav,
.top-menu-panel,
.nav-app-search-input,
.nav-app-search-dropdown {
  border-color: var(--theme-nav-border);
  background: var(--theme-nav-bg);
  box-shadow: var(--elevation-1);
}

.top-quick-nav {
  padding: 0;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.nav-icon-link,
.top-menu-link,
.nav-app-search-input {
  min-height: var(--density-control-height);
  border-radius: var(--shape-pill);
}

.nav-icon-link:hover,
.nav-icon-link:focus-visible,
.top-menu-link:hover,
.top-menu-link:focus-visible,
.nav-app-search-item:hover,
.nav-app-search-item:focus {
  background: var(--surface-container-high);
}

.nav-app-search-result-row .nav-app-search-item:hover,
.nav-app-search-result-row .nav-app-search-item:focus {
  background: transparent;
}

.nav-icon-link.is-active,
.top-menu[open] .top-menu-trigger,
.top-menu-link.is-active {
  color: var(--theme-active-fg) !important;
  background: var(--theme-active-bg);
  border-color: var(--theme-active-border);
}

.container {
  width: 100%;
  max-width: 1200px;
  padding: var(--space-6) var(--space-8);
}

.page-run-detail .container,
.page-step-detail .container,
.page-accounts .container {
  max-width: min(100%, 1440px);
}

.btn,
.form button:not([class]) {
  min-height: var(--density-control-height);
  border-radius: var(--shape-pill);
  padding: 0.56rem 1.15rem;
  font-weight: 650;
  letter-spacing: 0;
  transition:
    background 0.14s ease,
    border-color 0.14s ease,
    box-shadow 0.14s ease,
    color 0.14s ease,
    transform 0.14s ease;
}

.btn:hover:not(:disabled),
.form button:not([class]):hover:not(:disabled) {
  transform: translateY(-1px);
}

.btn:focus-visible,
.form button:not([class]):focus-visible,
.form input:focus,
.form textarea:focus,
.form select:focus,
.field input:focus,
.field textarea:focus,
.field select:focus,
.portfolio-board-text-filter:focus {
  outline: 3px solid var(--theme-focus-ring);
  outline-offset: 2px;
}

.btn-primary,
.form button:not([class]) {
  background: var(--m3-primary);
  border-color: var(--m3-primary);
  color: var(--m3-on-primary) !important;
  box-shadow: var(--elevation-1);
}

.btn-primary:hover:not(:disabled),
.form button:not([class]):hover:not(:disabled) {
  background: color-mix(in srgb, var(--m3-primary) 86%, var(--m3-surface-container-lowest));
  border-color: color-mix(in srgb, var(--m3-primary) 86%, var(--m3-surface-container-lowest));
  filter: none;
  box-shadow: var(--elevation-2);
}

.btn-secondary,
.btn-nav,
.btn-breadcrumb,
.btn-inline,
.btn-ghost,
.btn-table,
.gen-toolbar .btn-secondary {
  background: transparent;
  border-color: rgba(140, 146, 154, 0.42);
  color: var(--m3-primary) !important;
}

.btn-secondary:hover:not(:disabled),
.btn-nav:hover,
.btn-breadcrumb:hover,
.btn-inline:hover,
.btn-ghost:hover,
.btn-table:hover,
.gen-toolbar .btn-secondary:hover:not(:disabled) {
  background: rgba(158, 202, 255, 0.10);
  border-color: rgba(158, 202, 255, 0.42);
}

.btn-danger {
  background: var(--m3-error-container);
  border-color: var(--m3-error-container);
  color: var(--m3-on-error-container) !important;
}

.btn-danger:hover:not(:disabled) {
  background: #b3261e;
}

.table {
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.92rem;
}

.table th,
.table td {
  min-height: var(--density-table-row);
  padding: 0.66rem 0.9rem;
  border-bottom-color: rgba(140, 146, 154, 0.18);
  vertical-align: middle;
}

.table th {
  color: var(--on-surface-variant);
  background: var(--surface-container-low);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.table tr:hover td {
  background: var(--theme-row-hover);
}

.pill {
  border-radius: var(--shape-pill);
  padding: 0.18rem 0.58rem;
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.3;
}

.pill:not([class*="pill--"]) {
  border: 1px solid rgba(140, 146, 154, 0.22);
  background: var(--surface-container-high);
  color: var(--on-surface-variant);
}

.fieldset,
.apps-table-wrap {
  border-color: rgba(140, 146, 154, 0.24);
  border-radius: var(--shape-lg);
  background: var(--surface-container-low);
  box-shadow: var(--elevation-1);
}

.fieldset {
  padding: var(--space-5);
}

.fieldset legend,
.field-title {
  color: var(--on-surface);
  font-weight: 650;
}

.field {
  margin-bottom: var(--space-5);
}

.form input,
.form textarea,
.form select,
.field input,
.field textarea,
.field select,
.run-config-yaml-textarea,
.portfolio-board-text-filter {
  min-height: var(--density-control-height);
  border-color: rgba(140, 146, 154, 0.34);
  border-radius: var(--shape-sm);
  background: var(--surface-container-high);
  color: var(--on-surface);
  box-shadow: var(--theme-field-shadow);
}

.form textarea,
.field textarea,
.run-config-yaml-textarea {
  min-height: 7.5rem;
}

.form input::placeholder,
.form textarea::placeholder,
.portfolio-board-text-filter::placeholder {
  color: var(--theme-control-placeholder);
}

.detail-hero {
  gap: var(--space-5);
  padding: var(--space-6);
  border-color: rgba(140, 146, 154, 0.24);
  border-radius: var(--shape-xl);
  background:
    linear-gradient(135deg, rgba(158, 202, 255, 0.12) 0%, transparent 42%),
    var(--surface-container-low);
  box-shadow: var(--elevation-2);
}

.detail-hero h1 {
  letter-spacing: 0;
}

.detail-subtitle,
.detail-stat-label,
.hint,
.meta {
  color: var(--on-surface-variant);
}

.detail-stat-card {
  border-color: rgba(140, 146, 154, 0.22);
  border-radius: var(--shape-md);
  background: var(--surface-container);
  box-shadow: var(--elevation-1);
}

.detail-stat-card strong {
  color: var(--on-surface);
}

.apps-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scrollbar-gutter: stable;
  scrollbar-color: rgba(158, 202, 255, 0.42) rgba(24, 28, 32, 0.72);
}

.apps-table-wrap:focus-visible {
  outline: 3px solid rgba(158, 202, 255, 0.28);
  outline-offset: 3px;
}

.apps-table-wrap::-webkit-scrollbar {
  height: 12px;
}

.apps-table-wrap::-webkit-scrollbar-track {
  background: rgba(24, 28, 32, 0.72);
  border-radius: var(--shape-pill);
}

.apps-table-wrap::-webkit-scrollbar-thumb {
  background: rgba(158, 202, 255, 0.42);
  border: 3px solid rgba(24, 28, 32, 0.72);
  border-radius: var(--shape-pill);
}

.apps-table-wrap .table th {
  position: sticky;
  top: 0;
  z-index: 1;
}

.apps-table {
  font-size: 0.92rem;
  width: max-content;
  min-width: max(100%, 1320px);
}

.apps-table .apps-unit-head,
.apps-table td.apps-unit-cell {
  width: 6.25rem;
  min-width: 6.25rem;
  max-width: 7rem;
}

.apps-table .apps-unit-view {
  max-width: 6.25rem;
}

.apps-table .apps-unit-pill {
  max-width: 4.75rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.apps-table .apps-release-head,
.apps-table .apps-release-cell {
  width: 21rem;
  min-width: 21rem;
  max-width: 27rem;
}

.apps-table .apps-release-cell--empty {
  width: 7.5rem;
  min-width: 7.5rem;
}

.apps-table th,
.apps-table td {
  min-height: 0;
  padding: 0.42rem 0.58rem;
  vertical-align: top;
}

.apps-table th {
  padding-block: 0.5rem;
}

.apps-table .btn,
.apps-table .btn-table,
.apps-table .btn-small {
  min-height: 1.75rem;
  padding: 0.22rem 0.52rem;
  border-radius: var(--shape-pill);
  font-size: 0.84rem;
  line-height: 1.2;
}

.apps-table .pill {
  padding: 0.1rem 0.42rem;
  font-size: 0.78rem;
  line-height: 1.2;
}

.apps-table .apps-app-id-pill {
  padding: 0.16rem 0.4rem;
  font-size: 0.84rem;
  line-height: 1.18;
}

.apps-table .apps-app-inner {
  align-items: flex-start;
  gap: 0.45rem;
}

.apps-table .apps-app-title-row {
  gap: 0.35rem;
}

.apps-table .apps-release-card,
.apps-table .apps-asc-meta-list {
  gap: 0.22rem;
}

.apps-table .apps-release-statuses,
.apps-table .apps-asc-status-line {
  gap: 0.25rem;
}

.apps-table .apps-release-statuses,
.apps-table .apps-asc-status-line,
.apps-table .apps-asc-manual-reason-view {
  flex-wrap: nowrap;
  min-width: 0;
}

.apps-table .apps-asc-status-line,
.apps-table .apps-asc-manual-reason,
.apps-table .apps-asc-manual-reason-view {
  max-width: 100%;
}

.apps-table .apps-asc-manual-reason,
.apps-table .apps-asc-manual-reason-item {
  min-width: 0;
}

.apps-table .apps-asc-manual-reason-pill {
  max-width: 8.5rem;
}

.apps-table .apps-asc-refresh-btn,
.apps-table .apps-asc-manual-reason-edit-btn,
.apps-table .apps-asc-manual-reason-remove-btn {
  flex: 0 0 auto;
  width: 1.35rem;
  height: 1.35rem;
  min-height: 0;
  padding: 0;
  line-height: 1;
}

.apps-table .apps-asc-meta > summary,
.apps-table .apps-build-meta > summary {
  padding: 0;
  font-size: 0.8rem;
  line-height: 1.1;
}

.apps-table .apps-app-meta,
.apps-table .apps-subline,
.apps-table .apps-asc-meta,
.apps-table .apps-build-meta {
  margin-top: 0.14rem;
}

.apps-table .apps-saler-inline {
  margin-top: 0.22rem;
}

.apps-table .apps-asc-email-cell--merged {
  padding-top: 0.58rem;
}

.apps-table .apps-icon,
.apps-table .run-list-icon {
  width: 34px;
  height: 34px;
}

.apps-table .apps-icon--empty {
  line-height: 34px;
}

.apps-row--sales-closed {
  background:
    linear-gradient(90deg, rgba(245, 181, 0, 0.18) 0%, rgba(245, 181, 0, 0.10) 46%, rgba(245, 181, 0, 0.04) 100%),
    var(--surface-container-low);
}

.apps-row--sales-closed > td,
.table tr.apps-row--sales-closed:hover > td {
  background: transparent;
}

.apps-asc-email-cell--sales-closed {
  background:
    linear-gradient(90deg, rgba(245, 181, 0, 0.18) 0%, rgba(245, 181, 0, 0.08) 100%),
    var(--surface-container-low);
}

.apps-row--sales-closed > td:first-child,
.apps-asc-email-cell--sales-closed {
  box-shadow: inset 3px 0 0 rgba(245, 181, 0, 0.72);
}

.apps-row--sales-closed .apps-release-card {
  border-color: rgba(245, 181, 0, 0.30);
}

body.page-portfolio-board {
  background:
    linear-gradient(180deg, var(--m3-surface-container-lowest) 0%, var(--m3-surface) 16rem),
    var(--m3-surface);
}

.portfolio-board-hero,
.portfolio-board-filters-wrap,
.portfolio-board-col,
.portfolio-board-card {
  border-color: rgba(140, 146, 154, 0.24);
  background: var(--surface-container-low);
  box-shadow: var(--elevation-1);
}

.portfolio-board-hero {
  border-radius: var(--shape-xl);
  padding: var(--space-5) var(--space-6);
}

.page-portfolio-board .portfolio-board-hero {
  border-radius: 10px;
  background: #111a24;
  box-shadow: none;
}

.portfolio-board-filters-wrap {
  border-radius: var(--shape-lg);
}

.page-portfolio-board .portfolio-board-filters-wrap {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.portfolio-board-columns {
  gap: var(--space-4);
  padding-bottom: var(--space-6);
}

.portfolio-board-col {
  flex-basis: 296px;
  max-width: min(296px, 92vw);
  border-radius: var(--shape-lg);
}

.portfolio-board-col-header {
  border-bottom-color: rgba(140, 146, 154, 0.18);
  border-radius: var(--shape-lg) var(--shape-lg) 0 0;
  background:
    linear-gradient(90deg, var(--col-accent-dim) 0%, rgba(27, 32, 36, 0.96) 68%),
    var(--surface-container);
  box-shadow: none;
}

.portfolio-board-col-body {
  padding: var(--space-2);
}

.portfolio-board-card {
  border-radius: var(--shape-md);
  margin-bottom: var(--space-2);
}

.portfolio-board-card:hover {
  border-color: rgba(158, 202, 255, 0.36);
  box-shadow: var(--elevation-2);
}

.portfolio-board-card--sales-closed {
  border-color: rgba(245, 181, 0, 0.42);
  background:
    linear-gradient(145deg, rgba(245, 181, 0, 0.14), rgba(107, 75, 0, 0.10) 44%, rgba(27, 32, 36, 0.92) 100%),
    var(--surface-container-low);
  box-shadow:
    inset 3px 0 0 rgba(245, 181, 0, 0.72),
    var(--elevation-1);
}

.portfolio-board-card--sales-closed:hover {
  border-color: rgba(245, 181, 0, 0.58);
  box-shadow:
    inset 3px 0 0 rgba(245, 181, 0, 0.86),
    var(--elevation-2);
}

.portfolio-board-card--sales-closed .portfolio-board-card-bg {
  opacity: 0.18;
  filter: saturate(0.95) blur(0.5px);
}

.portfolio-board-card--sales-closed .portfolio-board-card-scrim {
  background:
    linear-gradient(155deg, rgba(245, 181, 0, 0.32) 0%, rgba(122, 87, 0, 0.20) 34%, rgba(15, 20, 25, 0.92) 100%);
}

.portfolio-board-card-pill,
.portfolio-board-card-reason-pill,
.portfolio-board-auto-tag,
.portfolio-board-manual-tag,
.portfolio-board-col-count {
  border-radius: var(--shape-pill);
}

@media (min-width: 1180px) {
  .nav-icon-link {
    min-width: 2.5rem;
  }

  .nav-app-search {
    width: min(100%, 48rem);
  }
}

@media (max-width: 900px) {
  .top {
    padding-inline: var(--space-4);
  }

  .top-inner {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-3);
  }

  .top-center {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .nav-app-search {
    width: 100%;
    min-width: 0;
  }
}

/* App indexing */
.page-app-indexing .container {
  max-width: min(100%, 1440px);
}

.page-app-indexing .indexing-hero {
  margin-bottom: var(--space-5);
}

.indexing-warning {
  margin: 0 0 var(--space-5);
}

.indexing-success-panel,
.indexing-wizard {
  max-width: 1120px;
  margin: 0 auto var(--space-6);
}

.indexing-success-panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: var(--space-4);
  align-items: start;
  padding: var(--space-6);
  border: 1px solid rgba(134, 239, 172, 0.26);
  border-radius: var(--shape-lg);
  background:
    linear-gradient(135deg, rgba(34, 197, 94, 0.14), transparent 36rem),
    var(--surface-container-low);
  box-shadow: var(--elevation-2);
}

.indexing-success-icon {
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  border: 1px solid rgba(134, 239, 172, 0.48);
  border-radius: var(--shape-pill);
  background: rgba(34, 197, 94, 0.14);
  color: #86efac;
}

.indexing-success-icon svg {
  width: 1.35rem;
  height: 1.35rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.indexing-success-copy {
  min-width: 0;
}

.indexing-success-panel h2 {
  margin: 0 0 var(--space-3);
  color: var(--on-surface);
  font-size: clamp(1.35rem, 2.2vw, 1.85rem);
  line-height: 1.12;
  letter-spacing: 0;
}

.indexing-success-value {
  margin: 0 0 var(--space-3);
  width: fit-content;
  max-width: 100%;
  padding: 0.55rem 0.75rem;
  border: 1px solid rgba(134, 239, 172, 0.24);
  border-radius: var(--shape-sm);
  background: rgba(8, 13, 10, 0.38);
  color: #d9ffe6;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.indexing-success-actions {
  display: flex;
  justify-content: flex-end;
}

.indexing-current-note {
  margin: 0 0 var(--space-4);
  padding: 0.75rem 0.9rem;
  border: 1px solid rgba(158, 202, 255, 0.24);
  border-radius: var(--shape-md);
  background: rgba(158, 202, 255, 0.08);
  color: var(--on-surface-variant);
  overflow-wrap: anywhere;
}

.indexing-current-note strong {
  color: var(--on-surface);
}

.indexing-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-3);
}

.indexing-step {
  position: relative;
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  gap: var(--space-4);
  padding: var(--space-5);
  border: 1px solid rgba(140, 146, 154, 0.20);
  border-radius: var(--shape-lg);
  background: var(--surface-container-low);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

.indexing-step::after {
  content: "";
  position: absolute;
  left: calc(var(--space-5) + 1.25rem);
  top: 4.55rem;
  bottom: calc(-1 * var(--space-3));
  width: 1px;
  background: rgba(140, 146, 154, 0.18);
}

.indexing-step:last-child::after {
  display: none;
}

.indexing-step.is-active {
  border-color: rgba(158, 202, 255, 0.46);
  background:
    linear-gradient(135deg, rgba(158, 202, 255, 0.10), transparent 30rem),
    var(--surface-container);
  box-shadow: var(--elevation-2);
}

.indexing-step.is-complete {
  border-color: rgba(134, 239, 172, 0.24);
}

.indexing-step-marker {
  position: relative;
  z-index: 1;
  width: 2.5rem;
  height: 2.5rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(140, 146, 154, 0.26);
  border-radius: var(--shape-pill);
  background: var(--surface-container-high);
  color: var(--on-surface-variant);
  font-size: 0.95rem;
  font-weight: 800;
}

.indexing-step.is-active .indexing-step-marker {
  border-color: rgba(158, 202, 255, 0.58);
  background: var(--m3-primary);
  color: var(--m3-on-primary);
}

.indexing-step.is-complete .indexing-step-marker {
  border-color: rgba(134, 239, 172, 0.56);
  background: rgba(34, 197, 94, 0.18);
  color: #86efac;
}

.indexing-step-body {
  min-width: 0;
}

.indexing-step-body h2 {
  margin: 0 0 var(--space-4);
  color: var(--on-surface);
  font-size: 1.18rem;
  line-height: 1.25;
  letter-spacing: 0;
}

.indexing-account-kv {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3);
  margin: 0 0 var(--space-4);
}

.indexing-account-kv div {
  min-width: 0;
  padding: 0.85rem 0.95rem;
  border: 1px solid rgba(140, 146, 154, 0.20);
  border-radius: var(--shape-md);
  background: var(--surface-container);
}

.indexing-account-kv dt {
  margin: 0 0 0.35rem;
  color: var(--on-surface-variant);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.indexing-account-kv dd {
  margin: 0;
  color: var(--on-surface);
  overflow-wrap: anywhere;
  font-weight: 700;
  font-size: 1rem;
}

.indexing-input-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-3);
  align-items: center;
}

.indexing-input {
  width: 100%;
  min-height: var(--density-control-height);
  padding: 0.66rem 0.85rem;
  border: 1px solid rgba(140, 146, 154, 0.34);
  border-radius: var(--shape-sm);
  background: var(--surface-container-high);
  color: var(--on-surface);
  font: inherit;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

.indexing-input::placeholder {
  color: rgba(194, 199, 207, 0.72);
}

.indexing-input:focus {
  outline: 3px solid rgba(158, 202, 255, 0.28);
  outline-offset: 2px;
  border-color: rgba(158, 202, 255, 0.64);
}

.indexing-progress-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 3.4rem;
  gap: var(--space-3);
  align-items: center;
}

.indexing-progress {
  width: 100%;
  height: 0.72rem;
  overflow: hidden;
  border: 0;
  border-radius: var(--shape-pill);
  background: var(--surface-container-highest);
}

.indexing-progress::-webkit-progress-bar {
  border-radius: var(--shape-pill);
  background: var(--surface-container-highest);
}

.indexing-progress::-webkit-progress-value {
  border-radius: var(--shape-pill);
  background: linear-gradient(90deg, #9ecaff, #86efac);
}

.indexing-progress::-moz-progress-bar {
  border-radius: var(--shape-pill);
  background: linear-gradient(90deg, #9ecaff, #86efac);
}

.indexing-progress-value {
  color: var(--on-surface-variant);
  font-size: 0.86rem;
  font-weight: 700;
  text-align: right;
}

.indexing-progress-message {
  margin: var(--space-3) 0 var(--space-4);
  color: var(--on-surface-variant);
}

.indexing-form-error,
.indexing-run-error {
  max-width: 100%;
  overflow-wrap: anywhere;
}

.indexing-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: center;
}

@media (max-width: 720px) {
  .indexing-success-panel {
    grid-template-columns: 1fr;
  }

  .indexing-success-actions {
    justify-content: flex-start;
  }

  .indexing-account-kv,
  .indexing-input-row {
    grid-template-columns: 1fr;
  }

  .indexing-step {
    grid-template-columns: 2.25rem minmax(0, 1fr);
    gap: var(--space-3);
    padding: var(--space-4);
  }

  .indexing-step::after {
    left: calc(var(--space-4) + 1.125rem);
    top: 4.25rem;
  }

  .indexing-step-marker {
    width: 2.25rem;
    height: 2.25rem;
  }

  .indexing-progress-row {
    grid-template-columns: 1fr;
  }

  .indexing-progress-value {
    text-align: left;
  }
}

/* ASO rank tracking */
.page-aso-rank .container {
  max-width: 1440px;
}

.aso-warning {
  margin-bottom: 18px;
}

.aso-controls {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
  gap: 18px;
  align-items: stretch;
  margin-bottom: 20px;
}

.aso-controls--single {
  display: block;
}

.aso-control-panel,
.aso-chart-panel,
.aso-table-panel {
  background: var(--surface);
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  padding: 18px 20px;
  box-shadow: var(--elevation-1);
}

.aso-control-panel {
  display: flex;
  flex-direction: column;
}

.aso-control-panel--single {
  gap: 0;
}

.page-aso-rank .section-heading-row.aso-panel-heading,
.page-aso-rank .aso-control-panel .section-heading-row {
  align-items: center;
  margin: 0 0 14px;
}

.page-aso-rank .section-heading-row h2 {
  margin: 0;
  color: var(--on-surface);
  font-size: clamp(1.25rem, 2vw, 1.7rem);
  line-height: 1.14;
  letter-spacing: 0;
}

.page-aso-rank .eyebrow {
  margin-bottom: 6px;
  letter-spacing: 0.16em;
}

.aso-field {
  display: grid;
  gap: 8px;
  margin: 14px 0;
  font-size: 13px;
  font-weight: 700;
  color: var(--on-surface);
}

.aso-field textarea {
  width: 100%;
  min-height: 128px;
  resize: vertical;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container-high);
  color: var(--text);
  padding: 11px 12px;
  font: inherit;
  font-weight: 500;
}

.aso-field textarea:focus {
  outline: 2px solid rgba(158, 202, 255, 0.28);
  border-color: var(--accent);
}

.aso-selection-grid {
  display: grid;
  grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1.25fr);
  gap: 18px;
  align-items: start;
}

.aso-key-picker,
.aso-country-picker {
  display: grid;
  gap: 10px;
}

.aso-picker-head {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.aso-picker-head h3 {
  margin: 0;
  color: var(--on-surface);
  font-size: 14px;
  font-weight: 850;
  letter-spacing: 0;
}

.page-aso-rank .aso-add-key-btn {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
}

.aso-new-key-panel .aso-field {
  margin: 0;
}

.aso-new-key-panel .aso-field textarea {
  min-height: 88px;
}

.aso-country-search-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.aso-country-search {
  min-width: 0;
  min-height: 38px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container-high);
  color: var(--text);
  padding: 0 12px;
  font: inherit;
  font-size: 13px;
  font-weight: 650;
}

.aso-country-search::placeholder {
  color: var(--muted);
}

.aso-country-search:focus {
  outline: 2px solid rgba(158, 202, 255, 0.28);
  border-color: var(--accent);
}

.aso-country-count {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.aso-multi-filter {
  position: relative;
  min-width: 0;
}

.aso-multi-filter summary {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: center;
  min-height: 38px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  padding: 6px 34px 6px 10px;
  background: var(--surface-container-high);
  color: var(--text);
  cursor: pointer;
  list-style: none;
}

.aso-multi-filter summary::-webkit-details-marker {
  display: none;
}

.aso-multi-filter summary::after {
  content: "";
  position: absolute;
  right: 13px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid var(--muted);
  border-bottom: 1.5px solid var(--muted);
  transform: translateY(-60%) rotate(45deg);
  transition: transform 0.14s ease;
}

.aso-multi-filter[open] summary::after {
  transform: translateY(-35%) rotate(225deg);
}

.aso-multi-filter summary > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.06em;
  line-height: 1.1;
  text-transform: uppercase;
}

.aso-multi-filter summary strong {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  color: var(--on-surface);
  font-size: 13px;
  font-weight: 750;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-multi-filter.is-active summary {
  border-color: rgba(158, 202, 255, 0.62);
  box-shadow: 0 0 0 1px rgba(158, 202, 255, 0.16);
}

.aso-multi-filter-panel {
  position: absolute;
  z-index: 40;
  top: calc(100% + 6px);
  left: 0;
  min-width: max(100%, 260px);
  max-height: 290px;
  overflow: auto;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  padding: 8px;
  background: #0d1721;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.38);
}

.aso-filter-option {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 7px 9px;
  border-radius: 6px;
  color: var(--text);
  cursor: pointer;
  font-size: 13px;
  font-weight: 650;
}

.aso-filter-option:hover {
  background: rgba(255, 255, 255, 0.05);
}

.aso-filter-option input {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--primary);
}

.aso-filter-option span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-country-grid {
  border: 0;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
  gap: 8px;
  max-height: 240px;
  overflow: auto;
}

.aso-multi-filter-panel .aso-country-search-row {
  margin-bottom: 8px;
}

.aso-multi-filter-panel .aso-country-grid {
  max-height: none;
  overflow: visible;
}

.aso-country-empty {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
}

.aso-country-grid legend {
  font-size: 13px;
  font-weight: 800;
  margin-bottom: 8px;
}

.aso-country-grid label,
.aso-unit-key-list label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  padding: 7px 9px;
  background: var(--surface-container-high);
  color: var(--text);
  font-size: 13px;
  font-weight: 650;
}

.aso-country-grid label span,
.aso-unit-key-list label span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-country-grid--compact {
  max-height: 150px;
}

.aso-unit-key-list {
  display: grid;
  gap: 8px;
  max-height: 210px;
  overflow: auto;
  margin: 14px 0;
}

.aso-control-panel--single .aso-unit-key-list {
  max-height: 360px;
  margin: 0;
}

.aso-control-panel--single .aso-country-grid {
  max-height: 360px;
}

.aso-unit-key-list em {
  margin-left: auto;
  font-style: normal;
  color: var(--muted);
  font-size: 12px;
}

.aso-rank-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.aso-local-filter-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(160px, 0.55fr) auto;
  gap: 10px;
  align-items: end;
  margin: 0 0 12px;
}

.page-aso-rank .aso-local-filter-reset {
  min-height: 38px;
  padding: 0 13px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.aso-chart-periods {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.aso-chart-periods .is-active {
  background: var(--primary);
  color: #071018 !important;
  border-color: var(--primary);
}

html[data-theme="light"] .page-aso-rank .aso-chart-periods .btn.is-active {
  border-color: var(--m3-primary);
  background: var(--m3-primary);
  color: var(--m3-on-primary) !important;
  box-shadow: 0 8px 18px rgba(0, 106, 169, 0.18);
}

html[data-theme="light"] .page-aso-rank .aso-chart-periods .btn.is-active:hover,
html[data-theme="light"] .page-aso-rank .aso-chart-periods .btn.is-active:focus-visible {
  border-color: color-mix(in srgb, var(--m3-primary) 88%, var(--m3-surface-container-lowest));
  background: color-mix(in srgb, var(--m3-primary) 88%, var(--m3-surface-container-lowest));
  color: var(--m3-on-primary) !important;
}

.aso-chart-filter-form {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(180px, 0.7fr) auto;
  gap: 12px;
  align-items: end;
  margin: 4px 0 12px;
}

.aso-chart-filter-group {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.aso-chart-filter-group legend {
  margin-bottom: 7px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.aso-chart-filter-options {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  max-height: 86px;
  overflow: auto;
}

.aso-chart-filter-options label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  max-width: 240px;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid var(--outline-variant);
  border-radius: 999px;
  background: var(--surface-container-high);
  color: var(--text);
  font-size: 12px;
  font-weight: 750;
}

.aso-chart-filter-options label span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-chart-filter-options input {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: var(--primary);
}

.page-aso-rank .aso-chart-filter-submit {
  min-height: 34px;
  padding: 0 13px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.aso-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 8px 0 0;
}

.aso-chart-legend span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  max-width: 260px;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(140, 146, 154, 0.24);
  border-radius: 999px;
  background: var(--surface-container-high);
  color: var(--on-surface);
  font-size: 12px;
  font-weight: 750;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-chart-legend i {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 999px;
  background: var(--series-color, var(--accent));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--series-color, var(--accent)) 18%, transparent);
}

.aso-line-plot {
  position: relative;
  margin-top: 16px;
  padding: 12px 16px 38px 0;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background:
    linear-gradient(rgba(140, 146, 154, 0.10) 1px, transparent 1px) 42px 12px / calc(100% - 58px) 33.33% repeat-y,
    linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0));
}

.aso-line-y-axis {
  position: absolute;
  left: 12px;
  top: 12px;
  bottom: 38px;
  width: 30px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  pointer-events: none;
}

.aso-line-y-axis span {
  position: absolute;
  right: 0;
  max-width: 34px;
  overflow: hidden;
  text-align: right;
  text-overflow: ellipsis;
  transform: translateY(-50%);
  white-space: nowrap;
}

.aso-line-canvas {
  position: relative;
  height: 214px;
  margin-left: 42px;
}

.aso-line-x-grid {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  color: rgba(84, 98, 116, 0.24);
  overflow: visible;
  pointer-events: none;
}

.aso-line-x-grid line {
  stroke: currentColor;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.aso-volume-bars {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: visible;
  pointer-events: none;
}

.aso-volume-bars .aso-volume-bar {
  position: absolute;
  bottom: 0;
  display: block;
  min-height: 2px;
  border-radius: 2px 2px 0 0;
  background: rgba(126, 228, 161, 0.16);
  border-top: 1px solid rgba(126, 228, 161, 0.36);
  outline: 0;
  pointer-events: auto;
}

.aso-volume-bars .aso-volume-bar:hover,
.aso-volume-bars .aso-volume-bar:focus-visible {
  z-index: 7;
  background: rgba(126, 228, 161, 0.28);
  border-top-color: rgba(126, 228, 161, 0.74);
  box-shadow: 0 0 0 1px rgba(126, 228, 161, 0.42);
}

.aso-volume-tooltip {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 8px);
  z-index: 9;
  display: grid;
  gap: 4px;
  width: max-content;
  min-width: 96px;
  max-width: min(220px, calc(100vw - 36px));
  padding: 8px 10px;
  border-radius: 4px;
  background: rgba(45, 45, 45, 0.96);
  color: #ffffff;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.42);
  opacity: 0;
  pointer-events: none;
  text-align: center;
  transform: translate(-50%, 4px);
  transition: opacity 120ms ease, transform 120ms ease;
}

.aso-volume-tooltip::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  width: 8px;
  height: 8px;
  background: rgba(45, 45, 45, 0.96);
  transform: translate(-50%, -4px) rotate(45deg);
}

.aso-volume-tooltip strong {
  font-size: 12px;
  font-weight: 800;
  line-height: 1.1;
  white-space: nowrap;
}

.aso-volume-tooltip em {
  color: rgba(255, 255, 255, 0.72);
  font-size: 11px;
  font-style: normal;
  font-weight: 750;
  line-height: 1.1;
  white-space: nowrap;
}

.aso-volume-tooltip span {
  color: #7ee4a1;
  font-size: 14px;
  font-weight: 850;
  line-height: 1.1;
  white-space: nowrap;
}

.aso-volume-tooltip small {
  color: rgba(255, 255, 255, 0.72);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.1;
  white-space: nowrap;
}

.aso-volume-bar:hover .aso-volume-tooltip,
.aso-volume-bar:focus-visible .aso-volume-tooltip {
  opacity: 1;
  transform: translate(-50%, 0);
}

.aso-line-x-axis {
  position: absolute;
  right: 16px;
  bottom: 11px;
  left: 42px;
  height: 18px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
  line-height: 18px;
  pointer-events: none;
}

.aso-line-x-axis span {
  position: absolute;
  max-width: 56px;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  transform: translateX(-50%);
  white-space: nowrap;
}

.aso-line-svg {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.aso-line-svg path,
.aso-line-svg polyline,
.aso-sparkline polyline {
  fill: none;
  stroke: var(--series-color, var(--accent));
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.aso-line-point {
  position: absolute;
  z-index: 2;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: var(--series-color, var(--accent));
  border: 0;
  box-shadow: none;
  transform: translate(-50%, -50%);
}

.aso-line-point::before {
  content: "";
  position: absolute;
  inset: -8px;
  border-radius: 999px;
}

.aso-line-point:hover,
.aso-line-point:focus,
.aso-line-point:focus-visible {
  z-index: 8;
  outline: 0;
  box-shadow:
    0 0 0 1px var(--series-color, var(--accent)),
    0 0 0 6px color-mix(in srgb, var(--series-color, var(--accent)) 20%, transparent);
}

.aso-line-tooltip {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 10px);
  z-index: 9;
  display: grid;
  gap: 8px;
  width: max-content;
  max-width: min(320px, calc(100vw - 36px));
  padding: 10px 12px;
  border: 0;
  border-radius: 4px;
  background: rgba(45, 45, 45, 0.96);
  color: var(--on-surface);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.42);
  opacity: 0;
  pointer-events: none;
  text-align: left;
  transform: translate(-50%, 4px);
  transition: opacity 120ms ease, transform 120ms ease;
}

.aso-line-tooltip::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  width: 8px;
  height: 8px;
  background: rgba(45, 45, 45, 0.96);
  transform: translate(-50%, -4px) rotate(45deg);
}

.aso-line-point:hover .aso-line-tooltip,
.aso-line-point:focus .aso-line-tooltip,
.aso-line-point:focus-visible .aso-line-tooltip {
  opacity: 1;
  transform: translate(-50%, 0);
}

.aso-line-tooltip strong {
  color: #ffffff;
  font-size: 15px;
  font-weight: 750;
  line-height: 1.1;
  text-align: center;
}

.aso-line-tooltip-list {
  display: grid;
  gap: 7px;
}

.aso-line-tooltip-row {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  max-width: 280px;
}

.aso-line-tooltip-row i {
  width: 14px;
  height: 14px;
  border-radius: 4px;
  background: var(--series-color, var(--accent));
}

.aso-line-tooltip-row span {
  min-width: 0;
  max-width: 210px;
  overflow: hidden;
  color: #ffffff;
  font-size: 14px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-line-tooltip-row b {
  color: #3d82ff;
  font-size: 14px;
  font-weight: 850;
  line-height: 1;
}

.aso-table-wrap {
  overflow-x: auto;
  border: 1px solid rgba(140, 146, 154, 0.18);
  border-radius: 8px;
}

.aso-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 960px;
  table-layout: fixed;
  font-size: 14px;
}

.aso-col-key { width: 31%; }
.aso-col-geo { width: 72px; }
.aso-col-position { width: 96px; }
.aso-col-compare { width: 58px; }
.aso-col-delta { width: 72px; }
.aso-col-trend { width: 128px; }
.aso-col-slot { width: 150px; }
.aso-col-actions { width: 126px; }

.aso-table thead {
  background: rgba(11, 15, 19, 0.34);
}

.admin-table-sticky-head.aso-table-sticky-head {
  border-color: rgba(140, 146, 154, 0.18);
  border-radius: 8px 8px 0 0;
  background: var(--surface-container-highest, #1f232a);
  box-shadow: 0 12px 22px rgba(0, 0, 0, 0.22);
}

.admin-table-sticky-head .aso-table {
  width: auto;
  min-width: 0;
}

.admin-table-sticky-head .aso-table thead {
  background: rgba(11, 15, 19, 0.34);
}

.admin-table-sticky-head .aso-table th {
  border-bottom: 0;
}

.aso-table th,
.aso-table td {
  border-bottom: 1px solid var(--outline-variant);
  padding: 11px 14px;
  text-align: left;
  vertical-align: middle;
}

.aso-table tbody tr:last-child td {
  border-bottom: 0;
}

.aso-table tbody tr:nth-child(odd) {
  background: color-mix(in srgb, var(--primary) 8%, var(--surface-container-lowest, var(--surface)));
}

.aso-table tbody tr:nth-child(even) {
  background: var(--surface-container-lowest, var(--surface));
}

.aso-table tbody tr:hover {
  background: color-mix(in srgb, var(--primary) 12%, var(--surface-container-lowest, var(--surface)));
}

.aso-table th {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.aso-sort-button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  padding: 0;
  text-align: left;
  text-transform: inherit;
}

.aso-sort-button:hover,
.aso-sort-button.is-active {
  color: var(--accent);
}

.aso-th-sort {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  line-height: 1.15;
  padding: 0;
  text-align: left;
  text-transform: inherit;
}

.aso-th-sort:hover,
.aso-th-sort:focus-visible,
.aso-th-sort.is-active {
  color: var(--accent);
  outline: none;
}

.aso-th-sort i::before {
  content: "↕";
  font-style: normal;
  opacity: 0.38;
}

.aso-th-sort.is-active[data-sort-dir="asc"] i::before {
  content: "↑";
  opacity: 1;
}

.aso-th-sort.is-active[data-sort-dir="desc"] i::before {
  content: "↓";
  opacity: 1;
}

.aso-table-empty {
  margin: 12px 0 0;
}

.aso-table tr.is-selected {
  background: rgba(158, 202, 255, 0.09);
}

.aso-key-cell {
  display: grid;
  grid-template-columns: minmax(0, max-content) auto;
  gap: 6px 10px;
  align-items: center;
}

.aso-key-cell strong,
.aso-key-cell small {
  display: block;
}

.aso-key-cell--with-icon {
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 8px;
}

.aso-key-text {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.aso-key-bars {
  display: grid;
  grid-template-columns: repeat(3, 4px);
  gap: 3px;
  align-items: end;
  width: 22px;
  height: 25px;
  color: var(--on-surface);
  opacity: 0.95;
}

.aso-key-bars i {
  display: block;
  width: 4px;
  border-radius: 2px 2px 0 0;
  background: currentColor;
}

.aso-key-bars i:nth-child(1) {
  height: 12px;
}

.aso-key-bars i:nth-child(2) {
  height: 21px;
}

.aso-key-bars i:nth-child(3) {
  height: 16px;
}

.aso-key-top-btn {
  display: grid;
  place-items: center;
  width: 26px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--on-surface);
  cursor: pointer;
}

.aso-key-top-btn:hover,
.aso-key-top-btn:focus-visible {
  color: var(--accent);
  background: rgba(0, 116, 177, 0.08);
  outline: none;
}

.aso-key-top-btn .aso-key-bars {
  pointer-events: none;
}

.aso-key-cell strong {
  min-width: 0;
  overflow: hidden;
  color: var(--on-surface);
  font-size: 15px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-key-cell small {
  grid-column: 1 / -1;
  max-width: 260px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-geo-pill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.10);
  color: var(--on-surface);
  font-weight: 800;
}

.aso-position-cell {
  color: var(--on-surface);
  font-weight: 800;
  text-align: center;
}

.aso-position-metric {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  white-space: nowrap;
}

.aso-position-value {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  min-height: 22px;
  border-radius: 4px;
  background: #dfe8ff;
  color: #171d38;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1;
  padding: 0 5px;
}

.aso-position-value--top {
  background: #84e6b7;
  color: #073328;
}

.aso-position-metric--missing .aso-position-value {
  min-width: 36px;
  border: 1px solid rgba(140, 146, 154, 0.24);
  background: rgba(140, 146, 154, 0.14);
  background: color-mix(in srgb, var(--surface-container-high) 86%, var(--on-surface-variant) 14%);
  color: var(--on-surface);
  font-size: 13px;
  font-weight: 800;
}

.aso-position-metric--lost .aso-position-value,
.aso-position-compact-metric--lost .aso-position-value,
.aso-position-value--lost {
  border: 0;
  background: transparent;
  color: var(--danger);
  font-weight: 900;
  text-decoration: line-through;
  text-decoration-color: currentColor;
  text-decoration-thickness: 1.5px;
}

.aso-position-delta {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 12px;
  font-weight: 850;
  line-height: 1;
}

.aso-position-delta span {
  font-size: 9px;
  line-height: 1;
  transform: translateY(-1px);
}

.aso-position-delta--up {
  color: #41c88b;
}

.aso-position-delta--down {
  color: #f35d82;
}

.aso-position-delta--neutral {
  color: var(--on-surface-variant);
}

.aso-delta-cell {
  white-space: nowrap;
}

.aso-time {
  color: var(--on-surface);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.aso-muted-dash {
  color: var(--muted);
}

.aso-traffic-restricted {
  color: #ffb4ab;
  font-weight: 900;
  letter-spacing: 0;
}

.aso-row-status {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  min-height: 24px;
  padding: 2px 9px;
  border-radius: 999px;
  background: var(--surface-container-high);
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.aso-row-status--ok {
  color: #7ee4a1;
}

.aso-row-status--calculating {
  color: var(--m3-primary);
}

.aso-row-status--not_found,
.aso-row-status--failed {
  color: var(--danger);
}

.aso-delta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 38px;
  font-variant-numeric: tabular-nums;
  font-weight: 850;
  color: var(--muted);
}

.aso-delta__arrow {
  font-size: 10px;
  line-height: 1;
}

.aso-delta--up {
  color: #7ee4a1;
}

.aso-delta--down {
  color: var(--danger);
}

.aso-delta--neutral {
  color: #9eb5e6;
}

.aso-sparkline {
  width: 92px;
  height: 30px;
  display: block;
}

.aso-trend-cell {
  white-space: nowrap;
}

.aso-trend {
  display: grid;
  place-items: center;
  width: 108px;
  height: 38px;
  overflow: hidden;
  border-radius: 4px;
  background: linear-gradient(180deg, rgba(96, 165, 250, 0.14), rgba(96, 165, 250, 0.05));
}

.aso-trend .aso-sparkline {
  width: 100%;
  height: 100%;
}

.aso-trend .aso-sparkline polyline {
  stroke: #6fa9ff;
  stroke-width: 3;
}

.aso-trend-empty {
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  line-height: 1;
}

.aso-actions-cell {
  text-align: right;
}

.aso-row-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}

.aso-row-actions form {
  margin: 0;
}

.page-aso-rank .aso-action-btn,
.page-aso-rank .aso-chart-periods .btn {
  min-height: 34px;
  padding: 0 13px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

@media (max-width: 980px) {
  .aso-selection-grid,
  .aso-controls,
  .aso-rank-grid,
  .aso-local-filter-bar,
  .aso-chart-filter-form {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .aso-control-panel,
  .aso-chart-panel,
  .aso-table-panel {
    padding: 14px;
  }

  .aso-country-grid {
    grid-template-columns: 1fr;
  }

  .aso-country-search-row {
    grid-template-columns: 1fr;
  }

  .aso-line-plot {
    min-height: 220px;
  }

  .aso-line-canvas {
    height: 180px;
  }

  .aso-key-cell {
    grid-template-columns: 1fr;
  }

  .aso-key-cell--with-icon {
    grid-template-columns: 22px minmax(0, 1fr);
  }

  .aso-key-text {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }
}

/* ASO dashboard/detail v2 */
.page-aso-dashboard .container,
.page-aso-detail .container {
  max-width: 1560px;
}

.page-aso-dashboard {
  --aso-dashboard-bg: var(--m3-surface);
  --aso-dashboard-text: var(--on-surface);
  --aso-dashboard-muted: var(--muted);
  --aso-dashboard-panel: var(--m3-surface-container-low);
  --aso-dashboard-panel-hover: var(--m3-surface-container);
  --aso-dashboard-border: rgba(140, 146, 154, 0.24);
  --aso-dashboard-border-soft: rgba(140, 146, 154, 0.14);
  --aso-dashboard-card-border: rgba(140, 146, 154, 0.28);
  --aso-dashboard-card-hover: rgba(158, 202, 255, 0.34);
  --aso-dashboard-shadow: 0 1px 2px rgba(0, 0, 0, 0.20);
  --aso-dashboard-shadow-hover: 0 8px 18px rgba(0, 0, 0, 0.24);
  --aso-dashboard-icon-bg: var(--m3-surface-container-high);
  --aso-dashboard-good: #7ee4a1;
  --aso-dashboard-good-strong: #86efac;
  --aso-dashboard-bad: #ff8a80;
  --aso-dashboard-bad-strong: #ff7474;
  --aso-dashboard-warn: #ffc978;
  --aso-dashboard-position: color-mix(in srgb, var(--aso-dashboard-text) 70%, var(--aso-dashboard-muted));
  background: var(--aso-dashboard-bg);
}

html[data-theme="light"] .page-aso-dashboard {
  --aso-dashboard-bg: #f7f8fb;
  --aso-dashboard-text: #111827;
  --aso-dashboard-muted: #667085;
  --aso-dashboard-panel: #ffffff;
  --aso-dashboard-panel-hover: #ffffff;
  --aso-dashboard-border: rgba(17, 24, 39, 0.10);
  --aso-dashboard-border-soft: #eef0f3;
  --aso-dashboard-card-border: #e5e7eb;
  --aso-dashboard-card-hover: #cbd5e1;
  --aso-dashboard-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
  --aso-dashboard-shadow-hover: 0 4px 10px rgba(16, 24, 40, 0.06);
  --aso-dashboard-icon-bg: #f2f4f7;
  --aso-dashboard-good: #18a465;
  --aso-dashboard-good-strong: #10895a;
  --aso-dashboard-bad: #dc3545;
  --aso-dashboard-bad-strong: #dc3545;
  --aso-dashboard-warn: #f59e0b;
  --aso-dashboard-position: #374151;
}

.page-aso-dashboard .container {
  color: var(--aso-dashboard-text);
}

.aso-dashboard-head,
.aso-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin: 0 0 14px;
  padding: 1rem 1.15rem;
  border: 1px solid rgba(124, 200, 248, 0.22);
  border-radius: 10px;
  background: #111a24;
  box-shadow: none;
}

.aso-dashboard-head--hero {
  flex-direction: column;
  align-items: stretch;
  gap: 1rem;
}

.aso-dashboard-head-main {
  min-width: 0;
}

.aso-dashboard-head-main--with-actions {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.aso-dashboard-head-copy {
  flex: 1 1 auto;
  min-width: 0;
}

.aso-dashboard-hero-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex: 0 0 auto;
  gap: 8px;
}

.aso-dashboard-hero-action {
  min-height: 38px;
  border-radius: 999px;
  padding: 0 16px;
  white-space: nowrap;
}

.aso-card-position-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  border: 1px solid rgba(158, 202, 255, 0.22);
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.06);
  color: var(--aso-dashboard-muted);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 850;
  line-height: 1;
  padding: 0 11px 0 13px;
  white-space: nowrap;
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease, transform 120ms ease;
}

.aso-card-position-toggle:hover,
.aso-card-position-toggle:focus-visible {
  outline: none;
  border-color: rgba(158, 202, 255, 0.46);
  background: rgba(158, 202, 255, 0.12);
  color: var(--aso-dashboard-text);
}

.aso-card-position-toggle:active {
  transform: translateY(1px);
}

.aso-card-position-toggle i {
  position: relative;
  display: inline-block;
  width: 36px;
  height: 20px;
  border: 1px solid rgba(158, 202, 255, 0.30);
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.12);
  flex: 0 0 auto;
}

.aso-card-position-toggle i::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: #c8d8ec;
  box-shadow: 0 2px 7px rgba(0, 0, 0, 0.25);
  transition: transform 140ms ease, background 140ms ease;
}

.aso-card-position-toggle[aria-pressed="true"] {
  border-color: rgba(255, 201, 120, 0.58);
  background: rgba(255, 201, 120, 0.16);
  color: #ffd37f;
}

.aso-card-position-toggle[aria-pressed="true"] i {
  border-color: rgba(255, 201, 120, 0.72);
  background: rgba(255, 201, 120, 0.34);
}

.aso-card-position-toggle[aria-pressed="true"] i::after {
  background: #ffe0a8;
  transform: translateX(16px);
}

.aso-dashboard-head h1,
.aso-detail-head h1 {
  margin: 0;
  color: var(--on-surface);
  font-size: 28px;
  line-height: 1.1;
  letter-spacing: 0;
}

.page-aso-dashboard .aso-dashboard-head h1 {
  color: var(--aso-dashboard-text);
}

.page-aso-dashboard .aso-dashboard-head .hint,
.page-aso-dashboard .aso-dashboard-head .eyebrow {
  color: var(--aso-dashboard-muted);
}

.aso-dashboard-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  max-width: 1120px;
  margin-top: 10px;
}

.aso-dashboard-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 20px;
  border: 0;
  background: transparent;
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.2;
  padding: 0;
}

.aso-dashboard-legend-sample {
  margin-right: 0;
}

.aso-detail-title {
  min-width: 0;
}

.aso-detail-identity {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.aso-detail-app-icon {
  position: relative;
  display: grid;
  width: 52px;
  height: 52px;
  overflow: hidden;
  border: 1px solid rgba(140, 146, 154, 0.24);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(158, 202, 255, 0.28), rgba(126, 228, 161, 0.16));
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16);
  place-items: center;
}

.aso-detail-app-icon img,
.aso-detail-app-icon .aso-app-icon-fallback {
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
}

.aso-detail-app-icon img {
  position: relative;
  z-index: 1;
  object-fit: cover;
}

.aso-detail-app-icon .aso-app-icon-fallback {
  border-radius: 0;
  font-size: 22px;
}

.aso-detail-copy {
  min-width: 0;
}

.aso-detail-title-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  min-width: 0;
}

.aso-detail-title-row h1 {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-detail-meta-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
}

.aso-webview-rotation-editor {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
}

.aso-webview-rotation-editor label,
.aso-webview-rotation-current {
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}

.aso-webview-rotation-editor input {
  width: 86px;
  min-height: 24px;
  border: 1px solid rgba(140, 146, 154, 0.28);
  border-radius: 6px;
  background: var(--m3-surface-container-low);
  color: var(--on-surface);
  padding: 2px 7px;
  font: inherit;
  font-size: 11px;
  font-weight: 750;
}

.aso-webview-rotation-editor .btn-small {
  min-height: 24px;
  padding: 2px 8px;
  font-size: 11px;
}

.aso-webview-rotation-status {
  color: var(--success);
  font-size: 11px;
  font-weight: 750;
}

.aso-webview-rotation-error {
  color: var(--danger);
  font-size: 11px;
  font-weight: 750;
}

.aso-detail-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  min-width: min(360px, 100%);
}

.aso-compare-form,
.aso-competitor-filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 10px;
}

.aso-compare-form {
  width: min(620px, 100%);
}

.aso-compare-field,
.aso-competitor-filter-bar label {
  min-width: min(280px, 100%);
}

.aso-compare-field {
  width: 100%;
}

.aso-competitor-filter-bar label > span {
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.06em;
  line-height: 1;
  text-transform: uppercase;
}

.aso-compare-field select,
.aso-competitor-filter-bar select {
  min-height: 36px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container-high);
  color: var(--text);
  padding: 0 10px;
  font: inherit;
  font-size: 12px;
  font-weight: 750;
}

.aso-compare-picker__button {
  min-height: 40px;
  font-size: 13px;
  font-weight: 850;
}

.aso-dashboard-picker__panel.aso-compare-picker__panel {
  left: 0;
  right: auto;
  width: min(560px, calc(100vw - 24px));
  min-width: 0;
  max-width: calc(100vw - 24px);
  overflow: hidden;
}

.aso-compare-picker__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.aso-compare-picker__head span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
}

.aso-dashboard-picker__list.aso-compare-picker__list {
  max-height: 300px;
}

.aso-dashboard-picker__option.aso-compare-picker__option {
  grid-template-columns: 18px 34px minmax(0, 1fr) minmax(112px, auto);
  gap: 8px 10px;
  padding: 7px 8px;
  cursor: pointer;
}

.aso-dashboard-picker__option.aso-compare-picker__option input {
  align-self: center;
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #9ecaff;
}

.aso-dashboard-picker__option.aso-compare-picker__option.is-selected {
  border-color: rgba(158, 202, 255, 0.48);
  background: rgba(158, 202, 255, 0.10);
}

.aso-dashboard-picker__option.aso-compare-picker__option .aso-dashboard-picker__meta {
  justify-content: flex-end;
}

.aso-compare-picker__icon {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 8px;
  background: var(--aso-dashboard-icon-bg);
  color: var(--aso-dashboard-text);
  font-size: 12px;
  font-weight: 900;
}

.aso-compare-picker__icon img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.aso-compare-picker__icon .aso-app-icon-fallback {
  width: 100%;
  height: 100%;
}

@media (max-width: 680px) {
  .aso-dashboard-picker__option.aso-compare-picker__option {
    grid-template-columns: 18px 34px minmax(0, 1fr);
  }

  .aso-dashboard-picker__option.aso-compare-picker__option input {
    align-self: start;
    margin-top: 9px;
  }

  .aso-dashboard-picker__option.aso-compare-picker__option .aso-compare-picker__icon {
    align-self: start;
  }

  .aso-dashboard-picker__option.aso-compare-picker__option .aso-dashboard-picker__meta {
    grid-column: 3;
    justify-content: flex-start;
  }
}

.aso-app-switch-field {
  width: min(360px, 100%);
}

.aso-app-switch .aso-dashboard-picker__button > span:first-child {
  display: flex;
  align-items: center;
  min-width: 0;
}

.aso-app-switch-button-label {
  color: var(--on-surface);
  font-size: 13px;
  font-weight: 800;
}

.aso-app-switch-panel {
  min-width: min(420px, calc(100vw - 36px));
}

.aso-app-switch-option {
  grid-template-columns: minmax(0, 1fr);
}

.aso-app-switch-main {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
}

.aso-app-switch-icon {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  object-fit: cover;
}

.aso-app-switch-text {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.aso-app-switch-text strong,
.aso-app-switch-text small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-app-switch-text strong {
  color: var(--on-surface);
  font-size: 13px;
  font-weight: 850;
}

.aso-app-switch-text small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}

.aso-detail-tabs,
.aso-chart-periods,
.aso-segmented {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.aso-competitor-tabs {
  margin: 2px 0 0;
}

.aso-competitor-tabs .btn {
  min-width: 122px;
  justify-content: center;
}

.aso-dashboard-unit-filter label,
.aso-dashboard-add label,
.aso-dashboard-picker-field,
.aso-monitor-toolbar label,
.aso-field {
  display: grid;
  gap: 6px;
}

.aso-dashboard-unit-filter label > span,
.aso-dashboard-add label > span,
.aso-dashboard-picker-field > span,
.aso-monitor-toolbar label > span,
.aso-field > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.06em;
  line-height: 1;
  text-transform: uppercase;
}

.aso-dashboard-unit-filter select,
.aso-dashboard-add select,
.aso-dashboard-add input,
.aso-monitor-toolbar select,
.aso-field input,
.aso-new-key-panel--inline input {
  min-height: 38px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container-high);
  color: var(--text);
  padding: 0 11px;
  font: inherit;
  font-size: 13px;
  font-weight: 650;
}

.aso-dashboard-unit-filter select:focus,
.aso-dashboard-add select:focus,
.aso-dashboard-add input:focus,
.aso-monitor-toolbar select:focus,
.aso-field input:focus,
.aso-new-key-panel--inline input:focus {
  outline: 2px solid rgba(158, 202, 255, 0.28);
  border-color: var(--accent);
}

.aso-dashboard-unit-filter {
  display: flex;
  align-items: end;
  gap: 10px;
}

.aso-dashboard-unit-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 0 0 12px;
}

.aso-dashboard-unit-tabs--hero {
  margin: 0;
}

.aso-dashboard-unit-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 240px;
  min-height: 32px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 999px;
  background: var(--aso-dashboard-panel);
  color: var(--aso-dashboard-muted);
  padding: 5px 9px;
  text-decoration: none;
}

.aso-dashboard-unit-tab:hover,
.aso-dashboard-unit-tab:focus-visible {
  outline: none;
  border-color: rgba(158, 202, 255, 0.42);
  background: rgba(158, 202, 255, 0.07);
  color: var(--aso-dashboard-text);
}

.aso-dashboard-unit-tab.is-active {
  border-color: rgba(158, 202, 255, 0.46);
  background: rgba(158, 202, 255, 0.12);
  color: var(--aso-dashboard-text);
}

.aso-dashboard-unit-tab span {
  min-width: 0;
  overflow: hidden;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-dashboard-unit-tab strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 20px;
  border-radius: 999px;
  background: rgba(140, 146, 154, 0.12);
  color: inherit;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  font-weight: 900;
  line-height: 1;
  padding: 0 6px;
}

.aso-dashboard-unit-tab.is-active strong {
  background: rgba(158, 202, 255, 0.18);
}

.aso-dashboard-unit-tab--ban {
  border-color: rgba(255, 126, 126, 0.28);
  color: rgba(255, 176, 176, 0.9);
}

.aso-dashboard-unit-tab--ban:hover,
.aso-dashboard-unit-tab--ban:focus-visible,
.aso-dashboard-unit-tab--ban.is-active {
  border-color: rgba(255, 126, 126, 0.5);
  background: rgba(255, 104, 104, 0.1);
  color: #ffd0d0;
}

.aso-dashboard-unit-tab--ban.is-active strong {
  background: rgba(255, 104, 104, 0.16);
}

.aso-dashboard-brand-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: -4px 0 0;
}

.aso-dashboard-brand-tabs--hero {
  margin-top: -2px;
}

.aso-dashboard-brand-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 270px;
  min-height: 38px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 999px;
  background: var(--aso-dashboard-panel);
  color: var(--aso-dashboard-muted);
  padding: 5px 9px 5px 6px;
  text-decoration: none;
}

.aso-dashboard-brand-tab:hover,
.aso-dashboard-brand-tab:focus-visible {
  outline: none;
  border-color: rgba(158, 202, 255, 0.42);
  background: rgba(158, 202, 255, 0.07);
  color: var(--aso-dashboard-text);
}

.aso-dashboard-brand-tab.is-active {
  border-color: rgba(158, 202, 255, 0.46);
  background: rgba(158, 202, 255, 0.12);
  color: var(--aso-dashboard-text);
}

.aso-brand-filter-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  overflow: hidden;
  border: 1px solid rgba(154, 169, 190, 0.22);
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(158, 202, 255, 0.18), rgba(132, 225, 188, 0.13));
  color: var(--aso-dashboard-text);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}

.aso-brand-filter-icon img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: cover;
}

.aso-brand-filter-icon__fallback {
  display: inline-flex;
  max-width: 100%;
  overflow: hidden;
  text-transform: uppercase;
}

.aso-dashboard-brand-tab__copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 1px;
}

.aso-dashboard-brand-tab__copy > span {
  min-width: 0;
  overflow: hidden;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.12;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-dashboard-brand-tab__copy small {
  min-width: 0;
  overflow: hidden;
  color: var(--aso-dashboard-muted);
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-dashboard-brand-tab strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 20px;
  border-radius: 999px;
  background: rgba(140, 146, 154, 0.12);
  color: inherit;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  font-weight: 900;
  line-height: 1;
  padding: 0 6px;
}

.aso-dashboard-brand-tab.is-active strong {
  background: rgba(158, 202, 255, 0.18);
}

.aso-dashboard-add {
  margin-bottom: 12px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 8px;
  background: var(--aso-dashboard-panel);
  padding: 10px;
}

.aso-dashboard-add--hero,
.aso-dashboard-competitor-intro--hero .aso-dashboard-add {
  margin: 0;
  border-color: rgba(140, 146, 154, 0.22);
  border-radius: 10px;
  background:
    linear-gradient(0deg, rgba(158, 202, 255, 0.035), rgba(158, 202, 255, 0.035)),
    var(--aso-dashboard-panel);
  box-shadow: none;
}

.aso-dashboard-add form {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(220px, 0.75fr) auto;
  gap: 10px;
  align-items: end;
}

.aso-dashboard-add--competitor form {
  grid-template-columns: minmax(150px, 0.62fr) minmax(260px, 1fr) minmax(190px, 0.72fr) auto;
}

.aso-modal {
  width: min(640px, calc(100vw - 28px));
  max-height: min(760px, calc(100vh - 40px));
  overflow: visible;
  border: 1px solid var(--outline-variant);
  border-radius: 10px;
  background: var(--surface-container, var(--surface));
  color: var(--text);
  padding: 0;
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.52);
}

.aso-modal::backdrop {
  background: rgba(0, 0, 0, 0.58);
}

.aso-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--outline-variant);
}

.aso-modal-head h2 {
  min-width: 0;
  margin: 0;
  color: var(--on-surface);
  font-size: 18px;
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: 0;
}

.aso-modal-body {
  display: grid;
  gap: 12px;
  padding: 14px 16px 16px;
}

.aso-dashboard-add--modal {
  margin: 0;
  border: 0;
  background: transparent;
  padding: 0;
}

.aso-dashboard-add--modal form,
.aso-dashboard-add--modal.aso-dashboard-add--competitor form {
  grid-template-columns: 1fr;
  gap: 12px;
}

.aso-modal .aso-dashboard-picker__panel {
  z-index: 120;
}

.aso-modal .aso-competitor-brand-panel {
  min-width: 0;
}

.aso-modal-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 2px;
}

.aso-modal-actions .btn {
  min-height: 38px;
}

.aso-dashboard-competitor-intro {
  margin-top: 0;
  padding-top: 16px;
  border-top: 1px solid var(--aso-dashboard-border);
}

.aso-dashboard-competitor-intro--hero {
  display: grid;
  gap: 10px;
  padding-top: 14px;
  border-top-color: rgba(140, 146, 154, 0.20);
}

.aso-dashboard-head--hero .aso-dashboard-summary--hero {
  margin: 0;
}

.aso-dashboard-competitor-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 10px;
}

.aso-dashboard-competitor-head span {
  min-width: 0;
}

.aso-dashboard-competitor-head h2,
.aso-dashboard-competitor-head p {
  margin: 0;
}

.aso-dashboard-competitor-head h2 {
  color: var(--aso-dashboard-text);
  font-size: 17px;
  font-weight: 900;
  letter-spacing: 0;
}

.aso-dashboard-competitor-head p {
  margin-top: 3px;
  color: var(--aso-dashboard-muted);
  font-size: 12px;
  line-height: 1.35;
}

.aso-dashboard-competitor-head > strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 26px;
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.12);
  color: var(--aso-dashboard-text);
  font-size: 12px;
  font-weight: 900;
}

.aso-competitor-brand-panel {
  min-width: min(520px, calc(100vw - 40px));
}

.aso-competitor-brand-list {
  max-height: 245px;
}

.aso-competitor-brand-search {
  margin-bottom: 0;
}

.aso-competitor-brand-picker.is-searching .aso-dashboard-picker__panel {
  top: calc(100% + 6px);
}

.aso-dashboard-picker__option.is-search-match {
  border-color: rgba(111, 214, 143, 0.72);
  background: rgba(111, 214, 143, 0.12);
  box-shadow: inset 0 0 0 1px rgba(111, 214, 143, 0.18);
}

.aso-competitor-brand-new {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid rgba(140, 146, 154, 0.22);
}

.aso-competitor-preview {
  display: grid;
  gap: 6px;
  margin-top: 8px;
  border: 1px solid rgba(140, 146, 154, 0.22);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.028);
  padding: 8px;
}

.aso-competitor-preview[hidden] {
  display: none;
}

.aso-competitor-preview-main {
  grid-template-columns: 38px minmax(0, 1fr);
}

.aso-competitor-preview-icon {
  width: 38px;
  height: 38px;
}

.aso-competitor-preview p {
  margin: 0;
  color: var(--aso-dashboard-muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
}

.aso-competitor-preview.has-error {
  border-color: rgba(255, 180, 171, 0.42);
  background: rgba(255, 180, 171, 0.08);
}

.aso-competitor-preview.has-error p {
  color: var(--danger);
}

.aso-dashboard-add label.has-error select {
  border-color: rgba(255, 180, 171, 0.88);
  box-shadow: 0 0 0 2px rgba(255, 180, 171, 0.12);
}

.aso-dashboard-picker-field {
  min-width: 0;
}

.aso-dashboard-picker {
  position: relative;
  min-width: 0;
}

.aso-dashboard-picker__button,
.aso-dashboard-picker__search {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container-high);
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 650;
}

.aso-dashboard-picker__button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 11px;
  text-align: left;
}

.aso-dashboard-picker__button > span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-dashboard-picker__button.is-placeholder {
  color: var(--muted);
}

.aso-dashboard-picker__button:focus,
.aso-dashboard-picker__search:focus {
  outline: 2px solid rgba(158, 202, 255, 0.28);
  border-color: var(--accent);
}

.aso-dashboard-picker.has-error .aso-dashboard-picker__button {
  border-color: rgba(255, 180, 171, 0.88);
  box-shadow: 0 0 0 2px rgba(255, 180, 171, 0.12);
}

.aso-dashboard-picker__chevron {
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  flex: 0 0 auto;
  opacity: 0.82;
}

.aso-dashboard-picker__panel {
  position: absolute;
  z-index: 40;
  top: calc(100% + 6px);
  right: 0;
  left: 0;
  border: 1px solid rgba(140, 146, 154, 0.28);
  border-radius: 8px;
  background: var(--surface-container-highest, #1f232a);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.38);
  padding: 8px;
}

.aso-dashboard-picker__search {
  margin-bottom: 7px;
  padding: 0 10px;
}

.aso-dashboard-picker__list {
  display: grid;
  gap: 5px;
  max-height: 370px;
  overflow: auto;
  overscroll-behavior: contain;
}

.aso-dashboard-picker__option {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto);
  gap: 12px;
  align-items: center;
  width: 100%;
  border: 1px solid rgba(140, 146, 154, 0.18);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.028);
  color: var(--text);
  padding: 8px;
  text-align: left;
}

.aso-dashboard-picker__option:hover,
.aso-dashboard-picker__option:focus {
  outline: 0;
  border-color: rgba(158, 202, 255, 0.45);
  background: rgba(158, 202, 255, 0.075);
}

.aso-dashboard-picker__main {
  min-width: 0;
}

.aso-dashboard-picker__main strong,
.aso-dashboard-picker__main small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-dashboard-picker__main strong {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  line-height: 1.25;
}

.aso-dashboard-picker__main strong > span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-dashboard-picker__main small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

.aso-dashboard-picker__meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 4px;
}

.aso-dashboard-picker__meta span {
  max-width: 150px;
  border: 1px solid rgba(158, 202, 255, 0.20);
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.08);
  color: var(--text-secondary, var(--muted));
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
  padding: 3px 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-dashboard-picker__empty {
  margin: 0;
  border: 1px dashed rgba(140, 146, 154, 0.24);
  border-radius: 7px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
  padding: 12px;
  text-align: center;
}

.aso-competitor-discovery {
  display: grid;
  gap: 12px;
  margin: 0 0 14px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 10px;
  background: var(--aso-dashboard-panel);
  padding: 12px;
}

.aso-competitor-discovery__head,
.aso-competitor-discovery__panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.aso-competitor-discovery__head h2,
.aso-competitor-discovery__head p,
.aso-competitor-discovery__panel-head h3,
.aso-competitor-discovery__panel-head p,
.aso-competitor-discovery__panel h3 {
  margin: 0;
}

.aso-competitor-discovery__head h2 {
  color: var(--aso-dashboard-text);
  font-size: 19px;
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: 0;
}

.aso-competitor-discovery__stats {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}

.aso-competitor-discovery__head-actions {
  display: grid;
  justify-items: end;
  gap: 8px;
  min-width: min(360px, 100%);
}

.aso-competitor-discovery__new-search {
  min-height: 34px;
  white-space: nowrap;
}

.aso-competitor-discovery__stats span {
  display: grid;
  min-width: 70px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 8px;
  background: rgba(140, 146, 154, 0.08);
  padding: 7px 9px;
}

.aso-competitor-discovery__stats strong {
  color: var(--aso-dashboard-text);
  font-size: 18px;
  line-height: 1;
}

.aso-competitor-discovery__stats small {
  color: var(--aso-dashboard-muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.aso-competitor-discovery__layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.9fr) minmax(320px, 1.1fr);
  gap: 12px;
}

.aso-competitor-discovery__layout--runs-only {
  grid-template-columns: minmax(0, 1fr);
}

.aso-competitor-discovery__panel {
  display: grid;
  gap: 10px;
  min-width: 0;
  border: 1px solid var(--aso-dashboard-border-soft);
  border-radius: 8px;
  background: rgba(140, 146, 154, 0.06);
  padding: 10px;
}

.aso-competitor-discovery__panel h3 {
  color: var(--aso-dashboard-text);
  font-size: 14px;
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: 0;
}

.aso-competitor-discovery__panel-head--queue {
  align-items: flex-end;
}

.aso-competitor-discovery__panel-head p {
  color: var(--aso-dashboard-muted);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.25;
}

.aso-competitor-discovery-run-form,
.aso-competitor-discovery-status-filter,
.aso-competitor-discovery-review {
  display: grid;
  gap: 8px;
}

.aso-competitor-discovery-modal {
  width: min(560px, calc(100vw - 28px));
}

.aso-competitor-discovery-run-form--modal {
  gap: 10px;
}

.aso-competitor-discovery-run-form label,
.aso-competitor-discovery-status-filter label {
  display: grid;
  gap: 5px;
}

.aso-competitor-discovery-run-form label > span,
.aso-competitor-discovery-status-filter label > span {
  color: var(--aso-dashboard-muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.06em;
  line-height: 1;
  text-transform: uppercase;
}

.aso-competitor-discovery-run-form input,
.aso-competitor-discovery-run-form select,
.aso-competitor-discovery-status-filter select,
.aso-competitor-discovery-review input {
  min-height: 34px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container-high);
  color: var(--text);
  padding: 0 10px;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
}

.aso-competitor-discovery-run-form .factory-select,
.aso-competitor-discovery-status-filter .factory-select {
  width: 100%;
}

.aso-competitor-discovery-status-filter .factory-select {
  min-width: 160px;
}

.aso-competitor-discovery-run-form .factory-select .aso-dashboard-picker__button,
.aso-competitor-discovery-status-filter .factory-select .aso-dashboard-picker__button {
  min-height: 34px;
  font-size: 12px;
  font-weight: 700;
}

.aso-competitor-discovery-run-form__row {
  display: grid;
  grid-template-columns: minmax(90px, 0.6fr) minmax(90px, 0.4fr);
  gap: 8px;
}

.aso-competitor-discovery-runs,
.aso-competitor-discovery-findings {
  display: grid;
  gap: 8px;
}

.aso-competitor-discovery-run,
.aso-competitor-discovery-finding {
  display: grid;
  gap: 8px;
  min-width: 0;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 8px;
  background: var(--aso-dashboard-panel);
  padding: 9px;
}

.aso-competitor-discovery-run {
  grid-template-columns: auto auto minmax(0, 1fr);
  align-items: center;
}

.aso-competitor-discovery-run small {
  min-width: 0;
  overflow: hidden;
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-competitor-discovery-status {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  border: 1px solid rgba(140, 146, 154, 0.24);
  border-radius: 999px;
  background: rgba(140, 146, 154, 0.10);
  color: var(--aso-dashboard-muted);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  padding: 2px 6px;
}

.aso-competitor-discovery-finding.is-reviewed {
  border-color: rgba(126, 228, 161, 0.34);
}

.aso-competitor-discovery-finding__main {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}

.aso-competitor-discovery-finding__copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.aso-competitor-discovery-finding__copy strong {
  overflow: hidden;
  color: var(--aso-dashboard-text);
  font-size: 14px;
  font-weight: 900;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-competitor-discovery-finding__copy small {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 7px;
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 750;
}

.aso-competitor-discovery-finding__evidence {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.aso-competitor-discovery-finding__evidence span {
  display: grid;
  gap: 2px;
  min-width: 0;
  border: 1px solid var(--aso-dashboard-border-soft);
  border-radius: 7px;
  background: rgba(140, 146, 154, 0.07);
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.25;
  padding: 6px;
}

.aso-competitor-discovery-finding__evidence strong {
  color: var(--aso-dashboard-text);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.aso-competitor-discovery-finding__evidence em {
  color: inherit;
  font-style: normal;
}

.aso-competitor-discovery-review__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.aso-competitor-discovery-review__status,
.aso-competitor-discovery__pending,
.aso-competitor-discovery__empty {
  margin: 0;
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.3;
}

.aso-competitor-discovery-review__status.has-error {
  color: var(--danger);
}

.aso-competitor-visuals {
  display: grid;
  gap: 12px;
  margin: 0 0 14px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 10px;
  background: var(--aso-dashboard-panel);
  padding: 12px;
}

.aso-visual-brand-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 10px;
}

.aso-visual-brand-card {
  display: grid;
  gap: 10px;
  min-width: 0;
  border: 1px solid var(--aso-dashboard-border-soft);
  border-radius: 8px;
  background: rgba(140, 146, 154, 0.06);
  padding: 10px;
}

.aso-visual-brand-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.aso-visual-brand-card h3,
.aso-visual-brand-card p {
  margin: 0;
}

.aso-visual-brand-card h3 {
  color: var(--aso-dashboard-text);
  font-size: 15px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.15;
}

.aso-visual-brand-card p {
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 750;
}

.aso-visual-brand-card label,
.aso-visual-assets-field {
  display: grid;
  gap: 5px;
}

.aso-visual-brand-card label > span,
.aso-visual-assets-field > span {
  color: var(--aso-dashboard-muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.06em;
  line-height: 1;
  text-transform: uppercase;
}

.aso-visual-brand-card textarea:not(.sr-only) {
  min-height: 84px;
  resize: vertical;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container-high);
  color: var(--text);
  padding: 8px 10px;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
}

.aso-visual-assets-carousel {
  display: flex;
  gap: 8px;
  max-width: 100%;
  min-height: 128px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  padding: 2px 2px 8px;
  scroll-snap-type: x proximity;
}

.aso-visual-asset-tile,
.aso-visual-asset-add {
  flex: 0 0 118px;
  width: 118px;
  min-width: 118px;
  height: 118px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container-high);
  color: var(--text);
  scroll-snap-align: start;
}

.aso-visual-asset-tile {
  position: relative;
  display: grid;
  grid-template-rows: minmax(0, 1fr) 28px;
  gap: 5px;
  padding: 8px;
}

.aso-visual-asset-preview {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 0;
  place-items: center;
  overflow: hidden;
  border-radius: 6px;
  background: rgba(140, 146, 154, 0.12);
}

.aso-visual-asset-preview img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.aso-visual-asset-fallback {
  display: none;
  max-width: 100%;
  padding: 0 6px;
  color: var(--aso-dashboard-muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
  line-height: 1.1;
  overflow-wrap: anywhere;
  text-align: center;
}

.aso-visual-asset-tile.has-preview-error .aso-visual-asset-preview img {
  display: none;
}

.aso-visual-asset-tile.has-preview-error .aso-visual-asset-fallback {
  display: block;
}

.aso-visual-asset-tile small {
  display: block;
  min-width: 0;
  color: var(--aso-dashboard-muted);
  font-size: 10px;
  font-weight: 750;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-visual-asset-remove {
  position: absolute;
  top: 5px;
  right: 5px;
  z-index: 2;
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1px solid rgba(12, 18, 28, 0.28);
  border-radius: 999px;
  background: rgba(16, 22, 32, 0.84);
  color: #fff;
  cursor: pointer;
  font-size: 18px;
  font-weight: 850;
  line-height: 1;
  padding: 0;
}

.aso-visual-asset-remove:hover,
.aso-visual-asset-remove:focus-visible {
  background: rgba(190, 54, 64, 0.94);
}

.aso-visual-asset-add {
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
}

.aso-visual-asset-add strong {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 999px;
  color: var(--aso-dashboard-accent, var(--primary));
  font-size: 28px;
  font-weight: 700;
  line-height: 1;
}

.aso-visual-asset-add:hover,
.aso-visual-asset-add:focus-visible {
  border-color: var(--primary);
  background: rgba(86, 139, 255, 0.12);
}

.aso-dashboard-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
}

.aso-dashboard-summary-item {
  display: inline-grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-width: 168px;
  min-height: 42px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 8px;
  background: var(--aso-dashboard-panel);
  color: var(--aso-dashboard-text);
  padding: 7px 10px;
  text-decoration: none;
}

.aso-dashboard-summary-item:hover {
  border-color: rgba(158, 202, 255, 0.44);
  background: color-mix(in srgb, var(--aso-dashboard-panel-hover) 88%, var(--m3-primary) 12%);
}

.aso-dashboard-summary-item span {
  min-width: 0;
  overflow: hidden;
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 850;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.aso-dashboard-summary-item strong {
  color: var(--aso-dashboard-text);
  font-size: 18px;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.aso-dashboard-summary-item--good {
  border-color: rgba(126, 228, 161, 0.28);
}

.aso-dashboard-summary-item--bad {
  border-color: rgba(255, 116, 116, 0.30);
}

.aso-dashboard-sections {
  display: grid;
  gap: 18px;
}

.aso-dashboard-section {
  display: grid;
  gap: 8px;
  scroll-margin-top: 82px;
}

.aso-dashboard-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  min-height: 34px;
}

.aso-dashboard-section-head span {
  min-width: 0;
}

.aso-dashboard-section-head h2 {
  margin: 0;
  color: var(--aso-dashboard-text);
  font-size: 15px;
  line-height: 1.2;
  letter-spacing: 0;
}

.aso-dashboard-section-head p {
  margin: 3px 0 0;
  color: var(--aso-dashboard-muted);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.25;
}

.aso-dashboard-section-head strong {
  color: var(--aso-dashboard-muted);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.aso-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr));
  gap: 12px;
}

.aso-app-card {
  position: relative;
  min-height: 174px;
  border: 1px solid var(--aso-dashboard-card-border);
  border-radius: 8px;
  background: var(--aso-dashboard-panel);
  color: var(--aso-dashboard-text);
  padding: 0 14px 13px 14px;
  box-shadow: var(--aso-dashboard-shadow);
  overflow: hidden;
}

.aso-app-card--has-push-plan {
  padding-bottom: 40px;
}

.aso-app-card-push-plan {
  position: absolute;
  right: 10px;
  bottom: 7px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  min-height: 27px;
  gap: 5px;
  padding: 3px 4px 3px 8px;
  border: 1px solid transparent;
  border-radius: 7px;
  color: rgba(184, 211, 239, 0.82);
  background: transparent;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
  transition: border-color 140ms ease, background-color 140ms ease, color 140ms ease, transform 140ms ease;
}

.aso-app-card-push-plan strong {
  display: inline-grid;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  place-items: center;
  border-radius: 999px;
  border: 1px solid rgba(124, 183, 244, 0.22);
  color: rgba(222, 239, 255, 0.94);
  background: rgba(124, 183, 244, 0.12);
  font-size: 10px;
  font-variant-numeric: tabular-nums;
}

.aso-app-card-push-plan:hover,
.aso-app-card-push-plan:focus-visible {
  border-color: rgba(124, 183, 244, 0.28);
  color: #dceeff;
  background: rgba(46, 110, 180, 0.12);
  outline: none;
  transform: translateY(-1px);
}

.aso-app-card-push-plan:focus-visible {
  box-shadow: 0 0 0 2px rgba(124, 183, 244, 0.18);
}

.aso-app-card-push-plan:active {
  transform: translateY(0);
}

html[data-theme="light"] .aso-app-card-push-plan {
  color: rgba(29, 78, 216, 0.78);
  background: transparent;
}

html[data-theme="light"] .aso-app-card-push-plan strong {
  color: #1e40af;
  border-color: rgba(37, 99, 235, 0.18);
  background: rgba(37, 99, 235, 0.08);
}

html[data-theme="light"] .aso-app-card-push-plan:hover,
html[data-theme="light"] .aso-app-card-push-plan:focus-visible {
  border-color: rgba(37, 99, 235, 0.18);
  color: #1d4ed8;
  background: rgba(37, 99, 235, 0.06);
}

@media (pointer: coarse) {
  .aso-app-card--has-push-plan {
    padding-bottom: 56px;
  }

  .aso-app-card-push-plan,
  .portfolio-board-card-menu > summary,
  .portfolio-board-card-menu-item,
  .portfolio-board-card-direct-action {
    min-height: 44px;
  }

  .portfolio-board-card-direct-action:not(.portfolio-board-card-direct-action--push) {
    width: 44px;
  }
}

.aso-app-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--aso-dashboard-border);
  pointer-events: none;
}

.aso-app-card--good {
  border-color: color-mix(in srgb, var(--aso-dashboard-good) 34%, var(--aso-dashboard-card-border));
}

.aso-app-card--good::before {
  background: var(--aso-dashboard-good);
}

.aso-app-card--bad {
  border-color: color-mix(in srgb, var(--aso-dashboard-bad) 36%, var(--aso-dashboard-card-border));
}

.aso-app-card--bad::before {
  background: var(--aso-dashboard-bad-strong);
}

.aso-app-card--mixed {
  border-color: color-mix(in srgb, var(--aso-dashboard-bad) 36%, var(--aso-dashboard-card-border));
}

.aso-app-card--mixed::before {
  background: var(--aso-dashboard-bad-strong);
}

.aso-app-card--warn {
  border-color: color-mix(in srgb, var(--aso-dashboard-warn) 38%, var(--aso-dashboard-card-border));
}

.aso-app-card--warn::before {
  background: var(--aso-dashboard-warn);
}

.aso-app-card-outranks {
  border-color: rgba(255, 201, 120, 0.46);
  background:
    linear-gradient(0deg, rgba(255, 201, 120, 0.075), rgba(255, 201, 120, 0.075)),
    var(--aso-dashboard-panel);
  box-shadow:
    inset 0 0 0 1px rgba(255, 201, 120, 0.10),
    var(--aso-dashboard-shadow);
}

.aso-app-card-outranks::before {
  background: #ffc978;
}

.aso-app-card:hover {
  border-color: var(--aso-dashboard-card-hover);
  background: var(--aso-dashboard-panel-hover);
  box-shadow: var(--aso-dashboard-shadow-hover);
}

.aso-app-card-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: start;
  margin: 0 -14px 10px;
  border-bottom: 1px solid var(--aso-dashboard-border-soft);
  padding: 12px 10px 10px 14px;
}

.aso-app-card-head > form {
  display: inline-flex;
  margin: 3px 0 0;
}

.aso-app-card-footer-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.aso-app-card-meta-pills {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
}

.aso-app-card-inline-meta {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 7px;
  min-width: 0;
  overflow: hidden;
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.15;
}

.aso-app-card-inline-meta span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-app-card-primary-status {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.aso-card-actions {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 5px;
  margin-left: auto;
}

.aso-card-actions form {
  display: inline-flex;
  align-items: center;
  margin: 0;
}

.aso-app-card-main {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}

.aso-app-card--competitor .aso-app-card-head {
  grid-template-columns: 38px minmax(0, 1fr) auto;
  grid-template-areas:
    "icon title actions"
    "icon primary actions"
    "icon meta actions";
  column-gap: 9px;
  row-gap: 6px;
  align-items: start;
}

.aso-app-card--competitor .aso-app-card-main,
.aso-app-card--competitor .aso-app-card-footer-row {
  display: contents;
}

.aso-app-card--competitor .aso-app-card-icon-link {
  grid-area: icon;
  align-self: start;
}

.aso-app-card--competitor .aso-app-card-text {
  grid-area: title;
  align-self: start;
}

.aso-app-card--competitor .aso-app-card-primary-status {
  grid-area: primary;
  align-self: start;
}

.aso-app-card--competitor .aso-app-card-meta-pills {
  grid-area: meta;
  align-self: start;
}

.aso-app-card--competitor .aso-card-actions {
  grid-area: actions;
  align-self: start;
  justify-self: end;
  flex-wrap: nowrap;
  gap: 5px;
  margin-left: 0;
}

.aso-card-action-group {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 40px;
  border: 1px solid rgba(158, 202, 255, 0.16);
  border-radius: 999px;
  background: rgba(10, 16, 23, 0.34);
  padding: 3px;
}

.aso-card-action-group--danger {
  border-color: transparent;
  background: transparent;
  padding-left: 0;
}

.aso-app-card--competitor .aso-card-actions a.aso-card-copy,
.aso-app-card--competitor .aso-card-actions button {
  box-sizing: border-box;
  display: inline-grid;
  place-items: center;
  flex: 0 0 34px;
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
  border: 1px solid rgba(158, 202, 255, 0.30);
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.075);
  color: rgba(219, 232, 246, 0.94);
  cursor: pointer;
  font-family: inherit;
  line-height: 1;
  box-shadow: none;
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease, transform 120ms ease;
}

.aso-app-card--competitor .aso-card-actions svg {
  display: block;
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.2;
}

.aso-app-card--competitor .aso-card-actions a.aso-card-copy:hover,
.aso-app-card--competitor .aso-card-actions a.aso-card-copy:focus-visible,
.aso-app-card--competitor .aso-card-actions button:hover,
.aso-app-card--competitor .aso-card-actions button:focus-visible {
  outline: none;
  border-color: rgba(158, 202, 255, 0.48);
  background: rgba(158, 202, 255, 0.12);
  color: #cfe6ff;
  transform: translateY(-1px);
}

.aso-app-card--competitor .aso-card-actions a.aso-card-copy:active,
.aso-app-card--competitor .aso-card-actions button:active {
  border-color: rgba(158, 202, 255, 0.62);
  background: rgba(158, 202, 255, 0.18);
  color: #e2f0ff;
  transform: translateY(0);
}

.aso-app-card--competitor .aso-card-actions .is-favorite,
.aso-app-card--competitor .aso-card-actions .is-checked {
  border-color: rgba(255, 201, 120, 0.78);
  background: rgba(255, 201, 120, 0.24);
  color: #ffd37f;
  box-shadow: inset 0 0 0 1px rgba(255, 201, 120, 0.14), 0 0 0 1px rgba(255, 201, 120, 0.08);
}

.aso-app-card--competitor .aso-card-actions .is-favorite:hover,
.aso-app-card--competitor .aso-card-actions .is-favorite:focus-visible,
.aso-app-card--competitor .aso-card-actions .is-checked:hover,
.aso-app-card--competitor .aso-card-actions .is-checked:focus-visible {
  border-color: rgba(255, 214, 145, 0.92);
  background: rgba(255, 201, 120, 0.32);
  color: #ffe0a8;
}

.aso-app-card--competitor .aso-card-actions .is-favorite:active,
.aso-app-card--competitor .aso-card-actions .is-checked:active {
  border-color: rgba(255, 224, 163, 0.98);
  background: rgba(255, 201, 120, 0.42);
  color: #fff0c7;
  transform: translateY(0);
}

.aso-app-card--competitor .aso-card-actions .aso-card-priority-star.is-favorite svg {
  fill: currentColor;
  stroke: currentColor;
}

.aso-app-card--competitor .aso-card-actions .aso-card-webview-toggle.is-checked {
  border-color: rgba(96, 165, 250, 0.82);
  background: rgba(96, 165, 250, 0.22);
  color: #bfdbfe;
  box-shadow: inset 0 0 0 1px rgba(96, 165, 250, 0.15), 0 0 0 1px rgba(96, 165, 250, 0.08);
}

.aso-app-card--competitor .aso-card-actions .aso-card-webview-toggle.is-checked:hover,
.aso-app-card--competitor .aso-card-actions .aso-card-webview-toggle.is-checked:focus-visible {
  border-color: rgba(147, 197, 253, 0.94);
  background: rgba(96, 165, 250, 0.30);
  color: #dbeafe;
}

.aso-app-card--competitor .aso-card-actions .aso-card-remove:hover,
.aso-app-card--competitor .aso-card-actions .aso-card-remove:focus-visible {
  border-color: rgba(255, 116, 116, 0.48);
  background: rgba(255, 116, 116, 0.12);
  color: #ffb4ab;
}

.aso-app-card--competitor .aso-card-actions .aso-card-remove:active {
  border-color: rgba(255, 116, 116, 0.62);
  background: rgba(255, 116, 116, 0.18);
  color: #ffd3cc;
}

.aso-app-card-icon-link,
.aso-app-card-name-link {
  color: inherit;
  text-decoration: none;
}

.aso-app-card-name-link {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-app-card-name-link:hover,
.aso-app-card-name-link:focus-visible {
  color: var(--m3-primary);
}

.aso-app-card-icon {
  position: relative;
  display: grid;
  width: 38px;
  height: 38px;
  overflow: hidden;
  border-radius: 8px;
  background: var(--aso-dashboard-icon-bg);
  place-items: center;
}

.aso-app-card-icon img,
.aso-app-icon-fallback {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  object-fit: cover;
}

.aso-app-card-icon img,
.aso-app-card-icon .aso-app-icon-fallback {
  grid-area: 1 / 1;
}

.aso-app-card-icon img {
  position: relative;
  z-index: 1;
}

.aso-app-icon-fallback {
  display: inline-grid;
  place-items: center;
  background: var(--aso-dashboard-icon-bg);
  color: var(--aso-dashboard-text);
  font-size: 17px;
  font-weight: 900;
}

.aso-app-card-text {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.aso-app-card-title-row,
.aso-app-card-text strong,
.aso-app-card-text small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-app-card-title-row {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.aso-app-card-title-row > strong {
  flex: 0 1 auto;
  min-width: 0;
}

.aso-app-card-text strong {
  color: var(--aso-dashboard-text);
  font-size: 14px;
  line-height: 1.15;
}

.aso-app-card-text small {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 7px;
  overflow: visible;
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 700;
  text-overflow: clip;
  white-space: normal;
}

.aso-app-card-text small span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-app-card-text small .aso-board-column-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  overflow: visible;
}

.aso-app-card-text small .aso-board-column-age {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1rem;
  height: 1rem;
  padding: 0 0.26rem;
  border: 1px solid currentColor;
  border-radius: 999px;
  background: color-mix(in srgb, currentColor 16%, transparent);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.07);
  color: currentColor;
  font-size: 0.62rem;
  font-variant-numeric: tabular-nums;
  font-weight: 850;
  line-height: 1;
}

.aso-board-column-age--day-1 {
  color: #22c55e;
}

.aso-board-column-age--day-2 {
  color: #84cc16;
}

.aso-board-column-age--day-3 {
  color: #eab308;
}

.aso-board-column-age--day-4 {
  color: #f97316;
}

.aso-board-column-age--day-5,
.aso-board-column-age--bar {
  color: #ef4444;
}

.aso-app-revenue-pill {
  max-width: 170px;
  min-height: 18px;
  padding: 2px 6px;
  font-size: 10px;
  font-weight: 850;
  line-height: 1.2;
}

.aso-run-id-pill {
  flex: 0 0 auto;
  padding: 2px 6px;
  font-size: 10px;
  font-weight: 850;
  line-height: 1.15;
}

.aso-detail-id-pill,
.aso-detail-revenue-pill {
  min-height: 20px;
  font-size: 12px;
}

.aso-detail-id-pill--store-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding-right: 3px;
}

.aso-app-store-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  border-radius: 999px;
  color: inherit;
  opacity: 0.78;
  text-decoration: none;
  transition: background 120ms ease, opacity 120ms ease, transform 120ms ease;
}

.aso-app-store-copy-btn {
  flex: 0 0 15px;
  min-width: 15px;
  min-height: 15px;
  border: 0;
  background: transparent;
  cursor: pointer;
  padding: 0;
}

.aso-priority-pill,
.aso-compare-badge,
.aso-history-badge {
  display: inline-flex;
  align-items: center;
  min-height: 16px;
  border-radius: 999px;
  padding: 1px 5px;
  font-size: 9.5px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.aso-priority-pill {
  border: 1px solid rgba(140, 146, 154, 0.24);
  background: rgba(140, 146, 154, 0.10);
  color: var(--muted);
}

.aso-manual-priority-pill {
  display: inline-flex;
  align-items: center;
  min-height: 16px;
  border: 1px solid rgba(126, 228, 161, 0.42);
  border-radius: 999px;
  background: rgba(126, 228, 161, 0.13);
  color: #7ee4a1;
  padding: 1px 6px;
  font-size: 9.5px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.aso-live-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 16px;
  border: 1px solid rgba(140, 146, 154, 0.24);
  border-radius: 999px;
  padding: 1px 6px;
  font-size: 9.5px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.aso-live-pill-form {
  display: inline-flex;
  align-items: center;
  margin: 0;
}

button.aso-live-pill {
  appearance: none;
  cursor: pointer;
  font-family: inherit;
  font-size: 9.5px;
  font-weight: 900;
  line-height: 1;
}

.aso-live-pill--action {
  padding: 1px 5px;
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease, transform 120ms ease;
}

.aso-live-pill--action svg {
  width: 9px;
  height: 9px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.2;
  opacity: 0.82;
}

.aso-live-pill--action:hover,
.aso-live-pill--action:focus-visible {
  outline: none;
  border-color: rgba(158, 202, 255, 0.48);
  background: rgba(158, 202, 255, 0.13);
  color: var(--aso-dashboard-text);
  transform: translateY(-1px);
}

.aso-live-pill--live {
  border-color: rgba(126, 228, 161, 0.42);
  background: rgba(126, 228, 161, 0.13);
  color: #7ee4a1;
}

.aso-live-pill--not-live {
  border-color: rgba(255, 116, 116, 0.32);
  background: rgba(255, 116, 116, 0.09);
  color: #ffb4ab;
}

.aso-live-pill--unknown {
  border-color: rgba(158, 202, 255, 0.24);
  background: rgba(158, 202, 255, 0.08);
  color: var(--aso-dashboard-muted);
}

.aso-app-card-primary-status .aso-live-pill {
  min-height: 26px;
  padding: 4px 10px;
  font-size: 11px;
  letter-spacing: 0;
}

.aso-app-card-primary-status button.aso-live-pill {
  font-size: 11px;
}

.aso-app-card-primary-status .aso-live-pill--action svg {
  width: 12px;
  height: 12px;
}

.aso-app-card-primary-status .aso-live-pill--live {
  border-color: rgba(34, 197, 94, 0.58);
  background: rgba(34, 197, 94, 0.18);
  color: #86efac;
  box-shadow: inset 0 0 0 1px rgba(34, 197, 94, 0.10);
}

.aso-app-card-primary-status .aso-live-pill--not-live {
  border-color: rgba(248, 113, 113, 0.58);
  background: rgba(248, 113, 113, 0.16);
  color: #fecaca;
  box-shadow: inset 0 0 0 1px rgba(248, 113, 113, 0.10);
}

.aso-app-card-primary-status .aso-live-pill--unknown {
  border-color: rgba(148, 163, 184, 0.34);
  background: rgba(148, 163, 184, 0.12);
  color: color-mix(in srgb, var(--aso-dashboard-text) 58%, var(--aso-dashboard-muted));
}

.aso-asa-card-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  border: 1px solid rgba(255, 255, 255, 0.74);
  border-radius: 999px;
  background: #f8fafc;
  color: #07090c;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  padding: 4px 10px;
  white-space: nowrap;
}

.aso-asa-card-badge--off {
  border-color: rgba(148, 163, 184, 0.28);
  background: rgba(148, 163, 184, 0.10);
  color: var(--aso-dashboard-muted);
  box-shadow: none;
}

.aso-competitor-source-tags {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  min-width: 0;
}

.aso-source-card-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 24px;
  border: 1px solid rgba(255, 255, 255, 0.66);
  border-radius: 999px;
  color: #ffffff;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.20);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  padding: 4px 9px 4px 6px;
  white-space: nowrap;
}

.aso-source-card-badge--asa {
  color: #07090c;
}

.aso-source-card-badge--aso {
  border-color: rgba(151, 220, 255, 0.82);
  background:
    linear-gradient(rgba(4, 15, 32, 0.34), rgba(4, 15, 32, 0.34)),
    linear-gradient(180deg, #18bbfc 0%, #1a99f6 54%, #1f77f3 100%);
}

.aso-source-card-badge--skillz {
  border-color: rgba(225, 184, 255, 0.72);
  background:
    linear-gradient(rgba(8, 5, 24, 0.18), rgba(8, 5, 24, 0.18)),
    linear-gradient(135deg, #2e2ffd 0%, #6e21c9 46%, #fd0235 100%);
}

.aso-source-card-badge__icon {
  position: relative;
  display: inline-block;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  overflow: hidden;
  border-radius: 4px;
}

.aso-source-card-badge__icon img {
  display: block;
  width: 16px;
  height: 16px;
}

.aso-ban-request-card-badge {
  appearance: none;
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 38px;
  min-width: 38px;
  height: 30px;
  border: 1px solid rgba(255, 202, 112, 0.78);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(255, 213, 128, 0.24), rgba(180, 83, 9, 0.20));
  color: #8a4f08;
  box-shadow: inset 0 1px 0 rgba(255, 244, 214, 0.18), 0 5px 12px rgba(0, 0, 0, 0.22);
  cursor: pointer;
  padding: 0;
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.aso-ban-request-card-badge:hover {
  border-color: rgba(255, 220, 148, 0.96);
  box-shadow: inset 0 1px 0 rgba(255, 244, 214, 0.24), 0 7px 16px rgba(0, 0, 0, 0.28);
  transform: translateY(-1px);
}

.aso-ban-request-card-badge:focus-visible {
  outline: 2px solid #fbbf24;
  outline-offset: 2px;
}

.aso-ban-request-card-icon {
  width: 25px;
  height: 21px;
}

.aso-ban-request-card-icon rect {
  fill: #fff5cf;
  stroke: #f6c766;
  stroke-width: 1.8;
}

.aso-ban-request-card-icon path {
  fill: none;
  stroke: #7c3e04;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.aso-ban-request-card-count {
  position: absolute;
  top: -7px;
  right: -7px;
  display: inline-grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  border: 2px solid #121a22;
  border-radius: 999px;
  background: #f59e0b;
  color: #111827;
  font-size: 10px;
  font-weight: 950;
  line-height: 1;
  text-align: center;
  padding: 0 4px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.30);
}

html[data-theme="light"] .aso-ban-request-card-badge {
  border-color: rgba(217, 119, 6, 0.44);
  background: linear-gradient(180deg, #fffaf0, #ffedd5);
  box-shadow: 0 8px 18px rgba(146, 64, 14, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.94);
}

html[data-theme="light"] .aso-ban-request-card-icon rect {
  fill: #fff7ed;
  stroke: #d97706;
}

html[data-theme="light"] .aso-ban-request-card-icon path {
  stroke: #7c2d12;
}

html[data-theme="light"] .aso-ban-request-card-count {
  border-color: #fff7ed;
  background: #d97706;
  color: #ffffff;
}

.aso-ban-request-modal {
  width: min(760px, calc(100vw - 28px));
  overflow: hidden;
}

.aso-ban-request-modal[open] {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.aso-ban-request-modal .aso-modal-body {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}

.aso-ban-request-history {
  display: grid;
  gap: 8px;
}

.aso-ban-request-history h3 {
  margin: 0;
  color: var(--aso-dashboard-text);
  font-size: 13px;
}

.aso-ban-request-history-list {
  display: grid;
  max-height: 220px;
  overflow: auto;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.aso-ban-request-history-list li {
  border: 1px solid var(--aso-dashboard-border-soft);
  border-radius: 8px;
  background: rgba(148, 163, 184, 0.06);
  padding: 8px;
}

.aso-ban-request-history-main {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 800;
}

.aso-ban-request-history-main strong {
  color: #ffd37f;
}

.aso-ban-request-history-list details {
  margin-top: 6px;
}

.aso-ban-request-history-list summary {
  color: var(--aso-dashboard-muted);
  cursor: pointer;
  font-size: 11px;
  font-weight: 800;
}

.aso-ban-request-history-list pre {
  max-height: 190px;
  overflow: auto;
  margin: 7px 0 0;
  border-radius: 7px;
  background: rgba(5, 8, 12, 0.42);
  color: var(--aso-dashboard-text);
  font: 11px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  white-space: pre-wrap;
  padding: 8px;
}

.aso-ban-request-history-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 7px;
}

.aso-ban-request-form {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.aso-ban-request-form label {
  display: grid;
  gap: 5px;
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 850;
}

.aso-ban-request-form select,
.aso-ban-request-form input,
.aso-ban-request-form textarea {
  width: 100%;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 8px;
  background: rgba(7, 11, 18, 0.78);
  color: var(--aso-dashboard-text);
  font: inherit;
  padding: 8px 10px;
}

.aso-ban-request-form textarea {
  min-height: 190px;
  resize: vertical;
  font: 12px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.aso-priority-pill--priority {
  border-color: rgba(126, 228, 161, 0.34);
  background: rgba(126, 228, 161, 0.12);
  color: #7ee4a1;
}

.aso-priority-pill--high {
  border-color: rgba(255, 201, 120, 0.38);
  background: rgba(255, 201, 120, 0.14);
  color: #ffc978;
}

.aso-priority-samples {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: 0 0 9px;
}

.aso-priority-samples span {
  max-width: 100%;
  overflow: hidden;
  border: 1px solid rgba(255, 201, 120, 0.22);
  border-radius: 999px;
  background: rgba(255, 201, 120, 0.08);
  color: #ffc978;
  font-size: 10px;
  font-weight: 850;
  padding: 3px 7px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-locale-split {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 5px;
}

.aso-app-card-meta-pills .aso-locale-split {
  align-items: center;
  margin-top: 0;
}

.aso-analysis-summary {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
}

.aso-analysis-summary .aso-live-pill {
  min-height: 18px;
  padding: 2px 6px;
}

.aso-analysis-pill {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  border: 1px solid rgba(140, 146, 154, 0.22);
  border-radius: 999px;
  background: rgba(140, 146, 154, 0.08);
  color: var(--aso-dashboard-muted);
  font-size: 9.5px;
  font-weight: 900;
  line-height: 1;
  padding: 2px 6px;
  white-space: nowrap;
}

.aso-analysis-pill--hard,
.aso-analysis-pill--visual-hard {
  border-color: rgba(255, 201, 120, 0.34);
  background: rgba(255, 201, 120, 0.10);
  color: #ffc978;
}

.aso-analysis-pill--visual-hard {
  border-style: dashed;
}

.aso-analysis-pill--light {
  border-color: rgba(158, 202, 255, 0.34);
  background: rgba(158, 202, 255, 0.09);
  color: #9ecaff;
}

.aso-locale-split-group {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  overflow: hidden;
  border: 1px solid rgba(140, 146, 154, 0.22);
  border-radius: 999px;
  background: rgba(140, 146, 154, 0.08);
  color: var(--aso-dashboard-muted);
  font-size: 9.5px;
  font-weight: 850;
  gap: 4px;
  min-height: 18px;
  padding: 2px 6px;
  white-space: nowrap;
}

.aso-locale-split-group strong {
  color: var(--aso-dashboard-text);
  font-size: 9.5px;
}

.aso-locale-split-group em {
  color: inherit;
  font-style: normal;
  opacity: 0.92;
}

.aso-locale-split-group--hard {
  border-color: rgba(255, 201, 120, 0.34);
  background: rgba(255, 201, 120, 0.10);
  color: #ffc978;
}

.aso-locale-split-group--light {
  border-color: rgba(158, 202, 255, 0.34);
  background: rgba(158, 202, 255, 0.09);
  color: #9ecaff;
}

.aso-locale-split--visual .aso-locale-split-group {
  border-style: dashed;
}

.aso-detail-source-tags {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.aso-detail-search-ads-form,
.aso-detail-source-tag-form,
.aso-visual-check-form {
  display: inline-flex;
  align-items: end;
}

.aso-detail-source-tag-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 34px;
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.aso-detail-source-tag-toggle--asa::before {
  content: "";
  font-size: 14px;
  line-height: 1;
}

.aso-detail-source-tag-toggle--aso.is-checked {
  border-color: rgba(151, 220, 255, 0.88);
  background:
    linear-gradient(rgba(4, 15, 32, 0.34), rgba(4, 15, 32, 0.34)),
    linear-gradient(180deg, #18bbfc 0%, #1a99f6 54%, #1f77f3 100%);
  color: #ffffff;
  box-shadow: 0 6px 16px rgba(31, 119, 243, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

.aso-detail-source-tag-toggle--skillz.is-checked {
  border-color: rgba(225, 184, 255, 0.82);
  background:
    linear-gradient(rgba(8, 5, 24, 0.18), rgba(8, 5, 24, 0.18)),
    linear-gradient(135deg, #2e2ffd 0%, #6e21c9 46%, #fd0235 100%);
  color: #ffffff;
  box-shadow: 0 6px 16px rgba(189, 25, 120, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.20);
}

.aso-detail-source-tag-toggle:not(:disabled):active {
  transform: translateY(1px);
}

.aso-visual-summary {
  display: grid;
  gap: 10px;
  margin: 0 0 14px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 10px;
  background: var(--aso-dashboard-panel);
  padding: 12px;
}

.aso-visual-summary header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.aso-visual-summary h2,
.aso-visual-summary p {
  margin: 0;
}

.aso-visual-summary h2 {
  color: var(--aso-dashboard-text);
  font-size: 17px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.15;
}

.aso-visual-summary__split {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}

.aso-visual-summary__split span {
  display: grid;
  min-width: 80px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 8px;
  background: rgba(140, 146, 154, 0.08);
  padding: 7px 9px;
}

.aso-visual-summary__split strong {
  color: var(--aso-dashboard-text);
  font-size: 18px;
  line-height: 1;
}

.aso-visual-summary__split small {
  color: var(--aso-dashboard-muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.aso-visual-summary__countries {
  margin-top: 0;
}

.aso-visual-summary__rows {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 7px;
}

.aso-visual-summary__row {
  display: grid;
  gap: 3px;
  min-width: 0;
  border: 1px solid var(--aso-dashboard-border-soft);
  border-radius: 8px;
  background: rgba(140, 146, 154, 0.06);
  padding: 8px;
}

.aso-visual-summary__row strong {
  color: var(--aso-dashboard-text);
  font-size: 12px;
  font-weight: 900;
}

.aso-visual-summary__row em,
.aso-visual-summary__row small {
  overflow: hidden;
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 750;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-visual-summary__row--hard_visual {
  border-color: rgba(255, 201, 120, 0.32);
}

.aso-visual-summary__row--light_visual {
  border-color: rgba(158, 202, 255, 0.32);
}

.aso-app-card-manual-priority {
  border-color: rgba(126, 228, 161, 0.36);
  background:
    linear-gradient(0deg, rgba(126, 228, 161, 0.045), rgba(126, 228, 161, 0.045)),
    var(--aso-dashboard-panel);
}

.aso-app-card--competitor.aso-app-card--good:not(.aso-app-card-outranks),
.aso-app-card--competitor.aso-app-card--bad:not(.aso-app-card-outranks),
.aso-app-card--competitor.aso-app-card--mixed:not(.aso-app-card-outranks) {
  border-color: var(--aso-dashboard-card-border);
}

.aso-app-card--competitor.aso-app-card--good:not(.aso-app-card-outranks)::before,
.aso-app-card--competitor.aso-app-card--bad:not(.aso-app-card-outranks)::before,
.aso-app-card--competitor.aso-app-card--mixed:not(.aso-app-card-outranks)::before {
  background: var(--aso-dashboard-border);
}

.aso-app-card--competitor.aso-app-card-manual-priority:not(.aso-app-card-outranks) {
  border-color: var(--aso-dashboard-card-border);
  background: var(--aso-dashboard-panel);
}

.aso-app-card--competitor.aso-app-card--warn.aso-app-card-manual-priority:not(.aso-app-card-outranks) {
  border-color: color-mix(in srgb, var(--aso-dashboard-warn) 38%, var(--aso-dashboard-card-border));
}

.aso-app-card--competitor.aso-app-card-outranks.aso-app-card-manual-priority {
  border-color: rgba(255, 201, 120, 0.46);
  background:
    linear-gradient(0deg, rgba(255, 201, 120, 0.075), rgba(255, 201, 120, 0.075)),
    var(--aso-dashboard-panel);
}

.aso-card-copy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  min-width: 24px;
  min-height: 24px;
  border: 1px solid rgba(140, 146, 154, 0.28);
  border-radius: 999px;
  background: rgba(140, 146, 154, 0.08);
  color: var(--aso-dashboard-muted);
  cursor: pointer;
  font: inherit;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease, transform 120ms ease;
}

.aso-card-copy {
  padding: 0;
}

.aso-card-availability-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  border: 1px solid rgba(158, 202, 255, 0.28);
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.08);
  color: #9ecaff;
  cursor: pointer;
  font: inherit;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  padding: 0 9px;
  white-space: nowrap;
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease, transform 120ms ease;
}

.aso-card-copy svg {
  width: 12px;
  height: 12px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.aso-card-priority-star {
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  font-size: 16px;
}

.aso-card-webview-toggle {
  color: var(--aso-dashboard-muted);
  width: 42px;
  min-width: 42px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
}

.aso-card-webview-toggle.is-checked {
  border-color: rgba(255, 201, 120, 0.78);
  background: rgba(255, 201, 120, 0.24);
  color: #ffd37f;
}

html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor {
  border-color: #d7dde8;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 8px 20px rgba(16, 24, 40, 0.04);
}

html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor:hover {
  border-color: #b8c3d3;
  box-shadow: 0 2px 5px rgba(16, 24, 40, 0.08), 0 12px 24px rgba(16, 24, 40, 0.07);
}

html[data-theme="light"] .page-aso-competitors .aso-app-card-primary-status .aso-live-pill--live {
  border-color: #15803d;
  background: #dcfce7;
  color: #166534;
  box-shadow: inset 0 0 0 1px rgba(21, 128, 61, 0.10);
}

html[data-theme="light"] .page-aso-competitors .aso-app-card-primary-status .aso-live-pill--not-live {
  border-color: #dc2626;
  background: #fee2e2;
  color: #991b1b;
  box-shadow: inset 0 0 0 1px rgba(220, 38, 38, 0.10);
}

html[data-theme="light"] .page-aso-competitors .aso-app-card-primary-status .aso-live-pill--unknown {
  border-color: #cbd5e1;
  background: #f1f5f9;
  color: #475569;
}

html[data-theme="light"] .page-aso-competitors .aso-asa-card-badge {
  border-color: #cbd5e1;
  background: #ffffff;
  color: #0f172a;
  box-shadow: 0 5px 14px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.96);
}

html[data-theme="light"] .page-aso-competitors .aso-asa-card-badge--off {
  border-color: #d7dde8;
  background: #f8fafc;
  color: #64748b;
  box-shadow: none;
}

html[data-theme="light"] .page-aso-competitors .aso-card-action-group {
  border-color: #d3dbe8;
  background: #f8fafc;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.84);
}

html[data-theme="light"] .page-aso-competitors .aso-card-action-group--danger {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-card-actions a.aso-card-copy,
html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-card-actions button {
  border-color: #c3cedd;
  background: #ffffff;
  color: #334155;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-card-actions a.aso-card-copy:hover,
html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-card-actions a.aso-card-copy:focus-visible,
html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-card-actions button:hover,
html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-card-actions button:focus-visible {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}

html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-card-actions .is-favorite,
html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-card-actions .aso-card-search-ads-toggle.is-checked,
html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-card-actions .aso-card-webview-toggle.is-checked {
  border-color: #d97706;
  background: #fff7ed;
  color: #b45309;
}

html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-card-actions .aso-card-remove:hover,
html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-card-actions .aso-card-remove:focus-visible {
  border-color: #dc2626;
  background: #fee2e2;
  color: #991b1b;
}

.page-aso-competitors .aso-dashboard-sections--competitors .aso-dashboard-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr));
  gap: 12px;
}

.aso-competitor-card-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  width: 100%;
  margin: 0 0 14px;
}

.aso-competitor-sort-toggle {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.34);
  padding: 3px;
}

.aso-competitor-sort-option {
  min-height: 30px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--aso-dashboard-muted);
  padding: 0 10px;
  font-size: 12px;
  font-weight: 850;
}

.aso-competitor-sort-option.is-active {
  background: rgba(125, 211, 252, 0.15);
  color: var(--aso-dashboard-text);
}

.page-aso-competitors .aso-app-card--competitor {
  min-height: 174px;
  border-radius: 8px;
  background: var(--aso-dashboard-panel);
  color: var(--aso-dashboard-text);
  padding: 0 14px 13px;
  box-shadow: var(--aso-dashboard-shadow);
  position: relative;
}

.page-aso-competitors .aso-app-card--competitor::before {
  display: none;
}

.page-aso-competitors .aso-app-card--competitor:hover {
  border-color: var(--aso-dashboard-card-hover);
  background: var(--aso-dashboard-panel-hover);
  box-shadow: var(--aso-dashboard-shadow-hover);
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-head {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  grid-template-areas:
    "icon title actions"
    "icon meta primary";
  column-gap: 10px;
  row-gap: 7px;
  align-items: start;
  min-height: 0;
  margin: 0 -14px 10px;
  border-bottom: 1px solid var(--aso-dashboard-border-soft);
  padding: 12px 10px 10px 14px;
}

.aso-competitor-card-select {
  grid-area: select;
  align-self: start;
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 48px;
  cursor: pointer;
}

.aso-competitor-card-select input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.aso-competitor-card-select span {
  width: 16px;
  height: 16px;
  border: 1px solid rgba(148, 163, 184, 0.48);
  border-radius: 5px;
  background: rgba(15, 23, 42, 0.38);
}

.aso-competitor-card-select input:checked + span {
  border-color: rgba(125, 211, 252, 0.82);
  background: rgba(125, 211, 252, 0.24);
  box-shadow: inset 0 0 0 3px rgba(15, 23, 42, 0.88);
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-main,
.page-aso-competitors .aso-app-card--competitor .aso-app-card-footer-row {
  display: contents;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-icon-link {
  grid-area: icon;
  align-self: start;
  width: 48px;
  height: 48px;
  border-radius: 10px;
  background: var(--aso-dashboard-icon-bg);
  box-shadow: none;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-icon img,
.page-aso-competitors .aso-app-card--competitor .aso-app-icon-fallback {
  width: 48px;
  height: 48px;
  border-radius: 10px;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-text {
  grid-area: title;
  align-self: start;
  gap: 0;
  padding-top: 1px;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-name-link:hover,
.page-aso-competitors .aso-app-card--competitor .aso-app-card-name-link:focus-visible {
  color: #ffffff;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-text strong {
  color: var(--aso-dashboard-text);
  font-size: 15px;
  font-weight: 900;
  line-height: 1.12;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-meta-pills {
  grid-area: meta;
  display: grid;
  justify-items: start;
  align-self: start;
  gap: 6px;
  padding-top: 0;
}

.page-aso-competitors .aso-app-card--competitor .aso-run-id-pill {
  min-height: 20px;
  padding: 2px 7px;
  font-size: 11px;
  font-weight: 850;
  line-height: 1;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-inline-meta {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  max-width: 100%;
  gap: 4px 8px;
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.15;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-inline-meta span {
  min-width: 0;
  white-space: nowrap;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-inline-meta span:nth-child(3) {
  grid-column: 1;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-inline-meta span:nth-child(4) {
  grid-column: 2;
}

.page-aso-competitors .aso-app-card--competitor .aso-analysis-summary {
  gap: 5px;
  margin-top: 0;
}

.page-aso-competitors .aso-app-card--competitor .aso-analysis-pill {
  min-height: 19px;
  border-radius: 999px;
  padding: 2px 7px;
  font-size: 10.5px;
  font-weight: 900;
}

.page-aso-competitors .aso-app-card--competitor .aso-analysis-pill--light {
  border-color: rgba(87, 145, 205, 0.48);
  background: rgba(44, 114, 184, 0.14);
  color: #bfe1ff;
}

.page-aso-competitors .aso-app-card--competitor .aso-analysis-pill--hard,
.page-aso-competitors .aso-app-card--competitor .aso-analysis-pill--visual-hard {
  border-color: rgba(255, 201, 120, 0.46);
  background: rgba(255, 201, 120, 0.12);
  color: #ffd18a;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-primary-status {
  grid-area: primary;
  display: flex;
  flex-direction: column-reverse;
  align-items: flex-end;
  justify-self: end;
  align-self: end;
  gap: 7px;
  min-width: 0;
}

.page-aso-competitors .aso-app-card--competitor .aso-competitor-source-tags {
  justify-content: flex-end;
  max-width: 190px;
}

.page-aso-competitors .aso-app-card--competitor .aso-asa-card-badge {
  min-height: 24px;
  border-color: rgba(255, 255, 255, 0.88);
  border-radius: 999px;
  background: #ffffff;
  color: #0b0d10;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96);
}

.page-aso-competitors .aso-app-card--competitor .aso-asa-card-badge::before {
  content: "";
  margin-right: 5px;
  font-size: 13px;
  line-height: 1;
}

.page-aso-competitors .aso-app-card--competitor .aso-asa-card-badge--off {
  border-color: rgba(171, 184, 199, 0.26);
  background: rgba(171, 184, 199, 0.10);
  color: #9aa6b2;
  box-shadow: none;
}

.page-aso-competitors .aso-app-card--competitor .aso-asa-card-badge--off::before {
  display: none;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-primary-status .aso-live-pill {
  min-height: 25px;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-primary-status .aso-live-pill span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-primary-status .aso-live-pill span::before {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: currentColor;
  box-shadow: 0 0 14px currentColor;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-primary-status .aso-live-pill--action svg {
  width: 12px;
  height: 12px;
  margin-left: 1px;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-primary-status .aso-live-pill--live {
  border-color: rgba(34, 197, 94, 0.58);
  background: rgba(34, 197, 94, 0.16);
  color: #66df8d;
  box-shadow: inset 0 0 0 1px rgba(34, 197, 94, 0.10);
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-primary-status .aso-live-pill--not-live {
  border-color: rgba(248, 113, 113, 0.54);
  background: rgba(248, 113, 113, 0.13);
  color: #fecaca;
}

.page-aso-competitors .aso-app-card--competitor .aso-app-card-primary-status .aso-live-pill--unknown {
  border-color: rgba(148, 163, 184, 0.36);
  background: rgba(148, 163, 184, 0.12);
  color: #a8b3c0;
}

.page-aso-competitors .aso-app-card--competitor .aso-card-actions {
  grid-area: actions;
  align-self: start;
  justify-self: end;
  flex-wrap: nowrap;
  gap: 5px;
  margin-left: 0;
}

.page-aso-competitors .aso-app-card--competitor .aso-card-action-group {
  min-height: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  gap: 5px;
  padding: 0;
}

.page-aso-competitors .aso-app-card--competitor .aso-card-actions a.aso-card-copy,
.page-aso-competitors .aso-app-card--competitor .aso-card-actions button {
  display: inline-grid;
  place-items: center;
  flex: 0 0 34px;
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  border: 1px solid rgba(158, 202, 255, 0.30);
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.075);
  color: rgba(219, 232, 246, 0.94);
  box-shadow: none;
}

.page-aso-competitors .aso-app-card--competitor .aso-card-actions svg {
  width: 15px;
  height: 15px;
  stroke-width: 2.2;
}

.page-aso-competitors .aso-app-card--competitor .aso-card-actions .aso-card-webview-toggle {
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0;
}

.page-aso-competitors .aso-app-card--competitor .aso-card-actions a.aso-card-copy:hover,
.page-aso-competitors .aso-app-card--competitor .aso-card-actions a.aso-card-copy:focus-visible,
.page-aso-competitors .aso-app-card--competitor .aso-card-actions button:hover,
.page-aso-competitors .aso-app-card--competitor .aso-card-actions button:focus-visible {
  border-color: rgba(159, 187, 219, 0.58);
  background: rgba(105, 135, 166, 0.24);
  color: #e6f0f8;
}

.page-aso-competitors .aso-app-card--competitor .aso-card-actions .is-favorite,
.page-aso-competitors .aso-app-card--competitor .aso-card-actions .aso-card-search-ads-toggle.is-checked,
.page-aso-competitors .aso-app-card--competitor .aso-card-actions .aso-card-webview-toggle.is-checked {
  border-color: rgba(255, 201, 120, 0.78);
  background: rgba(255, 201, 120, 0.24);
  color: #ffc95d;
  box-shadow:
    inset 0 0 0 1px rgba(255, 201, 120, 0.14),
    0 0 0 1px rgba(255, 201, 120, 0.08);
}

.page-aso-competitors .aso-app-card--competitor .aso-card-actions .aso-card-priority-star.is-favorite svg {
  fill: currentColor;
  stroke: currentColor;
}

.page-aso-competitors .aso-app-card--competitor .aso-card-actions .aso-card-search-ads-toggle {
  font-size: 10px;
  font-weight: 950;
  letter-spacing: 0;
}

.aso-app-card-check-time {
  margin-top: 7px;
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.2;
  text-align: left;
}

.page-aso-competitors.aso-competitor-cards-compact .aso-app-card-check-time,
html.aso-competitor-cards-compact .page-aso-competitors .aso-app-card-check-time {
  display: none;
}

.aso-competitor-mail-hero {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.aso-competitor-mail-hero svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
}

.aso-competitor-mail-modal {
  width: min(760px, calc(100vw - 24px));
  max-height: min(860px, calc(100vh - 24px));
  overflow: hidden;
}

.aso-competitor-mail-modal[open] {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.aso-competitor-mail-modal .aso-modal-body {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}

.aso-competitor-mail-form {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 0;
  min-height: 0;
  overflow: hidden;
}

.aso-competitor-mail-summary,
.aso-competitor-mail-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.aso-competitor-mail-summary {
  margin-bottom: 12px;
  color: var(--aso-dashboard-muted);
}

.aso-competitor-mail-summary strong {
  color: var(--aso-dashboard-text);
}

.aso-competitor-mail-summary > span {
  display: grid;
  gap: 2px;
}

.aso-competitor-mail-summary > span:last-child {
  text-align: right;
}

.aso-competitor-mail-summary small {
  display: block;
  font-size: 10px;
  font-weight: 750;
}

.aso-competitor-mail-picker {
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.24);
  margin-bottom: 12px;
  padding: 10px;
}

.aso-competitor-mail-picker-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.aso-competitor-mail-picker-head strong {
  color: var(--aso-dashboard-text);
  font-size: 12px;
  font-weight: 900;
}

.aso-competitor-mail-picker-head span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.aso-competitor-mail-picker-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  max-height: 190px;
  overflow: auto;
  padding-right: 2px;
}

.aso-competitor-mail-picker-item {
  position: relative;
  display: grid;
  grid-template-columns: 16px 30px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 8px;
  background: rgba(148, 163, 184, 0.08);
  cursor: pointer;
  padding: 7px 8px;
}

.aso-competitor-mail-picker-item.is-selected {
  border-color: color-mix(in srgb, var(--m3-primary) 46%, transparent);
  background: color-mix(in srgb, var(--m3-primary-container) 45%, transparent);
}

.aso-competitor-mail-picker-item.is-reordering {
  z-index: 2;
  box-shadow: 0 8px 22px rgba(2, 8, 23, 0.28);
}

.aso-competitor-mail-picker-item input {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #7dd3fc;
}

.aso-competitor-mail-picker-visual {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 7px;
  background: var(--aso-dashboard-icon-bg);
  color: var(--aso-dashboard-text);
  font-size: 12px;
  font-weight: 900;
  overflow: hidden;
}

.aso-competitor-mail-picker-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.aso-competitor-mail-picker-text {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.aso-competitor-mail-picker-text strong,
.aso-competitor-mail-picker-text small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-competitor-mail-picker-text strong {
  color: var(--aso-dashboard-text);
  font-size: 12px;
  font-weight: 850;
}

.aso-competitor-mail-picker-text small,
.aso-competitor-mail-picker-empty {
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 750;
}

.aso-competitor-mail-picker-empty {
  margin: 0;
}

.aso-competitor-mail-controls {
  align-items: end;
  margin-bottom: 12px;
}

.aso-competitor-mail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.aso-competitor-mail-controls label,
.aso-competitor-mail-grid label,
.aso-competitor-mail-body-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.aso-competitor-mail-controls label {
  flex: 1 1 0;
}

.aso-competitor-mail-controls label > span,
.aso-competitor-mail-grid label > span,
.aso-competitor-mail-body-field > span {
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.aso-competitor-mail-controls select,
.aso-competitor-mail-grid select,
.aso-competitor-mail-grid input,
.aso-competitor-mail-body-field textarea {
  width: 100%;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.46);
  color: var(--aso-dashboard-text);
  padding: 9px 10px;
}

.aso-competitor-mail-body-field textarea {
  resize: vertical;
  min-height: 170px;
  height: clamp(180px, 28vh, 300px);
  max-height: 36vh;
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace);
  font-size: 12px;
  line-height: 1.45;
}

.aso-competitor-mail-comment-field {
  margin-bottom: 12px;
}

.aso-competitor-mail-comment-field textarea {
  min-height: 84px;
  height: 84px;
  max-height: 160px;
  font-family: inherit;
}

.aso-competitor-mail-modal .aso-modal-actions {
  position: relative;
  z-index: 2;
  margin: 0;
  border-top: 1px solid rgba(148, 163, 184, 0.18);
  background: transparent;
  padding: 12px 16px 16px;
}

.aso-competitor-mail-modal .aso-modal-actions .btn {
  min-height: 44px;
}

.aso-competitor-mail-list,
.aso-competitor-mail-selected {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}

.aso-competitor-mail-list span,
.aso-competitor-mail-selected span {
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.10);
  color: var(--aso-dashboard-text);
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 800;
}

.aso-competitor-mail-message {
  min-height: 18px;
  margin: 8px 0 0;
  color: var(--aso-dashboard-muted);
  font-size: 12px;
  font-weight: 800;
}

.aso-competitor-mail-message.has-error {
  color: #ffb4ab;
}

.aso-competitor-requests {
  display: grid;
  gap: 16px;
}

.aso-competitor-requests-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
  gap: 14px;
  align-items: start;
}

.aso-competitor-request-panel {
  display: grid;
  gap: 10px;
  border: 1px solid var(--aso-dashboard-border-soft);
  border-radius: 8px;
  background: var(--aso-dashboard-panel);
  box-shadow: var(--aso-dashboard-shadow);
  padding: 14px;
}

.aso-competitor-request-panel__head,
.aso-competitor-request-card header,
.aso-competitor-ban-history-item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.aso-competitor-request-panel__head h3 {
  margin: 0;
  color: var(--aso-dashboard-text);
  font-size: 15px;
}

.aso-competitor-request-panel__head p,
.aso-competitor-request-card small,
.aso-competitor-ban-history-item small,
.aso-competitor-request-empty {
  margin: 0;
  color: var(--aso-dashboard-muted);
  font-size: 12px;
  font-weight: 750;
}

.aso-competitor-request-panel__head > strong {
  display: inline-grid;
  place-items: center;
  min-width: 28px;
  height: 28px;
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.11);
  color: var(--aso-dashboard-text);
  font-size: 12px;
}

.aso-competitor-request-list,
.aso-competitor-ban-history-list {
  display: grid;
  gap: 10px;
}

.aso-competitor-request-card,
.aso-competitor-ban-history-item {
  border: 1px solid var(--aso-dashboard-border-soft);
  border-radius: 8px;
  background: rgba(148, 163, 184, 0.06);
  padding: 10px;
}

.aso-competitor-request-card {
  display: grid;
  gap: 9px;
}

.aso-competitor-request-card strong,
.aso-competitor-ban-history-item strong {
  color: var(--aso-dashboard-text);
}

.aso-competitor-request-status-form select {
  min-width: 140px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.52);
  color: var(--aso-dashboard-text);
  padding: 7px 9px;
}

.aso-competitor-request-apps {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.aso-competitor-request-apps span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 240px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.20);
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.09);
  color: var(--aso-dashboard-text);
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 800;
}

.aso-competitor-request-apps a {
  min-width: 0;
  overflow: hidden;
  color: inherit;
  text-overflow: ellipsis;
  text-decoration: none;
  white-space: nowrap;
}

.aso-competitor-request-apps small {
  flex: 0 0 auto;
  font-size: 10px;
}

.aso-competitor-request-card details summary {
  cursor: pointer;
  color: var(--aso-dashboard-muted);
  font-size: 12px;
  font-weight: 850;
}

.aso-competitor-request-card pre {
  max-height: 240px;
  overflow: auto;
  margin: 8px 0 0;
  border-radius: 8px;
  background: rgba(5, 8, 12, 0.48);
  color: var(--aso-dashboard-text);
  font: 12px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  white-space: pre-wrap;
  padding: 10px;
}

.aso-competitor-request-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.aso-competitor-request-status-message {
  color: var(--aso-dashboard-muted);
  font-size: 12px;
  font-weight: 850;
}

.aso-competitor-ban-history-item {
  align-items: center;
}

.aso-competitor-ban-history-item > span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.aso-competitor-ban-history-item em {
  flex: 0 0 auto;
  border-radius: 999px;
  background: rgba(255, 201, 120, 0.12);
  color: #ffc978;
  padding: 4px 8px;
  font-size: 11px;
  font-style: normal;
  font-weight: 850;
}

/* Competitor complaint register ------------------------------------------ */
.aso-competitor-requests__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}

.aso-competitor-requests__head h2 {
  margin: 0;
  color: var(--aso-dashboard-text);
  font-size: clamp(22px, 2.4vw, 30px);
  letter-spacing: -0.035em;
}

.aso-competitor-requests__head .hint {
  max-width: 760px;
  margin: 7px 0 0;
}

.aso-competitor-request-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.aso-competitor-request-kpi {
  --request-kpi: #9ecaff;
  position: relative;
  display: grid;
  gap: 8px;
  min-height: 92px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--request-kpi) 22%, var(--aso-dashboard-border-soft));
  border-radius: 12px;
  background: color-mix(in srgb, var(--request-kpi) 5%, var(--aso-dashboard-panel));
  padding: 16px;
  box-shadow: var(--aso-dashboard-shadow);
}

.aso-competitor-request-kpi span {
  color: var(--aso-dashboard-muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.aso-competitor-request-kpi strong {
  color: var(--aso-dashboard-text);
  font-size: 26px;
  line-height: 1;
}

.aso-competitor-request-kpi--open { --request-kpi: #55d58b; }
.aso-competitor-request-kpi--success { --request-kpi: #76d85e; }
.aso-competitor-request-kpi--partial { --request-kpi: #ffc95d; }
.aso-competitor-request-kpi--negative { --request-kpi: #ff7c84; }

.aso-competitor-request-panel--table {
  gap: 0;
  overflow: hidden;
  padding: 0;
}

.aso-competitor-request-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1.5fr) repeat(3, minmax(132px, 0.75fr)) repeat(2, minmax(130px, 0.7fr)) auto;
  gap: 9px;
  align-items: end;
  border-bottom: 1px solid var(--aso-dashboard-border-soft);
  background: color-mix(in srgb, var(--aso-dashboard-panel) 88%, transparent);
  padding: 12px;
}

.aso-competitor-request-filter {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.aso-competitor-request-filter > span {
  color: var(--aso-dashboard-muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.aso-competitor-request-filter input,
.aso-competitor-request-filter select {
  width: 100%;
  min-height: 36px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface-container) 82%, transparent);
  color: var(--aso-dashboard-text);
  padding: 7px 9px;
  font: inherit;
  font-size: 12px;
}

.aso-competitor-request-table-wrap {
  max-width: 100%;
  overflow: auto;
}

.aso-competitor-request-table {
  width: 100%;
  min-width: 1170px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  color: var(--aso-dashboard-text);
  font-size: 12px;
}

.aso-competitor-request-table th,
.aso-competitor-request-table td {
  border-bottom: 1px solid var(--aso-dashboard-border-soft);
  padding: 8px;
  text-align: left;
  vertical-align: middle;
}

.aso-competitor-request-table th:nth-child(1) { width: 112px; }
.aso-competitor-request-table th:nth-child(2) { width: 110px; }
.aso-competitor-request-table th:nth-child(3) { width: 100px; }
.aso-competitor-request-table th:nth-child(4) { width: 88px; }
.aso-competitor-request-table th:nth-child(5) { width: 146px; }
.aso-competitor-request-table th:nth-child(6) { width: 116px; }
.aso-competitor-request-table th:nth-child(7) { width: 138px; }
.aso-competitor-request-table th:nth-child(8) { width: 110px; }
.aso-competitor-request-table th:nth-child(9) { width: 160px; }
.aso-competitor-request-table th:nth-child(10) { width: 90px; }

.aso-competitor-request-table th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: var(--aso-dashboard-panel);
  color: var(--aso-dashboard-muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.035em;
  text-transform: uppercase;
  white-space: nowrap;
}

.aso-competitor-request-table tbody tr {
  background: color-mix(in srgb, var(--aso-dashboard-panel) 82%, transparent);
  transition: background-color 150ms ease;
}

.aso-competitor-request-table tbody tr:hover {
  background: color-mix(in srgb, var(--primary) 5%, var(--aso-dashboard-panel));
}

.aso-competitor-request-table tbody tr:last-child td {
  border-bottom: 0;
}

.aso-competitor-request-table select,
.aso-competitor-request-review-date {
  min-height: 32px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 7px;
  background: color-mix(in srgb, var(--surface-container) 84%, transparent);
  color: var(--aso-dashboard-text);
  padding: 5px 7px;
  font: inherit;
  font-size: 11px;
}

.aso-competitor-request-status-form select {
  min-width: 104px;
}

[data-request-status="open"] .aso-competitor-request-status-form select {
  border-color: color-mix(in srgb, #55d58b 42%, var(--aso-dashboard-border));
  background: color-mix(in srgb, #55d58b 12%, var(--surface-container));
  color: #8de7ae;
}

[data-request-status="closed"] .aso-competitor-request-status-form select {
  border-color: color-mix(in srgb, #ff7c84 32%, var(--aso-dashboard-border));
  background: color-mix(in srgb, #ff7c84 9%, var(--surface-container));
  color: #ffb0b5;
}

.aso-competitor-request-channel {
  display: inline-flex;
  min-width: 70px;
  justify-content: center;
  border: 1px solid rgba(124, 161, 255, 0.24);
  border-radius: 999px;
  background: rgba(86, 105, 255, 0.12);
  color: #aebdff;
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.aso-competitor-request-channel--eu {
  border-color: rgba(78, 211, 146, 0.25);
  background: rgba(78, 211, 146, 0.11);
  color: #78dfa8;
}

.aso-competitor-request-country {
  letter-spacing: 0.08em;
}

.aso-competitor-request-review-date {
  width: 134px;
}

.aso-competitor-request-result {
  min-width: 112px;
}

[data-request-result="successful"] .aso-competitor-request-result { color: #82e59b; }
[data-request-result="partial"] .aso-competitor-request-result { color: #ffd178; }
[data-request-result="negative"] .aso-competitor-request-result { color: #ff9ca2; }

.aso-competitor-request-account {
  display: block;
  max-width: 136px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-competitor-request-app-summary {
  display: flex;
  max-width: 170px;
  flex-wrap: wrap;
  gap: 4px;
}

.aso-competitor-request-app-summary span,
.aso-competitor-request-app-summary em {
  max-width: 150px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.10);
  color: var(--aso-dashboard-text);
  padding: 3px 7px;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-competitor-request-open {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 7px;
  background: rgba(148, 163, 184, 0.08);
  color: var(--aso-dashboard-text);
  cursor: pointer;
  padding: 5px 9px;
  font-family: inherit;
  font-size: 11px;
  font-weight: 850;
}

.aso-competitor-request-open:hover,
.aso-competitor-request-open:focus-visible {
  border-color: var(--primary, #9ecaff);
  color: var(--primary, #9ecaff);
  outline: none;
}

.aso-competitor-request-dialog {
  width: min(920px, calc(100vw - 24px));
  max-height: min(860px, calc(100vh - 24px));
  overflow: hidden;
}

.aso-competitor-request-dialog[open] {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.aso-competitor-request-dialog .aso-modal-body {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}

.aso-competitor-request-dialog-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.aso-competitor-request-dialog-meta > span {
  min-width: 0;
  border: 1px solid var(--aso-dashboard-border-soft);
  margin: 0;
  border-radius: 8px;
  background: rgba(148, 163, 184, 0.06);
  padding: 9px 10px;
}

.aso-competitor-request-dialog-meta small,
.aso-competitor-request-dialog-meta strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-competitor-request-dialog-meta small,
.aso-competitor-request-dialog-section header small {
  color: var(--aso-dashboard-muted);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.aso-competitor-request-dialog-meta strong {
  margin-top: 3px;
  color: var(--aso-dashboard-text);
  font-size: 12px;
}

.aso-competitor-request-dialog-section {
  display: grid;
  gap: 10px;
  border: 1px solid var(--aso-dashboard-border-soft);
  border-radius: 10px;
  background: rgba(148, 163, 184, 0.04);
  padding: 12px;
}

.aso-competitor-request-dialog-section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.aso-competitor-request-dialog-section > header span,
.aso-competitor-request-dialog-section > header strong {
  display: block;
}

.aso-competitor-request-dialog-section > header strong {
  margin-top: 2px;
  color: var(--aso-dashboard-text);
  font-size: 13px;
}

.aso-competitor-request-dialog-section > header em {
  display: inline-grid;
  min-width: 28px;
  min-height: 24px;
  place-items: center;
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.12);
  color: var(--primary, #9ecaff);
  padding: 0 8px;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}

.aso-competitor-request-dialog-apps {
  max-height: 260px;
  overflow: auto;
  align-content: flex-start;
}

.aso-competitor-request-dialog-section pre {
  max-height: 300px;
  overflow: auto;
  margin: 0;
  border-radius: 8px;
  background: rgba(5, 8, 12, 0.46);
  color: var(--aso-dashboard-text);
  padding: 10px;
  font: 11px/1.45 var(--font-mono, ui-monospace, monospace);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.aso-competitor-request-dialog-empty {
  margin: 0;
  border-radius: 8px;
  background: rgba(148, 163, 184, 0.06);
  color: var(--aso-dashboard-muted);
  padding: 12px;
  font-size: 11px;
}

.aso-competitor-request-note-links {
  display: grid;
  gap: 6px;
  max-height: 240px;
  overflow: auto;
  border-radius: 8px;
  background: rgba(5, 8, 12, 0.46);
  padding: 10px;
}

.aso-competitor-request-note-links a,
.aso-competitor-request-note-links span {
  overflow-wrap: anywhere;
  color: var(--aso-dashboard-text);
  font: 11px/1.45 var(--font-mono, ui-monospace, monospace);
}

.aso-competitor-request-note-links a:hover,
.aso-competitor-request-note-links a:focus-visible {
  color: var(--primary, #9ecaff);
}

@media (max-width: 720px) {
  .aso-competitor-request-dialog-meta {
    grid-template-columns: 1fr;
  }

  .aso-competitor-request-dialog-apps span {
    max-width: 100%;
  }
}

.aso-competitor-request-status-message {
  display: block;
  max-width: 110px;
  margin-top: 5px;
  font-size: 10px;
}

.aso-competitor-request-table-footer {
  border-top: 1px solid var(--aso-dashboard-border-soft);
  color: var(--aso-dashboard-muted);
  padding: 10px 12px;
  font-size: 11px;
}

.aso-competitor-request-table-wrap > .aso-competitor-request-empty {
  margin: 0;
  padding: 28px 16px;
  text-align: center;
}

.aso-competitor-ban-history-panel {
  max-height: 360px;
  overflow: auto;
}

.aso-competitor-ban-history-panel > summary {
  list-style: none;
  cursor: pointer;
}

.aso-competitor-ban-history-panel > summary::-webkit-details-marker { display: none; }

.aso-competitor-ban-history-panel[open] > summary {
  margin-bottom: 10px;
}

.aso-competitor-mail-modal {
  width: min(960px, calc(100vw - 24px));
}

.aso-competitor-mail-picker-search {
  width: 100%;
  min-height: 36px;
  margin-bottom: 8px;
  border: 1px solid var(--aso-dashboard-border);
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.34);
  color: var(--aso-dashboard-text);
  padding: 8px 10px;
}

.aso-competitor-mail-picker-item[hidden] { display: none; }

.aso-competitor-mail-picker-visual {
  position: relative;
}

.aso-competitor-mail-picker-visual > span {
  grid-area: 1 / 1;
}

.aso-competitor-mail-picker-visual img {
  position: absolute;
  inset: 0;
}

.aso-competitor-mail-grid--request-meta {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.aso-competitor-mail-account-field {
  grid-column: 1 / -1;
}

.aso-competitor-mail-grid--text-options {
  padding-top: 4px;
}

.page-aso-competitors .aso-app-card--competitor .aso-card-actions .aso-card-remove:hover,
.page-aso-competitors .aso-app-card--competitor .aso-card-actions .aso-card-remove:focus-visible {
  border-color: rgba(255, 116, 116, 0.52);
  background: rgba(255, 116, 116, 0.13);
  color: #ffc2bd;
}

html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-app-card-name-link:hover,
html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-app-card-name-link:focus-visible {
  color: #005c94;
}

html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-run-id-pill {
  border-color: #cbd5e1;
  background: #f8fafc;
  color: #0f172a;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-analysis-pill--hard,
html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-analysis-pill--visual-hard {
  border-color: #d97706;
  background: #fff7ed;
  color: #92400e;
}

html[data-theme="light"] .page-aso-competitors .aso-app-card--competitor .aso-analysis-pill--light {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}

.aso-card-copy:hover,
.aso-card-copy:focus-visible,
.aso-card-availability-check:hover,
.aso-card-availability-check:focus-visible {
  outline: none;
  border-color: rgba(158, 202, 255, 0.42);
  background: rgba(158, 202, 255, 0.10);
  color: var(--aso-dashboard-text);
  transform: translateY(-1px);
}

.aso-app-store-link:hover,
.aso-app-store-link:focus-visible {
  background: rgba(255, 255, 255, 0.16);
  opacity: 1;
  transform: translateY(-1px);
}

.aso-app-store-link svg {
  width: 11px;
  height: 11px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aso-app-card-status {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  margin-top: 8px;
  overflow: hidden;
  border: 1px solid rgba(140, 146, 154, 0.18);
  border-radius: 999px;
  background: rgba(140, 146, 154, 0.10);
  color: var(--muted);
  font-size: 9.5px;
  font-weight: 900;
  line-height: 1.15;
  padding: 3px 6px;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.aso-app-card-status--attention {
  border-color: rgba(255, 201, 120, 0.34);
  background: rgba(255, 201, 120, 0.12);
  color: #ffc978;
}

.aso-app-card-status--growth {
  border-color: rgba(126, 228, 161, 0.34);
  background: rgba(126, 228, 161, 0.12);
  color: #7ee4a1;
}

.aso-app-card-status--paused {
  border-color: rgba(140, 146, 154, 0.22);
  background: rgba(140, 146, 154, 0.08);
}

.aso-app-insight {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-top: 8px;
  min-height: 28px;
  border-radius: 6px;
  padding: 5px 8px;
  background: rgba(140, 146, 154, 0.11);
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
}

.aso-app-insight span {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.aso-app-insight--good {
  background: rgba(126, 228, 161, 0.12);
  color: #7ee4a1;
}

.aso-app-insight--bad {
  background: rgba(255, 116, 116, 0.12);
  color: var(--danger);
}

.aso-app-insight--warn {
  background: rgba(255, 201, 120, 0.12);
  color: #ffc978;
}

.aso-app-insight time {
  flex: 0 0 auto;
  padding-top: 1px;
  font-variant-numeric: tabular-nums;
}

.aso-app-movements {
  --aso-movement-key-column: clamp(56px, 24%, 88px);
  display: grid;
  grid-template-columns: minmax(0, var(--aso-movement-key-column)) minmax(0, 1fr);
  column-gap: 7px;
  row-gap: 8px;
  margin-top: 0;
  min-width: 0;
  color: var(--aso-dashboard-text);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.45;
}

.page-aso-competitors.aso-competitor-cards-compact .aso-app-card--competitor .aso-app-movements,
html.aso-competitor-cards-compact .page-aso-competitors .aso-app-card--competitor .aso-app-movements,
.page-aso-competitors.aso-competitor-cards-compact .aso-competitor-screenshot-block,
html.aso-competitor-cards-compact .page-aso-competitors .aso-competitor-screenshot-block {
  display: none;
}

.page-aso-competitors.aso-competitor-cards-compact .aso-dashboard-grid,
html.aso-competitor-cards-compact .page-aso-competitors .aso-dashboard-grid {
  align-items: start;
}

.page-aso-competitors.aso-competitor-cards-compact .aso-app-card--competitor,
html.aso-competitor-cards-compact .page-aso-competitors .aso-app-card--competitor {
  min-height: 0;
  padding-bottom: 0;
}

.page-aso-competitors.aso-competitor-cards-compact .aso-app-card--competitor .aso-app-card-head,
html.aso-competitor-cards-compact .page-aso-competitors .aso-app-card--competitor .aso-app-card-head {
  margin-bottom: 0;
  border-bottom: 0;
}

.aso-app-movements--entries-1 {
  --aso-movement-key-column: min(46%, 190px);
}

.aso-competitor-screenshot-block {
  --aso-competitor-screenshot-height: 11rem;
  min-width: 0;
  margin-top: 10px;
  border-top: 1px solid var(--aso-dashboard-border-soft);
  padding-top: 9px;
}

.aso-competitor-screenshot-block[hidden] {
  display: none;
}

.aso-competitor-screenshot-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 7px;
  color: var(--aso-dashboard-muted);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.aso-competitor-screenshot-head strong {
  color: var(--aso-dashboard-text);
  font-size: 11px;
}

.aso-competitor-screenshot-head span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-competitor-screenshot-loading {
  min-height: 42px;
  display: flex;
  align-items: center;
  border: 1px dashed rgba(124, 200, 248, 0.22);
  border-radius: 8px;
  background: rgba(13, 18, 24, 0.42);
  color: var(--aso-dashboard-muted);
  padding: 9px 10px;
  font-size: 11px;
}

.step-graphics-grid.aso-competitor-screenshot-carousel {
  display: flex;
  flex-flow: row nowrap;
  align-items: stretch;
  gap: 0.65rem;
  margin: 0;
  padding: 0 0 0.35rem;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: rgba(124, 200, 248, 0.45) rgba(15, 20, 25, 0.35);
}

.step-graphics-grid.aso-competitor-screenshot-carousel::-webkit-scrollbar {
  height: 7px;
}

.step-graphics-grid.aso-competitor-screenshot-carousel::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background: rgba(124, 200, 248, 0.4);
}

.step-graphics-grid.aso-competitor-screenshot-carousel .step-graphics-item {
  --shot-ratio: 0.46;
  flex: 0 0 auto;
  width: clamp(6.4rem, calc(var(--aso-competitor-screenshot-height) * var(--shot-ratio)), min(44vw, 18rem));
  min-width: 6.4rem;
  max-width: min(44vw, 18rem);
  margin: 0;
  scroll-snap-align: start;
}

.step-graphics-grid.aso-competitor-screenshot-carousel .step-graphics-item.aso-competitor-media-item--video.is-landscape {
  --shot-ratio: 2.16;
}

.step-graphics-grid.aso-competitor-screenshot-carousel .aso-competitor-media-frame {
  position: relative;
  width: 100%;
  height: var(--aso-competitor-screenshot-height);
  min-height: var(--aso-competitor-screenshot-height);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #0d1218;
  overflow: hidden;
}

.step-graphics-grid.aso-competitor-screenshot-carousel .step-graphics-item img,
.step-graphics-grid.aso-competitor-screenshot-carousel .step-graphics-item video {
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: contain;
}

.aso-competitor-video-preview video {
  display: block;
  background: #0d1218;
}

.aso-competitor-video-badge {
  position: absolute;
  top: 7px;
  left: 7px;
  z-index: 2;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 999px;
  background: rgba(6, 10, 15, 0.76);
  color: #fff;
  padding: 3px 6px;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1;
  pointer-events: none;
}

.aso-competitor-video-fallback {
  position: absolute;
  inset: auto 8px 8px;
  z-index: 3;
  border: 1px solid rgba(124, 200, 248, 0.52);
  border-radius: 7px;
  background: rgba(6, 10, 15, 0.82);
  color: #dff3ff;
  padding: 6px 8px;
  font-size: 9px;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
}

html[data-theme="light"] .aso-competitor-screenshot-loading,
html[data-theme="light"] .step-graphics-grid.aso-competitor-screenshot-carousel .aso-competitor-media-frame {
  background: var(--surface-container-low);
}

.aso-app-movements--entries-2 {
  --aso-movement-key-column: min(40%, 170px);
}

.aso-app-movements--entries-3 {
  --aso-movement-key-column: min(31%, 128px);
}

.aso-app-movements--entries-4 {
  --aso-movement-key-column: clamp(56px, 24%, 88px);
}

.aso-app-movements--entries-5 {
  --aso-movement-key-column: clamp(52px, 22%, 78px);
}

.aso-app-movement-group {
  display: contents;
}

.aso-app-movement-group > strong {
  display: block;
  min-width: 0;
  max-width: 100%;
  color: var(--aso-dashboard-text);
  font-weight: 850;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-app-movement-list {
  display: flex;
  flex-wrap: nowrap;
  gap: 5px 8px;
  margin-top: -4px;
  min-width: 0;
  overflow: hidden;
  padding-top: 4px;
}

.page-aso-dashboard .aso-app-movements--entries-1 {
  --aso-movement-geo-columns: 1;
}

.page-aso-dashboard .aso-app-movements--entries-2 {
  --aso-movement-geo-columns: 2;
}

.page-aso-dashboard .aso-app-movements--entries-3 {
  --aso-movement-geo-columns: 3;
}

.page-aso-dashboard .aso-app-movements--entries-4 {
  --aso-movement-geo-columns: 4;
}

.page-aso-dashboard .aso-app-movement-list {
  display: grid;
  grid-template-columns: repeat(var(--aso-movement-geo-columns, 1), minmax(0, 1fr));
  column-gap: 8px;
}

.page-aso-dashboard .aso-app-movement-entry {
  min-width: 0;
}

.aso-app-movement-entry {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-right: 0;
  white-space: nowrap;
}

.aso-app-movement-entry--good {
  color: var(--aso-dashboard-good);
}

.aso-app-movement-entry--neutral {
  color: var(--aso-dashboard-muted);
}

.aso-app-movement-entry--no_positions {
  color: var(--aso-dashboard-muted);
}

.aso-app-movement-entry--bad {
  color: var(--aso-dashboard-bad);
}

.aso-app-movement-entry--lost {
  color: var(--aso-dashboard-bad);
  text-decoration: line-through;
  text-decoration-thickness: 1.5px;
  text-decoration-color: currentColor;
}

.aso-app-movement-empty {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  padding: 1px 0;
  font-size: 11px;
  font-weight: 800;
}

.aso-app-movement-flag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  color: inherit;
  font-size: 13px;
  line-height: 1;
}

.aso-app-movement-country {
  color: var(--aso-dashboard-position);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
}

.aso-appstore-country-link {
  cursor: pointer;
  text-decoration: none;
}

.aso-appstore-country-link:hover,
.aso-appstore-country-link:focus-visible {
  color: var(--m3-primary);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.aso-app-movement-position {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 0;
  border-radius: 0;
  color: var(--aso-dashboard-position);
  font-size: 12px;
  font-weight: 850;
  line-height: 1;
}

.aso-app-movement-position--top {
  background: transparent;
  color: var(--aso-dashboard-good-strong);
  padding: 0;
}

.aso-app-movement-entry--lost .aso-app-movement-country,
.aso-app-movement-entry--lost .aso-app-movement-position,
.aso-app-movement-entry--missing .aso-app-movement-country {
  background: transparent;
  color: inherit;
  padding: 0;
}

.aso-app-movement-plus {
  color: var(--aso-dashboard-good);
  font-size: 12px;
  font-weight: 950;
  line-height: 1;
}

.aso-app-movement-equals {
  color: var(--aso-dashboard-muted);
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
}

.aso-app-movement-entry .aso-position-delta {
  align-self: flex-start;
  font-size: 9px;
  font-weight: 650;
  line-height: 1;
  margin-left: -1px;
  transform: translateY(-0.42em);
}

.aso-app-movement-entry .aso-position-delta--up {
  color: var(--aso-dashboard-good);
}

.aso-app-movement-entry .aso-position-delta--down {
  color: var(--aso-dashboard-bad);
}

.aso-app-alerts {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 8px;
}

.aso-app-alert-badge {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 22px;
  border: 1px solid rgba(140, 146, 154, 0.18);
  border-radius: 7px;
  padding: 4px 7px;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 900;
  line-height: 1.15;
}

.aso-app-alert-badge span {
  white-space: normal;
  overflow-wrap: anywhere;
}

.aso-app-alert-badge--good {
  border-color: rgba(126, 228, 161, 0.34);
  background: rgba(126, 228, 161, 0.12);
  color: #7ee4a1;
}

.aso-app-alert-badge--bad {
  border-color: rgba(255, 116, 116, 0.34);
  background: rgba(255, 116, 116, 0.12);
  color: var(--danger);
}

.aso-app-alert-badge--p1 {
  box-shadow: inset 0 0 0 1px currentColor;
}

.aso-card-remove {
  position: static;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid rgba(140, 146, 154, 0.22);
  border-radius: 999px;
  background: rgba(140, 146, 154, 0.06);
  color: var(--aso-dashboard-muted);
  cursor: pointer;
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
}

.aso-card-remove:hover {
  border-color: rgba(255, 116, 116, 0.38);
  background: rgba(255, 116, 116, 0.10);
  color: var(--danger);
}

.aso-icon-btn:hover {
  border-color: var(--aso-dashboard-border);
  color: var(--aso-dashboard-text);
}

.aso-empty-dashboard,
.aso-worldwide-panel,
.aso-monitor-chart,
.aso-monitor-table-panel {
  border: 1px solid rgba(140, 146, 154, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.026);
  padding: 14px;
}

.aso-monitor-chart {
  margin-bottom: 12px;
}

.aso-monitor-chart.is-graph-hidden .aso-chart-legend,
.aso-monitor-chart.is-graph-hidden .aso-line-plot,
.aso-monitor-chart.is-graph-hidden > .hint {
  display: none;
}

.aso-monitor-chart-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 14px;
}

.aso-monitor-chart-controls {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 12px;
  flex-wrap: wrap;
}

.aso-graph-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  border: 0;
  background: transparent;
  color: var(--on-surface);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 850;
}

.aso-graph-toggle i {
  position: relative;
  display: inline-block;
  width: 42px;
  height: 24px;
  border: 1px solid rgba(158, 202, 255, 0.34);
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.20);
}

.aso-graph-toggle i::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #dbe9ff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
  transition: transform 140ms ease;
}

.aso-graph-toggle[aria-pressed="true"] i {
  border-color: rgba(85, 154, 255, 0.72);
  background: rgba(85, 154, 255, 0.72);
}

.aso-graph-toggle[aria-pressed="true"] i::after {
  transform: translateX(18px);
}

.aso-line-plot--wide .aso-line-canvas {
  height: 310px;
}

.aso-monitor-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.aso-monitor-toolbar--chart {
  flex: 1 1 420px;
  justify-content: flex-start;
  margin-bottom: 0;
}

.aso-monitor-toolbar label,
.aso-monitor-country-field {
  min-width: 260px;
}

.aso-monitor-country-picker .aso-dashboard-picker__panel {
  min-width: min(420px, calc(100vw - 36px));
}

.aso-monitor-country-option {
  grid-template-columns: minmax(0, 1fr) auto 28px;
  cursor: pointer;
}

.aso-monitor-country-option.is-favorite {
  order: -1;
  border-color: rgba(255, 201, 120, 0.24);
}

.aso-monitor-country-option.is-selected {
  border-color: rgba(158, 202, 255, 0.52);
  background: rgba(158, 202, 255, 0.10);
}

.aso-monitor-country-option .aso-dashboard-picker__meta span {
  min-width: 30px;
  text-align: center;
}

.aso-monitor-country-star {
  justify-self: end;
}

.aso-monitor-actions {
  display: flex;
  align-items: center;
  gap: 7px;
}

.page-aso-rank .aso-monitor-icon-btn {
  display: inline-grid;
  place-items: center;
  width: 42px;
  min-width: 42px;
  height: 42px;
  min-height: 42px;
  padding: 0;
  border-radius: 999px;
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
}

.page-aso-rank .aso-monitor-icon-btn.aso-add-key-btn {
  border-color: var(--m3-primary);
  background: var(--m3-primary);
  color: var(--m3-on-primary) !important;
  box-shadow: 0 8px 18px rgba(0, 106, 169, 0.20);
}

.page-aso-rank .aso-monitor-icon-btn.aso-add-key-btn:hover:not(:disabled),
.page-aso-rank .aso-monitor-icon-btn.aso-add-key-btn:focus-visible {
  border-color: color-mix(in srgb, var(--m3-primary) 88%, var(--m3-surface-container-lowest));
  background: color-mix(in srgb, var(--m3-primary) 88%, var(--m3-surface-container-lowest));
  color: var(--m3-on-primary) !important;
  box-shadow: 0 10px 24px rgba(0, 106, 169, 0.24);
}

.aso-new-key-panel--inline {
  display: flex;
  gap: 8px;
  align-items: center;
  margin: 0 0 10px;
}

.aso-new-key-panel--inline[hidden] {
  display: none;
}

.aso-new-key-panel--inline input {
  flex: 1 1 auto;
  min-width: 180px;
}

.aso-new-key-dialog {
  width: min(560px, calc(100vw - 28px));
  max-height: min(760px, calc(100vh - 40px));
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  padding: 0;
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.55);
}

.aso-new-key-dialog::backdrop {
  background: rgba(0, 0, 0, 0.58);
}

.aso-new-key-dialog form {
  display: grid;
  max-height: inherit;
}

.aso-new-key-dialog-body {
  display: grid;
  gap: 12px;
  overflow: auto;
  padding: 14px 16px;
}

.aso-new-key-dialog .aso-field {
  margin: 0;
}

.aso-new-key-dialog textarea {
  min-height: 82px;
  resize: vertical;
}

.aso-new-key-geo-head,
.aso-new-key-dialog-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.aso-new-key-geo-head > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.aso-new-key-geo-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.aso-new-key-geo-actions button {
  min-height: 28px;
  border: 1px solid var(--outline-variant);
  border-radius: 999px;
  background: var(--surface-container-high);
  color: var(--accent);
  cursor: pointer;
  font-size: 11px;
  font-weight: 850;
  padding: 0 10px;
}

.aso-new-key-country-list {
  display: grid;
  gap: 5px;
  max-height: 300px;
  overflow: auto;
  padding-right: 2px;
}

.aso-new-key-country-row {
  display: grid;
  grid-template-columns: 18px auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-height: 38px;
  border: 1px solid rgba(140, 146, 154, 0.18);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.02);
  cursor: pointer;
  padding: 7px 9px;
}

.aso-new-key-country-row:hover,
.aso-new-key-country-row:focus-within {
  border-color: rgba(158, 202, 255, 0.46);
  background: rgba(158, 202, 255, 0.08);
}

.aso-new-key-country-row span:last-child {
  display: grid;
  min-width: 0;
}

.aso-new-key-country-row strong,
.aso-new-key-country-row small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-new-key-country-row strong {
  color: var(--on-surface);
  font-size: 12px;
}

.aso-new-key-country-row small {
  color: var(--muted);
  font-size: 10px;
}

.aso-new-key-dialog-actions {
  border-top: 1px solid var(--outline-variant);
  padding: 12px 16px;
}

.aso-table--monitor,
.aso-table--worldwide {
  min-width: 980px;
}

.aso-table--worldwide {
  min-width: 1230px;
}

.aso-col-check,
.aso-col-icon-action,
.aso-col-toggle {
  width: 54px;
}

.aso-col-key-wide {
  width: 31%;
}

.aso-col-country-wide {
  width: 26%;
}

.aso-col-traffic,
.aso-col-position,
.aso-col-count {
  width: 110px;
}

.aso-col-spawn {
  width: 76px;
}

.aso-col-checked {
  width: 170px;
}

.aso-col-revenue {
  width: 112px;
}

.aso-table--worldwide .aso-col-compare {
  width: 86px;
}

.aso-table--worldwide.aso-table--has-compare .aso-col-position {
  width: 86px;
}

.aso-table--worldwide.aso-table--has-compare .aso-col-spawn,
.aso-table--worldwide.aso-table--has-compare .aso-spawn-head,
.aso-table--worldwide.aso-table--has-compare .aso-spawn-cell {
  display: none;
}

.aso-table--worldwide th,
.aso-table--worldwide td {
  padding-top: 1px;
  padding-bottom: 1px;
}

.aso-table--worldwide tbody td {
  border-bottom: 0;
}

.aso-table--worldwide tbody tr {
  box-shadow: inset 0 -1px 0 var(--outline-variant);
}

.aso-table--worldwide tbody tr:last-child {
  box-shadow: none;
}

.aso-table--worldwide td:nth-child(2) {
  display: table-cell;
  vertical-align: middle;
}

.aso-country-main {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  height: 16px;
}

.aso-country-main strong {
  min-width: 0;
  overflow: hidden;
  color: var(--on-surface);
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-country-flag {
  flex: 0 0 22px;
  width: 22px;
  font-size: 18px;
  line-height: 1;
  text-align: center;
}

.aso-table--worldwide td:nth-child(2) > span:not(.aso-country-main) {
  display: block;
  padding-left: 30px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-row-actions--compact {
  gap: 5px;
}

.aso-compact-actions {
  display: inline-grid;
  grid-template-rows: repeat(var(--aso-key-count, 1), minmax(0, 1fr));
  grid-auto-rows: minmax(0, 1fr);
  justify-items: center;
  align-items: stretch;
  height: 42px;
  min-width: 22px;
  overflow: hidden;
  border: 1px solid rgba(140, 146, 154, 0.30);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-container-high) 86%, var(--primary) 14%);
}

.aso-compact-actions form {
  display: inline-grid;
  place-items: center;
  width: 100%;
  margin: 0;
}

.aso-compact-actions > button,
.aso-compact-actions > form {
  width: 100%;
}

.aso-compact-actions > :not(:first-child) {
  border-top: 1px solid rgba(140, 146, 154, 0.24);
}

.aso-compact-actions .aso-icon-btn--mini {
  width: 22px;
  min-width: 22px;
  height: 100%;
  min-height: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  font-size: 11px;
}

.aso-compact-actions .aso-icon-btn--mini:hover:not(:disabled),
.aso-compact-actions .aso-icon-btn--mini:focus-visible:not(:disabled) {
  background: rgba(158, 202, 255, 0.12);
}

.aso-compact-actions .aso-icon-btn--mini.is-checked {
  background: rgba(126, 228, 161, 0.14);
  color: #7ee4a1;
}

.aso-compact-actions .aso-icon-btn--mini .aso-top-rank-icon {
  width: 10px;
  height: 10px;
}

.aso-compact-values {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: repeat(var(--aso-key-count, 1), minmax(0, 1fr));
  grid-auto-rows: minmax(0, 1fr);
  align-items: center;
  height: 42px;
  gap: 0;
  min-width: 0;
}

.aso-compact-values > span,
.aso-compact-values > time {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: var(--on-surface);
  font-size: 11px;
  font-weight: 750;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-compact-values--keys > span {
  max-width: 100%;
}

.aso-compact-values--position {
  justify-items: center;
}

.aso-compact-values--position > .aso-position-compact-metric {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 2px;
  position: relative;
  width: 100%;
  min-width: 0;
  overflow: visible;
  color: var(--on-surface);
  line-height: 1;
  white-space: nowrap;
}

.aso-compact-values--position > .aso-position-value,
.aso-compact-values--position > .aso-position-compact-metric > .aso-position-value {
  display: inline-flex;
  width: 28px;
  min-width: 28px;
  min-height: 13px;
  color: #171d38;
  font-size: 10.5px;
  font-weight: 850;
  padding: 0 3px;
}

.aso-compact-values--position > .aso-position-value--top,
.aso-compact-values--position > .aso-position-compact-metric > .aso-position-value--top {
  background: #84e6b7;
  color: #073328;
}

.aso-compact-values--position > .aso-position-value--lost,
.aso-compact-values--position > .aso-position-compact-metric--lost > .aso-position-value--lost {
  border: 0;
  background: transparent;
  color: var(--danger);
  text-decoration: line-through;
  text-decoration-color: currentColor;
  text-decoration-thickness: 1.5px;
}

.aso-compact-values--position > .aso-position-value--missing,
.aso-compact-values--position > .aso-position-value--pending,
.aso-compact-values--position > .aso-position-value--empty {
  border: 1px solid rgba(140, 146, 154, 0.24);
  background: color-mix(in srgb, var(--surface-container-high) 86%, var(--on-surface-variant) 14%);
  color: var(--on-surface);
}

.aso-compact-values--position > .aso-position-value--pending {
  color: var(--muted);
}

.aso-compact-values--position > .aso-position-compact-metric > .aso-position-delta {
  position: absolute;
  left: calc(50% + 17px);
  top: 50%;
  flex: 0 0 auto;
  font-size: 9px;
  font-weight: 850;
  transform: translateY(-50%);
}

.aso-compact-values--position > .aso-position-compact-metric > .aso-position-delta span {
  font-size: 7px;
}

.aso-row-outranks {
  background: color-mix(in srgb, #ffc978 8%, transparent);
}

.aso-row-outranks > td:first-child {
  box-shadow: inset 3px 0 0 rgba(255, 201, 120, 0.72);
}

.aso-position-metric {
  gap: 4px;
}

.aso-compare-badge {
  border: 1px solid rgba(158, 202, 255, 0.28);
  background: rgba(158, 202, 255, 0.10);
  color: #9ecaff;
}

.aso-compare-badge--outranks {
  border-color: rgba(255, 201, 120, 0.38);
  background: rgba(255, 201, 120, 0.14);
  color: #ffc978;
}

.aso-compare-column-head,
.aso-compare-column-cell {
  min-width: 86px;
  padding-right: 6px;
  padding-left: 6px;
  text-align: center;
}

.aso-compare-app-icon {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 9px;
  background: rgba(148, 163, 184, 0.14);
  overflow: hidden;
  vertical-align: middle;
}

.aso-compare-app-icon img,
.aso-compare-app-icon .aso-app-icon-fallback {
  width: 36px;
  height: 36px;
  border-radius: 9px;
}

.aso-compare-app-icon img {
  position: absolute;
  inset: 0;
  object-fit: cover;
  z-index: 1;
}

.aso-compare-app-icon .aso-app-icon-fallback {
  position: relative;
  z-index: 0;
}

.aso-position-column-head--app {
  text-align: center;
}

.aso-th-sort--app-icon {
  justify-content: center;
  min-height: 42px;
  padding: 0;
}

.aso-th-sort--app-icon i {
  display: none;
}

.aso-compare-position {
  display: inline-flex;
  justify-content: center;
  min-width: 48px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.10);
  color: var(--text);
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.2;
}

.aso-compare-position--outranked {
  border-color: rgba(255, 201, 120, 0.44);
  background: rgba(255, 201, 120, 0.16);
  color: #ffc978;
}

.aso-compare-position--empty {
  color: var(--muted);
  opacity: 0.72;
}

.aso-history-badge {
  border: 1px solid rgba(140, 146, 154, 0.24);
  background: rgba(140, 146, 154, 0.10);
  color: var(--muted);
}

.aso-history-badge--lost {
  border-color: rgba(255, 180, 171, 0.34);
  background: rgba(255, 180, 171, 0.12);
  color: #ffb4ab;
}

.aso-compact-values--position > .aso-position-compact-metric > .aso-compare-badge,
.aso-compact-values--position > .aso-position-compact-metric > .aso-history-badge {
  max-width: 76px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.aso-spawn-cell {
  text-align: center;
}

.aso-compact-values--spawn {
  justify-items: center;
}

.aso-compact-values--spawn > .aso-spawn-value {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  min-width: 34px;
  min-height: 16px;
  border: 1px solid rgba(140, 146, 154, 0.28);
  border-radius: 999px;
  background: rgba(140, 146, 154, 0.12);
  color: var(--on-surface);
  font-size: 10.5px;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
}

.aso-compact-values--spawn > .aso-spawn-value--empty {
  border-color: rgba(140, 146, 154, 0.18);
  background: transparent;
  color: var(--muted);
  font-weight: 750;
}

.aso-key-subsignals {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 3px;
}

.aso-compact-values--checked > time,
.aso-compact-values--checked > span {
  color: var(--muted);
  font-size: 10px;
}

.aso-revenue-cell {
  color: var(--on-surface);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  font-weight: 850;
  white-space: nowrap;
}

.aso-revenue-cell--positive {
  color: var(--success);
}

.aso-revenue-value,
.aso-revenue-clicks {
  display: block;
}

.aso-revenue-clicks {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9.5px;
  font-weight: 650;
  line-height: 1.1;
}

.aso-table-head-inline {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.aso-table-head-inline small {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: none;
  white-space: nowrap;
}

.aso-icon-btn {
  display: inline-grid;
  place-items: center;
  min-width: 30px;
  width: 30px;
  height: 30px;
  border: 1px solid rgba(140, 146, 154, 0.34);
  border-radius: 999px;
  background: transparent;
  color: var(--accent);
  cursor: pointer;
  font: inherit;
  font-size: 15px;
  font-weight: 900;
  line-height: 1;
}

.aso-icon-btn.is-checked {
  border-color: rgba(126, 228, 161, 0.44);
  background: rgba(126, 228, 161, 0.12);
  color: #7ee4a1;
}

.aso-icon-btn:disabled {
  cursor: default;
  opacity: 0.45;
}

.aso-icon-btn--mini {
  min-width: 24px;
  width: 24px;
  height: 24px;
  font-size: 12px;
}

.aso-icon-btn--mini .aso-top-rank-icon {
  width: 14px;
  height: 14px;
  gap: 2px;
}

.aso-icon-btn--mini .aso-top-rank-icon span {
  width: 3px;
}

.aso-top-rank-icon {
  display: inline-flex;
  align-items: flex-end;
  justify-content: center;
  gap: 3px;
  width: 18px;
  height: 18px;
  color: currentColor;
}

.aso-top-rank-icon span {
  display: block;
  width: 4px;
  border-radius: 999px 999px 2px 2px;
  background: currentColor;
}

.aso-top-rank-icon span:nth-child(1) {
  height: 8px;
}

.aso-top-rank-icon span:nth-child(2) {
  height: 15px;
}

.aso-top-rank-icon span:nth-child(3) {
  height: 11px;
}

.aso-th-sort .aso-top-rank-icon {
  width: 16px;
  height: 16px;
  gap: 2px;
}

.aso-th-sort .aso-top-rank-icon span {
  width: 3px;
}

.aso-th-sort .aso-top-rank-icon span:nth-child(1) {
  height: 7px;
}

.aso-th-sort .aso-top-rank-icon span:nth-child(2) {
  height: 13px;
}

.aso-th-sort .aso-top-rank-icon span:nth-child(3) {
  height: 10px;
}

.aso-worldwide-search {
  display: grid;
  grid-template-columns: minmax(280px, 520px) minmax(240px, 420px) minmax(86px, 1fr);
  gap: 10px;
  align-items: start;
  justify-content: stretch;
  margin: 0 0 12px;
}

.aso-worldwide-input {
  display: grid;
  gap: 5px;
  position: relative;
  margin: 0;
}

.aso-worldwide-priority-chips {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-end;
  gap: 5px;
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
  pointer-events: auto;
  letter-spacing: 0;
  text-transform: none;
}

.aso-worldwide-priority-chips::-webkit-scrollbar {
  display: none;
}

.aso-worldwide-priority-chips:empty {
  display: none;
}

.aso-worldwide-priority-chips button {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: 0 1 auto;
  min-width: 0;
  max-width: 154px;
  height: 24px;
  border: 1px solid rgba(255, 201, 120, 0.42);
  border-radius: 999px;
  background: rgba(255, 201, 120, 0.12);
  color: var(--on-surface);
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  overflow: hidden;
  padding: 0 8px;
  text-overflow: ellipsis;
  text-transform: none;
  white-space: nowrap;
}

.aso-worldwide-priority-chips button span {
  color: #ffc978;
  font-size: 13px;
  line-height: 1;
}

.aso-worldwide-input input,
.aso-worldwide-country-picker .aso-worldwide-country-button,
.page-aso-rank .aso-worldwide-submit {
  min-height: 38px;
  border-radius: 8px;
}

.aso-worldwide-input input,
.aso-worldwide-country-picker .aso-worldwide-country-button {
  border: 1px solid var(--outline-variant);
  background: var(--surface-container-high);
  color: var(--on-surface);
  box-shadow: none;
}

.aso-worldwide-input input {
  width: 100%;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 0;
}

.aso-worldwide-input input::placeholder {
  color: color-mix(in srgb, var(--on-surface-variant) 72%, transparent);
}

.aso-worldwide-input input:focus {
  outline: 2px solid var(--theme-focus-ring);
  border-color: var(--accent);
}

.aso-worldwide-keyword-panel {
  position: absolute;
  z-index: 46;
  top: calc(100% + 6px);
  right: 0;
  left: 0;
  display: grid;
  gap: 5px;
  max-height: 260px;
  overflow: auto;
  overscroll-behavior: contain;
  border: 1px solid rgba(140, 146, 154, 0.28);
  border-radius: 8px;
  background: var(--surface-container-highest, #1f232a);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.38);
  padding: 8px;
}

.aso-worldwide-keyword-panel[hidden] {
  display: none;
}

.aso-worldwide-keyword-option {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 30px;
  align-items: center;
  gap: 5px;
}

.aso-worldwide-keyword-check {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--accent);
  cursor: pointer;
  justify-self: center;
}

.aso-worldwide-keyword-option.is-selected [data-aso-worldwide-keyword-suggestion] {
  border-color: rgba(126, 228, 161, 0.42);
  background: rgba(126, 228, 161, 0.09);
}

.aso-worldwide-keyword-panel button {
  min-height: 34px;
  border: 1px solid rgba(140, 146, 154, 0.18);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.028);
  color: var(--on-surface);
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  overflow: hidden;
  padding: 0 10px;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-worldwide-keyword-panel .aso-worldwide-keyword-star {
  display: inline-grid;
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  border-radius: 999px;
  color: rgba(140, 146, 154, 0.72);
  font-size: 15px;
  padding: 0;
  place-items: center;
  text-align: center;
}

.aso-worldwide-keyword-panel .aso-worldwide-keyword-star.is-favorite {
  border-color: rgba(255, 201, 120, 0.72);
  background: rgba(255, 201, 120, 0.22);
  color: #ffc978;
}

.aso-worldwide-keyword-panel button:hover,
.aso-worldwide-keyword-panel button:focus {
  border-color: rgba(158, 202, 255, 0.50);
  background: rgba(158, 202, 255, 0.08);
  outline: none;
}

.aso-worldwide-keyword-empty {
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  padding: 7px 9px;
}

.aso-worldwide-country-field {
  min-width: 0;
}

.aso-worldwide-country-picker .aso-worldwide-country-button {
  padding: 0 10px;
  gap: 8px;
  overflow: hidden;
}

.aso-worldwide-country-picker .aso-worldwide-country-button:focus,
.aso-worldwide-country-picker .aso-worldwide-country-button:focus-visible {
  outline: 2px solid var(--theme-focus-ring);
  border-color: var(--accent);
}

.aso-worldwide-country-picker .aso-dashboard-picker__chevron {
  width: 8px;
  height: 8px;
  color: var(--on-surface);
  border-width: 1.5px;
}

.aso-worldwide-country-chips {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  overflow: hidden;
}

.aso-worldwide-country-placeholder,
.aso-worldwide-country-count {
  min-width: 0;
  overflow: hidden;
  color: var(--on-surface-variant);
  font-size: 13px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-worldwide-country-chip {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  height: 28px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--primary) 42%, var(--outline-variant));
  border-radius: 6px;
  background: color-mix(in srgb, var(--primary) 10%, var(--surface-container-highest));
  color: var(--on-surface);
}

.aso-worldwide-chip-flag {
  display: grid;
  place-items: center;
  width: 30px;
  height: 100%;
  overflow: hidden;
  font-size: 18px;
  line-height: 1;
}

.aso-worldwide-chip-remove {
  display: grid;
  place-items: center;
  width: 24px;
  height: 100%;
  border-left: 1px solid color-mix(in srgb, var(--primary) 42%, var(--outline-variant));
  color: var(--on-surface);
  cursor: pointer;
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
}

.aso-worldwide-chip-remove:hover {
  background: color-mix(in srgb, var(--primary) 14%, transparent);
}

.aso-worldwide-country-more {
  flex: 0 0 auto;
  color: var(--on-surface-variant);
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
}

.aso-worldwide-country-picker .aso-dashboard-picker__panel {
  min-width: min(460px, calc(100vw - 36px));
}

.aso-worldwide-actions {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  min-width: 0;
  width: 100%;
}

.page-aso-rank .aso-worldwide-submit {
  width: 38px;
  min-width: 38px;
  height: 38px;
  border-radius: 999px;
  justify-content: center;
  font-size: 0.9rem;
  font-weight: 650;
  letter-spacing: 0;
  padding: 0;
  box-shadow: none;
}

.page-aso-rank .aso-worldwide-submit:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.page-aso-rank .aso-worldwide-submit:hover:not(:disabled),
.page-aso-rank .aso-worldwide-submit:focus-visible {
  outline: 2px solid var(--theme-focus-ring);
  outline-offset: 2px;
}

.page-aso-rank .aso-worldwide-submit svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-aso-rank .aso-worldwide-refresh-btn {
  width: 38px;
  min-width: 38px;
  height: 38px;
  border-color: #b7d9ff;
  background: #8ec5ff;
  color: #08131f;
}

.page-aso-rank .aso-worldwide-refresh-btn:hover:not(:disabled),
.page-aso-rank .aso-worldwide-refresh-btn:focus-visible:not(:disabled) {
  border-color: #b7d9ff;
  background: #b7d9ff;
  outline: 2px solid var(--theme-focus-ring);
  outline-offset: 2px;
}

.page-aso-rank .aso-worldwide-refresh-btn svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-aso-rank .aso-worldwide-refresh-btn.is-loading svg {
  animation: factory-busy-spin 0.75s linear infinite;
}

.page-aso-rank .aso-worldwide-bulk-add-btn {
  margin-left: auto;
  width: 38px;
  min-width: 38px;
  height: 38px;
  border-color: #9ee6b4;
  background: #6fd68f;
  color: #07150c;
  font-size: 21px;
  font-weight: 900;
}

.page-aso-rank .aso-worldwide-bulk-add-btn:hover:not(:disabled),
.page-aso-rank .aso-worldwide-bulk-add-btn:focus-visible:not(:disabled) {
  border-color: #bff0ce;
  background: #9ee6b4;
  outline: 2px solid var(--theme-focus-ring);
  outline-offset: 2px;
}

.aso-worldwide-country-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) repeat(5, 32px);
  align-items: center;
  gap: 6px;
  margin-bottom: 7px;
}

.aso-worldwide-country-status {
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-worldwide-country-status[data-status-kind="ready"] {
  color: #5ee6a8;
}

.aso-worldwide-country-status[data-status-kind="error"] {
  color: #ff8f99;
}

.aso-worldwide-country-actions button {
  display: inline-grid;
  width: 32px;
  height: 30px;
  min-height: 30px;
  border: 1px solid rgba(158, 202, 255, 0.22);
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.08);
  color: var(--accent);
  cursor: pointer;
  font: inherit;
  padding: 0;
  place-items: center;
}

.aso-worldwide-country-actions button svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.85;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aso-worldwide-country-actions button:hover,
.aso-worldwide-country-actions button:focus-visible {
  border-color: rgba(158, 202, 255, 0.52);
  background: rgba(158, 202, 255, 0.13);
  outline: none;
}

.aso-worldwide-country-list {
  display: grid;
  gap: 5px;
  max-height: 340px;
  overflow: auto;
  overscroll-behavior: contain;
}

.aso-worldwide-country-option {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  min-height: 40px;
  border: 1px solid rgba(140, 146, 154, 0.18);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.028);
  color: var(--text);
  cursor: pointer;
  padding: 7px 8px;
}

.aso-worldwide-country-option:hover,
.aso-worldwide-country-option:focus-within {
  border-color: rgba(158, 202, 255, 0.45);
  background: rgba(158, 202, 255, 0.075);
}

.aso-worldwide-country-option input {
  flex: 0 0 auto;
  margin: 0;
  accent-color: var(--accent);
}

.aso-worldwide-country-option__text {
  display: grid;
  flex: 1 1 auto;
  min-width: 0;
}

.aso-worldwide-country-option__text strong,
.aso-worldwide-country-option__text small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-worldwide-country-option__text strong {
  color: var(--on-surface);
  font-size: 13px;
  line-height: 1.2;
}

.aso-worldwide-country-option__text small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

.aso-worldwide-country-star {
  flex: 0 0 auto;
  display: inline-grid;
  width: 28px;
  height: 28px;
  border: 1px solid rgba(140, 146, 154, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.035);
  color: rgba(140, 146, 154, 0.72);
  cursor: pointer;
  font: inherit;
  font-size: 15px;
  font-weight: 900;
  line-height: 1;
  padding: 0;
  place-items: center;
}

.aso-worldwide-country-star:not(.is-favorite):hover,
.aso-worldwide-country-star:not(.is-favorite):focus-visible {
  border-color: rgba(158, 202, 255, 0.42);
  background: rgba(158, 202, 255, 0.10);
  color: #9ecaff;
  outline: none;
}

.aso-worldwide-country-star.is-favorite {
  border-color: rgba(255, 201, 120, 0.72);
  background: rgba(255, 201, 120, 0.22);
  color: #ffc978;
  box-shadow: inset 0 0 0 1px rgba(255, 201, 120, 0.12);
}

.aso-worldwide-country-star.is-favorite:hover,
.aso-worldwide-country-star.is-favorite:focus-visible {
  border-color: rgba(255, 201, 120, 0.86);
  background: rgba(255, 201, 120, 0.28);
  color: #ffe0a3;
  outline: none;
}

.aso-worldwide-country-option.is-favorite {
  order: -1;
  border-color: rgba(255, 201, 120, 0.24);
}

.aso-worldwide-country-option.is-reordering,
.aso-monitor-country-option.is-reordering {
  position: relative;
  z-index: 2;
  transition: transform 240ms cubic-bezier(0.2, 0.8, 0.2, 1);
  will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
  .aso-worldwide-country-option.is-reordering,
  .aso-monitor-country-option.is-reordering {
    transition: none !important;
  }
}

.aso-table-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.aso-table-toolbar h2 {
  margin: 0;
  color: var(--on-surface);
  font-size: 22px;
  line-height: 1.15;
}

.aso-worldwide-live {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px 12px;
  align-items: center;
  max-height: 48px;
  min-height: 36px;
  margin: -2px 0 10px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity 220ms ease,
    transform 220ms ease,
    max-height 220ms ease,
    min-height 220ms ease,
    margin 220ms ease;
}

.aso-worldwide-live[hidden] {
  display: none;
}

.aso-worldwide-live.is-hiding {
  max-height: 0;
  min-height: 0;
  margin: 0;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-4px);
}

.aso-worldwide-live strong {
  color: var(--on-surface);
  font-variant-numeric: tabular-nums;
}

.aso-worldwide-progress {
  grid-column: 1 / -1;
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(140, 146, 154, 0.18);
}

.aso-worldwide-progress i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: var(--primary);
  transition: width 180ms ease;
}

.aso-table--worldwide tr.is-loading {
  color: var(--muted);
}

.aso-toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 1200;
  max-width: min(340px, calc(100vw - 36px));
  border: 1px solid rgba(140, 146, 154, 0.26);
  border-radius: 8px;
  background: rgba(31, 35, 42, 0.96);
  color: var(--on-surface);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.36);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.25;
  opacity: 0;
  padding: 10px 12px;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity 140ms ease, transform 140ms ease;
}

.aso-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.aso-toast[data-kind="error"] {
  border-color: rgba(255, 143, 153, 0.42);
}

.aso-segmented {
  padding: 3px;
  border: 1px solid rgba(140, 146, 154, 0.24);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.025);
}

.aso-segmented a {
  min-width: 78px;
  min-height: 30px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  text-decoration: none;
}

.aso-segmented a.is-active {
  background: var(--primary);
  color: #071018;
}

.aso-empty-copy {
  margin: 4px 0 0;
}

.aso-top-dialog {
  width: min(1060px, calc(100vw - 28px));
  max-height: min(760px, calc(100vh - 40px));
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  padding: 0;
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.55);
}

.aso-top-dialog::backdrop {
  background: rgba(0, 0, 0, 0.58);
}

.aso-top-dialog-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--outline-variant);
}

.aso-top-dialog-head h2 {
  min-width: 0;
  margin: 0;
  color: var(--on-surface);
  font-size: 18px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-top-dialog-actions {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 10px;
}

.aso-top-search-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--on-surface);
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}

.aso-top-search-toggle input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.aso-top-search-toggle span {
  position: relative;
  display: inline-block;
  width: 42px;
  height: 24px;
  border: 1px solid var(--outline-variant);
  border-radius: 999px;
  background: color-mix(in srgb, var(--primary) 20%, var(--surface-container-highest, #2d343c));
  transition: background 0.18s ease, border-color 0.18s ease;
}

.aso-top-search-toggle span::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--surface);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
  transition: transform 0.18s ease, background 0.18s ease;
}

.aso-top-search-toggle input:checked + span {
  border-color: color-mix(in srgb, var(--primary) 76%, #ffffff);
  background: var(--primary);
}

.aso-top-search-toggle input:checked + span::after {
  transform: translateX(18px);
  background: #ffffff;
}

.aso-top-dialog-body {
  display: grid;
  gap: 0;
  max-height: calc(min(760px, 100vh - 40px) - 58px);
  overflow: auto;
}

.aso-top-dialog-body--list {
  padding: 8px;
}

.aso-top-item {
  display: grid;
  grid-template-columns: 46px 38px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 54px;
  border-bottom: 1px solid rgba(140, 146, 154, 0.16);
  padding: 8px;
}

.aso-top-item:last-child {
  border-bottom: 0;
}

.aso-top-item--current {
  border-radius: 8px;
  background: color-mix(in srgb, var(--primary) 12%, transparent);
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--primary) 78%, #ffffff);
}

.aso-top-item--competitor {
  border-radius: 8px;
  background: rgba(255, 201, 120, 0.08);
  box-shadow: inset 0 0 0 1px rgba(255, 201, 120, 0.32);
}

.aso-top-item--current.aso-top-item--competitor {
  box-shadow:
    inset 0 0 0 2px color-mix(in srgb, var(--primary) 78%, #ffffff),
    inset 0 0 0 4px rgba(255, 201, 120, 0.30);
}

.aso-top-item > strong {
  color: var(--muted);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.aso-top-item img,
.aso-top-item .aso-app-icon-fallback {
  width: 36px;
  height: 36px;
  border-radius: 8px;
}

.aso-top-item-text {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.aso-top-item-text b,
.aso-top-item-text small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-top-item-text b {
  color: var(--on-surface);
  font-size: 13px;
}

.aso-top-item-text small {
  color: var(--muted);
  font-size: 11px;
}

.aso-top-item-actions {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.aso-top-competitor-badge {
  display: inline-flex;
  align-items: center;
  width: max-content;
  max-width: 100%;
  overflow: hidden;
  border: 1px solid rgba(255, 201, 120, 0.38);
  border-radius: 999px;
  background: rgba(255, 201, 120, 0.12);
  color: #ffc978;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  min-height: 18px;
  padding: 3px 7px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-top-competitor-action {
  white-space: nowrap;
}

.aso-top-competitor-action.is-added {
  border-color: rgba(255, 201, 120, 0.36);
  background: rgba(255, 201, 120, 0.10);
  color: #ffc978;
}

.aso-top-competitor-dialog {
  width: min(720px, calc(100vw - 28px));
}

.aso-top-competitor-dialog .aso-modal-body {
  max-height: calc(min(760px, 100vh - 40px) - 58px);
  overflow: auto;
}

.aso-top-competitor-form {
  display: grid;
  gap: 12px;
}

.aso-top-competitor-app {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  border: 1px solid rgba(140, 146, 154, 0.22);
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface-container-highest, #232a32) 58%, transparent);
  padding: 10px;
}

.aso-top-competitor-app img,
.aso-top-competitor-app .aso-app-icon-fallback {
  grid-column: 1;
  grid-row: 1;
  width: 44px;
  height: 44px;
  border-radius: 10px;
}

.aso-top-competitor-app span:last-child {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.aso-top-competitor-app strong,
.aso-top-competitor-app small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-top-competitor-app strong {
  color: var(--on-surface);
  font-size: 15px;
  font-weight: 900;
}

.aso-top-competitor-app small {
  color: var(--muted);
  font-size: 12px;
}

.aso-top-competitor-screens {
  --aso-top-competitor-media-height: 220px;
  display: flex;
  gap: 10px;
  min-width: 0;
  overflow-x: auto;
  padding: 2px 2px 8px;
  scrollbar-width: thin;
}

.aso-top-competitor-screens[hidden] {
  display: none;
}

.aso-top-competitor-screens img {
  flex: 0 0 auto;
  width: 112px;
  height: var(--aso-top-competitor-media-height);
  object-fit: cover;
  border: 1px solid rgba(140, 146, 154, 0.24);
  border-radius: 10px;
  background: color-mix(in srgb, var(--surface-container-highest, #232a32) 66%, transparent);
}

.aso-top-competitor-media-item {
  --aso-media-ratio: 0.509;
  position: relative;
  flex: 0 0 auto;
  width: min(calc(var(--aso-top-competitor-media-height) * var(--aso-media-ratio)), 420px);
  height: var(--aso-top-competitor-media-height);
  overflow: hidden;
  border: 1px solid rgba(140, 146, 154, 0.24);
  border-radius: 10px;
  background: #0d1218;
}

.aso-top-competitor-media-item video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.aso-top-competitor-availability {
  display: grid;
  gap: 6px;
  min-width: 0;
  border: 1px solid rgba(140, 146, 154, 0.22);
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface-container-highest, #232a32) 42%, transparent);
  padding: 10px;
}

.aso-top-competitor-availability > span,
.aso-top-competitor-keywords > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.aso-top-competitor-availability strong {
  color: var(--on-surface);
  font-size: 13px;
  font-weight: 900;
}

.aso-top-competitor-availability strong.is-error {
  color: var(--danger, #ff8b8b);
}

.aso-top-competitor-availability div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.aso-top-competitor-availability div:empty {
  display: none;
}

.aso-top-competitor-availability div span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  border: 1px solid rgba(154, 197, 255, 0.28);
  border-radius: 999px;
  background: rgba(154, 197, 255, 0.10);
  color: var(--accent-strong, #9ac5ff);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  padding: 4px 8px;
}

.aso-top-competitor-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.aso-top-competitor-fields label,
.aso-top-competitor-form > label {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.aso-top-competitor-fields label:last-child {
  grid-column: 1 / -1;
}

.aso-top-competitor-fields span,
.aso-top-competitor-form > label > span,
.aso-top-competitor-form .aso-dashboard-picker-field > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.aso-top-competitor-fields input,
.aso-top-competitor-fields textarea,
.aso-top-competitor-form > label select {
  width: 100%;
}

.aso-top-competitor-fields textarea {
  min-height: 88px;
  resize: vertical;
}

.aso-top-competitor-keywords {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.aso-top-competitor-keywords textarea {
  width: 100%;
  min-height: 118px;
  resize: vertical;
}

.aso-top-competitor-status {
  min-height: 18px;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}

.aso-top-competitor-status.is-error {
  color: var(--danger, #ff8b8b);
}

.aso-top-dialog-body--search {
  padding: 18px;
}

.aso-top-search-category {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  margin-bottom: 16px;
  color: var(--on-surface);
}

.aso-top-search-category span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--primary) 82%, #c95cff);
  color: #ffffff;
  font-size: 11px;
  font-weight: 900;
}

.aso-top-search-category b {
  color: var(--primary);
  font-size: 16px;
}

.aso-top-search-category small {
  color: var(--text);
  font-size: 15px;
}

.aso-top-search-category em {
  display: inline-block;
  max-width: 220px;
  overflow: hidden;
  border-radius: 4px;
  background: color-mix(in srgb, var(--primary) 13%, transparent);
  color: var(--on-surface);
  font-size: 13px;
  font-style: normal;
  padding: 4px 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-top-search-results {
  display: grid;
  gap: 16px;
}

.aso-top-search-card {
  display: grid;
  gap: 14px;
  border-bottom: 1px solid rgba(140, 146, 154, 0.18);
  padding: 0 0 16px;
}

.aso-top-search-card:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.aso-top-search-card--current {
  border-radius: 8px;
  background: color-mix(in srgb, var(--primary) 10%, transparent);
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--primary) 70%, #ffffff);
  padding: 12px;
}

.aso-top-search-card--competitor {
  border-radius: 8px;
  background: rgba(255, 201, 120, 0.075);
  box-shadow: inset 0 0 0 1px rgba(255, 201, 120, 0.30);
  padding: 12px;
}

.aso-top-search-card--current.aso-top-search-card--competitor {
  box-shadow:
    inset 0 0 0 2px color-mix(in srgb, var(--primary) 70%, #ffffff),
    inset 0 0 0 4px rgba(255, 201, 120, 0.28);
}

.aso-top-search-card-head {
  display: grid;
  grid-template-columns: 42px 96px minmax(0, 1fr) minmax(128px, auto);
  gap: 14px;
  align-items: center;
}

.aso-top-search-rank {
  color: var(--on-surface);
  font-size: 18px;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.aso-top-search-icon,
.aso-top-search-card-head .aso-app-icon-fallback {
  width: 96px;
  height: 96px;
  border-radius: 18px;
}

.aso-top-search-title {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.aso-top-search-title b,
.aso-top-search-title small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-top-search-title b {
  color: var(--on-surface);
  font-size: 19px;
  line-height: 1.15;
}

.aso-top-search-title small {
  color: var(--muted);
  font-size: 13px;
}

.aso-top-search-action {
  justify-self: end;
  min-width: 104px;
  text-align: center;
  text-transform: uppercase;
}

.aso-top-search-actions {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.aso-top-search-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  border-top: 1px solid rgba(140, 146, 154, 0.18);
  border-bottom: 1px solid rgba(140, 146, 154, 0.18);
}

.aso-top-search-metric {
  display: grid;
  align-content: center;
  justify-items: center;
  min-height: 78px;
  min-width: 0;
  gap: 4px;
  border-right: 1px solid rgba(140, 146, 154, 0.18);
  color: var(--muted);
  padding: 10px;
  text-align: center;
}

.aso-top-search-metric:last-child {
  border-right: 0;
}

.aso-top-search-metric small,
.aso-top-search-metric em {
  max-width: 100%;
  overflow: hidden;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.aso-top-search-metric b {
  max-width: 100%;
  overflow: hidden;
  color: var(--on-surface);
  font-size: 24px;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aso-top-search-metric em {
  color: var(--muted);
  text-transform: none;
}

.aso-top-stars {
  position: relative;
  display: block;
  width: 82px;
  height: 16px;
  overflow: hidden;
  color: color-mix(in srgb, var(--muted) 34%, transparent);
  font-size: 15px;
  letter-spacing: 0;
  line-height: 1;
}

.aso-top-stars::before,
.aso-top-stars::after {
  content: "★★★★★";
  position: absolute;
  top: 0;
  left: 0;
}

.aso-top-stars::after {
  width: var(--rating-width, 0%);
  overflow: hidden;
  color: #f5b942;
}

.aso-top-search-screens {
  --aso-top-media-height: clamp(220px, 34vw, 340px);
  display: flex;
  align-items: stretch;
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 2px;
}

.aso-top-search-screens img {
  width: auto;
  height: var(--aso-top-media-height);
  max-width: min(640px, 82vw);
  flex: 0 0 auto;
  border: 1px solid rgba(140, 146, 154, 0.22);
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface) 82%, #ffffff);
  object-fit: contain;
}

.aso-top-media-item {
  --aso-media-ratio: 0.5625;
  position: relative;
  width: min(calc(var(--aso-top-media-height) * var(--aso-media-ratio)), min(640px, 82vw));
  height: var(--aso-top-media-height);
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid rgba(140, 146, 154, 0.22);
  border-radius: 8px;
  background: #0d1218;
}

.aso-top-media-item video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.aso-top-search-description {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: var(--text);
  font-size: 13px;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

@media (max-width: 900px) {
  .aso-dashboard-head,
  .aso-detail-head,
  .aso-table-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .aso-dashboard-head-main--with-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .aso-dashboard-hero-actions {
    flex-wrap: wrap;
    justify-content: flex-start;
    min-width: 0;
  }

  .aso-card-position-toggle,
  .aso-dashboard-hero-action {
    flex: 1 1 160px;
    min-width: 0;
    justify-content: center;
  }

  .aso-detail-actions,
  .aso-app-switch-field {
    align-items: stretch;
    width: 100%;
  }

  .aso-dashboard-add form,
  .aso-worldwide-search {
    grid-template-columns: 1fr;
  }

  .aso-dashboard-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .aso-dashboard-legend-item {
    flex: 1 1 180px;
  }

  .aso-dashboard-unit-tabs {
    flex-wrap: nowrap;
    margin-right: -18px;
    margin-left: -18px;
    overflow-x: auto;
    padding: 0 18px 2px;
    scrollbar-width: none;
  }

  .aso-dashboard-unit-tabs::-webkit-scrollbar {
    display: none;
  }

  .aso-dashboard-unit-tab {
    flex: 0 0 auto;
    max-width: 190px;
  }

  .aso-dashboard-brand-tabs {
    flex-wrap: nowrap;
    margin-right: -18px;
    margin-left: -18px;
    overflow-x: auto;
    padding: 0 18px 2px;
    scrollbar-width: none;
  }

  .aso-dashboard-brand-tabs::-webkit-scrollbar {
    display: none;
  }

  .aso-dashboard-brand-tab {
    flex: 0 0 auto;
    max-width: 220px;
  }

  .aso-dashboard-summary-item {
    min-width: 0;
  }

  .aso-dashboard-section-head {
    align-items: flex-start;
  }

  .page-aso-competitors .aso-dashboard-sections--competitors .aso-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .page-aso-competitors .aso-app-card--competitor {
    min-height: 0;
    border-radius: 8px;
    padding: 0 14px 13px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-app-card-head {
    grid-template-columns: 48px minmax(0, 1fr);
    grid-template-areas:
      "icon title"
      "icon meta"
      "actions actions"
      "primary primary";
    min-height: 0;
    margin: 0 -14px 10px;
    padding: 12px 10px 10px 14px;
    column-gap: 10px;
    row-gap: 8px;
  }

  .aso-competitor-card-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .aso-competitor-requests__head {
    align-items: stretch;
    flex-direction: column;
  }

  .aso-competitor-request-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .aso-competitor-request-kpi:first-child {
    grid-column: 1 / -1;
  }

  .aso-competitor-request-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .aso-competitor-request-filter--search,
  .aso-competitor-request-filters > button {
    grid-column: 1 / -1;
  }

  .aso-competitor-mail-grid,
  .aso-competitor-mail-picker-list,
  .aso-competitor-requests-layout {
    grid-template-columns: 1fr;
  }

  .aso-competitor-request-card header,
  .aso-competitor-ban-history-item,
  .aso-competitor-request-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .aso-competitor-request-status-form select {
    width: 100%;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-app-card-icon-link,
  .page-aso-competitors .aso-app-card--competitor .aso-app-card-icon img,
  .page-aso-competitors .aso-app-card--competitor .aso-app-icon-fallback {
    width: 48px;
    height: 48px;
    border-radius: 10px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-app-card-text {
    padding-top: 1px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-app-card-text strong {
    font-size: 15px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-run-id-pill {
    min-height: 20px;
    padding: 2px 7px;
    font-size: 11px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-app-card-inline-meta {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%;
    gap: 4px 8px;
    font-size: 11px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-analysis-pill {
    min-height: 19px;
    padding: 2px 7px;
    font-size: 10.5px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-card-actions {
    justify-self: start;
    flex-wrap: wrap;
    gap: 5px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-card-action-group {
    gap: 5px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-card-actions a.aso-card-copy,
  .page-aso-competitors .aso-app-card--competitor .aso-card-actions button {
    flex-basis: 34px;
    width: 34px;
    min-width: 34px;
    height: 34px;
    min-height: 34px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-card-actions svg {
    width: 15px;
    height: 15px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-card-actions .aso-card-webview-toggle {
    font-size: 11px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-app-card-primary-status {
    flex-direction: row-reverse;
    align-items: center;
    justify-content: flex-end;
    justify-self: start;
    gap: 6px;
    min-width: 0;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-competitor-source-tags {
    justify-content: flex-start;
    max-width: 100%;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-asa-card-badge {
    min-height: 24px;
    padding: 4px 10px;
    font-size: 11px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-asa-card-badge::before {
    margin-right: 5px;
    font-size: 13px;
  }

  .page-aso-detail .aso-detail-source-tag-toggle {
    min-height: 44px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-app-card-primary-status .aso-live-pill {
    min-height: 25px;
    padding: 4px 8px;
    font-size: 11px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-app-card-primary-status .aso-live-pill span {
    gap: 6px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-app-card-primary-status .aso-live-pill span::before {
    width: 7px;
    height: 7px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-app-card-primary-status .aso-live-pill--action svg {
    width: 12px;
    height: 12px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-app-movements {
    --aso-movement-key-column: 96px;
    row-gap: 9px;
  }

  .page-aso-competitors .aso-app-card--competitor .aso-app-movement-list {
    flex-wrap: wrap;
    overflow: visible;
  }

  .aso-competitor-discovery__head,
  .aso-competitor-discovery__panel-head--queue {
    align-items: stretch;
    flex-direction: column;
  }

  .aso-competitor-discovery__stats {
    justify-content: flex-start;
  }

  .aso-competitor-discovery__head-actions {
    justify-items: stretch;
    min-width: 0;
  }

  .aso-competitor-discovery__new-search {
    justify-content: center;
    width: 100%;
  }

  .aso-competitor-discovery__layout,
  .aso-competitor-discovery-finding__evidence {
    grid-template-columns: 1fr;
  }

  .aso-competitor-discovery-run {
    grid-template-columns: 1fr;
  }

  .aso-dashboard-picker__option {
    grid-template-columns: 1fr;
  }

  .aso-dashboard-picker__meta {
    justify-content: flex-start;
  }

  .aso-modal {
    width: min(640px, calc(100vw - 20px));
    max-height: calc(100vh - 24px);
  }

  .aso-modal-actions .btn {
    flex: 1 1 140px;
  }

  .aso-top-competitor-fields {
    grid-template-columns: 1fr;
  }

  .aso-top-competitor-app strong,
  .aso-top-competitor-app small {
    white-space: normal;
  }

  .aso-monitor-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .aso-monitor-chart-head {
    align-items: stretch;
    flex-direction: column;
  }

  .aso-top-dialog-head {
    align-items: flex-start;
  }

  .aso-top-dialog-actions {
    align-items: flex-end;
    flex-direction: column-reverse;
  }

  .aso-top-dialog-body--search {
    padding: 12px;
  }

  .aso-top-item {
    grid-template-columns: 34px 38px minmax(0, 1fr);
  }

  .aso-top-item-actions {
    grid-column: 2 / -1;
    justify-content: flex-start;
  }

  .aso-top-search-category {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .aso-top-search-card-head {
    grid-template-columns: 32px 72px minmax(0, 1fr);
  }

  .aso-top-search-actions {
    grid-column: 2 / -1;
    justify-content: flex-start;
  }

  .aso-top-search-icon,
  .aso-top-search-card-head .aso-app-icon-fallback {
    width: 72px;
    height: 72px;
    border-radius: 14px;
  }

  .aso-top-search-title b {
    font-size: 16px;
  }

  .aso-top-search-action {
    grid-column: 3;
    justify-self: start;
  }

  .aso-top-search-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .aso-top-search-metric {
    border-bottom: 1px solid rgba(140, 146, 154, 0.18);
  }

  .aso-top-search-metric:nth-child(2n) {
    border-right: 0;
  }

  .aso-top-search-metric:last-child {
    border-bottom: 0;
  }

  .aso-top-search-screens {
    --aso-top-media-height: clamp(180px, 58vw, 260px);
  }

  .aso-top-search-screens img {
    max-width: 86vw;
  }

  .aso-monitor-toolbar--chart {
    flex: none;
  }

  .aso-monitor-chart-controls {
    justify-content: flex-start;
  }

  .aso-monitor-toolbar label,
  .aso-monitor-country-field {
    min-width: 0;
  }
}

/* Theme controls and legacy color normalization */
.theme-switcher {
  display: inline-grid;
  grid-template-columns: repeat(3, 2.1rem);
  align-items: center;
  gap: 0.15rem;
  padding: 0.18rem;
  border: 1px solid var(--theme-nav-border);
  border-radius: var(--shape-pill, 999px);
  background: var(--theme-nav-bg);
  box-shadow: var(--elevation-1, none);
}

.theme-option {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.1rem;
  height: 2.1rem;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
}

.theme-option svg {
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.theme-option[data-theme-option="dark"] svg {
  width: 1.18rem;
  height: 1.18rem;
  transform: translate(-1px, 1px);
  stroke-width: 2.2;
}

.theme-option:hover,
.theme-option:focus-visible {
  color: var(--fg);
  background: var(--theme-nav-hover-bg);
  outline: none;
}

.theme-option.is-active,
.theme-option[aria-pressed="true"] {
  color: var(--theme-active-fg);
  border-color: var(--theme-active-border);
  background: var(--theme-active-bg);
}

.theme-option:focus-visible {
  box-shadow: 0 0 0 3px var(--theme-focus-ring);
}

.login-card,
.form-apple-account .fieldset,
.apple-apps-popover-surface {
  background: var(--theme-card-bg);
}

.form input,
.form textarea,
.form select,
.login-form input,
.apps-filter-date,
.apple-filter-bar input,
.apple-filter-bar select,
.apple-mini-form input,
.apple-mini-form select,
.apple-cell-select,
.apple-booking-date-input,
.apple-multi-filter summary,
.form-apple-account input,
.form-apple-account select,
.form-apple-account textarea,
.admin-table-input,
.admin-table-select {
  background: var(--theme-control-bg);
  color: var(--fg);
}

.login-form input {
  background: var(--theme-control-bg-strong);
}

.apps-filter-date:hover,
.apps-filter-date:focus,
.apple-cell-button:hover,
.apple-cell-button:focus-visible,
.apple-icon-button:hover,
.apple-icon-button:focus-visible {
  background: var(--theme-control-hover-bg);
}

.apple-cell-select option,
.apple-filter-bar select option,
.apple-mini-form select option {
  background: var(--theme-control-bg);
  color: var(--fg);
}

.apps-filter-date,
.apple-filter-bar input,
.apple-filter-bar select,
.apple-mini-form input,
.apple-mini-form select,
.apple-cell-select,
.apple-booking-date-input,
.form-apple-account input,
.form-apple-account select,
.form-apple-account textarea {
  color-scheme: dark;
}

html[data-theme="light"] .apps-filter-date,
html[data-theme="light"] .apple-filter-bar input,
html[data-theme="light"] .apple-filter-bar select,
html[data-theme="light"] .apple-mini-form input,
html[data-theme="light"] .apple-mini-form select,
html[data-theme="light"] .apple-cell-select,
html[data-theme="light"] .apple-booking-date-input,
html[data-theme="light"] .form-apple-account input,
html[data-theme="light"] .form-apple-account select,
html[data-theme="light"] .form-apple-account textarea {
  color-scheme: light;
}

.apps-table--grouped tbody tr.apps-account-header > th {
  background: var(--surface-container-low);
}

.apple-name-chip,
.apple-count-pill,
.apple-block-toggle {
  background: color-mix(in srgb, var(--outline-variant) 24%, transparent);
  color: var(--fg);
}

.apple-apps-popover-email {
  color: var(--fg);
}

html[data-theme="light"] .apple-external-app-account,
html[data-theme="light"] .apple-external-app-result {
  background: color-mix(in srgb, var(--theme-control-bg) 82%, transparent);
}

html[data-theme="light"] .apple-unit-entity-chip.is-active {
  background: color-mix(in srgb, var(--m3-primary) 12%, transparent);
  color: var(--m3-primary);
}

html[data-theme="light"] .apple-status-summary-item {
  border-color: rgba(71, 85, 105, 0.28);
  background: #ffffff;
  box-shadow: none;
}

html[data-theme="light"] .apple-status-summary-item span {
  color: #526071;
}

html[data-theme="light"] .apple-status-summary-item strong {
  color: #111827;
}

html[data-theme="light"] .apple-status-summary-item--free {
  --apple-status-active-rgb: 14, 125, 58;
}

html[data-theme="light"] .apple-status-summary-item--booked,
html[data-theme="light"] .apple-status-summary-item--reserved {
  --apple-status-active-rgb: 15, 103, 177;
}

html[data-theme="light"] .apple-status-summary-item--resetup {
  --apple-status-active-rgb: 71, 85, 105;
}

html[data-theme="light"] .apple-status-summary-item--blocked {
  --apple-status-active-rgb: 185, 28, 45;
}

html[data-theme="light"] .apple-status-summary-item:not(.apple-status-summary-item--active):hover,
html[data-theme="light"] .apple-status-summary-item:not(.apple-status-summary-item--active):focus-visible {
  border-color: rgba(var(--apple-status-active-rgb, 71, 85, 105), 0.62);
  background: rgba(var(--apple-status-active-rgb, 71, 85, 105), 0.07);
}

html[data-theme="light"] .apple-status-summary-item--active {
  border-color: rgb(var(--apple-status-active-rgb, 71, 85, 105));
  background: rgb(var(--apple-status-active-rgb, 71, 85, 105));
  box-shadow:
    0 0 0 2px rgba(var(--apple-status-active-rgb, 71, 85, 105), 0.2),
    0 5px 14px rgba(18, 28, 45, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

html[data-theme="light"] .apple-status-summary-item--active:hover,
html[data-theme="light"] .apple-status-summary-item--active:focus-visible {
  border-color: rgb(var(--apple-status-active-rgb, 71, 85, 105));
  background: rgb(var(--apple-status-active-rgb, 71, 85, 105));
  box-shadow:
    0 0 0 3px rgba(var(--apple-status-active-rgb, 71, 85, 105), 0.24),
    0 6px 16px rgba(18, 28, 45, 0.22);
}

html[data-theme="light"] .apple-status-summary-item--active span,
html[data-theme="light"] .apple-status-summary-item--active strong {
  color: #ffffff;
}

html[data-theme="light"] .apple-status-select--free,
html[data-theme="light"] .apple-phone-expiry-value--ok,
html[data-theme="light"] .apple-status-value--ok,
html[data-theme="light"] .pill--success {
  color: var(--success);
}

html[data-theme="light"] .apple-status-select--booked,
html[data-theme="light"] .apple-status-select--reserved {
  color: var(--m3-primary);
}

html[data-theme="light"] .apple-unit-select--assigned {
  border-color: hsl(var(--unit-hue), 58%, 58%);
  background:
    linear-gradient(0deg, hsla(var(--unit-hue), 76%, 92%, 0.88), hsla(var(--unit-hue), 76%, 92%, 0.88)),
    var(--theme-control-bg);
  color: hsl(var(--unit-hue), 64%, 24%);
}

html[data-theme="light"] .aso-modal::backdrop,
html[data-theme="light"] .aso-top-dialog::backdrop {
  background: rgba(15, 23, 42, 0.36);
}

@media (max-width: 760px) {
  .top-actions {
    gap: 0.35rem;
  }

  .logout-form {
    gap: 0.25rem;
  }

  .current-user {
    display: none;
  }

  .theme-switcher {
    grid-template-columns: repeat(3, 1.95rem);
  }

  .theme-option {
    width: 1.95rem;
    height: 1.95rem;
  }
}

/* Light theme: legacy dark surfaces on operator pages */
html[data-theme="light"] .apps-filter-bar,
html[data-theme="light"] .analytics-date-filter,
html[data-theme="light"] .analytics-tabs,
html[data-theme="light"] .portfolio-board-filters-wrap {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .apps-filter-menu summary,
html[data-theme="light"] .apps-filter-menu-panel,
html[data-theme="light"] .portfolio-filter-drop summary,
html[data-theme="light"] .portfolio-filter-body,
html[data-theme="light"] .analytics-date-range-form input[type="date"] {
  border-color: var(--outline-variant);
  background: var(--theme-control-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .apps-filter-menu-option,
html[data-theme="light"] .portfolio-filter-row {
  color: var(--on-surface);
}

html[data-theme="light"] .apps-filter-menu-option:hover,
html[data-theme="light"] .apps-filter-menu-option:focus-visible,
html[data-theme="light"] .portfolio-filter-row:hover,
html[data-theme="light"] .apple-filter-option:hover {
  background: rgba(0, 106, 169, 0.08);
}

html[data-theme="light"] .apps-filter-menu-option.is-active,
html[data-theme="light"] .analytics-tab.is-active,
html[data-theme="light"] .analytics-date-preset.is-active,
html[data-theme="light"] .portfolio-filter-drop--active > summary {
  color: var(--theme-active-fg);
  border-color: var(--theme-active-border);
  background: var(--theme-active-bg);
}

html[data-theme="light"] .analytics-kpi,
html[data-theme="light"] .analytics-card {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .analytics-kpi {
  background:
    radial-gradient(circle at 88% 16%, hsl(var(--kpi-hue), 70%, 62%, 0.16), transparent 34%),
    linear-gradient(180deg, hsl(var(--kpi-hue), 72%, 96%) 0%, var(--theme-card-bg) 100%);
  border-color: hsl(var(--kpi-hue), 54%, 76%);
}

html[data-theme="light"] .analytics-kpi-icon {
  background: hsl(var(--kpi-hue), 72%, 90%);
  color: hsl(var(--kpi-hue), 64%, 28%);
  box-shadow: inset 0 0 0 1px hsl(var(--kpi-hue), 54%, 76%);
}

html[data-theme="light"] .analytics-kpi-label,
html[data-theme="light"] .analytics-line-y-axis span,
html[data-theme="light"] .analytics-stacked-label {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .analytics-kpi strong {
  color: var(--on-surface);
}

html[data-theme="light"] .analytics-kpi--success strong,
html[data-theme="light"] .analytics-unit-metric--success strong {
  color: var(--success);
}

html[data-theme="light"] .analytics-tab:hover,
html[data-theme="light"] .analytics-tab:focus-visible,
html[data-theme="light"] .analytics-date-preset:hover,
html[data-theme="light"] .analytics-date-preset:focus-visible {
  color: var(--on-surface);
  border-color: var(--outline-variant);
  background: rgba(0, 106, 169, 0.06);
}

html[data-theme="light"] .account-list-item,
html[data-theme="light"] .empty-state-card {
  border-color: var(--outline-variant);
  background:
    radial-gradient(circle at top left, rgba(0, 106, 169, 0.08), transparent 18rem),
    var(--theme-card-bg);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .page-apps .detail-hero--apps {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .account-card-name:hover,
html[data-theme="light"] .account-card-name:focus-visible {
  color: var(--accent);
}

html[data-theme="light"] .page-apple-accounts .detail-hero,
html[data-theme="light"] .apple-table-shell,
html[data-theme="light"] .apple-summary-block--loading,
html[data-theme="light"] .apple-summary-block--error,
html[data-theme="light"] .apple-status-summary,
html[data-theme="light"] .apple-multi-filter-panel {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .apple-accounts-table th {
  color: var(--on-surface-variant);
  background: var(--surface-container-low);
}

html[data-theme="light"] .apple-bulk-toolbar-row th {
  border-bottom-color: rgba(0, 106, 169, 0.24);
  background: rgba(0, 106, 169, 0.07);
}

html[data-theme="light"] .apple-bulk-price-input {
  border-color: var(--outline-variant);
  background: var(--surface-container-lowest);
  color: var(--on-surface);
}

html[data-theme="light"] .apple-accounts-table td {
  color: var(--on-surface);
}

html[data-theme="light"] .apple-row--free td {
  background: rgba(16, 185, 129, 0.10);
}

html[data-theme="light"] .apple-row--blocked td {
  background: rgba(180, 35, 24, 0.08);
}

html[data-theme="light"] .apple-row--highlight > td {
  background: rgba(0, 106, 169, 0.08);
}

html[data-theme="light"] .apple-email-link,
html[data-theme="light"] .apple-sort-link--active,
html[data-theme="light"] .apple-cell-button,
html[data-theme="light"] .apple-icon-button,
html[data-theme="light"] .apple-form-inline-link,
html[data-theme="light"] .apple-apps-toggle {
  color: var(--accent);
}

html[data-theme="light"] .apple-row--free .apple-email-link {
  color: #047857;
}

html[data-theme="light"] .apple-row--blocked .apple-email-link,
html[data-theme="light"] .apple-row-status--error,
html[data-theme="light"] .apple-phone-expiry-value--error,
html[data-theme="light"] .apple-status-value--error,
html[data-theme="light"] .apple-status-value--missing {
  color: var(--danger);
}

html[data-theme="light"] .apple-type-icon--corporate,
html[data-theme="light"] .apple-status--booked,
html[data-theme="light"] .apple-status--reserved {
  color: var(--accent);
}

html[data-theme="light"] .apple-type-icon--individual,
html[data-theme="light"] .apple-status--free {
  color: var(--success);
}

html[data-theme="light"] .apple-account-status-banner,
html[data-theme="light"] .apple-account-status-banner--booked,
html[data-theme="light"] .apple-account-status-banner--reserved {
  border-color: rgba(0, 106, 169, 0.24);
  background: rgba(0, 106, 169, 0.07);
}

html[data-theme="light"] .apple-account-status-banner--free {
  border-color: var(--success-border);
  background: var(--success-bg);
}

html[data-theme="light"] .apple-account-status-banner--blocked {
  border-color: var(--danger-border);
  background: var(--danger-bg);
}

html[data-theme="light"] .apple-account-status-banner__text {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .portfolio-board-hero,
html[data-theme="light"] .portfolio-board-col {
  border-color: var(--outline-variant);
  background:
    linear-gradient(180deg, var(--theme-card-bg) 0%, var(--surface-container-low) 100%);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .page-portfolio-board .portfolio-board-hero {
  background: var(--theme-card-bg);
}

html[data-theme="light"] .page-portfolio-board .portfolio-board-filters-wrap {
  border: 0;
  background: transparent;
  box-shadow: none;
}

html[data-theme="light"] .analytics-hero,
html[data-theme="light"] .aso-dashboard-head,
html[data-theme="light"] .aso-detail-head {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .analytics-hero .analytics-date-filter,
html[data-theme="light"] .analytics-hero .analytics-dimension-filter {
  border: 0;
  background: transparent;
  box-shadow: none;
}

html[data-theme="light"] .analytics-hero .analytics-tabs {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
  box-shadow: none;
}

html[data-theme="light"] .portfolio-board-col-header {
  border-bottom-color: var(--outline-variant);
  background:
    linear-gradient(90deg, var(--col-accent-dim) 0%, rgba(255, 255, 255, 0.96) 68%),
    var(--theme-card-bg);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .portfolio-board-col-title,
html[data-theme="light"] .portfolio-board-card-title {
  color: var(--on-surface);
}

html[data-theme="light"] .portfolio-board-col-count {
  color: var(--on-surface);
  background: rgba(15, 23, 42, 0.06);
  border-color: var(--outline-variant);
}

html[data-theme="light"] .portfolio-board-col-collapse,
html[data-theme="light"] .portfolio-board-collapsed-placeholder,
html[data-theme="light"] .portfolio-board-card,
html[data-theme="light"] .portfolio-board-card-asc-refresh {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
}

html[data-theme="light"] .portfolio-board-card-menu > summary {
  border-color: transparent;
  background: transparent;
  color: var(--on-surface-variant);
}

html[data-theme="light"] .portfolio-board-card-menu-list {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
}

html[data-theme="light"] .portfolio-board-card-menu-item {
  color: var(--on-surface);
}

html[data-theme="light"] .portfolio-board-card-direct-action {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .portfolio-board-card-direct-action--push {
  border-color: rgba(37, 99, 235, 0.18);
  color: #1d4ed8;
  background: rgba(37, 99, 235, 0.06);
}

html[data-theme="light"] .portfolio-board-card {
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .portfolio-board-card:hover {
  box-shadow: var(--elevation-2);
  border-color: rgba(0, 106, 169, 0.28);
}

html[data-theme="light"] .portfolio-board-card-bg {
  opacity: 0.12;
  filter: saturate(0.92) blur(1px);
}

html[data-theme="light"] .portfolio-board-card-bg--empty {
  background:
    radial-gradient(circle at 30% 20%, rgba(0, 106, 169, 0.10), transparent 55%),
    radial-gradient(circle at 80% 80%, rgba(139, 92, 246, 0.08), transparent 45%),
    linear-gradient(145deg, #ffffff 0%, #eef3f8 100%);
}

html[data-theme="light"] .portfolio-board-card-scrim {
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.72) 0%, rgba(255, 255, 255, 0.94) 58%, rgba(248, 250, 252, 0.98) 100%);
}

html[data-theme="light"] .portfolio-board-card-id,
html[data-theme="light"] .portfolio-board-card-fw,
html[data-theme="light"] .portfolio-board-card-apple-link {
  color: var(--accent);
}

html[data-theme="light"] .portfolio-board-card-secondary,
html[data-theme="light"] .portfolio-board-card-platform-text,
html[data-theme="light"] .portfolio-board-card-revenue-text,
html[data-theme="light"] .portfolio-board-card-locale-summary,
html[data-theme="light"] .portfolio-board-card-locale-all,
html[data-theme="light"] .portfolio-board-card-hard-more,
html[data-theme="light"] .portfolio-board-card-coverage {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .portfolio-board-card-secondary-item--unit,
html[data-theme="light"] .portfolio-board-card-locale-code {
  color: #004a78;
}

html[data-theme="light"] .portfolio-locale-chip {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
  color: var(--on-surface);
}

html[data-theme="light"] .portfolio-board-card-badge--platform,
html[data-theme="light"] .portfolio-board-card-badge--asc,
html[data-theme="light"] .portfolio-board-card-pill {
  color: var(--accent);
  border-color: rgba(0, 106, 169, 0.24);
  background: rgba(0, 106, 169, 0.08);
}

html[data-theme="light"] .portfolio-board-card-badge--platform-swiftui,
html[data-theme="light"] .portfolio-board-card-badge--platform-react-native,
html[data-theme="light"] .portfolio-board-card-badge--locale {
  color: #004a78;
}

html[data-theme="light"] .portfolio-board-card-badge--asc-published,
html[data-theme="light"] .portfolio-board-card-badge--asc-ready-for-sale {
  color: var(--success);
  border-color: var(--success-border);
  background: var(--success-bg);
}

html[data-theme="light"] .portfolio-board-card-badge--asc-in-review {
  color: var(--warning);
  border-color: var(--warning-border);
  background: var(--warning-bg);
}

html[data-theme="light"] .portfolio-board-card-badge--asc-rejected,
html[data-theme="light"] .portfolio-board-card-badge--asc-removed,
html[data-theme="light"] .portfolio-board-card-revenue-text--error {
  color: var(--danger);
}

html[data-theme="light"] .portfolio-board-card--asc-tracking-broken {
  border-color: var(--danger-border);
  box-shadow:
    0 0 0 1px rgba(180, 35, 24, 0.1),
    0 8px 22px rgba(180, 35, 24, 0.12);
}

html[data-theme="light"] .portfolio-board-card-asc-broken,
html[data-theme="light"] .portfolio-modal-asc-broken,
html[data-theme="light"] .portfolio-board-card[data-asc-tracking-broken="1"] .portfolio-board-card-asc-refresh {
  border-color: var(--danger-border);
  background: var(--danger-bg);
  color: var(--danger);
}
html[data-theme="light"] .portfolio-board-card[data-asc-status] .portfolio-board-card-asc-status--sales-closed,
html[data-theme="light"] .portfolio-board-card-asc-status--sales-closed {
  border-color: var(--danger-border);
  background: var(--danger-bg);
  color: var(--danger);
}
html[data-theme="light"] .portfolio-board-card[data-asc-tracking-broken="1"] .portfolio-board-card-asc-status--tracking-paused,
html[data-theme="light"] .portfolio-board-card-asc-status--tracking-error,
html[data-theme="light"] .portfolio-board-card-asc-status--tracking-paused {
  border-color: var(--warning-border);
  background: var(--warning-bg);
  color: var(--warning);
}

html[data-theme="light"] .portfolio-board-card-revenue-text--profit {
  color: var(--success);
}

html[data-theme="light"] .portfolio-board-launch-card {
  color: #06333a;
  border-color: rgba(13, 148, 136, 0.34);
  background:
    linear-gradient(135deg, rgba(240, 253, 250, 0.98) 0%, rgba(204, 251, 241, 0.9) 52%, rgba(255, 251, 235, 0.96) 100%),
    var(--theme-card-bg);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .portfolio-board-launch-card:hover,
html[data-theme="light"] .portfolio-board-launch-card:focus-visible {
  color: #052e2b;
  border-color: rgba(13, 148, 136, 0.58);
  box-shadow: var(--elevation-2);
}

html[data-theme="light"] .portfolio-board-launch-card-glow {
  background:
    linear-gradient(90deg, rgba(250, 204, 21, 0.28), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.74), transparent 50%);
}

html[data-theme="light"] .portfolio-board-launch-card-eyebrow,
html[data-theme="light"] .portfolio-board-launch-card-description {
  color: #0f766e;
}

html[data-theme="light"] .portfolio-board-launch-card-manager {
  color: #064e3b;
  border-color: rgba(13, 148, 136, 0.28);
  background: rgba(255, 255, 255, 0.58);
}

html[data-theme="light"] .portfolio-board-launch-card-cta {
  color: #ffffff;
  background: #0f766e;
}

html[data-theme="light"] .binom-shell,
html[data-theme="light"] .binom-actions,
html[data-theme="light"] .binom-filters,
html[data-theme="light"] .binom-loading,
html[data-theme="light"] .binom-table-wrap,
html[data-theme="light"] .binom-pagination {
  background: var(--bg);
  color: var(--on-surface);
}

html[data-theme="light"] .binom-section-tabs,
html[data-theme="light"] .binom-summary {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
  color: var(--on-surface-variant);
}

html[data-theme="light"] .binom-section-tab,
html[data-theme="light"] .binom-summary strong,
html[data-theme="light"] .binom-name,
html[data-theme="light"] .binom-report-level-0 .binom-tree-label,
html[data-theme="light"] .binom-report-level-1 .binom-tree-label,
html[data-theme="light"] .binom-report-level-2 .binom-tree-label {
  color: var(--on-surface);
}

html[data-theme="light"] .binom-section-tab:hover,
html[data-theme="light"] .binom-section-tab.is-active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}

html[data-theme="light"] .binom-btn,
html[data-theme="light"] .binom-search,
html[data-theme="light"] .binom-select,
html[data-theme="light"] .binom-income-toggle,
html[data-theme="light"] .binom-group-filter-menu,
html[data-theme="light"] .binom-pagination-btn,
html[data-theme="light"] .binom-pagination-size {
  border-color: var(--outline-variant);
  background: var(--theme-control-bg);
  color: var(--on-surface);
}

html[data-theme="light"] .binom-btn:hover,
html[data-theme="light"] .binom-btn:focus-visible,
html[data-theme="light"] .binom-pagination-btn:hover,
html[data-theme="light"] .binom-pagination-btn:focus-visible {
  background: var(--theme-control-hover-bg);
  color: var(--accent);
}

html[data-theme="light"] .binom-btn-blue {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--m3-on-primary);
}

html[data-theme="light"] .binom-btn-green {
  border-color: #84cc16;
  background: #a6dc74;
  color: #08203a;
}

html[data-theme="light"] .binom-table {
  color: var(--on-surface);
}

html[data-theme="light"] .binom-table th,
html[data-theme="light"] .binom-table td {
  border-bottom-color: var(--outline-variant);
}

html[data-theme="light"] .binom-table th {
  color: var(--on-surface-variant);
  background: var(--surface-container-low);
}

html[data-theme="light"] .binom-table tbody tr {
  background: var(--theme-card-bg);
}

html[data-theme="light"] .binom-table tbody tr:nth-child(even) {
  background: var(--surface-container-low);
}

html[data-theme="light"] .binom-table tbody tr:hover {
  background: rgba(0, 106, 169, 0.08);
}

html[data-theme="light"] .binom-link-pill,
html[data-theme="light"] .binom-tags {
  background: var(--surface-container-high);
  color: var(--on-surface);
}

html[data-theme="light"] .binom-muted,
html[data-theme="light"] .binom-selection-count,
html[data-theme="light"] .binom-pagination-current,
html[data-theme="light"] .binom-pagination-range {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .binom-row-profit {
  background: rgba(16, 185, 129, 0.13) !important;
}

html[data-theme="light"] .binom-row-profit .binom-profit,
html[data-theme="light"] .binom-profit {
  color: #047857;
}

html[data-theme="light"] .binom-row-error {
  background: rgba(180, 35, 24, 0.09) !important;
}

/* Light theme: run details, step details, modals, and charts */
html[data-theme="light"] .detail-hero,
html[data-theme="light"] .page-step-detail--docs .detail-hero--step,
html[data-theme="light"] .page-step-detail--graphics .detail-hero--step,
html[data-theme="light"] .page-step-detail--full .detail-hero--step,
html[data-theme="light"] .page-step-detail--ci_monitor .detail-hero--step,
html[data-theme="light"] .page-step-detail--store_refresh .detail-hero--step {
  border-color: var(--outline-variant);
  background:
    radial-gradient(circle at 10% 0%, rgba(0, 106, 169, 0.10), transparent 28rem),
    linear-gradient(135deg, var(--theme-card-bg) 0%, var(--surface-container-low) 100%);
  color: var(--on-surface);
  box-shadow: var(--elevation-2);
}

html[data-theme="light"] .run-ops-summary {
  border-top-color: var(--outline-variant);
}

html[data-theme="light"] .run-ops-panel,
html[data-theme="light"] .run-ops-activity__popover,
html[data-theme="light"] .run-ops-activity__list li {
  border-color: var(--outline-variant);
  background: rgba(255, 255, 255, 0.72);
  color: var(--on-surface);
  box-shadow: none;
}

html[data-theme="light"] .run-ops-panel__label,
html[data-theme="light"] .run-ops-comment label,
html[data-theme="light"] .run-ops-activity__heading {
  color: var(--on-surface);
}

html[data-theme="light"] .run-ops-column,
html[data-theme="light"] .run-ops-chip,
html[data-theme="light"] .run-ops-refresh,
html[data-theme="light"] .run-ops-activity__toggle {
  border-color: rgba(0, 106, 169, 0.24);
  color: var(--accent);
  background: rgba(0, 106, 169, 0.07);
}

html[data-theme="light"] .run-ops-activity__toggle:hover,
html[data-theme="light"] .run-ops-activity__toggle:focus-visible,
html[data-theme="light"] .run-ops-activity.is-open .run-ops-activity__toggle {
  border-color: rgba(0, 106, 169, 0.42);
  color: var(--accent);
  background: rgba(0, 106, 169, 0.14);
}

html[data-theme="light"] .run-ops-action__status--neutral {
  color: #64748b;
}

html[data-theme="light"] .run-ops-action__status--running {
  color: #0369a1;
}

html[data-theme="light"] .run-ops-action__status--success {
  color: #047857;
}

html[data-theme="light"] .run-ops-action__status--failed {
  color: #b42318;
}

html[data-theme="light"] .run-ops-facts dd,
html[data-theme="light"] .run-ops-activity__list li {
  color: var(--on-surface);
}

html[data-theme="light"] .run-ops-panel__hint,
html[data-theme="light"] .run-ops-feedback,
html[data-theme="light"] .run-ops-facts dt,
html[data-theme="light"] .run-ops-activity__heading span,
html[data-theme="light"] .run-ops-activity__list time {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .run-ops-link-preview {
  color: var(--accent);
}

html[data-theme="light"] .run-detail-column-pill,
html[data-theme="light"] .run-ops-fact-link,
html[data-theme="light"] .run-ops-panel-action {
  color: var(--accent);
}

html[data-theme="light"] .run-detail-column-pill {
  border-color: color-mix(in srgb, var(--col-accent) 48%, var(--outline-variant));
  background: linear-gradient(90deg, var(--col-accent-dim) 0%, rgba(255, 255, 255, 0.96) 82%);
  color: var(--on-surface);
}

html[data-theme="light"] .run-detail-push-plan-action strong {
  color: var(--accent);
  background: rgba(0, 106, 169, 0.1);
}

html[data-theme="light"] .run-ops-action {
  border-color: rgba(0, 106, 169, 0.24);
  color: var(--accent);
  background: rgba(0, 106, 169, 0.055);
}

html[data-theme="light"] .run-ops-action:hover,
html[data-theme="light"] .run-ops-action:focus-visible {
  border-color: rgba(0, 106, 169, 0.44);
  color: #004f7f;
  background: rgba(0, 106, 169, 0.11);
}

html[data-theme="light"] .run-ops-status--success {
  border-color: var(--success-border);
  color: var(--success);
  background: var(--success-bg);
}

html[data-theme="light"] .run-ops-status--warning,
html[data-theme="light"] .run-ops-status--running {
  border-color: var(--warning-border);
  color: var(--warning);
  background: var(--warning-bg);
}

html[data-theme="light"] .run-ops-status--failed,
html[data-theme="light"] .run-ops-reason {
  border-color: var(--danger-border);
  color: var(--danger);
  background: var(--danger-bg);
}

html[data-theme="light"] .page-step-detail--docs .eyebrow,
html[data-theme="light"] .page-step-detail--graphics .eyebrow,
html[data-theme="light"] .page-step-detail--ci_monitor .eyebrow,
html[data-theme="light"] .page-step-detail--store_refresh .eyebrow,
html[data-theme="light"] .eyebrow,
html[data-theme="light"] .run-detail-apple-email-label,
html[data-theme="light"] .run-detail-apple-email-link,
html[data-theme="light"] .run-detail-apple-email-value,
html[data-theme="light"] .portfolio-modal-run-id,
html[data-theme="light"] .portfolio-modal-account-link,
html[data-theme="light"] .portfolio-modal-link-store {
  color: var(--accent);
}

html[data-theme="light"] .portfolio-modal-account-list-link,
html[data-theme="light"] .portfolio-modal-account-copy {
  border-color: rgba(0, 106, 169, 0.24);
  background: rgba(0, 106, 169, 0.08);
  color: var(--accent);
}

html[data-theme="light"] .portfolio-modal-account-list-link:hover,
html[data-theme="light"] .portfolio-modal-account-list-link:focus-visible,
html[data-theme="light"] .portfolio-modal-account-copy:hover,
html[data-theme="light"] .portfolio-modal-account-copy:focus-visible {
  border-color: rgba(0, 106, 169, 0.42);
  color: var(--accent);
}

html[data-theme="light"] .integration-meta-chip,
html[data-theme="light"] .run-webview-integration .webview-meta-chip,
html[data-theme="light"] .run-webview-integration a.webview-meta-chip {
  border-color: rgba(0, 106, 169, 0.24);
  background: rgba(0, 106, 169, 0.08);
}

html[data-theme="light"] .detail-stat-card,
html[data-theme="light"] .detail-stat-card--status,
html[data-theme="light"] .detail-stat-card--integration-test,
html[data-theme="light"] .detail-stat-card--webview-tested,
html[data-theme="light"] .step-actions-bar,
html[data-theme="light"] .step-fold,
html[data-theme="light"] .step-tool-fold,
html[data-theme="light"] .step-md-block,
html[data-theme="light"] .step-doc-card,
html[data-theme="light"] .step-url-patch-panel,
html[data-theme="light"] .step-edit-attachments,
html[data-theme="light"] .step-edit-attachment-empty,
html[data-theme="light"] .step-edit-attachment-item,
html[data-theme="light"] .gen-details,
html[data-theme="light"] .run-publication-card,
html[data-theme="light"] .run-link-card,
html[data-theme="light"] .run-detail-config-yaml-inner,
html[data-theme="light"] .ci-summary-card,
html[data-theme="light"] .run-graphics-version,
html[data-theme="light"] .step-graphics-panel,
html[data-theme="light"] .step-graphics-item,
html[data-theme="light"] .adspower-profile-grid div,
html[data-theme="light"] .adspower-settings-details,
html[data-theme="light"] .adspower-profile-panel {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .run-pipeline-state {
  background: color-mix(in srgb, var(--run-pipeline-color) 8%, #ffffff);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .run-pipeline-state__progress {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .step-actions-bar,
html[data-theme="light"] .run-publication-card,
html[data-theme="light"] .step-detail-surface--actions,
html[data-theme="light"] .run-webview-integration {
  background:
    linear-gradient(135deg, rgba(0, 106, 169, 0.08), transparent 48%),
    var(--theme-card-bg);
}

html[data-theme="light"] .run-link-card--pages {
  background:
    linear-gradient(135deg, rgba(0, 106, 169, 0.12), transparent 56%),
    var(--theme-card-bg);
}

html[data-theme="light"] .run-link-card strong,
html[data-theme="light"] .step-detail-surface__title,
html[data-theme="light"] .step-doc-card__title,
html[data-theme="light"] .step-graphics-subhead,
html[data-theme="light"] .portfolio-modal-title,
html[data-theme="light"] .portfolio-action-hint-title,
html[data-theme="light"] .portfolio-action-hint-side-note strong,
html[data-theme="light"] .adspower-profile-grid dd {
  color: var(--on-surface);
}

html[data-theme="light"] .run-link-card-label,
html[data-theme="light"] .step-detail-surface__lead,
html[data-theme="light"] .step-detail-purpose,
html[data-theme="light"] .step-fold__lead,
html[data-theme="light"] .step-doc-card__path,
html[data-theme="light"] .step-doc-card__placeholder,
html[data-theme="light"] .step-graphics-caption,
html[data-theme="light"] .run-graphics-version-badge,
html[data-theme="light"] .run-graphics-version-count,
html[data-theme="light"] .portfolio-modal-subtitle,
html[data-theme="light"] .portfolio-modal-k,
html[data-theme="light"] .portfolio-action-hint-text,
html[data-theme="light"] .portfolio-action-hint-status,
html[data-theme="light"] .portfolio-action-hint-side-note,
html[data-theme="light"] .adspower-profile-grid dt,
html[data-theme="light"] .run-webview-integration .detail-stat-hint {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .run-link-card-url,
html[data-theme="light"] .step-doc-card__link,
html[data-theme="light"] .step-graphics-item a,
html[data-theme="light"] .run-webview-integration a.webview-meta-chip,
html[data-theme="light"] .run-webview-integration .webview-bundle-sample-copy {
  color: var(--accent);
}

html[data-theme="light"] .run-graphics-version--current .run-graphics-version-badge {
  border-color: rgba(0, 106, 169, 0.36);
  color: var(--accent);
}

html[data-theme="light"] .steps-phases .step-row {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .steps-phases .step-row--running {
  background:
    linear-gradient(90deg, rgba(0, 106, 169, 0.10), transparent 44%),
    var(--theme-card-bg);
}

html[data-theme="light"] .steps-phases .step-row--webview {
  background:
    linear-gradient(90deg, rgba(168, 85, 247, 0.12), transparent 44%),
    var(--theme-card-bg);
}

html[data-theme="light"] .step-row-number {
  background: var(--surface-container-high);
  color: var(--on-surface-variant);
}

html[data-theme="light"] .step-row-number--webview {
  background: rgba(168, 85, 247, 0.12);
  color: #5b21b6;
}

html[data-theme="light"] .steps-phases .step-phase-title,
html[data-theme="light"] .steps-phases a.step-phase-title--link,
html[data-theme="light"] .step-row-meta code,
html[data-theme="light"] .apps-proxy-name {
  color: var(--on-surface);
}

html[data-theme="light"] .step-msg-md pre,
html[data-theme="light"] .step-md-block pre,
html[data-theme="light"] .step-msg-md code,
html[data-theme="light"] .form-step-edit .step-edit-textarea,
html[data-theme="light"] .gen-live-log,
html[data-theme="light"] .step-ci-json,
html[data-theme="light"] pre.yaml,
html[data-theme="light"] .run-config-yaml-pre,
html[data-theme="light"] .run-config-yaml-textarea,
html[data-theme="light"] .adspower-settings-pre,
html[data-theme="light"] .adspower-profile-json {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
  color: var(--on-surface);
}

html[data-theme="light"] .step-tool-fold summary,
html[data-theme="light"] .step-fold-summary,
html[data-theme="light"] .portfolio-modal-locale-summary {
  color: var(--on-surface);
}

html[data-theme="light"] .step-edit-attachment-thumb,
html[data-theme="light"] .step-graphics-item img,
html[data-theme="light"] .step-graphics-item video,
html[data-theme="light"] .step-graphics-item[style*="--graphics-ratio"] a[data-lightbox-trigger],
html[data-theme="light"] .step-graphics-grid.portfolio-board-screenshots-carousel .step-graphics-item a {
  background: var(--surface-container-low);
}

html[data-theme="light"] .step-graphics-panel--marketing {
  border-color: var(--success-border);
  background: rgba(16, 185, 129, 0.08);
}

html[data-theme="light"] .step-graphics-panel--archive {
  border-color: var(--warning-border);
  background: var(--warning-bg);
}

.page-run-graphics-chat .graphics-chat-hero h1 {
  max-width: 880px;
}

.graphics-chat-shell {
  position: relative;
  width: min(1120px, 100%);
  min-height: min(780px, calc(100vh - 220px));
  margin: 0 auto;
}

.graphics-chat-panel,
.graphics-chat-assets-panel {
  border: 1px solid var(--outline-variant);
  background: var(--surface-container-low);
  border-radius: 8px;
  box-shadow: var(--elevation-1);
}

.graphics-chat-panel {
  display: flex;
  flex-direction: column;
  min-height: min(780px, calc(100vh - 220px));
  overflow: hidden;
}

.graphics-chat-head {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--outline-variant);
  background: var(--surface-container);
}

.graphics-chat-title-row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.graphics-chat-avatar {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid var(--theme-active-border);
  border-radius: 8px;
  background: var(--theme-active-bg);
  color: var(--on-surface);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0;
}

.graphics-chat-head h2 {
  margin: 0;
  font-size: 1rem;
  line-height: 1.2;
}

.graphics-chat-meta {
  margin-top: 3px;
  overflow-wrap: anywhere;
}

.graphics-chat-head-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.graphics-chat-history-popover {
  position: absolute;
  top: calc(100% + 8px);
  right: 16px;
  z-index: 25;
  width: min(360px, calc(100vw - 32px));
  max-height: min(480px, 70vh);
  padding: 12px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container-high);
  box-shadow: var(--elevation-2);
  overflow: auto;
}

.graphics-chat-popover-head,
.graphics-chat-assets-head,
.graphics-chat-assets-block-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.graphics-chat-popover-head h3,
.graphics-chat-assets-head h2,
.graphics-chat-assets-block-head h3 {
  margin: 0;
  font-size: 0.98rem;
  line-height: 1.2;
}

.graphics-chat-history-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.graphics-chat-history-item {
  display: grid;
  gap: 4px;
  width: 100%;
  min-height: 66px;
  padding: 10px 12px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container);
  color: var(--on-surface);
  text-align: left;
  cursor: pointer;
}

.graphics-chat-history-item:hover,
.graphics-chat-history-item.is-active {
  border-color: var(--theme-active-border);
  background: var(--theme-active-bg);
}

.graphics-chat-history-item strong,
.graphics-chat-history-item span,
.graphics-chat-history-item small {
  overflow-wrap: anywhere;
}

.graphics-chat-history-item span,
.graphics-chat-history-item small {
  color: var(--on-surface-variant);
  font-size: 0.82rem;
}

.graphics-chat-messages {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 16px;
  min-height: 360px;
  padding: 22px clamp(16px, 3vw, 34px);
  overflow: auto;
}

.graphics-chat-messages.is-empty {
  justify-content: center;
}

.graphics-chat-empty-state {
  display: grid;
  place-items: center;
  min-height: 220px;
  color: var(--on-surface-variant);
}

.graphics-chat-empty-state[hidden] {
  display: none;
}

.graphics-chat-empty-state h3 {
  margin: 0;
  font-size: 1.05rem;
}

.graphics-chat-message {
  display: grid;
  gap: 8px;
  min-width: 0;
  max-width: min(860px, 92%);
  padding: 12px 0;
  color: var(--on-surface);
}

.graphics-chat-message--user {
  justify-self: end;
  max-width: min(740px, 88%);
  padding: 12px 14px;
  border: 1px solid var(--theme-active-border);
  border-radius: 8px;
  background: var(--theme-active-bg);
}

.graphics-chat-message--assistant {
  justify-self: start;
}

.graphics-chat-message--assistant + .graphics-chat-message--assistant {
  padding-top: 0;
}

.graphics-chat-message-role {
  color: var(--on-surface-variant);
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.graphics-chat-message-body {
  min-width: 0;
  max-width: 100%;
  color: var(--on-surface);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.graphics-chat-message-body a,
.graphics-chat-message-body code,
.graphics-chat-message-body pre {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.graphics-chat-message-body pre {
  overflow-x: hidden;
  white-space: pre-wrap;
}

.graphics-chat-message-body > :first-child {
  margin-top: 0;
}

.graphics-chat-message-body > :last-child {
  margin-bottom: 0;
}

.graphics-chat-md-fallback {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.graphics-chat-progress-stream {
  color: var(--on-surface-variant);
  font-size: 0.92rem;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.graphics-chat-message-error {
  margin: 0;
  color: var(--danger);
}

.graphics-chat-message-outputs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 8px;
  width: min(680px, 100%);
}

.graphics-chat-compose {
  display: grid;
  gap: 8px;
  padding: 0 clamp(16px, 3vw, 34px) 18px;
  border-top: 1px solid var(--outline-variant);
  background: var(--surface-container);
}

.graphics-chat-composer-box {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container-low);
  transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.graphics-chat-shell.is-dragging-files .graphics-chat-composer-box {
  border-color: var(--theme-active-border);
  background: var(--theme-active-bg);
  box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.18);
}

.graphics-chat-compose textarea {
  width: 100%;
  min-height: 44px;
  max-height: 220px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--on-surface);
  resize: none;
  box-shadow: none;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  word-break: break-word;
}

.graphics-chat-compose textarea:focus {
  outline: none;
}

.graphics-chat-compose-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}

.graphics-chat-file-button {
  position: relative;
}

.graphics-chat-file-button input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.graphics-chat-attachments,
.graphics-chat-message-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.graphics-chat-attachments {
  min-height: 0;
}

.graphics-chat-attachment-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 260px;
  padding: 5px 8px;
  border: 1px solid var(--outline-variant);
  border-radius: 999px;
  background: var(--surface-container);
  color: var(--on-surface);
  font-size: 0.82rem;
  text-decoration: none;
  overflow: hidden;
}

.graphics-chat-attachment-chip--pending {
  padding: 3px 5px 3px 8px;
}

.graphics-chat-attachment-preview,
.graphics-chat-attachment-remove {
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
}

button.graphics-chat-attachment-chip {
  cursor: pointer;
}

.graphics-chat-attachment-preview {
  min-width: 0;
  padding: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}

.graphics-chat-attachment-remove {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  color: var(--on-surface-variant);
  cursor: pointer;
}

.graphics-chat-attachment-remove:hover {
  background: var(--surface-container-high);
  color: var(--on-surface);
}

.graphics-chat-status {
  min-height: 1.2em;
  margin: 0;
}

.graphics-chat-resource-list,
.graphics-chat-output-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
  margin-top: 10px;
}

.graphics-chat-resource,
.graphics-chat-output {
  display: grid;
  gap: 6px;
  width: 100%;
  padding: 8px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container);
  color: var(--on-surface);
  font: inherit;
  text-decoration: none;
  text-align: left;
  cursor: pointer;
}

.graphics-chat-resource:hover,
.graphics-chat-output:hover {
  border-color: var(--theme-active-border);
  background: var(--theme-active-bg);
}

.graphics-chat-resource img,
.graphics-chat-output img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: contain;
  border-radius: 6px;
  background: var(--surface-container-high);
}

.graphics-chat-output img {
  aspect-ratio: 9 / 14;
}

.graphics-chat-resource span,
.graphics-chat-output span {
  color: var(--on-surface-variant);
  font-size: 0.78rem;
  text-transform: uppercase;
}

.graphics-chat-resource strong,
.graphics-chat-output strong {
  font-size: 0.84rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.graphics-chat-empty {
  margin: 0;
}

.graphics-chat-assets[hidden] {
  display: none;
}

.graphics-chat-assets {
  position: fixed;
  inset: 0;
  z-index: 8000;
  pointer-events: none;
}

.graphics-chat-assets-backdrop {
  position: fixed;
  inset: 0;
  border: 0;
  background: rgba(0, 0, 0, 0.48);
  opacity: 0;
  transition: opacity 220ms ease;
  cursor: default;
}

.graphics-chat-assets-panel {
  position: fixed;
  top: 16px;
  right: 16px;
  bottom: 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: min(460px, calc(100vw - 32px));
  padding: 14px;
  opacity: 0;
  overflow: auto;
  transform: translateX(calc(100% + 28px));
  transition: transform 240ms cubic-bezier(0.2, 0, 0, 1), opacity 180ms ease;
}

.graphics-chat-assets.is-open {
  pointer-events: auto;
}

.graphics-chat-assets.is-open .graphics-chat-assets-backdrop {
  opacity: 1;
}

.graphics-chat-assets.is-open .graphics-chat-assets-panel {
  opacity: 1;
  transform: translateX(0);
}

.graphics-chat-assets-head {
  flex: 0 0 auto;
}

.graphics-chat-assets-head h2 {
  font-size: 1.05rem;
}

.graphics-chat-assets-head .hint {
  margin-top: 3px;
}

.graphics-chat-assets-block {
  flex: 0 0 auto;
}

.is-graphics-busy .graphics-chat-head .pill {
  border-color: var(--warning-border);
  background: var(--warning-bg);
}

@media (max-width: 760px) {
  .graphics-chat-shell {
    min-height: 0;
  }

  .graphics-chat-panel {
    min-height: 0;
  }

  .graphics-chat-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .graphics-chat-head-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .graphics-chat-messages {
    min-height: 340px;
    padding: 16px 12px;
  }

  .graphics-chat-compose {
    padding: 0 12px 12px;
  }

  .graphics-chat-message {
    max-width: 100%;
  }

  .graphics-chat-message--user {
    max-width: 96%;
  }

  .graphics-chat-assets-panel {
    top: 8px;
    right: 8px;
    bottom: 8px;
    width: calc(100vw - 16px);
  }

  .graphics-chat-resource-list,
  .graphics-chat-output-grid {
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  }
}

/* Unified picker/filter chrome.
   The visual reference is the ASO app/country picker: compact trigger,
   searchable popover, dense options and meta-light focus states. */
.factory-select-native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0.001 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  pointer-events: none !important;
}

.factory-select {
  width: 100%;
  min-width: 0;
}

.factory-combobox {
  position: relative;
  width: 100%;
  min-width: 0;
}

.field .factory-select,
.field .factory-combobox,
.form .factory-select,
.form .factory-combobox,
.form-run-new .factory-select,
.form-run-new .factory-combobox,
.form-apple-account .factory-select,
.form-apple-account .factory-combobox,
.factory-combobox-input {
  box-sizing: border-box;
  width: 100%;
  margin-bottom: 0;
}

.factory-select .aso-dashboard-picker__button {
  min-height: 38px;
}

.factory-select__panel,
.factory-combobox__panel {
  min-width: min(420px, calc(100vw - 36px));
}

.factory-select__list,
.factory-combobox__list {
  max-height: min(370px, 52vh);
}

.factory-select__option,
.factory-combobox__option {
  grid-template-columns: minmax(0, 1fr);
}

.factory-select__rich-main {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  width: 100%;
}

.factory-select__rich-icon {
  position: relative;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  overflow: hidden;
  border-radius: 9px;
  color: var(--text-secondary, var(--muted));
  background: color-mix(in srgb, var(--primary, #78b7fa) 14%, var(--surface-container-highest, #1f232a));
  font-size: 12px;
  font-weight: 900;
}

.factory-select__rich-icon img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.factory-select__rich-copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.factory-select__rich-copy strong,
.factory-select__rich-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.factory-select__display-id {
  flex: 0 0 auto;
  padding: 2px 6px;
  border: 1px solid rgba(158, 202, 255, 0.24);
  border-radius: 999px;
  color: #9ecaff;
  background: rgba(158, 202, 255, 0.09);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.1;
}

.factory-select__button [data-factory-select-label] {
  flex: 1 1 auto;
}

.factory-select__button .factory-select__rich-main {
  grid-template-columns: 28px minmax(0, 1fr);
}

.factory-select__button .factory-select__rich-icon {
  width: 28px;
  height: 28px;
  border-radius: 7px;
}

.factory-select__button .factory-select__rich-copy small {
  font-size: 10px;
}

.factory-select__option.is-selected,
.factory-combobox__option.is-selected {
  border-color: rgba(158, 202, 255, 0.52);
  background: rgba(158, 202, 255, 0.10);
}

.factory-select__option.is-selected .aso-dashboard-picker__main strong::after,
.factory-combobox__option.is-selected .aso-dashboard-picker__main strong::after {
  content: "выбрано";
  flex: 0 0 auto;
  margin-left: auto;
  border: 1px solid rgba(158, 202, 255, 0.24);
  border-radius: 999px;
  background: rgba(158, 202, 255, 0.10);
  color: var(--text-secondary, var(--muted));
  font-size: 10px;
  font-weight: 850;
  line-height: 1.1;
  padding: 3px 6px;
}

.factory-select__option:disabled,
.factory-combobox__option:disabled {
  cursor: not-allowed;
  opacity: 0.48;
}

.factory-select__done {
  width: 100%;
  margin-top: 8px;
}

.factory-select.is-disabled .aso-dashboard-picker__button {
  cursor: not-allowed;
  opacity: 0.58;
}

.factory-combobox.has-error .factory-combobox-input {
  border-color: rgba(255, 180, 171, 0.88);
  box-shadow: 0 0 0 2px rgba(255, 180, 171, 0.12);
}

.apps-unit-editor .factory-combobox,
.apps-saler-editor .factory-combobox,
.apps-proxy-editor .factory-combobox,
.apps-asc-manual-reason-editor .factory-combobox {
  flex: 1 1 180px;
  min-width: 170px;
}

.apps-asc-manual-reason-editor .factory-combobox {
  flex-basis: 260px;
  max-width: 26rem;
}

.smart-analysis-new-form .factory-combobox {
  width: 100%;
}

.apps-unit-editor .factory-combobox-input,
.apps-saler-editor .factory-combobox-input,
.apps-proxy-editor .factory-combobox-input,
.apps-asc-manual-reason-editor .factory-combobox-input {
  min-width: 0;
}

.apps-filter-menu,
.apple-multi-filter,
.portfolio-filter-drop,
.binom-group-filter {
  min-width: 13rem;
}

.apps-filter-menu summary > span,
.apple-multi-filter summary > span,
.portfolio-filter-drop summary > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.06em;
  line-height: 1;
  text-transform: uppercase;
}

:is(.apps-filter-menu, .apple-multi-filter, .portfolio-filter-drop) summary,
.binom-group-filter-button {
  position: relative;
  min-height: 38px;
  border: 1px solid var(--outline-variant);
  border-radius: 8px;
  background: var(--surface-container-high);
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 650;
  box-shadow: none;
}

:is(.apps-filter-menu, .apple-multi-filter, .portfolio-filter-drop) summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: center;
  gap: 4px;
  padding: 7px 32px 7px 11px;
}

.binom-group-filter-button {
  padding: 0 11px;
}

:is(.apps-filter-menu, .apple-multi-filter, .portfolio-filter-drop) summary::after {
  content: "";
  position: absolute;
  right: 12px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  opacity: 0.82;
  pointer-events: none;
  transform: translateY(-62%) rotate(45deg);
  transition: transform 0.14s ease;
}

:is(.apps-filter-menu, .apple-multi-filter, .portfolio-filter-drop)[open] summary::after {
  transform: translateY(-34%) rotate(225deg);
}

:is(.apps-filter-menu, .apple-multi-filter, .portfolio-filter-drop) summary strong,
.binom-group-filter-button span:first-child {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(.apps-filter-menu--active, .apple-multi-filter--active, .portfolio-filter-drop--active) summary {
  border-color: rgba(158, 202, 255, 0.52);
  background: rgba(158, 202, 255, 0.10);
  color: var(--on-surface);
  box-shadow: none;
}

:is(.apps-filter-menu, .apple-multi-filter, .portfolio-filter-drop) summary:focus,
.binom-group-filter-button:focus {
  outline: 2px solid rgba(158, 202, 255, 0.28);
  border-color: var(--accent);
}

:is(.apps-filter-menu-panel, .apple-multi-filter-panel, .portfolio-filter-body, .binom-group-filter-menu) {
  z-index: 60;
  border: 1px solid rgba(140, 146, 154, 0.28);
  border-radius: 8px;
  background: var(--surface-container-highest, #1f232a);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.38);
  padding: 8px;
}

.factory-filter-search {
  position: sticky;
  top: 0;
  z-index: 1;
  box-sizing: border-box;
  margin: 0 0 7px;
}

.factory-filter-search-empty {
  margin: 8px 4px 2px;
  color: var(--muted);
  font-size: 0.82rem;
}

.apps-filter-menu-panel,
.apple-multi-filter-panel,
.portfolio-filter-body {
  top: calc(100% + 6px);
}

.apple-multi-filter-panel {
  min-width: max(100%, 18rem);
}

.portfolio-filter-body {
  min-width: min(340px, calc(100vw - 36px));
  max-height: min(370px, 54vh);
}

.binom-group-filter-menu {
  top: calc(100% + 6px);
  width: min(32rem, calc(100vw - 36px));
  max-height: min(370px, 54vh);
}

:is(.apps-filter-menu-option, .apple-filter-option, .portfolio-filter-row, .binom-group-check) {
  min-height: 34px;
  border: 1px solid rgba(140, 146, 154, 0.18);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.028);
  color: var(--text);
  padding: 8px;
}

:is(.apps-filter-menu-option, .apple-filter-option, .portfolio-filter-row, .binom-group-check):hover,
:is(.apps-filter-menu-option, .apple-filter-option, .portfolio-filter-row, .binom-group-check):focus-visible {
  outline: 0;
  border-color: rgba(158, 202, 255, 0.45);
  background: rgba(158, 202, 255, 0.075);
}

.apps-filter-menu-option.is-active {
  border-color: rgba(158, 202, 255, 0.52);
  background: rgba(158, 202, 255, 0.10);
  color: var(--on-surface);
}

.apple-filter-option--all,
.binom-group-check--all {
  margin-bottom: 6px;
}

.apple-filter-option input,
.portfolio-filter-cb,
.binom-group-check input {
  accent-color: var(--accent);
}

.binom-filters .factory-select {
  width: 12rem;
}

.binom-grouping-controls .factory-select {
  width: 13.8rem;
}

.binom-filters .factory-select .aso-dashboard-picker__panel {
  min-width: min(22rem, calc(100vw - 36px));
}

.aso-dashboard-unit-filter .factory-select {
  min-width: 13rem;
}

html[data-theme="light"] .factory-select .aso-dashboard-picker__button,
html[data-theme="light"] .factory-select .aso-dashboard-picker__search,
html[data-theme="light"] .factory-combobox-input,
html[data-theme="light"] .factory-filter-search,
html[data-theme="light"] :is(.apps-filter-menu, .apple-multi-filter, .portfolio-filter-drop) summary,
html[data-theme="light"] .binom-group-filter-button {
  border-color: var(--outline-variant);
  background: var(--theme-control-bg);
  color: var(--on-surface);
}

html[data-theme="light"] .factory-select .aso-dashboard-picker__panel,
html[data-theme="light"] .factory-combobox__panel,
html[data-theme="light"] :is(.apps-filter-menu-panel, .apple-multi-filter-panel, .portfolio-filter-body, .binom-group-filter-menu) {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-2);
}

html[data-theme="light"] :is(.apps-filter-menu-option, .apple-filter-option, .portfolio-filter-row, .binom-group-check),
html[data-theme="light"] .factory-select__option,
html[data-theme="light"] .factory-combobox__option {
  border-color: rgba(113, 119, 127, 0.22);
  background: rgba(0, 106, 169, 0.035);
  color: var(--on-surface);
}

html[data-theme="light"] :is(.apps-filter-menu-option, .apple-filter-option, .portfolio-filter-row, .binom-group-check):hover,
html[data-theme="light"] .factory-select__option:hover,
html[data-theme="light"] .factory-select__option:focus,
html[data-theme="light"] .factory-combobox__option:hover,
html[data-theme="light"] .factory-combobox__option:focus {
  border-color: rgba(0, 106, 169, 0.34);
  background: rgba(0, 106, 169, 0.08);
}

@media (max-width: 760px) {
  .factory-select__panel,
  .factory-combobox__panel,
  .binom-filters .factory-select .aso-dashboard-picker__panel,
  .aso-monitor-country-picker .aso-dashboard-picker__panel {
    min-width: min(420px, calc(100vw - 28px));
  }
}

html[data-theme="light"] .integration-test-callout .run-integration-test--inline,
html[data-theme="light"] .integration-test-run-card,
html[data-theme="light"] .integration-test-video-wrap {
  border-color: var(--theme-active-border);
  background:
    radial-gradient(circle at 8% 16%, rgba(0, 106, 169, 0.10), transparent 36%),
    linear-gradient(135deg, rgba(0, 106, 169, 0.08), rgba(255, 255, 255, 0.96)),
    var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .integration-test-badge {
  border-color: rgba(0, 106, 169, 0.32);
  background:
    linear-gradient(145deg, rgba(0, 106, 169, 0.12), rgba(255, 255, 255, 0.72)),
    var(--surface-container-high);
  color: #004a78;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

html[data-theme="light"] .integration-test-callout .detail-stat-label,
html[data-theme="light"] .integration-test-card-head .eyebrow {
  color: var(--accent);
}

html[data-theme="light"] .integration-test-callout .detail-stat-hint,
html[data-theme="light"] .integration-test-card-head .hint,
html[data-theme="light"] .simulator-console-head .hint {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .integration-test-callout .run-integration-meta,
html[data-theme="light"] .run-integration-test .run-integration-meta {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .integration-meta-chip,
html[data-theme="light"] .integration-test-run-meta p,
html[data-theme="light"] .integration-test-run-status span,
html[data-theme="light"] .simulator-console-status-grid p,
html[data-theme="light"] .simulator-console-artifact-link {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
  color: var(--on-surface-variant);
}

html[data-theme="light"] .integration-meta-chip strong,
html[data-theme="light"] .integration-test-run-meta strong,
html[data-theme="light"] .integration-test-run-status strong,
html[data-theme="light"] .simulator-console-status-grid strong {
  color: var(--on-surface);
}

html[data-theme="light"] .integration-test-run-meta span,
html[data-theme="light"] .simulator-console-status-grid span,
html[data-theme="light"] .simulator-console-artifacts-title,
html[data-theme="light"] .simulator-console-device-label {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .integration-test-run-status {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .integration-test-run-error {
  color: var(--danger);
}

html[data-theme="light"] .integration-test-run-card progress,
html[data-theme="light"] .integration-test-run-card progress::-webkit-progress-bar {
  background: var(--surface-container-high);
}

html[data-theme="light"] .ai-sim-tabs,
html[data-theme="light"] .simulator-console-card {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .ai-sim-tab {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .ai-sim-tab:hover {
  background: var(--theme-row-hover);
  color: var(--accent);
}

html[data-theme="light"] .ai-sim-tab.is-active {
  border-color: var(--theme-active-border);
  background: #e8f3ff;
  color: var(--accent);
}

html[data-theme="light"] .simulator-console-badge {
  border-color: var(--success-border);
  background: var(--success-bg);
  color: var(--success);
  box-shadow: none;
}

html[data-theme="light"] .simulator-console-device-label select {
  border-color: var(--outline-variant);
  background: var(--theme-control-bg);
  color: var(--on-surface);
  color-scheme: light;
}

html[data-theme="light"] .simulator-console-artifact-link:hover {
  border-color: var(--success-border);
  background: var(--success-bg);
  color: var(--success);
}

html[data-theme="light"] .simulator-console-frame-shell,
html[data-theme="light"] .simulator-console-frame-shell iframe,
html[data-theme="light"] .integration-test-video-wrap video {
  border-color: var(--outline-variant);
  background: var(--surface-container-high);
}

html[data-theme="light"] .step-exec-actions #step-repeat-btn.step-repeat-muted,
html[data-theme="light"] .step-exec-actions .btn-secondary.step-repeat-muted {
  border-color: var(--outline-variant) !important;
  background: var(--surface-container-high) !important;
  color: var(--on-surface-variant) !important;
}

html[data-theme="light"] .portfolio-modal-backdrop {
  background: rgba(15, 23, 42, 0.28);
}

html[data-theme="light"] .portfolio-modal-dialog,
html[data-theme="light"] .portfolio-action-hint-dialog {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: 0 28px 80px rgba(15, 23, 42, 0.22);
}

html[data-theme="light"] .portfolio-modal-hero-bg--empty {
  background:
    radial-gradient(circle at 20% 30%, rgba(0, 106, 169, 0.10), transparent 55%),
    radial-gradient(circle at 90% 70%, rgba(139, 92, 246, 0.08), transparent 50%),
    linear-gradient(165deg, #ffffff 0%, #edf4fb 100%);
}

html[data-theme="light"] .portfolio-modal-hero-inner,
html[data-theme="light"] .portfolio-modal-loading-hero {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.70) 0%, rgba(255, 255, 255, 0.94) 72%, #ffffff 100%);
}

html[data-theme="light"] .portfolio-modal-loading-icon {
  border-color: rgba(0, 106, 169, 0.16);
  background: rgba(0, 106, 169, 0.06);
}

html[data-theme="light"] .portfolio-modal-loading-line {
  background: rgba(0, 106, 169, 0.09);
}

html[data-theme="light"] .portfolio-modal-section,
html[data-theme="light"] .portfolio-screenshots-placeholder,
html[data-theme="light"] .portfolio-modal-locale-status,
html[data-theme="light"] .portfolio-modal-coverage-picker,
html[data-theme="light"] .portfolio-action-hint-app,
html[data-theme="light"] .portfolio-action-hint-form,
html[data-theme="light"] .portfolio-action-hint-segmented,
html[data-theme="light"] .portfolio-action-hint-picker-button,
html[data-theme="light"] .portfolio-action-hint-country-panel,
html[data-theme="light"] .portfolio-action-hint-side-note,
html[data-theme="light"] .portfolio-action-hint-action,
html[data-theme="light"] .portfolio-action-hint-input,
html[data-theme="light"] .portfolio-action-hint-textarea,
html[data-theme="light"] .portfolio-modal-input,
html[data-theme="light"] .portfolio-modal-textarea,
html[data-theme="light"] .portfolio-modal-country-row,
html[data-theme="light"] .portfolio-modal-locale-row {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
  color: var(--on-surface);
}

html[data-theme="light"] .portfolio-activity-item--comment {
  border-color: rgba(0, 106, 169, 0.24);
  border-left-color: var(--accent);
  background:
    linear-gradient(90deg, rgba(0, 106, 169, 0.10), rgba(56, 189, 248, 0.06)),
    var(--surface-container-low);
}

html[data-theme="light"] .portfolio-activity-item--comment .portfolio-activity-kind,
html[data-theme="light"] .portfolio-activity-item--comment .portfolio-activity-glyph {
  color: var(--accent);
}

html[data-theme="light"] .portfolio-activity-item--comment .portfolio-activity-text {
  color: var(--on-surface);
}

html[data-theme="light"] .portfolio-modal-btn-sales-highlight-reset {
  border-color: rgba(180, 83, 9, 0.46);
  background:
    linear-gradient(180deg, rgba(245, 158, 11, 0.18), rgba(251, 191, 36, 0.11)),
    #fff8e1;
  color: #78350f;
  box-shadow: inset 0 0 0 1px rgba(180, 83, 9, 0.10);
}

html[data-theme="light"] .portfolio-modal-btn-sales-highlight-reset:hover:not(:disabled) {
  border-color: rgba(180, 83, 9, 0.66);
  background:
    linear-gradient(180deg, rgba(245, 158, 11, 0.25), rgba(251, 191, 36, 0.16)),
    #fffbeb;
  color: #5f2605;
}

html[data-theme="light"] .portfolio-modal-close,
html[data-theme="light"] .portfolio-action-hint-close,
html[data-theme="light"] .portfolio-modal-asc-refresh,
html[data-theme="light"] .portfolio-modal-coverage-icon-btn {
  border-color: var(--outline-variant);
  background: var(--theme-control-bg);
  color: var(--on-surface);
}

html[data-theme="light"] .portfolio-modal-close:hover,
html[data-theme="light"] .portfolio-action-hint-close:hover,
html[data-theme="light"] .portfolio-modal-close:focus-visible,
html[data-theme="light"] .portfolio-action-hint-close:focus-visible {
  border-color: var(--danger-border);
  background: var(--danger-bg);
  color: var(--danger);
}

html[data-theme="light"] .portfolio-modal-badge,
html[data-theme="light"] .portfolio-action-hint-chip,
html[data-theme="light"] .portfolio-action-hint-icon,
html[data-theme="light"] .portfolio-modal-coverage-mode {
  border-color: rgba(0, 106, 169, 0.24);
  background: rgba(0, 106, 169, 0.08);
  color: var(--accent);
}

html[data-theme="light"] .portfolio-action-hint-segment,
html[data-theme="light"] .portfolio-action-hint-country-option {
  border-color: rgba(113, 119, 127, 0.22);
  background: rgba(0, 106, 169, 0.035);
  color: var(--on-surface);
}

html[data-theme="light"] .portfolio-action-hint-segment:hover,
html[data-theme="light"] .portfolio-action-hint-segment:focus-visible,
html[data-theme="light"] .portfolio-action-hint-country-option:hover,
html[data-theme="light"] .portfolio-action-hint-country-option:focus-visible,
html[data-theme="light"] .portfolio-action-hint-country-option.is-selected {
  border-color: rgba(0, 106, 169, 0.34);
  background: rgba(0, 106, 169, 0.08);
  color: var(--on-surface);
}

html[data-theme="light"] .portfolio-action-hint-segment.is-active {
  border-color: rgba(0, 106, 169, 0.42);
  background: var(--accent);
  color: #ffffff;
}

html[data-theme="light"] .portfolio-action-hint-country-option span,
html[data-theme="light"] .portfolio-action-hint-picker-button::after {
  color: var(--accent);
}

html[data-theme="light"] .portfolio-modal-locale-row--hard .portfolio-modal-locale-variant {
  background: rgba(190, 24, 93, 0.10);
  color: #9d174d;
}

html[data-theme="light"] .portfolio-modal-locale-variant,
html[data-theme="light"] .portfolio-modal-country-code,
html[data-theme="light"] .portfolio-modal-locale-code,
html[data-theme="light"] .portfolio-action-hint-eyebrow {
  color: var(--accent);
}

html[data-theme="light"] .portfolio-modal-locale-name,
html[data-theme="light"] .portfolio-action-hint-label,
html[data-theme="light"] .portfolio-action-hint-app {
  color: var(--on-surface);
}

html[data-theme="light"] .portfolio-action-hint-adspower,
html[data-theme="light"] .portfolio-action-hint-action-danger {
  border-color: var(--danger-border);
  background: var(--danger-bg);
  color: var(--danger);
}

html[data-theme="light"] .portfolio-action-hint-adspower-head strong,
html[data-theme="light"] .portfolio-action-hint-adspower-head small {
  color: var(--danger);
}

html[data-theme="light"] .run-webview-integration {
  border-color: rgba(168, 85, 247, 0.24);
}

html[data-theme="light"] .webview-badge,
html[data-theme="light"] .run-webview-integration .webview-meta-chip {
  background: rgba(168, 85, 247, 0.10);
  color: #5b21b6;
}

html[data-theme="light"] .run-webview-integration .webview-meta-chip code,
html[data-theme="light"] .run-webview-integration .webview-meta-chip strong {
  color: #5b21b6;
}

html[data-theme="light"] .run-webview-integration .detail-stat-label,
html[data-theme="light"] .webview-hero-link,
html[data-theme="light"] .run-webview-integration .webview-bundle-sample-copy {
  color: #6d28d9;
}

html[data-theme="light"] .run-webview-integration .webview-link-input,
html[data-theme="light"] .form-apple-account input,
html[data-theme="light"] .form-apple-account select,
html[data-theme="light"] .form-apple-account textarea,
html[data-theme="light"] .apple-secret-field input {
  border-color: var(--outline-variant);
  background: var(--theme-control-bg);
  color: var(--on-surface);
  color-scheme: light;
}

html[data-theme="light"] .adspower-settings-details > summary,
html[data-theme="light"] .adspower-schema-details > summary,
html[data-theme="light"] .adspower-profile-details > summary {
  color: var(--on-surface);
}

html[data-theme="light"] .analytics-pie {
  box-shadow:
    inset 0 0 0 1px rgba(15, 23, 42, 0.08),
    0 12px 28px rgba(15, 23, 42, 0.12);
}

html[data-theme="light"] .analytics-pie::after {
  background: var(--theme-card-bg);
  box-shadow: inset 0 0 0 1px var(--outline-variant);
}

html[data-theme="light"] .analytics-pie-legend-row:hover,
html[data-theme="light"] .analytics-pie-legend-row:focus-visible {
  background: rgba(0, 106, 169, 0.06);
}

html[data-theme="light"] .analytics-drilldown-list li,
html[data-theme="light"] .analytics-line-plot,
html[data-theme="light"] .analytics-line-tooltip,
html[data-theme="light"] .analytics-drilldown-panel {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
}

html[data-theme="light"] .analytics-line-plot {
  background:
    linear-gradient(rgba(15, 23, 42, 0.06) 1px, transparent 1px) 0 0 / 100% 25%,
    linear-gradient(90deg, rgba(15, 23, 42, 0.05) 1px, transparent 1px) 0 0 / 25% 100%,
    var(--theme-card-bg);
}

html[data-theme="light"] .analytics-line-y-axis {
  border-right-color: var(--outline-variant);
}

html[data-theme="light"] .analytics-bar-track {
  background: var(--surface-container-high);
}

/* Light theme: remaining dark-only analytics and operator surfaces */
html[data-theme="light"] .analytics-stacked-plot {
  border-color: var(--outline-variant);
  background:
    linear-gradient(rgba(15, 23, 42, 0.06) 1px, transparent 1px) 0 0 / 100% 25%,
    var(--theme-card-bg);
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.02);
}

html[data-theme="light"] .analytics-stacked-column {
  background: var(--surface-container-high);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.10);
}

html[data-theme="light"] .analytics-stacked-label {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .analytics-unit-column {
  border-color: color-mix(in srgb, var(--unit-color), var(--outline-variant) 55%);
  background:
    radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--unit-color), transparent 88%), transparent 32%),
    linear-gradient(180deg, color-mix(in srgb, var(--unit-color), white 90%), var(--theme-card-bg));
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .analytics-unit-column-head h3,
html[data-theme="light"] .analytics-unit-metric strong {
  color: var(--on-surface);
}

html[data-theme="light"] .analytics-unit-metric {
  border-color: var(--outline-variant);
  background: rgba(255, 255, 255, 0.74);
}

html[data-theme="light"] .analytics-unit-metric dt,
html[data-theme="light"] .analytics-unit-metric dd > span {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .analytics-unit-metric--success strong {
  color: var(--success);
}

html[data-theme="light"] .analytics-unit-metric--danger strong {
  color: var(--danger);
}

html[data-theme="light"] .analytics-unit-metric--warning strong {
  color: var(--warning);
}

html[data-theme="light"] .analytics-unit-metric--money strong {
  color: var(--accent);
}

html[data-theme="light"] .smart-analysis-history-panel,
html[data-theme="light"] .smart-analysis-new-panel,
html[data-theme="light"] .smart-analysis-chat-panel,
html[data-theme="light"] .smart-analysis-history-item,
html[data-theme="light"] .smart-analysis-message-body,
html[data-theme="light"] .smart-analysis-compose {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .smart-analysis-history-item:hover,
html[data-theme="light"] .smart-analysis-history-item:focus-visible,
html[data-theme="light"] .smart-analysis-history-item.is-active {
  border-color: var(--accent);
  background: rgba(0, 106, 169, 0.08);
}

html[data-theme="light"] .smart-analysis-history-item strong,
html[data-theme="light"] .smart-analysis-message-body strong,
html[data-theme="light"] .smart-analysis-message-body h1,
html[data-theme="light"] .smart-analysis-message-body h2,
html[data-theme="light"] .smart-analysis-message-body h3 {
  color: var(--on-surface);
}

html[data-theme="light"] .smart-analysis-history-item span,
html[data-theme="light"] .smart-analysis-history-item small,
html[data-theme="light"] .smart-analysis-message-role,
html[data-theme="light"] .smart-analysis-progress-stream::before,
html[data-theme="light"] .smart-analysis-new-form label,
html[data-theme="light"] .smart-analysis-compose label {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .smart-analysis-messages {
  background: var(--surface-container-low);
}

html[data-theme="light"] .smart-analysis-chat-head,
html[data-theme="light"] .smart-analysis-compose {
  border-color: var(--outline-variant);
}

html[data-theme="light"] .smart-analysis-message--user .smart-analysis-message-body {
  border-color: var(--theme-active-border);
  background: var(--theme-active-bg);
}

html[data-theme="light"] .smart-analysis-message-body--progress,
html[data-theme="light"] .smart-analysis-progress-stream {
  background: var(--surface-container-low);
  color: var(--on-surface-variant);
}

html[data-theme="light"] .smart-analysis-new-form input[type="text"],
html[data-theme="light"] .smart-analysis-new-form textarea,
html[data-theme="light"] .smart-analysis-compose textarea {
  border-color: var(--outline-variant);
  background: var(--theme-control-bg);
  color: var(--on-surface);
  color-scheme: light;
}

html[data-theme="light"] .smart-analysis-new-form input::placeholder,
html[data-theme="light"] .smart-analysis-new-form textarea::placeholder,
html[data-theme="light"] .smart-analysis-compose textarea::placeholder {
  color: var(--theme-control-placeholder);
}

html[data-theme="light"] .smart-analysis-attachment-chip,
html[data-theme="light"] .smart-analysis-message-body code {
  border-color: rgba(0, 106, 169, 0.24);
  background: rgba(0, 106, 169, 0.08);
  color: var(--accent);
}

html[data-theme="light"] .smart-analysis-message-body pre {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
  color: var(--on-surface);
}

html[data-theme="light"] .smart-analysis-message-body pre code {
  color: inherit;
}

html[data-theme="light"] .smart-analysis-message-body blockquote {
  border-left-color: var(--accent);
  color: var(--on-surface-variant);
}

html[data-theme="light"] .smart-analysis-message-body th,
html[data-theme="light"] .smart-analysis-message-body td,
html[data-theme="light"] .smart-analysis-message-images img {
  border-color: var(--outline-variant);
}

html[data-theme="light"] .smart-analysis-message-body a {
  color: var(--accent);
}

html[data-theme="light"] .smart-analysis-message-error {
  color: var(--danger);
}

html[data-theme="light"] .admin-user-form,
html[data-theme="light"] .admin-table-wrap,
html[data-theme="light"] .admin-table-sticky-head {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .admin-user-form--create {
  background:
    radial-gradient(circle at top right, rgba(0, 106, 169, 0.10), transparent 18rem),
    var(--theme-card-bg);
}

html[data-theme="light"] .admin-switch,
html[data-theme="light"] .admin-access-check strong,
html[data-theme="light"] .admin-users-table__user {
  color: var(--on-surface);
}

html[data-theme="light"] .admin-access-check {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
  color: var(--on-surface);
}

html[data-theme="light"] .admin-users-table thead th {
  background: var(--surface-container-low);
  color: var(--on-surface-variant);
  box-shadow: 0 1px 0 var(--outline-variant);
}

html[data-theme="light"] .admin-users-table th,
html[data-theme="light"] .admin-users-table td {
  border-bottom-color: var(--outline-variant);
  border-right-color: var(--outline-variant);
}

html[data-theme="light"] .admin-users-table tbody tr {
  background: var(--theme-card-bg);
}

html[data-theme="light"] .admin-users-table tbody tr:nth-child(even) {
  background: var(--surface-container-low);
}

html[data-theme="light"] .admin-table-input,
html[data-theme="light"] .admin-table-select,
html[data-theme="light"] .admin-binom-filter summary,
html[data-theme="light"] .admin-binom-filter-panel {
  border-color: var(--outline-variant);
  background: var(--theme-control-bg);
  color: var(--on-surface);
  color-scheme: light;
}

html[data-theme="light"] .admin-table-input::placeholder {
  color: var(--theme-control-placeholder);
}

html[data-theme="light"] .admin-table-input:focus-visible {
  outline-color: var(--theme-focus-ring);
}

html[data-theme="light"] .admin-table-mini-check,
html[data-theme="light"] .admin-generated-password__label,
html[data-theme="light"] .admin-users-table__user .hint {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .admin-generated-password {
  border-color: var(--success-border);
  background: var(--success-bg);
  color: var(--on-surface);
}

html[data-theme="light"] .admin-generated-password code {
  color: var(--success);
}

html[data-theme="light"] .ssh-guide-code,
html[data-theme="light"] .ssh-guide-body code,
html[data-theme="light"] .step-msg-scroll,
html[data-theme="light"] .step-ci-refresh,
html[data-theme="light"] .step-ci-json {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
}

html[data-theme="light"] .ssh-guide-body {
  color: var(--on-surface);
}

html[data-theme="light"] .ssh-guide-body code,
html[data-theme="light"] .step-ci-json {
  background: var(--surface-container-low);
}

html[data-theme="light"] .step-ci-refresh h2,
html[data-theme="light"] .step-ci-refresh strong {
  color: var(--on-surface);
}

html[data-theme="light"] .step-ci-refresh-h3,
html[data-theme="light"] .step-ci-retry-hint {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .step-msg {
  border-bottom-color: var(--outline-variant);
  color: var(--on-surface);
}

html[data-theme="light"] .step-msg--phase,
html[data-theme="light"] .step-msg--thought {
  background: var(--surface-container-low);
  color: var(--on-surface-variant);
}

html[data-theme="light"] .step-msg--result {
  background: rgba(0, 106, 169, 0.06);
}

html[data-theme="light"] .step-msg--tool {
  background: var(--success-bg);
}

html[data-theme="light"] .step-msg--queue {
  color: var(--warning);
  background: var(--warning-bg);
  box-shadow: inset 3px 0 0 var(--warning-border);
}

html[data-theme="light"] .ci-status-pill--success,
html[data-theme="light"] .detail-status-pill--completed,
html[data-theme="light"] .detail-status-pill--success,
html[data-theme="light"] .detail-status-pill--passed,
html[data-theme="light"] .pill--success,
html[data-theme="light"] .portfolio-board-card[data-asc-status="published"] .portfolio-board-card-pill,
html[data-theme="light"] .portfolio-board-card[data-asc-status="ready_for_sale"] .portfolio-board-card-pill {
  border-color: var(--success-border);
  background: var(--success-bg);
  color: var(--success);
}

html[data-theme="light"] .ci-status-pill--pending,
html[data-theme="light"] .ci-status-pill--warning,
html[data-theme="light"] .detail-status-pill--warning,
html[data-theme="light"] .detail-status-pill--waiting,
html[data-theme="light"] .pill--warning,
html[data-theme="light"] .pill--waiting,
html[data-theme="light"] .portfolio-board-card[data-asc-status="in_review"] .portfolio-board-card-pill {
  border-color: var(--warning-border);
  background: var(--warning-bg);
  color: var(--warning);
}

html[data-theme="light"] .ci-status-pill--failed,
html[data-theme="light"] .ci-status-pill--cancelled,
html[data-theme="light"] .detail-status-pill--failed,
html[data-theme="light"] .detail-status-pill--error,
html[data-theme="light"] .detail-status-pill--cancelled,
html[data-theme="light"] .pill--failed,
html[data-theme="light"] .portfolio-board-card[data-asc-status="rejected"] .portfolio-board-card-pill,
html[data-theme="light"] .portfolio-board-card[data-asc-status="removed"] .portfolio-board-card-pill {
  border-color: var(--danger-border);
  background: var(--danger-bg);
  color: var(--danger);
}

html[data-theme="light"] .portfolio-board-card-asc-broken,
html[data-theme="light"] .portfolio-modal-asc-broken,
html[data-theme="light"] .portfolio-board-card[data-asc-tracking-broken="1"] .portfolio-board-card-asc-refresh {
  border-color: var(--danger-border);
  background: var(--danger-bg);
  color: var(--danger);
}
html[data-theme="light"] .portfolio-board-card[data-asc-status] .portfolio-board-card-asc-status--sales-closed,
html[data-theme="light"] .portfolio-board-card-asc-status--sales-closed {
  border-color: var(--danger-border);
  background: var(--danger-bg);
  color: var(--danger);
}
html[data-theme="light"] .portfolio-board-card[data-asc-tracking-broken="1"] .portfolio-board-card-asc-status--tracking-paused,
html[data-theme="light"] .portfolio-board-card-asc-status--tracking-error,
html[data-theme="light"] .portfolio-board-card-asc-status--tracking-paused {
  border-color: var(--warning-border);
  background: var(--warning-bg);
  color: var(--warning);
}

html[data-theme="light"] .detail-status-pill--pending,
html[data-theme="light"] .detail-status-pill--queued,
html[data-theme="light"] .detail-status-pill--not_started,
html[data-theme="light"] .ci-status-pill--skipped,
html[data-theme="light"] .ci-status-pill--unknown,
html[data-theme="light"] .pill--neutral {
  border-color: var(--outline-variant);
  background: var(--surface-container-high);
  color: var(--on-surface-variant);
}

html[data-theme="light"] .portfolio-board-auto-tag {
  border-color: rgba(0, 106, 169, 0.24);
  background: rgba(0, 106, 169, 0.10);
  color: var(--accent);
}

html[data-theme="light"] .portfolio-board-manual-tag {
  border-color: var(--outline-variant);
  background: var(--surface-container-high);
  color: var(--on-surface-variant);
}

html[data-theme="light"] .pill--webview {
  border-color: var(--warning-border);
  background: var(--warning-bg);
  color: var(--warning);
  box-shadow: none;
}

html[data-theme="light"] .pill--webview-done {
  border-color: var(--success-border);
  background: var(--success-bg);
  color: var(--success);
}

html[data-theme="light"] .pill--webview[data-webview-pill]:hover,
html[data-theme="light"] .pill--webview[data-webview-pill]:focus {
  background: rgba(245, 158, 11, 0.22);
}

html[data-theme="light"] .pill--webview-done[data-webview-pill]:hover,
html[data-theme="light"] .pill--webview-done[data-webview-pill]:focus {
  background: rgba(16, 185, 129, 0.18);
}

html[data-theme="light"] .nav-app-search-input {
  border-color: var(--theme-nav-border);
  background: var(--theme-control-bg-strong);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .nav-app-search-input:focus {
  border-color: var(--accent);
  background: var(--theme-control-bg);
  color: var(--on-surface);
  box-shadow: 0 0 0 3px var(--theme-focus-ring), var(--elevation-1);
}

html[data-theme="light"] .nav-app-search-input::placeholder,
html[data-theme="light"] .nav-app-search-icon {
  color: var(--theme-control-placeholder);
  border-color: var(--theme-control-placeholder);
}

html[data-theme="light"] .nav-app-search-icon::after {
  background: var(--theme-control-placeholder);
}

html[data-theme="light"] .nav-app-search-busy-bar {
  background: var(--surface-container-high);
}

html[data-theme="light"] .nav-app-search-result-row {
  border-color: var(--outline-variant);
}

html[data-theme="light"] .nav-app-search-result-row:hover,
html[data-theme="light"] .nav-app-search-result-row:focus-within {
  background: var(--surface-container-high);
}

html[data-theme="light"] .nav-app-search-action {
  border-color: rgba(0, 106, 169, 0.24);
  background: rgba(0, 106, 169, 0.08);
  color: var(--accent);
}

html[data-theme="light"] .nav-app-search-action:hover,
html[data-theme="light"] .nav-app-search-action:focus-visible {
  border-color: rgba(0, 106, 169, 0.42);
  background: rgba(0, 106, 169, 0.08);
}

html[data-theme="light"] .intro-panel,
html[data-theme="light"] details.codemagic-settings-help,
html[data-theme="light"] .generated-app-summary,
html[data-theme="light"] .apps-new-run-menu-list {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .apps-new-run-menu-list {
  background: var(--theme-card-bg);
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.16);
}

html[data-theme="light"] .apps-new-run-menu-item {
  color: var(--on-surface);
}

html[data-theme="light"] .apps-new-run-menu-item:hover,
html[data-theme="light"] .apps-new-run-menu-item:focus-visible {
  background: var(--theme-row-hover);
  color: var(--accent);
  outline: none;
}

html[data-theme="light"] .field-help-q {
  border: 1px solid var(--outline-variant);
  background: var(--surface-container-high);
  color: var(--on-surface-variant);
}

html[data-theme="light"] .field-help-q:hover,
html[data-theme="light"] .field-help-q:focus-visible {
  border-color: var(--theme-active-border);
  background: var(--theme-active-bg);
  color: var(--accent);
  outline: none;
}

html[data-theme="light"] .field-help-text {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface-variant);
  box-shadow: var(--elevation-2);
}

html[data-theme="light"] .wizard-progress-track {
  background: var(--surface-container-high);
}

html[data-theme="light"] .generated-app-summary {
  border-color: var(--theme-active-border);
  background:
    linear-gradient(135deg, rgba(0, 106, 169, 0.08), rgba(255, 255, 255, 0.94)),
    var(--theme-card-bg);
}

html[data-theme="light"] .generated-app-summary__eyebrow,
html[data-theme="light"] .generated-app-summary__item dt {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .generated-app-summary__item dd,
html[data-theme="light"] .iap-toggle-copy strong,
html[data-theme="light"] .iap-product-title,
html[data-theme="light"] .iap-asc-price,
html[data-theme="light"] .store-refresh-form-card-head h4,
html[data-theme="light"] .store-refresh-submit-copy h4,
html[data-theme="light"] .screenshot-order-head span {
  color: var(--on-surface);
}

html[data-theme="light"] .idea-mode-tabs {
  border-bottom-color: var(--outline-variant);
}

html[data-theme="light"] .idea-mode-tab:hover {
  background: var(--theme-row-hover);
}

html[data-theme="light"] .idea-mode-tab--active {
  border-color: var(--outline-variant);
  border-bottom-color: var(--theme-card-bg);
  background: var(--theme-card-bg);
  color: var(--on-surface);
}

html[data-theme="light"] .form label.iap-toggle-card,
html[data-theme="light"] label.iap-toggle-card,
html[data-theme="light"] .iap-settings-body,
html[data-theme="light"] .iap-product-row,
html[data-theme="light"] .iap-asc-check,
html[data-theme="light"] .iap-asc-summary__meta,
html[data-theme="light"] .iap-asc-card {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
  color: var(--on-surface);
}

html[data-theme="light"] .form label.iap-toggle-card:hover {
  border-color: var(--theme-active-border);
  background: var(--theme-row-hover);
}

html[data-theme="light"] label.iap-toggle-card:hover {
  border-color: var(--theme-active-border);
  background: var(--theme-row-hover);
}

html[data-theme="light"] .iap-settings-body,
html[data-theme="light"] .iap-asc-check {
  background: var(--theme-card-bg);
}

html[data-theme="light"] .iap-product-row,
html[data-theme="light"] .iap-asc-summary__meta,
html[data-theme="light"] .iap-asc-card {
  background: var(--surface-container-low);
}

html[data-theme="light"] .iap-toggle-copy small,
html[data-theme="light"] .iap-asc-card p,
html[data-theme="light"] .store-refresh-scope-help p,
html[data-theme="light"] .store-refresh-panel-head p[data-store-refresh-screenshots-help],
html[data-theme="light"] .store-refresh-form-card-head span,
html[data-theme="light"] .store-refresh-mode-card small,
html[data-theme="light"] .store-refresh-toggle-card small,
html[data-theme="light"] .store-refresh-field-note,
html[data-theme="light"] .store-refresh-input-hint,
html[data-theme="light"] .store-refresh-submit-copy p,
html[data-theme="light"] .store-refresh-upload-card > small,
html[data-theme="light"] .store-refresh-hard-existing-head p,
html[data-theme="light"] .screenshot-order-head small,
html[data-theme="light"] .screenshot-order-name,
html[data-theme="light"] .store-refresh-existing-shot-label {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .iap-toggle-control {
  border-color: var(--outline);
  background: var(--surface-container-highest);
}

html[data-theme="light"] .iap-toggle-control::after {
  background: var(--theme-card-bg);
}

html[data-theme="light"] .iap-toggle-card input[type="checkbox"]:checked + .iap-toggle-control {
  border-color: var(--accent);
  background: var(--accent);
}

html[data-theme="light"] .iap-asc-card--ok {
  border-left-color: var(--success);
}

html[data-theme="light"] .iap-asc-card--warning {
  border-left-color: var(--warning);
}

html[data-theme="light"] .iap-asc-card--error {
  border-left-color: var(--danger);
}

html[data-theme="light"] .iap-asc-messages--warn {
  color: var(--warning);
}

html[data-theme="light"] .store-refresh-ai-status[data-status-kind="ready"],
html[data-theme="light"] .store-refresh-locale-status[data-status-kind="ready"] {
  color: var(--success);
}

html[data-theme="light"] .iap-asc-messages--error,
html[data-theme="light"] .store-refresh-ai-status[data-status-kind="error"],
html[data-theme="light"] .store-refresh-locale-status[data-status-kind="error"] {
  color: var(--danger);
}

html[data-theme="light"] .store-refresh-product-eyebrow,
html[data-theme="light"] .store-refresh-product-main p,
html[data-theme="light"] .store-refresh-product-meta span {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .store-refresh-product-meta span {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
}

html[data-theme="light"] .store-refresh-appstore-panel,
html[data-theme="light"] .store-refresh-appstore-toolbar,
html[data-theme="light"] .store-refresh-form-card,
html[data-theme="light"] .store-refresh-submit-card,
html[data-theme="light"] .store-refresh-split-card,
html[data-theme="light"] .store-refresh-locale-picker,
html[data-theme="light"] .store-refresh-combined-order,
html[data-theme="light"] .screenshot-order,
html[data-theme="light"] .store-refresh-upload-card,
html[data-theme="light"] .store-refresh-hard-existing,
html[data-theme="light"] .store-refresh-existing-shot {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .store-refresh-appstore-toolbar,
html[data-theme="light"] .store-refresh-form-card,
html[data-theme="light"] .store-refresh-submit-card,
html[data-theme="light"] .store-refresh-split-card,
html[data-theme="light"] .store-refresh-combined-order,
html[data-theme="light"] .screenshot-order {
  background: var(--surface-container-low);
}

html[data-theme="light"] .store-refresh-tabbar,
html[data-theme="light"] .store-refresh-locale-tools,
html[data-theme="light"] .store-refresh-locale-modes,
html[data-theme="light"] .store-refresh-split-name-fields {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
}

html[data-theme="light"] .store-refresh-tab {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .store-refresh-tab:hover,
html[data-theme="light"] .store-refresh-tab:focus-visible {
  background: var(--theme-row-hover);
  color: var(--accent);
}

html[data-theme="light"] .store-refresh-tab.is-active {
  background: var(--theme-card-bg);
  color: var(--on-surface);
}

html[data-theme="light"] .store-refresh-pill,
html[data-theme="light"] .store-refresh-locale-tool,
html[data-theme="light"] .store-refresh-locale-mode,
html[data-theme="light"] .store-refresh-locale-row,
html[data-theme="light"] .store-refresh-mode-card,
html[data-theme="light"] .store-refresh-toggle-card,
html[data-theme="light"] .screenshot-order-item,
html[data-theme="light"] .screenshot-order-btn {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
  color: var(--on-surface);
}

html[data-theme="light"] .store-refresh-pill::before,
html[data-theme="light"] .store-refresh-locale-mode::before,
html[data-theme="light"] .store-refresh-locale-row::before,
html[data-theme="light"] .store-refresh-mode-card::before,
html[data-theme="light"] .store-refresh-toggle-card::before {
  border-color: var(--outline);
  background: var(--theme-card-bg);
  box-shadow: inset 0 0 0 2px var(--theme-card-bg);
}

html[data-theme="light"] .store-refresh-pill:has(input:checked),
html[data-theme="light"] .store-refresh-locale-mode:has(input:checked),
html[data-theme="light"] .store-refresh-locale-row:has(> input[data-store-refresh-locale-code]:checked),
html[data-theme="light"] .store-refresh-mode-card:has(input:checked),
html[data-theme="light"] .store-refresh-toggle-card:has(input:checked) {
  border-color: var(--theme-active-border);
  background: var(--theme-active-bg);
  color: var(--accent);
}

html[data-theme="light"] .store-refresh-locale-row:has(> input[data-store-refresh-locale-code]:checked) {
  background: #e8f3ff;
}

html[data-theme="light"] .store-refresh-pill:has(input:checked)::before,
html[data-theme="light"] .store-refresh-locale-mode:has(input:checked)::before,
html[data-theme="light"] .store-refresh-locale-row:has(> input[data-store-refresh-locale-code]:checked)::before,
html[data-theme="light"] .store-refresh-mode-card:has(input:checked)::before,
html[data-theme="light"] .store-refresh-toggle-card:has(input:checked)::before {
  border-color: var(--accent);
  background: var(--accent);
}

html[data-theme="light"] .store-refresh-locale-tool:hover,
html[data-theme="light"] .store-refresh-locale-tool:focus-visible,
html[data-theme="light"] .store-refresh-locale-row:hover,
html[data-theme="light"] .screenshot-order-btn:hover,
html[data-theme="light"] .screenshot-order-btn:focus-visible {
  border-color: var(--theme-active-border);
  background: var(--theme-row-hover);
  color: var(--accent);
}

html[data-theme="light"] .store-refresh-locale-tool--translate {
  border-color: var(--success-border);
  background: var(--success-bg);
  color: var(--success);
}

html[data-theme="light"] .store-refresh-locale-status {
  color: var(--on-surface-variant);
}

html[data-theme="light"] .store-refresh-locale-code,
html[data-theme="light"] .store-refresh-locale-row.is-primary .store-refresh-locale-code,
html[data-theme="light"] .screenshot-order-num,
html[data-theme="light"] .screenshot-order-name strong {
  color: var(--accent);
}

html[data-theme="light"] .store-refresh-locale-name,
html[data-theme="light"] .store-refresh-locale-row.is-primary .store-refresh-locale-name,
html[data-theme="light"] .store-refresh-mode-card span,
html[data-theme="light"] .store-refresh-toggle-card span,
html[data-theme="light"] .store-refresh-upload-card > span,
html[data-theme="light"] .store-refresh-hard-existing-head h4 {
  color: var(--on-surface);
}

html[data-theme="light"] .store-refresh-locale-recommendation {
  color: #d89000;
  text-shadow: 0 0 7px rgba(216, 144, 0, 0.24);
}

html[data-theme="light"] .store-refresh-locale-row.is-primary,
html[data-theme="light"] .store-refresh-locale-row.is-primary:hover,
html[data-theme="light"] .store-refresh-locale-row.is-primary:has(> input[data-store-refresh-locale-code]:checked) {
  border-color: var(--theme-active-border);
  background: #e8f3ff;
  box-shadow: inset 4px 0 0 var(--accent);
}

html[data-theme="light"] .store-refresh-locale-mode.is-disabled,
html[data-theme="light"] .store-refresh-locale-row.is-disabled,
html[data-theme="light"] .store-refresh-existing-shot:has(input:disabled),
html[data-theme="light"] .store-refresh-fixed-terms.is-disabled {
  opacity: 0.64;
}

html[data-theme="light"] .store-refresh-locale-mode.is-disabled:hover,
html[data-theme="light"] .store-refresh-locale-row.is-disabled:hover {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
}

html[data-theme="light"] .store-refresh-existing-shot:has(input:checked) {
  border-color: var(--danger-border);
  background: var(--danger-bg);
}

html[data-theme="light"] .store-refresh-existing-shot-frame,
html[data-theme="light"] .screenshot-order-thumb,
html[data-theme="light"] .sr-shots-source-card__frame,
html[data-theme="light"] .sr-shots-modal__asset-frame {
  background: var(--surface-container-high);
}

html[data-theme="light"] .sr-protect-btn,
html[data-theme="light"] .sr-protected-chip,
html[data-theme="light"] .store-refresh-locale-primary-badge {
  border-color: var(--theme-active-border);
  background: var(--theme-active-bg);
  color: var(--accent);
}

html[data-theme="light"] .sr-protect-btn--ghost {
  border-color: var(--outline-variant);
  background: var(--surface-container-low);
  color: var(--on-surface-variant);
}

html[data-theme="light"] .sr-shots-queue-remove {
  border-color: var(--danger-border);
  background: var(--danger-bg);
  color: var(--danger);
}

html[data-theme="light"] .step-icon-upload,
html[data-theme="light"] .step-detail-surface--icon,
html[data-theme="light"] .step-graphics-grid--archived .step-graphics-item {
  border-color: var(--outline-variant);
  background: var(--theme-card-bg);
  color: var(--on-surface);
  box-shadow: var(--elevation-1);
}

html[data-theme="light"] .step-graphics-panel--marketing {
  border-color: var(--success-border);
  background: var(--success-bg);
}

html[data-theme="light"] .step-graphics-panel--archive {
  border-color: var(--warning-border);
  background: var(--warning-bg);
}
/* Browser-native lazy layout/paint for the large operational collections. */
@supports (content-visibility: auto) {
  .aso-dashboard-grid > .aso-app-card {
    content-visibility: auto;
    contain-intrinsic-size: auto 430px;
  }

  .portfolio-board-col-body > .portfolio-board-card,
  .portfolio-board-col-body > .portfolio-board-launch-card {
    content-visibility: auto;
    contain-intrinsic-size: auto 360px;
  }

  .apple-accounts-table > tbody > .apple-row {
    content-visibility: auto;
    contain-intrinsic-size: auto 64px;
  }
}

/* Native service monitoring ------------------------------------------------ */
.page-service-monitoring {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--primary) 4%, var(--bg)) 0, var(--bg) 340px);
}

.page-service-monitoring .container {
  max-width: 1500px;
  padding-top: 28px;
  padding-bottom: 56px;
}

.service-monitoring {
  --monitoring-blue: #5aa7ff;
  --monitoring-violet: #9c8cff;
  --monitoring-green: #35c995;
  --monitoring-amber: #eab54d;
  --monitoring-red: #ff6f7d;
  --monitoring-cyan: #35c8d7;
  display: grid;
  gap: 18px;
}

.service-monitoring-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 410px);
  gap: 32px;
  align-items: end;
  padding: 12px 2px 10px;
}

.service-monitoring-heading {
  max-width: 780px;
}

.service-monitoring-kicker,
.service-monitoring-section-kicker {
  margin: 0 0 7px;
  color: var(--primary, #7cc4ff);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.service-monitoring-heading h1 {
  margin: 0;
  color: var(--on-surface, #f8fafc);
  font-size: clamp(30px, 4vw, 48px);
  font-weight: 760;
  letter-spacing: -0.045em;
  line-height: 1.02;
}

.service-monitoring-heading > p:last-child {
  max-width: 720px;
  margin: 13px 0 0;
  color: var(--on-surface-variant, #aeb8c5);
  font-size: 14px;
  line-height: 1.65;
}

.service-monitoring-header-tools {
  display: grid;
  gap: 10px;
}

.service-monitoring-source {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid var(--outline-variant, rgba(148, 163, 184, 0.18));
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface-container-low) 90%, transparent);
  padding: 11px 12px;
}

.service-monitoring-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--on-surface, #edf2f7);
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
}

.service-monitoring-status-dot {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 50%;
  background: #94a3b8;
  box-shadow: 0 0 0 4px rgba(148, 163, 184, 0.12);
}

.service-monitoring-status.is-loading .service-monitoring-status-dot {
  background: var(--monitoring-amber);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--monitoring-amber) 16%, transparent);
  animation: monitoring-status-pulse 1.2s ease-in-out infinite;
}

.service-monitoring-status.is-ready .service-monitoring-status-dot {
  background: var(--monitoring-green);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--monitoring-green) 16%, transparent);
}

.service-monitoring-status.is-error .service-monitoring-status-dot {
  background: var(--monitoring-red);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--monitoring-red) 16%, transparent);
}

@keyframes monitoring-status-pulse {
  50% { opacity: 0.5; transform: scale(0.84); }
}

.service-monitoring-source-address {
  min-width: 0;
  display: grid;
  gap: 2px;
  text-align: right;
}

.service-monitoring-source-address span {
  color: var(--on-surface-variant, #8f9aa8);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.service-monitoring-source-address code {
  overflow: hidden;
  color: var(--on-surface-variant, #b9c2cd);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.service-monitoring-back-link {
  width: 100%;
}

.service-monitoring-command-bar {
  position: sticky;
  top: 70px;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border: 1px solid color-mix(in srgb, var(--outline-variant) 82%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface-container-low) 91%, transparent);
  padding: 8px 10px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.14);
  backdrop-filter: blur(18px);
}

.service-monitoring-period-control,
.service-monitoring-toolbar-meta {
  display: flex;
  align-items: center;
  gap: 11px;
}

.service-monitoring-control-label {
  padding-left: 4px;
  color: var(--on-surface-variant, #94a3b8);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.service-monitoring-periods {
  display: inline-flex;
  gap: 3px;
  border: 1px solid color-mix(in srgb, var(--outline-variant) 64%, transparent);
  border-radius: 10px;
  background: var(--surface-container, rgba(30, 41, 59, 0.7));
  padding: 3px;
}

.service-monitoring-periods button {
  appearance: none;
  min-height: 32px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--on-surface-variant, #9ba7b5);
  padding: 6px 12px;
  font: inherit;
  font-size: 11px;
  font-weight: 760;
  cursor: pointer;
  transition: background-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.service-monitoring-periods button:hover {
  color: var(--on-surface, #f8fafc);
  background: color-mix(in srgb, var(--on-surface) 6%, transparent);
}

.service-monitoring-periods button.is-active {
  background: var(--primary-container, rgba(29, 155, 240, 0.2));
  color: var(--on-primary-container, #d9ecff);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 28%, transparent);
}

html[data-theme="light"] .service-monitoring-periods button.is-active {
  background: color-mix(in srgb, var(--primary) 17%, var(--surface-container));
  color: #0a3a63;
}

.service-monitoring-periods button:focus-visible,
.service-monitoring-command-bar .btn:focus-visible,
.service-monitoring-back-link:focus-visible {
  outline: 2px solid var(--primary, #5aa7ff);
  outline-offset: 2px;
}

.service-monitoring-toolbar-meta {
  color: var(--on-surface-variant, #94a3b8);
  font-size: 11px;
  white-space: nowrap;
}

.service-monitoring-error {
  margin: 0;
}

.service-monitoring-overview,
.service-monitoring-section {
  min-width: 0;
  border: 1px solid var(--outline-variant, rgba(148, 163, 184, 0.18));
  border-radius: 18px;
  background: var(--surface-container-low, rgba(15, 23, 42, 0.72));
  padding: 18px;
  box-shadow: var(--elevation-1, 0 12px 30px rgba(2, 6, 23, 0.15));
}

.service-monitoring-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 15px;
}

.service-monitoring-section-head--overview {
  margin-bottom: 16px;
}

.service-monitoring-section-head h2 {
  margin: 0;
  color: var(--on-surface, #f8fafc);
  font-size: 19px;
  letter-spacing: -0.02em;
}

.service-monitoring-section-head > p {
  max-width: 500px;
  margin: 0;
  color: var(--on-surface-variant, #94a3b8);
  font-size: 11px;
  line-height: 1.5;
  text-align: right;
}

.service-monitoring-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(420px, 0.88fr);
  gap: 12px;
}

.service-monitoring-traffic-summary,
.service-monitoring-resource-summary {
  min-width: 0;
  border: 1px solid color-mix(in srgb, var(--outline-variant) 72%, transparent);
  border-radius: 14px;
  background: var(--surface-container, rgba(30, 41, 59, 0.62));
}

.service-monitoring-traffic-summary {
  display: grid;
  grid-template-columns: minmax(210px, 0.78fr) minmax(0, 1.22fr);
  overflow: hidden;
}

.service-monitoring-primary-metric {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: 24px;
  border-right: 1px solid color-mix(in srgb, var(--outline-variant) 68%, transparent);
  background: color-mix(in srgb, var(--primary) 6%, var(--surface-container));
}

.service-monitoring-primary-metric > span,
.service-monitoring-signal-grid span,
.service-monitoring-resource-head span,
.service-monitoring-resource-row span,
.service-monitoring-runtime-grid span {
  color: var(--on-surface-variant, #94a3b8);
  font-size: 10px;
  font-weight: 720;
}

.service-monitoring-primary-metric > span {
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.service-monitoring-primary-metric strong {
  overflow: hidden;
  margin-top: 12px;
  color: var(--on-surface, #f8fafc);
  font-size: clamp(36px, 3.7vw, 50px);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.065em;
  line-height: 0.95;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.service-monitoring-primary-metric small,
.service-monitoring-signal-grid small,
.service-monitoring-resource-row small {
  color: var(--on-surface-variant, #8e9aa8);
  font-size: 10px;
}

.service-monitoring-primary-metric small {
  margin-top: 13px;
  line-height: 1.45;
}

.service-monitoring-signal-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.service-monitoring-signal-grid > div {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 7px;
  padding: 18px;
  border-right: 1px solid color-mix(in srgb, var(--outline-variant) 55%, transparent);
}

.service-monitoring-signal-grid > div:last-child {
  border-right: 0;
}

.service-monitoring-signal-grid strong {
  overflow: hidden;
  color: var(--on-surface, #f8fafc);
  font-size: clamp(22px, 2.2vw, 30px);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.035em;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.service-monitoring-resource-summary {
  padding: 15px 16px 13px;
}

.service-monitoring-resource-head,
.service-monitoring-resource-row > div:first-child {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.service-monitoring-resource-head {
  margin-bottom: 12px;
}

.service-monitoring-resource-head h3 {
  margin: 2px 0 0;
  color: var(--on-surface, #f8fafc);
  font-size: 15px;
}

.service-monitoring-resource-head > small {
  color: var(--on-surface-variant, #8995a3);
  font-size: 9px;
}

.service-monitoring-resource-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px 16px;
}

.service-monitoring-resource-row {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.service-monitoring-resource-row strong {
  color: var(--on-surface, #f8fafc);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.service-monitoring-meter {
  --monitoring-meter-value: 0%;
  position: relative;
  height: 5px;
  overflow: hidden;
  border-radius: 3px;
  background: color-mix(in srgb, var(--on-surface) 9%, transparent);
}

.service-monitoring-meter span {
  display: block;
  width: var(--monitoring-meter-value);
  height: 100%;
  border-radius: inherit;
  background: var(--monitoring-blue);
  transition: width 260ms ease;
}

[data-monitoring-meter="memory_percent"] span { background: var(--monitoring-amber); }
[data-monitoring-meter="disk_percent"] span { background: var(--monitoring-violet); }
[data-monitoring-meter="workers"] span { background: var(--monitoring-cyan); }

.service-monitoring-charts {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 12px;
}

.service-monitoring-chart-card {
  grid-column: span 3;
  min-width: 0;
  border: 1px solid color-mix(in srgb, var(--outline-variant) 72%, transparent);
  border-radius: 14px;
  background: var(--surface-container, rgba(30, 41, 59, 0.55));
  padding: 15px 15px 8px;
}

.service-monitoring-chart-card--lead {
  grid-column: span 6;
}

.service-monitoring-chart-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.service-monitoring-chart-card header span {
  color: var(--on-surface-variant, #94a3b8);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.service-monitoring-chart-card h3 {
  margin: 3px 0 0;
  color: var(--on-surface, #f8fafc);
  font-size: 14px;
  letter-spacing: -0.012em;
}

.service-monitoring-chart-card header > strong {
  color: var(--on-surface, #f8fafc);
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.service-monitoring-chart {
  position: relative;
  min-height: 184px;
  margin-top: 6px;
}

.service-monitoring-chart-card--lead .service-monitoring-chart,
.service-monitoring-chart-card--database .service-monitoring-chart {
  min-height: 220px;
}

.service-monitoring-chart svg {
  display: block;
  width: 100%;
  height: auto;
  min-height: 174px;
  overflow: visible;
}

.service-monitoring-chart-card--lead .service-monitoring-chart svg,
.service-monitoring-chart-card--database .service-monitoring-chart svg {
  min-height: 210px;
}

.service-monitoring-chart-empty {
  min-height: 174px;
  display: grid;
  place-items: center;
  padding: 20px;
  color: var(--on-surface-variant, #7f8b99);
  font-size: 11px;
  line-height: 1.5;
  text-align: center;
}

.monitor-chart-grid {
  stroke: color-mix(in srgb, var(--outline-variant, #64748b) 50%, transparent);
  stroke-width: 1;
  stroke-dasharray: 2 7;
}

.monitor-chart-label {
  fill: var(--on-surface-variant, #94a3b8);
  font-family: inherit;
  font-size: 10px;
  font-weight: 650;
}

.monitor-chart-line,
.monitor-chart-point {
  vector-effect: non-scaling-stroke;
}

.monitor-chart-line {
  fill: none;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.monitor-chart-point {
  stroke: var(--surface-container, #17212c);
  stroke-width: 2;
}

.monitor-chart-line--blue { stroke: var(--monitoring-blue); }
.monitor-chart-line--violet { stroke: var(--monitoring-violet); }
.monitor-chart-line--red { stroke: var(--monitoring-red); }
.monitor-chart-line--green { stroke: var(--monitoring-green); }
.monitor-chart-line--amber { stroke: var(--monitoring-amber); }
.monitor-chart-line--cyan { stroke: var(--monitoring-cyan); }
.monitor-chart-point--blue { fill: var(--monitoring-blue); }
.monitor-chart-point--violet { fill: var(--monitoring-violet); }
.monitor-chart-point--red { fill: var(--monitoring-red); }
.monitor-chart-point--green { fill: var(--monitoring-green); }
.monitor-chart-point--amber { fill: var(--monitoring-amber); }
.monitor-chart-point--cyan { fill: var(--monitoring-cyan); }
.monitor-chart-stop { stop-opacity: 0.16; }
.monitor-chart-stop--blue { stop-color: var(--monitoring-blue); }
.monitor-chart-stop--violet { stop-color: var(--monitoring-violet); }
.monitor-chart-stop--red { stop-color: var(--monitoring-red); }
.monitor-chart-stop--green { stop-color: var(--monitoring-green); }
.monitor-chart-stop--amber { stop-color: var(--monitoring-amber); }
.monitor-chart-stop--cyan { stop-color: var(--monitoring-cyan); }
.monitor-chart-stop--end { stop-color: transparent; stop-opacity: 0; }

.service-monitoring-runtime-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--outline-variant) 68%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--outline-variant) 68%, transparent);
}

.service-monitoring-runtime-grid > div {
  min-width: 0;
  display: grid;
  gap: 7px;
  background: var(--surface-container, rgba(30, 41, 59, 0.55));
  padding: 14px 15px;
}

.service-monitoring-runtime-grid strong {
  overflow: hidden;
  color: var(--on-surface, #f8fafc);
  font-size: 18px;
  font-variant-numeric: tabular-nums;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.service-monitoring-sql-summary {
  margin-bottom: 12px;
}

.service-monitoring-sql-summary [data-monitoring-sql="top_table"] {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 13px;
}

.service-monitoring-sql-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
  gap: 12px;
  align-items: stretch;
}

.service-monitoring-sql-layout > .service-monitoring-chart-card {
  grid-column: auto;
  height: 100%;
}

.service-monitoring-table-wrap {
  max-width: 100%;
  max-height: 540px;
  overflow: auto;
  border: 1px solid color-mix(in srgb, var(--outline-variant) 70%, transparent);
  border-radius: 12px;
  background: var(--surface-container, rgba(30, 41, 59, 0.45));
}

.service-monitoring-routes table,
.service-monitoring-sql table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

.service-monitoring-routes th,
.service-monitoring-routes td,
.service-monitoring-sql th,
.service-monitoring-sql td {
  border-bottom: 1px solid color-mix(in srgb, var(--outline-variant) 58%, transparent);
  padding: 10px 12px;
  text-align: right;
  white-space: nowrap;
}

.service-monitoring-routes th:first-child,
.service-monitoring-routes td:first-child,
.service-monitoring-sql th:first-child,
.service-monitoring-sql td:first-child {
  width: 100%;
  text-align: left;
}

.service-monitoring-routes th,
.service-monitoring-sql th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--surface-container-high, #202b37);
  color: var(--on-surface-variant, #a2adba);
  font-size: 9px;
  letter-spacing: 0.075em;
  text-transform: uppercase;
}

.service-monitoring-routes tbody tr:hover,
.service-monitoring-sql tbody tr:hover {
  background: color-mix(in srgb, var(--primary) 5%, transparent);
}

.service-monitoring-routes tr:last-child td,
.service-monitoring-sql tr:last-child td {
  border-bottom: 0;
}

.service-monitoring-route-name {
  max-width: 620px;
  overflow: hidden;
  color: var(--on-surface, #e2e8f0);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  text-overflow: ellipsis;
}

.service-monitoring-empty {
  height: 120px;
  color: var(--on-surface-variant, #94a3b8);
  text-align: center !important;
}

.service-monitoring.is-loading [data-monitoring-kpi],
.service-monitoring.is-loading [data-monitoring-runtime],
.service-monitoring.is-loading [data-monitoring-sql] {
  color: transparent;
  border-radius: 5px;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--on-surface) 8%, transparent), transparent);
  background-size: 220% 100%;
  animation: monitoring-skeleton 1.4s ease-in-out infinite;
}

@keyframes monitoring-skeleton {
  to { background-position: -220% 0; }
}

@media (max-width: 1180px) {
  .service-monitoring-header {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  }

  .service-monitoring-overview-grid {
    grid-template-columns: 1fr;
  }

  .service-monitoring-chart-card {
    grid-column: span 6;
  }
}

@media (max-width: 900px) {
  .service-monitoring-header {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .service-monitoring-header-tools {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .service-monitoring-back-link {
    width: auto;
  }

  .service-monitoring-traffic-summary,
  .service-monitoring-sql-layout {
    grid-template-columns: 1fr;
  }

  .service-monitoring-primary-metric {
    border-right: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--outline-variant) 68%, transparent);
  }

  .service-monitoring-runtime-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .page-service-monitoring .container {
    padding-top: 18px;
    padding-bottom: 36px;
  }

  .service-monitoring {
    gap: 14px;
  }

  .service-monitoring-header-tools,
  .service-monitoring-command-bar,
  .service-monitoring-period-control,
  .service-monitoring-toolbar-meta,
  .service-monitoring-section-head {
    align-items: stretch;
    flex-direction: column;
  }

  .service-monitoring-header-tools {
    display: grid;
    grid-template-columns: 1fr;
  }

  .service-monitoring-source {
    align-items: flex-start;
    flex-direction: column;
  }

  .service-monitoring-source-address {
    width: 100%;
    text-align: left;
  }

  .service-monitoring-back-link {
    width: 100%;
  }

  .service-monitoring-command-bar {
    position: static;
    display: flex;
  }

  .service-monitoring-periods {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .service-monitoring-periods button {
    padding-inline: 6px;
  }

  .service-monitoring-toolbar-meta {
    display: flex;
  }

  .service-monitoring-section-head {
    display: flex;
    gap: 10px;
  }

  .service-monitoring-section-head > p {
    max-width: none;
    text-align: left;
  }

  .service-monitoring-signal-grid {
    grid-template-columns: 1fr;
  }

  .service-monitoring-signal-grid > div {
    border-right: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--outline-variant) 55%, transparent);
  }

  .service-monitoring-signal-grid > div:last-child {
    border-bottom: 0;
  }

  .service-monitoring-resource-list {
    grid-template-columns: 1fr;
  }

  .service-monitoring-chart-card,
  .service-monitoring-chart-card--lead {
    grid-column: 1 / -1;
  }

  .service-monitoring-runtime-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 440px) {
  .service-monitoring-overview,
  .service-monitoring-section {
    padding: 14px;
    border-radius: 15px;
  }

  .service-monitoring-periods {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .service-monitoring-toolbar-meta {
    align-items: stretch;
  }

  .service-monitoring-toolbar-meta .btn {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .service-monitoring-status-dot,
  .service-monitoring.is-loading [data-monitoring-kpi],
  .service-monitoring.is-loading [data-monitoring-runtime],
  .service-monitoring.is-loading [data-monitoring-sql] {
    animation: none !important;
  }

  .service-monitoring-meter span {
    transition: none;
  }
}

/* Separate, intentionally simpler Apple ID registry for competitor work. */
.page-competitor-accounts .container {
  max-width: 1680px;
}

.competitor-accounts-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}

.competitor-accounts-hero__actions,
.competitor-accounts-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.competitor-accounts-table .apple-cell-stack form,
.competitor-account-delete-actions form {
  margin: 0;
}

.competitor-accounts-table {
  width: 100%;
  min-width: 1160px;
  table-layout: fixed;
}

.competitor-accounts-table th:nth-child(1),
.competitor-accounts-table td:nth-child(1) {
  width: 18%;
}

.competitor-accounts-table th:nth-child(2),
.competitor-accounts-table td:nth-child(2) {
  width: 8%;
}

.competitor-accounts-table th:nth-child(3),
.competitor-accounts-table td:nth-child(3) {
  width: 6%;
}

.competitor-accounts-table th:nth-child(4),
.competitor-accounts-table td:nth-child(4) {
  width: 8%;
}

.competitor-accounts-table th:nth-child(5),
.competitor-accounts-table td:nth-child(5) {
  width: 8%;
}

.competitor-accounts-table th:nth-child(6),
.competitor-accounts-table td:nth-child(6) {
  width: 12%;
}

.competitor-accounts-table th:nth-child(7),
.competitor-accounts-table td:nth-child(7) {
  width: 9%;
}

.competitor-accounts-table th:nth-child(8),
.competitor-accounts-table td:nth-child(8) {
  width: 8%;
}

.competitor-accounts-table th:nth-child(9),
.competitor-accounts-table td:nth-child(9) {
  width: 19%;
}

.competitor-accounts-table th:nth-child(10),
.competitor-accounts-table td:nth-child(10) {
  width: 4%;
}

.competitor-accounts-table .competitor-account-note-cell {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

.competitor-account-note {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--fg);
  line-height: 1.35;
}

.competitor-accounts-table .apple-block-heading,
.competitor-accounts-table .apple-block-cell {
  padding-right: 0.45rem;
  padding-left: 0.45rem;
  text-align: center;
}

.competitor-account-type {
  display: inline-flex;
  align-items: center;
  min-height: 1.65rem;
  border: 1px solid rgba(143, 211, 255, 0.22);
  border-radius: 999px;
  padding: 0.16rem 0.55rem;
  background: rgba(143, 211, 255, 0.08);
  color: #bfe5ff;
  font-size: 0.75rem;
  font-weight: 800;
}

.competitor-account-delete-actions {
  margin-top: 12px;
}

.competitor-accounts-table .empty-table-cell {
  padding: 42px 18px;
  color: var(--muted);
  text-align: center;
}

@media (max-width: 760px) {
  .competitor-accounts-hero {
    align-items: stretch;
    flex-direction: column;
  }

  .competitor-accounts-hero__actions .btn {
    flex: 1 1 auto;
  }
}