/* DayStar FOV simulator. Every rule is scoped under #dsfov so WordPress theme
   styles can't leak in (and ours can't leak out). Palette: red / black / white. */
#dsfov {
  --ds-red: #c8102e; --ds-red-dark: #9b0c23; --ds-red-tint: #fdecef;
  --ds-black: #111111; --ds-ink: #1b1b1b; --ds-grey-1: #2a2a2a; --ds-grey-5: #6b6b6b;
  --ds-grey-7: #bdbdbd; --ds-grey-8: #dcdcdc; --ds-grey-9: #f4f4f4; --ds-white: #ffffff;
  max-width: 1100px; margin: 0 auto 24px; color: var(--ds-ink); font-size: 16px; line-height: 1.45; text-align: left;
}
#dsfov *, #dsfov *::before, #dsfov *::after { box-sizing: border-box; }
#dsfov { overflow-anchor: none; } /* we manage scrolling ourselves during the roll-up */
#dsfov [hidden] { display: none !important; }
#dsfov p { margin: 0 0 10px; }
#dsfov strong { font-weight: 700; }

/* ---------------------------------------------------------------- messages */
#dsfov .dsfov-msg { padding: 14px 16px; border-radius: 8px; background: var(--ds-grey-9); border-left: 4px solid var(--ds-black); }
#dsfov .dsfov-msg-err { border-left-color: var(--ds-red); background: var(--ds-red-tint); }
#dsfov:not(.is-ready) .dsfov-step { display: none; }

/* ---------------------------------------------------------------- step bands */
#dsfov .dsfov-step { border: 1px solid var(--ds-grey-8); border-radius: 10px; margin: 0 0 10px; overflow: hidden; background: var(--ds-white); }
#dsfov .dsfov-head { margin: 0; padding: 0; font-size: inherit; line-height: inherit; border: 0; }
#dsfov .dsfov-head::before, #dsfov .dsfov-head::after { display: none; }
#dsfov button.dsfov-bar {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 58px; margin: 0; padding: 12px 18px;
  background: var(--ds-black); color: var(--ds-white); border: 0; border-radius: 0; box-shadow: none;
  font: inherit; font-size: 18px; font-weight: 700; line-height: 1.25; text-align: left; text-transform: none;
  letter-spacing: normal; cursor: pointer; scroll-margin-top: 90px; transition: background-color .15s;
}
#dsfov button.dsfov-bar:hover:not(:disabled) { background: var(--ds-grey-1); }
#dsfov button.dsfov-bar:focus-visible { outline: 3px solid var(--ds-red); outline-offset: -3px; }
#dsfov .dsfov-num {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px;
  border-radius: 50%; background: var(--ds-red); color: var(--ds-white); font-size: 16px; font-weight: 700;
}
#dsfov .dsfov-title { flex: 0 0 auto; }
#dsfov .dsfov-summary {
  flex: 1 1 auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  font-size: 15px; font-weight: 400; color: #d6d6d6; text-align: right;
}
#dsfov .dsfov-caret {
  flex: 0 0 auto; width: 10px; height: 10px; margin: 0 4px 4px auto; border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .2s; opacity: .85;
}
#dsfov .is-open .dsfov-caret { transform: rotate(-135deg); margin-bottom: -4px; }
#dsfov .is-open .dsfov-summary { visibility: hidden; }
#dsfov .is-done .dsfov-num { position: relative; background: var(--ds-white); color: transparent; }
#dsfov .is-done .dsfov-num::after { /* tick replaces the number once answered */
  content: "\2713"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--ds-red);
}
#dsfov .is-locked button.dsfov-bar, #dsfov .is-skipped button.dsfov-bar { background: var(--ds-grey-9); color: var(--ds-grey-5); cursor: default; }
#dsfov .is-locked .dsfov-num, #dsfov .is-skipped .dsfov-num { background: var(--ds-grey-7); color: var(--ds-white); }
#dsfov .is-skipped .dsfov-summary { color: var(--ds-grey-5); }
#dsfov .is-skipped .dsfov-caret, #dsfov .is-locked .dsfov-caret { opacity: .35; }
#dsfov .dsfov-panel { padding: 18px; border-top: 3px solid var(--ds-red); }
#dsfov .dsfov-intro { color: var(--ds-grey-5); margin-bottom: 14px; }

