/* CSDROP RESPONSIVE V1 | 2026-10-22
   Additive, reversible mobile/tablet compatibility layer.
   No global overflow-x:hidden, no gameplay/API changes, no case imagery overrides.
*/
:root { --cs-rsp-edge: clamp(10px, 2vw, 26px); }
/* Images, media, text and flex children should never force parent grids wider. */
.premium-header, .premium-home, .premium-case-page, .cs-upgrade-page,
.csct, .kd2, .csprofile, .csp2, .cs-support, .csf-footer,
.cs-case-filter, .filter-section { max-width: 100%; min-width: 0; }
.premium-home img, .premium-header img, .premium-case-page img, .csct img,
.cs-upgrade-page img, .kd2 img, .csprofile img, .csp2 img,
.cs-support img, .csf-footer img { max-width: 100%; }
.premium-home :is(.premium-grid,.premium-case,.premium-case-link,.collection-block,.collection-header),
.cs-upgrade-page :is(.cu-workstation,.cu-panel,.cu-engine),
.csct :is(.csct-shell,.csct-game-grid,.csct-arena,.csct-items-grid),
.kd2 :is(.kd2-toolbar,.kd2-row,.kd2-hero),
.csp2 :is(.csp2-account,.csp2-stats),
.csprofile :is(.csprofile__inventory-grid,.csprofile__filters) { min-width: 0; }
/* Usable keyboard navigation without changing tap/click handler logic. */
.premium-home :is(.premium-case-link,.collection-toggle,.cs-filter-tab,.cs-filter-chip,.cs-filter-sort,.cs-filter-reset):focus-visible,
.premium-header :is(a,button):focus-visible {
  outline: 2px solid #c9fa63 !important; outline-offset: 3px;
}

