@font-face{font-family:Tajawal;src:url('assets/Tajawal-Regular.ttf')}@font-face{font-family:Tajawal;src:url('assets/Tajawal-Bold.ttf');font-weight:700}
:root{--ink:#173c3a;--teal:#146d63;--mint:#a7e2ce;--gold:#e8bc6e;--cream:#fff9ed;--line:rgba(255,255,255,.36);--shadow:0 15px 60px #143c3a25;font-family:Tajawal,Arial,sans-serif;color:var(--ink);font-synthesis:none}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none;background:#d8e6e0}body{touch-action:none}button,a,input,select{font:inherit}button{cursor:pointer;color:inherit;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #f3c56d;outline-offset:4px}button:disabled{cursor:default;opacity:.5}button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}button{border:0}button:active{transform:scale(.97)}.hidden{display:none!important}#world{display:block;position:fixed;inset:0;width:100%;height:100%;outline:0}#shade{position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 30%,#ebdfc2bb 72%,#f4e7ceeb);transition:opacity .6s}.screen{position:fixed;inset:0}.glass{background:rgba(255,250,238,.93);border:1px solid #fff8;box-shadow:var(--shadow);backdrop-filter:blur(18px)}.menu-header{position:absolute;top:max(30px,env(safe-area-inset-top));right:4vw;left:4vw;display:flex;align-items:center;justify-content:space-between}.brand-mini{font-size:14px;font-weight:700;letter-spacing:.4px;display:flex;align-items:center;gap:12px}.star-mark{color:var(--teal);font-size:29px;font-style:normal}.icon-button{height:48px;width:48px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;background:#fff9e9ed;border:1px solid #fff8;box-shadow:0 3px 12px #183e3620}.hero-copy{position:absolute;right:8vw;top:17vh;max-width:430px}.eyebrow{display:flex;align-items:center;gap:10px;font-size:15px;color:#42685d}.eyebrow span{display:block;width:25px;height:2px;background:#8aa690}h1{font-size:clamp(74px,8.2vw,126px);line-height:.98;letter-spacing:-3px;margin:25px 0;color:#14685e;text-shadow:0 3px 0 #fbf3e3;font-weight:700}h1 span{display:block;color:#a8692e;margin-right:49px;margin-top:2px}.hero-copy p{font-size:19px;line-height:1.7;margin-top:25px;color:#36594f}.launch-card{position:absolute;left:6vw;bottom:12vh;width:380px;padding:24px;border-radius:26px}.launch-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;font-weight:700;font-size:18px}.tiny-pill{font-size:11px;background:#e6eee3;padding:6px 9px;border-radius:20px;font-weight:400;color:#567569}.character-choice{display:flex;gap:9px;margin-bottom:16px}.character{background:#fffdf8;border:1px solid #d6dfd4;border-radius:14px;display:flex;align-items:center;gap:8px;padding:12px 8px;flex:1;text-align:right;position:relative}.character.active{border:2px solid #2c9180;padding:11px 7px;background:#ecf5eb}.character b{position:absolute;left:5px;top:4px;font-size:12px;color:#2a8c7a;opacity:0}.character.active b{opacity:1}.character span:not(.portrait){font-weight:700;font-size:16px}.character small{display:block;font-size:10px;font-weight:400;margin-top:4px}.portrait{width:40px;height:45px;position:relative;border-radius:50% 50% 35% 35%;background:#38a69c;overflow:hidden;flex-shrink:0}.portrait:before{content:'';position:absolute;width:25px;height:28px;border-radius:40% 40% 50% 50%;background:#dca678;top:4px;left:7px;border-top:8px solid #42322d;z-index:2}.portrait:after{content:'••';position:absolute;top:13px;left:13px;color:#483128;font-size:11px;letter-spacing:4px;z-index:3}.portrait.girl{background:#e6b555}.portrait.girl:before{border-left:4px solid #42322d;border-right:4px solid #42322d;width:29px;left:5px}.button{display:flex;align-items:center;justify-content:center;gap:12px;border-radius:14px;padding:15px 23px;min-height:54px;font-weight:700;font-size:18px;transition:transform .15s,background .15s}.button.primary{background:#146d63;color:#fff6de;box-shadow:0 6px 0 #0b514a,0 9px 18px #103b3625}.button.primary:hover{background:#208675}.button.secondary{background:#e9efdf;color:#285e51;border:1px solid #ccdbcb}.button.outline{background:transparent;border:1px solid #bfd0c4}.button.gold{background:#efca86}.button .arrow{margin-right:auto;font-size:25px}#start-button{width:100%}.launch-links{display:flex;justify-content:center;gap:12px;margin-top:20px;align-items:center;font-size:13px;color:#6a7d6c}.launch-links button{background:none;padding:5px 0}.menu-footer{position:absolute;bottom:max(25px,env(safe-area-inset-bottom));left:4vw;right:4vw;display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#516b5e}.menu-footer b{padding:0 12px;font-weight:400;opacity:.5}.build-badge{background:#f7f4e9aa;border:1px solid #fff7;border-radius:30px;padding:7px 12px;font-size:11px}#loading{position:fixed;inset:0;background:#153f3c;z-index:100;color:#ffefcd;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}#loading strong{font-size:24px}#loading span{font-size:14px;opacity:.65}.load-symbol{font-size:75px;color:#e7bb73;animation:breathe 1.5s ease-in-out infinite}.load-line{width:100px;height:3px;background:#d7b77655;margin-top:20px;overflow:hidden;border-radius:5px}.load-line:after{content:'';display:block;width:40px;height:100%;background:#d7b776;animation:slide 1s infinite}@keyframes breathe{50%{transform:scale(.85);opacity:.55}}@keyframes slide{to{transform:translateX(-110px)}}
#hud{position:fixed;inset:0;pointer-events:none}.hud-top{display:flex;justify-content:space-between;align-items:center;position:absolute;top:max(20px,env(safe-area-inset-top));left:24px;right:24px;direction:ltr}.hud-buttons{display:flex;gap:8px;pointer-events:auto}.wallet{background:#fff8e9ed;border:1px solid #fff;border-radius:30px;padding:10px 17px;display:flex;align-items:center;gap:9px;min-height:45px;box-shadow:0 3px 12px #183e3610;direction:rtl}.wallet span{color:#ba833e;font-size:20px}.wallet b{font-size:18px}.quest-card{position:absolute;right:24px;top:88px;width:310px;border-radius:20px;padding:17px 20px;pointer-events:auto}.quest-top{display:flex;justify-content:space-between;align-items:center;color:#85907a;font-size:12px}.quest-top button{background:#e9eddd;border-radius:50%;width:36px;height:36px;font-size:18px;font-weight:700;margin:-9px -9px -6px -9px;color:#52745f}.quest-card h2{font-size:22px;margin:12px 0 6px}.quest-card p{font-size:13px;line-height:1.55;margin:0;max-width:250px;color:#637b6d}.quest-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:12px;min-height:9px}.quest-dots{display:flex;gap:5px}.quest-dots i{height:5px;width:24px;border-radius:10px;background:#dce3d4}.quest-dots i.done{background:#2f8f7b}.quest-dots i.active{background:#e7b56b}.quest-bottom>span{font-size:12px;color:#43836d}.compass{position:absolute;left:30px;top:90px;width:58px;min-height:69px;border-radius:22px;background:#fff9e9de;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #fff;color:#2b7f70}.compass>span{font-size:26px;display:block;transition:transform .15s}.compass small{font-size:10px;color:#65786a}.action-button{position:absolute;bottom:max(45px,env(safe-area-inset-bottom));right:42px;pointer-events:auto;width:102px;height:102px;border-radius:50%;border:5px solid #fff2d3;background:linear-gradient(140deg,#408e7b,#125c55);color:#fff5df;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;box-shadow:0 6px 0 #0e4c47,0 8px 25px #193f3430;transition:all .15s}.action-button .action-symbol{font-size:26px}.action-button b{font-size:16px}.action-button.ready{box-shadow:0 0 0 7px #f9d98d77,0 6px 0 #0e4c47,0 8px 25px #193f3430}.action-button:disabled{opacity:.5}#joystick{position:absolute;left:44px;bottom:max(46px,env(safe-area-inset-bottom));height:112px;width:112px;border-radius:50%;background:#fff7df3d;border:2px solid #fff8;pointer-events:auto;touch-action:none;direction:ltr;user-select:none}.stick-ring{position:absolute;inset:16px;border:1px solid #fff5;border-radius:50%}#stick{width:48px;height:48px;border-radius:50%;background:#f8eed0d9;border:2px solid #fff9;position:absolute;top:30px;left:30px;box-shadow:0 4px 8px #234b3933}#joystick small{position:absolute;top:118px;width:100%;text-align:center;font-size:11px;color:#355c4c;text-shadow:0 1px #fffa}.keyboard-help{position:absolute;bottom:17px;left:50%;transform:translateX(-50%);color:#294e40;font-size:11px;background:#fff8e2b0;border-radius:30px;padding:6px 14px;white-space:nowrap}.keyboard-help span{margin:0 8px;opacity:.5}#area-label{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);text-align:center;color:#fff9e8;text-shadow:0 2px 15px #123a2c;opacity:0;transition:opacity 1s;pointer-events:none}#area-label span{font-size:44px;display:block;font-weight:700}#area-label small{font-size:15px}#area-label.visible{opacity:1}#toast{position:absolute;top:52%;left:50%;transform:translate(-50%,-50%) translateY(10px);background:#143f38f0;color:#fff4d9;padding:13px 23px;border:1px solid #8ab29a77;border-radius:40px;font-size:16px;max-width:80%;text-align:center;opacity:0;transition:opacity .2s,transform .2s;box-shadow:0 8px 30px #163b3722}#toast.visible{opacity:1;transform:translate(-50%,-50%)}
.overlay{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:24px;background:#153c3a70;backdrop-filter:blur(7px);touch-action:pan-y}.modal{position:relative;background:var(--cream);border:1px solid #fff7;border-radius:28px;box-shadow:0 20px 100px #0d2e3870;padding:32px;width:min(520px,100%);max-height:92dvh;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;animation:appear .25s ease-out}.modal.wide{width:min(850px,100%)}@keyframes appear{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.close-modal{position:absolute;top:15px;left:15px;width:44px;height:44px;border-radius:50%;background:#e9eadd;font-size:27px;line-height:1;z-index:2}.modal .eyebrow{font-size:12px;color:#81907c}.modal h2{font-size:32px;line-height:1.25;margin:10px 0 12px}.modal p{line-height:1.8;color:#677c6b;font-size:15px}.modal .button{width:100%;margin-top:14px}.modal .button.small{min-height:45px;font-size:15px}.modal-icon{height:75px;width:75px;background:#e7efde;color:#2a7a68;border-radius:24px;display:flex;align-items:center;justify-content:center;font-size:39px;margin:0 auto 18px}.center{text-align:center}.stars{color:#d6a14b;font-size:42px;letter-spacing:8px;direction:ltr;margin:20px 0}.stars .empty{color:#ddd8bf}.stats-row{display:flex;justify-content:center;gap:10px;margin:20px 0}.stat{border:1px solid #e0e4d5;background:#f4f4e6;padding:12px 20px;border-radius:14px;flex:1;text-align:center}.stat b{font-size:24px;display:block;color:#307a66}.stat small{font-size:11px;color:#87927d}.dialogue-face{display:flex;gap:13px;align-items:center}.speaker-orb{width:55px;height:55px;display:flex;align-items:center;justify-content:center;background:#dcebdc;color:#296d5f;border:3px solid #eac580;border-radius:50%;font-size:26px}.dialogue-face strong{font-size:21px}.dialogue-text{min-height:90px;margin-top:22px!important;font-size:19px!important;color:#345f4f!important}.step-indicator{font-size:11px;color:#80917a}.puzzle-hint{background:#eaf0df;border-radius:12px;padding:12px 15px;font-size:13px;line-height:1.7;color:#4f725b;margin-top:15px}.puzzle-status{min-height:26px;color:#a46632;font-size:14px;margin-top:12px;text-align:center}.puzzle-options,.slots{display:flex;justify-content:center;gap:12px;margin:20px 0;direction:ltr}.symbol-btn,.slot{width:72px;height:76px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:34px;background:#e5edde;border:2px solid #d1ddc8;box-shadow:0 4px 0 #c1d1bc}.slot{background:#fffdf6;border:2px dashed #c4cdbb;box-shadow:none;font-size:28px}.symbol-btn.selected,.symbol-btn.flash{background:#efd39a;border-color:#c69643;transform:translateY(-3px);box-shadow:0 5px 0 #bc9146}.symbol-btn.correct{background:#b5ddc0;border-color:#6a9d7f}.puzzle-options.wrap{flex-wrap:wrap}.symbol-btn.fruit{font-size:17px;flex-direction:column;width:90px;height:94px;gap:7px}.fruit-art{width:34px;height:34px;border-radius:50%;background:#f6a13a;box-shadow:inset -5px -4px #c879241f;position:relative}.fruit-art:before{content:'';position:absolute;top:-5px;left:17px;width:13px;height:7px;border-radius:70% 10%;background:#4b9471;transform:rotate(-25deg)}.fruit-art.berry{background:#df665b;border-radius:45% 45% 60% 60%;height:31px}.fruit-art.mango{background:#edc458;border-radius:60% 40% 55% 45%;width:29px;height:37px}.order-card{background:#fffdf6;border:1px solid #e4dfcc;border-radius:18px;padding:20px;text-align:center;margin:15px 0}.order-card strong{font-size:25px;color:#336f59}.order-card small{display:block;color:#8b947f;font-size:12px;margin-bottom:7px}.order-progress{display:flex;justify-content:center;gap:7px}.order-progress i{width:10px;height:10px;background:#dfe2d0;border-radius:50%}.order-progress i.done{background:#4d967b}.route-map{position:relative;height:230px;background:#edf2e5;border-radius:18px;margin:20px 0;direction:ltr}.route-map svg{position:absolute;inset:0;width:100%;height:100%}.route-node{position:absolute;transform:translate(-50%,-50%);width:77px;min-height:62px;border:3px solid #b7cec0;border-radius:16px;background:#fffcf2;font-size:14px;color:#366b58;z-index:2}.route-node:active{transform:translate(-50%,-50%) scale(.97)}.route-node.selected{background:#2d8471;color:white;border-color:#efd192}.route-node small{display:block;font-size:10px;opacity:.65}.route-chain{min-height:24px;text-align:center;color:#517d64;font-size:14px}.bulbs{display:flex;justify-content:center;gap:20px;margin:25px 0}.bulb{height:68px;width:48px;background:#b9c5bd;border:5px solid #d8d9c5;border-radius:22px 22px 14px 14px;box-shadow:inset 0 0 10px #54665c25;position:relative}.bulb:after{content:'';position:absolute;bottom:-11px;left:11px;width:16px;height:9px;background:#b49565;border-radius:0 0 5px 5px}.bulb.on{background:#ffe4a2;box-shadow:0 0 35px #ffd47a,inset 0 0 10px white;border-color:#e4b56b}.map-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:28px 0 10px}.district-card{background:#e8eddf;border-radius:20px;border:1px solid #d4dccb;padding:18px;text-align:right;position:relative;overflow:hidden}.district-card:disabled{opacity:.62}.district-art{height:120px;position:relative;margin:-18px -18px 15px;background:linear-gradient(#b7dacc,#e3d5b3);overflow:hidden}.district-art:before{content:'';position:absolute;bottom:0;width:70%;height:80px;background:#cead81;left:15%;clip-path:polygon(0 100%,0 20%,15% 20%,15% 0,60% 0,60% 40%,100% 40%,100% 100%)}.district-art:after{content:'✦';position:absolute;top:18px;left:20px;font-size:40px;color:#fff0ba}.district-art.mall{background:linear-gradient(#98ccc4,#d9e9dd)}.district-art.mall:before{background:#4f9c8e;clip-path:polygon(0 100%,0 30%,20% 30%,20% 10%,80% 10%,80% 30%,100% 30%,100% 100%)}.district-art.metro{background:linear-gradient(#9ebbd1,#d4e6e4)}.district-art.metro:before{background:#56859a;clip-path:polygon(0 100%,0 60%,10% 10%,90% 10%,100% 60%,100% 100%)}.district-card h3{font-size:24px;margin:8px 0}.district-card p{font-size:12px;line-height:1.6;min-height:36px;margin:4px 0}.district-card .small-label{font-size:10px;color:#81917b}.district-card .mini-stars{color:#bd8e43;letter-spacing:4px;font-size:20px}.district-card .lock{font-size:12px;color:#7d8c79}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #e4e6d7;padding:15px 0}.settings-row label{font-size:16px}.settings-row small{font-size:11px;color:#8a9683;display:block;margin-top:6px}.settings-row input[type=checkbox]{appearance:none;width:47px;height:27px;background:#c7d0c1;border-radius:25px;position:relative;cursor:pointer;flex-shrink:0;direction:ltr}.settings-row input[type=checkbox]:before{content:'';position:absolute;left:4px;top:4px;width:19px;height:19px;border-radius:50%;background:#fff;transition:transform .2s}.settings-row input:checked{background:#3f8c73}.settings-row input:checked:before{transform:translateX(20px)}.settings-row select{max-width:150px;min-height:42px;border:1px solid #c9d5c3;border-radius:10px;background:#f4f5e9;padding:7px 12px;color:#326650}.small-links{display:flex;gap:20px;justify-content:center;margin-top:24px;font-size:12px}.small-links a{color:#688871}.danger{color:#b16c54!important}.tabs{display:flex;gap:7px;background:#eaeddf;padding:5px;border-radius:14px;margin:20px 0}.tabs button{background:none;border-radius:10px;padding:10px;flex:1;font-size:14px}.tabs button.active{background:#fffbee;color:#266a55;box-shadow:0 3px 10px #254d3d10}.achievement-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.achievement{border:1px solid #e0e5d4;border-radius:17px;padding:17px 10px;text-align:center;opacity:.45;background:#f4f3e7}.achievement.unlocked{opacity:1;background:#edf2e2;border-color:#c8d6be}.achievement>span{font-size:32px;color:#bd944f}.achievement h4{font-size:15px;margin:10px 0 6px}.achievement p{font-size:11px;line-height:1.5;margin:0}.wardrobe-grid{display:flex;gap:12px}.outfit-card{border:1px solid #d5ddcd;border-radius:18px;background:#eff2e5;padding:20px 12px;flex:1;text-align:center}.outfit-card .swatch{display:block;width:52px;height:57px;margin:0 auto 10px;border-radius:17px 17px 10px 10px;border:4px solid #fff7}.outfit-card h4{font-size:14px;margin:10px 0}.outfit-card small{font-size:11px}.outfit-card .button{padding:8px;min-height:41px;font-size:12px}.mission-list{list-style:none;margin:0;padding:0}.mission-list li{padding:15px 0;border-bottom:1px solid #e0e5d7;display:flex;gap:12px;align-items:center;color:#8b9583;font-size:15px}.mission-list li.done{color:#35775c}.mission-list li>span{background:#e5ebdb;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;font-size:13px}.modal-footer-note{font-size:11px!important;color:#8c9785!important}.tutorial-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.tutorial-card{background:#edf1e2;border-radius:16px;padding:18px}.tutorial-card strong{display:block;font-size:17px}.tutorial-card p{font-size:12px;margin:7px 0 0}.tutorial-card .hint-icon{font-size:33px;color:#438d75;margin-bottom:12px}.difficulty-choice{display:flex;gap:8px}.difficulty-choice button{flex:1;background:#e9eddf;border:1px solid #d8e0cf;border-radius:13px;padding:12px 8px;font-size:14px}.difficulty-choice button.active{background:#2e7e69;color:white;border-color:#2e7e69}.difficulty-choice small{display:block;font-size:10px;opacity:.7;margin-top:5px}#save-warning{position:fixed;bottom:5px;left:15%;right:15%;font-size:11px;padding:8px;background:#f7dfb2;z-index:99;text-align:center;border-radius:7px}.reduced-motion *{animation:none!important;transition:none!important}
@media(max-width:720px){#shade{background:linear-gradient(0deg,#e9ddc3ee 0%,#ede1c695 24%,transparent 58%,#e5e3ca65 95%)}.menu-header{top:max(20px,env(safe-area-inset-top));left:22px;right:22px}.hero-copy{top:12vh;right:25px}.eyebrow{font-size:12px}.hero-copy h1{font-size:73px;line-height:.94;margin:16px 0 12px}.hero-copy h1 span{margin-right:35px}.hero-copy p{font-size:14px;line-height:1.5;margin-top:12px}.launch-card{width:auto;right:20px;left:20px;bottom:70px;padding:20px;border-radius:24px}.launch-heading{font-size:17px;margin-bottom:13px}.menu-footer{bottom:22px;left:23px;right:23px;font-size:10px}.menu-footer b{padding:0 5px}.build-badge{font-size:9px;padding:6px 8px}.hud-top{left:15px;right:15px;top:max(14px,env(safe-area-inset-top))}.hud-buttons{gap:6px}.icon-button{height:44px;width:44px;border-radius:14px}.wallet{min-height:42px;padding:8px 13px}.quest-card{right:15px;top:73px;width:min(275px,75vw);padding:14px 16px;border-radius:18px}.quest-card h2{font-size:20px;margin-top:10px}.quest-card p{font-size:12px}.quest-top{font-size:11px}.quest-top button{width:34px;height:34px}.compass{left:15px;top:76px;width:48px;min-height:62px}.action-button{width:88px;height:88px;right:26px;bottom:max(43px,env(safe-area-inset-bottom));border-width:4px}.action-button b{font-size:14px}#joystick{left:25px;bottom:max(40px,env(safe-area-inset-bottom));height:105px;width:105px}#stick{left:26px;top:26px}#joystick small{top:112px}.keyboard-help{display:none}.overlay{padding:14px}.modal{padding:26px 22px;border-radius:23px;max-height:92dvh}.modal h2{font-size:27px}.modal p{font-size:14px}.map-grid{grid-template-columns:1fr;gap:10px;margin-top:20px}.district-card{padding:16px 120px 13px 15px;min-height:120px}.district-art{position:absolute;right:0;top:0;bottom:0;width:105px;height:auto;margin:0}.district-card h3{font-size:22px;margin:3px 0}.district-card p{min-height:0;font-size:11px}.district-art:before{width:85%;left:7%}.district-card .mini-stars{position:absolute;left:14px;top:19px;font-size:16px}.achievement-grid{grid-template-columns:repeat(2,1fr)}.wardrobe-grid{gap:8px}.outfit-card{padding:15px 7px}.outfit-card h4{font-size:12px}.outfit-card .swatch{width:44px;height:49px}.symbol-btn,.slot{width:62px;height:67px}.route-map{height:210px}.route-node{width:64px;font-size:12px}.dialogue-text{font-size:18px!important}#toast{font-size:14px;max-width:88%;padding:12px 20px;width:max-content}#area-label span{font-size:36px}.stats-row{gap:6px}.stat{padding:10px}.stat b{font-size:21px}}
@media(max-height:620px) and (min-width:600px){.hero-copy{top:17vh;right:7vw}.hero-copy h1{font-size:80px}.hero-copy p{font-size:14px}.launch-card{bottom:70px;width:320px;padding:18px;left:5vw}.menu-header{top:14px}.quest-card{top:72px;width:275px;padding:12px 16px}.quest-card p{font-size:11px}.quest-card h2{font-size:19px}.action-button{width:82px;height:82px;bottom:30px}#joystick{width:98px;height:98px;bottom:30px}#stick{left:23px;top:23px}#joystick small{display:none}.modal{max-height:90vh}.menu-footer{bottom:15px}.keyboard-help{bottom:8px;font-size:9px}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

.compass{pointer-events:auto;cursor:pointer;min-width:48px;min-height:72px}.quest-top button{min-width:44px;min-height:44px}.settings-row input{min-height:27px}@media(max-width:720px){.icon-button{width:48px;height:48px}.quest-card{top:78px}.quest-top button{min-width:44px;min-height:44px}}

/* 0.2: compact teal/gold HUD leaves more of Riyadh visible. */
.quest-card{width:285px;background:#124b4ce8;border:1px solid #e4bd7080;box-shadow:0 8px 24px #12312c2e;color:#fff2d9;padding:14px 18px}.quest-card h2{font-size:21px;margin-top:9px}.quest-card p,.quest-top,.quest-bottom>span{color:#d5e8dc}.quest-top button{background:#efce8a;color:#164d47}.quest-dots i{background:#ffffff32}.quest-dots i.active{background:#f0c778}#shade{background:linear-gradient(90deg,transparent 40%,#f2e4c478 77%,#f4e7cebb)}
@media(max-width:720px){.quest-card{width:min(270px,72vw);padding:11px 14px}.quest-card h2{font-size:19px}.quest-card p{font-size:12px}.quest-bottom{margin-top:8px}#shade{background:linear-gradient(0deg,#e9ddc3ee,transparent 48%,#ede1c633 70%,#ede1c688)}.hero-copy{top:10vh}.hero-copy h1{font-size:64px}.hero-copy p{font-size:13px}.launch-card{padding:16px;bottom:64px}}