/* مدار: استعادة الثيم الكحلي والبنفسجي وفق عينة الألوان المعتمدة.
   هذا الملف مسؤول عن الألوان والخامات؛ التخطيط في platform.css. */
:root {

    --md-night: #090936;
    --md-surface: #101b49;
    --md-raised: #283778;
    --md-edge: #7772bd;
    --md-ink: #f2f5ff;
    --md-muted: #c1cce7;
    --md-cyan: #9feaf5;
    --md-violet: #7772bd;
    --md-gold: #ffcf35;
}
body.md-cosmos {
    --ww-bg: var(--md-night); --ww-bg2: var(--md-surface);
    --ww-panel: var(--md-surface); --ww-border: var(--md-edge);
    --ww-text: var(--md-ink); --ww-muted: var(--md-muted);
    --ww-cyan: var(--md-cyan); --ww-violet: #bb9cff;
    --ww-gold: var(--md-gold); --ww-green: #7fe3bd; --ww-pink: #ffa4c9;
    color-scheme: dark; color: var(--md-ink);
    background: radial-gradient(ellipse at 0% 55%, #85598855, transparent 65%), radial-gradient(ellipse at 85% 0%, #28377877, transparent 60%), #090936;
    background-attachment: fixed;
}
body.md-cosmos .ww-nav { background: #090936f2; border-color: var(--md-edge); }
body.md-cosmos .navbar-brand { background: none; color: var(--md-ink); }
body.md-cosmos .ww-nav .btn { color: var(--md-ink); border-color: var(--md-edge); }
body.md-cosmos .md-section-nav { border-color: #7772bd70; }
body.md-cosmos :is(.md-section-nav a, .md-local-nav a, .md-hub-back, .md-review-link) { color: var(--md-cyan); }
body.md-cosmos :is(.md-section-nav a:hover, .md-local-nav a:hover) { background: var(--md-raised); color: #fff; }
body.md-cosmos :is(.md-page-head h1, .md-game-intro h1, .md-catalog-heading h2, .md-section-title, .ww-class-code) { color: var(--md-ink); }
body.md-cosmos :is(.md-page-head p, .md-game-intro p, .md-catalog-heading p) { color: var(--md-muted); }
body.md-cosmos .text-secondary { color: var(--md-muted) !important; }
body.md-cosmos :is(.ww-panel, .md-game) { background: var(--md-surface); border-color: var(--md-edge); box-shadow: 0 8px 24px #03082033; }
body.md-cosmos :is(.md-launch, .md-hangar) {
    background: linear-gradient(125deg, #101b49, #283778 60%, #483475);
    border: 1px solid #8865c7; box-shadow: 0 16px 48px #0003;
}
body.md-cosmos .md-game-intro { padding: 2rem; margin-block: 1rem 1.5rem; border-radius: 24px; border: 1px solid var(--md-edge); background: linear-gradient(120deg, #101b49, #292459); }
body.md-cosmos .md-game-guide { background: #483475e8; border-color: var(--md-cyan); }
body.md-cosmos .md-game-guide p { color: var(--md-muted); }
body.md-cosmos .md-launch-button { background: linear-gradient(90deg, #246caa, #7772bd); color: #fff; box-shadow: none; }
body.md-cosmos .md-launch-button:hover { background: linear-gradient(90deg, #317ebc, #855988); color: #fff; }
body.md-cosmos .md-sun { background: #ffcf35; color: #182247; }
body.md-cosmos .md-game-art { background: linear-gradient(135deg, #283778, #483475); }
body.md-cosmos .md-family:nth-of-type(2) .md-game-art { background-image: linear-gradient(135deg, #483475, #7772bd); }
body.md-cosmos .md-game-art svg { opacity: .95; }
body.md-cosmos .md-game-play { background: #2c3d72; color: var(--md-cyan); }
body.md-cosmos .md-game:hover { border-color: var(--md-cyan); box-shadow: 0 4px 0 #3c7191; }
body.md-cosmos :is(.md-game-tracks i, .md-filters button) { background: var(--md-raised); color: var(--md-ink); border-color: var(--md-edge); }
body.md-cosmos .md-filters button[aria-pressed="true"] { background: #7772bd; color: #fff; border-color: #bfa5ff; }
body.md-cosmos .ww-btn { background: var(--md-raised); color: var(--md-ink); border-color: var(--md-edge); box-shadow: none; }
body.md-cosmos .ww-btn-primary { background: linear-gradient(90deg, #246caa, #7772bd); color: #fff; border-color: #9b82c0; }
body.md-cosmos .ww-btn-primary:hover { background: linear-gradient(90deg, #317ebc, #855988); color: #fff; }
body.md-cosmos .ww-btn:not(.ww-btn-primary):hover { background: #304b7c; color: #fff; }
body.md-cosmos :is(.ww-input-dark, .ww-look select) { background-color: #101442 !important; color: var(--md-ink) !important; border-color: #6177a5 !important; color-scheme: dark; }
body.md-cosmos :is(select option, .ww-pf-select option) { background: #101b49; color: var(--md-ink); }
body.md-cosmos :is(input, textarea)::placeholder { color: #b4c1df; opacity: 1; }
body.md-cosmos .ww-choice .btn-check + .btn { background: #283778; color: var(--md-ink); border-color: var(--md-edge); }
body.md-cosmos .ww-choice .btn-check:checked + .btn, body.md-cosmos .ww-choice .btn.active { background: #7772bd; color: #fff; border-color: #c3aaff; }
body.md-cosmos .ww-opbtns button { background: var(--md-raised); color: var(--md-ink); }
body.md-cosmos .ww-opbtns button.on { background: #7772bd; color: #fff; }
body.md-cosmos .form-check-input { background-color: #263d68; border-color: #829ac5; }
body.md-cosmos .form-check-input:checked { background-color: #7772bd; border-color: #d2bfff; }
body.md-cosmos .md-hub-options { border-color: var(--md-edge); }
body.md-cosmos .ww-pf-level { background: #2c4275; color: var(--md-cyan); }
body.md-cosmos :is(.ww-pf-bar, .md-pg-bar) { background: #17505c; box-shadow: inset 0 2px 3px #0005; }
body.md-cosmos .ww-pf-goal .bg { stroke: #344872; }
body.md-cosmos .ww-pf-bar i { background: linear-gradient(180deg, #ffffff55, transparent 55%), linear-gradient(#c6ee55, #6ea91d); box-shadow: inset 0 -2px 0 #3e6a0e55; border-radius: inherit; }
body.md-cosmos .ww-pf-select { background: #101b49; color: var(--md-ink); color-scheme: dark; }
body.md-cosmos :is(.ww-mode, .ww-tile, .ww-chapter, .md-pg, .ww-chart, .ww-day, .ww-shop-item, .ww-badge, .ww-font-sample, .ww-banks li) { background: #20245e; border-color: var(--md-edge); }
body.md-cosmos :is(.ww-tile small, .ww-chapter small) { color: var(--md-cyan); }
body.md-cosmos .ww-shop-item.on { border-color: var(--md-cyan); box-shadow: inset 0 3px 0 var(--md-cyan); }
body.md-cosmos .ww-shop-ship { background: #090936; }
body.md-cosmos .ww-day.today { background: #2e3164; border-color: #bb9cff; }
body.md-cosmos .ww-table { --bs-table-color: var(--md-ink); --bs-table-bg: transparent; --bs-table-border-color: var(--md-edge); --bs-table-striped-bg: #283778; }
body.md-cosmos .ww-table thead, body.md-cosmos .ww-table tbody tr:hover { background: #283778; }
body.md-cosmos .ww-board-head { background: var(--md-surface); border-top-color: var(--md-cyan); }
body.md-cosmos :is(.ww-board-join, .md-review-empty) { background: #283778; color: var(--md-ink); }
body.md-cosmos #rv-summary > div { border-color: var(--md-cyan); }
body.md-cosmos #rv-summary .ww-num { color: var(--md-cyan); }
body.md-cosmos #rv-banner a { color: var(--md-ink); }
body.md-cosmos .md-student-entry { border-top-color: var(--md-cyan); }
body.md-cosmos .md-teacher-entry { border-top-color: #bb9cff; }
body.md-cosmos .md-teacher-entry h6 { border-color: var(--md-edge); }
body.md-cosmos .ww-custom textarea { background: #101442; color: var(--md-ink); border-color: #6177a5; }
body.md-cosmos :is(a, button, input, select, textarea, summary):focus-visible { outline-color: var(--md-gold); }
body.md-cosmos .btn-check:focus-visible + .btn { outline-color: var(--md-gold); }
/* ساحة اللعب تبقى خالية من الصور المزدحمة خلف الكلمات والقطع. */
body.md-cosmos .ww-root, body.md-cosmos .wl-root, body.md-cosmos .mm-root { background: #090936; border-color: var(--md-edge); }
body.md-cosmos :is(.ww-hud, .wl-hud, .ww-card-panel) { background: #101b49; }
body.md-cosmos .ww-howto li { background: #283778; }
body.md-cosmos .ww-btn-icon { background: #283778; color: var(--md-ink); }
body.md-cosmos .mm-back { background: linear-gradient(145deg, #283778, #483475); border-color: #9bb8ed; }
body.md-cosmos .mm-front { background: #edf4ff; color: #17274d; }
@media (max-width: 700px) {
    body.md-cosmos { background-attachment: scroll; }
    body.md-cosmos .md-game-intro { padding: 1rem .5rem; }
}
/* هوية مدرسية: أيقونات محلية وأزرار ملموسة تستجيب للضغط */
.md-ui-icon { display: inline-block; width: 1.8rem; height: 1.8rem; flex: 0 0 auto; vertical-align: middle; background: center / contain no-repeat; filter: drop-shadow(0 2px 1px #0003); }
.md-icon-book { background-image: url('../icons/school/book.svg'); }
.md-icon-backpack { background-image: url('../icons/school/backpack.svg'); }
.md-icon-school { background-image: url('../icons/school/school.svg'); }
.md-icon-star { background-image: url('../icons/school/star.svg'); }
.md-icon-coin { background-image: url('../icons/school/coin.svg'); }
.md-icon-cup { background-image: url('../icons/school/cup.svg'); }
.md-icon-podium { background-image: url('../icons/school/podium.png'); }
.md-icon-gem { background-image: url('../icons/school/gem.svg'); }
body.md-cosmos .ww-nav > .container-xl { gap: .7rem; }
body.md-cosmos .ww-nav .md-section-nav { margin-inline: auto; border: 0; padding: 0; gap: .25rem; }
body.md-cosmos .ww-nav .md-section-nav a { display: inline-flex; gap: .4rem; color: #e8edff; padding: .5rem .65rem; font-weight: 700; border-radius: 14px; }
body.md-cosmos .ww-nav .md-section-nav a:hover { background: #283778; }
body.md-cosmos :is(.ww-btn, .ww-btn-icon, .btn, .md-launch-button, .md-game-play, .md-filters button, .ww-opbtns button, .ww-level-btn) {
    --button-top: #46cfc0; --button-bottom: #1c8a95; --button-base: #0c4d5a;
    background: linear-gradient(180deg, #ffffff42 0%, transparent 46%), linear-gradient(var(--button-top), var(--button-bottom));
    color: #fff; border: 1px solid #ffffff80; border-radius: 16px;
    box-shadow: inset 0 2px 0 #ffffff8c, inset 0 -2px 0 #0002, 0 5px 0 var(--button-base), 0 7px 9px #0004;
    text-shadow: 0 2px 1px #00343e99; font-weight: 800;
    transition: translate .12s ease, box-shadow .12s ease, filter .12s ease;
    min-height: 44px; margin-bottom: 5px; text-decoration: none;
}
body.md-cosmos :is(.ww-btn-primary, .md-launch-button, .md-game-play):not(:disabled) {
    --button-top: #ffae4a; --button-bottom: #ee5a1a; --button-base: #97300e;
    background: linear-gradient(180deg, #ffffff42, transparent 46%), linear-gradient(var(--button-top), var(--button-bottom));
    color: #fff; border-color: #ffe3c2; text-shadow: 0 2px 1px #7a2208;
}
/* زر «العب» على بطاقات الألعاب: أخضر ليموني كشريط التقدّم في الصورة */
body.md-cosmos .md-game-play:not(:disabled) { --button-top: #c4ee57; --button-bottom: #6ea91d; --button-base: #3e6a0e; border-color: #f3ffd0; text-shadow: 0 2px 1px #2a4a08; }
body.md-cosmos :is(.ww-btn, .ww-btn-icon, .btn, .md-launch-button, .md-game-play, .md-filters button, .ww-opbtns button, .ww-level-btn):hover:not(:disabled):not(.disabled):not([aria-disabled="true"]) {
    background: linear-gradient(180deg, #ffffff55, transparent 46%), linear-gradient(var(--button-top), var(--button-bottom));
    color: #fff; transform: none; filter: brightness(1.06);
}
body.md-cosmos :is(.ww-btn, .ww-btn-icon, .btn, .md-launch-button, .md-filters button, .ww-opbtns button, .ww-level-btn):active:not(:disabled):not(.disabled):not([aria-disabled="true"]) {
    translate: 0 4px; box-shadow: inset 0 2px 0 #ffffff70, inset 0 -2px 0 #0002, 0 1px 0 var(--button-base); filter: none;
}
body.md-cosmos .ww-choice .btn-check + .btn { background: linear-gradient(#2f8c9d, #1b5d73); color: #fff; border: 1px solid #8fd6df; box-shadow: inset 0 2px 0 #ffffff40, 0 4px 0 #0c3445; border-radius: 12px !important; }
body.md-cosmos .ww-choice .btn-check:checked + .btn, body.md-cosmos .ww-choice .btn.active,
body.md-cosmos .md-filters button[aria-pressed="true"], body.md-cosmos .ww-opbtns button.on {
    --button-top: #ffae4a; --button-bottom: #ee5a1a; --button-base: #97300e;
    background: linear-gradient(#ffae4a, #ee5a1a); border-color: #ffe3c2; color: #fff; text-shadow: 0 2px 1px #7a2208;
    box-shadow: inset 0 2px 0 #ffffff66, 0 2px 0 #97300e; translate: 0 2px;
}
body.md-cosmos :is(button:disabled, .ww-btn.disabled, .ww-btn[aria-disabled="true"], .ww-level-btn.locked) { filter: grayscale(.6); opacity: .55; box-shadow: none; translate: none; cursor: default; }
body.md-cosmos .wl-tile:not(.used):not(.bad):not(.hinted) { box-shadow: inset 0 3px 0 #ffffff80, 0 5px 0 #34225f, 0 8px 12px #0004; border: 2px solid #c4b6ff; }
body.md-cosmos .wl-tile:active:not(.used) { translate: 0 3px; }
body.md-cosmos .ww-day { border: 2px solid #7c8dbd; box-shadow: inset 0 2px 0 #ffffff33, 0 4px 0 #10143c; }
body.md-cosmos .ww-day:active:not(:disabled) { translate: 0 3px; }
body.md-cosmos .ww-card-panel { border: 3px solid #838ad0; box-shadow: inset 0 3px 0 #c3c9ff55, 0 8px 0 #0b103b, 0 18px 45px #0006; }
body.md-cosmos .ww-card-panel h2 { text-shadow: 0 3px 0 #080d35; }
body.md-cosmos .ww-final-score { color: #ffdb68; text-shadow: 0 3px 0 #6d4017; }
body.md-cosmos .ww-gs { border: 2px solid #8c72bd; border-radius: 18px; box-shadow: inset 0 2px 0 #ffffff30; }
body.md-cosmos .md-pg-icon, body.md-cosmos .md-game-icon, body.md-cosmos .md-guide-icon { padding: .4rem; border-radius: 22%; background: linear-gradient(#ffffff30, #ffffff08); box-shadow: inset 0 2px 0 #ffffff55, 0 4px 0 #13174466; }
body.md-cosmos .md-game-art { background: radial-gradient(ellipse at 20% 0, #7772bd, transparent 65%), #283778; }
body.md-cosmos .md-game[data-game="wordlab"] .md-game-icon,
body.md-cosmos .md-game[data-game="sentlab"] .md-game-icon { font-size: 0; width: 4.8rem; height: 4.8rem; background: url('../icons/school/book.svg') center / contain no-repeat; box-shadow: none; }
body.md-cosmos .ww-pf-level { border: 2px solid #a3c7ff; box-shadow: inset 0 2px 0 #ffffff55, 0 4px 0 #17215c; }
@media (max-width: 1000px) {
    body.md-cosmos .ww-nav .md-section-nav { order: 3; width: 100%; justify-content: space-between; }
    body.md-cosmos .ww-nav .md-section-nav a { flex-direction: column; flex: 1; gap: .2rem; font-size: .76rem; padding: .3rem .15rem; text-align: center; }
    body.md-cosmos .ww-nav .md-section-nav .md-ui-icon { width: 1.65rem; height: 1.65rem; }
    body.md-cosmos :is(#activities, #mission-settings, #game-setup, #your-progress, #your-badges, #your-ships, #your-settings) { scroll-margin-top: 155px; }
}
@media (prefers-reduced-motion: reduce) {
    body.md-cosmos :is(button, .btn, .ww-btn, .md-launch-button, .wl-tile) { transition: none; }
    body.md-cosmos :is(button, .btn, .ww-btn, .md-launch-button, .wl-tile):active { translate: none; }
}

/* نجوم مصقولة وصندوق جائزة واضح ضمن شاشة النتيجة. */
body.md-cosmos { background: radial-gradient(ellipse at 90% 5%, #16657d40, transparent 55%), radial-gradient(ellipse at 5% 65%, #46116b44, transparent 60%), var(--md-night); }
body.md-cosmos .ww-result-stars { display:flex; justify-content:center; align-items:center; gap:clamp(6px, 2vw, 18px); margin: .5rem auto 1.25rem; padding:1rem 0; background:radial-gradient(ellipse, #ffd13526, transparent 68%); }
.ww-result-stars span { display:block; width:clamp(65px, 15vw, 110px); aspect-ratio:1; background:url('../icons/school/star.svg') center/contain no-repeat; filter:grayscale(1); opacity:.25; }
.ww-result-stars span:nth-child(2) { width:clamp(85px, 19vw, 140px); transform:translateY(-8px); }
.ww-result-stars span.earned { filter:drop-shadow(0 6px 0 #ab6600) drop-shadow(0 0 14px #ffcc4577); opacity:1; animation:prize-arrive .45s ease-out both; }
body.md-cosmos .ww-prize { margin:1.25rem 0; padding:1.4rem 1rem; border:2px solid #ffd45a; border-radius:24px; background:radial-gradient(ellipse at 50% 80%, #156a87, #182653 75%); box-shadow:inset 0 2px #fff4, 0 5px #080f32; text-align:center; }
.ww-prize h3 { color:#ffe478; font-size:1.25rem; margin:0 0 .5rem; }
.ww-prize p,.ww-reward-hint { color:#c7ddf0; font-size:.85rem; line-height:1.7; }
body.md-cosmos .ww-btn.ww-prize-open { display:flex; flex-direction:column; align-items:center; gap:1rem; margin:1rem auto .25rem; padding:1rem 2rem; --button-top:#ffc04d; --button-bottom:#f2780c; --button-base:#9a4308; color:#fff; text-shadow:0 2px 1px #7a3206; }
.ww-chest { display:block; position:relative; width:98px; height:70px; border:5px solid #8cc8ff; border-radius:22px 22px 12px 12px; background:linear-gradient(#ffe66a 0 43%, #8a4ed9 44% 52%, #437bdf 53%); box-shadow:inset 0 4px #fff8, 0 7px #243b8e; }
.ww-chest i { position:absolute; width:24px; height:29px; border:3px solid #fff0a3; border-radius:7px; background:#ffbd2d; left:32px; top:29px; box-shadow:0 3px #9a5919; }
.ww-chest i::after { content:''; position:absolute; width:7px; height:13px; background:#725024; border-radius:5px; left:5px; top:4px; }
.ww-prize-medal { width:110px; height:110px; margin:1rem auto; display:grid; place-items:center; font-size:3.3rem; font-weight:900; color:#ffdf58; border:3px solid #fff0aa; border-radius:30px; background:linear-gradient(145deg,#5d73d0,#262364); box-shadow:inset 0 3px #fff5, 0 7px #0a133d, 0 0 25px #56dbf744; animation:prize-arrive .35s ease-out; }
.ww-prize-medal img,.ww-prize-medal svg { max-width:85px; max-height:85px; }
.ww-prize-result b { color:#fff1b1; font-size:1.3rem; }
.ww-prize-open[hidden] { display:none !important; }
.ww-booster-stock { padding:1rem; border:1px solid #7eafe0; border-radius:16px; background:#203868; margin:1rem 0; }
.ww-booster-stock p { margin:.5rem 0; }
@keyframes prize-arrive { from { opacity:0; scale:.8; } to { opacity:1; scale:1; } }
@media(prefers-reduced-motion:reduce) { .ww-result-stars span.earned,.ww-prize-medal { animation:none; } }

/* ======================= شاشات الإنجاز بأسلوب «اكتمل المستوى» =======================
   عنوان ذهبي ضخم، نجوم لامعة بأشعة تدور خلفها، أزرار بيضوية. تشمل شاشة نهاية المعركة والمختبرات والذاكرة (.ww-over)
   وبطاقة الفاصل بين المستويات (.ww-planet-card). ألوان الأزرار من لوحة الصورة المرجعية للواجهة الفضائية. */
/* النجوم: أيقونة ذهبية لامعة بحافة كريمية بدل الحرف ★ */
body.md-cosmos .ww-stars-row i {
    font-size: 0; color: transparent; text-shadow: none; display: inline-block; flex: 0 0 auto;
    width: clamp(60px, 13vmin, 104px); aspect-ratio: 120 / 124; margin: 0 .1rem;
    background: url('../icons/school/star-glow.svg') center / contain no-repeat;
    filter: grayscale(1) brightness(.5); opacity: .4;
}
body.md-cosmos .ww-stars-row i.on { filter: drop-shadow(0 0 14px #ffd54acc); opacity: 1; }
body.md-cosmos .ww-stars-row i:nth-child(2) { width: clamp(76px, 16.5vmin, 130px); translate: 0 -10%; }
.ww-result-stars span { background-image: url('../icons/school/star-glow.svg'); aspect-ratio: 120 / 124; }
.ww-result-stars span:not(.earned) { filter: grayscale(1) brightness(.5); opacity: .4; }
.ww-result-stars span.earned { filter: drop-shadow(0 0 14px #ffd54acc); }
/* الأشعة المتوهجة خلف النجوم */
body.md-cosmos :is(.ww-result-stars, .ww-planet-card .ww-stars-row) { position: relative; isolation: isolate; }
body.md-cosmos :is(.ww-result-stars, .ww-planet-card .ww-stars-row)::before {
    content: ''; position: absolute; z-index: -1; left: 50%; top: 50%; width: min(140%, 500px); aspect-ratio: 1; translate: -50% -50%;
    border-radius: 50%; pointer-events: none;
    background: repeating-conic-gradient(from 0deg, #fff1b04d 0 7deg, transparent 7deg 18deg);
    -webkit-mask: radial-gradient(closest-side, #000 18%, transparent 74%); mask: radial-gradient(closest-side, #000 18%, transparent 74%);
    animation: ww-rays 36s linear infinite;
}
@keyframes ww-rays { to { rotate: 360deg; } }
/* العنوان الذهبي ثلاثي الأبعاد */
body.md-cosmos :is(.ww-over h2, .ww-pc-title) {
    font-family: var(--ww-font-head); font-weight: 900; letter-spacing: 0; color: #ffd02e;
    text-shadow: 0 2px 0 #f5a10b, 0 4px 0 #cf6e08, 0 6px 0 #8f3f08, 0 12px 16px #0008, 0 0 26px #ffb41f55;
}
body.md-cosmos .ww-over h2 { font-size: clamp(1.9rem, 4.2vw, 2.7rem); }
body.md-cosmos .ww-pc-title { font-size: clamp(1.7rem, 5.4vmin, 2.7rem); margin: 0 0 .3rem; order: 1; text-align: center; padding-inline: 1rem; }
/* شاشة النهاية: خلفية زرقاء متوهجة من الأعلى مثل الصورة */
body.md-cosmos .ww-card-panel.ww-over { background: radial-gradient(ellipse 90% 70% at 50% 0%, #3b52d6 0%, #202d94 48%, #101b49 100%); border-color: #a9b6ff; }
/* بطاقة الفاصل بين المستويات: العنوان ثم النجوم ثم الكوكب الصغير ثم النقاط */
body.md-cosmos .ww-planet-card { background: radial-gradient(ellipse 75% 65% at 50% 40%, #3649c8cc, #0b1250ee 78%); backdrop-filter: blur(2px); }
body.md-cosmos .ww-planet-card .ww-stars-row { order: 2; margin: .5rem 0 .6rem; display: flex; align-items: center; justify-content: center; }
body.md-cosmos .ww-planet-card .ww-pc-planet { order: 3; width: clamp(84px, 16vmin, 128px); margin: .3rem 0; }
body.md-cosmos .ww-planet-card .ww-pc-score { order: 4; font-size: clamp(2rem, 7vmin, 3.2rem); color: #fff; text-shadow: 0 3px 0 #1a2275, 0 0 18px #7f9bff88; }
body.md-cosmos .ww-planet-card .ww-pc-best { order: 5; }
/* الأزرار: بيضوية كبيرة، الرئيسي أخضر ليموني (التالي/العب مجدداً) والباقي أزرق مخضرّ */
body.md-cosmos .ww-over .ww-panel-btns { gap: .8rem; }
body.md-cosmos .ww-over .ww-panel-btns .ww-btn { border-radius: 999px; min-width: min(210px, 44%); min-height: 52px; padding: .5rem 1.6rem; font-size: 1.1rem; border-width: 2px; border-color: #e6f7fa; }
body.md-cosmos .ww-over .ww-panel-btns .ww-btn-primary:not(:disabled) { --button-top: #c4ee57; --button-bottom: #6ea91d; --button-base: #3e6a0e; border-color: #f3ffd0; text-shadow: 0 2px 1px #2a4a08; }
body.md-cosmos .ww-over .ww-panel-btns .ww-btn:not(.ww-btn-primary) { border-color: #e6f7fa; }
@media (prefers-reduced-motion: reduce) { body.md-cosmos :is(.ww-result-stars, .ww-planet-card .ww-stars-row)::before { animation: none; } }
/* الأشعة تبقى خلف كل ما يجاورها من نص */
body.md-cosmos :is(.ww-over-result, .ww-planet-card) > :not(.ww-result-stars):not(.ww-stars-row) { position: relative; z-index: 1; }
body.md-cosmos :is(.ww-result-stars, .ww-planet-card .ww-stars-row) { z-index: 0; }
/* ======================= لوحة الأبطال في الشريط العلوي (leaderboard.js) =======================
   زر بأيقونة المنصة بجانب زر اللغة، يفتح لوحة بعرض كامل تحت الشريط بتبويبات سهل / متوسط / صعب */
body.md-cosmos .md-nav-lb { display: inline-flex; align-items: center; gap: .4rem; padding-inline: .7rem; }
body.md-cosmos .md-nav-lb .md-ui-icon { width: 1.6rem; height: 1.6rem; }
body.md-cosmos .btn.md-nav-lb[aria-expanded="true"] { --button-top: #ffae4a; --button-bottom: #ee5a1a; --button-base: #97300e; border-color: #ffe3c2; }
.md-lb { position: fixed; inset-inline: 0; top: 64px; z-index: 1040; max-height: calc(100dvh - 64px); overflow-y: auto; padding-block: .4rem .8rem; pointer-events: none; }
.md-lb[hidden] { display: none; }
.md-lb .ww-panel { pointer-events: auto; border: 2px solid var(--md-edge); box-shadow: 0 22px 50px #000c, inset 0 2px 0 #ffffff22; }
.md-lb-head { display: flex; align-items: center; gap: .6rem .9rem; flex-wrap: wrap; margin-bottom: .7rem; }
.md-lb-head h2 { flex: 1 1 auto; display: flex; align-items: center; gap: .5rem; margin: 0; font-size: 1.35rem; }
.md-lb-head h2 .md-ui-icon { width: 2rem; height: 2rem; }
.md-lb-pick { display: flex; gap: .5rem; flex-wrap: wrap; }
.md-lb-pick select { width: auto; min-width: 9rem; }
.md-lb-pick select[hidden] { display: none; }
.md-lb-tabs { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: .6rem; }
body.md-cosmos .md-lb-tabs .ww-btn { min-width: 6.5rem; border-radius: 999px; margin-bottom: 4px; }
body.md-cosmos .md-lb-tabs .ww-btn[aria-selected="true"] { --button-top: #ffae4a; --button-bottom: #ee5a1a; --button-base: #97300e; border-color: #ffe3c2; text-shadow: 0 2px 1px #7a2208; }
body.md-cosmos .md-lb-close { min-width: 44px; padding-inline: .6rem; }
#lbBody .table-responsive { max-height: 52dvh; overflow: auto; }
#lbBody .ww-table td.text-truncate { max-width: 22rem !important; }
@media (max-width: 575.98px) { .md-lb-pick select { min-width: 0; flex: 1 1 8rem; } }

/* ======================= الشريط العلوي لشاشة اللعب (topbar.js) =======================
   شارة المستوى + شريط نسبة التقدّم (أخضر ليموني)، ثم أقراص العملات والكريستالات بأيقونات بارزة */
.md-topbar { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .3rem .8rem; flex: 0 0 auto;
    background: linear-gradient(180deg, #2f3fb0, #1c2575); border-bottom: 2px solid #5b6ce6; box-shadow: inset 0 2px 0 #ffffff26; }
.md-tb-lvl { display: flex; align-items: center; flex: 1 1 200px; max-width: 360px; min-width: 0; }
.md-tb-shield { position: relative; flex: 0 0 auto; width: 34px; height: 40px; z-index: 1; filter: drop-shadow(0 3px 0 #0b1650); }
.md-tb-shield svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.md-tb-shield b { position: absolute; inset: 0; display: grid; place-items: center; padding-bottom: 5px; font: 900 1.05rem/1 var(--ww-font-en); color: #fff; text-shadow: 0 2px 0 #123a9a; }
.md-tb-bar { position: relative; flex: 1; height: 22px; margin-inline-start: -10px; padding-inline-start: 10px; overflow: hidden;
    background: #121a62; border: 2px solid #0a1050; border-radius: 0 14px 14px 0; box-shadow: inset 0 3px 4px #0007; }
html[dir="rtl"] .md-tb-bar { border-radius: 14px 0 0 14px; }
.md-tb-bar i { position: absolute; inset-block: 0; inset-inline-start: 0; width: 0; transition: width .25s ease;
    background: linear-gradient(180deg, #ffffff66, transparent 55%), linear-gradient(#c6ee55, #6ea91d); box-shadow: inset 0 -2px 0 #3e6a0e66; }
.md-tb-bar span { position: relative; display: block; text-align: center; font: 900 .76rem/18px var(--ww-font-en); color: #fff; text-shadow: 0 1px 2px #000b; direction: ltr; }
.md-tb-pills { display: flex; gap: .7rem; flex: 0 0 auto; }
.md-tb-pill { position: relative; display: inline-flex; align-items: center; min-width: 5.4rem; height: 26px; padding-inline: 1.9rem .7rem; border-radius: 13px;
    font: 900 .98rem/1 var(--ww-font-en); color: #fff; text-shadow: 0 1px 2px #000a; box-shadow: inset 0 3px 4px #0008, 0 2px 0 #0b1650; }
.md-tb-pill[hidden] { display: none; }
.md-tb-pill b { direction: ltr; unicode-bidi: isolate; margin-inline-start: auto; }
.md-tb-pill .md-ui-icon { position: absolute; inset-inline-start: -10px; top: 50%; translate: 0 -50%; width: 34px; height: 34px; }
.md-tb-coins { background: #33160e; border: 2px solid #1a0a06; }
.md-tb-gems { background: #2a1160; border: 2px solid #170a38; }
@media (max-width: 575.98px) { .md-topbar { gap: .4rem; padding: .3rem .5rem; } .md-tb-pill { min-width: 4.3rem; font-size: .88rem; } .md-tb-pills { gap: .5rem; } .md-tb-lvl { flex-basis: 120px; } }

/* ======================= لوحة اختيار المستويات (galaxy.js) =======================
   بلاطات برتقالية لامعة بأرقام ونجوم، وأقفال رمادية للمقفل، وبنفسجي للزعيم، وأسهم خضراء للتنقل بين المراحل */
.lv-board { display: block; }
.lv-head { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin-bottom: .3rem; }
.lv-ribbon { flex: 1; min-width: 0; display: grid; place-items: center; height: 50px; padding-inline: 1rem;
    background: linear-gradient(90deg, transparent, #1a6c8acc 14%, #1a6c8acc 86%, transparent); }
.lv-ribbon-name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 900 clamp(1.25rem, 3.2vw, 1.9rem)/1.2 var(--ww-font-head); color: #fff;
    text-shadow: 0 3px 0 #17435e, 0 0 3px #17435e, 0 0 14px #0007; }
html[lang="en"] .lv-ribbon-name { font-style: italic; }
.lv-arrow { flex: 0 0 auto; display: grid; place-items: center; width: 52px; height: 52px; padding: 0; color: #fff; cursor: pointer;
    border: 4px solid #d6f1f8; border-radius: 50%; background: radial-gradient(circle at 35% 25%, #a6e957, #3f9a15 72%);
    box-shadow: inset 0 3px 0 #ffffff70, 0 4px 0 #1f5a0c, 0 0 0 3px #2a7a9a66; transition: translate .12s, filter .12s; }
.lv-arrow svg { width: 26px; height: 26px; filter: drop-shadow(0 2px 0 #1f5a0c); }
.lv-next svg { transform: scaleX(-1); }
html[dir="rtl"] .lv-prev svg { transform: scaleX(-1); }
html[dir="rtl"] .lv-next svg { transform: none; }
.lv-arrow:hover:not(:disabled) { filter: brightness(1.08); }
.lv-arrow:active:not(:disabled) { translate: 0 3px; box-shadow: inset 0 3px 0 #ffffff70, 0 1px 0 #1f5a0c, 0 0 0 3px #2a7a9a66; }
.lv-arrow:disabled { filter: grayscale(.8) brightness(.8); opacity: .55; cursor: default; }
.lv-arrow:focus-visible, .lv-tile:focus-visible, .lv-ch:focus-visible { outline: 3px solid var(--md-gold); outline-offset: 3px; }
.lv-total { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .45rem; margin: .1rem 0 1rem; direction: ltr; font: 900 1.7rem/1 var(--ww-font-en); color: #fff; text-shadow: 0 3px 0 #1a2275; }
.lv-total small { font-size: 1.5rem; color: #cbd6ff; }
.lv-total-star { width: 44px; height: 45px; background: url('../icons/school/star-glow.svg') center / contain no-repeat; filter: drop-shadow(0 4px 0 #0007); }
.lv-chip { margin-inline-start: .8rem; padding: .3rem .8rem; border-radius: 999px; font: 800 .9rem/1.2 var(--ww-font-ar); color: #fff; background: #1c8a95; border: 2px solid #d6f1f8; text-shadow: none; direction: rtl; }
.lv-stage { margin-bottom: 1.3rem; padding-top: .2rem; scroll-margin-top: 4.5rem; }
.lv-stage-name { display: flex; align-items: center; justify-content: space-between; gap: .6rem; max-width: 640px; margin: 0 auto .7rem; padding: .35rem .9rem; border-radius: 14px;
    font-size: 1.05rem; color: #fff; background: linear-gradient(90deg, #1d5f7acc, #144058cc); border: 2px solid #ffffff22; }
.lv-stage-name small { display: inline-flex; align-items: center; gap: .3rem; direction: ltr; font: 800 .95rem/1 var(--ww-font-en); color: #ffe27a; }
.lv-mini-star { width: 20px; height: 20px; background: url('../icons/school/star-glow.svg') center / contain no-repeat; }
.lv-stage.is-active .lv-stage-name { border-color: #ffe27a99; box-shadow: 0 0 16px #ffd54a44; }
.lv-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(.45rem, 1.8vw, 1rem); max-width: 640px; margin-inline: auto; }
.lv-tile { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; aspect-ratio: 1 / 1.04; min-width: 0; padding: 0; cursor: pointer; color: #fff;
    border: 3px solid #7a2a10; border-radius: clamp(12px, 2.6vw, 18px);
    background: linear-gradient(180deg, #ffbe4a 0%, #ff8a14 55%, #f06a08 100%);
    box-shadow: inset 0 -5px 0 #c24d05, inset 0 3px 0 #ffffff66, 0 5px 0 #7a2a10, 0 8px 10px #0006; transition: translate .12s, filter .12s, box-shadow .12s; }
.lv-tile::before { content: ''; position: absolute; inset: 13% 13% 25%; border-radius: clamp(10px, 2vw, 14px); background: linear-gradient(180deg, #ff9a1f, #ff6d05); box-shadow: inset 0 2px 0 #ffffff50; }
.lv-tile::after { content: ''; position: absolute; top: 5%; inset-inline-end: 8%; width: 26%; height: 9%; border-radius: 50%; background: #fff; opacity: .85; rotate: -12deg; }
.lv-num { position: relative; z-index: 1; display: grid; place-items: center; width: 100%; margin-top: -9%; font: 900 clamp(1.25rem, 4.2vw, 2.15rem)/1 var(--ww-font-en); text-shadow: 0 3px 0 #b24505, 0 0 6px #7a2a1055; }
html[lang="en"] .lv-num { font-style: italic; }
.lv-lock { display: block; width: 62%; aspect-ratio: 96 / 110; background: url('../icons/school/lock.svg') center / contain no-repeat; filter: drop-shadow(0 3px 0 #0006); }
.lv-stars { position: absolute; z-index: 1; inset-inline: 0; bottom: 6%; display: flex; justify-content: center; gap: 2px; }
.lv-stars i { width: clamp(11px, 2.8vw, 19px); aspect-ratio: 1; background: url('../icons/school/star-glow.svg') center / contain no-repeat; filter: brightness(.34) saturate(2.2) hue-rotate(-18deg); }
.lv-stars i.on { filter: drop-shadow(0 1px 0 #7a2a10); }
.lv-tile:hover:not(.locked) { translate: 0 -3px; filter: brightness(1.07); }
.lv-tile:active:not(.locked) { translate: 0 3px; box-shadow: inset 0 -5px 0 #c24d05, inset 0 3px 0 #ffffff66, 0 2px 0 #7a2a10, 0 4px 6px #0006; }
.lv-tile.perfect { box-shadow: inset 0 -5px 0 #c24d05, inset 0 3px 0 #ffffff66, 0 5px 0 #7a2a10, 0 0 16px #ffd54acc, 0 8px 10px #0006; }
.lv-tile.current { outline: 3px solid #fff3b0; outline-offset: 3px; animation: lvPulse 1.3s ease-in-out infinite alternate; }
@keyframes lvPulse { to { filter: brightness(1.14); } }
.lv-tile.boss { border-color: #3f0f73; background: linear-gradient(180deg, #e585ff 0%, #b24ae8 55%, #8226c9 100%);
    box-shadow: inset 0 -5px 0 #5e1a9c, inset 0 3px 0 #ffffff66, 0 5px 0 #3f0f73, 0 8px 10px #0006; }
.lv-tile.boss::before { background: linear-gradient(180deg, #c15bf3, #9a33dc); }
.lv-tile.boss .lv-num { text-shadow: 0 3px 0 #4e168c, 0 0 6px #3f0f7355; }
.lv-tile.boss:active:not(.locked) { box-shadow: inset 0 -5px 0 #5e1a9c, inset 0 3px 0 #ffffff66, 0 2px 0 #3f0f73, 0 4px 6px #0006; }
.lv-boss { position: absolute; z-index: 2; top: -9px; inset-inline-start: -7px; font-size: 1.15rem; filter: drop-shadow(0 2px 0 #0008); }
.lv-tile.locked { cursor: not-allowed; border-color: #123c50; background: linear-gradient(180deg, #4aa5bd 0%, #2d7792 55%, #205d76 100%);
    box-shadow: inset 0 -5px 0 #184a60, inset 0 3px 0 #ffffff40, 0 5px 0 #123c50, 0 8px 10px #0006; }
.lv-tile.locked::before { background: linear-gradient(180deg, #3b93ae, #2a7690); box-shadow: inset 0 2px 0 #ffffff30; }
.lv-tile.locked::after { opacity: .55; }
.lv-tile.locked .lv-stars i { opacity: .5; }
.lv-ship { position: absolute; z-index: 3; top: -30px; left: 50%; translate: -50% 0; width: 38px; height: 35px; pointer-events: none; animation: lvBob 1.5s ease-in-out infinite alternate; filter: drop-shadow(0 0 8px #5fe4ffcc); }
.lv-ship img, .lv-ship-img { width: 100%; height: 100%; image-rendering: pixelated; }
@keyframes lvBob { to { translate: -50% -5px; } }
.lv-ch { position: relative; display: flex; align-items: center; gap: .7rem; width: min(100%, 640px); margin: .9rem auto 0; padding: .55rem 1rem; cursor: pointer; color: #fff; text-align: start;
    border: 3px solid #0d3b4a; border-radius: 18px; background: linear-gradient(180deg, #46cfc0, #1c8a95);
    box-shadow: inset 0 3px 0 #ffffff55, 0 5px 0 #0c4d5a, 0 8px 10px #0005; transition: translate .12s, filter .12s; }
.lv-ch:hover:not(.locked) { translate: 0 -2px; filter: brightness(1.07); }
.lv-ch:active:not(.locked) { translate: 0 3px; box-shadow: inset 0 3px 0 #ffffff55, 0 2px 0 #0c4d5a; }
.lv-ch-ic { flex: 0 0 auto; font-size: 1.9rem; line-height: 1; filter: drop-shadow(0 2px 0 #0006); }
.lv-ch-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; text-shadow: 0 2px 1px #00343e99; }
.lv-ch-text b { font-size: 1.05rem; }
.lv-ch-text small { font-size: .78rem; opacity: .92; }
.lv-ch .lv-stars { position: static; inset: auto; margin-inline-start: auto; flex: 0 0 auto; }
.lv-ch .lv-stars i { width: 20px; filter: brightness(.3) saturate(1.6) hue-rotate(150deg); }
.lv-ch .lv-stars i.on { filter: drop-shadow(0 1px 0 #7a4a00); }
.lv-ch.done { background: linear-gradient(180deg, #ffbe4a, #f2780c); border-color: #7a2a10; box-shadow: inset 0 3px 0 #ffffff66, 0 5px 0 #7a2a10, 0 8px 10px #0005; }
.lv-ch.locked { cursor: not-allowed; filter: grayscale(.75) brightness(.8); opacity: .8; }
@media (max-width: 575.98px) {
    .lv-arrow { width: 44px; height: 44px; border-width: 3px; } .lv-arrow svg { width: 22px; height: 22px; }
    .lv-ribbon { height: 42px; padding-inline: .4rem; } .lv-total { font-size: 1.4rem; margin-bottom: .7rem; } .lv-total small { font-size: 1.2rem; }
    .lv-tile { border-width: 2px; } .lv-ship { width: 30px; height: 28px; top: -24px; } .lv-ch-text small { display: none; }
}
@media (prefers-reduced-motion: reduce) { .lv-tile.current, .lv-ship { animation: none; } .lv-tile, .lv-ch, .lv-arrow { transition: none; } }
.lv-ch.done .lv-stars i:not(.on) { filter: brightness(.34) saturate(2.2) hue-rotate(-18deg); }

/* أيقونة العملة (coin.svg: قرص ذهبي بحرف M بارز): نسبة أبعادها 96×100 */
.md-icon-coin { aspect-ratio: 96 / 100; }
.md-ui-icon.md-coin-inline { width: 1.15em; height: 1.2em; vertical-align: -.25em; filter: drop-shadow(0 1px 1px #0005); }
.ww-prize-medal .md-icon-coin { width: 76px; height: 79px; filter: drop-shadow(0 4px 0 #0006); }

/* وحدات صحة المركبة والزعيم: يسار الساحة بصرف النظر عن اتجاه اللغة. */
.ww-health-dock { position:absolute; left:10px; top:10px; z-index:12; width:clamp(150px,25vw,230px); pointer-events:none; display:grid; gap:8px; direction:ltr; }
.ww-health-player,.ww-health-boss { display:grid; grid-template-columns:1fr auto; gap:5px 8px; padding:9px 12px; border:2px solid #7198bf; border-left:5px solid #43dfff; border-radius:12px 20px 20px 12px; background:linear-gradient(135deg,#344a6df5,#182039f5); box-shadow:inset 0 2px #b8eaff66,0 4px #0a102b,0 0 10px #24bbef22; color:#f1f9ff; font-size:.8rem; }
.ww-health-dock b { font-size:.8rem; }
.ww-health-dock span { font-variant-numeric:tabular-nums; font-size:.75rem; white-space:nowrap; }
.ww-health-track { grid-column:1/-1; height:14px; border:2px solid #090e2c; border-radius:8px; background:#090e2c; overflow:hidden; }
.ww-health-track i { display:block; height:100%; width:100%; border-radius:6px; background:linear-gradient(#a8ff71,#23d957 65%,#149c47); box-shadow:inset 0 2px #eaffbb88; transition:width .16s ease-out; }
.ww-health-low i { background:linear-gradient(#ff9a8f,#f13e64); }
.ww-health-boss { border-left-color:#ff8b45; border-color:#bf7766; }
.ww-health-boss .ww-health-track i { background:linear-gradient(#ffe872,#ff9d32 65%,#db5336); }
.ww-health-boss[hidden] { display:none; }
body.md-cosmos .ww-enemy.ww-boss { width:min(300px,80%); }
body.md-cosmos .ww-boss-card { position:absolute; left:12%; right:12%; top:43%; min-width:0; max-width:none; padding:8px 10px; border:3px solid #84edff; border-radius:10px; background:#061b35f5; box-shadow:inset 0 2px #b2faff55,0 4px #092c51,0 0 18px #40dbff66; text-align:center; font-size:clamp(1rem,3vw,1.5rem); }
body.md-cosmos .ww-boss-card .ww-word { white-space:normal; overflow-wrap:anywhere; }
body.md-cosmos .ww-boss-hp { background:#251633; border:2px solid #edbd73; border-radius:8px; height:12px; }
body.md-cosmos .ww-boss-hp i { background:linear-gradient(90deg,#ff5479,#ffcd55); }
.ww-hazard-label { position:absolute; left:50%; top:-23px; translate:-50% 0; padding:1px 8px; border-radius:8px; color:#ffeac4; background:#402047; font-size:.65rem; white-space:nowrap; line-height:1.5; }
.ww-boss-bomb { filter:drop-shadow(0 0 7px #ff7b35); }
@media(max-width:480px) { .ww-health-dock { width:170px; top:6px; left:6px; gap:5px; } .ww-health-player,.ww-health-boss { padding:6px 9px; } .ww-health-track { height:11px; } }
@media(prefers-reduced-motion:reduce) { .ww-health-track i { transition:none; } }

.ww-bomb-emblem { position:absolute; right:-17px; top:-22px; width:32px; height:38px; pointer-events:none; }

.md-sync-status { position:fixed; inset-inline:16px; bottom:16px; z-index:2000; max-width:540px; margin-inline:auto; display:flex; align-items:center; gap:12px; padding:14px 18px; border:2px solid #ffd26e; border-radius:16px; background:#16264a; color:#fff3d1; box-shadow:0 6px 24px #0008; line-height:1.7; }
.md-sync-status[hidden] { display:none; }
#cloudStatus { position:static; max-width:none; margin:0 0 12px; font-size:.9rem; }
.md-sync-status .ww-btn { flex-shrink:0; }
@media(max-width:480px) { .md-sync-status { flex-wrap:wrap; } }

/* أسفل ثابت لأزرار المتجر مهما اختلف عدد أسطر الوصف. */
body.md-cosmos .ww-shop-item { height:100%; box-sizing:border-box; }
.ww-shop-action { margin-top:auto; padding-top:.75rem; min-height:64px; width:100%; display:flex; align-items:flex-end; justify-content:center; }
body.md-cosmos .ww-shop-action :is(.ww-btn,.ww-shop-on) { min-height:44px; margin-bottom:5px; display:inline-flex; align-items:center; justify-content:center; }

/* العناوين واسم المنصة وعناوين البطاقات باللغتين؛ الأوصاف والأزرار بخط النصوص. */
body.md-cosmos :is(h1, h2, .navbar-brand, .ww-pc-title, .lv-ribbon-name,
    .md-game-body > b, .md-pg-head > b, .ww-shop-item > b, .md-path > b,
    .ww-mode > b, .ww-tile > b, .ww-chapter > b, .card-title,
    .ww-panel h3, .ww-panel h4, .ww-panel h5, .ww-panel h6):is(:lang(ar), :lang(en)) {
    font-family: 'Tufuli Arabic DEMO', var(--ww-font-ar);
    font-weight: 700;
    letter-spacing: 0;
}
/* خط العناوين الكبيرة باللغتين، محلي ليعمل في شبكات المدارس دون اتصال. */
@font-face {
    font-family: 'Tufuli Arabic DEMO';
    src: url('../lib/fonts/Tufuli/TufuliArabicDEMO-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* رحلة الطفل: هدف واضح، لمس واسع، وتفاصيل عند الطلب. */
.md-paths { margin:1rem 0; }
.md-paths > p { color:var(--md-muted); max-width:65ch; }
.md-path-options { display:flex; gap:1rem; flex-wrap:wrap; margin:1rem 0; }
.md-path { flex:1 1 220px; display:grid; grid-template-columns:54px 1fr; gap:.35rem .8rem; text-align:start; padding:1.1rem; color:var(--md-ink); background:#192652; border:2px solid #6578ad; border-radius:22px; min-height:116px; }
.md-path > span { grid-row:span 2; font-size:2.4rem; align-self:center; }
.md-path > b { font-size:1.4rem; }
.md-path > small { color:#d0def2; line-height:1.7; }
.md-path[aria-pressed="true"] { background:#1c4865; border-color:#a6f5ed; box-shadow:inset 0 0 0 2px #83d5d344,0 4px 0 #071d33; }
.md-path:focus-visible,.md-explore-choice:focus-visible { outline:4px solid #ffe478; outline-offset:5px; }
.md-explore-link { min-height:56px; }
body[data-learner="explore"] .md-home-progress,body[data-learner="explore"] #rv-banner { display:none; }
.md-adult-options,.md-result-details,.md-shop-details { margin:.7rem 0; text-align:start; }
.md-adult-options > summary,.md-result-details > summary,.md-shop-details > summary { cursor:pointer; min-height:48px; display:list-item; align-content:center; color:var(--md-cyan); padding:.5rem; }
.md-adult-options[open] > form { margin-top:1rem; }
body.md-cosmos :is(.ww-btn,.md-launch-button,.ww-btn-icon,.md-filters button,.ww-choice .btn) { min-height:48px; }
body[data-learner="explore"] :is(.ww-btn,.md-launch-button),body[data-learner="learn"] :is(.ww-btn,.md-launch-button) { min-height:56px; }
.md-focused-play .md-tb-pills { display:none; }
.md-focused-play .ww-stat:not(:has([data-hud="level"])):not(:has([data-hud="time"])) { display:none; }
.md-focused-play .ww-hud { justify-content:space-between; min-height:64px; }
.md-focused-play .ww-hud-btns { align-items:center; }
.md-result-achievement { font-size:1.3rem; color:#bcf2e7; margin:.5rem 0; }
.md-practice-note { color:#c7f7ea; background:#184049; padding:.8rem; border-radius:14px; line-height:1.8; }
.md-shop-currency { color:var(--md-muted); }
.md-shop-details { width:100%; margin:0; }
.md-shop-details summary { font-size:.85rem; }
.md-explore { max-width:900px; margin:1rem auto; text-align:center; padding:clamp(1rem,3vw,2rem); }
.md-explore-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; }
.md-explore-head h1 { margin:0; font-size:clamp(1.8rem,5vw,2.6rem); }
.md-explore > p { margin:1rem auto; max-width:52ch; color:#d1def4; line-height:1.8; }
.md-explore .md-path-options { justify-content:center; }
.md-explore .md-path-options > button { min-height:56px; flex:1 1 130px; }
.md-explore [aria-pressed="true"] { outline:3px solid #b2f7ee; outline-offset:3px; }
.md-explore-progress { display:flex; justify-content:center; align-items:center; gap:.5rem; margin:1.2rem 0; direction:ltr; }
.md-explore-progress span { color:#7583af; font-size:1.5rem; }
.md-explore-progress .done { color:#ffe478; }
.md-explore-target { min-height:150px; display:flex; align-items:center; justify-content:center; gap:.5rem; margin:1rem 0; background:#0e193d; border:2px solid #537e9c; border-radius:28px; }
.md-explore-target svg { width:110px; max-width:26%; height:120px; }
.md-explore-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(.6rem,3vw,1.5rem); }
.md-explore-choice { min-height:140px; min-width:0; border:3px solid #7eabd0; border-radius:24px; background:linear-gradient(#294577,#182f58); color:white; box-shadow:0 6px 0 #06152e; padding:1rem; }
.md-explore-choice svg { width:100%; max-width:100px; height:100px; }
.md-explore-choice.example { border-color:#ffe478; box-shadow:0 6px 0 #715715,0 0 0 4px #ffe47833; }
.md-explore-choice.correct { border-color:#9df0b5; background:#185044; }
.md-explore-glyph { font:700 clamp(2.6rem,8vw,4rem)/1.6 var(--ww-font-ar); }
.md-explore-feedback { min-height:3em; margin:1.3rem 0 .4rem; color:#f5e6a9; font-size:1.15rem; }
.md-explore-example { color:#ffe478; }
.md-explore-finish { padding:2rem .5rem; }
@media(max-width:480px) {
 .md-path { flex-basis:100%; }
 .md-explore-choice { padding:.5rem; min-height:110px; border-radius:18px; }
 .md-explore-choice svg { height:78px; }
 .md-focused-play .ww-health-dock { width:150px; }
}

.md-practice .ww-health-dock { display:none; }

/* في الاستكشاف يبقى المثال والاختيارات قريبين ضمن شاشة الهاتف. */
.md-explore-page .md-section-nav { display:none; }
.md-explore-page .md-explore { margin:.5rem auto; }
.md-explore .md-path-options { gap:.5rem; }
.md-explore .md-path-options > button { flex:1 1 0; min-width:0; }
@media(max-width:480px) {
 .md-explore { padding:.8rem; }
 .md-explore-head { gap:.4rem; }
 .md-explore-head h1 { font-size:1.5rem; }
 .md-explore-head .ww-btn { min-height:48px; padding:.5rem; font-size:.85rem; }
 .md-explore > p { font-size:.9rem; margin:.6rem 0; }
 .md-explore .md-path-options > button { padding:.5rem .2rem; font-size:.85rem; }
 .md-explore-progress { margin:.6rem 0; }
 #exploreBoard h2 { font-size:1.3rem; margin:.5rem 0; }
 .md-explore-target { min-height:110px; margin:.5rem 0; }
 .md-explore-target svg { height:90px; }
 .md-explore-choice { min-height:100px; }
 .md-explore-example { font-size:.9rem; }
 .md-explore-feedback { font-size:1rem; margin:.8rem 0 .2rem; min-height:2.8em; }
}

.md-focused-play .wl-stat:has(:is([data-h="score"],[data-h="tries"],[data-h="combo"])) { display:none; }

body.md-cosmos .ww-btn-icon { min-width:48px; }

body.md-cosmos .md-practice .ww-enemy[lang] { font-size:clamp(1.5rem,4vw,1.9rem); }


.md-practice :is(.ww-final-score,.ww-pc-best,.ww-run-stars) { display:none; }


/* اتجاه الشبكة ثابت لتبقى صحة اللاعب يساراً والزعيم يميناً في اللغتين. */
.md-unified-topbar { position:relative; z-index:30; display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); direction:ltr; gap:.5rem .8rem; overflow:visible; }
.md-unified-topbar .md-tb-pills { display:none; }
.md-unified-topbar .md-tb-lvl { grid-column:4 / span 3; grid-row:1; min-width:0; max-width:none; width:100%; }
.md-unified-topbar .ww-health-player { grid-column:1 / span 3; grid-row:1; }
.md-unified-topbar .ww-health-boss { grid-column:10 / span 3; grid-row:1; }
.md-unified-topbar :is(.ww-health-player,.ww-health-boss) { min-width:0; padding:6px 9px; }
.md-unified-topbar .md-tb-controls { grid-column:7 / span 3; grid-row:1; display:flex; align-items:center; justify-content:center; gap:.4rem; margin:0; position:static; }
.md-unified-topbar:not(:has(.ww-health-boss:not([hidden]))) .md-tb-controls { grid-column:7 / -1; justify-self:end; }
.md-unified-topbar .ww-btn-icon { min-width:48px; min-height:48px; }
.md-unified-topbar .md-tb-controls .ww-hide-xs { display:inline-flex !important; }
.md-unified-play > .ww-hud { display:none; }
.md-unified-play .wl-stat:has([data-h="level"]) { display:none; }
.md-unified-topbar .md-tb-time { grid-column:4 / span 3; grid-row:2; font-size:.9rem; }
.md-unified-topbar .md-tb-mode { grid-column:1 / -1; color:#c7f7ea; font-size:.8rem; }
.md-unified-play.md-practice :is(.ww-health-player,.ww-health-boss) { display:none; }
.md-unified-topbar.md-no-health .md-tb-lvl { grid-column:1 / span 6; }
@media(max-width:800px) {
 .md-unified-topbar .md-tb-lvl,.md-unified-topbar.md-no-health .md-tb-lvl { grid-column:1 / span 4; grid-row:1; }
 .md-unified-topbar .md-tb-controls,.md-unified-topbar:not(:has(.ww-health-boss:not([hidden]))) .md-tb-controls { grid-column:5 / -1; grid-row:1; justify-self:end; }
 .md-unified-topbar .ww-health-player { grid-column:1 / span 6; grid-row:2; }
 .md-unified-topbar .ww-health-boss { grid-column:7 / span 6; grid-row:2; }
 .md-unified-topbar .md-tb-time { grid-column:1 / -1; grid-row:3; }
 .md-unified-topbar :is(.ww-health-player,.ww-health-boss) b { font-size:.72rem; }
 .md-unified-topbar :is(.ww-health-player,.ww-health-boss) span { font-size:.68rem; }
}

@media(max-width:360px) {
 .md-unified-topbar .md-tb-lvl { grid-column:1 / -1; grid-row:1; }
 .md-unified-topbar .md-tb-controls,.md-unified-topbar:not(:has(.ww-health-boss:not([hidden]))) .md-tb-controls { grid-column:1 / -1; grid-row:2; justify-self:center; }
 .md-unified-topbar .ww-health-player,.md-unified-topbar .ww-health-boss { grid-row:3; }
 .md-unified-topbar .md-tb-time { grid-row:4; }
}

.md-unified-play:has(.md-topbar .ww-health-boss) .ww-boss-hp { display:none; }

/* دليل الأدوات: فتح واضح، أيقونة مع شرح، ودون حركة مشتتة. */
.md-aid-guide { margin-block:1rem; scroll-margin-top:6rem; }
.md-aid-guide > summary { font-size:1.25rem; font-weight:700; color:var(--md-ink); }
.md-aid-guide summary { cursor:pointer; min-height:44px; padding:.4rem .2rem; }
.md-aid-guide summary:focus-visible { outline:3px solid var(--md-cyan); outline-offset:5px; border-radius:6px; }
.md-aid-guide summary::marker { color:var(--md-cyan); }
.md-aid-content { padding-top:.75rem; }
.md-aid-content section + section { margin-top:1.5rem; padding-top:1.25rem; border-top:1px solid var(--md-edge); }
.md-aid-content h3 { font-size:1.25rem; margin:0 0 .5rem; }
.md-aid-content p { line-height:1.85; max-width:75ch; }
.md-aid-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.75rem; list-style:none; padding:0; margin:.75rem 0; }
.md-aid-cards li { display:flex; gap:.75rem; padding:1rem; border-radius:16px; background:#111b49; border:1px solid var(--md-edge); }
.md-aid-cards li > div { min-width:0; }
.md-aid-cards h4 { margin:0 0 .35rem; font-size:1.15rem; }
.md-aid-cards p { margin:0; font-size:.95rem; color:var(--md-muted); }
.md-aid-icon { flex:0 0 44px; height:44px; display:grid; place-items:center; font-size:1.8rem; line-height:1; color:#ffd166; }
.md-aid-rule,.md-aid-note { padding:.75rem 1rem; border-inline-start:4px solid #ffd166; background:#25255c; border-radius:8px; }
.md-aid-more { margin-top:.5rem; }
body.md-cosmos .md-aid-guide > summary { font-family:'Tufuli Arabic DEMO',var(--ww-font-ar); }
@media(max-width:900px) { .md-aid-cards { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:520px) { .md-aid-cards { grid-template-columns:1fr; } }

@media(max-width:1000px) { .md-aid-guide { scroll-margin-top:155px; } }
