/* TUNE DECK case media and audio controls. */
.td-case>.case-lead{min-height:0;margin-bottom:20px}
.td-case>p{font-family:'Geist',var(--font-ui);font-size:13.5px;line-height:1.6;color:#1a1a1a;text-align:left;letter-spacing:normal;margin:0 0 16px;max-width:660px}
.td-case .td-hero{flex-direction:column;align-items:center}
.td-case .td-hero video{width:264px;max-width:100%;height:auto;aspect-ratio:864 / 1796;object-fit:contain}
.td-case video::-webkit-media-controls,.td-case video::-webkit-media-controls-enclosure{display:none!important}
.td-case figure{display:flex;flex-direction:column;align-items:center;min-width:0;margin:0}
.td-case .td-pair{align-items:start}
.td-case figcaption{display:block;margin:12px 0 0;text-align:center;line-height:1.4}
.td-case .td-sound-button{display:flex;position:relative;align-items:center;justify-content:center;gap:9px;flex-shrink:0;width:152px;min-width:152px;max-width:152px;height:44px;margin:12px auto 0;padding:0 10px;box-sizing:border-box;border:1px solid #969696;border-radius:7px;background:#c0c0c0;color:#292929;font:13px/1.2 Arial,sans-serif;white-space:nowrap;cursor:pointer;touch-action:pan-y;box-shadow:0 2px 0 #8b8b8b,inset 1px 1px #fff,inset -1px -1px #aaa;transition:background-color 120ms,box-shadow 100ms}
.td-case .td-sound-button[aria-pressed="true"]{background:#c0c0c0}
.td-case .td-sound-led{display:block;box-sizing:border-box;width:6px;height:6px;min-width:6px;flex:0 0 6px;border-radius:50%;background-color:#929292;box-shadow:inset 0 1px 1px #0003;transition:background-color 120ms}
.td-case .td-sound-button[aria-pressed="true"] .td-sound-led{background-color:#5b7c4a}
@media(hover:hover){.td-case .td-sound-button:hover{background:#c9c9c9}}
.td-case .td-sound-button:active,.td-case .td-pressing .td-sound-button{transform:none;background:#b9b9b9;box-shadow:0 1px 0 #8b8b8b,inset 1px 2px 3px #0002,inset -1px -1px #fff8}
.td-case .td-sound-button:focus-visible{outline:2px solid #476a9b;outline-offset:4px}
.td-case .td-haptic-wrap{flex-shrink:0;margin:12px auto 0}
.td-case .td-haptic-wrap .td-sound-button{margin:0}
@media(prefers-reduced-motion:reduce){.td-case .td-sound-button,.td-case .td-sound-led{transition:none}}
@media(max-width:360px){.td-case .td-pair{grid-template-columns:1fr;gap:28px}}

.td-case>.td-next-step{margin:52px 0 28px}
