/* System 1 / R05. Presentation only; original story, images and rack framing stay intact. */
#system-one-page {
  --system-width: calc(100% - 2 * var(--finish-gutter, 40px));
  --system-ink: var(--finish-ink, #eeece6);
  --system-muted: var(--finish-muted, #b5b1a6);
  --system-subtle: var(--finish-subtle, #949087);
  --system-line: var(--finish-line, rgba(235, 230, 217, .18));
  color: var(--system-ink);
  font-weight: 400;
  font-optical-sizing: auto;
  scrollbar-color: #55544d #080a09;
}

#system-one-page .system-subnav {
  padding-inline: var(--finish-gutter, 40px);
  border-color: var(--system-line);
  background: #080a09;
  backdrop-filter: none;
}
#system-one-page .breadcrumb {
  gap: 12px;
  min-height: 44px;
  padding-block: 0;
  font-size: 11px;
  color: var(--system-subtle);
}
#system-one-page .breadcrumb a { display: inline-flex; align-items: center; min-width: 44px; min-height: 44px; }
#system-one-page .breadcrumb > span:last-child { color: var(--system-ink); }
#system-one-page .system-overview-crumb {
  display: inline-flex;
  align-items: center;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--system-ink);
  font: inherit;
  letter-spacing: inherit;
  text-decoration: underline;
  text-decoration-color: var(--system-line);
  text-underline-offset: 4px;
}
#system-one-page .system-overview-crumb:hover { text-decoration-color: currentColor; }
#system-one-page .system-jumps { gap: 28px; }
#system-one-page .system-jumps button {
  min-width: 44px;
  min-height: 44px;
  font-size: 12px;
  font-weight: 400;
  color: var(--system-muted);
}
#system-one-page .system-jumps button:last-child { color: var(--system-ink); }
#system-one-page .system-hero h1 { font-weight: 360; }
#system-one-page .system-eyebrow {
  font-size: 12px;
  line-height: 1.7;
  letter-spacing: .09em;
  color: var(--system-ink);
  margin-bottom: 12px;
}
#system-one-page .system-product-context {
  margin: 0 20px 22px;
  font-size: 13px;
  line-height: 1.65;
  color: var(--system-muted);
  text-wrap: balance;
}
#system-one-page .system-product-context span {
  display: block;
}
#system-one-page .system-explore {
  min-height: 44px;
  font-size: 12px;
  color: var(--system-ink);
  border-color: #636157;
}
#system-one-page .system-explore:hover { border-color: var(--system-ink); }

/* The full-width model canvas and its existing pose dimensions are untouched. */
#system-one-page .synth-object-note { color: var(--system-subtle); }
#system-one-page .synth-toolbar,
#system-one-page .synth-controls,
#system-one-page .synth-advanced { border-color: var(--system-line); }
#system-one-page .synth-toolbar button {
  min-width: 44px;
  min-height: 44px;
  font-size: 12px;
  color: var(--system-muted);
}
#system-one-page .synth-toolbar button:hover {
  color: var(--system-ink);
  border-color: #68665d;
  background: #181916;
}
#system-one-page .synth-toolbar [aria-pressed=true],
#system-one-page .synth-toolbar [aria-pressed=true]:hover {
  background: #dfddd4;
  border-color: #dfddd4;
  color: #11120f;
}
#system-one-page .synth-toolbar .synth-play {
  border-color: #68665d;
  background: #101110;
  color: var(--system-ink);
}
#system-one-page .synth-toolbar .synth-play::before { color: #c1beb2; }
#system-one-page .synth-toolbar .synth-play[aria-pressed=true]::before { color: #55554b; }
#system-one-page .synth-under {
  min-height: 60px;
  gap: 20px;
  color: var(--system-muted);
}
#system-one-page .synth-under p { font-size: 12px; line-height: 1.6; }
#system-one-page .synth-under > span { font-size: 10px; line-height: 1.6; }
#system-one-page .synth-controls summary {
  min-height: 56px;
  font-size: 13px;
  color: var(--system-ink);
}
#system-one-page .synth-controls summary span { color: var(--system-muted); }
#system-one-page .synth-controls > p,
#system-one-page .synth-sound-note {
  font-size: 13px;
  line-height: 1.7;
  color: var(--system-muted);
}
#system-one-page .synth-ranges label { font-size: 12px; color: var(--system-ink); }
#system-one-page .synth-ranges output { font-size: 11px; color: var(--system-muted); }
#system-one-page .synth-ranges input { height: 44px; accent-color: #d3d0c5; }
#system-one-page .synth-controls > button {
  min-height: 44px;
  font-size: 12px;
  color: var(--system-ink);
  border-color: #68665d;
  background: #101110;
}
#system-one-page .synth-controls > button[aria-pressed=true] {
  color: #11120f;
  border-color: #dfddd4;
  background: #dfddd4;
}
#system-one-page .system-model-name { color: var(--system-ink); font-weight: 360; }
#system-one-page .system-model-name span { color: var(--system-muted); border-color: #68665d; }
#system-one-page .system-down { color: var(--system-muted); }

