/* Research drawn in the same quiet light as the mansion. */
.case-icon {width:30px;height:30px;flex:none;color:#d5eeee;filter:drop-shadow(0 0 7px #c8eeee35)}
.research-landscape,.research-study-intro,.research-study,.research-footnote,.case-keyboard-figure,.case-signal-flow {grid-column:1/-1;min-width:0}
.research-landscape {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin:8px 0 16px}
.research-landscape article {padding:24px 0;border-top:1px solid #c8eeee33}
.research-landscape .case-icon {display:block;margin-bottom:22px}
.research-landscape h3,.research-study-intro h3 {font-size:23px;line-height:1.35;font-weight:400;letter-spacing:-.025em;margin:12px 0}
.research-landscape p,.research-study-intro p,.study-stage p {font-size:13px;line-height:1.85;color:#acc1c1;margin:0}
.research-study-intro {max-width:650px;margin-top:16px}
.research-study {position:relative;display:grid;grid-template-columns:1fr 1fr;gap:42px}
.study-stage {position:relative;min-width:0;padding:30px;border:1px solid #c8eeee33;border-radius:5px;background:radial-gradient(ellipse at 0 0,#a0dada0b,transparent 70%)}
.study-stage header {position:relative;padding-right:36px;min-height:100px}
.study-stage header>.case-icon {position:absolute;right:0;top:3px;width:25px;height:25px}
.study-number {display:block;margin-bottom:12px;color:#dff5f5;font:300 40px/1 Inter,sans-serif;letter-spacing:-.04em;text-shadow:0 0 15px #c8eeee33}
.study-stage h3 {font:400 20px/1.4 Inter,sans-serif;margin:10px 0 0;letter-spacing:-.02em}
.study-people {display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:3px;margin:32px 0 14px;color:#c8eeee}
.study-people svg {width:100%;max-height:40px;filter:drop-shadow(0 0 3px #c8eeee35)}
.study-metrics {display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin:0 0 25px;font:400 10px/1.6 'IBM Plex Mono',monospace;color:#92b3b3}
.study-metrics strong {font-weight:400;color:#dfefef}
.study-question {border-top:1px solid #c8eeee26;margin-top:24px;padding-top:20px}
.study-question p {margin-top:8px;color:#d4e5e5}
.study-stage .study-output {border-top:1px solid #c8eeee26;margin-top:24px;padding-top:20px;font-size:11px;color:#a5cfc9}
.research-footnote {max-width:720px;font:400 11px/1.8 Inter,sans-serif;color:#7f9999;margin:-12px 0 4px}
.case-keyboard-figure {margin:0;padding:24px 20px 18px;border:1px solid #c8eeee26;border-radius:5px;background:radial-gradient(ellipse at 50% 50%,#b7dede09,transparent 70%)}
.case-keyboard-graphic svg {display:block;width:100%;height:auto}
.case-keyboard-figure figcaption {padding:0 12px}
.mechanics-list .case-icon {display:block;margin:0 0 18px}
.case-signal-flow {display:grid;grid-template-columns:1fr 45px 1fr 45px 1fr;align-items:center;gap:12px;margin:8px 0 24px;padding:32px 0;border-top:1px solid #c8eeee26;border-bottom:1px solid #c8eeee26}
.case-signal-flow>div {display:flex;align-items:center;flex-direction:column;gap:13px;text-align:center}
.case-signal-flow span {font:400 13px/1.5 Inter,sans-serif;color:#d6eaea}
.case-signal-flow small {font:400 10px/1.5 Inter,sans-serif;color:#89a5a5}
.signal-connector {height:1px;background:linear-gradient(90deg,#c8eeee22,#c8eeee99,#c8eeee22);box-shadow:0 0 8px #c8eeee22}
@media(max-width:650px) {
 .research-landscape {grid-template-columns:1fr;gap:0;margin:0}
 .research-landscape article {display:grid;grid-template-columns:35px 1fr;gap:0 18px;padding:24px 0}
 .research-landscape .case-icon {grid-row:1/4;margin-top:6px}
 .research-landscape h3,.research-landscape p {grid-column:2}
 .research-study {grid-template-columns:1fr;gap:24px}
 .study-stage {padding:24px}
 .study-people {gap:2px}
 .case-keyboard-figure {padding:20px 0 16px}
 .case-keyboard-figure figcaption {padding:0 16px}
 .mechanics-list>div {display:block}
 .mechanics-list h3 {margin:10px 0}
 .case-signal-flow {grid-template-columns:1fr 14px 1fr 14px 1fr;gap:5px}
 .case-signal-flow span {font-size:11px}
 .case-signal-flow small {font-size:9px}
 .case-signal-flow .case-icon {width:25px;height:25px}
}
/* Four-part case study: evidence, making, and the delivered experience. */
.case-impact {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;margin:35px 0 0;padding:26px 0;border-block:1px solid #c8eeee26}
.case-impact>div {display:flex;flex-direction:column;gap:12px}
.case-impact strong {font:300 37px/1 Inter,sans-serif;color:#e2f3f3;letter-spacing:-.04em}
.case-impact span {font:400 11px/1.65 Inter,sans-serif;color:#95afaf;max-width:150px}
.case-reframe,.research-quote-grid,.learn-make-cycle,.case-synthesis,.case-subsection,.case-authorship,.case-feature-strip,.case-before-after,.finished-cues,.sound-lab,.case-asset-note,.case-player-quotes,.case-next {grid-column:1/-1;min-width:0}
.case-reframe {display:grid;grid-template-columns:1fr 40px 1fr;gap:24px;align-items:center;padding:32px 0;border-block:1px solid #c8eeee33}
.case-reframe p {font:300 clamp(21px,2.6vw,29px)/1.45 Inter,sans-serif;letter-spacing:-.025em;color:#deeeee;margin:14px 0 0}
.case-reframe>span {text-align:center;color:#8ab6b6}
.research-quote-grid {display:grid;grid-template-columns:1fr 1fr;gap:42px}
.research-quote-grid figure {margin:0;padding:20px 0;border-top:1px solid #c8eeee26}
.research-quote-grid blockquote {font:300 22px/1.6 Inter,sans-serif;color:#d5eaea;margin:0}
.learn-make-cycle {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid #c8eeee33;border-radius:5px;overflow:hidden}
.learn-make-cycle>div {position:relative;padding:24px 18px;display:flex;flex-direction:column;gap:14px;border-right:1px solid #c8eeee26;background:linear-gradient(135deg,#c8eeee08,transparent)}
.learn-make-cycle>div:last-child {border-right:0}
.learn-make-cycle span {font:400 9px/1.5 'IBM Plex Mono',monospace;text-transform:uppercase;color:#8caeae}
.learn-make-cycle strong {font:400 16px/1.4 Inter,sans-serif;color:#deeeee}
.learn-make-cycle small {font:400 11px/1.7 Inter,sans-serif;color:#9cb8b8}
.case-synthesis {margin:16px 0 8px}
.case-synthesis header {max-width:690px;margin-bottom:28px}
.case-synthesis h3,.case-before-after h3,.finished-cues h3,.sound-lab h3,.case-next h3,.case-authorship h3 {font:400 24px/1.4 Inter,sans-serif;letter-spacing:-.025em;color:#deeeee;margin:10px 0 16px}
.case-synthesis header p,.case-before-after header p,.finished-cues header p,.sound-lab header p,.case-authorship p,.case-next p {font:400 13px/1.9 Inter,sans-serif;color:#adc2c2;margin:0}
.synthesis-head,.synthesis-row {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;border-bottom:1px solid #c8eeee26;padding:23px 0}
.synthesis-head {padding-bottom:12px;color:#8fa8a8;font:400 9px/1.5 'IBM Plex Mono',monospace;text-transform:uppercase}
.synthesis-row {font:400 13px/1.8 Inter,sans-serif;color:#bdcfcf}
.synthesis-row span:nth-child(2) {color:#e1eeee}
.case-subsection {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:36px clamp(35px,6vw,90px);margin:32px 0 0;scroll-margin-top:80px}
.case-authorship,.case-next {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.case-authorship>div,.case-next article {padding-top:24px;border-top:1px solid #c8eeee33}
.case-authorship h3,.case-next h3 {font-size:21px}
.deliverable-links {display:flex;flex-wrap:wrap;gap:20px;align-items:center;margin-top:28px}
.deliverable-links button,.sound-lab-toggle {background:#c8eeee08;border:1px solid #c8eeee66;border-radius:3px;color:#e0f5f5;padding:15px 20px;font:400 13px/1.5 Inter,sans-serif;cursor:pointer;box-shadow:0 0 15px #c8eeee12}
.deliverable-links button {display:flex;flex-direction:column;gap:5px}
.deliverable-links small {font-size:9px;color:#9bbaba}
.deliverable-links a {font:400 11px/1.6 Inter,sans-serif;border-bottom:1px solid #c8eeee55;color:#c6dddd}
.deliverable-links button:hover,.sound-lab-toggle:hover {border-color:#efffff;box-shadow:0 0 22px #c8eeee33}
.case-feature-strip {display:grid;grid-template-columns:30px 1fr 30px 1fr 30px 1fr;gap:15px;align-items:center;padding:25px 0;border-block:1px solid #c8eeee26}
.case-feature-strip p {font:400 12px/1.8 Inter,sans-serif;color:#9bb5b5;margin:0}
.case-feature-strip strong {display:block;font-weight:400;color:#dceeee}
.case-before-after,.finished-cues {padding:30px 0;border-top:1px solid #c8eeee33}
.case-before-after header {max-width:680px;margin-bottom:25px}
.case-before-after code {color:#d8eaea;font-size:.9em}
.comparison-players,.finished-cues {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;padding-bottom:0}
.finished-cues>header {display:block;grid-column:1/-1;margin-bottom:4px;max-width:680px}
.finished-cues .case-audio-player:last-child {grid-column:1/-1}
.case-audio-player {margin:0;min-width:0;border:1px solid #c8eeee2b;border-radius:5px;padding:20px;background:radial-gradient(ellipse at 0 0,#c8eeee08,transparent 80%)}
.case-audio-player figcaption {margin:0 0 18px;display:flex;flex-direction:column;gap:7px;font:400 14px/1.5 Inter,sans-serif;color:#dceeee}
.case-audio-player figcaption small {font:400 10px/1.65 Inter,sans-serif;color:#8daaaa}
.case-audio-controls {display:flex;align-items:center;gap:12px;min-width:0}
.case-audio-toggle {display:grid;place-items:center;flex:0 0 32px;height:32px;padding:7px;color:#dceeee;background:none;border:1px solid #c8eeee33;border-radius:4px;cursor:pointer}
.case-audio-toggle svg {width:18px;height:18px}
.case-audio-wave {flex:1;min-width:30px;height:54px;cursor:pointer;touch-action:pan-y}
.case-audio-wave canvas {width:100%;height:100%;display:block}
.case-audio-wave:focus-visible,.case-audio-toggle:focus-visible {outline:1px solid #dceeee;outline-offset:4px}
.case-audio-time {font:400 8px/1.5 'IBM Plex Mono',monospace;color:#8daaaa;white-space:nowrap}
.case-audio-player.is-playing {border-color:#c8eeee66}
.case-audio-player audio,.sound-layer audio {display:none}
.sound-lab {display:grid;grid-template-columns:1fr 1.15fr;gap:26px 45px;margin-top:20px;padding:32px;border:1px solid #c8eeee33;border-radius:5px;background:#c8eeee03}
.sound-layer-tracks {min-width:0}
.sound-layer {display:grid;grid-template-columns:16px minmax(90px,1fr) minmax(50px,110px);align-items:center;gap:14px;border-bottom:1px solid #c8eeee26;padding:12px 0;cursor:pointer}
.sound-layer:first-child {padding-top:0}
.sound-layer input {accent-color:#a8d0cf;width:14px;height:14px}
.sound-layer strong,.sound-layer small {display:block;font:400 12px/1.6 Inter,sans-serif;color:#cee3e3}
.sound-layer small {font-size:9px;color:#8ba8a8;margin-top:4px}
.sound-layer canvas {width:100%;height:38px;opacity:.55}
.sound-layer.is-playing canvas {opacity:1}
.sound-lab-toggle {grid-column:2;justify-self:start}
.case-audio-status {grid-column:1/-1;font:400 11px/1.7 Inter,sans-serif;color:#adc2c2;margin:0}
.case-audio-status:empty {display:none}
#sound-design>.demo {grid-column:1/-1;margin:0}
.case-asset-note {font:400 11px/1.8 Inter,sans-serif;color:#8fa9a9;max-width:700px}
.case-asset-note summary {cursor:pointer;color:#bacfcf}
.case-player-quotes {display:flex;gap:26px;flex-wrap:wrap;padding:30px 0;border-block:1px solid #c8eeee33}
.case-player-quotes blockquote {font:300 clamp(24px,3vw,36px)/1.4 Inter,sans-serif;color:#dff5f5;letter-spacing:-.03em;margin:0}
.case-player-quotes p {flex-basis:100%;font:400 10px/1.7 Inter,sans-serif;color:#8da8a8;margin:0}
@media(max-width:650px) {
 .case-impact {grid-template-columns:1fr 1fr;gap:28px 18px}
 .case-reframe {grid-template-columns:1fr;gap:24px}
 .case-reframe>span {transform:rotate(90deg);justify-self:start}
 .research-quote-grid,.case-authorship,.case-next {grid-template-columns:1fr;gap:24px}
 .learn-make-cycle {grid-template-columns:1fr 1fr}
 .learn-make-cycle>div {border-bottom:1px solid #c8eeee26}
 .learn-make-cycle>div:nth-child(even) {border-right:0}
 .synthesis-head {display:none}
 .synthesis-row {grid-template-columns:1fr;gap:14px;padding:24px 0}
 .synthesis-row span::before {display:block;font:400 9px/1.7 'IBM Plex Mono',monospace;color:#819f9f;margin-bottom:5px;text-transform:none}
 .synthesis-row span:nth-child(1)::before {content:'Research Signal'}
 .synthesis-row span:nth-child(2)::before {content:'Design Priority'}
 .synthesis-row span:nth-child(3)::before {content:'Design Response'}
 .case-subsection {grid-template-columns:1fr;gap:25px;margin-top:15px}
 .case-feature-strip {grid-template-columns:30px 1fr;gap:20px 15px}
 .comparison-players,.finished-cues {grid-template-columns:1fr;gap:20px}
 .case-audio-player {padding:18px}
 .case-audio-time {font-size:8px}
 .case-audio-controls {gap:9px}
 .sound-lab {grid-template-columns:1fr;padding:22px;gap:24px}
 .sound-lab-toggle {grid-column:1}
 .sound-layer {grid-template-columns:16px minmax(90px,1fr) 65px;gap:10px}
}
/* A clearer opening hierarchy and more space between secondary details. */
.case-opening .case-credits {grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.case-contributions {margin:40px 0 0}
.case-contributions h3 {margin:0 0 18px;font:400 18px/1.5 Inter,sans-serif;letter-spacing:-.02em;color:#dceeee}
.case-contributions ul {display:flex;flex-wrap:wrap;gap:13px 28px;padding:0;margin:0;list-style:none}
.case-contributions li {display:flex;align-items:center;gap:10px;font:400 12px/1.7 Inter,sans-serif;color:#a9c2c2}
.case-contributions li::before {content:'';width:3px;height:3px;border-radius:50%;background:#a5cccc;box-shadow:0 0 6px #c8eeee44}
.case-opening .case-impact {margin-top:32px;padding:30px 0}
.research-quote-context {grid-column:1/-1;max-width:760px;font:400 13px/1.85 Inter,sans-serif;color:#9db7b7;margin:0}
.research-quote-grid {gap:38px}
.research-quote-grid figure {padding:26px 0}
.research-quote-grid figcaption {margin-top:18px;color:#7e9c9c}
.case-subsection .eyebrow {font-family:Inter,sans-serif;font-size:11px;letter-spacing:.01em;text-transform:none;color:#8faaaa;margin-bottom:20px}
.research-study-intro>.case-label,.case-before-after header>.case-label,.finished-cues header>.case-label,.sound-lab header>.case-label {font-family:Inter,sans-serif;font-size:11px;letter-spacing:.01em;text-transform:none;color:#8faaaa}
.study-stage header {min-height:100px}
.study-stage h3 {margin-top:18px}
.study-question>.case-label {font-family:Inter,sans-serif;font-size:10px;letter-spacing:0;text-transform:none}
.case-feature-strip {grid-template-columns:1fr 1fr;gap:32px 44px;padding:32px 0}
.case-feature-strip article {display:grid;grid-template-columns:30px 1fr;gap:18px;align-items:start}
.case-feature-strip p {font-size:13px;line-height:1.85}
.case-feature-strip strong {font-size:15px;margin-bottom:6px}
.deliverable-links {grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:44px;width:min(680px,100%);margin:12px auto 8px}
.deliverable-links .case-entry-button {position:relative;display:flex;align-items:center;justify-content:center;min-width:0;min-height:84px;padding:19px 25px;border:1px solid #e4ffffcc;border-radius:0;background:#d2f6f606;color:var(--path-light);box-shadow:0 0 5px #e5ffffaa,0 0 18px #c5eeee66,0 0 44px #c5eeee33,inset 0 0 16px #c5eeee22;font:300 clamp(11px,1.2vw,15px)/1.6 Montserrat,Inter,sans-serif;letter-spacing:.16em;text-transform:uppercase;text-align:center;text-decoration:none;text-shadow:0 0 5px #efffffff,0 0 15px #d4ffff99,0 0 28px #c5eeee55;cursor:pointer;animation:doorway-light 4.8s linear infinite;transition:box-shadow .22s,text-shadow .22s,background .22s,border-color .22s}
.deliverable-links .case-entry-button small {position:absolute;top:calc(50% + 13px);left:6px;right:6px;font:400 8px/1.3 Inter,sans-serif;letter-spacing:.04em;color:inherit;opacity:.75}
.deliverable-links .case-entry-button:hover,.deliverable-links .case-entry-button:focus-visible {border-color:#fff;background:#d2ffff1f;color:#fff;box-shadow:0 0 5px #fff,0 0 16px #e5ffffee,0 0 42px #c5ffffaa,0 0 85px #b5f7ff66,inset 0 0 26px #d5ffff55;text-shadow:0 0 4px #fff,0 0 13px #efffff,0 0 30px #c5ffffcc;animation:none}
.case-player-quotes {display:grid;grid-template-columns:1fr 1fr;gap:28px;border:0;padding:12px 0 0}
.case-player-quotes figure {display:flex;flex-direction:column;justify-content:space-between;gap:24px;min-height:190px;margin:0;padding:28px;border:1px solid #c8eeee33;border-radius:5px;background:radial-gradient(ellipse at top left,#c8eeee09,transparent 80%)}
.case-player-quotes blockquote {font-size:clamp(26px,3.1vw,38px);line-height:1.45}
.case-player-quotes figcaption {margin:0;font-size:11px;color:#90adad}
.case-player-quotes>p {grid-column:1/-1;margin-top:-10px}
.case-return-top {display:flex;justify-content:center;margin-top:30px;padding:36px 0 55px;border-top:1px solid #c8eeee26}
.case-return-top a {display:flex;align-items:center;gap:14px;font:400 12px/1.6 Inter,sans-serif;color:#c6dfdf}
.case-return-top svg {width:18px;height:18px;transition:transform .2s}
.case-return-top a:hover svg {transform:translateY(-4px)}
body.motion-paused .case-entry-button {animation-play-state:paused}
@media(max-width:650px) {
 .case-opening .case-credits {grid-template-columns:1fr;gap:24px}
 .case-contributions {margin-top:32px}
 .case-contributions ul {gap:12px 20px}
 .research-quote-grid,.case-player-quotes,.case-feature-strip {grid-template-columns:1fr;gap:24px}
 .case-player-quotes figure {min-height:150px;padding:24px}
 .deliverable-links {gap:24px}
 .deliverable-links .case-entry-button {font-size:9px;letter-spacing:.1em;padding:17px 10px;min-height:84px}
 .deliverable-links .case-entry-button small {font-size:7px;top:calc(50% + 13px)}
}
@media(prefers-reduced-motion:reduce) {.deliverable-links .case-entry-button {animation:none}.case-return-top svg {transition:none}}
/* Returning from the study aligns the complete options slide with the viewport. */
.mansion-interior[data-entry-state="ready"] #story-choice {scroll-margin-top:-100px}
@media(max-width:650px) {
 .deliverable-links {grid-template-columns:1fr;gap:22px}
 .deliverable-links .case-entry-button {font-size:11px;letter-spacing:.14em}
 .deliverable-links .case-entry-button small {font-size:8px}
}
/* Credits read as related items, with restrained dot separators. */
.credit-items {list-style:none;margin:0;padding:0;line-height:1.9}
.credit-items li {display:inline;white-space:nowrap}
.credit-items li+li::before {content:'·';margin:0 7px;color:#8dafaf}
/* A visible navigation group separates skipping ahead from reading the story. */
.case-contents {display:block;margin-top:32px}
.case-contents-label {margin:0 0 14px;font:400 12px/1.6 Inter,sans-serif;color:#a7c2c2}
.case-contents-links {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.case-contents-links a {display:grid;grid-template-columns:1fr 14px;align-items:center;gap:10px;min-width:0;padding:15px 16px;border:1px solid #c8eeee33;border-radius:4px;background:#c8eeee04;font:400 12px/1.5 Inter,sans-serif;color:#d4e8e8;transition:background .2s,border-color .2s}
.case-contents-links .case-index {grid-column:1/-1;font:400 9px/1.4 'IBM Plex Mono',monospace;color:#7f9f9f}
.case-contents-links svg {width:14px;height:14px;color:#9abbbb;transition:transform .2s}
.case-contents-links a:hover,.case-contents-links a:focus-visible {color:#efffff;border-color:#c8eeee99;background:#c8eeee0d}
.case-contents-links a:hover svg {transform:translateY(3px)}
.case-contents-links a:focus-visible {outline:1px solid #dceeee;outline-offset:3px}
/* Every quote uses the same card, typography, and attribution treatment. */
.case-quote-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;border:0;padding:12px 0 0}
.case-quote-grid figure {display:flex;flex-direction:column;justify-content:space-between;gap:24px;min-height:220px;margin:0;padding:28px;border:1px solid #c8eeee33;border-radius:5px;background:radial-gradient(ellipse at top left,#c8eeee09,transparent 80%)}
.case-quote-grid blockquote {margin:0;font:300 clamp(24px,2.7vw,32px)/1.5 Inter,sans-serif;letter-spacing:-.025em;color:#dff0f0}
.case-quote-grid figcaption {margin:0;font:400 10px/1.7 Inter,sans-serif;letter-spacing:.01em;color:#90adad}
.case-quote-grid>p {grid-column:1/-1;font:400 10px/1.7 Inter,sans-serif;color:#8da8a8;margin:-10px 0 0}
.deliverable-links {grid-template-columns:minmax(0,1fr);width:min(318px,100%);gap:0}
@media(max-width:650px) {
 .case-contents-links {grid-template-columns:repeat(2,minmax(0,1fr))}
 .case-contents-links a {padding:14px}
 .case-quote-grid {grid-template-columns:1fr;gap:24px}
 .case-quote-grid figure {padding:24px;min-height:180px}
}
@media(prefers-reduced-motion:reduce) {.case-contents-links a,.case-contents-links svg {transition:none}}
/* Restore the compact navigation and lighter spacing of the earlier layout. */
.case-contents {margin-top:32px}
.case-contents-links {display:flex;flex-wrap:wrap;gap:16px 30px}
.case-contents-links a {display:inline-flex;align-items:center;gap:7px;min-height:0;padding:4px 0;border:0;border-bottom:1px solid transparent;border-radius:0;background:none;font-size:10px}
.case-contents-links .case-index {font-size:10px}
.case-contents-links .case-index::after {content:' /'}
.case-contents-links svg {display:none}
.case-contents-links a:hover,.case-contents-links a:focus-visible {background:none;border-color:#c8eeee88}
.case-quote-grid figure {min-height:190px}
/* Clip the leading separator at the left edge of every wrapped credit row. */
.credit-items {display:flex;flex-wrap:wrap;gap:0 18px;overflow:hidden}
.credit-items li {display:block;position:relative;white-space:nowrap}
.credit-items li+li::before {position:absolute;left:-11px;top:0;content:'·';margin:0;color:#8dafaf}
/* The final game invitation belongs with the right-hand description. */
.chapter-body .deliverable-links {display:block;width:min(318px,100%);margin:28px auto 0}
.chapter-body .deliverable-links .case-entry-button {width:100%}
.case-study .eyebrow,.case-study .case-label,.case-study .case-credits dt,.case-study .learn-make-cycle span,.case-study .synthesis-head {text-transform:none}
.case-entry-button,.explore-case {text-transform:uppercase!important}
.control-label,.motion-label,.sound-label,.notice-enable {text-transform:capitalize}
#project[hidden] {display:none!important}
html.entry-snapping {scroll-snap-type:y mandatory}
html.entry-snapping.story-ending {scroll-snap-type:none}
html.entry-snapping .mansion-interior[data-entry-state="ready"] #story-choice {scroll-margin-top:0}
@media(max-width:650px) {
 .case-contents-links {gap:14px 22px}
 .case-quote-grid figure {min-height:150px}
 .chapter-body .deliverable-links {width:min(318px,100%)}
}

/* Pair related cues, ending with a full-width fatal encounter. */
.case-audio-player {position:relative}
.case-audio-player:has(.case-audio-element-icon) figcaption {padding-right:38px}
.case-audio-element-icon {position:absolute;right:20px;top:20px;width:24px;height:24px;color:#d6b879;opacity:.85}
.case-audio-element-icon[data-case-icon="trap"] {color:#d78c86}
.case-audio-element-icon[data-case-icon="monster"] {color:#d78989}

.case-audio-element-icon[data-case-icon="wall"] {color:#a7c0c8}

/* SVG form controls retain native input semantics without OS checkbox artwork. */
.sound-layer {position:relative}
.sound-layer input[type="checkbox"] {position:absolute;width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip-path:inset(50%);opacity:0}
.layer-check {width:18px;height:18px;color:#89a7a7}
.layer-check path {opacity:0}
.sound-layer input:checked+.layer-check {color:#d7f5f2}
.sound-layer input:checked+.layer-check path {opacity:1}
.sound-layer input:focus-visible+.layer-check {outline:2px solid #d7f5f2;outline-offset:4px;border-radius:3px}
.inline-ui-icon {display:inline-block;width:14px;height:14px;vertical-align:middle;flex-shrink:0}
.entry-arrow {width:24px;height:24px}
.video-controls {display:flex;align-items:center;gap:14px;padding:12px 14px;border:1px solid #c8eeee33;background:#050b0b;color:#dceeee}
.video-controls button {display:grid;place-items:center;flex-shrink:0;width:36px;height:36px;padding:8px;border:0;background:transparent;color:inherit;cursor:pointer;appearance:none;-webkit-appearance:none}
.video-controls button:hover {color:#fff;background:#c8eeee12}
.video-controls button:focus-visible,.video-controls input:focus-visible {outline:2px solid #c8eeee;outline-offset:3px}
.video-controls svg {width:20px;height:20px}
.video-controls input[type="range"] {flex:1;min-width:30px;height:20px;margin:0;background:transparent;appearance:none;-webkit-appearance:none;color:#dceeee}
.video-controls input::-webkit-slider-runnable-track {height:2px;background:#91b2b266}
.video-controls input::-moz-range-track {height:2px;background:#91b2b266}
.video-controls input::-webkit-slider-thumb {appearance:none;-webkit-appearance:none;width:12px;height:12px;margin-top:-5px;border:1px solid #e1ffff;border-radius:50%;background:#bcd9d9}
.video-controls input::-moz-range-thumb {width:10px;height:10px;border:1px solid #e1ffff;border-radius:50%;background:#bcd9d9}
.video-clock {font:400 10px/1.5 'IBM Plex Mono',monospace;white-space:nowrap}
.demo:fullscreen {display:flex;flex-direction:column;justify-content:center;background:#000}
.demo:fullscreen video {max-height:calc(100dvh - 65px)}
.demo:fullscreen figcaption {display:none}
@media(max-width:650px){.video-controls {gap:8px;padding:8px}.video-controls button {width:32px;height:32px}.video-clock {font-size:9px}}

.video-controls button[hidden] {display:none}
