/* Phase 300: responsive without clipping controls, tables or footer */
:root{--dj-density-gap:clamp(6px,.85vh,12px)}
@media (min-width:1024px) and (min-height:720px){
 :is(.page-content,.dashboard-content,.main-content,.content-wrapper,.workspace){padding-top:var(--dj-density-gap);padding-bottom:var(--dj-density-gap)}
 :is(.page-content,.dashboard-content,.main-content,.workspace) :is(.card,.panel,.widget){margin-block:var(--dj-density-gap)}
 :is(.page-content,.dashboard-content,.main-content,.workspace) :is(h1,h2,h3){line-height:1.2}
 :is(.page-content,.dashboard-content,.main-content,.workspace) :is(input,select,button){max-width:100%}
}
/* The footer stays in the normal document flow; content must never be hidden. */
body{min-width:0}
:where(main,section,article,.card,.panel,.workspace){min-width:0}
:where(.table-responsive,.table-container,.table-wrap){overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
:where(.modal,.dialog,[role=dialog]){max-height:calc(100dvh - 24px);overflow-y:auto}
@media(max-height:719px),(max-width:1023px){html,body{min-height:100%;height:auto}body{overflow-y:auto}}