/* A repeated editorial rhythm, with the original section sequence intact. */
#system-one-page .system-story { padding-block: clamp(72px, 7.5vw, 108px); }
#system-one-page .system-short { padding-block: clamp(72px, 8vw, 116px); }
#system-one-page .system-story h2,
#system-one-page .system-offer h2 {
  font-size: clamp(34px, 4.2vw, 64px);
  font-weight: 380;
  line-height: 1.08;
  letter-spacing: -.045em;
  color: var(--system-ink);
  text-wrap: balance;
  margin-bottom: 32px;
}
#system-one-page .system-intro {
  max-width: 35ch;
  font-size: clamp(18px, 1.65vw, 24px);
  font-weight: 400;
  line-height: 1.48;
  letter-spacing: -.022em;
  color: var(--system-muted);
}
#system-one-page .system-development {
  max-width: 100%;
  font-size: 11px;
  line-height: 1.75;
  letter-spacing: .08em;
  color: var(--system-subtle);
}
#system-one-page .system-feature-list {
  max-width: 740px;
  margin-block: 52px 56px;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.95;
  letter-spacing: .035em;
  color: var(--system-muted);
}
#system-one-page .system-pill {
  min-height: 48px;
  padding: 14px 26px;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: -.015em;
  background: #e1ded4;
  border-color: #e1ded4;
  color: #11120f;
}
#system-one-page .system-pill:hover { background: #f0ede5; border-color: #f0ede5; }
#system-one-page .system-pill:disabled,
#system-one-page .system-pill:disabled:hover {
  cursor: default;
  color: #bbb8ad;
  background: #151612;
  border-color: #55564e;
  opacity: 1;
}
#system-one-page .system-availability {
  padding-inline: 0;
  font-size: 12px;
  line-height: 1.8;
  color: var(--system-muted);
}
#system-one-page .system-detail figcaption,
#system-one-page .system-detail[data-image-state=native] > figcaption {
  font-size: 11px;
  line-height: 1.7;
  letter-spacing: .045em;
  color: var(--system-muted);
  text-shadow: none;
}
#system-one-page .system-detail[data-image-state=native] > figcaption {
  padding: 20px var(--finish-gutter, 40px);
}

