/* findsh.it · Degoog supplies the component styles and behavior underneath. */
:root,
:root[data-theme="dark"] {
  color-scheme: dark;
  --primary: #88aaff;
  --primary-hover: #a8c0ff;
  --primary-rgb: 136, 170, 255;
  --brand-blue: #88aaff;
  --brand-yellow: #dfc778;
  --danger: #ff8787;
  --warning: #dfc778;
  --success: #b4ed83;
  --bg: #111412;
  --bg-light: #1a1e1b;
  --bg-hover: #242a25;
  --border: #414b43;
  --border-light: #2a322c;
  --text-primary: #edf1eb;
  --text-secondary: #a3afa5;
  --text-link: #a5bdff;
  --text-link-visited: #c4abe7;
  --text-cite: #aab7ac;
  --text-snippet: #c0cac1;
  --search-bar-bg: #1a1e1b;
  --search-bar-bg-hover: #202621;
  --btn-bg: #242a25;
  --btn-text: #edf1eb;
  --overlay-bg: rgb(0 0 0 / 70%);
  --modal-footer: #1a1e1b;
  --white: #fff;
  --fs-accent: #b4ed83;
  --fs-accent-ink: #14210c;
  --fs-grid: rgb(163 175 165 / 4%);
  --degoog-search-bar-radius: 8px;
}

/* With scripts disabled, an unset mode still follows the system preference. */
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    color-scheme: light;
    --primary: #3158b3;
    --primary-hover: #24438b;
    --primary-rgb: 49, 88, 179;
    --brand-blue: #3158b3;
    --brand-yellow: #806008;
    --danger: #ad3030;
    --warning: #806008;
    --success: #386322;
    --bg: #f3f4ee;
    --bg-light: #fffef9;
    --bg-hover: #e7ebdf;
    --border: #a4b09d;
    --border-light: #d6dccf;
    --text-primary: #222b22;
    --text-secondary: #596653;
    --text-link: #294d9e;
    --text-link-visited: #73519b;
    --text-cite: #53644e;
    --text-snippet: #495343;
    --search-bar-bg: #fffef9;
    --search-bar-bg-hover: #fffef9;
    --btn-bg: #e7ebdf;
    --btn-text: #222b22;
    --overlay-bg: rgb(20 30 15 / 45%);
    --modal-footer: #e7ebdf;
    --fs-accent: #365e25;
    --fs-accent-ink: #fff;
    --fs-grid: rgb(50 65 40 / 5%);
  }
}
:root[data-theme="light"] {
  color-scheme: light;
  --primary: #3158b3;
  --primary-hover: #24438b;
  --primary-rgb: 49, 88, 179;
  --brand-blue: #3158b3;
  --brand-yellow: #806008;
  --danger: #ad3030;
  --warning: #806008;
  --success: #386322;
  --bg: #f3f4ee;
  --bg-light: #fffef9;
  --bg-hover: #e7ebdf;
  --border: #a4b09d;
  --border-light: #d6dccf;
  --text-primary: #222b22;
  --text-secondary: #596653;
  --text-link: #294d9e;
  --text-link-visited: #73519b;
  --text-cite: #53644e;
  --text-snippet: #495343;
  --search-bar-bg: #fffef9;
  --search-bar-bg-hover: #fffef9;
  --btn-bg: #e7ebdf;
  --btn-text: #222b22;
  --overlay-bg: rgb(20 30 15 / 45%);
  --modal-footer: #e7ebdf;
  --fs-accent: #365e25;
  --fs-accent-ink: #fff;
  --fs-grid: rgb(50 65 40 / 5%);
}

body { line-height: 1.5; }
button, input, select, textarea { font: inherit; }
a, button, input { -webkit-tap-highlight-color: transparent; }
:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--fs-accent);
  outline-offset: 4px;
}
.fs-skip {
  position: fixed;
  inset-block-start: -100px;
  inset-inline-start: 20px;
  padding: 12px 18px;
  background: var(--fs-accent);
  color: var(--fs-accent-ink);
  z-index: 1000;
}
.fs-skip:focus { inset-block-start: 12px; }
.fs-skip-results { display: none; }
body.has-results .fs-skip-results, body.nojs-results .fs-skip-results { display: block; }
.fs-footer, .fs-footer * {
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
}

/* Home */
#app { min-height: 100svh; }
#header {
  position: relative;
  justify-content: flex-end;
  align-items: center;
  gap: 20px;
  padding: 24px clamp(20px, 4vw, 64px);
}

.fs-settings { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; }
#main-home {
  margin: 0;
  padding: 70px 24px 100px;
  background-image: linear-gradient(var(--fs-grid) 1px, transparent 1px), linear-gradient(90deg, var(--fs-grid) 1px, transparent 1px);
  background-size: 48px 48px;
  background-position: center;
}
#home-logo { padding-bottom: 36px; width: 100%; }
.fs-brand { text-align: center; max-width: 100%; }

