/**
 * Eduplayify Game Mode: Runner (سباق الطريق)
 * أنماط قديمة-آمنة فقط: flex وحدود مستديرة (كلها مدعومة منذ فايرفوكس 28).
 */
.runner-dpad {
    display: flex;
    gap: 10px;
    justify-content: center;
    align-items: center;
    margin-top: 8px;
    direction: ltr;
}
.runner-dbtn {
    min-width: 52px;
    min-height: 40px;
    font-size: 1.1rem;
    padding: 4px 14px;
}
.runner-canvas {
    border-radius: 12px;
    background: #7ec850;
    max-width: 100%;
    height: auto;
    box-shadow: 0 3px 12px rgba(30,36,56,0.12);
    /* عزل التخطيط والرسم عن بقية الصفحة (sandbox تنسيقي):
       يمنع إعادة حساب الصفحة مع كل إطار، والمتصفحات القديمة
       التي لا تعرفه تتجاهله بأمان دون أي أثر. */
    contain: content;
}
.runner-legend {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    margin-top: 8px;
}
/* نصوص الإجابات الطويلة في مفتاح المسارات: تلتف داخل الزر
   بدل أن تمدّد التخطيط خارج الإطار */
.runner-legend .btn {
    max-width: 100%;
    white-space: normal;
    text-align: center;
    line-height: 1.4;
    word-break: break-word;
}