@font-face{font-family:FractionYekan;src:url('../fonts/BYekan.ttf');font-display:swap}.fraction-world,.fraction-world *{box-sizing:border-box;font-family:FractionYekan,Tahoma,sans-serif}.fraction-world{direction:rtl;max-width:960px;margin:20px auto;padding:16px;border:3px solid #fff;border-radius:28px;background:radial-gradient(circle at 10% 0,#b851d8,transparent 50%),linear-gradient(135deg,#563bc2,#137c90);color:#fff;box-shadow:0 8px #263752}.fraction-world header,.fraction-toolbar,.fraction-actions{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}.fraction-world header{justify-content:space-between}.fraction-world h1{font-size:30px;color:#ffe876;text-shadow:0 3px #bf4c92;margin:8px}.fraction-world a{color:white}.fraction-toolbar{margin:12px 0;font-size:17px}.fraction-toolbar select{color:#412c60;background:#fff9e7;border:2px solid #ffca51;border-radius:12px;padding:7px;font-size:16px}.fraction-actions button{color:#293b42;background:linear-gradient(#fff594,#ffc23e);border:2px solid white;border-radius:14px;padding:8px 22px;font-size:18px;font-weight:bold;box-shadow:0 4px #bb7130;cursor:pointer}.fraction-actions button:disabled{opacity:.6;cursor:default}.fraction-deck{position:relative;height:95px;margin:8px auto;width:100px}.fraction-deck i{position:absolute;inset:0 12px;background:linear-gradient(135deg,#ff5da4,#aa41e4);border:3px solid #fff;border-radius:13px;font-size:37px;text-align:center;padding-top:12px;box-shadow:0 4px #31166e;transform:rotate(-14deg)}.fraction-deck i:nth-child(2){transform:rotate(14deg);background:#ffa632}.fraction-deck i:last-child{transform:rotate(0);background:#37c0d2}.fraction-deck.dealt{height:0;opacity:0;margin:0;overflow:hidden}.fraction-world #fractionStatus{text-align:center;font-size:18px;min-height:28px;margin:12px 0}.fraction-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-width:780px;margin:auto;direction:ltr}.fraction-card{position:relative;aspect-ratio:1.2;border:0;padding:0;background:transparent;perspective:800px;cursor:pointer;min-width:0;touch-action:manipulation}.fraction-card-inner{display:block;position:absolute;inset:0;transform-style:preserve-3d;transition:transform .4s}.fraction-card.flipped .fraction-card-inner{transform:rotateY(180deg)}.fraction-back,.fraction-front{position:absolute;inset:0;border:3px solid white;border-radius:17px;backface-visibility:hidden;display:flex;align-items:center;justify-content:center;box-shadow:0 4px #20174d66}.fraction-back{background:radial-gradient(circle at 20% 10%,#ffffff88,transparent 45%),var(--card-color);font-size:38px;overflow:hidden}.fraction-back:after{content:'✦';position:absolute;right:9px;top:4px;color:#ffef79;font-size:19px}.fraction-front{transform:rotateY(180deg);background:#fffdf4;color:#40265b;padding:8px;flex-direction:column;gap:4px}.fraction-number{display:flex;flex-direction:column;align-items:center;font:bold 31px/1.05 FractionYekan,Tahoma}.fraction-number span:first-child{border-bottom:3px solid #6f3cac;padding:0 8px 3px;margin-bottom:3px}.fraction-picture{width:100%;display:grid;gap:5px}.fraction-bar{display:flex;height:24px;border:2px solid #614777;border-radius:4px;overflow:hidden;background:white}.fraction-bar span{flex:1;border-right:1px solid #614777}.fraction-bar span:last-child{border:0}.fraction-bar .filled{background:#e9549f}.fraction-card.matched .fraction-front{border-color:#68f0b2;box-shadow:0 0 15px #71ffc9aa}.fraction-card.matched:after{content:'⭐';position:absolute;right:0;top:-5px;font-size:21px}.fraction-key{text-align:center;color:#fff5c9;font-size:14px;margin:14px 0 0}.fraction-world :focus-visible{outline:3px solid #ffed4b;outline-offset:4px}.fraction-card.pop{animation:fractionPop .5s}.fraction-card.wrong{animation:fractionWiggle .3s}.fraction-card.dealing{animation:fractionDeal .5s both;animation-delay:var(--delay)}@keyframes fractionDeal{from{transform:translate(var(--dx),var(--dy)) rotate(-15deg) scale(.6);opacity:.1}to{transform:none;opacity:1}}@keyframes fractionPop{50%{transform:scale(1.07)}}@keyframes fractionWiggle{33%{transform:rotate(-3deg)}66%{transform:rotate(3deg)}}@media(max-width:600px){.fraction-world{padding:10px;margin:10px 5px}.fraction-world h1{font-size:23px}.fraction-world header{gap:5px}.fraction-toolbar{gap:8px;font-size:14px}.fraction-toolbar select{max-width:170px}.fraction-board{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.fraction-card{aspect-ratio:1.05}.fraction-back{font-size:30px}.fraction-front{padding:5px}.fraction-bar{height:18px}.fraction-number{font-size:27px}.fraction-world #fractionStatus{font-size:15px}.fraction-key{font-size:12px}}@media(prefers-reduced-motion:reduce){.fraction-card,.fraction-card-inner{animation:none!important;transition:none!important}}