/* Mobile-only refinements. Desktop styles and functionality are unchanged. */
@media (max-width: 767px) {
  html,body {max-width:100%;overflow-x:hidden}
  .shell {width:calc(100% - 24px);max-width:100%;margin-inline:auto}
  .topbar {height:auto;min-height:40px}
  .topbar .shell,.topbar-shell {min-height:40px;gap:8px;align-items:center;justify-content:space-between;flex-wrap:nowrap;overflow:visible}
  .topbar .top-telegram,.topbar #telegramLink {min-width:0;flex-shrink:1}
  .topbar .top-telegram b,.topbar #telegramHandle {font-size:12px;white-space:nowrap}
  .topbar .top-channel-button,.topbar #channelButton {flex-shrink:0;font-size:10px;padding:7px 8px;white-space:nowrap}
  .topbar .top-brand-mini,.topbar .brand-mini {width:24px;height:24px;flex-shrink:0}
  .topbar .top-left {width:100%;justify-content:space-between;min-width:0}
  .topbar .top-text-button {display:none}
  .topbar .top-menu {display:none}
  .header.shell {height:auto;min-height:128px;display:grid;grid-template-columns:62px minmax(0,1fr);grid-template-rows:75px 46px;gap:6px 10px;padding-block:7px}
  .header .category-wrap {grid-row:1;grid-column:1;height:75px}
  .header .category-button {width:62px;height:75px;font-size:23px}
  .header .category-button b {font-size:11px}
  .header .logo {grid-row:1;grid-column:2;width:auto;height:75px;justify-content:flex-start;min-width:0}
  .header .logo img {width:100px;height:74px;object-fit:contain;object-position:left center}
  .header .search {grid-column:1/-1;grid-row:2;height:44px;margin:0;width:100%;min-width:0}
  .header .search select {display:block;width:70px;padding:0 5px;font-size:12px}
  .header .search input {font-size:13px;padding-inline:8px;min-width:0}
  .header .search button {width:40px;font-size:23px}
  .head-links {display:none}
  nav {overflow:hidden;max-width:100%}
  .nav-items {width:100%!important;max-width:100%;display:grid!important;grid-auto-flow:column!important;grid-template-columns:none!important;grid-auto-columns:minmax(115px,1fr)!important;grid-template-rows:repeat(3,42px)!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin}
  .nav-items a {min-width:115px!important;font-size:12px;padding:0 6px}
  .partners {padding-top:14px}
  .partners h1,.category-partners h2 {height:auto;min-height:48px;font-size:17px;white-space:normal;text-align:center;padding:8px}
  .banner-grid {grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px}
  .banner-grid a,.banner-grid img {max-width:100%;min-width:0}
  .directory {padding:32px 0 50px}
  .directory-title h2 {font-size:23px}
  .directory-title p {font-size:13px}
  .category-grid {grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px}
  .cat-card {min-width:0}
  .cat-card header {height:48px}
  .cat-title-link {padding-inline:6px;gap:3px;min-width:0}
  .cat-title-link h3 {font-size:13px;min-width:0;letter-spacing:-.5px;overflow-wrap:anywhere}
  .cat-title-link .cat-view-all {font-size:10px;letter-spacing:-.5px;gap:1px}
  .cat-card ol {padding:6px 5px 9px}
  .cat-card ol li a {height:35px;font-size:12px;min-width:0;gap:2px}
  .cat-card ol li a .site-name {min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .cat-card .heart-site {flex-shrink:0}
  .sub-header,.notice-header {min-height:75px;height:auto;gap:10px}
  .sub-header .logo img,.notice-header .notice-logo img {width:95px;height:65px}
  .home-link {font-size:12px;white-space:nowrap}
  .ranking-page {padding-top:14px}
  .channel-box {height:auto;min-height:54px;padding:9px;font-size:15px;text-align:center}
  .ranking-head {margin-top:12px;padding:13px 0}
  .ranking-head h1 {font-size:20px}
  .ranking-grid {grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px}
  .site-logo {height:125px;padding:28px 9px 9px}
  .site-logo img {max-height:78px}
  .site-logo strong {font-size:16px;overflow-wrap:anywhere}
  .site-card-foot {height:49px;padding-inline:7px;gap:3px}
  .site-card-foot b {font-size:13px;min-width:0}
  .site-card-foot span {font-size:10px}
  .card-rank {top:5px;left:6px;font-size:19px}
  .laurel {width:26px;height:26px;font-size:11px}
  .modal-card {width:min(430px,100%)}
}
@media (max-width: 350px) {
  .topbar .top-channel-button,.topbar #channelButton {font-size:9px;padding:6px}
  .topbar .top-telegram b,.topbar #telegramHandle {font-size:11px}
  .site-card-foot span {font-size:9px}
  .cat-title-link h3 {font-size:12px}
  .cat-title-link .cat-view-all {font-size:9px}
  .cat-card ol li a {font-size:11px}
}