/**
 * ChaozCode Responsive Fixes v1.0
 * Additional responsive utilities for style-guide.html
 */


@supports not (container-type:inline-size){
 .cq-demo{
 flex-direction:column;
}
}


@media (max-width:768px){
 html, body{
 overflow-x:hidden;
 max-width:100vw;
}
 
 .container{
 padding-inline:var(--space-md, 1rem);
}
 
 pre, code{
 max-width:100%;
 overflow-x:auto;
}
 
 table{
 display:block;
 overflow-x:auto;
}
}


@media (hover:none) and (pointer:coarse){
 button, .btn, a{
 min-height:44px;
 min-width:44px;
}
}


@media print{
 .no-print, nav, footer{
 display:none !important;
}
 
 body{
 color:#000;
 background:#fff;
}
}


@media (prefers-reduced-motion:reduce){
 *, *::before, *::after{
 animation-duration:0.01ms !important;
 animation-iteration-count:1 !important;
 transition-duration:0.01ms !important;
}
}


@media (prefers-contrast:high){
:root{
 --border-color:currentColor;
}
 
 button, .btn{
 border:2px solid currentColor;
}
}