/* Sasquatch: fog, firs, old timber, and a trail worth following. */
html[data-theme='sasquatch'] { color-scheme: dark; }
html[data-theme='sasquatch'] body {
  --bg: #0c1511;
  --bg-secondary: #16231b;
  --text: #eee9db;
  --text-muted: #b3bfaf;
  --accent: #d8bd80;
  --accent-hover: #f3dca2;
  --border: #465440;
  --body-font: Arial, Helvetica, sans-serif;
  --heading-font: Georgia, 'Times New Roman', serif;
  background: linear-gradient(180deg, #09120ee8, #0c1511bd 60%, #0c1511f5), url('/images/sasquatch/misty-forest.webp') center / cover fixed, #0c1511;
  color: var(--text);
  font-family: var(--body-font);
}
html[data-theme='sasquatch'] .sasquatch-only { display: block; }
html[data-theme='sasquatch'] a:focus-visible { outline-color: #f3dca2; }
html[data-theme='sasquatch'] .surface::after,
html[data-theme='sasquatch'] .monitor::after,
html[data-theme='sasquatch'] .rack::before,
html[data-theme='sasquatch'] .rack::after { display: none; }

/* The existing expanding menu keeps its familiar scrolling behavior. */
html[data-theme='sasquatch'] .site-home { --header-hero-logo: 140px; --header-hero-font: clamp(38px, 5vw, 64px); }
html[data-theme='sasquatch'] header nav {
  background: repeating-linear-gradient(2deg, #d2ad6a04 0 1px, transparent 1px 7px), linear-gradient(105deg, #25261d, #111c15 70%);
  border-bottom: 1px solid #7f7651;
  padding-block: 22px;
  box-shadow: 0 8px 28px #0003;
}
html[data-theme='sasquatch'] header .nav-brand { gap: 18px; }
html[data-theme='sasquatch'] header .nav-brand-logo { padding: 8px; mix-blend-mode: normal; border-radius: 0; filter: brightness(0) saturate(100%) invert(81%) sepia(25%) saturate(492%) hue-rotate(2deg) brightness(92%) contrast(91%); }
html[data-theme='sasquatch'] header .nav-brand-name { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; text-transform: none; letter-spacing: -.035em; }
html[data-theme='sasquatch'] .nav-brand-first { color: #eee9db; }
html[data-theme='sasquatch'] .nav-brand-rest { color: #d8bd80; }
html[data-theme='sasquatch'] .nav-categories { gap: 26px; }
html[data-theme='sasquatch'] .nav-categories a { font: 13px/1.5 Arial, sans-serif; color: #c4cebe; padding-block: 8px; }
html[data-theme='sasquatch'] .nav-categories a:hover { color: #f3dca2; }
html[data-theme='sasquatch'] .terminal-main { padding-top: 32px; }

html[data-theme='sasquatch'] .sasquatch-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 430px;
  padding: 58px 48px 70px;
  border: 1px solid #6b76634d;
  background: linear-gradient(90deg, #101e16ed 0%, #14251cb3 45%, #1c30261a 100%), url('/images/sasquatch/misty-forest.webp') center 58% / cover;
  box-shadow: 0 20px 65px #0004;
}
html[data-theme='sasquatch'] .sasquatch-hero::after { content: ''; position: absolute; inset: auto 0 0; height: 160px; z-index: -1; background: url('/images/sasquatch/treeline.svg') bottom / 100% 100% no-repeat; pointer-events: none; }
html[data-theme='sasquatch'] .sasquatch-hero-copy { position: relative; z-index: 2; max-width: 610px; }
html[data-theme='sasquatch'] .sasquatch-eyebrow { margin: 0 0 24px; color: #d8bd80; font: 11px/1.6 Arial, sans-serif; letter-spacing: .2em; text-transform: uppercase; }
html[data-theme='sasquatch'] .sasquatch-hero h2 { margin: 0 0 22px; color: #f5efdf; font: 400 clamp(40px, 5.3vw, 72px)/1.05 Georgia, serif; letter-spacing: -.045em; text-shadow: 0 2px 18px #091510; }
html[data-theme='sasquatch'] .sasquatch-hero-copy > p:last-of-type { color: #d0d8c8; font: 15px/1.7 Arial, sans-serif; margin: 0 0 25px; }
html[data-theme='sasquatch'] .sasquatch-trail-link { display: inline-flex; align-items: center; gap: 30px; min-height: 44px; padding: 8px 0; border-bottom: 1px solid #d8bd8099; color: #f3dca2; font: 14px/1.5 Arial, sans-serif; text-decoration: none; }
html[data-theme='sasquatch'] .sasquatch-trail-link:hover { color: #fff2ce; border-color: currentColor; }
html[data-theme='sasquatch'] .sasquatch-sighting { position: absolute; width: 205px; height: 260px; right: 10%; bottom: 30px; z-index: 1; background: url('/images/sasquatch/sasquatch.svg') center / contain no-repeat; transform: rotate(-3deg); opacity: .92; }
html[data-theme='sasquatch'] .sasquatch-hero-caption { position: absolute; right: 24px; bottom: 16px; color: #c3ccbb; font: 9px/1.5 Arial, sans-serif; letter-spacing: .14em; text-transform: uppercase; }

/* Clear reading surfaces below the forest scene. */
html[data-theme='sasquatch'] .rack { margin-top: 28px; padding: 36px 42px; border: 1px solid #465440; background: linear-gradient(120deg, #1b2a20f5, #111e17fa); box-shadow: 0 18px 45px #0003; }
html[data-theme='sasquatch'] .monitor { border: 0; border-radius: 0; background: transparent; color: #eee9db; box-shadow: none; font-family: Arial, sans-serif; }
html[data-theme='sasquatch'] .terminal-titlebar { padding: 0; border: 0; background: none; }
html[data-theme='sasquatch'] .monitor-label { color: #eee9db; font: 400 32px/1.2 Georgia, serif; }
html[data-theme='sasquatch'] .terminal-icon,
html[data-theme='sasquatch'] .window-controls,
html[data-theme='sasquatch'] .monitor-prompt,
html[data-theme='sasquatch'] .terminal-art,
html[data-theme='sasquatch'] .terminal-comment,
html[data-theme='sasquatch'] .terminal-status,
html[data-theme='sasquatch'] .terminal-tree .tree-root,
html[data-theme='sasquatch'] .terminal-tree .tree-branch,
html[data-theme='sasquatch'] .terminal-tree a[data-theme-choice],
html[data-theme='sasquatch'] .patches,
html[data-theme='sasquatch'] .rail { display: none; }
html[data-theme='sasquatch'] .terminal-session { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(230px, 1fr); gap: 44px; padding: 22px 0 0; }
html[data-theme='sasquatch'] .workbench-intro { margin: 0; color: #d1dacb; font: 17px/1.85 Arial, sans-serif; }
/* A battered roadside sign, built over a real weathered-wood photograph. */
html[data-theme='sasquatch'] .terminal-menu {
  position: relative;
  isolation: isolate;
  align-self: start;
  margin: -22px 0 0;
  padding: 8px 10px 42px;
  border: 0;
}
html[data-theme='sasquatch'] .terminal-menu::before {
  content: '';
  position: absolute;
  z-index: -1;
  top: 28px;
  bottom: 0;
  left: calc(50% - 19px);
  width: 38px;
  background: linear-gradient(90deg, #302415a1, #5b4a2c33 45%, #1c180cb3), url('/images/sasquatch/weathered-sign-wood.webp') 38% center / auto 380px;
  box-shadow: inset 3px 0 0 #bfa77b33, inset -4px 0 0 #0c100766, 6px 7px 10px #0005;
  clip-path: polygon(9% 0, 87% 1%, 100% 17%, 91% 37%, 97% 62%, 86% 100%, 12% 100%, 3% 74%, 9% 39%, 0 10%);
  transform: rotate(2deg);
}
html[data-theme='sasquatch'] .sasquatch-trail-heading {
  position: relative;
  margin: 0 8px 19px;
  padding: 13px 10px;
  border: 1px solid #8e7c554d;
  background: linear-gradient(#292e20d9, #1c2419e6), url('/images/sasquatch/weathered-sign-wood.webp') center 20% / 330px auto;
  box-shadow: 2px 4px 0 #090f0a, 0 6px 14px #0005, inset 0 0 0 3px #c7ba8b22;
  color: #dfd5b2;
  font: 700 clamp(10px, 1vw, 13px)/1.3 'Arial Narrow', Arial, sans-serif;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: .15em;
  text-shadow: 1px 2px 1px #0a1009;
  transform: rotate(-2deg);
}
html[data-theme='sasquatch'] .sasquatch-trail-heading::after { content: ''; position: absolute; width: 5px; height: 5px; border-radius: 50%; top: 6px; left: 6px; background: #69523c; box-shadow: 0 1px 1px #000, 1px 0 0 #b3a17b, 0 26px 0 #69523c; }
html[data-theme='sasquatch'] .terminal-tree { display: grid; gap: 17px; margin: 0; width: 100%; font: 700 clamp(18px, 2vw, 26px)/1.3 'Arial Narrow', Arial, sans-serif; }
html[data-theme='sasquatch'] .terminal-tree a[id] {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 66px;
  padding: 14px 40px 14px 20px;
  border: 0;
  color: #f3e7c5;
  white-space: normal;
  text-transform: uppercase;
  letter-spacing: .09em;
  text-shadow: 1px 2px 1px #16160d, -1px 0 #ded0a52e;
  transform: rotate(-3deg);
}
html[data-theme='sasquatch'] .terminal-tree a[id]::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(0deg, #1b170d77, #65502c22 45%, #2d261622), url('/images/sasquatch/weathered-sign-wood.webp') 50% 34% / cover;
  box-shadow: inset 0 3px 0 #b9ac8466, inset 0 -5px 0 #1b190bcc, inset 0 0 14px #100e0a88;
  clip-path: polygon(0 6%, 7% 3%, 22% 5%, 33% 0, 59% 3%, 83% 0, 88% 13%, 97% 37%, 100% 50%, 88% 90%, 83% 100%, 66% 96%, 59% 99%, 40% 95%, 25% 99%, 13% 93%, 2% 97%, 0 73%, 2% 57%, 0 39%);
}
html[data-theme='sasquatch'] .terminal-tree a[id]::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 14px 17px, #b6a382 0 1px, #5a3a24 1px 3px, #251b1380 3px 5px, transparent 6px), radial-gradient(circle at 16px calc(100% - 16px), #a49272 0 1px, #5a3a24 1px 3px, #251b1380 3px 5px, transparent 6px);
}
html[data-theme='sasquatch'] #workbench-blog-link { transform: rotate(2.5deg); padding-inline: 40px 20px; }
html[data-theme='sasquatch'] #workbench-blog-link::before { background-position: 50% 71%; transform: scaleX(-1); }
html[data-theme='sasquatch'] #workbench-blog-link::after { transform: scaleX(-1); }
html[data-theme='sasquatch'] #workbench-themes-link { transform: rotate(-1.5deg); }
html[data-theme='sasquatch'] #workbench-themes-link::before { background-position: 50% 93%; }
html[data-theme='sasquatch'] .workbench-path-label { display: none; }
html[data-theme='sasquatch'] .terminal-tree a[id] > span:last-child { text-decoration: none; }
html[data-theme='sasquatch'] .terminal-tree a:hover { color: #fff8df; background: transparent; }
html[data-theme='sasquatch'] .terminal-tree a[id]:is(:hover, :focus-visible)::before { background-color: #a0906033; background-blend-mode: screen, normal; }
html[data-theme='sasquatch'] .terminal-tree a:focus-visible { outline: 2px solid #f3dca2; outline-offset: 5px; }
html[data-theme='sasquatch'] body:not(.site-home) > main { margin-block: 38px; padding: 36px 42px; width: calc(100% - 32px); border: 1px solid #465440; background: #111e17f5; box-shadow: 0 20px 55px #0004; }
html[data-theme='sasquatch'] h1, html[data-theme='sasquatch'] h2, html[data-theme='sasquatch'] h3 { color: #eee9db; font-family: Georgia, serif; font-weight: 400; }
html[data-theme='sasquatch'] :is(pre, blockquote) { background: #0c1711; border-color: #617153; }
html[data-theme='sasquatch'] :is(.post-item, footer) { border-color: #465440; }
html[data-theme='sasquatch'] :is(time, .site-footer, body > footer) { color: #b3bfaf; }
html[data-theme='sasquatch'] .site-footer { margin-top: 10px; padding-bottom: 70px; font: 10px/1.7 Arial, sans-serif; }
html[data-theme='sasquatch'] .theme-option { font-family: Arial, sans-serif; color: #dfc990; border-color: #617153; }
html[data-theme='sasquatch'] .theme-option strong { font: 400 27px/1.3 Georgia, serif; }
html[data-theme='sasquatch'] .theme-option span { color: #d1dacb; }
html[data-theme='sasquatch'] .theme-option:is(:hover, [aria-current]) { border-color: #dfc990; background-color: #d7b76c10; }
html[data-theme='sasquatch'] .navigation-effects-toggle { color: #d8bd80; background: #102017f5; border-color: #617153; }
/* A visual swatch makes the new theme easy to find from every appearance. */
html .theme-option-sasquatch { background: linear-gradient(90deg, #102017f2, #102017b3), url('/images/sasquatch/misty-forest-small.webp') center 65% / cover; border-color: #617153; }
html .theme-option-sasquatch strong { color: #ead39b; }
html .theme-option-sasquatch span { color: #d1dacb; }

@media (max-width: 900px) {
  html[data-theme='sasquatch'] .sasquatch-hero { padding: 44px 30px 65px; min-height: 390px; }
  html[data-theme='sasquatch'] .sasquatch-hero-copy { max-width: 70%; }
  html[data-theme='sasquatch'] .sasquatch-sighting { right: 5%; width: 155px; height: 210px; }
  html[data-theme='sasquatch'] .rack { padding: 30px; }
  html[data-theme='sasquatch'] .terminal-session { gap: 28px; grid-template-columns: minmax(0, 1.2fr) minmax(180px, 1fr); }
  html[data-theme='sasquatch'] .terminal-menu { padding-inline: 6px; }
}
@media (max-width: 700px) {
  html[data-theme='sasquatch'] body { background-image: linear-gradient(180deg, #09120ee8, #0c1511c9 60%, #0c1511f5), url('/images/sasquatch/misty-forest-small.webp'); background-attachment: scroll; }
  html[data-theme='sasquatch'] .site-home { --header-hero-logo: 88px; --header-hero-font: clamp(30px, 8vw, 46px); }
  html[data-theme='sasquatch'] header nav { padding-block: 16px; gap: 14px; }
  html[data-theme='sasquatch'] header .nav-brand { gap: 8px; }
  html[data-theme='sasquatch'] header .nav-brand-name { font-size: 28px; }
  html[data-theme='sasquatch'] .nav-categories { width: 100%; justify-content: space-between; gap: 12px; }
  html[data-theme='sasquatch'] .nav-categories a { font-size: 12px; }
  html[data-theme='sasquatch'] .terminal-main { padding-top: 20px; }
  html[data-theme='sasquatch'] .sasquatch-hero { padding: 28px 22px 210px; min-height: 480px; background-image: linear-gradient(180deg, #101e16e6, #14251c73 55%, #14251c1a), url('/images/sasquatch/misty-forest-small.webp'); background-position: center; }
  html[data-theme='sasquatch'] .sasquatch-hero-copy { max-width: none; }
  html[data-theme='sasquatch'] .sasquatch-eyebrow { font-size: 9px; letter-spacing: .11em; margin-bottom: 18px; }
  html[data-theme='sasquatch'] .sasquatch-hero h2 { font-size: clamp(34px, 9vw, 56px); }
  html[data-theme='sasquatch'] .sasquatch-hero-copy > p:last-of-type { font-size: 13px; }
  html[data-theme='sasquatch'] .sasquatch-sighting { height: 190px; width: 150px; right: 15%; bottom: 28px; }
  html[data-theme='sasquatch'] .sasquatch-hero-caption { font-size: 8px; right: 15px; }
  html[data-theme='sasquatch'] .rack { margin-top: 20px; padding: 26px 22px; }
  html[data-theme='sasquatch'] .monitor-label { font-size: 27px; }
  html[data-theme='sasquatch'] .terminal-session { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  html[data-theme='sasquatch'] .workbench-intro { font-size: 16px; }
  html[data-theme='sasquatch'] .terminal-menu { width: 100%; max-width: 360px; margin: 0 auto; padding: 8px 10px 42px; border: 0; }
  html[data-theme='sasquatch'] .sasquatch-trail-heading { font-size: 12px; }
  html[data-theme='sasquatch'] .terminal-tree { font-size: 22px; }
  html[data-theme='sasquatch'] body:not(.site-home) > main { padding: 26px 22px; margin-block: 24px; }
}