/* w4 89edc9d7 — Arabic-phone-first walkthrough (2026-10-26).
   Phones (<=760 px): the effect/theme galleries sat inside the sideways ribbon row as ordinary flex items, so the row squeezed them —
   «الحركات» shrank to 4 px (none of the 20 entrance effects could be tapped) and «الانتقالات» showed 19 nameless tiles 2 to a row.
   Each gallery now takes the phone's width as a named grid that scrolls down inside itself; the timing controls follow it in the row. */
@media (max-width:760px){
  :root #rpanel.rrow :is(.fxgal,.thgal){flex:0 0 auto;width:calc(100vw - 28px);max-width:none;min-width:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:6px;max-height:138px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;align-content:start;padding:2px 2px 4px;scrollbar-width:thin}
  :root #rpanel.rrow .fxgal .fx{width:auto;height:auto;min-height:58px;padding:5px 3px 4px;gap:3px}
  :root #rpanel.rrow .fxgal .fx small{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:10.5px;line-height:1.2;max-width:100%;white-space:normal;overflow:hidden;overflow-wrap:anywhere;text-align:center}
  :root #rpanel.rrow .fxgal .fx .fxth{transform:scale(.82)}
  :root #rpanel.rrow .thgal .thsw{width:auto;min-width:0}
  :root #rpanel.rrow .thgal .thsw .thp{width:100%;height:36px}
  :root #rpanel.rrow .thgal .thsw small{display:block;font-size:10.5px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}
}

/* w4 89edc9d7 — View › Color / Grayscale / Black and white: the editing view (slide, thumbnails, sorter) only; the slide show is not filtered */
body.cm-gray :is(#stage,#thumbs,#sorter){filter:grayscale(1)}
body.cm-bw :is(#stage,#thumbs,#sorter){filter:grayscale(1) contrast(4)}