@import url('https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Tajawal:wght@400;500;700;800&display=swap');
:root{--ink:#173b4b;--teal:#087f80;--sea:#e7f5f4;--gold:#dcae45;--coral:#d76c55;--cream:#fffaf1;--muted:#6d7d83;--red:#d76052;--green:#3d9b6b}*{box-sizing:border-box}body{margin:0;background:linear-gradient(150deg,#eef9f5,#fff6e8 60%,#e8f2f7);color:var(--ink);font-family:Tajawal,Arial,sans-serif}.shell{max-width:1000px;margin:auto;padding:22px 14px 38px}.hero{background:var(--ink);color:#fff;border-radius:28px;padding:28px 25px;box-shadow:0 15px 35px #173b4b22}.eyebrow{color:#f4d98d;font-weight:800;font-size:.9rem}.hero h1{font-family:Amiri,serif;font-size:clamp(2.1rem,6vw,4rem);line-height:1.1;margin:9px 0}.hero p{font-size:1.05rem;line-height:1.9;max-width:760px;margin:0 0 17px}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.primary,.ghost{border:0;border-radius:13px;padding:11px 17px;font:inherit;font-weight:800;cursor:pointer;transition:.2s}.primary{background:var(--gold);color:#33250d}.ghost{background:#ffffff15;color:#fff;border:1px solid #ffffff44;text-decoration:none;display:inline-block}.primary:hover,.ghost:hover{transform:translateY(-2px)}.audio-status{margin-top:11px;color:#b7d7d5;font-size:.83rem}.map-card,.question-card,.competition{background:#fff;border-radius:22px;box-shadow:0 8px 25px #173b4b18;margin-top:19px}.map-card{padding:15px}.map-title,.question-meta{display:flex;justify-content:space-between;gap:10px;align-items:center;font-weight:800}.map-title{font-size:1.12rem;padding:4px 4px 12px;color:var(--ink)}.map-title span:last-child{color:var(--coral);font-size:.9rem}.map-stage{position:relative;border-radius:14px;overflow:hidden;background:#dceee9}.map-stage img{display:block;width:100%;height:auto}.map-stage:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 3px #fff9,inset 0 0 35px #173b4b35}.pin{position:absolute;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;background:#fff8;border:3px solid var(--teal);color:var(--ink);display:grid;place-items:center;font-weight:800;z-index:2;transition:.3s}.pin.current{background:var(--gold);border-color:#8d661c;box-shadow:0 0 0 7px #dcae4544;transform:translate(-50%,-50%) scale(1.18)}.pin.done{background:#cdeed8;border-color:var(--green)}.token{position:absolute;z-index:3;transform:translate(-50%,-50%);font-size:2.1rem;filter:drop-shadow(0 4px 3px #173b4b55);transition:all .7s cubic-bezier(.2,.8,.2,1);top:28%;left:21%}.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:.78rem;color:var(--muted);padding:10px 3px 0}.competition{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:12px}.team-card{border:2px solid #e4eceb;border-radius:15px;padding:9px;text-align:center;display:grid;grid-template-columns:1fr auto;gap:2px 8px}.team-card b{grid-row:span 2}.team-card strong{font-size:1.7rem;color:var(--teal);line-height:1}.team-card small{color:var(--muted)}.team-card.active{border-color:var(--gold);background:#fff9e9}.turn{text-align:center;font-size:.75rem;color:var(--muted)}.turn b{display:block;color:var(--coral);font-size:.95rem}.question-card{padding:18px}.progress{height:8px;background:#e8efee;border-radius:20px;overflow:hidden;margin-bottom:16px}.progress i{display:block;height:100%;width:20%;background:linear-gradient(90deg,var(--teal),var(--gold));transition:.4s}.question-meta{color:var(--muted);font-size:.86rem}.question-card h2{font-family:Amiri,serif;font-size:1.8rem;line-height:1.55;margin:9px 0 15px}.answers{display:grid;gap:9px}.answer{background:#f9fcfb;border:1px solid #c9dedb;border-radius:12px;padding:12px;text-align:right;font:inherit;color:var(--ink);cursor:pointer}.answer:hover{border-color:var(--teal);background:#effaf8}.answer.correct{background:#d9f4df;border-color:#48a85d}.answer.wrong{background:#ffe1dc;border-color:#c55b50}.answer:disabled{cursor:default}.feedback{min-height:29px;margin:13px 0 2px;font-weight:800}.next{display:block;margin-top:8px;width:100%;opacity:.55}.next.ready{opacity:1}.result{margin-top:20px;border-radius:22px;background:var(--ink);color:#fff;text-align:center;padding:28px}.result h2{font-family:Amiri,serif;font-size:2.2rem;margin:0}.result .winner{color:#f4d98d;font-size:1.35rem;font-weight:800;margin:10px}.result p{line-height:1.8}footer{text-align:center;color:var(--muted);font-size:.88rem;padding:20px 8px}@media(max-width:620px){.shell{padding:10px}.hero{padding:24px 17px}.map-title{font-size:1rem}.pin{width:25px;height:25px;font-size:.8rem}.token{font-size:1.7rem}.competition{gap:7px;padding:9px}.team-card{font-size:.8rem}.team-card strong{font-size:1.4rem}.question-card h2{font-size:1.55rem}}

html,body{width:100%;max-width:100%;overflow-x:hidden}img{max-width:100%}@media(max-width:620px){body{font-size:16px}.shell{width:100%;max-width:none;margin:0;padding:8px}.hero{width:100%;border-radius:18px;padding:22px 15px}.hero h1{font-size:clamp(2rem,11vw,3rem)}.hero p{font-size:1rem}.map-card,.question-card,.competition{width:100%;margin-top:12px}.map-card{padding:8px}.map-stage{width:100%;border-radius:10px}.map-stage img{width:100%;height:auto}.question-card{padding:15px}.primary,.ghost{padding:11px 13px}}