@media (max-width: 1279.98px) {
  .premium-home .premium-grid { grid-template-columns: repeat(4,minmax(0,1fr)) !important; }
  .premium-home .filter-section,
  .premium-home .premium-intro,
  .premium-home .collection-block,
  .premium-home .closing-line,
  .premium-home .empty-collection { width: calc(100% - 40px) !important; }
  .csct .csct-game-grid { grid-template-columns: minmax(0,1.25fr) minmax(0,.85fr) !important; }
}
@media (max-width: 991.98px) {
  /* Mobile header is already in source; keep its controls within the viewport. */
  .premium-header { padding: 10px 12px 0 !important; }
  .premium-header .mobile-only { max-width: 100% !important; }
  .premium-header .mobile-topbar,
  .premium-header .mobile-topbar-actions { min-width: 0 !important; }
  .premium-header .mobile-topbar { gap: 8px !important; }
  .premium-header .mobile-topbar-actions { flex: 0 1 auto !important; gap: 7px !important; }
  .premium-header .mobile-topbar .brand-link { min-width: 0; flex: 0 1 auto; }
  .premium-header .mobile-topbar .brand-text { white-space: nowrap; }
  .premium-header .mobile-menu.active { max-height: calc(100dvh - 104px); overflow-y: auto; overscroll-behavior: contain; }
  .premium-home .premium-grid { grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 12px !important; }
  .premium-home .collection-header { gap: 10px !important; }
  .premium-home .collection-header__tools { min-width: 0; flex-wrap: wrap; justify-content: flex-end; }
  .premium-case-page .premium-case-hero { width: calc(100% - 24px) !important; }
  .premium-case-page .premium-case-hero-inner { max-width: 100%; }
  .premium-case-page .roulette-block { max-width: 100% !important; }
  .cs-upgrade-page .cu-wrap { max-width: 100%; padding-left: 16px !important; padding-right: 16px !important; }
  .cs-upgrade-page .cu-workstation { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .cs-upgrade-page .cu-engine { grid-column: 1/-1; min-width: 0; }
  .csct .csct-shell { width: calc(100% - 28px) !important; }
  .csct .csct-game-grid { grid-template-columns: minmax(0,1fr) !important; }
  .csct .csct-hero { grid-template-columns: minmax(0,1fr) !important; }
  .kd2 .kd2-hero { max-width: 100%; }
  .csf-footer .csf-shell { max-width: calc(100% - 20px); padding-left: 18px !important; padding-right: 18px !important; }
}
@media (max-width: 719.98px) {
  .premium-home .premium-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 10px !important; }
  .premium-home .filter-section,
  .premium-home .premium-intro,
  .premium-home .collection-block,
  .premium-home .closing-line,
  .premium-home .empty-collection { width: calc(100% - 24px) !important; }
  .premium-home .premium-hero { width: calc(100% - 24px) !important; max-width: calc(100% - 24px); }
  .premium-home .hero-copy { min-width: 0; padding: 24px 18px !important; }
  .premium-home .hero-copy h1 { max-width: 100%; overflow-wrap: anywhere; font-size: clamp(27px, 7vw, 40px) !important; }
  .premium-home .hero-copy p { max-width: 100%; }
  .premium-home .hero-art { min-width: 0; }
  .premium-home .collection-header { align-items: flex-start !important; flex-wrap: wrap !important; }
  .premium-home .collection-header h3 { font-size: clamp(19px,5vw,25px) !important; overflow-wrap: anywhere; }
  .premium-home .collection-header__tools { max-width: 100%; min-width: 0; }
  .premium-home .premium-case.case-rework { min-width: 0 !important; }
  .premium-home .premium-case .case-meta { min-width: 0; }
  .premium-home .case-rework .case-hover-cta { max-width: calc(100% - 16px); text-align: center; justify-content: center; font-size: 10px !important; white-space: nowrap; }
  /* Filter categories swipe; controls wrap into usable rows rather than protruding. */
  .cs-case-filter { display: flex !important; flex-wrap: wrap !important; padding: 9px !important; gap: 8px !important; min-width: 0; }
  .cs-case-filter .cs-case-filter__categories { flex: 1 1 100% !important; width: 100%; min-width: 0; overflow-x: auto !important; touch-action: pan-x; }
  .cs-case-filter .cs-case-filter__actions { display: flex !important; flex: 1 1 100%; min-width: 0; width: 100% !important; gap: 7px; flex-wrap: wrap; }
  .cs-case-filter .cs-filter-chip { min-width: 0; flex: 1 1 42%; white-space: normal; min-height: 42px; padding: 7px 8px; line-height: 1.2; }
  .cs-case-filter .cs-filter-price { min-width: 0; flex: 1 1 100% !important; width: 100%; margin: 0 !important; }
  .cs-case-filter .cs-filter-price__control { min-width: 0; max-width: 100%; }
  .cs-case-filter :is(.cs-filter-sort,.cs-filter-reset) { min-height: 42px; }
  .premium-case-page .premium-case-hero-inner { padding: 22px 15px !important; }
  .premium-case-page .premium-case-copy { min-width: 0 !important; width: 100% !important; }
  .premium-case-page .premium-open-heading { max-width: calc(100% - 18px); }
  .premium-case-page .csdrop-odds-scroll { width: 100%; max-width: 100%; overflow-x: auto !important; overscroll-behavior-x: contain; }
  .cs-upgrade-page .cu-wrap { padding-left: 10px !important; padding-right: 10px !important; }
  .cs-upgrade-page .cu-workstation { grid-template-columns: minmax(0,1fr) !important; }
  .cs-upgrade-page .cu-engine { grid-column: 1 !important; grid-row: auto !important; }
  .cs-upgrade-page .cu-panel { min-width: 0 !important; min-height: 0; }
  .cs-upgrade-page .cu-multis { max-width: 100%; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
  .cs-upgrade-page .cu-multis button { flex: 1 1 auto; min-width: 41px; }
  .cs-upgrade-page .cu-heading { flex-wrap: wrap; gap: 10px; }
  .csct .csct-shell { width: calc(100% - 20px) !important; }
  .csct .csct-items-grid { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
  .csct .csct-toolbar { min-width: 0; flex-wrap: wrap; }
  .csct .csct-search { min-width: 0; width: 100%; }
  .kd2 { max-width: 100%; padding-left: 10px !important; padding-right: 10px !important; }
  .kd2 .kd2-toolbar,.kd2 .kd2-toolbar-right { min-width: 0; flex-wrap: wrap; }
  .kd2 .kd2-search { min-width: 0; flex: 1 1 auto; }
  .kd2 .kd2-row { max-width: 100%; min-width: 0; }
  .csprofile__inventory-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .csprofile__filters, .csp2-nav { min-width: 0; flex-wrap: wrap; }
  .csprofile__item, .csp2-account, .csp2-stat { min-width: 0 !important; }
  .cs-support__shell { width: calc(100% - 20px) !important; }
  .cs-support__workspace { grid-template-columns: minmax(0,1fr) !important; }
  .cs-support__sidebar, .cs-support__main { min-width: 0; }
  .cs-support__bubble, .cs-support__message, .cs-support__ticket { overflow-wrap: anywhere; }
  .csf-footer .csf-shell { max-width: calc(100% - 16px); padding: 0 12px !important; }
  .csf-footer .csf-nav-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width: 480px) {
  .premium-header { padding: 7px 7px 0 !important; }
  .premium-header .mobile-topbar { padding: 8px 9px !important; }
  .premium-header .mobile-topbar-actions { gap: 4px !important; }
  .premium-header .mobile-topbar .brand-text { font-size: 17px !important; }
  .premium-header .mobile-topbar .csdrop-header-logo { width: 28px !important; height: 28px !important; }
  .premium-header .compact-pill { padding: 6px !important; }
  .premium-header .mobile-menu { padding: 0 10px 12px !important; }
  .premium-header .mobile-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 7px !important; }
  .premium-header .hamburger-btn { min-width: 40px !important; width: 40px !important; height: 42px !important; }
  .premium-home .premium-grid { gap: 8px !important; }
  .premium-home .premium-case.case-rework { border-radius: 12px; }
  .premium-home .premium-case .case-price { font-size: 14px !important; }
  .premium-home .premium-case .case-arrow { padding: 5px 7px; }
  .premium-home .collection-header h3 { font-size: 20px !important; }
  .premium-home .collection-count { font-size: 11px; }
  .premium-home .case-rework .case-hover-cta { font-size: 9px !important; padding: 7px 9px !important; }
  .premium-home .case-rework .case-meta { left: 9px !important; right: 9px !important; }
  .csct .csct-items-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 7px !important; }
  .csct .csct-item { min-width: 0; }
  .csct .csct-hero { min-width: 0; padding: 15px !important; }
  .csct .csct-hero-meta { flex-wrap: wrap; }
  .kd2 .kd2-segments { width: 100%; overflow-x: auto; flex-wrap: nowrap; }
  .kd2 .kd2-segments button { flex: 1 0 auto; }
  .csprofile__inventory-grid { gap: 8px !important; }
  .csf-footer .csf-nav-grid { gap: 18px 10px !important; }
  .cs-auth-overlay .cs-auth-dialog { width: calc(100vw - 16px) !important; max-width: calc(100vw - 16px) !important; max-height: calc(100dvh - 16px) !important; overflow-y: auto !important; }
  .cs-auth-overlay .cs-auth-content { padding: 28px 17px 22px !important; }
  .cs-auth-overlay .cs-auth-content h2 { font-size: clamp(22px,6vw,29px) !important; }
  .cs-op-fab { max-width: calc(100vw - 10px); }
}
@media (max-width: 350px) {
  /* One-column catalog is preferable to clipped 140px controls on very small devices. */
  .premium-home .premium-grid { grid-template-columns: minmax(0,1fr) !important; }
  .premium-home .premium-case.case-rework { min-height: 265px !important; }
  .premium-header .mobile-topbar .brand-text { font-size: 14px !important; }
  .premium-header .compact-pill { display: none !important; }
  .premium-home .case-rework .case-hover-cta { font-size: 10px !important; }
  .cs-case-filter .cs-filter-chip { flex-basis: 100%; }
}
/* The operator's administrative interface uses older fixed-width Metronic tables.
   Allow intentional scrolling INSIDE tables, not sideways across the entire admin page. */
