/* Affiliate CMS Pro V23.9.2 — Mobile First Optimization
   Public site + admin panel responsive hardening for 320–768px screens. */

html{max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{max-width:100%;overflow-x:hidden}
img,svg,video,canvas,iframe{max-width:100%;height:auto}
button,input,select,textarea{font-size:16px}
button,a,.btn,input,select,textarea{touch-action:manipulation}

/* Public navigation: remains visible without JS, becomes a hamburger after JS boots. */
.public-menu-toggle-v2392{display:none;width:46px;height:46px;padding:0;border:1px solid rgba(255,255,255,.16);border-radius:14px;background:rgba(255,255,255,.08);color:#fff;cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:5px}
.public-menu-toggle-v2392 span{display:block;width:21px;height:2px;border-radius:999px;background:currentColor;transition:transform .2s ease,opacity .2s ease}
.public-menu-toggle-v2392[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.public-menu-toggle-v2392[aria-expanded="true"] span:nth-child(2){opacity:0}
.public-menu-toggle-v2392[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Prevent long labels and URLs from breaking the viewport. */
.site-card-v18,.top-banner,.ad-card,.mini-list,.article-content,.premium-content-v19,.sticky-card-v19,.review-card,.brand,.footer,.admin-card,.panel-v12{overflow-wrap:anywhere}
.table-wrap,.table-responsive,.table-responsive-v12{max-width:100%;-webkit-overflow-scrolling:touch}

@media (max-width: 900px){
  .container,.layout-wide .container{width:min(calc(100% - 28px),var(--content-width,1180px))}
  .page-shell,.page-shell-v18{margin-top:20px;margin-bottom:30px;gap:16px}
  .hero,.hero-v18,.review-hero-v19,.article-hero-v19{padding:34px 0 30px}
  .hero h1,.hero-v18 h1{font-size:clamp(29px,8.5vw,46px);line-height:1.08;letter-spacing:-.025em}
  .hero p,.hero-v18 p{font-size:16px;line-height:1.6;margin-bottom:0}
  .top-banners{gap:12px;margin:16px auto}
  .top-banner{min-width:0;padding:14px 15px}
  .top-banner>div{min-width:0}
  .top-banner p{margin:6px 0 0}
  .site-filter-tabs-v239{scrollbar-width:none;scroll-snap-type:x proximity;padding-inline:1px}
  .site-filter-tabs-v239::-webkit-scrollbar{display:none}
  .site-filter-tab-v239{scroll-snap-align:start;min-height:44px}
  .review-layout-v19{grid-template-columns:1fr}
  .sticky-card-v19{position:static}
  .review-hero-inner-v19{grid-template-columns:auto 1fr}
  .review-hero-cta-v19{grid-column:1/-1;width:100%}
  .review-hero-cta-v19 .btn{width:100%;min-height:48px}
}

@media (max-width: 760px){
  body{padding-bottom:env(safe-area-inset-bottom)}
  .container,.layout-wide .container{width:calc(100% - 24px)}
  .topbar{position:sticky;top:0;z-index:90;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
  .topbar .nav{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;min-height:64px;padding:9px 0}
  .brand{min-width:0;max-width:100%;font-size:19px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body.public-menu-ready .public-menu-toggle-v2392{display:flex}
  .public-nav-v2392{grid-column:1/-1;width:100%;display:flex;flex-direction:column;gap:5px;overflow:visible!important;padding:7px 0 3px}
  body.public-menu-ready .public-nav-v2392:not(.is-open){display:none}
  .public-nav-v2392 a{display:flex!important;align-items:center;width:100%;min-height:46px;padding:10px 12px!important;border-radius:12px!important;background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.08)!important;font-size:14px!important;white-space:normal}

  .hero,.hero-v18{padding:28px 0 25px;border-radius:0 0 24px 24px}
  .hero-v18:after{width:280px;height:280px;right:-135px;top:-145px}
  .badge{padding:7px 10px;font-size:12px}
  .hero h1,.hero-v18 h1{margin:11px 0 9px;font-size:clamp(28px,9.2vw,39px)}
  .hero p,.hero-v18 p{font-size:15px;line-height:1.55}

  .top-banners{grid-template-columns:1fr!important}
  .top-banner{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;border-radius:16px}
  .top-banner .btn{min-height:44px;padding:10px 12px;white-space:nowrap}

  .page-shell,.page-shell-v18,.page-shell-v18.has-no-ads,.page-shell-v18.has-one-ad,.page-shell-v18.has-both-ads{display:grid;grid-template-columns:minmax(0,1fr)!important;width:calc(100% - 24px);gap:16px;margin-top:18px}
  .main-content-v18{width:100%;min-width:0}
  .section-heading-v18{align-items:flex-start;margin:18px 0 12px;gap:10px}
  .section-heading-v18 h2{font-size:clamp(22px,6.5vw,29px);line-height:1.16}
  .section-heading-v18 small{flex:0 0 auto;padding-top:4px}


  .site-filter-tabs-v239{gap:7px;margin:0 -12px 7px;padding:3px 12px 10px;scroll-padding-inline:12px}
  .site-filter-tab-v239{min-height:44px;padding:9px 12px;font-size:12px;box-shadow:none}
  .site-filter-description-v239{font-size:12px}

  .compact-search,.compact-search-v18{width:100%;margin-bottom:7px}
  .compact-search-box{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:0;width:100%;min-height:50px;padding:4px 4px 4px 12px!important;border-radius:16px!important}
  .compact-search-icon{font-size:20px}
  .compact-search-input{min-width:0;width:100%;height:42px;padding:8px!important;font-size:16px!important}
  .compact-search-btn{min-height:42px;padding:9px 14px!important;border-radius:12px!important;white-space:nowrap}
  .compact-search-clear{grid-column:1/-1;justify-self:end;margin:2px 4px 3px;padding:5px 8px!important}

  .site-grid-v18,.site-grid-v18.view-cards,.site-grid-v18.view-cards.cols-2,.site-grid-v18.view-cards.cols-3,.site-grid-v18.view-cards.cols-4,.site-grid-v18.view-cards.cols-5{--cms-cols:1;grid-template-columns:minmax(0,1fr)!important;gap:12px}
  .site-card-v18{width:100%;padding:15px;border-radius:19px;box-shadow:0 10px 28px rgba(15,23,42,.07)}
  .site-card-v18:hover{transform:none}
  .site-card-head-v18{gap:11px;align-items:flex-start}
  .logo-wrap-v18{width:58px;height:58px;flex-basis:58px;border-radius:15px}
  .site-card-title-v18{display:flex;gap:7px;align-items:flex-start}
  .site-card-title-v18 h3{font-size:18px;line-height:1.2;overflow-wrap:anywhere}
  .site-card-title-v18>div:first-child{min-width:0}
  .score-v18{margin:0;text-align:right;flex:0 0 auto}
  .score-v18 b{font-size:15px}
  .score-v18 small{font-size:10px}
  .site-summary-v18{min-height:0;margin:12px 0;font-size:14px;line-height:1.5}
  .bonus-box-v18{padding:11px 12px;align-items:flex-start}
  .bonus-box-v18 strong{max-width:58%;font-size:17px;line-height:1.25;overflow-wrap:anywhere}
  .site-meta-v18{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:11px 0}
  .site-meta-v18>div{min-width:0;padding:9px 10px}
  .site-meta-v18 b{white-space:normal;overflow-wrap:anywhere;line-height:1.35}
  .site-actions-v18{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .site-actions-v18 .btn{width:100%;min-height:46px;padding:10px 8px}

  .site-grid-v18.view-list .site-card-v18{display:block!important;padding:0;overflow:hidden}
  .site-grid-v18.view-list .site-list-banner-v21 img{aspect-ratio:2.6/1}
  .site-grid-v18.view-list .site-card-head-v18{padding:14px}
  .site-grid-v18.view-list .site-content-v21{display:grid;padding:12px 14px 14px;gap:9px}
  .site-grid-v18.view-list .site-meta-v18,.site-grid-v18.view-list .site-actions-v18{grid-template-columns:repeat(2,minmax(0,1fr))}
  .site-grid-v18.view-list.density-ultra .site-content-v21{grid-template-columns:1fr;grid-template-areas:'bonus' 'actions'}

  .page-shell-v18 .ad-column{display:flex!important;grid-template-columns:none!important;gap:11px;overflow-x:auto;margin-inline:-12px;padding:0 12px 7px;scroll-snap-type:x proximity;scrollbar-width:none}
  .page-shell-v18 .ad-column::-webkit-scrollbar{display:none}
  .page-shell-v18 .ad-column h3{flex:0 0 100%;align-self:center;margin:0 0 4px}
  .page-shell-v18 .ad-column .ad-card{flex:0 0 min(80vw,320px);scroll-snap-align:start;margin:0;padding:14px}
  .page-shell-v18 .ad-column .ad-card img{max-height:150px}

  .quick-lists-v18,.quick-lists{grid-template-columns:1fr!important;gap:12px}
  .mini-list,.article-card,.article-content,.premium-content-v19,.sticky-card-v19,.pros-cons-v19>div{padding:16px;border-radius:18px}
  .article-content,.prose-v19{font-size:16px;line-height:1.72}
  .article-content h1,.premium-content-v19 h1{font-size:28px}
  .article-content h2,.premium-content-v19 h2{font-size:23px}
  .article-content pre,.premium-content-v19 pre{max-width:100%;overflow:auto}
  .article-content table,.premium-content-v19 table{display:block;max-width:100%;overflow-x:auto;white-space:nowrap}

  .review-hero-inner-v19{grid-template-columns:72px minmax(0,1fr);gap:13px}
  .review-logo-v19{width:72px;height:72px;border-radius:19px}
  .review-hero-copy-v19 h1,.article-hero-v19 h1{font-size:clamp(27px,8vw,38px)}
  .review-hero-copy-v19 p,.article-hero-v19 p{font-size:15px}
  .review-inline-meta-v19{gap:6px}
  .review-inline-meta-v19>*{padding:6px 8px;font-size:11px}
  .pros-cons-v19{grid-template-columns:1fr}

  .footer{padding:25px 0 calc(25px + env(safe-area-inset-bottom));margin-top:28px}
  .footer p{font-size:13px;line-height:1.55}
  .scroll-top-v18{right:14px;bottom:calc(14px + env(safe-area-inset-bottom));width:46px;height:46px;border-radius:15px}
}

@media (max-width: 430px){
  .container,.layout-wide .container,.page-shell,.page-shell-v18{width:calc(100% - 22px)}
  .hero,.hero-v18{padding-top:25px;padding-bottom:23px}
  .hero h1,.hero-v18 h1{font-size:clamp(28px,8.7vw,36px)}
  .top-banner{padding:13px}
  .site-card-v18{padding:14px}
  .logo-wrap-v18{width:54px;height:54px;flex-basis:54px}
  .site-card-title-v18 h3{font-size:17px}
  .site-filter-tab-v239{padding-inline:11px}
  .review-hero-inner-v19{grid-template-columns:64px minmax(0,1fr)}
  .review-logo-v19{width:64px;height:64px}
  .article-content,.prose-v19{font-size:15.5px}
}

@media (max-width: 390px){
  .container,.layout-wide .container,.page-shell,.page-shell-v18{width:calc(100% - 20px)}
  .topbar .nav{min-height:60px}
  .brand{font-size:17px}
  .public-menu-toggle-v2392{width:43px;height:43px}
  .hero h1,.hero-v18 h1{font-size:28px}
  .top-banner{grid-template-columns:1fr}
  .top-banner .btn{width:100%}
  .section-heading-v18{display:block}
  .section-heading-v18 small{display:block;margin-top:5px}
  .site-card-title-v18{display:block}
  .score-v18{text-align:left;margin-top:6px}
  .bonus-box-v18{display:block}
  .bonus-box-v18 strong{display:block;max-width:none;text-align:left;margin-top:4px}
  .site-meta-v18,.site-actions-v18,.site-grid-v18.view-list .site-meta-v18,.site-grid-v18.view-list .site-actions-v18{grid-template-columns:1fr}
  .compact-search-box{grid-template-columns:auto minmax(0,1fr)}
  .compact-search-btn{grid-column:1/-1;width:100%;margin-top:3px}
  .page-shell-v18 .ad-column .ad-card{flex-basis:86vw}
}

/* Admin mobile-first hardening */
@media (max-width: 1000px){
  .admin-sidebar-v12{width:min(86vw,320px);left:min(-86vw,-320px);padding-bottom:calc(22px + env(safe-area-inset-bottom))}
  .sidebar-open-v12 .admin-sidebar-v12{left:0}
  .admin-workspace-v12,.admin-main-v12,.admin-main-v12>*{min-width:0;max-width:100%}
  .admin-toolbar-v12{position:sticky;top:0;z-index:45;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
  .admin-dark-v14 .admin-toolbar-v12{background:rgba(17,24,39,.96)}
}

@media (max-width: 720px){
  .admin-body{padding-bottom:calc(78px + env(safe-area-inset-bottom))}
  .admin-toolbar-v12{height:auto;min-height:64px;padding:8px 12px;gap:9px}
  .sidebar-toggle-v12{width:44px;height:44px;flex:0 0 44px;border-radius:13px}
  .admin-page-heading-v12{min-width:0;flex:1}
  .admin-page-heading-v12 h1{font-size:17px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .admin-toolbar-actions-v12{gap:5px;flex:0 0 auto}
  .admin-toolbar-actions-v12 .ux-favorite-btn,.admin-toolbar-actions-v12 [data-theme-toggle],.admin-toolbar-actions-v12 a.toolbar-btn-v12{display:grid!important;width:42px;height:42px;min-width:42px}
  .admin-user-v12{display:none}
  .admin-main-v12{padding:13px 10px 20px!important}
  .admin-main-v12>.admin-card,.admin-main-v12 .admin-card,.panel-v12{padding:14px;border-radius:16px}
  .admin-footer-v12{display:none}
  .admin-main-v12 h1{font-size:24px}.admin-main-v12 h2{font-size:20px}.admin-main-v12 h3{font-size:17px}

  .form-grid,.form-grid-v12,.check-grid,.permission-grid-v212{grid-template-columns:1fr!important}
  .form-row{margin-bottom:12px}
  .input,textarea,select,.admin-main-v12 input:not([type="checkbox"]):not([type="radio"]),.admin-main-v12 button,.admin-main-v12 .btn{min-height:44px}
  textarea{min-height:130px}
  .form-tabs-v14,.settings-tabs-v16{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-14px;padding:0 14px 10px;position:static;gap:6px}
  .form-tabs-v14::-webkit-scrollbar,.settings-tabs-v16::-webkit-scrollbar{display:none}
  .form-tabs-v14 button,.settings-tabs-v16 a{flex:0 0 auto;white-space:nowrap;min-height:42px}
  .sticky-save-v14{bottom:calc(70px + env(safe-area-inset-bottom));margin:18px -14px -14px;padding:11px 14px;z-index:20;gap:8px;flex-wrap:wrap}
  .sticky-save-v14 .btn{flex:1 1 140px}
  .editor-layout-v16,.site-editor-layout-v15,.settings-shell-v16{grid-template-columns:1fr}
  .editor-side-v16{padding-left:0}
  .live-preview-panel-v15{max-width:none}

  .admin-list-toolbar,.admin-inline-search,.bulk-action-bar,.actions,.admin-search-page{width:100%;align-items:stretch;flex-direction:column}
  .admin-inline-search{display:grid;grid-template-columns:1fr}
  .bulk-action-bar select,.bulk-action-bar .btn,.actions .btn,.actions a.btn,.admin-search-page .btn{width:100%;max-width:none}
  .table-responsive,.table-responsive-v12,.table-wrap{overflow-x:auto;margin-inline:-14px;padding-inline:14px;scrollbar-width:thin}
  .admin-table,.admin-table-v12{min-width:680px}
  .admin-table th,.admin-table td,.admin-table-v12 th,.admin-table-v12 td{white-space:nowrap}
  .admin-table td .actions,.admin-table-v12 td .actions{min-width:130px}

  .metric-grid-v12,.stats,.control-score-grid,.ops-stat-grid,.health-grid{grid-template-columns:1fr!important;gap:10px}
  .dashboard-grid-v12,.dashboard-grid-main-v12,.dashboard-grid-bottom-v12,.dash-grid,.ux-personal-grid,.ux-help-grid,.ux-module-grid{grid-template-columns:1fr!important}
  .metric-card-v12,.stat{min-height:auto}
  .bar-chart,.chart-v12{height:210px;max-width:100%;overflow-x:auto}

  .ux-mobile-nav{left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));height:60px;padding:5px 8px;border-radius:18px}
  .ux-mobile-nav a,.ux-mobile-nav button{min-width:58px;min-height:48px;justify-content:center}
  .ux-command-backdrop,.ux-confirm-backdrop{padding:8px;padding-top:max(8px,env(safe-area-inset-top))}
  .ux-command-dialog{width:100%;max-height:calc(100dvh - 16px);border-radius:16px}
  .ux-command-head{padding:12px}.ux-command-head input{font-size:16px}.ux-command-foot{display:none}
  .ux-command-results{padding:7px}.ux-command-item{padding:9px 7px}
  .ux-confirm-dialog{padding:19px;border-radius:18px}
  .ux-toast-stack{left:10px;right:10px;bottom:calc(80px + env(safe-area-inset-bottom))}
  .ux-toast{width:100%}
  .ux-autosave-status{bottom:calc(80px + env(safe-area-inset-bottom));white-space:nowrap}

  .admin-toast-v14{left:10px;right:10px;bottom:calc(82px + env(safe-area-inset-bottom));text-align:center}
  .admin-card img,.admin-thumb{max-width:100%;height:auto}
}

@media (max-width: 390px){
  .admin-toolbar-actions-v12 [data-theme-toggle],.admin-toolbar-actions-v12 a.toolbar-btn-v12{display:none!important}
  .admin-main-v12{padding-inline:8px!important}
  .admin-main-v12>.admin-card,.admin-main-v12 .admin-card,.panel-v12{padding:12px}
  .admin-table,.admin-table-v12{min-width:620px}
  .ux-mobile-nav{left:5px;right:5px}
}

@media (hover:none) and (pointer:coarse){
  .btn,.site-filter-tab-v239,.public-nav-v2392 a,.admin-nav-link,.admin-nav-group summary{min-height:44px}
  .site-card-v18:hover,.site-filter-tab-v239:hover{transform:none}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
