@media(max-width:767px){
 html,body{width:100%;height:auto;min-height:100%;overflow:visible}
 .bar{height:auto;min-height:64px;padding:14px 18px;gap:10px;flex-wrap:wrap}.bar .brand{font-size:21px}.bar .study{font-size:13px}.bar .demo{display:none}
 main{height:auto;padding:22px 16px 35px}.intro,.head{display:block;min-height:0}.intro h1,.head h1{font-size:28px}.intro .pill,.head .tag{display:inline-block;margin-top:13px;white-space:normal}.intro .filter-row{margin:18px 0 0;flex-wrap:wrap}
 .summary,.summary.four,.cards{height:auto;display:grid;grid-template-columns:1fr;margin:22px 0;gap:10px}.card{padding:17px}.card h2{font-size:19px}
 .workspace,.workspace.three,.workspace.two,.workspace.ai,.lower{height:auto;display:grid;grid-template-columns:1fr;gap:13px}.panel{overflow:visible}.panel>header{height:auto;min-height:49px;padding:12px 16px}.panel-body,.panel-copy{padding:13px 16px}.drawer .drawer-head,.drawer-body{padding:16px}.drawer-foot{margin:0 16px 16px}
 .list-row{grid-template-columns:90px 1fr 50px;gap:8px}.topic-row{grid-template-columns:110px 1fr 40px;gap:8px}.topic-row b,.list-row b{font-size:12px}.list-row p,.list-row .row-detail{font-size:12px}
 .reason{grid-template-columns:120px 1fr 42px;gap:8px;min-height:66px}.reason b{font-size:13px}.table-head,.table-row{grid-template-columns:90px 1fr 50px;gap:7px}.table-row b,.table-row p{font-size:12px}
 .foot{gap:10px;flex-wrap:wrap;margin-top:20px}.flow{margin:20px 10px}.quadrant{max-width:310px}
}

@media(max-width:767px){.bar .demo{display:block;width:100%;font-size:9px}}