/* Gruvbox palette with self-hosted Maple Mono; loaded after the Simple theme. */
@font-face {
  font-family: 'Maple Mono';
  src: url('./fonts/MapleMono-Italic.ttf') format('truetype');
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
}
html:root[class] {
  color-scheme: dark;
  --color-base-font: #ebdbb2;
  --color-base-font-rgb: 235, 219, 178;
  --color-base-background: #282828;
  --color-base-background-mobile: #282828;
  --color-url-font: #83a598;
  --color-url-visited-font: #d3869b;
  --color-header-background: #1d2021;
  --color-header-border: #3c3836;
  --color-footer-background: #1d2021;
  --color-footer-border: #3c3836;
  --color-sidebar-border: #504945;
  --color-sidebar-font: #d5c4a1;
  --color-sidebar-background: #32302f;
  --color-backtotop-font: #ebdbb2;
  --color-backtotop-border: #504945;
  --color-backtotop-background: #32302f;
  --color-btn-background: #fabd2f;
  --color-btn-font: #282828;
  --color-show-btn-background: #504945;
  --color-show-btn-font: #ebdbb2;
  --color-search-border: #665c54;
  --color-search-shadow: none;
  --color-search-background: #32302f;
  --color-search-font: #fbf1c7;
  --color-search-background-hover: #fabd2f;
  --color-error: #fb4934;
  --color-error-background: #442b28;
  --color-warning: #fabd2f;
  --color-warning-background: #423a26;
  --color-success: #b8bb26;
  --color-success-background: #333b28;
  --color-categories-item-selected-font: #fabd2f;
  --color-categories-item-border-selected: #fabd2f;
  --color-autocomplete-font: #ebdbb2;
  --color-autocomplete-border: #665c54;
  --color-autocomplete-shadow: 0 8px 24px #1d202180;
  --color-autocomplete-background: #32302f;
  --color-autocomplete-background-hover: #504945;
  --color-answer-font: #ebdbb2;
  --color-answer-background: #32302f;
  --color-result-keyvalue-col-table: #32302f;
  --color-result-keyvalue-odd: #32302f;
  --color-result-keyvalue-even: #282828;
  --color-result-background: #282828;
  --color-result-border: #504945;
  --color-result-url-font: #b8bb26;
  --color-result-vim-selected: #32302f;
  --color-result-vim-arrow: #fabd2f;
  --color-result-description-highlight-font: #fbf1c7;
  --color-result-link-font: #83a598;
  --color-result-link-font-highlight: #8ec07c;
  --color-result-link-visited-font: #d3869b;
  --color-result-publishdate-font: #bdae93;
  --color-result-engines-font: #bdae93;
  --color-result-search-url-border: #504945;
  --color-result-search-url-font: #d5c4a1;
  --color-result-image-span-font: #ebdbb2;
  --color-result-image-span-font-selected: #fbf1c7;
  --color-result-image-background: #32302f;
  --color-settings-tr-hover: #3c3836;
  --color-settings-engine-description-font: #bdae93;
  --color-settings-table-group-background: #32302f;
  --color-result-detail-font: #ebdbb2;
  --color-result-detail-label-font: #bdae93;
  --color-result-detail-background: #1d2021;
  --color-result-detail-hr: #504945;
  --color-result-detail-link: #83a598;
  --color-result-detail-loader-border: #504945;
  --color-result-detail-loader-borderleft: #fabd2f;
  --color-toolkit-badge-font: #282828;
  --color-toolkit-badge-background: #bdae93;
  --color-toolkit-kbd-font: #ebdbb2;
  --color-toolkit-kbd-background: #3c3836;
  --color-toolkit-dialog-border: #504945;
  --color-toolkit-dialog-background: #32302f;
  --color-toolkit-tabs-label-border: #282828;
  --color-toolkit-tabs-section-border: #504945;
  --color-toolkit-select-background: #32302f;
  --color-toolkit-select-border: #665c54;
  --color-toolkit-select-background-hover: #3c3836;
  --color-toolkit-input-text-font: #ebdbb2;
  --color-toolkit-checkbox-onoff-off-background: #3c3836;
  --color-toolkit-checkbox-onoff-on-background: #3c3836;
  --color-toolkit-checkbox-onoff-on-mark-background: #b8bb26;
  --color-toolkit-checkbox-onoff-on-mark-color: #282828;
  --color-toolkit-checkbox-onoff-off-mark-background: #665c54;
  --color-toolkit-checkbox-onoff-off-mark-color: #ebdbb2;
  --color-toolkit-checkbox-label-background: #32302f;
  --color-toolkit-checkbox-label-border: #665c54;
  --color-toolkit-checkbox-input-border: #fabd2f;
  --color-toolkit-engine-tooltip-border: #665c54;
  --color-toolkit-engine-tooltip-background: #32302f;
  --color-toolkit-loader-border: #504945;
  --color-toolkit-loader-borderleft: #fabd2f;
  --color-doc-code: #ebdbb2;
  --color-doc-code-background: #32302f;
  --color-bar-chart-primary: #83a598;
  --color-bar-chart-secondary: #fabd2f;
  --color-loading-indicator: #504945;
  --color-loading-indicator-gap: #fabd2f;
  --color-line-number: #bdae93;
  --color-favicon-background-color: #3c3836;
  --color-favicon-border-color: #504945;
  --results-inset: clamp(24px, 10vw, 160px);
  font-family: 'Maple Mono', monospace;
  font-style: italic;
  font-size: 15px;
  line-height: 1.6;
}
body, input, button, select, textarea {
  font-family: inherit;
  font-style: inherit;
}
::selection { background: #665c54; color: #fbf1c7; }
:focus-visible { outline: 2px solid #fabd2f; outline-offset: 4px; }
#links_on_top { top: 26px; font-size: 12px; gap: 12px; }
#links_on_top a { margin: 0; }
#links_on_top a:hover { color: #fabd2f; }
.results_endpoint #search_header {
  box-sizing: border-box;
  width: 100%;
  grid-template-columns: 42px minmax(0, 700px);
  gap: 12px 18px;
  padding: 20px 24px 0 max(16px, calc(var(--results-inset) - 60px));
}
body.results_endpoint #search_view { padding: 0; min-width: 0; }
.results_endpoint #search_logo { padding: 0; }
#search_logo svg { margin: 0; }
#search_logo svg [stroke="#3050ff"] { stroke: #fabd2f; }
#search_logo svg [fill="#3050ff"], .logo [fill="#3050ff"] { fill: #fabd2f; }
.search_box {
  max-width: 700px;
  border: 1px solid #665c54;
  border-radius: 10px;
  background: #32302f;
  box-sizing: border-box;
}
.search_box:focus-within { border-color: #fabd2f; box-shadow: 0 0 0 2px #fabd2f26; }
#q { min-width: 0; font-size: 16px; padding-block: 12px; }
#q::placeholder { color: #bdae93; opacity: 1; }
#send_search { color: #fabd2f; }
#clear_search { color: #bdae93; }
#categories { min-width: 0; }
.results_endpoint #categories { width: min(1048px, calc(100vw - var(--results-inset) - 24px)); }
#categories_container {
  display: flex;
  overflow-x: auto;
  gap: 22px;
  scrollbar-width: thin;
  scrollbar-color: #665c54 transparent;
}
#categories_container .category { flex: 0 0 auto; margin: 0; font-size: 13px; }
#categories_container .category_button,
#categories_container .category_checkbox label { padding: 8px 0 12px; }
#categories_container svg { width: 16px; height: 16px; margin-inline-end: 4px; }
.results_endpoint .search_filters {
  margin: 0;
  padding: 8px 24px 8px var(--results-inset);
  border-bottom: 1px solid #3c3836;
  background: #1d2021;
  gap: 12px;
}
.search_filters select { font-size: 12px; color: #bdae93; }
#main_results div#results:not(.only_template_images) {
  margin: 26px 24px 0 var(--results-inset);
  grid-template: 'corrections sidebar' min-content 'answers sidebar' min-content
    'urls sidebar' 1fr 'pagination sidebar' min-content / minmax(0, 700px) minmax(220px, 300px);
  gap: 0 48px;
  max-width: 1048px;
  justify-content: start;
}
#urls, #sidebar { min-width: 0; }
#results .result:not(.result-images) {
  padding: 0 0 26px;
  margin: 0 0 18px;
  width: 100%;
  border: 0;
  border-radius: 0;
  background: transparent;
}
#results .result:not(.result-images)[data-vim-selected] {
  background: #32302f;
  box-shadow: -4px 0 #fabd2f;
}
#results .result h3 { margin: 5px 0 7px; line-height: 1.4; }
#results .result h3 a { font-size: 20px; font-weight: 500; }
#results .result .content { font-size: 14px; line-height: 1.75; max-width: none; color: #d5c4a1; }
#results .result .url_wrapper { font-size: 12px; line-height: 1.6; }
#results .result .url_o2 { color: #bdae93; }
#results .result .engines { font-size: 11px; padding-top: 8px; }
#results .result a.thumbnail_link { float: right; margin: 8px 0 12px 22px; }
#results .result a.thumbnail_link img.thumbnail { width: 100px; max-height: 100px; object-fit: contain; border-radius: 8px; }
#results .result-videos a.thumbnail_link img.thumbnail { width: 180px; max-height: none; }
#results #sidebar { margin: 0; font-size: 12px; }
#sidebar .infobox { background: #32302f; border-radius: 10px; padding: 20px; }
#sidebar summary { padding-block: 12px; }
#pagination { border-top: 1px solid #3c3836; padding-top: 24px; }
#backToTop { left: auto; right: 24px; bottom: 24px; }
footer { font-size: 11px; color: #bdae93; }
.page_with_header { width: min(1100px, calc(100% - 40px)); }
#main_index { margin-top: min(20vh, 160px); }
.index .title { background: none; margin: 0 auto 36px; min-height: 0; }
.index .title h1 { visibility: visible; font-size: clamp(36px, 7vw, 60px); font-weight: 600; letter-spacing: -3px; color: #fabd2f; }
.index #search { max-width: 700px; padding: 0 24px; box-sizing: border-box; }
.index #search_view { padding: 0; }
@media (max-width: 1100px) {
  .results_endpoint #categories { width: 100%; }
  .results_endpoint #links_on_top span { display: none; }
  .results_endpoint #search_header { grid-template-columns: 36px minmax(0, 700px); padding-inline-end: 68px; gap: 12px; }
  #main_results div#results:not(.only_template_images) {
    grid-template: 'corrections' min-content 'answers' min-content 'urls' 1fr
      'sidebar' min-content 'pagination' min-content / minmax(0, 700px);
  }
  #results #sidebar { margin-top: 16px; }
}
@media (max-width: 640px) {
  html:root[class] { --results-inset: 18px; font-size: 14px; }
  .results_endpoint #search_header { padding: 14px 52px 0 12px; grid-template-columns: 28px minmax(0, 1fr); gap: 8px; }
  #search_logo svg { width: 26px; height: 26px; }
  .results_endpoint #links_on_top { top: 24px; right: 12px; }
  .results_endpoint #categories { grid-column: 1 / -1; }
  #categories_container { gap: 20px; }
  .results_endpoint .search_filters { padding-inline: 12px; gap: 4px; }
  .search_filters select { font-size: 11px; max-width: 42vw; }
  #main_results div#results:not(.only_template_images) { margin: 22px 18px 0; }
  #results .result h3 a { font-size: 18px; }
  #results .result .content { font-size: 13px; }
  #results .result a.thumbnail_link { margin-inline-start: 12px; }
  #results .result a.thumbnail_link img.thumbnail { width: 72px; max-height: 80px; }
  #results .result-videos a.thumbnail_link img.thumbnail { width: 110px; }
  #main_index { margin-top: 18vh; }
  .index .title h1 { letter-spacing: -2px; }
}

.preferences_endpoint fieldset { min-width: 0; }
.preferences_endpoint #categories_container { flex-wrap: wrap; overflow: visible; gap: 8px 18px; }