/* Preserve the palette while making controls and small text easier to perceive. */
.practice .eyebrow,.practice .step-number{color:#685535}
.practice .section-aside,.practice .step-caption{color:#5c604f}
.formation-heading .eyebrow,.formation-card .feature-index,.formation-card .greek-line{color:#655335}
.formation-heading>p,.formation-card small{color:#4f594f}
:where(a,button,input,select,textarea,summary):focus-visible{outline:2px solid var(--brass);outline-offset:4px}
.practice :focus-visible,.formation-section :focus-visible{outline-color:#344238}
:where(a,button,input,select,textarea,summary){scroll-margin-block:100px}
.note-close{min-width:44px;min-height:44px}
.practice-step>summary{cursor:pointer;pointer-events:auto}
.scene-point .point-ring{border-color:#c5ab7a}
.scene-point .point-ring{background:#0b1414;color:#f3eee4}
.site-header{background:#0b1414ed}
.preference-panel select{border-color:#8e9d8b}
.soundtrack-panel select{border-color:#8e9d8b}
.widget-mobile [role="tabpanel"]>figure{margin:0}
.widget-artwork{display:block}
.phone{height:auto;min-height:610px;display:flex;flex-direction:column;padding-bottom:64px}
.phone-content{flex:1}
.phone-button{position:static;margin-top:24px;flex-shrink:0}
html:has(:focus-visible){scroll-behavior:auto}
body:has(.soundtrack-controls) .site-footer{padding-bottom:100px}
/* Keep keyboard focus usable when the scroll-driven hero would otherwise fade it. */
.hero-stage:has(:focus-visible) .hero-content{opacity:1!important;visibility:visible!important;transform:none!important}
.hero-stage:has(:focus-visible) .scene-points{opacity:1!important}
.hero-stage:has(:focus-visible) .threshold-message{opacity:0!important}
@media(min-width:651px){html{scroll-padding-top:100px;scroll-padding-bottom:100px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important}}