/* Current Devil n Dove responsive convergence layer.
   Additive guardrails shared by public pages, installed/PWA surfaces and admin workspaces. */
html{box-sizing:border-box;-webkit-text-size-adjust:100%;text-size-adjust:100%;width:100%;min-width:0;overflow-x:auto}
*,*::before,*::after{box-sizing:inherit}
body{width:100%;min-width:0;margin-inline:auto;overflow-x:visible}
body,main,.container,.admin-shell,.card,.hero,.grid,.nav,.nav .links{min-width:0}
.container,.admin-shell{width:100%;margin-inline:auto}
body>.container,body>main.container,body>.admin-shell{margin-left:auto;margin-right:auto}
.container>* ,.admin-shell>*{min-width:0;max-width:100%}
.admin-shell .card,.admin-shell .admin-panel{min-width:0;max-width:100%;overflow:visible;overflow-wrap:anywhere}
img,picture,video,svg,canvas,iframe{max-width:100%;height:auto}
input,select,textarea,button{max-width:100%}
.nav,.nav .links{flex-wrap:wrap}
.grid>*{min-width:0;max-width:100%}
.dd-table-scroll,.dd-horizontal-scroll-region,.table-wrap,.admin-table-wrap,[data-table-scroll],.table-scroll,.table-responsive{display:block;max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable}
.dd-table-scroll>table,.dd-horizontal-scroll-region>table{min-width:max-content;max-width:none}
p,li,dd,dt,td,th,pre,code,a{overflow-wrap:anywhere}
pre,code{white-space:pre-wrap;word-break:break-word}

/* Build 93 centered-shell accessibility boundary.
   Never clip the document at the root: if an unknown legacy control still exceeds its
   container, the user can reach it. Known wide data regions scroll locally instead. */
.dd-centered-shell,.container.admin-shell{margin-inline:auto;inset-inline:auto;transform:none;translate:none}
.admin-shell :is(.grid,.card,.admin-panel,section,article,form,fieldset){min-width:0;max-width:100%}
.admin-shell :is(.dd-table-scroll,.dd-horizontal-scroll-region,.table-wrap,.admin-table-wrap,[data-table-scroll],.table-scroll,.table-responsive){overflow-x:auto!important;overflow-y:visible;max-width:100%}

