@font-face {
  font-family:D-DIN;
  src:url('../fonts/D-DIN.otf') format('opentype');
  font-weight:400;
  font-display:swap;
}
@font-face {
  font-family:D-DIN;
  src:url('../fonts/D-DIN-Bold.otf') format('opentype');
  font-weight:700;
  font-display:swap;
}
:root {
  color-scheme:dark;
  --background:#010711;
  --text:#f4f7fc;
  --primary:var(--text);
  --accent:#c8dfef;
  --muted:#a5b1c3;
  --line:#273243;
  --panel:#101c2c;
  --focus-panel:#1c2a3d;
  --prose-text:#c0cad9;
  --code-text:#e0e8f2;
  --code-panel:#0b1422;
  --error-panel:#351925;
  --error-text:#ffd5df;
  --notice-panel:#332a18;
  --notice-text:#f7e3ad;
  --body-font:'D-DIN','Helvetica Neue',Arial,sans-serif;
  --heading-font:var(--body-font);
  --code-font:ui-monospace,SFMono-Regular,Consolas,monospace;
  --navy:var(--background);
  --paper:var(--text);
}
body { font-family:var(--body-font); }
h1,h2,h3,.wordmark { font-family:var(--heading-font); }
html:not(.stage-website) :is(.eyebrow,.description,.answer-label,.status,.turn-notice) {
  color:var(--muted);
}
html:not(.stage-website) .document p { color:var(--text); }
html:not(.stage-website) :is(.status,.message.assistant) { padding-inline:0; }
#welcome > .eyebrow { display:none; }
.language-form select,.reset,.composer,.retry,.skip {
  background:var(--panel);
  color:var(--text);
  border-color:var(--line);
}
.composer:focus-within {
  background:var(--focus-panel);
}
.language-form select:focus-visible {
  background:var(--focus-panel);
  box-shadow:inset 3px 0 var(--accent);
}
.reset:hover,.retry:hover {
  background:var(--focus-panel);
  border-color:var(--muted);
}
.header-link { gap:6px; margin-inline-end:8px; }
.brand { flex-shrink:0; }
@media(max-width:620px) {
  html:not(.stage-website) .header-actions { gap:8px; }
  html:not(.stage-website) .header-link { font-size:14px; margin-inline-end:0; }
  html:not(.stage-website) .language-form select { width:104px; }
  .language-form select { padding-inline:13px 31px; }
  .language-form:after { inset-inline-end:13px; }
}
.send { color:var(--background); }
button:focus-visible { box-shadow:0 0 0 3px var(--accent); }
.suggestions { gap:6px 21px; }
.suggestions button {
  background:transparent;
  border:0;
  border-radius:0;
  padding:8px 0;
  min-height:44px;
  color:var(--muted);
}
.suggestions span { color:inherit; }
.suggestions button:is(:hover,:focus-visible) {
  background:transparent;
  color:var(--text);
  box-shadow:none;
  text-decoration:underline;
  text-underline-offset:4px;
}
.message.user,.answer-step:before { background:var(--panel); }
.source-link { border-color:var(--muted); }
html:not(.stage-website) :is(.legal-document a,.legal-nav a) {
  text-decoration:none;
  border-bottom:0;
}
html:not(.stage-website) :is(.legal-document a,.legal-nav a):is(:hover,:focus-visible) {
  color:var(--accent);
}
html:not(.stage-website) :is(.legal-document a,.legal-nav a):focus-visible {
  outline:2px solid var(--accent);
  outline-offset:4px;
}
.error { background:var(--error-panel); color:var(--error-text); }
.storage-notice { background:var(--notice-panel); color:var(--notice-text); }
.resource-body > h1:first-child { display:none; }
.resource-body table {
  display:block;
  max-width:100%;
  overflow-x:auto;
  border-collapse:collapse;
  margin:24px 0;
  font-size:16px;
}
.resource-body th,.resource-body td {
  text-align:start;
  border-bottom:1px solid var(--line);
  padding:12px 16px 12px 0;
}
.resource-body code { overflow-wrap:anywhere; }
.resource-body .code-example { margin-inline:0; }
.resource-body .code-example pre { border-radius:0; }
.resource-body pre code { overflow-wrap:normal; }
.code-example { border:1px solid var(--line); }
::selection { background:var(--accent); color:var(--background); }