.sb-page--field-guide {
  width: min(88rem, calc(100% - clamp(1rem, 4vw, 4rem)));
}

.sb-field-guide {
  --guide-panel: #082127;
  --guide-panel-soft: #0d2c31;
  --guide-ink: #f4f4e9;
  --guide-muted: #a9c4c1;
  --guide-mint: #82efbc;
  --guide-gold: #e0b75c;
  --guide-red: #d94c3f;
  color: var(--guide-ink);
  margin: 0 auto;
  max-width: 1320px;
}

.sb-field-guide *,
.sb-field-guide *::before,
.sb-field-guide *::after { box-sizing: border-box; }
.sb-field-guide [hidden] { display: none !important; }

.sb-field-guide h1,
.sb-field-guide h2,
.sb-field-guide h3 { color: var(--guide-ink); line-height: 1.08; margin: 0; }

.sb-field-guide h1 { font-size: clamp(2.4rem, 4.8vw, 4.4rem); letter-spacing: -0.045em; max-width: 14ch; }
.sb-field-guide h2 { font-size: clamp(1.55rem, 3vw, 2.4rem); }
.sb-field-guide h3 { font-size: 1.16rem; }
.sb-field-guide p { color: var(--guide-muted); }

.sb-field-guide__hero {
  background:
    radial-gradient(circle at 86% 16%, rgba(224, 183, 92, 0.18), transparent 16rem),
    repeating-linear-gradient(-45deg, transparent 0 20px, rgba(130, 239, 188, 0.035) 20px 21px),
    linear-gradient(135deg, #0b3033, #06171c 72%);
  border: 1px solid rgba(224, 183, 92, 0.58);
  border-radius: 1rem;
  display: grid;
  gap: 0;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  overflow: hidden;
  padding: 0;
  position: relative;
}

.sb-field-guide__eyebrow {
  color: var(--guide-mint) !important;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.15em;
  margin: 0 0 0.75rem;
  text-transform: uppercase;
}

.sb-field-guide__lede { font-size: clamp(1.05rem, 2vw, 1.25rem); max-width: 50rem; }
.sb-field-guide__hero-copy { align-self: center; padding: clamp(1.4rem, 3.5vw, 3rem); }
.sb-field-guide__hero-art { margin: 0; min-width: 0; position: relative; overflow: hidden; }
.sb-field-guide__hero-art img { display: block; width: 100%; height: 100%; min-height: 22rem; object-fit: cover; object-position: 66% center; }
.sb-field-guide__hero-art figcaption { position: absolute; bottom: 0; left: 0; right: 0; padding: 2rem 1rem 0.8rem; background: linear-gradient(transparent, rgba(3, 16, 19, 0.95)); font-size: 0.85rem; font-weight: 700; color: var(--guide-ink); }

.sb-field-guide__legend {
  grid-column: 1 / -1;
  align-self: end;
  background: rgba(3, 16, 19, 0.8);
  border-left: 0.25rem solid var(--guide-gold);
  border-radius: 0;
  display: grid;
  gap: 0.35rem;
  padding: 1.15rem;
  position: relative;
  z-index: 1;
}

.sb-field-guide__legend span { color: var(--guide-muted); }

.sb-field-guide__workspace {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 23rem);
  margin-top: 1.25rem;
}

.sb-field-guide__tips,
.sb-field-guide__rail-card,
.sb-field-guide__trusted {
  background: rgba(7, 29, 34, 0.94);
  border: 1px solid rgba(130, 239, 188, 0.25);
  border-radius: 1rem;
}

.sb-field-guide__tips { min-width: 0; padding: clamp(1.1rem, 3vw, 2rem); }
.sb-field-guide__rail { display: grid; gap: 1.25rem; align-content: start; }
.sb-field-guide__rail-card { padding: 1.4rem; }
.sb-field-guide__rail-card--contribute { background: linear-gradient(155deg, rgba(28, 67, 57, 0.95), rgba(7, 29, 34, 0.98)); border-color: rgba(224, 183, 92, 0.55); }
.sb-field-guide__rail-links { display: grid; gap: 0.55rem; }

.sb-field-guide__section-heading {
  align-items: flex-start;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
}

.sb-field-guide__primary,
.sb-field-guide__secondary,
.sb-field-guide__small-button {
  appearance: none;
  border-radius: 0.55rem;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: 800;
  justify-content: center;
  line-height: 1.2;
  padding: 0.8rem 1rem;
  text-decoration: none;
}