/* ---------------------------------------------------------------- option cards */
#dsfov .dsfov-opt { background: var(--ds-grey-9); border: 1px solid var(--ds-grey-8); border-radius: 8px; padding: 16px; min-width: 0; }
#dsfov .dsfov-opt.is-attn { border-color: var(--ds-red); box-shadow: 0 0 0 3px rgba(200, 16, 46, .18); }
#dsfov .dsfov-opt-h { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font-size: 17px; font-weight: 700; color: var(--ds-black); }
#dsfov .dsfov-opt-h label { margin: 0; font: inherit; color: inherit; cursor: pointer; }
#dsfov .dsfov-badge {
  display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%;
  background: var(--ds-black); color: var(--ds-white); font-size: 14px; font-weight: 700; flex: 0 0 auto;
}
#dsfov .dsfov-or { display: flex; align-items: center; gap: 12px; margin: 14px 0; color: var(--ds-red); }
#dsfov .dsfov-or::before, #dsfov .dsfov-or::after { content: ""; flex: 1; height: 1px; background: var(--ds-grey-7); }
#dsfov .dsfov-or span {
  font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; padding: 3px 10px;
  border: 1.5px solid var(--ds-red); border-radius: 999px; background: var(--ds-white);
}
#dsfov .dsfov-optrow { display: block; }
#dsfov .dsfov-pair > div + div { margin-top: 12px; }
@media (min-width: 760px) {
  #dsfov .dsfov-optrow { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; }
  #dsfov .dsfov-optrow > .dsfov-opt { align-self: start; }
  #dsfov .dsfov-or-v { flex-direction: column; margin: 0 14px; }
  #dsfov .dsfov-or-v::before, #dsfov .dsfov-or-v::after { width: 1px; height: auto; flex: 1; }
  #dsfov .dsfov-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
  #dsfov .dsfov-pair > div + div { margin-top: 0; }
}

/* ---------------------------------------------------------------- form controls */
#dsfov .dsfov-lbl { display: block; margin: 0 0 5px; font-size: 14px; font-weight: 600; color: var(--ds-grey-1); }
#dsfov .dsfov-modelwrap { margin-top: 12px; }
#dsfov .dsfov-pair .dsfov-modelwrap { margin-top: 0; }
#dsfov .dsfov-input {
  display: block; width: 100%; max-width: none; height: auto; min-height: 46px; margin: 0; padding: 10px 12px;
  font: inherit; font-size: 16px; line-height: 1.3; color: var(--ds-ink); background: var(--ds-white);
  border: 1px solid var(--ds-grey-7); border-radius: 6px; box-shadow: none; outline: none;
}
#dsfov select.dsfov-input { padding-right: 34px; cursor: pointer; }
#dsfov .dsfov-input:focus { border-color: var(--ds-red); box-shadow: 0 0 0 3px rgba(200, 16, 46, .18); }
#dsfov .dsfov-search {
  padding-left: 40px; -webkit-appearance: none; appearance: none;
  background: var(--ds-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236b6b6b' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") no-repeat 13px center;
}
#dsfov .dsfov-hint { min-height: 1em; margin: 6px 0 0; font-size: 13px; color: var(--ds-grey-5); }
#dsfov .dsfov-note { font-size: 14px; color: var(--ds-grey-1); }
#dsfov .dsfov-err { margin: 10px 0 0; font-size: 14px; color: var(--ds-red-dark); font-weight: 600; }

/* search results */
#dsfov .dsfov-results {
  list-style: none; margin: 6px 0 0; padding: 0; max-height: 380px; overflow-y: auto; -webkit-overflow-scrolling: touch;
  background: var(--ds-white); border: 1px solid var(--ds-grey-7); border-radius: 6px; box-shadow: 0 6px 18px rgba(0, 0, 0, .08);
}
#dsfov .dsfov-ri {
  display: block; margin: 0; padding: 10px 12px 10px 14px; border-bottom: 1px solid var(--ds-grey-8);
  border-left: 3px solid transparent; cursor: pointer; list-style: none;
}
#dsfov .dsfov-ri:last-child { border-bottom: 0; }
#dsfov .dsfov-ri::before, #dsfov .dsfov-ri::marker { content: none; }
#dsfov .dsfov-ri:hover, #dsfov .dsfov-ri[aria-selected="true"] { background: var(--ds-red-tint); border-left-color: var(--ds-red); }
#dsfov .dsfov-r-main { display: block; font-size: 16px; color: var(--ds-black); }
#dsfov .dsfov-r-aka, #dsfov .dsfov-r-spec { display: block; font-size: 13px; color: var(--ds-grey-5); margin-top: 2px; }
#dsfov .dsfov-r-aka { color: var(--ds-grey-1); }

