/* Brand scrollbars: document charcoal; interior controls retain light tracks. */
html { scrollbar-width:thin; scrollbar-color:#d1bd00 #f2f2ef; }
*::-webkit-scrollbar { width:10px; height:10px; }
*::-webkit-scrollbar-track { background:#f0f0ec; }
*::-webkit-scrollbar-thumb { background:#b9aa22; border:3px solid #f0f0ec; border-radius:20px; }
*::-webkit-scrollbar-thumb:hover { background:#d1bd00; }
html::-webkit-scrollbar-track { background:#f2f2ef; }
html::-webkit-scrollbar-thumb { background:#d1bd00; border-color:#f2f2ef; }
html::-webkit-scrollbar-thumb:hover { background:#fee500; }
html::-webkit-scrollbar-corner { background:#f2f2ef; }
dialog, textarea, .language-menu { scrollbar-width:thin; scrollbar-color:#b9aa22 #f0f0ec; }
@media(forced-colors:active) { html,dialog,textarea,.language-menu { scrollbar-color:auto; } }
/* Full generated images. Never crop the object silhouettes. */
.method-visual { height:205px; }
.method-visual img { display:block; width:100%; height:100%; object-fit:contain; mask:none;clip-path:none;mix-blend-mode:normal; }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
 .method-visual img { transition:transform .65s var(--ease-out); }
}
@media(max-width:1100px) { .method-visual { height:170px; } }
@media(max-width:767px) { .method-visual { height:130px; } .method-visual img { width:145px; max-width:none; height:145px; flex-shrink:0; } }


.method-visual img{height:auto;aspect-ratio:3/2;max-height:100%;width:auto;max-width:100%;object-fit:contain;}
@media(max-width:767px){.method-visual img{width:145px;height:auto;max-width:none;}}

@media(max-width:767px){.method-visual img{width:100%;max-width:100%;height:auto;}}