/* eclat_mobile.css — ładowany przez media query w HTML lub bez */

@media(max-width:900px){
  .cbody{grid-template-columns:1fr}
}

@media(max-width:768px){
  .sidebar{display:none}
  .mobile-nav{display:flex}
  .pw{padding-bottom:64px}
  .tb-logo{font-size:13px;padding:0 10px}
  .tstat{min-width:58px;padding:0 7px}
  .tb-act{padding:0 5px;gap:2px}
  .tba{padding:4px 5px;font-size:0}
  .tba svg{width:14px;height:14px}
  .tb-lvl{padding:0 8px}
  .ogrid{grid-template-columns:1fr 1fr}
  .pgall{grid-template-columns:repeat(3,1fr)}
  .panel{padding:13px}
  .pgrid{grid-template-columns:repeat(auto-fill,minmax(92px,1fr))}
  .ocats{grid-template-columns:1fr}
  .fwrap{flex-wrap:wrap}
  .fst{min-width:calc(50% - 1px)}
  .cbody{grid-template-columns:1fr}
  .bm-row{flex-direction:column}
  .ki-wrap{flex-direction:column-reverse}
  .ki-side{width:100%;position:static}
  .ki-hands{gap:6px}
  .ki-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}
}

@media(max-width:480px){
  .ogrid{grid-template-columns:1fr}
  .pgall{grid-template-columns:repeat(2,1fr)}
  .ptop,.fwrap{flex-wrap:wrap}
  .pst,.fst{min-width:calc(50% - 1px)}
  .octa-row{flex-direction:column;align-items:stretch}
  .octa{text-align:center;justify-content:center}
}