/* chrome tokens: generated by scripts/chrome-tokens.mjs from Studio's theme.json. Do not edit by hand. */
:root {
  color-scheme: dark;
  --frame: #0b0d11;
  --page: #181a1d;
  --card: #242832;
  --raised: #333946;
  --stroke-subtle: #ffffff30;
  --stroke-strong: #ffffff4a;
  --accent: #8bb8ee;
  --caution: #feb454;
  --failure: #ef7177;
  --failure-wash: #48161b;
  --icon: #a6acb4;
  --strip: #232733;
  --ground: #17191c;
  --ink: #dce0e6;
  --muted: #a6acb4;
  --code-ink: #d5d9df;
  --green: #aad84c;
  --hover: #303642;
  --stage: var(--frame);
  --code: var(--page);
  --panel: var(--card);
  --line: var(--stroke-subtle);
  --line-strong: var(--stroke-strong);
  --blue: var(--accent);
  --red: var(--failure);
}
:root[data-theme="light"] {
  color-scheme: light;
  --frame: #dfe5ed;
  --page: #fafbfd;
  --card: #ffffff;
  --raised: #e4e9f1;
  --stroke-subtle: #ccd4df;
  --stroke-strong: #aab6c6;
  --accent: #285ea2;
  --caution: #8a5810;
  --failure: #b42c3d;
  --failure-wash: #f7dcdf;
  --icon: #59677c;
  --strip: #eceff5;
  --ground: #f2f4f8;
  --ink: #253249;
  --muted: #59677c;
  --code-ink: #253249;
  --green: #487222;
  --hover: #2532490b;
}
@media (prefers-color-scheme: light) {
:root:not([data-theme]) {
  color-scheme: light;
  --frame: #dfe5ed;
  --page: #fafbfd;
  --card: #ffffff;
  --raised: #e4e9f1;
  --stroke-subtle: #ccd4df;
  --stroke-strong: #aab6c6;
  --accent: #285ea2;
  --caution: #8a5810;
  --failure: #b42c3d;
  --failure-wash: #f7dcdf;
  --icon: #59677c;
  --strip: #eceff5;
  --ground: #f2f4f8;
  --ink: #253249;
  --muted: #59677c;
  --code-ink: #253249;
  --green: #487222;
  --hover: #2532490b;
}
}
/* end chrome tokens */
html, body { margin: 0; width: 100%; height: 100%; overflow: hidden; }
.editor-host, #source { position: fixed; inset: 0; width: 100%; height: 100%; }
#startup { position: fixed; inset: 45% 0 auto; text-align: center; font: 16px sans-serif; color: var(--ink); }
[hidden] { display: none !important; }