/* Mambol Learning Arcade 6.6.9CL — touch-first, low-data games */
.arcade-wrap{max-width:1000px;margin:auto;display:grid;gap:18px;padding-bottom:24px}
.arcade-hero{background:linear-gradient(130deg,#4c1d95,#7e22ce 58%,#a855f7);color:white;border-radius:24px;padding:24px 20px;text-align:center;box-shadow:0 12px 26px #4c1d9526}
.arcade-hero h2{color:white;font-size:clamp(1.5rem,5vw,2.25rem);margin:6px 0 0}
.arcade-hero p{font-size:1.1rem;font-weight:650;color:#fff;margin:8px 0 15px}
.arcade-hero span{display:inline-block;background:#ffffff26;padding:9px 13px;border-radius:20px;color:#fff;font-size:.9rem}
.arcade-hero-emoji{font-size:2.1rem}
.arcade-filter-row{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:12px}
.arcade-filter-row label{flex:1 1 170px;font-weight:650;display:grid;gap:7px}
.arcade-filter-row select{width:100%;font-size:16px;min-height:44px}
.arcade-catalog,.arcade-mode-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:14px}
.arcade-lesson-card{border:1px solid #ded3f2;background:#fff;border-radius:18px;padding:18px;min-width:0;box-shadow:0 6px 16px #1f133e0b;display:flex;flex-direction:column;gap:10px}
.arcade-lesson-card h3{margin:0;font-size:1.12rem;color:#302046}.arcade-lesson-card p{margin:0 0 7px;color:#626174}
.arcade-lesson-card button{margin-top:auto;min-height:47px}
.arcade-subject{color:#5b21b6;font-weight:750;display:flex;justify-content:space-between;gap:6px;font-size:.94rem}
.arcade-subject span{background:#efe6fc;padding:3px 9px;border-radius:10px;white-space:nowrap}
.arcade-mode{display:grid;align-content:center;text-align:left;gap:9px;min-height:135px;border:2px solid #ded4f1;border-radius:19px;background:#fff;padding:17px;color:#321b5f;cursor:pointer;box-shadow:0 4px 15px #1d103b10}
.arcade-mode strong{font-size:1.28rem}.arcade-mode span{font-size:.92rem;color:#586174}
.arcade-mode:active,.arcade-option:active{transform:scale(.98)}
.arcade-back{border:0;background:transparent;color:#51208e;padding:8px;font-weight:700;cursor:pointer}
.arcade-play-head{display:flex;align-items:center;justify-content:space-between;font-size:1.05rem;font-weight:700;color:#532790}
.arcade-progress{height:12px;background:#e9d9fb;border-radius:20px;overflow:hidden}
.arcade-progress div{height:100%;background:linear-gradient(90deg,#9333ea,#f59e0b);transition:width .25s}
.arcade-play-card{background:#fff;border:1px solid #ebdef7;border-radius:25px;padding:clamp(17px,4vw,32px);text-align:center;box-shadow:0 9px 25px #39206015}
.arcade-pill{display:inline-block;border-radius:25px;background:#f4e8fe;color:#6b21a8;padding:7px 13px;font-weight:750}
.arcade-play-card h2{margin:20px auto;max-width:720px;font-size:clamp(1.2rem,4vw,1.75rem);line-height:1.45;white-space:pre-line;color:#252038}
.arcade-emoji{font-size:clamp(3rem,13vw,6rem);margin-top:13px;line-height:1.1}
.arcade-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr));gap:12px}
.arcade-option{border:2px solid #d9c9f5;background:#faf6ff;padding:15px;border-radius:15px;font-size:1.05rem;min-height:65px;text-align:left;color:#2a1944;cursor:pointer}
.arcade-option span{display:inline-grid;place-items:center;background:#e6d6ff;width:29px;height:29px;margin-right:8px;border-radius:9px;font-weight:800}
.arcade-option.right{background:#dcfce7;border-color:#16a34a}.arcade-option.wrong{background:#fee2e2;border-color:#ef4444}
.arcade-option:disabled{opacity:1;cursor:default}
.arcade-feedback{padding:19px;margin-top:18px;text-align:left;border-radius:16px}
.arcade-feedback.good{background:#e9f9ec;color:#14532d}.arcade-feedback.retry{background:#fef3e6;color:#78350f}
.arcade-feedback strong{display:block;font-size:1.15rem}.arcade-feedback p{margin:8px 0 16px}
.arcade-feedback button{width:100%;min-height:50px}
.arcade-tiles{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:16px 0}
.arcade-letter{width:46px;height:52px;background:#f5ebff;border:2px solid #bc91e5;border-radius:12px;font-size:1.45rem;font-weight:800;color:#4a206d;cursor:pointer}
.arcade-letter:disabled{opacity:.25}
.arcade-spell-answer{letter-spacing:.09em;font-size:clamp(1.2rem,5vw,1.7rem);min-height:55px;padding:13px;background:#f8f4ff;border:1px dashed #9b67cf;border-radius:13px;color:#4c1d95;overflow-wrap:anywhere}
.arcade-play-card #arcade-undo,.arcade-play-card #arcade-spell-done{margin:8px;min-height:49px}
.arcade-results{border-radius:25px;padding:32px 20px;text-align:center;background:linear-gradient(145deg,#fff,#f4ecff);border:1px solid #d8c4f2}
.arcade-results h2{font-size:2rem;color:#4c1d95}.arcade-trophy{font-size:5rem}.arcade-stars{font-size:2.8rem;letter-spacing:4px;margin:12px 0}
.arcade-results-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:22px 0 0}
.arcade-results-actions button{min-height:50px}
#arcade-sync-status{margin:15px auto;max-width:530px;font-size:.92rem;color:#594a72}
@media(max-width:580px){.arcade-wrap{gap:12px}.arcade-catalog,.arcade-mode-grid{grid-template-columns:1fr}.arcade-results-actions button{width:100%}.arcade-options{grid-template-columns:1fr}.arcade-hero{padding:20px 13px}}
@media(prefers-reduced-motion:reduce){.arcade-progress div{transition:none}}

/* 6.6.9CO — friendly, lightweight mascot and speaking game controls */
.arcade-control-row{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:8px 0}
.arcade-control-row button{min-width:138px}
.arcade-guide{display:flex;align-items:center;gap:12px;margin:12px 0 16px;animation:arcade-guide-enter .46s ease-out both}
.arcade-owl{font-size:clamp(46px,10vw,72px);line-height:1;filter:drop-shadow(0 4px 3px #23133733);transform-origin:50% 90%;display:inline-block}
.arcade-guide-message{background:#fff;border:2px solid #bba1df;box-shadow:0 3px 12px #40265e17;border-radius:16px;padding:12px 14px;color:#412258;max-width:80%;font-size:clamp(14px,2.5vw,18px)}
.arcade-guide-message strong{color:#692e90}
@keyframes arcade-guide-enter{from{opacity:0;transform:translateX(-65px)}to{opacity:1;transform:translateX(0)}}
@keyframes arcade-owl-cheer{0%{transform:translateY(0) rotate(0)}35%{transform:translateY(-16px) rotate(-10deg)}70%{transform:translateY(-8px) rotate(10deg)}100%{transform:translateY(0) rotate(0)}}
.arcade-owl.arcade-celebrate{animation:arcade-owl-cheer .7s ease-in-out 2}
.arcade-owl.arcade-comfort{animation:arcade-guide-enter .35s ease-out}
.arcade-sound-in-game{display:flex;justify-content:flex-end;margin:8px 0 12px}
.arcade-exercise-list .toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.arcade-exercise-list .toolbar a,.arcade-exercise-list .toolbar button{white-space:normal}
.arcade-exercise-question{padding:12px;margin:12px 0;border:1px solid #dce3ea;border-radius:12px}
.arcade-exercise-question p{margin:6px 0}
@media(prefers-reduced-motion:reduce){.arcade-guide,.arcade-owl.arcade-celebrate,.arcade-owl.arcade-comfort{animation:none}}

.arcade-owl{position:relative;min-width:68px;text-align:center}
.arcade-gradcap{position:absolute;left:22px;top:-25px;font-size:30px;transform:rotate(-7deg);z-index:1}
.arcade-play-card{animation:arcade-question-arrive .38s ease-out both}
@keyframes arcade-question-arrive{from{opacity:.65;transform:translateX(36px)}to{opacity:1;transform:translateX(0)}}
@media(prefers-reduced-motion:reduce){.arcade-play-card{animation:none}}

/* 6.6.9CP — friendly results, written theory and pupil-private progress */
.arcade-results{position:relative;overflow:hidden;isolation:isolate}
.arcade-results>*:not(.arcade-falling-stars){position:relative;z-index:1}
.arcade-falling-stars{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none}
.arcade-falling-stars span{position:absolute;top:-45px;font-size:clamp(19px,5vw,32px);opacity:0;animation:arcade-fall-stars 2.5s cubic-bezier(.2,.65,.6,1) forwards;text-shadow:0 2px 7px #613fab66}
@keyframes arcade-fall-stars{0%{transform:translateY(-50px) rotate(0);opacity:0}15%{opacity:1}80%{opacity:1}100%{transform:translateY(650px) rotate(290deg);opacity:0}}
.arcade-progress-dashboard{max-width:800px;margin:0 auto;color:#322444}
.arcade-progress-dashboard h3{color:#5b21b6;margin:13px 0}
.arcade-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:13px 0 20px}
.arcade-stat-grid>div{background:#f3eaff;border:1px solid #dfc9fb;border-radius:13px;padding:12px 7px;text-align:center;display:grid;gap:5px}
.arcade-stat-grid strong{font-size:clamp(1.15rem,4vw,1.7rem);color:#4c1d95}
.arcade-stat-grid span{font-size:.75rem;color:#604c75}
.arcade-board{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.arcade-board li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 13px;background:#fbf9ff;border-radius:12px;border:1px solid #e6dcf3}
.arcade-board .arcade-board-me{background:#eee2ff;border-color:#a978dd}
.arcade-positive{background:#f2ecff;padding:12px;border-radius:12px;color:#5b21b6;font-weight:650}
.arcade-consent{display:flex;align-items:flex-start;gap:10px;margin:18px 0;background:#f9f6ff;padding:12px;border-radius:12px;line-height:1.5}
.arcade-consent input{width:20px;height:20px;flex:0 0 20px;margin-top:3px}
.arcade-theory-item{display:grid;gap:8px;margin:18px 0;padding:16px;background:#faf7ff;border:1px solid #dfcef1;border-radius:14px}
.arcade-theory-item strong{font-size:1.08rem}
.arcade-theory-item small{color:#615275}
.arcade-theory-item textarea,.arcade-theory-submission textarea{width:100%;min-height:95px;font-size:16px;line-height:1.45;padding:12px;border:1px solid #bcb0ca;border-radius:12px;resize:vertical}
.arcade-theory-submission{padding:15px;border:1px solid #e3d7ec;border-radius:13px;margin:13px 0}
.arcade-theory-submission>div{background:#f8f5ff;margin:9px 0;padding:12px;border-radius:9px;white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:550px){.arcade-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.arcade-falling-stars span{animation:none;display:none}}

/* 6.6.9CQ — Mummy Mambol welcome (lightweight and tablet friendly) */
.arcade-welcome{max-width:690px;margin:0 auto 20px;text-align:center;display:flex;flex-direction:column;gap:11px;align-items:stretch;min-width:0}
.arcade-welcome-title{color:#56218e;font-size:clamp(1.3rem,4.8vw,2rem);margin:4px 0 0}
.arcade-welcome-intro{max-width:650px;align-self:center;font-size:clamp(.95rem,2.4vw,1.05rem);color:#50435e;line-height:1.5;margin:0}
.arcade-welcome-tools{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:9px;padding:1px 0}
.arcade-welcome-hint{font-size:.85rem;color:#655476}
.arcade-welcome-poster{background:transparent!important;border:0!important;box-shadow:0 12px 35px #32125924!important;display:block;width:100%;max-width:540px;height:auto;margin:0 auto;overflow:hidden;padding:0!important;border-radius:21px!important;cursor:pointer;line-height:0;touch-action:manipulation}
.arcade-welcome-poster img{width:100%;height:auto;display:block;object-fit:contain;aspect-ratio:1000/1750}
.arcade-welcome-poster:focus-visible,.arcade-welcome-start:focus-visible{outline:4px solid #f4bb2c;outline-offset:4px}
.arcade-welcome-poster:active{transform:scale(.997)}
.arcade-welcome-foot{display:grid;justify-items:center;gap:8px;padding:4px 0 24px}
.arcade-welcome-start{min-height:52px;width:min(100%,440px);font-size:1.1rem}
.arcade-welcome-foot p{color:#605572;font-size:.88rem;max-width:500px;margin:0;line-height:1.45}
@media(max-width:550px){.arcade-welcome{gap:9px}.arcade-welcome-title{font-size:1.35rem}.arcade-welcome-intro{font-size:.91rem}.arcade-welcome-poster{border-radius:16px!important}.arcade-welcome-tools{justify-content:space-between}.arcade-welcome-hint{flex:1 1 140px;text-align:left}}
@media(prefers-reduced-motion:reduce){.arcade-welcome-poster:active{transform:none}}


/* 6.6.9CT — Mummy Mambol inside the actual learning games */
.arcade-guide{min-width:0;max-width:820px;display:flex;align-items:center;gap:12px;padding:8px 11px;margin:12px auto 17px;border-radius:20px;background:linear-gradient(115deg,#f4e9ff,#fff);border:1px solid #dfc6fb;overflow:hidden}
.arcade-guide .arcade-mummy{display:block;flex:0 0 90px;width:90px;height:93px;object-fit:cover;object-position:center 12%;border-radius:17px;background:#e8d5ff;box-shadow:0 3px 9px #40186525}
.arcade-guide .arcade-guide-message{min-width:0;max-width:none;flex:1;border:0;background:transparent;box-shadow:none;padding:7px 2px;line-height:1.45;font-size:clamp(.91rem,2.7vw,1.03rem);color:#402252;overflow-wrap:anywhere}
.arcade-guide .arcade-guide-message strong{display:block;color:#622198;margin-bottom:2px}
.arcade-guide[data-mood="cheer"]{border-color:#85c9a0;background:linear-gradient(110deg,#e9fff1,#fff)}
.arcade-guide[data-mood="encourage"]{border-color:#e2bd89;background:linear-gradient(110deg,#fff5e5,#fff)}
.arcade-guide[data-mood="highfive"]{border-color:#eec65c;background:linear-gradient(110deg,#fff9da,#fff)}
.arcade-guide.arcade-mummy-animate .arcade-mummy{animation:arcade-mummy-wave .58s ease-out}
@keyframes arcade-mummy-wave{0%{transform:rotate(-5deg) scale(.94)}50%{transform:rotate(5deg) scale(1.055)}100%{transform:rotate(0) scale(1)}}
.arcade-sound-in-game{align-items:center;gap:8px;flex-wrap:wrap}
.arcade-sound-in-game button{min-height:40px;white-space:normal}
#arcade-read-question:disabled{opacity:.6;cursor:not-allowed}
.arcade-results .arcade-guide{margin:2px auto 13px;text-align:left}
@media(max-width:520px){.arcade-guide{gap:10px;padding:7px}.arcade-guide .arcade-mummy{flex-basis:75px;width:75px;height:87px}.arcade-guide .arcade-guide-message{font-size:.9rem}.arcade-sound-in-game button{flex:1 1 130px}}
@media(prefers-reduced-motion:reduce){.arcade-guide,.arcade-guide.arcade-mummy-animate .arcade-mummy{animation:none!important}}