@media (max-width: 991.98px) {
  body.kt-aside--enabled .kt-content,
  body.kt-aside--enabled .kt-portlet,
  body.kt-aside--enabled .kt-portlet__body { min-width: 0; max-width: 100%; }
  body.kt-aside--enabled .kt-content { padding-left: 10px !important; padding-right: 10px !important; }
  body.kt-aside--enabled .kt-portlet__body { padding-left: 12px !important; padding-right: 12px !important; }
  body.kt-aside--enabled :is(.table-responsive,.dataTables_wrapper,.dataTables_scrollBody) {
    max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain;
  }
  body.kt-aside--enabled .modal-dialog { width: calc(100% - 18px) !important; max-width: min(620px,calc(100% - 18px)) !important; margin: 12px auto !important; }
  body.kt-aside--enabled .modal-content { max-width: 100%; }
  body.kt-aside--enabled .modal-body input,
  body.kt-aside--enabled .modal-body select,
  body.kt-aside--enabled .modal-body textarea { max-width: 100%; min-width: 0; }
}
@media (max-width: 520px) {
  body.kt-aside--enabled .modal-dialog { width: calc(100% - 12px) !important; max-width: calc(100% - 12px) !important; }
  body.kt-aside--enabled .modal-body { padding: 12px !important; }
  body.kt-aside--enabled .modal-footer { flex-wrap: wrap; gap: 8px; }
  body.kt-aside--enabled .modal-footer .btn { min-height: 40px; }
  body.kt-aside--enabled .dataTables_wrapper .row { margin-left: 0; margin-right: 0; }
  body.kt-aside--enabled .dataTables_wrapper .dataTables_filter input { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .premium-home .premium-case, .premium-home .premium-case img,
  .kd2 *, .csct *, .csf-footer * { scroll-behavior: auto !important; }
}