/* css/responsive.css — tablet / mobile layouts, reduced motion */
@media (max-width:1060px){.split{grid-template-columns:minmax(0,1fr)}}
@media (max-width:780px){
 .shell{grid-template-columns:minmax(0,1fr)}.side{display:none}
 .top{display:flex;justify-content:space-between;align-items:center;background:var(--band);color:#fff;padding:10px 14px;position:sticky;top:0;z-index:20}
 main{padding:14px 12px 96px}
 .bottom{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;background:var(--surface);border-top:1px solid var(--line);z-index:30;padding-bottom:env(safe-area-inset-bottom)}
 .bottom a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px;font-size:11px;text-decoration:none;color:var(--muted)}
 .bottom a[aria-current=page]{color:var(--accent-d);font-weight:650}
 .g2,.g3{grid-template-columns:minmax(0,1fr)}.g3.keep{grid-template-columns:repeat(2,minmax(0,1fr))}
 .word{font-size:42px}.field{grid-template-columns:minmax(0,1fr)}
 .recbtn{flex:1 1 100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
@media (max-width:640px){.mouthgrid{grid-template-columns:minmax(0,1fr)}.fig svg{max-width:260px}.tiles{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}.hintmask{font-size:22px}}


/* Professional UI refresh — responsive adjustments */
@media(max-width:1050px) and (min-width:781px){.shell{grid-template-columns:210px minmax(0,1fr)}.side{padding:20px 10px}.grid.g3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:780px){.top{background:#142744;padding:12px 16px;box-shadow:0 2px 14px #07132920}.top .brand{font-size:13px}.top .brand i{width:31px;height:31px}main{padding:22px 16px 105px}.bottom{box-shadow:0 -4px 20px #14274412}.bottom a{min-height:58px;justify-content:center}.card{padding:17px}.stat{min-height:94px;padding:16px}.stat b{font-size:25px}.pg-title{font-size:26px}}
@media(max-width:420px){main{padding-left:12px;padding-right:12px}.top{padding:10px}.top .brand{gap:5px;font-size:12px}.top .brand i{width:27px;height:27px}.grid.g3.keep{gap:9px}.stat{padding:13px}.stat b{font-size:23px}.stat span{font-size:11px}.btn{padding:8px 11px}}