#system-one-page .system-section-label {
  font-size: 11px;
  line-height: 1.6;
  letter-spacing: .055em;
  color: var(--system-muted);
  border-color: var(--system-line);
  padding-bottom: 20px;
  margin-bottom: 24px;
}
#system-one-page .system-native .instrument-stage {
  border-color: var(--system-line);
  background: var(--finish-surface, #101110);
}
#system-one-page .system-native .stage-nav { gap: 16px; padding: 12px 20px; border-color: var(--system-line); }
#system-one-page .system-native .stage-nav [role=tablist] { flex: 1; min-width: 0; gap: 24px; }
#system-one-page .system-native .stage-nav [role=tab] {
  min-width: 44px;
  min-height: 44px;
  font-size: 12px;
  font-weight: 400;
  color: var(--system-muted);
}
#system-one-page .system-native .stage-nav [aria-selected=true] { color: var(--system-ink); border-color: #d4d0c3; }
#system-one-page .stage-nav .expand { min-width: 44px; min-height: 44px; color: var(--system-ink); }
#system-one-page .system-native .stage-caption {
  gap: 24px;
  padding: 20px;
  background: var(--finish-surface, #101110);
  color: var(--system-muted);
}
#system-one-page .system-native .stage-caption p { font-size: 13px; line-height: 1.65; }
/* Short evidence captions should not leave an isolated final word. */
#system-one-page .system-native .stage-caption p { text-wrap: balance; margin: 0; }
#system-one-page .system-native .stage-caption > .micro {
  display: block;
  flex-shrink: 0;
  font-size: 10px;
  font-weight: 400;
  letter-spacing: .065em;
  color: var(--system-subtle);
}
#system-one-page .system-native-caption { max-width: 55ch; font-size: 13px; line-height: 1.7; color: var(--system-muted); margin-top: 24px; }

#system-one-page .system-offer { padding-block: clamp(80px, 8.5vw, 124px); }
#system-one-page .system-offer > .system-development { margin-bottom: 28px; }
#system-one-page .system-price {
  margin: 40px 0 28px;
  font-size: clamp(60px, 5.2vw, 76px);
  font-weight: 380;
  letter-spacing: -.055em;
  line-height: 1.1;
  color: var(--system-ink);
  font-variant-numeric: tabular-nums;
}
#system-one-page .system-price span { margin-top: 12px; font-size: 12px; line-height: 1.7; letter-spacing: .025em; color: var(--system-muted); }
#system-one-page .system-offer > .text-link { min-height: 44px; align-items: center; font-size: 13px; color: var(--system-ink); gap: 20px; }
#system-one-page .system-family { border-color: var(--system-line); padding-bottom: 96px; }
#system-one-page .system-family-grid > a > div { background: #101110; border-color: var(--system-line); }
#system-one-page .system-family-grid a > span { font-size: 11px; color: var(--system-subtle); }
#system-one-page .system-family-grid h3 { font-size: 16px; font-weight: 400; color: var(--system-ink); }
#system-one-page .system-family-grid a:hover h3 { color: #fffdf6; }
#system-one-page .system-dark { border-color: var(--system-line); }
#system-one-page .system-dark > div span { font-size: 11px; color: var(--system-muted); }
#system-one-page .system-dark h2 { font-weight: 380; color: var(--system-ink); }
#system-one-page .system-dark p { font-weight: 400; color: var(--system-muted); }

/* The listening controls keep their native behavior and a readable status rail. */
#system-one-page .sound-grid { padding-block: 88px 72px; gap: 8%; border-color: var(--system-line); }
#system-one-page .sound-grid h3 { font-size: clamp(32px, 3vw, 44px); font-weight: 380; line-height: 1.12; letter-spacing: -.04em; margin: 18px 0 20px; }
#system-one-page .sound-grid > div > p { font-size: 14px; line-height: 1.7; color: var(--system-muted); }
#system-one-page .sound-grid .micro { font-size: 11px; font-weight: 400; line-height: 1.65; letter-spacing: .075em; color: var(--system-subtle); }
#system-one-page .player { border: 1px solid var(--system-line); padding: 24px; background: var(--finish-surface, #101110); border-radius: 2px; }
#system-one-page .player-meta { flex-wrap: wrap; gap: 6px 20px; color: var(--system-muted); }
#system-one-page #audio-toggle { color: var(--system-ink); border-color: #7b786e; background: #1c1e19; }
#system-one-page #audio-toggle:hover { background: #2b2e25; border-color: #c6c1b3; }
#system-one-page .player-time,
#system-one-page .player-bottom { font-size: 11px; line-height: 1.6; color: var(--system-muted); }
#system-one-page .player-time { font-variant-numeric: tabular-nums; }
#system-one-page .player-bottom { flex-wrap: wrap; gap: 12px; padding-top: 16px; margin-top: 20px; border-color: var(--system-line); }
#system-one-page .volume { margin-left: auto; }
#system-one-page .volume input { width: 72px; min-height: 44px; accent-color: #d3d0c5; }

