/* v7724.css — LOADED LAST. One horizontal swatch row in Color/Pour/Pottery/Slime on tall screens.
   Not gated on (orientation:portrait) alone: also matches max-aspect-ratio 1/1 so phones with odd
   viewport reports (keyboard, split-screen, PWA chrome) still get the row. */
@media (orientation:portrait),(max-aspect-ratio:1/1){
 html body #color.active{display:flex!important;flex-direction:column!important}
 html body #color .stage{order:1!important;flex:1 1 0!important;height:auto!important;min-height:0!important}
 html body #color .bar.tools{order:2!important;flex:none!important;padding:4px 8px!important;gap:8px!important;background:none!important}
 html body #color .bar.tools .ib{width:52px!important;height:52px!important}
 html body #color #pal,html body #color .pal,
 html body #pour #prpal,html body #pottery #potpal,html body #slime #slpal{
  order:3!important;display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;
  grid-template-columns:none!important;grid-auto-flow:column!important;justify-content:flex-start!important;align-items:center!important;align-content:center!important;
  --sw:52px!important;gap:10px!important;row-gap:0!important;
  overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;touch-action:pan-x!important;scrollbar-width:none;
  width:100%!important;max-width:100%!important;min-width:0!important;height:auto!important;max-height:calc(var(--sw) + 28px + env(safe-area-inset-bottom))!important;
  flex:none!important;box-sizing:border-box!important;padding:10px 18px calc(8px + env(safe-area-inset-bottom))!important}
 html body #color #pal::-webkit-scrollbar,html body #pour #prpal::-webkit-scrollbar,html body #pottery #potpal::-webkit-scrollbar,html body #slime #slpal::-webkit-scrollbar{display:none}
 html body #color #pal .sw,html body #pour #prpal .sw,html body #pottery #potpal .sw,html body #slime #slpal .sw{
  flex:0 0 var(--sw)!important;width:var(--sw)!important;height:var(--sw)!important;min-width:var(--sw)!important;touch-action:pan-x!important}
 html body #pour .prrow{display:flex!important;flex-direction:row!important;align-items:center!important;flex:none!important;min-height:0!important;max-height:none!important;overflow:hidden!important;width:100%!important}
 html body #pour .prrow #prpal{flex:1 1 auto!important;width:auto!important}
 html body #pour .stage,html body #pottery .stage,html body #slime .stage{flex:1 1 0!important;min-height:0!important}
}
