/* Quran Match: readable cards and ordinary document scrolling at every size. */
.qm-wrap{width:min(940px,100%);margin:0 auto;padding:24px 18px 36px;color:#173653}.qm-wrap *{box-sizing:border-box}.qm-wrap [hidden],.qm-wrap .hidden{display:none!important}.qm-wrap button,.qm-wrap a{touch-action:manipulation}.qm-wrap button{cursor:pointer;font:900 16px/1.25 Nunito,sans-serif;color:#174867;background:#fff;border:2px solid #bfdfed;border-radius:14px;padding:11px 15px;min-height:44px;box-shadow:0 3px 0 #cfe5ed;transition:transform .15s,background .15s}.qm-wrap button:hover{background:#edfaff}.qm-wrap button:active{transform:translateY(2px);box-shadow:none}.qm-wrap :focus-visible{outline:3px solid #7c3aed;outline-offset:3px}.qm-wrap button[aria-disabled=true]{cursor:default}.qm-wrap p{margin:8px 0;line-height:1.5}.qm-wrap h1,.qm-wrap h2,.qm-wrap h3{margin:0;line-height:1.15;font-weight:1000}.qm-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.qm-heading h1{font-size:clamp(26px,5vw,38px);color:#075985}.qm-heading h1 span{color:#d99b19}.qm-heading a{font-size:14px;font-weight:900;color:#5b21b6}.qm-eyebrow{font-size:12px;letter-spacing:.06em;text-transform:uppercase;font-weight:1000;color:#64748b}.qm-shell{position:relative;background:#fff;border:4px solid #fff;border-radius:30px;box-shadow:0 10px 0 #9acfe24f,0 16px 40px #2979a31a;overflow:visible!important;min-height:0!important;max-height:none!important}.qm-cover{height:200px;position:relative;border-radius:25px 25px 8px 8px;overflow:hidden;background:#c4edf1}.qm-cover img{width:100%;height:100%!important;object-fit:cover;object-position:50% 53%}.qm-cover-label{position:absolute;left:20px;bottom:16px;border:2px solid #fff;background:#fffffff0;border-radius:15px;padding:8px 14px;font-size:17px;font-weight:1000;color:#065f46}.qm-intro{padding:24px 30px 28px;text-align:center}.qm-intro h2{font-size:clamp(27px,5vw,38px);color:#116b64}.qm-intro>p{max-width:620px;margin:12px auto}.qm-demo{display:flex;gap:18px;align-items:center;justify-content:center;margin:18px auto;background:#f0faf7;border:2px dashed #9bd8c3;border-radius:18px;padding:12px;width:fit-content;min-width:230px}.qm-demo [lang=ar]{font-size:31px}.qm-demo strong{font-size:20px}.qm-tip{background:#f1f8ff;border-radius:12px;padding:10px 14px;font-size:14px;font-weight:800}.qm-levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:22px 0}.qm-levels button{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0;padding:16px 8px;background:#f0fbf5;border-color:#9edcbe;box-shadow:0 5px 0 #9edcbe}.qm-levels button:nth-child(2){background:#fff9e6;border-color:#efd083;box-shadow:0 5px 0 #efd083}.qm-levels button:nth-child(3){background:#f2f0ff;border-color:#c3b5ef;box-shadow:0 5px 0 #c3b5ef}.qm-levels button>span{font-size:34px}.qm-levels strong{font-size:22px}.qm-levels small{font-size:12px;color:#41546b}.qm-fine{font-size:12px;color:#587084}.qm-toolbar{position:sticky;top:var(--sg-header);z-index:30;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#e9f9ff;border-radius:24px 24px 14px 14px;border-bottom:3px solid #b9e7f6;padding:12px 18px}.qm-counter{text-align:center;display:grid;gap:1px}.qm-counter strong{font-size:23px;color:#086b82}.qm-counter small{font-size:11px;font-weight:900}.qm-game-guide{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 22px 10px}.qm-game-guide>div{flex:1}.qm-game-guide strong{font-size:19px;color:#146257}.qm-game-guide p{font-size:14px;min-height:42px;font-weight:800}.qm-game-guide button{flex-shrink:0;background:#fffbeb;border-color:#ead49c}.qm-progress{height:8px;border-radius:6px;background:#e6f3ed;margin:0 22px 16px;overflow:hidden}.qm-progress>div{height:100%;width:0;background:linear-gradient(90deg,#39b7a0,#96d952);transition:width .3s;border-radius:6px}.qm-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:0 22px}.qm-wrap .quran-card{position:relative;min-width:0;min-height:112px;aspect-ratio:1.35;border:3px solid #a7d9ee;border-bottom-width:6px;border-radius:18px;background:radial-gradient(circle at 50% 48%,#ffffff2e 0 23%,transparent 24%),repeating-linear-gradient(45deg,transparent 0 14px,#ffffff0b 14px 28px),#258cb4;color:#fff;padding:8px 5px;box-shadow:none;display:flex;align-items:center;justify-content:center;scroll-margin-top:calc(var(--sg-header) + 105px);scroll-margin-bottom:calc(var(--sg-bottom) + 20px)}.card-front{display:grid;gap:5px;place-items:center}.card-front b{font-size:26px;line-height:1}.card-front small{font-size:11px;font-weight:900}.qm-wrap .quran-card[data-type=english]{background-color:#725ca8;border-color:#c6b9e7}.qm-wrap .quran-card.is-up{background:#f1f2ff;border-color:#b8b9e6;color:#333b71}.qm-wrap .quran-card[data-type=english].is-up{background:#f5fff7;border-color:#a7dcc0;color:#175847}.qm-wrap .quran-card.is-matched{background:#f2fbf5;border-color:#6fc496;color:#164d3d;border-bottom-width:3px;box-shadow:inset 0 0 0 1px #d1efdb}.qm-wrap .quran-card.is-matched:after{content:'✓';position:absolute;right:5px;top:3px;font-size:13px;color:#147246}.quran-card-text{display:block;max-width:100%;font-size:clamp(14px,2vw,20px);line-height:1.22;text-wrap:balance;overflow-wrap:normal;word-break:normal}.quran-card-text[lang=ar]{font-size:clamp(22px,3.2vw,32px);line-height:1.55}.qm-board-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 22px;font-size:12px;color:#587084;font-weight:800}.qm-keys{padding:0 22px 18px;font-size:12px;color:#587084;text-align:center}.qm-map{margin:0 22px 18px;padding:18px;background:#fff9e9;border:2px solid #ecdaaa;border-radius:18px}.qm-map h3{font-size:20px}.qm-map>p{font-size:13px}.qm-map>button{margin-top:12px}.qm-word-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.qm-word{display:flex;align-items:center;justify-content:space-between;gap:12px;border:2px solid #c7e5d7;border-radius:15px;padding:12px;background:#fff;min-width:0}.qm-word [lang=ar]{font-size:24px;line-height:1.6;color:#194f45}.qm-word strong{font-size:14px;line-height:1.35;color:#375371;text-align:right;max-width:52%}.qm-pause{padding:45px 24px;text-align:center}.qm-pause>span{font-size:55px}.qm-pause h2{font-size:30px;color:#146257}.qm-pause button{display:block;margin:16px auto}.qm-result-head{text-align:center;padding:26px 24px 10px}.qm-bloom{font-size:62px;line-height:1.1;color:#f3b544;text-shadow:2px 3px #fff0c5}.qm-result-head h2{font-size:clamp(26px,4vw,34px);color:#116b64}.qm-result-actions{display:flex;gap:12px;justify-content:center;margin:14px 20px}.qm-wrap .qm-primary{background:#147b73;border-color:#0c655e;color:#fff;box-shadow:0 4px 0 #0b5651;padding:13px 24px}.qm-wrap .qm-primary:hover{background:#0c6b64}.qm-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:24px 24px 12px}.qm-stats>div{display:grid;text-align:center;border-radius:16px;padding:12px 4px;background:#f0f8fc}.qm-stats strong{font-size:24px;color:#186f8b}.qm-stats small{font-size:11px;font-weight:900}.qm-shell #replay-goal,.qm-shell #storage-note{margin:10px 24px}.qm-recall{margin:20px 24px;padding:18px;border:2px solid #dacdf3;border-radius:20px;background:#f9f6ff}.qm-recall-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.qm-recall h3{color:#614488;font-size:23px}.qm-recall .qm-eyebrow{margin-top:0}.qm-recall-heading button{flex-shrink:0}.qm-recall #recall-word{font-size:34px;line-height:1.65;text-align:center;color:#46386e;margin:14px 0}.qm-recall #recall-progress{font-size:13px;font-weight:900;color:#6f598a}.qm-recall #recall-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.qm-recall #recall-choices button{min-height:65px;font-size:14px}.qm-recall button.is-correct{background:#e2f8e8;border-color:#56b982}.qm-recall #recall-feedback{min-height:24px;font-weight:900;color:#4c396b}.qm-earned{margin:24px}.qm-earned h3{font-size:24px;color:#186458}.qm-earned>p{font-size:14px}.qm-next{display:block;margin:24px;padding:15px;border-radius:15px;background:#eaf7ff;color:#13608b;font-weight:900;text-align:center}.qm-shell #confetti-container{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:26px}.qm-petal{position:absolute;top:0;font-size:20px;color:#f0b747;animation:qm-fall 1.5s ease-in forwards}.qm-wrap .is-matched{animation:qm-grow .3s ease-out}@keyframes qm-grow{50%{transform:scale(1.035)}}@keyframes qm-fall{to{transform:translateY(450px) rotate(160deg);opacity:0}}
@media(max-width:600px){.qm-wrap{padding:12px 8px 24px}.qm-heading{padding:0 6px;margin-bottom:12px}.qm-heading a{font-size:12px;max-width:85px}.qm-heading .qm-eyebrow{font-size:10px}.qm-shell{border-radius:22px;border-width:3px}.qm-cover{height:146px;border-radius:17px 17px 8px 8px}.qm-cover-label{font-size:13px;left:12px;bottom:10px;padding:6px 10px}.qm-intro{padding:18px 14px}.qm-levels{gap:8px}.qm-levels strong{font-size:19px}.qm-levels small{font-size:11px}.qm-levels button>span{font-size:28px}.qm-levels button{padding:12px 4px}.qm-demo{margin:12px auto;padding:7px 13px}.qm-toolbar{padding:8px;gap:6px;border-radius:17px 17px 12px 12px}.qm-toolbar button{font-size:13px;padding:8px}.qm-counter strong{font-size:19px}.qm-counter small{font-size:10px}.qm-game-guide{padding:12px 10px 8px;gap:8px}.qm-game-guide strong{font-size:16px}.qm-game-guide p{font-size:12px;margin:4px 0;min-height:36px}.qm-game-guide button{font-size:12px;padding:8px}.qm-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;padding:0 9px}.qm-wrap .quran-card{aspect-ratio:1;min-height:99px;border-radius:13px;padding:6px 3px;border-width:2px;border-bottom-width:5px}.quran-card-text{font-size:13px;line-height:1.22}.quran-card-text[lang=ar]{font-size:22px;line-height:1.55}.qm-progress{margin:0 10px 12px}.qm-board-foot{padding:12px 10px;font-size:11px}.qm-board-foot button{font-size:12px;padding:8px}.qm-keys{font-size:11px;padding:0 12px 10px}.qm-map{margin:0 10px 12px;padding:12px}.qm-word-list{grid-template-columns:1fr}.qm-word{padding:9px 12px}.qm-word [lang=ar]{font-size:25px}.qm-result-head{padding:20px 12px 6px}.qm-bloom{font-size:48px}.qm-result-actions{margin:12px;gap:9px}.qm-result-actions button{font-size:14px;padding:12px 14px}.qm-stats{margin:20px 12px 12px;gap:7px}.qm-shell #replay-goal,.qm-shell #storage-note{margin:10px 12px}.qm-recall,.qm-earned,.qm-next{margin:16px 12px}.qm-recall{padding:13px}.qm-recall-heading{align-items:flex-start;flex-direction:column}.qm-recall h3{font-size:21px}.qm-recall #recall-choices{grid-template-columns:1fr;gap:8px}.qm-recall #recall-choices button{min-height:48px}.qm-stats small{font-size:10px}}
@media(max-width:350px){.qm-wrap .quran-card{min-height:98px}.quran-card-text{font-size:12px}.quran-card-text[lang=ar]{font-size:20px}.qm-board-foot>span:nth-child(2){max-width:100px;text-align:center}}
@media(prefers-reduced-motion:reduce){.qm-wrap *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.qm-petal{display:none!important}}html[data-sg-calm=true] .qm-petal{display:none!important}

/* Do not create a body scroll container that detaches the shared sticky header. */
@supports(overflow:clip){html:has(body[data-sg-page="quran-match"]){overflow-x:clip}body[data-sg-page="quran-match"].sg-responsive-game{overflow-x:clip;overflow-y:visible}}

@media(max-height:480px) and (orientation:landscape){
 .qm-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.qm-wrap .quran-card{aspect-ratio:1.45;min-height:92px;border-radius:12px;padding:4px}.quran-card-text{font-size:13px}.quran-card-text[lang=ar]{font-size:20px;line-height:1.4}.qm-toolbar{padding:6px 10px}.qm-game-guide{padding:8px 12px 4px}.qm-game-guide p{min-height:0;margin:4px 0}.qm-progress{margin-bottom:9px}.qm-pause{padding:12px}.qm-pause>span{display:none}.qm-pause h2{font-size:23px}.qm-pause p{font-size:13px;margin:6px 0}.qm-pause button{display:inline-block;margin:6px;padding:10px 14px}#game-screen:has(.qm-pause:not(.hidden)) .qm-toolbar{position:static}
}

/* Solid label surfaces preserve contrast over the decorative card backgrounds. */
.qm-wrap .card-front small{background:#f2fcff;color:#124563;padding:3px 7px;border-radius:99px;line-height:1.1}
@media(max-width:600px){.qm-pause{padding:14px}.qm-pause>span{display:none}.qm-pause h2{font-size:24px}.qm-pause p{font-size:14px}.qm-pause button{font-size:14px;margin:10px auto;padding:10px 14px}}
