observablehq.com.css

:root {
  --code: "Fira Code", monospace;
  --monospace: "Fira Code", monospace;
  --monospace-font: 12px/1.5 var(--monospace);
}
.cmt-keyword {
  color: #7cd5f1;
}
.cmt-number {
  color: #bda0f8;
}
.cmt-bool {
  color: #bda0f8;
}
.cmt-comment {
  font-style: italic;
}
.cmt-operator {
  color: #ff80aa
}
.cmt-punctuation {
  color: #8b9798;
}
.cm-activeLine {
  background: #f0faff0c
}
.reference-mark {
  border-bottom: 1.2px solid #f0faff;
}
.cmt-variableName {
  color: #f0faff;
}
.reference-mark .cmt-variableName {
  border-bottom: 1.2px solid #f0faff;
}
.cmt-propertyName {
  color: #a9dc76;
}
.reference-mark .cmt-propertyName {
  border-bottom: 1.2px solid #a9dc76;
}
.cmt-definition {
  color: #ffbf80;
  font-style: italic;
}
.cmt-string {
  color: #ffea80;
}
.cmt-string2 {
  color: #ffea80;
}
.cmt-link {
  color: #7cd5f1;
}
.cm-editor {
  color: #f0faff;
  background-color: #273035;
  caret-color: #f0faff;
  font-feature-settings: "ss04" 1, "ss07" 1;
}
.broken-reference-mark * {
  background-color: #ff80aa;
  color: #273035;
}
.cm-matchingBracket .cmt-punctuation {
  color: #f0faff;
  background-color: #6b7678;
}
.cm-selectionMatch {
  background-color: #3a4449;
}
.cm-cursor {
  border-left: 1.2px solid #f0faff !important;
}
.cm-selectionBackground {
  background: #3a4449 !important;
}