#system-one-page .system-specs,
#system-one-page .system-faq { grid-template-columns: minmax(180px, .8fr) minmax(0, 2fr); gap: clamp(40px, 6vw, 88px); }
#system-one-page .system-specs { margin-block: 96px; }
#system-one-page .system-specs h2,
#system-one-page .system-faq h2 { font-size: 32px; font-weight: 380; line-height: 1.15; letter-spacing: -.035em; color: var(--system-ink); }
#system-one-page .system-specs dl { font-size: 14px; line-height: 1.7; color: var(--system-ink); }
#system-one-page .system-specs dl > div { padding-block: 20px; border-color: var(--system-line); }
#system-one-page .system-specs dt { font-size: 12px; color: var(--system-subtle); }
#system-one-page .system-faq { border-color: var(--system-line); padding-top: 52px; margin-bottom: 80px; }
#system-one-page .system-faq .system-development { font-size: 10px; line-height: 1.7; }
#system-one-page .system-faq > div > p { font-size: 14px; line-height: 1.7; color: var(--system-muted); }
#system-one-page .system-faq summary { min-height: 68px; padding-block: 20px; font-size: 14px; line-height: 1.5; color: var(--system-ink); }
#system-one-page .system-faq details { border-color: var(--system-line); }
#system-one-page .system-faq summary span { width: 20px; flex-shrink: 0; font-size: 20px; line-height: 1; font-weight: 300; color: var(--system-muted); }
#system-one-page .system-faq details p { max-width: 62ch; font-size: 14px; line-height: 1.75; color: var(--system-muted); margin: 0 32px 28px 0; }
#system-one-page .system-intro,
#system-one-page .system-specs dd,
#system-one-page .system-faq details p,
#system-one-page .system-dialog p { text-wrap: pretty; }
#system-one-page .system-parody { font-size: 11px; line-height: 1.8; padding-block: 24px 40px; border-color: var(--system-line); color: var(--system-subtle); }

#system-one-page .system-dialog { padding: 32px; color: var(--system-ink); background: var(--finish-surface, #101110); border-color: #55544c; }
#system-one-page .system-dialog::backdrop { background: #000c; backdrop-filter: none; }
#system-one-page .system-dialog h2 { font-size: clamp(28px, 3vw, 38px); font-weight: 380; line-height: 1.12; letter-spacing: -.04em; }
#system-one-page .system-dialog p { font-size: 14px; line-height: 1.75; color: var(--system-muted); }
#system-one-page .system-dialog [data-system-close] { min-height: 44px; min-width: 44px; font-size: 12px; color: var(--system-muted); }
#system-one-page #system-preview-dialog h2 { margin-bottom: 20px; max-width: 78%; font-size: clamp(22px, 2.1vw, 30px); }
#system-one-page :is(a, button, input, select, summary):focus-visible { outline: 2px solid #d9d3c5; outline-offset: 4px; }
#system-one-page #synth-canvas:focus-visible { outline: 2px solid #d9d3c5; outline-offset: -6px; }

