:root{--petrol:#17534e;--deep:#153f3c;--cream:#f8f5eb;--gold:#9b7c37;--muted:#69786e;--line:#dce0d0;--paper:#fffdf5}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--deep);font-family:"Noto Sans Arabic",Tahoma,Arial,sans-serif;line-height:1.8}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}button:disabled{cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #ac873b;outline-offset:4px}[hidden]{display:none!important}.page{max-width:478px;margin:auto;padding:0 25px 24px}header{height:101px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:12px}.brand{display:flex;align-items:center;gap:11px;text-decoration:none}.brand img{width:57px;height:64px;object-fit:contain}.brand strong{font-size:16px;display:block}.brand small{font-size:10px;color:var(--muted);display:block}.back{font-size:12px;text-decoration:none;white-space:nowrap;padding:12px 0}.back span{font-size:20px;margin-left:5px}.eyebrow{color:var(--gold);font-size:11px;font-weight:650;margin:24px 0 4px}h1{font-size:31px;margin:0;line-height:1.6;font-weight:750;letter-spacing:-.5px}.intro{font-size:13px;line-height:1.9;color:var(--muted);margin:3px 0 20px}.headrow{display:flex;align-items:center;justify-content:space-between;gap:10px}.pill{font-size:11px;border:1px solid var(--line);background:var(--paper);border-radius:50px;padding:4px 10px;white-space:nowrap}.stats{display:flex;align-items:center;justify-content:space-around;background:#eeefe5;border:1px solid #e3e5d8;border-radius:16px;min-height:75px;margin-bottom:21px;padding:10px}.stat{text-align:center;min-width:100px}.stat+.stat{border-right:1px solid #d8ded1}.stat strong{font-size:23px;line-height:1.3;display:block}.stat span{font-size:11px;color:var(--muted)}footer{margin-top:27px;display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:10px;border-top:1px solid var(--line);padding-top:16px;gap:10px}.primary,.secondary{font-size:14px;font-weight:600;border-radius:13px;min-height:49px;width:100%;display:flex;gap:9px;align-items:center;justify-content:center;text-decoration:none}.primary{background:var(--petrol);color:#fffbef;border:1px solid var(--petrol)}.secondary{background:transparent;color:#325a52;border:1px solid #bccab9}.note{display:flex;gap:10px;align-items:center;background:#f0eee1;border:1px solid #e4e2d2;border-radius:13px;padding:12px 14px;font-size:11px;line-height:1.9;color:var(--muted);margin:18px 0}.note b{display:block;font-size:13px;color:#456357}.note .mark{color:#a1823c;font-size:23px}.memory{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.card{aspect-ratio:1.05;min-height:85px;border-radius:17px;position:relative;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 0 #dfe2d5;background:var(--petrol);border:1px solid #0d4541;overflow:hidden;padding:7px;transition:transform .18s,background .18s}.card:not(:disabled):active{transform:scale(.96)}.card.backcard:after{content:"";position:absolute;width:100px;height:100px;border:1px solid #38716a;transform:rotate(35deg);border-radius:23px}.card.backcard:before{content:"";position:absolute;width:73px;height:73px;border:1px solid #28655f;transform:rotate(35deg);border-radius:18px}.card .motif{z-index:1;width:31px;height:34px;opacity:.9}.card.open{background:var(--paper);border:1px solid #dbe0cd;box-shadow:0 3px 0 #e1e4d5;flex-direction:column;gap:2px}.card.matched{background:#ecf1df;border:1.5px solid #9dad7b;box-shadow:0 3px 0 #d4ddbf}.card .icon{width:52%;max-height:58px}.card small{font-size:10px;color:#50673f}.check{position:absolute;top:6px;right:9px;color:#52722c;font-size:12px}.segment{display:flex;background:#eaece1;padding:5px;border:1px solid #dfe3d3;border-radius:13px;margin:0 0 19px;gap:5px}.segment button{flex:1;display:flex;align-items:center;justify-content:center;font-size:13px;min-height:42px;border-radius:9px;color:#566a59;background:transparent;border:0}.segment button[aria-pressed=true]{background:var(--paper);color:#174d47;box-shadow:0 2px 6px #163e3c12;font-weight:650}.turn{border:1px solid #d9e1cb;border-radius:14px;background:#ecf0e1;display:flex;align-items:center;gap:12px;padding:13px 15px;margin-bottom:17px;min-height:77px}.turn .xmark{font:400 29px Arial;color:#19564f;min-width:25px;text-align:center}.turn strong{font-size:14px;display:block}.turn small{font-size:11px;color:var(--muted)}.turn .dot{width:7px;height:7px;background:#97a56d;border-radius:50%;margin-right:auto}.ttt{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;direction:ltr;margin:20px 0}.square{aspect-ratio:1;min-height:90px;border:1px solid var(--line);border-radius:18px;background:var(--paper);box-shadow:0 4px 0 #e7e7db;display:flex;align-items:center;justify-content:center;padding:0;transition:background .2s,transform .15s}.square svg{width:50%;height:50%}.square:not(:disabled):hover{background:#eeefdf}.square:not(:disabled):active{transform:scale(.96)}.square.won{background:#e3ebd1;border-color:#a1b17b}.score{display:flex;justify-content:space-around;text-align:center;margin:23px 0}.score strong{font-size:23px;display:block}.score small{color:var(--muted);font-size:11px}.score .gold{color:#a7893e}.legend{font-size:11px;line-height:1.9;color:var(--muted);text-align:center;margin:14px 0 0}.rules{font-size:12px;color:var(--muted);margin-top:20px}.rules summary{cursor:pointer;padding:10px 0;color:#456357}.rules p{margin:4px 0}.win-note{background:#e5ecd5;border-color:#b6c691}.hub{max-width:1130px;margin:auto;padding:0 28px 30px}.hub header{height:108px}.hub-intro{padding:55px 0 32px;max-width:630px}.hub h1{font-size:49px;line-height:1.5}.hub-intro .intro{font-size:16px;margin:13px 0}.hub-games{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.game-tile{background:#fffdf5;border:1px solid var(--line);border-radius:24px;overflow:hidden;text-decoration:none;display:block;transition:transform .2s,box-shadow .2s}.game-tile:hover{transform:translateY(-4px);box-shadow:0 16px 32px #163e3c0c}.tile-art{height:194px;display:flex;align-items:center;justify-content:center;background:#e9eedf;gap:9px}.tile-copy{padding:23px}.tile-copy h2{font-size:23px;margin:3px 0 7px}.tile-copy p{font-size:12px;color:var(--muted);margin:0 0 20px;min-height:46px}.tile-copy .type{font-size:10px;color:var(--gold)}.tile-cta{color:var(--petrol);font-size:14px;font-weight:650;display:flex;justify-content:space-between}.mini-card{background:var(--petrol);border-radius:13px;padding:17px;box-shadow:0 5px 0 #cdd9bc}.mini-card svg{width:34px;height:40px}.mini-card.open{background:#fffdf5;border:1px solid #bbc7aa}.mini-ttt{display:grid;grid-template-columns:repeat(3,40px);gap:7px;direction:ltr}.mini-ttt span{width:40px;height:40px;border-radius:8px;background:#fffdf5;display:grid;place-items:center}.mini-ttt svg{width:28px;height:28px}.hub-banner{display:flex;justify-content:space-between;gap:20px;margin:31px 0 0;padding:21px 25px;border:1px solid #dce1cf;background:#eff0e4;border-radius:16px;font-size:12px;color:#647661}.hub-banner strong{color:#325b4e}.error{color:#923e39;text-align:center}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}@media(max-width:750px){.hub{padding:0 22px 24px}.hub header .pill{display:none}.hub-intro{padding:30px 0 20px}.hub h1{font-size:36px}.hub-games{grid-template-columns:1fr;gap:19px}.game-tile{display:grid;grid-template-columns:115px 1fr;direction:rtl}.tile-art{height:100%;min-height:210px;padding:12px;flex-wrap:wrap}.tile-copy{padding:17px}.tile-copy h2{font-size:21px}.tile-copy p{margin-bottom:12px}.mini-card{padding:10px}.mini-card svg{width:23px;height:26px}.mini-ttt{grid-template-columns:repeat(3,24px);gap:4px}.mini-ttt span{width:24px;height:28px}.mini-ttt svg{width:20px;height:20px}.hub-banner{display:block;padding:17px}.hub-banner span{display:block;margin-top:5px}}@media(max-width:370px){.page{padding:0 17px 20px}.brand{gap:7px}.brand strong{font-size:14px}.brand img{width:48px;height:58px}.memory,.ttt{gap:9px}.card{min-height:75px}.square{min-height:80px}h1{font-size:28px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