/* manual entry */
#dsfov fieldset.dsfov-units { display: flex; flex-wrap: wrap; gap: 4px 18px; align-items: center; margin: 0 0 12px; padding: 0; border: 0; min-width: 0; }
#dsfov fieldset.dsfov-units legend { float: left; margin: 0 6px 0 0; padding: 0; }
#dsfov .dsfov-units label { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-size: 15px; cursor: pointer; }
#dsfov .dsfov-units input[type="radio"] { width: 18px; height: 18px; margin: 0; accent-color: var(--ds-red); }
#dsfov .dsfov-mgrid { display: grid; grid-template-columns: minmax(120px, 40%) 1fr; gap: 10px 12px; align-items: center; }
#dsfov .dsfov-mgrid .dsfov-lbl { margin: 0; }
#dsfov .dsfov-u, #dsfov .dsfov-u2 { font-weight: 400; color: var(--ds-grey-5); }
#dsfov .dsfov-mfield { position: relative; }
#dsfov .dsfov-input.is-calc { background: #ececec; color: var(--ds-grey-1); font-style: italic; border-style: dashed; }
#dsfov .dsfov-calc {
  position: absolute; right: 8px; top: 50%; transform: translateY(-50%); font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .05em; color: var(--ds-red); pointer-events: none;
}

/* buttons */
#dsfov .dsfov-btn {
  display: inline-flex; align-items: center; justify-content: center; min-height: 46px; margin: 14px 0 0; padding: 10px 22px;
  font: inherit; font-size: 16px; font-weight: 700; line-height: 1.2; text-transform: none; letter-spacing: normal;
  color: var(--ds-black); background: var(--ds-white); border: 2px solid var(--ds-black); border-radius: 6px;
  box-shadow: none; cursor: pointer; text-decoration: none;
}
#dsfov .dsfov-btn:hover:not(:disabled) { background: var(--ds-black); color: var(--ds-white); }
#dsfov .dsfov-btn-primary { width: 100%; background: var(--ds-red); border-color: var(--ds-red); color: var(--ds-white); }
#dsfov .dsfov-btn-primary:hover:not(:disabled) { background: var(--ds-red-dark); border-color: var(--ds-red-dark); }
#dsfov .dsfov-btn:disabled { opacity: .4; cursor: not-allowed; }
#dsfov .dsfov-btn:focus-visible, #dsfov .dsfov-filter:focus-visible { outline: 3px solid var(--ds-red); outline-offset: 2px; }

/* ---------------------------------------------------------------- step 3 filter cards */
#dsfov .dsfov-filters { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 600px) { #dsfov .dsfov-filters { grid-template-columns: 1fr 1fr; } }
#dsfov button.dsfov-filter {
  display: flex; flex-direction: column; align-items: stretch; width: 100%; margin: 0; padding: 0; overflow: hidden;
  font: inherit; text-align: left; text-transform: none; letter-spacing: normal; color: var(--ds-ink);
  background: var(--ds-white); border: 2px solid var(--ds-grey-8); border-radius: 10px; box-shadow: none; cursor: pointer;
  transition: border-color .15s, box-shadow .15s, transform .15s;
}
#dsfov button.dsfov-filter:hover { border-color: var(--ds-red); box-shadow: 0 6px 18px rgba(0, 0, 0, .12); transform: translateY(-1px); }
#dsfov button.dsfov-filter[aria-pressed="true"] { border-color: var(--ds-red); box-shadow: 0 0 0 3px rgba(200, 16, 46, .2); }
#dsfov .dsfov-filter img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; margin: 0; border: 0; border-radius: 0; background: var(--ds-black); }
#dsfov .dsfov-filter-t { display: block; padding: 12px 14px 2px; font-size: 18px; font-weight: 700; color: var(--ds-black); }
#dsfov .dsfov-filter-d { display: block; padding: 0 14px 14px; font-size: 14px; color: var(--ds-grey-5); }
#dsfov .dsfov-filter[aria-pressed="true"] .dsfov-filter-t::after { content: "  \2713 selected"; color: var(--ds-red); font-size: 14px; }