@media (max-width: 760px) {
  #system-one-page { --system-width: calc(100% - 2 * var(--finish-gutter, 20px)); }
  #system-one-page .system-subnav { padding-inline: var(--finish-gutter, 20px); }
  #system-one-page .breadcrumb { font-size: 10px; gap: 7px; }
  #system-one-page .system-subnav .breadcrumb > a:nth-of-type(2),
  #system-one-page .system-subnav .breadcrumb > span:nth-of-type(2) { display: none; }
  #system-one-page .system-jumps { gap: 18px; }
  #system-one-page .system-jumps button { font-size: 11px; }
  #system-one-page .system-eyebrow { font-size: 11px; }
  #system-one-page .system-product-context { font-size: 12px; margin-bottom: 16px; }
  #system-one-page .synth-toolbar button { padding-inline: 12px; font-size: 11px; }
  #system-one-page .synth-under { align-items: flex-start; padding-block: 16px; gap: 16px; }
  #system-one-page .synth-under p { font-size: 11px; max-width: none; }
  #system-one-page .synth-under > span { font-size: 9px; white-space: normal; max-width: 90px; }
  #system-one-page .system-story,
  #system-one-page .system-short { padding-block: 72px; }
  #system-one-page .system-story h2,
  #system-one-page .system-offer h2 { font-size: 34px; margin-bottom: 26px; }
  #system-one-page .system-intro { font-size: 18px; line-height: 1.48; }
  #system-one-page .system-development { font-size: 10px; }
  #system-one-page .system-feature-list { font-size: 11px; line-height: 1.95; letter-spacing: .015em; margin-block: 40px; }
  #system-one-page .system-detail figcaption,
  #system-one-page .system-detail[data-image-state=native] > figcaption { font-size: 10px; padding-inline: var(--finish-gutter, 20px); }
  #system-one-page .system-section-label { font-size: 10px; gap: 16px; padding-bottom: 16px; }
  #system-one-page .system-section-label > span:last-child { max-width: 52%; text-align: right; }
  #system-one-page .system-native .stage-nav { padding: 8px 12px; gap: 8px; }
  #system-one-page .system-native .stage-nav [role=tablist] { gap: 6px; justify-content: space-between; }
  #system-one-page .system-native .stage-nav [role=tab] { font-size: 11px; }
  #system-one-page .system-native .stage-caption { flex-direction: column; align-items: flex-start; gap: 10px; padding: 16px; }
  #system-one-page .system-native .stage-caption p { font-size: 12px; }
  #system-one-page .system-native-caption { max-width: 36ch; font-size: 12px; }
  #system-one-page .system-offer { padding: 80px var(--finish-gutter, 20px); }
  #system-one-page .system-price { margin-block: 32px 26px; }
  #system-one-page .system-family { padding-bottom: 64px; }
  #system-one-page .system-family-grid h3 { font-size: 14px; }
  #system-one-page .system-family-grid a > span { font-size: 10px; margin-top: 18px; }
  #system-one-page .system-dark > div span { font-size: 10px; }
  #system-one-page .sound-grid { padding-block: 68px 56px; gap: 28px; }
  #system-one-page .sound-grid h3 { font-size: 34px; }
  #system-one-page .player { padding: 18px; }
  #system-one-page .player-meta { font-size: 10px; }
  #system-one-page .system-specs { margin-block: 64px; }
  #system-one-page .system-specs h2,
  #system-one-page .system-faq h2 { font-size: 29px; }
  #system-one-page .system-specs dl { font-size: 13px; }
  #system-one-page .system-specs dl > div { grid-template-columns: 96px minmax(0, 1fr); gap: 20px; padding-block: 18px; }
  #system-one-page .system-specs dt { font-size: 11px; }
  #system-one-page .system-faq { padding-top: 36px; margin-bottom: 56px; }
  #system-one-page .system-faq summary { font-size: 13px; min-height: 64px; }
  #system-one-page .system-faq details p { font-size: 13px; margin-right: 24px; }
  #system-one-page .system-dialog { padding: 24px; }
}

@media (max-width: 360px) {
  #system-one-page .system-jumps { gap: 12px; }
  #system-one-page .synth-toolbar button { padding-inline: 8px; }
  #system-one-page .system-native .stage-nav { padding-inline: 8px; }
  #system-one-page .system-native .stage-nav [role=tablist] { gap: 4px; }
  #system-one-page .system-native .stage-nav [role=tab] { font-size: 10px; }
  #system-one-page .system-story h2,
  #system-one-page .system-offer h2 { font-size: 32px; }
  #system-one-page .system-feature-list { font-size: 10.5px; letter-spacing: 0; }
  #system-one-page .system-specs dl > div { grid-template-columns: 80px minmax(0, 1fr); gap: 16px; }
  #system-one-page .system-dialog { padding: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  #system-one-page *, #system-one-page *::before, #system-one-page *::after { transition: none !important; scroll-behavior: auto !important; }
}