/* Shared production theme: the characters stay behind the operator workflow. */

body.theme-anime {
  --page-bg: #172442;
  --text: #f4f6ff;
  --muted: #b8c3dc;
  --faint: #8f9bb8;
  --surface-2: rgb(45 62 100 / 0.58);
  --surface-3: rgb(63 82 129 / 0.62);
  --paper: rgb(39 54 91 / 0.56);
  --panel: rgb(42 58 95 / 0.62);
  --fill: rgb(178 207 255 / 0.10);
  --fill-2: rgb(178 207 255 / 0.16);
  --line: rgb(162 192 255 / 0.22);
  --line-soft: rgb(162 192 255 / 0.13);
  --line-strong: rgb(162 192 255 / 0.38);
  --accent: #9bb8ff;
  --accent-2: #718cdd;
  --accent-hi: #e4edff;
  --accent-rgb: 155 184 255;
  --success: #99e2cf;
  --success-rgb: 153 226 207;
  --warn: #f0d18b;
  --warn-rgb: 240 209 139;
  --danger: #f1a4b8;
  --danger-rgb: 241 164 184;
  --info: #9bcdf2;
  --info-rgb: 155 205 242;
  --brand-pink: #e9aac8;
  --brand-pink-rgb: 233 170 200;
  --focus: 0 0 0 3px rgb(var(--accent-rgb) / 0.32);
}

body.theme-anime .ambient-triangles-backdrop,
body.theme-anime .ambient-triangles {
  position: fixed;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

body.theme-anime .ambient-triangles-backdrop {
  z-index: 1;
  background-image:
    linear-gradient(rgb(64 104 181 / 0.24), rgb(27 61 136 / 0.34)),
    url("/static/anime-theme-background.webp");
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
}

body.theme-anime .ambient-triangles {
  z-index: 2;
}

body.theme-anime .home-page,
body.theme-anime .docs-page,
body.theme-anime .auth-layout,
body.theme-anime.console-mode .app {
  position: relative;
  z-index: 3;
  background-color: var(--page-bg);
  background-image:
    linear-gradient(rgb(108 134 196 / 0.22), rgb(108 134 196 / 0.22)),
    url("/static/anime-theme-background.webp");
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
}

body.theme-anime.ambient-triangles-ready .ambient-triangles ~ .home-page,
body.theme-anime.ambient-triangles-ready .ambient-triangles ~ .docs-page,
body.theme-anime.ambient-triangles-ready .ambient-triangles ~ .auth-layout,
body.theme-anime.ambient-triangles-ready .ambient-triangles ~ .auth-layout .app {
  background-image: none;
  background-color: transparent;
}

body.theme-anime .home-page::before,
body.theme-anime .docs-page::before,
body.theme-anime.console-mode .app::before {
  opacity: 0.28;
}

body.theme-anime.console-mode .app-header {
  background: rgb(31 46 79 / 0.74);
  border-bottom-color: rgb(var(--accent-rgb) / 0.18);
}

body.theme-anime.console-mode .app-nav,
body.theme-anime .docs-side {
  background: rgb(30 45 77 / 0.60);
  border-color: rgb(var(--accent-rgb) / 0.16);
}

body.theme-anime.console-mode .section-block,
body.theme-anime.console-mode .card:not(.console-card),
body.theme-anime.console-mode .stat,
body.theme-anime.console-mode .table-wrap,
body.theme-anime.console-mode .model-card,
body.theme-anime.console-mode .provider-detail,
body.theme-anime.console-mode .provider-detail-panel,
body.theme-anime.console-mode .chat-sessions,
body.theme-anime.console-mode .chat-main,
body.theme-anime.console-mode .rule-card,
body.theme-anime.console-mode .log-breakdown-card,
body.theme-anime:not(.console-mode) .auth-card,
body.theme-anime .home-feature-grid .cell,
body.theme-anime .endpoint,
body.theme-anime .limit,
body.theme-anime .note,
body.theme-anime .list > div {
  border-color: rgb(var(--accent-rgb) / 0.15) !important;
  background:
    linear-gradient(145deg, rgb(230 238 255 / 0.08), transparent 44%),
    rgb(48 65 104 / 0.44);
  box-shadow:
    0 20px 46px -32px rgb(0 0 0 / 0.78),
    inset 0 1px 0 rgb(220 232 255 / 0.06);
  backdrop-filter: blur(10px) saturate(1.08);
  -webkit-backdrop-filter: blur(10px) saturate(1.08);
}

body.theme-anime.console-mode .control:not(:focus),
body.theme-anime.console-mode input.control:not(:focus),
body.theme-anime.console-mode select.control:not(:focus),
body.theme-anime.console-mode textarea.control:not(:focus) {
  border-color: rgb(var(--accent-rgb) / 0.14);
  background: rgb(30 46 79 / 0.50);
}

body.theme-anime .nav-item.active,
body.theme-anime .docs-side a.active {
  color: var(--accent-hi);
  background: rgb(var(--accent-rgb) / 0.15);
  box-shadow: inset 3px 0 0 var(--accent), 0 10px 24px -20px rgb(var(--accent-rgb) / 0.9);
}

body.theme-anime .auth-hero .eyebrow,
body.theme-anime .pill-accent,
body.theme-anime code {
  color: var(--brand-pink);
}

body.theme-anime .home-feature-grid .cell:nth-child(5) {
  border-top-color: rgb(var(--brand-pink-rgb) / 0.58);
}

@media (max-width: 680px) {
  body.theme-anime .ambient-triangles-backdrop,
  body.theme-anime .home-page,
  body.theme-anime .docs-page,
  body.theme-anime .auth-layout,
  body.theme-anime.console-mode .app {
    background-position: 92% top;
  }
}
