/* Solar Om / HelioSynth Track 001. Scoped to this exhibit. */
.nd-solar-om {
  --so-gold: #ffc53d;
  --so-orange: #ff922e;
  --so-ember: #ff6040;
  --so-ivory: #fff0d7;
  --so-text: #d3bda0;
  --so-muted: #ac987d;
  --so-line: rgba(255, 197, 61, .23);
  --so-mono: var(--wp--preset--font-family--studio-mono, ui-monospace, "SFMono-Regular", Consolas, monospace);
  box-sizing: border-box;
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
  overflow: clip;
  background: #000;
  color: var(--so-text);
  color-scheme: dark;
  font-family: var(--wp--preset--font-family--studio-sans, "Helvetica Neue", Arial, sans-serif);
}
.nd-solar-om *, .nd-solar-om *::before, .nd-solar-om *::after { box-sizing: border-box; }
.nd-solar-om [hidden] { display: none !important; }
.nd-solar-om button, .nd-solar-om input { font: inherit; }
.nd-solar-om button { cursor: pointer; }
.nd-solar-om button:disabled { cursor: default; }
.nd-solar-om .so-shell { width: min(calc(100% - 7vw), 1360px); margin: 0 auto; padding: 2.2rem 0 3rem; }
.nd-solar-om a { color: inherit; }
.nd-solar-om .so-topline { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; padding: 1rem 0 1.25rem; border-bottom: 1px solid var(--so-line); color: var(--so-muted); font-family: var(--so-mono); font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; }
.nd-solar-om .so-topline a { color: #e6c690; text-decoration: none; }
.nd-solar-om .so-topline a span { margin-right: .7rem; }
.nd-solar-om .so-topline b { padding: 0 .7rem; color: #7c581f; font-weight: normal; }
.nd-solar-om .so-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); align-items: center; gap: 1rem 4vw; padding: clamp(2.2rem, 5vw, 5.5rem) 0; }
.nd-solar-om .so-eyebrow { margin: 0 0 1.8rem; color: var(--so-orange); font-family: var(--so-mono); font-size: .64rem; letter-spacing: .2em; text-transform: uppercase; }
.nd-solar-om .so-intro h1 { margin: 0 0 2rem; color: var(--so-ivory); font-size: clamp(4.8rem, 8.7vw, 9.4rem); font-weight: 450; letter-spacing: -.075em; line-height: .86; }
.nd-solar-om .so-intro h1 em { display: block; color: var(--so-gold); font-style: normal; }
.nd-solar-om .so-lede { max-width: 29rem; margin: 0; color: #dfc7a9; font-size: clamp(1.06rem, 1.5vw, 1.3rem); line-height: 1.7; }
.nd-solar-om .so-signature { display: flex; flex-wrap: wrap; gap: 1.4rem 2rem; margin-top: 2.5rem; }
.nd-solar-om .so-signature span { display: grid; gap: .45rem; color: #b59b77; font-family: var(--so-mono); font-size: .54rem; letter-spacing: .04em; }
.nd-solar-om .so-signature b { color: #f0ca83; font-size: 1.08rem; font-weight: 450; }
.nd-solar-om .so-solar-scene { min-width: 0; text-align: center; }
.nd-solar-om .so-sun { position: relative; width: 100%; max-width: 40rem; aspect-ratio: 1; margin: 0 auto; isolation: isolate; }
.nd-solar-om .so-sun::before { position: absolute; inset: 17%; border: 1px solid rgba(255, 174, 48, .25); border-radius: 50%; box-shadow: 0 0 4rem rgba(255, 126, 25, .08), inset 0 0 4rem rgba(255, 126, 25, .035); content: ""; }
.nd-solar-om .so-sun[data-ready="true"]::before { display: none; }
.nd-solar-om .so-sun canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; pointer-events: none; }
.nd-solar-om .so-frequency { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; color: #ffcf66; pointer-events: none; }
.nd-solar-om .so-frequency > span { font-size: clamp(2.2rem, 4.5vw, 4.6rem); font-weight: 400; letter-spacing: -.055em; line-height: 1; text-shadow: 0 0 2rem #000; }
.nd-solar-om .so-frequency small { margin-top: .8rem; color: #cb9556; font-family: var(--so-mono); font-size: .5rem; letter-spacing: .16em; }
.nd-solar-om .so-motion { min-height: 2.75rem; padding: .6rem 1rem; border: 1px solid rgba(255, 160, 57, .3); border-radius: 999px; background: #070604; color: #cda76f; font-family: var(--so-mono); font-size: .59rem; letter-spacing: .035em; }
.nd-solar-om .so-motion:hover { border-color: #d7a348; color: var(--so-ivory); }
.nd-solar-om .so-console { padding: clamp(1.3rem, 2.8vw, 2.5rem); border: 1px solid rgba(255, 197, 61, .33); background: linear-gradient(110deg, #0b0905, #040403); }
.nd-solar-om .so-console-heading { display: flex; align-items: baseline; flex-wrap: wrap; justify-content: space-between; gap: .65rem 2rem; margin-bottom: 1.8rem; }
.nd-solar-om .so-console-heading h2 { margin: 0; color: var(--so-ivory); font-size: clamp(1.75rem, 2.8vw, 2.5rem); font-weight: 440; letter-spacing: -.045em; line-height: 1.1; }
.nd-solar-om .so-console-heading p { margin: 0; color: #c39d63; font-family: var(--so-mono); font-size: .6rem; letter-spacing: .035em; line-height: 1.6; }
.nd-solar-om .so-console-heading p[data-error="true"] { color: #ffb39b; }
.nd-solar-om .so-transport { display: grid; grid-template-columns: auto minmax(11rem, .85fr) minmax(12rem, 1fr); align-items: center; gap: 1.5rem 2.5rem; }
.nd-solar-om .so-transport-buttons { display: flex; gap: .65rem; }
.nd-solar-om .so-button { display: inline-flex; align-items: center; justify-content: center; gap: .8rem; min-height: 3.4rem; padding: .8rem 1.35rem; border: 1px solid var(--so-gold); border-radius: 999px; font-size: .77rem; font-weight: 600; line-height: 1.3; letter-spacing: .02em; transition: background-color .18s, color .18s, border-color .18s; }
.nd-solar-om .so-button--play { background: var(--so-gold); color: #181006; }
.nd-solar-om .so-button--play:hover:not(:disabled) { background: #ffda7c; border-color: #ffda7c; }
.nd-solar-om .so-button--stop { background: transparent; border-color: #6b4b24; color: #edc793; }
.nd-solar-om .so-button--stop:hover:not(:disabled) { background: #221409; border-color: var(--so-orange); }
.nd-solar-om .so-button:disabled { opacity: .4; }
.nd-solar-om .so-time { color: #957c58; font-family: var(--so-mono); font-size: .67rem; white-space: nowrap; }
.nd-solar-om .so-time time { color: #ebc78b; font-size: 1.1rem; letter-spacing: .06em; }
.nd-solar-om .so-progress { height: 2px; margin-top: .7rem; overflow: hidden; background: #352714; }
.nd-solar-om .so-progress i { display: block; width: 100%; height: 100%; background: var(--so-orange); transform: scaleX(0); transform-origin: left center; }
.nd-solar-om .so-master label, .nd-solar-om .so-gain-label { display: flex; justify-content: space-between; gap: 1rem; align-items: center; color: #c3a988; font-family: var(--so-mono); font-size: .59rem; letter-spacing: .035em; }
.nd-solar-om .so-master output, .nd-solar-om .so-gain-label output { color: #ffd38a; }
.nd-solar-om .so-slider { display: block; width: 100%; min-width: 0; height: 2.75rem; margin: .1rem 0 0; padding: 0; appearance: none; -webkit-appearance: none; background: transparent; cursor: pointer; accent-color: var(--so-gold); }
.nd-solar-om .so-slider::-webkit-slider-runnable-track { height: 3px; border-radius: 3px; background: linear-gradient(90deg, #e2a43b var(--so-value, 40%), #44311a var(--so-value, 40%)); }
.nd-solar-om .so-slider::-webkit-slider-thumb { width: 17px; height: 17px; margin-top: -7px; border: 2px solid #100c06; border-radius: 50%; appearance: none; -webkit-appearance: none; background: #ffcf72; box-shadow: 0 0 0 1px #b58638; }
.nd-solar-om .so-slider::-moz-range-track { height: 3px; border-radius: 3px; background: #44311a; }
.nd-solar-om .so-slider::-moz-range-progress { height: 3px; background: #e2a43b; }
.nd-solar-om .so-slider::-moz-range-thumb { width: 14px; height: 14px; border: 2px solid #100c06; border-radius: 50%; background: #ffcf72; }
.nd-solar-om .so-listening-hint { max-width: 67rem; margin: 1.2rem 0 0; padding-top: 1.1rem; border-top: 1px solid rgba(255, 197, 61, .13); color: #b09a7c; font-size: .7rem; line-height: 1.65; }
.nd-solar-om .so-layer-section { padding: 3.8rem 0 3rem; }
.nd-solar-om .so-section-heading { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: .7rem 2rem; margin-bottom: 1.6rem; }
.nd-solar-om .so-section-heading h2 { margin: 0; color: #f4dfbe; font-size: clamp(1.5rem, 2.4vw, 2.1rem); font-weight: 450; letter-spacing: -.045em; }
.nd-solar-om .so-section-heading p { margin: 0; color: #b29a7a; font-size: .75rem; line-height: 1.6; }
.nd-solar-om .so-layers { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; border: 1px solid var(--so-line); background: var(--so-line); }
.nd-solar-om .so-layer { min-width: 0; padding: 1.35rem 1.4rem 1rem; background: #060503; }
.nd-solar-om .so-layer-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.nd-solar-om .so-layer-number { color: #dd9340; font-family: var(--so-mono); font-size: .6rem; letter-spacing: .13em; }
.nd-solar-om .so-layer h3 { margin: 0 0 .6rem; color: #f2d6a9; font-size: clamp(1.2rem, 1.7vw, 1.7rem); font-weight: 450; letter-spacing: -.035em; }
.nd-solar-om .so-layer p { min-height: 3.1em; margin: 0 0 1.6rem; color: #ad9473; font-size: .72rem; line-height: 1.55; }
.nd-solar-om .so-layer[data-enabled="false"] h3 { color: #b9a78e; }
.nd-solar-om .so-layer[data-enabled="false"] .so-layer-number { color: #96816a; }
.nd-solar-om .so-switch { position: relative; display: inline-flex; width: 44px; height: 32px; align-items: center; cursor: pointer; }
.nd-solar-om .so-switch input { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.nd-solar-om .so-switch span { position: relative; display: block; width: 42px; height: 24px; border: 1px solid #756047; border-radius: 20px; background: #15100a; transition: background-color .2s, border-color .2s; }
.nd-solar-om .so-switch span::after { position: absolute; top: 4px; left: 4px; width: 14px; height: 14px; border-radius: 50%; background: #b9a280; content: ""; transition: transform .2s, background-color .2s; }
.nd-solar-om .so-switch input:checked + span { border-color: #e4a747; background: #713c0c; }
.nd-solar-om .so-switch input:checked + span::after { transform: translateX(18px); background: #ffe0a4; }
.nd-solar-om .so-colophon { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .85fr) auto; align-items: start; gap: 1.2rem 3rem; padding-top: 1.7rem; border-top: 1px solid var(--so-line); }
.nd-solar-om .so-colophon p { margin: 0; color: #aa9372; font-size: .65rem; line-height: 1.8; }
.nd-solar-om .so-colophon a { align-self: center; color: #e5b469; font-family: var(--so-mono); font-size: .6rem; line-height: 1.6; text-decoration: none; white-space: nowrap; }
.nd-solar-om .so-noscript { padding: 1rem; border: 1px solid #b57330; color: #ffe0ad; }
.nd-solar-om a:hover { color: #ffe2ac; }
.nd-solar-om a:focus-visible, .nd-solar-om button:focus-visible, .nd-solar-om .so-slider:focus-visible, .nd-solar-om .so-switch input:focus-visible + span { outline: 2px solid #ffdb87; outline-offset: 5px; }
.nd-solar-om ::selection { background: #ffd087; color: #15100a; }
@media (max-width: 1080px) {
  .nd-solar-om .so-transport { grid-template-columns: minmax(0, 1fr) minmax(0, .75fr); }
  .nd-solar-om .so-master { grid-column: 1 / -1; }
  .nd-solar-om .so-layers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nd-solar-om .so-layer p { min-height: 0; }
  .nd-solar-om .so-colophon { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .nd-solar-om .so-colophon a { grid-column: 1 / -1; }
}
@media (max-width: 680px) {
  .nd-solar-om .so-shell { width: calc(100% - 2rem); padding-top: 1rem; }
  .nd-solar-om .so-topline { font-size: .54rem; }
  .nd-solar-om .so-hero { grid-template-columns: minmax(0, 1fr); gap: 1rem; padding-top: 2.7rem; }
  .nd-solar-om .so-eyebrow { margin-bottom: 1.2rem; font-size: .56rem; }
  .nd-solar-om .so-intro h1 { font-size: clamp(3.6rem, 14vw, 5.7rem); margin-bottom: 1.5rem; }
  .nd-solar-om .so-intro h1 em { display: inline; }
  .nd-solar-om .so-signature { gap: 1.5rem; margin-top: 1.8rem; }
  .nd-solar-om .so-solar-scene { width: min(100%, 27rem); margin: 0 auto; }
  .nd-solar-om .so-frequency > span { font-size: 3rem; }
  .nd-solar-om .so-console { padding: 1.15rem; }
  .nd-solar-om .so-transport { grid-template-columns: minmax(0, 1fr); gap: 1.35rem; }
  .nd-solar-om .so-transport-buttons { width: 100%; }
  .nd-solar-om .so-button--play { flex: 1; }
  .nd-solar-om .so-button { padding-inline: 1rem; font-size: .72rem; }
  .nd-solar-om .so-time { width: 100%; }
  .nd-solar-om .so-progress { margin-top: .5rem; }
  .nd-solar-om .so-layer-section { padding-top: 2.7rem; }
  .nd-solar-om .so-layer { padding: 1.15rem 1rem .75rem; }
  .nd-solar-om .so-layer h3 { font-size: 1.3rem; }
  .nd-solar-om .so-layer p { min-height: 3.1em; margin-bottom: 1.15rem; }
  .nd-solar-om .so-colophon { grid-template-columns: minmax(0, 1fr); gap: .8rem; }
}
@media (max-width: 360px) {
  .nd-solar-om .so-layers { grid-template-columns: minmax(0, 1fr); }
  .nd-solar-om .so-layer p { min-height: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .nd-solar-om *, .nd-solar-om *::before, .nd-solar-om *::after { transition: none !important; scroll-behavior: auto !important; }
}


/* Session duration choices, including continuous playback. */
.nd-solar-om .so-session-options { margin: 0 0 1.8rem; padding: 0; border: 0; min-width: 0; }
.nd-solar-om .so-session-options legend { margin: 0 0 .7rem; padding: 0; color: #c8a36c; font: .65rem/1.5 var(--so-mono); letter-spacing: .08em; text-transform: uppercase; }
.nd-solar-om .so-session-buttons { display: flex; flex-wrap: wrap; gap: .55rem; }
.nd-solar-om .so-session-buttons button { min-height: 2.75rem; padding: .6rem 1.05rem; border: 1px solid #685029; border-radius: 999px; color: #d7bd95; background: #100c07; font: 500 .75rem/1.35 var(--wp--preset--font-family--studio-sans, Arial, sans-serif); cursor: pointer; }
.nd-solar-om .so-session-buttons button:hover { border-color: #d3a050; background: #24190c; }
.nd-solar-om .so-session-buttons button[aria-pressed="true"] { color: #1a1105; background: #e6b762; border-color: #e6b762; }
.nd-solar-om .so-session-buttons button:focus-visible { outline: 3px solid #ffe3a7; outline-offset: 4px; }
.nd-solar-om .so-session-buttons button span { font-size: 1.15em; margin-right: .25rem; }
.nd-solar-om .so-timer-note { margin: .8rem 0 0; color: #b9a383; font: .65rem/1.65 var(--so-mono); }
.nd-solar-om .so-time { min-width: 0; }
.nd-solar-om .so-time time { font-variant-numeric: tabular-nums; letter-spacing: .025em; }
@media (max-width: 680px) {
  .nd-solar-om .so-session-buttons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .nd-solar-om .so-session-buttons button { padding-inline: .6rem; }
  .nd-solar-om .so-session-buttons button:last-child { grid-column: span 2; }
}
