/* Cross-resolution safety net: keeps components inside the viewport without redesigning services. */
html, body { max-width:100%; overflow-x:clip; }
.site-shell, .main-content, .topbar, .desktop-nav, .topbar-actions, .service-nav-inner { min-width:0; }
.main-content { width:100%; max-width:1360px; padding-left:clamp(14px,2.25vw,32px); padding-right:clamp(14px,2.25vw,32px); }
.main-content > *, .admin-main > *, .tintok-shell, .tinstar-page, .teenbook-shell,
[class*="-grid"], [class*="-layout"], [class*="-panel"], [class*="-card"] { min-width:0; }
[class*="-grid"] > *, [class*="-layout"] > *, [class*="-panel"] > * { min-width:0; }
img, video, canvas, iframe { max-width:100%; }
.table-wrap { max-width:100%; overflow-x:auto; overscroll-behavior-inline:contain; }
input, select, textarea { max-width:100%; }
@media (min-width:801px) and (max-width:1220px) {
  .topbar { gap:12px; padding-left:18px; padding-right:18px; }
  .desktop-nav { gap:0; overflow-x:auto; scrollbar-width:none; }
  .desktop-nav::-webkit-scrollbar { display:none; }
  .desktop-nav a { flex:0 0 auto; padding-left:9px; padding-right:9px; font-size:13px; }
  .topbar-actions .hello { display:none; }
  .topbar-actions { gap:5px; }
  .topbar-actions .ghost-button, .topbar-actions .top-join { padding:8px 9px; font-size:12px; }
  .hero-grid, .tinstar-upload-page { gap:24px; }
}
@media (min-width:801px) and (max-width:980px) {
  .hero-grid, .tinstar-upload-page, .admin-two-col { grid-template-columns:minmax(0,1fr)!important; }
  .hero-art { min-height:260px; height:300px; }
  .desktop-nav a { font-size:12px; padding-left:7px; padding-right:7px; }
  .brand-text { font-size:15px; }
}
@media (max-width:800px) {
  .main-content { padding-left:14px; padding-right:14px; }
}
.mobile-more-grid a i img { display:block; width:100%; height:100%; border-radius:9px; object-fit:cover; }
.mobile-more-empty { grid-column:1/-1; margin:0; padding:18px 10px; color:#74809b; font-size:12px; text-align:center; }