/* v7.6.9.8: drawing canvas gets all the free room; colours are one swipeable row */
#draw #dpal{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;gap:8px!important;justify-content:flex-start!important;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x;padding:9px 12px calc(9px + env(safe-area-inset-bottom))!important;max-width:100%;box-sizing:border-box}
#draw #dpal::-webkit-scrollbar{display:none}
#draw #dpal .sw{flex:0 0 46px!important;width:46px!important;height:46px!important;min-width:46px;scroll-snap-align:start}
#draw #dpal .sw.on{transform:scale(1.06);box-shadow:0 0 0 3px #fff,0 0 0 6px #2b2240!important;margin:0 4px}
#draw .sq{border-radius:14px}
@media (orientation:portrait){
 body #draw.active{display:flex!important;flex-direction:column!important;height:100dvh}
 body #draw .bar.top,body #draw .bar.tools{display:flex!important;justify-content:center;flex:0 0 auto;padding:4px 6px!important;gap:6px!important;grid-row:auto!important;grid-column:auto!important}
 body #draw .bar.top{justify-content:space-between}
 body #draw .stage{flex:1 1 0!important;min-height:0!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:2px 4px!important;grid-row:auto!important;grid-column:auto!important}
 body #draw .szrow{flex:0 0 auto;display:flex!important;flex-direction:row!important;justify-content:center!important;padding:2px!important;grid-row:auto!important;grid-column:auto!important}
 body #draw #dpal{flex:0 0 auto;grid-row:auto!important;grid-column:auto!important}
}
@media (orientation:landscape){
 body #draw #dpal{flex-direction:column!important;overflow-x:hidden!important;overflow-y:auto!important;touch-action:pan-y;scroll-snap-type:y proximity;max-height:100dvh;align-items:center;padding:10px 10px!important}
 body #draw #dpal .sw{flex:0 0 46px!important}
 body #draw #dpal .sw.on{margin:4px 0}
}