/* ---------------------------------------------------------------- step 4 placeholder */
#dsfov .dsfov-resgrid { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 860px) { #dsfov .dsfov-resgrid { grid-template-columns: repeat(3, 1fr); } }
#dsfov .dsfov-res { background: var(--ds-grey-9); border: 1px solid var(--ds-grey-8); border-top: 3px solid var(--ds-black); border-radius: 8px; padding: 14px 16px; }
#dsfov .dsfov-res h4 { margin: 0 0 8px; padding: 0; font-size: 17px; font-weight: 700; color: var(--ds-black); }
#dsfov .dsfov-res dl { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; margin: 0; font-size: 14px; }
#dsfov .dsfov-res dt { margin: 0; color: var(--ds-grey-5); font-weight: 400; }
#dsfov .dsfov-res dd { margin: 0; font-weight: 600; word-break: break-word; }
#dsfov .dsfov-actions { margin-top: 6px; }

/* ---------------------------------------------------------------- step transition cues */
@keyframes dsfov-pulse { 0% { box-shadow: 0 0 0 0 rgba(200, 16, 46, .55); } 100% { box-shadow: 0 0 0 14px rgba(200, 16, 46, 0); } }
@keyframes dsfov-pop { 0% { transform: scale(.35); } 65% { transform: scale(1.18); } 100% { transform: scale(1); } }
@keyframes dsfov-slide { from { opacity: 0; transform: translateX(18px); } to { opacity: 1; transform: none; } }
@keyframes dsfov-barflash { 0% { background-color: var(--ds-red); } 100% { background-color: var(--ds-black); } }
#dsfov .dsfov-step.is-arrive { animation: dsfov-pulse 1s ease-out 1; }
#dsfov .is-arrive button.dsfov-bar { animation: dsfov-barflash .9s ease-out 1; }
#dsfov .is-arrive .dsfov-num { animation: dsfov-pop .45s ease-out 1; }
#dsfov .is-justdone .dsfov-num::after { animation: dsfov-pop .45s ease-out 1; }
#dsfov .is-justdone .dsfov-summary { animation: dsfov-slide .55s ease-out 1; }
@media (prefers-reduced-motion: reduce) {
  #dsfov .dsfov-step, #dsfov .dsfov-step * { animation: none !important; transition: none !important; }
}

/* ---------------------------------------------------------------- phones */
@media (max-width: 599px) {
  #dsfov .dsfov-panel { padding: 14px 12px; }
  #dsfov .dsfov-opt { padding: 14px 12px; }
  #dsfov button.dsfov-bar { padding: 10px 12px; gap: 10px; font-size: 17px; min-height: 54px; }
  /* collapsed + answered: show just the answer on one line */
  #dsfov .is-done:not(.is-open) .dsfov-title, #dsfov .is-skipped .dsfov-title { display: none; }
  #dsfov .dsfov-summary { text-align: left; font-size: 15px; color: #e6e6e6; }
  #dsfov .dsfov-step:not(.is-done):not(.is-skipped) .dsfov-summary { display: none; }
  #dsfov .dsfov-results { max-height: 50vh; }
}