/* Play button to the right of the code window */
.buttons .play.blue {
  color: #4b73e0;
}
.buttons .play:focus, .buttons .play:hover {
  color: #f0faff;
}
/* Autocomplete pop-up */
.cm-tooltip {
    border: 0px !important;
    background-color: #3a4449 !important;
}
.cm-tooltip.cm-tooltip-autocomplete {
    border: none !important;
    background-color: #3a4449 !important;
    color: #f0faff !important;
}
.cm-tooltip.cm-tooltip-autocomplete > ul {
  font: var(--monospace-font);
}
.cm-tooltip.cm-tooltip-autocomplete > ul > li[aria-selected] {
    color: #f0faff !important;
    background-color: #f0faff20 !important;
}
.cm-tooltip.cm-tooltip-autocomplete > ul > li {
    padding: 6px 10px;
}
.cm-completionIcon {
  background-color: none !important;
}
.cm-completionIcon:after {
  content: '';
  border: 0px none !important;
  border-radius: 4px !important;
  background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect width='24' height='24' fill='%23273035'/><path d='M16.9 17.1C16.3 17.7 15.5 18 14.6 18H13.5V16H14.6C15 16 15.3 15.8 15.5 15.7 15.6 15.5 15.7 15.3 15.7 15V14.5C15.7 14.2 15.7 13.8 16.1 13 16.5 12.4 17.3 12 17.3 12 17.3 12 16.5 11.7 16.1 11.1 15.7 10.3 15.7 9.8 15.7 9.5V9C15.7 8.7 15.6 8.5 15.5 8.3 15.3 8.2 15 8 14.6 8H13.5L13.5 6H14.6C15.5 6 16.3 6.3 16.9 6.9 17.5 7.5 17.7 8.3 17.7 9V9.5C17.7 9.7 17.7 10.1 17.9 10.5 18 10.6 18.1 10.7 18.2 10.8 18.4 10.9 18.6 11 19 11V13C18.6 13 18.4 13.1 18.2 13.2 18.1 13.3 18 13.4 17.9 13.5 17.7 13.9 17.7 14.3 17.7 14.5V15C17.7 15.7 17.5 16.5 16.9 17.1Z' class='a'/><path d='M7.1 17.1C7.7 17.7 8.5 18 9.4 18H10.5V16H9.4C9 16 8.7 15.8 8.5 15.7 8.4 15.5 8.3 15.3 8.3 15V14.5C8.3 14.2 8.3 13.8 7.9 13 7.5 12.4 6.8 12 6.8 12 6.8 12 7.5 11.7 7.9 11.1 8.3 10.3 8.3 9.8 8.3 9.5V9C8.3 8.7 8.4 8.5 8.5 8.3 8.7 8.2 9 8 9.4 8H10.5L10.5 6H9.4C8.5 6 7.7 6.3 7.1 6.9 6.5 7.5 6.3 8.3 6.3 9V9.5C6.3 9.7 6.3 10.1 6.1 10.5 6 10.6 5.9 10.7 5.8 10.8 5.6 10.9 5.4 11 5 11V13C5.4 13 5.6 13.1 5.8 13.2 5.9 13.3 6 13.4 6.1 13.5 6.3 13.9 6.3 14.3 6.3 14.5V15C6.3 15.7 6.5 16.5 7.1 17.1Z' class='a'/></svg>") !important; 
  background-size: 'cover';
  background-color: none !important;
}
.cm-completionIcon-reference:after {
  background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect width='24' height='24' fill='%23273035'/><circle cx='8' cy='8' r='2' stroke='%238b9798' stroke-width='2'/><circle cx='16' cy='16' r='2' stroke='%238b9798' stroke-width='2'/><path d='M10 8H11C11.5523 8 12 8.44772 12 9V15C12 15.5523 12.4477 16 13 16H14' stroke='%238b9798' stroke-width='2'/></svg>") !important;
}
.cm-completionIcon-md:after {
  background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect width='24' height='24' fill='%23273035'/><rect x='9.5' y='7' width='8.5' height='2' rx='0.5' fill='%238b9798'/><rect x='6' y='10' width='12' height='2' rx='0.5' fill='%238b9798'/><rect x='6' y='13' width='12' height='2' rx='0.5' fill='%238b9798'/><rect x='6' y='16' width='6.5' height='2' rx='0.5' fill='%238b9798'/></svg>") !important
}
.cm-completionIcon-html:after {
  background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect width='24' height='24' fill='%23273035'/><path d='M14.5 8.5L18 12.25L14.5 16' stroke='%238b9798' stroke-width='2' stroke-linejoin='round'/><path d='M9.5 16L6 12.25L9.5 8.5' stroke='%238b9798' stroke-width='2' stroke-linejoin='round'/></svg>") !important
}
.cm-completionIcon-tex:after {
  background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect width='24' height='24' fill='%23273035'/><rect x='7' y='11' width='10' height='2' rx='0.5' fill='%238b9798'/><path d='M11 5H13V10H11V6.5L10 7V5.5L11 5Z' fill='%238b9798'/><path d='M11 14H9L11 16.5L9 19H11L12 17.75L13 19H15L13 16.5L15 14H13L12 15.25L11 14Z' fill='%238b9798'/></svg>") !important
}
.cm-completionIcon-stdlib:after {
  background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect width='24' height='24' fill='%23273035'/><path d='M5.12965 18.5944C5.08583 18.6065 5.04259 18.6186 5 18.6307V8.34538C7.74364 7.42898 9.88746 6.99767 11.9988 7.00002C14.1104 7.00237 16.2547 7.43853 19 8.34755V18.6307C18.9574 18.6186 18.9142 18.6065 18.8704 18.5944C18.0562 18.3693 16.9474 18.1165 16 18.1165C15.0526 18.1165 13.9438 18.3693 13.1296 18.5944C12.7102 18.7104 12.3445 18.8261 12.0832 18.913C12.0542 18.9226 12.0264 18.9319 12 18.9408C11.9736 18.9319 11.9458 18.9226 11.9168 18.913C11.6555 18.8261 11.2898 18.7104 10.8704 18.5944C10.0562 18.3693 8.94738 18.1165 8 18.1165C7.05262 18.1165 5.9438 18.3693 5.12965 18.5944Z' stroke='%238b9798' stroke-width='2'/><path d='M12.4174 16.6476C12.301 16.7075 12.1913 16.7647 12.0913 16.8172C12.0436 16.7834 11.9933 16.7483 11.9408 16.7123C11.5414 16.4381 10.9749 16.0847 10.3808 15.84C9.72382 15.5695 8.83534 15.4595 8.20708 15.4078C8.13633 15.402 8.06715 15.3968 8 15.3921V5.71688C9.35182 5.41142 10.4012 5.63602 11.4453 6.33205L12 6.70185L12.5547 6.33205C13.5968 5.63734 14.6459 5.41561 16 5.71883V15.412C15.4731 15.4674 14.7453 15.5823 14.1192 15.84C13.578 16.0629 12.9217 16.388 12.4174 16.6476Z' fill='%23EFEFEF' stroke='%238b9798' stroke-width='2'/></svg>") !important
}
.cm-completionIcon-plot:after {
  background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect width='24' height='24' fill='%23273035'/><rect x='8.5' y='7' width='3' height='11' fill='%238b9798'/><rect x='4.5' y='9.20001' width='3' height='8.8' fill='%238b9798'/><rect x='12.5' y='11.4' width='3' height='6.6' fill='%238b9798'/><rect x='16.5' y='8.09998' width='3' height='9.9' fill='%238b9798'/></svg>") !important
}
.cm-completionIcon-input:after {
  background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect width='24' height='24' fill='%23273035'/><rect x='6.5' y='6.5' width='11' height='11' rx='1' stroke='%238b9798' stroke-width='2'/><path d='M8.97776 11.3705L11.4287 13.8213L15.25 10' stroke='%238b9798' stroke-width='2'/></svg>") !important
}
.cm-completionIcon-transform:after {
  background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect width='24' height='24' fill='%23273035'/><path d='M17 16C11 16 11 8 5 8' stroke='%238b9798' stroke-width='2'/><path d='M19 8L16 11V5L19 8Z' fill='%238b9798'/><path d='M19 16L16 19V13L19 16Z' fill='%238b9798'/><path d='M17 8C11 8 11 16 5 16' stroke='%238b9798' stroke-width='2'/></svg>") !important
}
.cm-completionIcon-reference:after {
  background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect width='24' height='24' fill='%23273035'/><circle cx='8' cy='8' r='2' stroke='%238b9798' stroke-width='2'/><circle cx='16' cy='16' r='2' stroke='%238b9798' stroke-width='2'/><path d='M10 8H11C11.5523 8 12 8.44772 12 9V15C12 15.5523 12.4477 16 13 16H14' stroke='%238b9798' stroke-width='2'/></svg>") !important
}
.cm-completionIcon-text:after {
  background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect width='24' height='24' fill='%23273035'/><path d='M7.29552 11.1791C8.0027 11.1791 8.6196 10.8922 8.83526 10.4595H8.93557V11.1013H10.9417V7.38168C10.9417 6.18557 10.0239 5.5 8.41396 5.5C6.79398 5.5 5.76582 6.18071 5.6956 7.29902H7.51119C7.62654 7.04618 7.88233 6.92463 8.28858 6.92463C8.6848 6.92463 8.92554 7.09967 8.92554 7.38168V7.78524L7.81211 7.84845C6.31751 7.93111 5.5 8.51943 5.5 9.51619C5.5 10.5178 6.21721 11.1791 7.29552 11.1791ZM8.09799 9.83709C7.70679 9.83709 7.46103 9.65233 7.46103 9.36546C7.46103 9.09804 7.7118 8.923 8.14313 8.89382L8.92554 8.84034V9.16125C8.92554 9.5405 8.55941 9.83709 8.09799 9.83709Z' fill='%238b9798'/><path d='M16.2832 15.4043C17.6925 15.4043 18.5 14.3833 18.5 12.594C18.5 10.7901 17.7076 9.78361 16.2832 9.78361C15.5108 9.78361 14.924 10.1337 14.6632 10.7463H14.5629V7.84845H12.5066V15.3265H14.5127V14.4805H14.613C14.8588 15.064 15.4757 15.4043 16.2832 15.4043ZM15.4757 11.3201C16.0324 11.3201 16.3935 11.8209 16.3935 12.594C16.3935 13.3768 16.0374 13.8679 15.4757 13.8679C14.909 13.8679 14.5579 13.3816 14.5529 12.5988C14.5579 11.816 14.919 11.3201 15.4757 11.3201Z' fill='%238b9798'/><path d='M11.2878 15.0284C11.1925 13.5746 10.2396 12.7626 8.62461 12.7626C6.68363 12.7626 5.69559 13.7302 5.69559 15.6264C5.69559 17.5324 6.68363 18.5 8.62461 18.5C10.2045 18.5 11.1975 17.6734 11.2878 16.2828H9.42707C9.36689 16.7593 9.09606 17.0024 8.62461 17.0024C8.02275 17.0024 7.75192 16.5794 7.75192 15.6264C7.75192 14.6832 8.02275 14.2601 8.62461 14.2601C9.09606 14.2601 9.36689 14.5227 9.42707 15.0284H11.2878Z' fill='%238b9798'/></svg>") !important;
}