.fs-logo { margin: 0 auto; max-width: 540px; padding: 18px 20px; background: transparent; border-radius: 3px; line-height: 0; }
.fs-logo img { display: block; width: 100%; height: auto; }

#home-search { max-width: 640px; }
.degoog-search-bar {
  border: 1px solid var(--border);
  border-radius: var(--degoog-search-bar-radius);
  box-shadow: none;
  min-height: 52px;
  transition: border-color 150ms, background-color 150ms;
}
#search-bar-home { height: 60px; padding-inline: 20px; }
.degoog-search-bar:hover { border-color: var(--text-secondary); box-shadow: none; }
.degoog-search-bar:focus-within { border-color: var(--fs-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--fs-accent) 14%, transparent); }
.degoog-search-bar .search-icon { color: var(--text-secondary); stroke: currentColor; }
.search-input { color: var(--text-primary); }
.search-input::placeholder { color: var(--text-secondary); opacity: 1; }
.button-row { margin-top: 20px; gap: 12px; flex-wrap: wrap; }
.search-btn { border-radius: 4px; border: 1px solid var(--border); height: 44px; box-shadow: none; padding-inline: 24px; }
.search-btn:hover { border-color: var(--text-secondary); background: var(--bg-hover); box-shadow: none; }
#btn-search { background: var(--fs-accent); border-color: var(--fs-accent); color: var(--fs-accent-ink); font-weight: 600; }
#btn-search:hover { filter: brightness(1.08); }
.lucky-btn .lucky-slot-inner span { height: 44px; }

.ac-dropdown { border: 1px solid var(--border); border-top: 0; box-shadow: 0 12px 24px rgb(0 0 0 / 12%); }
.ac-item { padding-block: 12px; }
#home-footer { margin-top: auto; }
.home-footer-bottom.fs-footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 12px 24px;
  padding: 22px clamp(20px, 4vw, 64px);
  border-top: 1px solid var(--border-light);
  color: var(--text-secondary);
  font-size: 11px;
  background: var(--bg);
}

.fs-footer a { color: var(--text-secondary); text-decoration: none; }
.fs-footer a:hover { color: var(--text-primary); text-decoration: underline; }

/* Results: keep Degoog's native layout, media modes, plugin slots and controls. */
#results-header { padding-block: 24px 12px; gap: 20px; }
.results-logo { display: block; width: 152px; padding: 8px; margin: 0; background: transparent; border-radius: 3px; line-height: 0; }
.results-logo img { display: block; width: 100%; height: auto; }
#results-search-bar { height: 52px; }
.degoog-search-bar .search-submit-btn { width: 36px; height: 36px; border-radius: 4px; background: var(--fs-accent); color: var(--fs-accent-ink); }
.search-input:focus + div + div + button + button { animation: none; }
#results-tabs { margin-top: 0; }
.degoog-tab.active { color: var(--fs-accent); border-bottom-color: var(--fs-accent); }
.degoog-result { padding-block: 22px; border-bottom: 1px solid var(--border-light); }
.degoog-result--title { font-size: 20px; line-height: 1.4; letter-spacing: -0.02em; margin-top: 8px; overflow-wrap: anywhere; }
.degoog-result--snippet { font-size: 14px; line-height: 1.75; margin-top: 6px; }
.degoog-result--cite { font-size: 12px; }
.degoog-result--actions-toggle { opacity: 0.7; }
.degoog-badge { border-radius: 3px; }
.degoog-panel { border-radius: 8px; box-shadow: none; }
.degoog-dropdown { border-radius: 6px; }
.pagination-current { background: var(--fs-accent); color: var(--fs-accent-ink); border-radius: 4px; }
.pagination-link, .pagination-nav { border-radius: 4px; }
.pagination-pages { flex-wrap: wrap; row-gap: 8px; }
/* No-JS plugin content may arrive without its usual client-side sizing. */
.nojs-results #results-sidebar img { max-width: 100%; height: auto; max-height: 240px; object-fit: contain; }

@media (max-width: 767px) {
  #header { padding-block: 12px; }
  #main-home { padding: 48px 20px 64px; }
  .fs-logo { width: min(100%, 420px); padding: 14px; }

  #home-logo { padding-bottom: 28px; }
  #search-bar-home { padding-inline: 14px; }
  .search-btn { padding-inline: 18px; }
  .home-footer-bottom.fs-footer { justify-content: center; gap: 12px 20px; text-align: center; padding-block: 20px; }

  #results-header { gap: 16px; padding-top: 18px; }
  .results-logo { width: 144px; align-self: flex-start; }
  #nav-settings-results { position: absolute; inset-inline-end: 20px; top: 24px; }
  .degoog-result { padding-block: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}