/* bare test page (fov.php opened directly) */
body.dsfov-standalone { margin: 0; padding: 20px 12px; background: #fafafa; font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }

/* ---------------------------------------------------------------- step 4 results */
#dsfov .dsfov-r h4 { margin: 0 0 8px; padding: 0; font-size: 18px; font-weight: 700; line-height: 1.3; color: var(--ds-black); text-transform: none; letter-spacing: normal; }
#dsfov .dsfov-r-head { margin: 0 0 12px; }
#dsfov .dsfov-r-head h4 { font-size: 20px; margin: 0; }
#dsfov .dsfov-r-headsub { margin: 2px 0 0; color: var(--ds-red-dark); font-weight: 600; }
#dsfov h4.dsfov-sec { margin: 26px 0 10px; padding-bottom: 6px; border-bottom: 2px solid var(--ds-black); font-size: 19px; }
#dsfov .dsfov-alerts:empty { display: none; }
#dsfov .dsfov-alerts { display: grid; gap: 8px; margin: 0 0 14px; }
#dsfov .dsfov-alert { padding: 10px 14px; border-radius: 6px; font-size: 15px; border-left: 4px solid var(--ds-black); background: var(--ds-grey-9); }
#dsfov .dsfov-alert-warn { border-left-color: var(--ds-red); background: var(--ds-red-tint); }
#dsfov .dsfov-alert strong { color: var(--ds-black); }

#dsfov .dsfov-r-top { display: grid; grid-template-columns: 1fr; gap: 18px; align-items: start; }
@media (min-width: 900px) { #dsfov .dsfov-r-top { grid-template-columns: minmax(0, var(--dsfov-simw, 600px)) minmax(260px, 1fr); } }
#dsfov .dsfov-sim { min-width: 0; }
#dsfov .dsfov-simframe { position: relative; width: 100%; max-width: var(--dsfov-simw, 600px); margin: 0 auto; background: #000; border-radius: 6px; overflow: hidden; box-shadow: 0 2px 10px rgba(0, 0, 0, .25); }
#dsfov .dsfov-canvas { display: block; width: 100%; height: 100%; cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
#dsfov .dsfov-canvas.is-dragging { cursor: grabbing; }
#dsfov .dsfov-simcap { margin-top: 8px; }
#dsfov .dsfov-simdrag { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; }
#dsfov .dsfov-draghint { font-size: 17px; font-weight: 800; color: var(--ds-red); }
#dsfov .dsfov-draghint::before { content: "\2725  "; }
#dsfov .dsfov-simfov { margin-top: 2px; font-size: 13px; color: var(--ds-grey-5); }
#dsfov button.dsfov-linkbtn { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; color: var(--ds-red); font: inherit; font-weight: 700; text-decoration: underline; cursor: pointer; text-transform: none; letter-spacing: normal; }
#dsfov .dsfov-r-side { min-width: 0; }
#dsfov .dsfov-ctls { display: grid; gap: 10px; margin-bottom: 12px; padding: 12px; background: var(--ds-grey-9); border: 1px solid var(--ds-grey-8); border-radius: 8px; }
#dsfov .dsfov-why { font-size: 14px; color: var(--ds-grey-1); padding-left: 10px; border-left: 3px solid var(--ds-red); }
#dsfov dl.dsfov-kv { display: grid; grid-template-columns: auto 1fr; gap: 5px 14px; margin: 0; font-size: 14px; }
#dsfov dl.dsfov-kv dt { margin: 0; color: var(--ds-grey-5); font-weight: 400; }
#dsfov dl.dsfov-kv dd { margin: 0; font-weight: 600; word-break: break-word; }
#dsfov .dsfov-sub { font-weight: 400; color: var(--ds-grey-5); }

/* rating bars */
#dsfov .dsfov-ratings { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 700px) { #dsfov .dsfov-ratings { grid-template-columns: 1fr 1fr; } }
#dsfov .dsfov-rate { padding: 12px 14px 10px; background: var(--ds-white); border: 1px solid var(--ds-grey-8); border-radius: 8px; }
#dsfov .dsfov-rate-h { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 8px; }
#dsfov .dsfov-rate-t { font-weight: 700; color: var(--ds-black); }
#dsfov .dsfov-rate-v { font-size: 20px; font-weight: 800; color: var(--ds-black); white-space: nowrap; }
#dsfov .dsfov-rate-v small { font-size: 13px; font-weight: 600; color: var(--ds-grey-5); }
#dsfov .dsfov-rate-bar { position: relative; height: 18px; border-radius: 9px; background: linear-gradient(to right, #f6c9cf, #f4f4f4 50%, #c9ebcd); border: 1px solid var(--ds-grey-8); }
#dsfov .dsfov-rate-fill { position: absolute; left: 0; top: 6px; height: 4px; border-radius: 2px; background: var(--ds-black); }
#dsfov .dsfov-rate-knob { position: absolute; top: 50%; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; background: var(--ds-black); border: 3px solid var(--ds-white); box-shadow: 0 0 0 2px var(--ds-black); }
#dsfov .dsfov-rate-ends { display: flex; justify-content: space-between; margin-top: 3px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--ds-grey-5); }
#dsfov .dsfov-rate-d { margin: 6px 0 0; font-size: 13px; color: var(--ds-grey-1); }
#dsfov .dsfov-rate.is-unrated .dsfov-rate-bar { opacity: .4; }
#dsfov .dsfov-rate.is-unrated .dsfov-rate-v { font-size: 14px; color: var(--ds-grey-5); }

/* parts list */
#dsfov ul.dsfov-parts { list-style: none; margin: 0; padding: 0; border: 1px solid var(--ds-grey-8); border-radius: 8px; overflow: hidden; }
#dsfov ul.dsfov-parts li { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; margin: 0; padding: 10px 14px; border-bottom: 1px solid var(--ds-grey-8); list-style: none; }
#dsfov ul.dsfov-parts li::before { content: none; }
#dsfov ul.dsfov-parts li:last-child { border-bottom: 0; }
#dsfov ul.dsfov-parts li strong { color: var(--ds-black); }
#dsfov ul.dsfov-parts li span { font-size: 14px; color: var(--ds-grey-5); }
#dsfov ul.dsfov-parts li.dsfov-parts-soon { background: var(--ds-grey-9); font-size: 13px; color: var(--ds-grey-5); font-style: italic; }

/* share + disclaimer */
#dsfov .dsfov-share { margin-top: 26px; padding: 14px 16px; background: var(--ds-grey-9); border: 1px solid var(--ds-grey-8); border-radius: 8px; }
#dsfov .dsfov-share-row { display: flex; flex-wrap: wrap; gap: 8px; }
#dsfov .dsfov-sbtn {
  display: inline-flex; align-items: center; min-height: 40px; margin: 0; padding: 8px 16px; border-radius: 999px;
  font: inherit; font-size: 15px; font-weight: 700; line-height: 1.2; text-decoration: none; text-transform: none; letter-spacing: normal;
  color: var(--ds-white); background: var(--ds-black); border: 2px solid var(--ds-black); box-shadow: none; cursor: pointer;
}
#dsfov .dsfov-sbtn:hover { background: var(--ds-red); border-color: var(--ds-red); color: var(--ds-white); }
#dsfov .dsfov-sbtn-main { background: var(--ds-red); border-color: var(--ds-red); }
#dsfov .dsfov-disclaimer { margin: 22px 0 0; padding-top: 12px; border-top: 1px solid var(--ds-grey-8); font-size: 12.5px; line-height: 1.5; color: var(--ds-grey-5); }

/* application notes from the database */
#dsfov .dsfov-appnotes { margin: 0 0 16px; padding: 12px 16px; background: var(--ds-white); border: 2px solid var(--ds-black); border-left-width: 6px; border-left-color: var(--ds-red); border-radius: 8px; }
#dsfov .dsfov-appnotes h4 { margin: 0 0 8px; font-size: 17px; }
#dsfov .dsfov-appnote + .dsfov-appnote { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--ds-grey-8); }
#dsfov .dsfov-appnote strong { display: block; color: var(--ds-black); font-size: 15px; }
#dsfov .dsfov-appnote p { margin: 2px 0 0; font-size: 15px; white-space: pre-line; }
#dsfov .dsfov-appnote a { color: var(--ds-red); text-decoration: underline; word-break: break-all; }

/* specifications + 2x2 equipment */
#dsfov .dsfov-specs { padding: 14px 16px; background: var(--ds-grey-9); border: 1px solid var(--ds-grey-8); border-radius: 8px; }
@media (min-width: 760px) { #dsfov .dsfov-specs dl.dsfov-kv { grid-template-columns: auto 1fr auto 1fr; gap: 6px 16px; } }
@media (min-width: 700px) { #dsfov .dsfov-resgrid.dsfov-equip { grid-template-columns: 1fr 1fr; } }

/* add to cart */
#dsfov ul.dsfov-parts li { justify-content: space-between; align-items: center; }
#dsfov .dsfov-part-txt { display: flex; flex-wrap: wrap; gap: 2px 12px; align-items: baseline; flex: 1 1 260px; min-width: 0; }
#dsfov a.dsfov-cartbtn, #dsfov a.dsfov-viewbtn {
  display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 18px; margin: 0;
  border-radius: 6px; font: inherit; font-size: 15px; font-weight: 700; line-height: 1.2; text-decoration: none;
  text-transform: none; letter-spacing: normal; white-space: nowrap; box-shadow: none; cursor: pointer;
}
#dsfov a.dsfov-cartbtn { color: var(--ds-white); background: var(--ds-red); border: 2px solid var(--ds-red); }
#dsfov a.dsfov-cartbtn:hover { background: var(--ds-red-dark); border-color: var(--ds-red-dark); color: var(--ds-white); }
#dsfov a.dsfov-viewbtn { color: var(--ds-black); background: var(--ds-white); border: 2px solid var(--ds-black); }
#dsfov a.dsfov-viewbtn:hover { background: var(--ds-black); color: var(--ds-white); }
#dsfov .dsfov-cartall-row { margin-top: 12px; }
#dsfov .dsfov-cartall-row:empty { display: none; }
#dsfov a.dsfov-cartbtn.dsfov-cartall { width: 100%; min-height: 50px; font-size: 17px; }
#dsfov .dsfov-cartnote { margin: 8px 0 0; font-size: 13px; color: var(--ds-grey-5); }
@media (max-width: 599px) { #dsfov ul.dsfov-parts li a.dsfov-cartbtn, #dsfov ul.dsfov-parts li a.dsfov-viewbtn { width: 100%; } }