@media(max-width:720px){
  .container,.admin-shell{width:min(100%,100vw);padding-left:12px;padding-right:12px;margin-inline:auto}
  .grid.cols-2,.grid.cols-3,.grid.cols-4,.cols-2,.cols-3,.cols-4{grid-template-columns:minmax(0,1fr)!important}
  .hero,.card,.admin-panel{max-width:100%}
  .nav{align-items:flex-start}
  .nav .links{width:100%}
  .nav .links>a,.nav .links>button{max-width:100%}
  form .grid{grid-template-columns:minmax(0,1fr)!important}
}
@media(max-width:420px){
  .container,.admin-shell{padding-left:10px;padding-right:10px}
  .btn,button,input,select,textarea{font-size:16px}
}
@media(hover:none) and (pointer:coarse){
  button,.btn,a.btn,input[type="button"],input[type="submit"],select{min-height:44px}
  .nav .links a{display:inline-flex;align-items:center;min-height:44px}
}
@media(min-width:1024px){
  .container,.admin-shell{margin-inline:auto}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* Shop tablet convergence: keep search controls readable and product cards useful
   between the phone breakpoint and full desktop layout. */
@media(min-width:721px) and (max-width:1023px){
  body[data-media-managed-page="/shop/"] .grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body[data-media-managed-page="/shop/"] #shopProducts.grid.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* Build 41 — Packaging Studio responsive workspace convergence. */
body[data-admin-page="packaging-studio"] .packaging-studio-page{width:min(100%,1720px);max-width:1720px;margin-inline:auto}
body[data-admin-page="packaging-studio"] .packaging-editor-card,
body[data-admin-page="packaging-studio"] .packaging-studio-main,
body[data-admin-page="packaging-studio"] .packaging-tab-panel{min-width:0;max-width:100%}
body[data-admin-page="packaging-studio"] .packaging-tab-list{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable}
body[data-admin-page="packaging-studio"] .packaging-tab{white-space:nowrap}
body[data-admin-page="packaging-studio"] .packaging-svg-preview{max-width:100%;overflow:auto}
body[data-admin-page="packaging-studio"] .packaging-safe-area-status{display:grid;gap:6px;margin-top:12px;padding:12px 14px;border:1px solid currentColor;border-radius:10px}
body[data-admin-page="packaging-studio"] .packaging-safe-area-status[data-state="safe"]{opacity:.92}
body[data-admin-page="packaging-studio"] .packaging-safe-area-status[data-state="blocked"]{font-weight:600}
body[data-admin-page="packaging-studio"] .packaging-safe-area-status span,
body[data-admin-page="packaging-studio"] .packaging-safe-area-status li{font-weight:400}

@media(max-width:390px){
  body[data-admin-page="packaging-studio"] .packaging-studio-hero,
  body[data-admin-page="packaging-studio"] .packaging-studio-layout,
  body[data-admin-page="packaging-studio"] .packaging-reference-source-grid,
  body[data-admin-page="packaging-studio"] .packaging-system-placeholder-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important}
  body[data-admin-page="packaging-studio"] .packaging-project-sidebar{position:static!important;top:auto!important}
  body[data-admin-page="packaging-studio"] .packaging-project-list{max-height:42vh}
  body[data-admin-page="packaging-studio"] .packaging-hero-actions,
  body[data-admin-page="packaging-studio"] .packaging-project-actions,
  body[data-admin-page="packaging-studio"] .packaging-save-actions,
  body[data-admin-page="packaging-studio"] .packaging-export-actions{display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%}
  body[data-admin-page="packaging-studio"] .packaging-hero-actions>.btn,
  body[data-admin-page="packaging-studio"] .packaging-project-actions>.btn,
  body[data-admin-page="packaging-studio"] .packaging-save-actions>.btn,
  body[data-admin-page="packaging-studio"] .packaging-export-actions>.btn{width:100%;justify-content:center}
  body[data-admin-page="packaging-studio"] .packaging-tab-panel .grid{grid-template-columns:minmax(0,1fr)!important}
  body[data-admin-page="packaging-studio"] .section-heading-row{align-items:flex-start;flex-direction:column}
}

@media(min-width:391px) and (max-width:767px){
  body[data-admin-page="packaging-studio"] .packaging-studio-hero,
  body[data-admin-page="packaging-studio"] .packaging-studio-layout{grid-template-columns:minmax(0,1fr)!important}
  body[data-admin-page="packaging-studio"] .packaging-project-sidebar{position:static!important;top:auto!important}
  body[data-admin-page="packaging-studio"] .packaging-project-list{max-height:44vh}
  body[data-admin-page="packaging-studio"] .packaging-tab-panel .grid{grid-template-columns:minmax(0,1fr)!important}
}

@media(min-width:768px) and (max-width:1023px){
  body[data-admin-page="packaging-studio"] .packaging-studio-hero{grid-template-columns:minmax(0,1.15fr) minmax(240px,.85fr)!important}
  body[data-admin-page="packaging-studio"] .packaging-studio-layout{grid-template-columns:minmax(0,1fr)!important}
  body[data-admin-page="packaging-studio"] .packaging-project-sidebar{position:static!important;top:auto!important}
  body[data-admin-page="packaging-studio"] .packaging-project-list{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,1fr);grid-template-columns:none;max-height:none;overflow-x:auto;overflow-y:hidden;padding-bottom:6px}
  body[data-admin-page="packaging-studio"] .packaging-tab-panel .grid.cols-3,
  body[data-admin-page="packaging-studio"] .packaging-tab-panel .grid.cols-4,
  body[data-admin-page="packaging-studio"] .packaging-tab-panel .grid.cols-5{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(min-width:1024px) and (max-width:1279px){
  body[data-admin-page="packaging-studio"] .packaging-studio-layout{grid-template-columns:minmax(230px,250px) minmax(0,1fr)!important;gap:16px}
  body[data-admin-page="packaging-studio"] .packaging-project-sidebar{position:sticky;top:14px}
  body[data-admin-page="packaging-studio"] .packaging-tab-panel .grid.cols-4,
  body[data-admin-page="packaging-studio"] .packaging-tab-panel .grid.cols-5{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(min-width:1280px) and (max-width:1439px){
  body[data-admin-page="packaging-studio"] .packaging-studio-layout{grid-template-columns:minmax(270px,300px) minmax(0,1fr)!important;gap:20px}
  body[data-admin-page="packaging-studio"] .packaging-project-sidebar{position:sticky;top:14px}
}

@media(min-width:1440px){
  body[data-admin-page="packaging-studio"] .packaging-studio-layout{grid-template-columns:minmax(300px,340px) minmax(0,1fr)!important;gap:24px}
  body[data-admin-page="packaging-studio"] .packaging-project-sidebar{position:sticky;top:14px}
  body[data-admin-page="packaging-studio"] .packaging-project-list{max-height:72vh}
  body[data-admin-page="packaging-studio"] .packaging-editor-card{padding-inline:24px}
}

/* Build 94 — Product Workspace Readability & Responsive Navigation.
   Product workspace buttons use vertical content flow so labels never collapse into
   narrow flex columns beside their descriptions. The grid reflows before readability
   degrades while preserving the existing tab/URL/keyboard authority. */
body[data-admin-page="products"] .product-workspace-tabs{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  align-items:stretch;
  overflow:visible!important;
}
body[data-admin-page="products"] .product-workspace-tab{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:5px!important;
  width:100%!important;
  min-width:0!important;
  min-height:84px!important;
  padding:12px 14px!important;
  text-align:left!important;
  white-space:normal;
}
body[data-admin-page="products"] .product-workspace-tab>strong{
  display:block;
  width:100%;
  min-width:0;
  white-space:nowrap;
  word-break:normal;
  overflow-wrap:normal;
  line-height:1.2;
}
body[data-admin-page="products"] .product-workspace-tab>.small{
  display:block!important;
  width:100%;
  min-width:0;
  margin-top:0!important;
  line-height:1.4;
  text-align:left;
  overflow-wrap:break-word;
  word-break:normal;
}
body[data-admin-page="products"] .product-workspace-tab[aria-selected="true"]{
  outline:2px solid currentColor;
  outline-offset:2px;
}
@media(min-width:721px) and (max-width:1050px){
  body[data-admin-page="products"] .product-workspace-tabs{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:720px){
  body[data-admin-page="products"] .product-workspace-tabs{
    grid-template-columns:minmax(0,1fr)!important;
    overflow:visible!important;
  }
  body[data-admin-page="products"] .product-workspace-tab{
    min-height:0!important;
  }
}