/* Phone and tablet layout overrides; desktop styles keep their original design. */
@media(max-width:960px){
  .layout-main>*,.layout-split>*,.side-layout>*,.goods-detail>*,.admin-main,.admin-content,.card,.ox-panel,.eo-panel,.table-wrap{min-width:0}
  .table-wrap,.ox-table,.eo-table{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
}
@media(min-width:641px) and (max-width:1080px){
  :root{--header-h:112px}
  html{scroll-padding-top:120px}
  .site-header{height:auto;background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none}
  .site-header>.wrap,#app:has(.home-store) .site-header>.wrap{height:auto;min-height:112px;flex-wrap:wrap;gap:8px 16px;padding-block:8px}
  .site-header .logo{flex:1 1 auto}.site-header .search-box{display:none}
  .site-header .nav{display:flex;order:5;flex:1 1 calc(100% - 60px);gap:8px}
  .site-header .nav a{min-height:44px;justify-content:center;flex:1}
  .site-header .prefs{order:6}.site-header .hd-cart{margin-left:0}
}
@media(max-width:640px){
  :root{--header-h:112px;--mobile-gutter:16px;--header-pop-top:72px}
  html{scroll-padding-top:120px}body{-webkit-text-size-adjust:100%}
  .wrap,#app:has(.home-store) .wrap{width:100%;padding-inline:var(--mobile-gutter)}
  .page-top{padding-top:20px}.crumb{flex-wrap:wrap;overflow-wrap:anywhere;font-size:12px;gap:6px}
  img,video,canvas,svg{max-width:100%}
  .rich,.hint,.card-head h3,.section-title h2{overflow-wrap:anywhere}
  .btn,.btn-sm,.btn-xs,.pref-btn,.cat-chip,.pager button{min-height:44px}.btn{white-space:normal}
  .input,.select,.textarea,.search-box input,.search-bar input{font-size:16px;min-height:44px}
  .textarea{min-height:100px}.field,.form-grid>*,.grid>*,.grid-2>*,.grid-3>*,.grid-4>*{min-width:0}
  .card-head,.section-title,.toolbar{flex-wrap:wrap;gap:12px}
  .card-head,.card-body,.card-pad{padding:16px}.card-body.flush{padding:0}
  .toolbar .input,.toolbar .select,.toolbar .search-inline{min-width:0;width:100%}
  .pager{flex-wrap:wrap;gap:8px}.pager button{min-width:44px}.empty{padding:40px 16px}

  /* Account controls occupy the first row; navigation stays available below. */
  .site-header{height:auto;background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none}
  /* Moving sticky's top preserves page height and viewport-fixed popovers. */
  .site-header{transition:top .2s cubic-bezier(.22,.61,.36,1)}
  .site-header.is-mobile-collapsed{top:calc(-1 * var(--mobile-header-row-height,60px))}
  .site-header>.wrap,#app:has(.home-store) .site-header>.wrap{height:auto;min-height:112px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-block:8px}
  .site-header .logo{flex:1 1 34px;min-width:34px}.site-header .logo .txt{font-size:16px;white-space:nowrap}
  .site-header .hd-cart{position:relative;flex:none;margin-left:0;width:44px;padding:0}
  .site-header .hd-cart>.badge{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;margin:0;padding:0 4px;font-size:10px;border-radius:10px}
  .site-header .hd-language{flex:none;border-radius:14px}.site-header .hd-region-trigger{min-height:44px;min-width:44px;padding:0 9px;gap:4px;font-size:12px}
  .site-header .hd-lang-full{display:none}.site-header .hd-lang-short{display:inline}
  .site-header .logo .txt,#app:has(.home-store) .site-header .logo .txt{display:none}
  .hd-search-close{width:44px;height:44px}.hd-search-panel{left:16px;right:16px;width:auto;padding:12px 14px 14px}.hd-search-heading{margin-bottom:6px}
  .site-header .header-actions{flex:none;margin:0;gap:6px}.site-header .header-actions>.btn{padding-inline:10px;font-size:13px}
  .site-header .prefs{order:6;flex:0 0 44px;justify-content:flex-end}.site-header .pref-btn{width:44px;height:44px}
  .site-header .nav,#app:has(.home-store) .site-header .nav{display:flex;order:5;flex:1 1 calc(100% - 52px);gap:2px;min-width:0;align-items:stretch}
  .site-header .nav a,#app:has(.home-store) .site-header .nav a{flex:1;min-width:0;min-height:44px;padding:6px 4px;line-height:1.3;white-space:normal;justify-content:center;text-align:center;font-size:13px}
  .site-header .search-box{display:none}.site-header .um-trigger-copy,.site-header .um-caret{display:none}
  .site-header .um-btn{width:44px;min-height:44px;padding:4px;justify-content:center}
  .um-pop{position:fixed;inset:var(--header-pop-top,72px) 12px auto;width:auto;max-height:calc(100dvh - var(--header-pop-top,72px) - 12px);overflow-y:auto;padding:16px}
  .um-head{gap:12px}.um-balrow{width:100%}.um-quick{gap:8px}.um-quick a,.um-segbtn,.um-out{min-height:44px}
  .um-close{width:44px;height:44px}.um-balrow .um-topup{min-height:44px}
  .notice-bar .wrap{gap:10px;padding-block:8px}.notice-label{padding-right:10px;font-size:11px}
  .notice-copy{font-size:11px;line-height:1.65;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.notice-link{min-height:44px;font-size:11px;gap:4px}

  /* Two-column catalogues with reserved text height and readable pricing. */
  .hs-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .hs-product-body{padding:12px}.hs-product h3{font-size:14px;line-height:1.55;min-height:44px;overflow-wrap:anywhere}
  .hs-product-body>p{min-height:34px;font-size:12px;line-height:1.5}.hs-price{font-size:22px}
  .hs-product-link{min-height:36px;font-size:11px}.hs-product-bottom{flex-wrap:wrap;gap:4px 8px}
  .hs-section-heading{align-items:flex-start;gap:12px}.hs-section-heading h2{font-size:23px}
  .hs-categories{gap:8px}.hs-categories button{min-height:44px;padding:10px 14px}
  .hs-service-strip{gap:10px 18px;font-size:12px}.hs-support-row{padding-block:24px;gap:20px}
  .goods-card .thumb{min-height:0}.goods-card .info{padding:12px}.goods-card .name{font-size:14px;overflow-wrap:anywhere}
  .goods-card .foot{flex-wrap:wrap;gap:6px}
  .site-footer .cols{grid-template-columns:1fr 1fr;gap:24px 16px;padding-block:28px}
  .site-footer .cols>div:first-child,.site-footer .cols>div:last-child{grid-column:1/-1}
  .site-footer .cols a{display:inline-flex;min-height:40px;align-items:center}
  .site-footer .pay-strip-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.site-footer .pay-item{min-height:52px}
  .site-footer .pay-note,.site-footer .copy{line-height:1.8;overflow-wrap:anywhere}

  /* Purchase controls and overlays reserve safe-area space. */
  #app:has(.pogo-store) #main{padding-bottom:118px}
  .pogo-store .pogo-hero{padding:24px 20px;gap:16px;margin-bottom:20px}
  .pogo-store .pogo-hero h1{font-size:24px;line-height:1.4}.pogo-store .pogo-hero-copy p{font-size:12px;line-height:1.7}
  .pogo-store .pogo-hero-art{flex:0 0 64px;width:64px;height:64px;aspect-ratio:1;border-radius:15px}
  .pogo-store .pogo-hero-tags .badge{font-size:10px}.pogo-store .pogo-svc{grid-template-columns:1fr;gap:12px}
  .pogo-store .pogo-rail,.pogo-store .pogo-main>.pogo-wiz{padding:16px}
  .pogo-store .pw-panel-hd{flex-wrap:wrap;gap:10px}.pogo-store .pw-step{min-height:76px;padding:10px 4px}
  .pogo-store .pw-step .t{font-size:12px}.pogo-store .sp-tabs{gap:8px}
  .pogo-store .sp-tab{flex:1;min-width:0;min-height:52px;font-size:11px}
  .pogo-store .sp-tab .pogo-category-art{width:22px;height:22px;flex-basis:22px}
  .pogo-store .sp-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.pogo-store .sp-card{min-width:0}
  .pogo-store .pw-bottom,.pw-rv-foot{flex-wrap:wrap;gap:12px}
  .pogo-store .pw-login-grid,.pw-rv-grid,.rf-grid,.pogo-store .pw-review-grid{grid-template-columns:1fr}
  .pogo-store .pw-review-section{padding:18px 16px}.pogo-store .pw-account-list,.pogo-store .pw-purchase-list{font-size:13px}
  .pogo-store .pogo-dock{flex-wrap:wrap;gap:8px;padding:10px 16px calc(10px + env(safe-area-inset-bottom))}
  .pogo-dock-m{order:0;flex:1 1 auto;text-align:right}.pogo-dock-r{order:0;display:flex;flex:1 1 100%;gap:8px}
  .pogo-dock-r .btn{flex:1;min-width:0;font-size:13px;min-height:46px}
  .goods-detail .goods-buy,.cart-actions,.cart-foot{flex-wrap:wrap;gap:12px}.goods-detail .goods-buy .btn{flex:1;min-width:0}
  .cart-row>*,.cart-main,.cart-actions{min-width:0}.checkout-grid,.checkout-layout{grid-template-columns:1fr}

  .auth-wrap,.auth-page{padding:24px 16px}.auth-card{max-width:100%;padding:24px 20px}
  .side-layout{gap:16px}.side-layout>.side-menu .grp{flex-wrap:nowrap;max-width:100%}
  .order-card .card-head{align-items:flex-start}.order-actions .btn{flex:1 1 auto;padding-inline:12px}
  .wallet-amt{overflow-wrap:anywhere}.wallet-sums{gap:16px}
  .ox-form-grid,.ox-case-grid,.ox-coupon-grid{grid-template-columns:1fr}
  .ox-favorite{gap:12px;flex-wrap:wrap}.ox-favorite>div:nth-child(2){min-width:0}
  .ox-inline-form{flex-wrap:wrap}.ox-inline-form .input{flex:1 1 100%}.ox-inline-form .btn{width:100%}
  .overlay{padding:12px;align-items:center}
  .modal,.modal.od-dialog,.modal.admin-create-modal,.modal.eo-dialog{width:100%;max-width:100%;max-height:calc(100dvh - 24px);border-radius:16px}
  .modal-head,.modal-foot,.ops-admin .modal-head,.ops-admin .modal-foot{padding:14px 16px;gap:10px}
  .modal-head .x{min-width:44px;min-height:44px;flex:none}.modal-body{padding:16px}
  .modal-foot{flex-wrap:wrap;padding-bottom:calc(14px + env(safe-area-inset-bottom))}.modal-foot .btn{min-height:44px;flex:1}
  .fx-dialog{position:fixed;inset:auto 0 0;margin:0;width:100%;max-width:100%;max-height:90dvh;border-width:1px 0 0;border-radius:22px 22px 0 0}
  .fx-dialog[open]{animation-name:regional-sheet-enter}.fx-dialog form{height:680px;max-height:90dvh;padding:0}
  .fx-head{padding:22px 20px 12px}.fx-head h2{font-size:21px}.fx-head p{font-size:12px}
  .regional-tabs{margin:0 20px;gap:26px}.regional-panel{padding:18px 20px 16px}
  .regional-languages{gap:8px}.regional-language{padding:14px 12px;min-height:56px}
  .fx-options{grid-template-columns:repeat(2,minmax(0,1fr))}.fx-option{padding:9px 8px;gap:8px}.fx-search input{font-size:16px}
  .fx-actions{padding:14px 20px calc(14px + env(safe-area-inset-bottom));gap:8px}.fx-actions .btn{padding-inline:20px}
  .fx-summary{font-size:11px}
  .growth-preferences{bottom:calc(16px + env(safe-area-inset-bottom));left:12px;width:calc(100% - 24px);max-width:none;padding:18px}
  .growth-pref-actions{flex-wrap:wrap}.growth-pref-actions button{flex:1;min-height:44px}
  .growth-privacy-button{position:static;display:block;min-height:44px;margin:12px 16px 20px}
  .support-fab.sf-widget{right:16px;bottom:calc(18px + env(safe-area-inset-bottom))}
  body:has(.pogo-dock) .support-fab.sf-widget{bottom:calc(138px + env(safe-area-inset-bottom))}
  .sf-toggle{width:48px;min-width:48px;min-height:48px;padding:0}.sf-toggle .sf-txt{display:none}
  .sf-choices,.sf-contact{max-width:calc(100vw - 32px)}
  .lc-widget{width:100%;height:100dvh;max-height:100dvh;right:0;bottom:0}.lc-header{padding:12px 16px}
  .lc-transcript{padding:16px}.lc-composer textarea{font-size:16px}.lc-bubble{max-width:92%}

  /* Wide tables scroll inside panels; navigation remains a drawer. */
  .ops-admin .admin-content{padding:16px 12px}.ops-admin .admin-top{padding:8px 12px}
  .ops-admin .admin-top h2{font-size:15px}.ops-admin .admin-top .t-sm{display:none}
  .ops-admin .btn,.ops-admin .input,.ops-admin .select{min-height:44px}
  .ops-admin .input,.ops-admin .select,.ops-admin .textarea{font-size:16px}
  .ops-admin .card-head,.ops-admin .card-body{padding:16px}.ops-admin .admin-user{gap:4px;flex:none}
  .ops-admin .kpi{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .ops-dashboard-grid,.ops-dashboard-bottom{grid-template-columns:1fr}
  .ops-admin .table-wrap,.ops-admin .ox-table,.ops-admin .eo-table{width:100%;min-width:0}
  .ops-admin .tbl th,.ops-admin .tbl td{padding:12px}
  .ops-admin .admu-pop,.ops-admin .adm-bell-pop{position:fixed;top:64px;right:12px;width:min(340px,calc(100vw - 24px));max-height:calc(100dvh - 88px);overflow-y:auto}
  .admin-create-layout{grid-template-columns:1fr}.admin-account-fields,.admin-permission-editor{padding:20px 16px;border:0}
  .admin-account-fields .input{font-size:16px;min-height:44px}
  .admin-permission-editor{border-top:1px solid var(--line)}.admin-account-note{margin-top:16px}.admin-permission-groups{grid-template-columns:1fr}
  .od-layout{grid-template-columns:1fr}.od-overview,.od-main,.od-side{padding:18px 16px}
  .od-account-field{grid-template-columns:1fr}.od-account-field dd{padding-left:0}.od-account-title,.od-field-actions{flex-wrap:wrap}
  .od-field-actions .btn,.od-note>.btn,#od-exception-actions .btn{min-height:44px}
  .eo-heading,.eo-panel-head,.eo-search,.eo-pager,.ox-heading{flex-wrap:wrap;gap:10px}
  .eo-heading h1,.ox-heading h1{font-size:22px}.eo-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .eo-toolbar .field{flex:1 1 100%;max-width:none;min-width:0}.eo-actions{flex-wrap:wrap}
  .eo-audit-dl,.eo-audit-dl .eo-audit-dl{grid-template-columns:1fr;gap:4px}.eo-audit-dl dd{margin-bottom:12px}
  #livechat-console .lc-workspace{height:calc(100dvh - 138px);min-height:0}
  #livechat-console .lc-thread-head{flex-wrap:wrap;padding:10px 12px}
  #livechat-console .lc-thread-head>div{min-width:0}.lc-thread-head>div:last-child{display:flex;gap:6px}
  #livechat-console .lc-thread-head .btn{font-size:12px;min-height:44px}
  #livechat-console .lc-compose-mode{flex-wrap:wrap}#livechat-console .lc-compact-replies{width:140px;max-width:55%;font-size:14px}
  #livechat-console .lc-desk textarea{font-size:16px;min-height:54px;height:54px}
  #livechat-console .lc-context{width:100%;padding:18px 16px}#livechat-console .lc-profile-copy{width:44px;height:44px}
  #livechat-console .lc-profile-row{align-items:center}#livechat-console .lc-context-tabs>button{min-height:44px}
}
@media(max-width:640px) and (prefers-reduced-motion:reduce){
  .site-header{transition:none}
}
@media(max-width:480px){
  .site-header>.wrap,#app:has(.home-store) .site-header>.wrap{column-gap:4px}
  .site-header .logo{flex:1 1 44px;min-width:44px}
  .site-header .hd-language{width:88px}
  .site-header .hd-region-trigger{width:44px;flex:0 0 44px;padding-inline:0;gap:3px;font-size:11px}
  .site-header .header-actions{gap:4px}
  .site-header .header-actions>.btn{min-width:44px;padding-inline:8px;font-size:12px}
  .site-header .logo .txt,#app:has(.home-store) .site-header .logo .txt{display:none}
  .hs-products{gap:10px}
  .hs-product-body{padding:12px 10px}.hs-price{font-size:20px}.hs-price-row{flex-wrap:wrap;gap:4px}
  .pogo-store .pogo-hero{padding:20px 16px;gap:12px}.pogo-store .pogo-hero h1{font-size:22px}
  .pogo-store .pogo-hero-art{flex-basis:56px;width:56px;height:56px;border-radius:13px}
  .pogo-store .pogo-eyebrow{font-size:9px;letter-spacing:.5px}.pogo-store .sp-tab{flex-direction:column;gap:4px;padding:8px 4px}
  .pogo-store .sp-tab .cnt{font-size:10px}.um-name{font-size:16px}.od-summary-grid{grid-template-columns:1fr}
  .ops-metric{padding:0 10px}.ops-metric-value{font-size:23px}
}
@media(max-width:360px){
  :root{--mobile-gutter:12px}.site-header>.wrap,#app:has(.home-store) .site-header>.wrap{gap:8px 4px}
  .site-header .header-actions>.btn{padding-inline:8px}
  .site-header .hd-lang-full{display:none}.site-header .hd-lang-short{display:inline}
  .site-header .nav{flex-basis:calc(100% - 50px)}.site-header .nav a,#app:has(.home-store) .site-header .nav a{font-size:12px;padding-inline:4px}
  .hs-products,.grid:has(>.goods-card){gap:8px}.pogo-store .pogo-hero-art{flex-basis:48px;width:48px;height:48px}
}
@media(max-width:960px) and (max-height:500px){
  .overlay{padding:8px}.modal{max-height:calc(100dvh - 16px)}.modal-head,.modal-foot{padding-block:8px}
  .lc-header{padding-block:8px}.lc-widget .lc-composer textarea{min-height:44px}
}