.sb-field-guide__primary { background: linear-gradient(#df5144, #b8322b); border: 1px solid #ef8175; color: #fff; }
.sb-field-guide__secondary,
.sb-field-guide__small-button { background: #153d42; border: 1px solid rgba(130, 239, 188, 0.55); color: var(--guide-mint); }
.sb-field-guide__primary:hover,
.sb-field-guide__primary:focus { color: #fff; filter: brightness(1.08); }
.sb-field-guide__secondary:hover,
.sb-field-guide__secondary:focus { color: #c9f8df; }
.sb-field-guide button:disabled { cursor: wait; opacity: 0.62; }

.sb-field-guide__filters,
.sb-field-guide__form-grid {
  display: grid;
  gap: 0.9rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 1.4rem;
}

.sb-field-guide label { color: var(--guide-ink); display: grid; font-size: 0.9rem; font-weight: 700; gap: 0.35rem; }
.sb-field-guide input,
.sb-field-guide select,
.sb-field-guide textarea {
  background: #06191e;
  border: 1px solid #46757a;
  border-radius: 0.5rem;
  color: var(--guide-ink);
  font: inherit;
  min-height: 2.9rem;
  padding: 0.65rem 0.75rem;
  width: 100%;
}
.sb-field-guide textarea { line-height: 1.55; resize: vertical; }
.sb-field-guide select:disabled { opacity: 0.55; }
.sb-field-guide small { color: var(--guide-muted); font-weight: 400; }

.sb-field-guide__lanes {
  display: flex;
  gap: 0.5rem;
  margin-top: 1rem;
  overflow-x: auto;
  padding: 0.25rem 0.1rem 0.45rem;
  scrollbar-width: thin;
}

.sb-field-guide__lanes button {
  background: transparent;
  border: 1px solid rgba(130, 239, 188, 0.36);
  border-radius: 999px;
  color: var(--guide-muted);
  cursor: pointer;
  flex: 0 0 auto;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 800;
  padding: 0.55rem 0.85rem;
}
.sb-field-guide__lanes button[aria-pressed='true'] { background: var(--guide-gold); border-color: var(--guide-gold); color: #17201b; }
.sb-field-guide__lane-note { font-size: 0.92rem; margin: 0.75rem 0 1rem; }

.sb-field-guide__tip-list { display: grid; gap: 0.8rem; }
.sb-field-guide__tip {
  background: #0d2930;
  border: 1px solid rgba(86, 139, 143, 0.52);
  border-left: 0.22rem solid var(--guide-mint);
  border-radius: 0.7rem;
  padding: 1rem;
}
.sb-field-guide__tip-meta { display: flex; flex-wrap: wrap; gap: 0.45rem; }
.sb-field-guide__tip-meta span {
  border: 1px solid rgba(224, 183, 92, 0.38);
  border-radius: 999px;
  color: #f3d891;
  font-size: 0.76rem;
  font-weight: 750;
  padding: 0.25rem 0.55rem;
}
.sb-field-guide__tip-text { color: var(--guide-ink) !important; font-size: 1.02rem; line-height: 1.65; margin: 0.85rem 0 0.45rem; white-space: pre-line; }
.sb-field-guide__byline { font-size: 0.84rem; margin: 0; }
.sb-field-guide__tip-sources { display: flex; flex-wrap: wrap; gap: 0.45rem 0.8rem; margin-top: 0.6rem; font-size: 0.88rem; }
.sb-field-guide__tip-sources a { color: #c8f4e0; text-underline-offset: 0.15em; }
.sb-field-guide__tip-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 0.45rem; margin-top: 0.9rem; }
.sb-field-guide__tip-actions button {
  background: #153b40;
  border: 1px solid rgba(130, 239, 188, 0.38);
  border-radius: 0.45rem;
  color: var(--guide-ink);
  cursor: pointer;
  font: inherit;
  font-size: 0.85rem;
  font-weight: 750;
  padding: 0.5rem 0.65rem;
}
.sb-field-guide__tip-actions .sb-field-guide__text-action { background: transparent; color: var(--guide-mint); }
.sb-field-guide__tip-actions .is-danger { color: #f6a49c; }
.sb-field-guide__report { border-top: 1px solid rgba(130, 239, 188, 0.18); margin-top: 0.8rem; padding-top: 0.65rem; }
.sb-field-guide__report summary { color: var(--guide-muted); cursor: pointer; font-size: 0.86rem; }
.sb-field-guide__report form { display: grid; gap: 0.7rem; margin-top: 0.7rem; }
.sb-field-guide__empty { border: 1px dashed #487376; border-radius: 0.75rem; padding: 2.5rem 1.2rem; text-align: center; }
.sb-field-guide__empty strong { display: block; font-size: 1.1rem; }
.sb-field-guide__empty p { margin-bottom: 0; }
.sb-field-guide__status { min-height: 1.5rem; }
.sb-field-guide .is-error { color: #ffaaa2 !important; }

.sb-field-guide__trusted { margin-top: 1.25rem; padding: clamp(1.1rem, 3vw, 2rem); }
.sb-field-guide__trusted-grid { display: grid; gap: 0.8rem; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 1rem; }
.sb-field-guide__trusted-grid article { background: rgba(13, 44, 49, 0.8); border-radius: 0.65rem; padding: 1rem; }
.sb-field-guide__trusted-grid article p { color: var(--guide-gold); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.12em; margin: 0 0 0.35rem; text-transform: uppercase; }
.sb-field-guide__trusted-grid article span { color: var(--guide-muted); font-size: 0.86rem; }
.sb-field-guide__trusted-grid article .sb-field-guide__trusted-why { color: var(--guide-muted); font-size: 0.92rem; font-weight: 400; letter-spacing: 0; line-height: 1.5; margin: 0.7rem 0; text-transform: none; }
.sb-field-guide__trusted-grid article small { color: #b8d4d0; display: block; }

.sb-field-guide__dialog {
  background: transparent;
  border: 0;
  color: var(--guide-ink);
  max-height: min(90vh, calc(100dvh - 2rem));
  max-width: min(48rem, calc(100% - 1rem));
  overflow: auto;
  padding: 0;
  width: 100%;
}
.sb-field-guide__dialog::backdrop { background: rgba(0, 9, 10, 0.84); backdrop-filter: blur(0.25rem); }
.sb-field-guide__dialog-shell { background: #082329; border: 1px solid rgba(224, 183, 92, 0.6); border-radius: 0.9rem; box-shadow: 0 2rem 5rem rgba(0, 0, 0, 0.5); padding: clamp(1rem, 4vw, 2rem); }
.sb-field-guide__dialog-heading { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; }
.sb-field-guide__dialog-heading > button { background: transparent; border: 0; color: var(--guide-muted); cursor: pointer; font-size: 2rem; line-height: 1; }
.sb-field-guide__form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sb-field-guide__form-grid .wide { grid-column: 1 / -1; }
.sb-field-guide__check { align-items: start; display: grid !important; grid-template-columns: auto 1fr; }
.sb-field-guide__check input { margin-top: 0.2rem; min-height: auto; width: auto; }
.sb-field-guide__dialog-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1rem; }

.sb-field-guide :where(button, a, input, select, textarea):focus-visible {
  outline: 0.2rem solid #b7ffe0;
  outline-offset: 0.16rem;
}

@media (max-width: 960px) {
  .sb-field-guide__workspace { grid-template-columns: 1fr; }
  .sb-field-guide__rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sb-field-guide__trusted-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .sb-page--field-guide { width: min(100% - 1rem, 88rem); }
  .sb-field-guide__hero { grid-template-columns: 1fr; padding: 0; }
  .sb-field-guide h1 { max-width: none; }
  .sb-field-guide__hero-art img { min-height: 0; height: auto; }
  .sb-field-guide__section-heading { align-items: stretch; flex-direction: column; }
  .sb-field-guide__filters,
  .sb-field-guide__form-grid,
  .sb-field-guide__trusted-grid,
  .sb-field-guide__rail { grid-template-columns: 1fr; }
  .sb-field-guide__form-grid .wide { grid-column: auto; }
  .sb-field-guide__primary,
  .sb-field-guide__secondary { width: 100%; }
}

@media (forced-colors: active) {
  .sb-field-guide__hero,
  .sb-field-guide__tips,
  .sb-field-guide__rail-card,
  .sb-field-guide__trusted,
  .sb-field-guide__tip { border: 1px solid CanvasText; }
}