.ejp-tutorials{border:1px solid #cfdeee;padding:14px;background:#f8fbff;direction:rtl;margin:14px 0;max-width:100%;box-sizing:border-box}.ejp-tutorials h2{font-size:21px;color:#2b6499;border-bottom:1px solid #dce5f3;padding-bottom:8px;margin:0 0 8px}.ejp-tutorials p{color:#6b7f93;font-size:13px;line-height:1.8}.ejp-tutorial-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.ejp-tutorial{min-width:0;border:1px solid #dce6f3;padding:12px;background:#fff;text-align:center;border-radius:5px}.ejp-tutorial h3{font-size:16px;color:#356b99;line-height:1.8;margin:0 0 9px}.ejp-tutorial-player{display:block;width:100%;max-width:350px;max-height:620px;aspect-ratio:9/16;margin:0 auto 10px;object-fit:contain;background:#172a3b;border-radius:4px}.ejp-tutorial a{color:#2a6b9c;font-size:13px}.ejp-tutorials [hidden]{display:none!important}@media(max-width:700px){.ejp-tutorial-grid{grid-template-columns:1fr}.ejp-tutorials{padding:10px}.ejp-tutorial{padding:9px}}
/* Keep legacy screen-reader labels clipped, not 10000px offscreen in RTL. */
body:has(.ejp-tutorials) .sr{position:absolute!important;left:0!important;top:0!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
/* The classic question is a rating/content grid: videos span both columns. */
.question-detail>.ejp-tutorials{grid-column:1/-1!important;width:100%!important;min-width:0!important}
.ejp-tutorial-grid,.ejp-tutorial{width:100%;box-sizing:border-box}
