/* v12 Studio palette: the v11 colors on the original Final Dark pages.
 * No alternate page content, geometry, typography, icons, or animation suppression. */
html[data-theme="studio"] {
  color-scheme: light;
  background-color: var(--st-paper);
  --st-paper: #ffffff;
  --studio-rgb-paper: 255 255 255;
  --st-soft: #f9fafb;
  --studio-rgb-soft: 249 250 251;
  --st-sky: #fbfbfc;
  --studio-rgb-sky: 251 251 252;
  --st-ink: #0b1626;
  --studio-rgb-ink: 11 22 38;
  --st-text: #1c2a3c;
  --studio-rgb-text: 28 42 60;
  --st-mid: #2a3a50;
  --studio-rgb-mid: 42 58 80;
  --st-muted: #3e4c5f;
  --studio-rgb-muted: 62 76 95;
  --st-line: #e3e6ea;
  --studio-rgb-line: 227 230 234;
  --st-line2: #c8ccd2;
  --studio-rgb-line2: 200 204 210;
  --st-blue: #1454d8;
  --studio-rgb-blue: 20 84 216;
  --st-blue2: #1552b7;
  --studio-rgb-blue2: 21 82 183;
  --st-hover: #093ea9;
  --studio-rgb-hover: 9 62 169;
  --st-focus: #073d9f;
  --studio-rgb-focus: 7 61 159;
  --st-control: #7a8fab;
  --studio-rgb-control: 122 143 171;
  --st-green: #035c43;
  --studio-rgb-green: 3 92 67;
  --st-red: #961b12;
  --studio-rgb-red: 150 27 18;
  --st-amber: #92400e;
  --studio-rgb-amber: 146 64 14;
  --st-onAccent: #ffffff;
  --studio-rgb-onAccent: 255 255 255;
  --bg: var(--st-paper);
  --page: var(--st-paper);
  --bg-alt: var(--st-soft);
  --page-2: var(--st-soft);
  --surface: var(--st-paper);
  --surface-2: var(--st-paper);
  --panel: var(--st-paper);
  --glass: var(--st-paper);
  --raised: var(--st-soft);
  --raised2: var(--st-sky);
  --surface-solid: var(--st-paper);
  --surface-sunken: var(--st-soft);
  --panel-2: var(--st-soft);
  --ink: var(--st-ink);
  --ink-muted: var(--st-muted);
  --ink-faint: var(--st-muted);
  --ink-dim: var(--st-mid);
  --ink-mid: var(--st-mid);
  --ink-mute: var(--st-muted);
  --muted: var(--st-muted);
  --faint: var(--st-muted);
  --g300: var(--st-text);
  --g350: var(--st-mid);
  --g400: var(--st-mid);
  --g500: var(--st-muted);
  --g600: var(--st-muted);
  --line: var(--st-line);
  --line-2: var(--st-line2);
  --line-3: var(--st-control);
  --line2: var(--st-line2);
  --cyan: var(--st-blue);
  --cyan-ink: var(--st-blue);
  --cyan-grad: var(--st-blue);
  --accent: var(--st-blue);
  --violet: var(--st-blue2);
  --violet-ink: var(--st-blue2);
  --violet-grad: var(--st-blue2);
  --purple-ink: var(--st-blue2);
  --blue: var(--st-blue);
  --blue-ink: var(--st-blue);
  --teal-ink: var(--st-blue);
  --green: var(--st-green);
  --green-ink: var(--st-green);
  --live: var(--st-green);
  --red: var(--st-red);
  --red-ink: var(--st-red);
  --danger: var(--st-red);
  --amber: var(--st-amber);
  --orange-ink: var(--st-amber);
  --yellow-ink: var(--st-amber);
  --invert: var(--st-ink);
  --invert-2: var(--st-ink);
  --invert-ink: var(--st-onAccent);
  --invert-mid: var(--st-line);
  --invert-mute: var(--st-line2);
  --invert-line: var(--st-mid);
  --hdr-accent: var(--st-blue);
  --hdr-accent-2: var(--st-blue2);
  --hdr-ink: var(--st-mid);
  --hdr-line: var(--st-line);
  --hv-cyan: var(--st-blue);
  --hv-violet: var(--st-blue2);
  --nb-node-a: var(--st-blue);
  --nb-node-b: var(--st-blue2);
  --btn-fg: var(--st-onAccent);
}

/* Colors for native shared controls; their dimensions and handlers are unchanged. */
html[data-theme="studio"] body { color:var(--st-ink); }

/* The wordmark has the same SVG paths, mask, typography, and viewBox as Dark;
   this existing v11 asset changes only its fills and gradient stop colors. */
html[data-theme="studio"] img[src$="airllm_logo_dark.svg"],
html[data-theme="studio"] img[src$="airllm_logo_light.svg"] { content:url('images/airllm_logo_studio.svg'); }
/* Component fills, outlines, and selected states are defined after the
   generated color adapter in tailwind/studio-components.css. */
html[data-theme="studio"] :is(input,select,textarea) { border-color:var(--st-control)!important; caret-color:var(--st-ink); }
html[data-theme="studio"] :is(input,textarea)::placeholder { color:var(--st-muted)!important; }
html[data-theme="studio"] :is(a,button,summary,input,select,textarea,[tabindex]):focus-visible {
  outline:3px solid var(--st-focus); outline-offset:4px;
}
/* Crisp, high-contrast text: Tailwind's `antialiased` thins glyphs on a light page, so Studio
   draws text with the platform's default smoothing and legibility kerning. */
html[data-theme="studio"] body { -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; text-rendering: optimizeLegibility; }
html[data-theme="studio"] ::selection { background-color:var(--st-blue); color:var(--st-onAccent); }

/* Native charts keep their data, marks, motion, hover, and zoom behavior. */
html[data-theme="studio"] .js-plotly-plot .plotly text { fill:var(--st-ink)!important; }
html[data-theme="studio"] .js-plotly-plot .bartext-inside { fill:var(--st-onAccent)!important; }
html[data-theme="studio"] .js-plotly-plot .hovertext path { fill:var(--st-paper)!important; stroke:var(--st-line2)!important; }

/* Retint the original public support widget through its existing color
   contract. Its content, SVG icons, dimensions, and motion stay native. */
html[data-theme="studio"] .alina-root[data-ctx="public"] {
  --a-sig-1:var(--st-blue); --a-sig-2:var(--st-blue2); --a-sig:var(--st-blue);
  --a-sig-soft:rgb(var(--studio-rgb-blue) / .1); --a-sig-line:var(--st-control);
  --a-live:var(--st-green); --a-on-accent:var(--st-onAccent);
  --a-surface:var(--st-paper); --a-raised:var(--st-soft); --a-raised2:var(--st-sky);
  --a-line:var(--st-line); --a-line2:var(--st-control);
  --a-ink:var(--st-ink); --a-ink-dim:var(--st-text); --a-muted:var(--st-muted); --a-faint:var(--st-muted);
  --a-codebg:var(--st-ink);
  --a-shadow:0 30px 70px -20px rgb(var(--studio-rgb-ink) / .7),0 4px 14px -6px rgb(var(--studio-rgb-ink) / .5);
}
html[data-theme="studio"] .alina-root[data-ctx="public"] .alina-fu:hover { background-color:var(--st-blue); color:var(--st-onAccent); }

/* All original motion runs normally. Respect the accessibility preference
   while allowing entrance animations to finish with their content visible. */
@media (prefers-reduced-motion: reduce) {
  html[data-theme="studio"],
  html[data-theme="studio"] *,
  html[data-theme="studio"] *::before,
  html[data-theme="studio"] *::after {
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}
