@import"https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Nunito:wght@400;600;700;800&family=Changa:wght@400;500;600;700;800&display=swap";/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}.invisible{visibility:hidden}.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.static{position:static}.contents{display:contents}.flex{display:flex}.grid{display:grid}.inline{display:inline}.table{display:table}.grow{flex-grow:1}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.border{border-style:var(--tw-border-style);border-width:1px}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}:root{--font-display:"Fredoka","Comic Sans MS",cursive,sans-serif;--font-body:"Nunito","Comic Sans MS",sans-serif;--font-arabic:"Changa","Arial",sans-serif;--color-candy-pink:#ff6b9d;--color-candy-orange:#ff9f43;--color-candy-yellow:#feca57;--color-candy-green:#5cd85a;--color-candy-blue:#54a0ff;--color-candy-purple:#a55eea;--color-bg-primary:#fff8e7;--color-bg-secondary:#fffdf7;--color-text-primary:#2d3436;--color-text-secondary:#636e72;--color-shadow:#2d34361a;--color-shadow-strong:#2d343633;--gradient-rainbow:linear-gradient(135deg,var(--color-candy-pink)0%,var(--color-candy-orange)25%,var(--color-candy-yellow)50%,var(--color-candy-green)75%,var(--color-candy-blue)100%);--gradient-header:linear-gradient(135deg,#667eea 0%,#764ba2 100%);--radius-soft:16px;--radius-round:24px;--radius-pill:9999px;--bounce:cubic-bezier(.68,-.55,.265,1.55);--smooth:cubic-bezier(.4,0,.2,1)}*{box-sizing:border-box}html{font-family:var(--font-body);color:var(--color-text-primary);background-color:var(--color-bg-primary);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:500;line-height:1.6}body{background:var(--color-bg-primary);min-width:320px;min-height:100vh;margin:0;padding:0}#root{min-height:100vh}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:600;line-height:1.2}button{font-family:var(--font-body);border-radius:var(--radius-round);transition:all .3s var(--bounce);font-weight:700}button:focus,button:focus-visible{outline:3px solid var(--color-candy-blue);outline-offset:2px}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes wiggle{0%,to{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}@keyframes pop-in{0%{opacity:0;transform:scale(.8)}50%{transform:scale(1.05)}to{opacity:1;transform:scale(1)}}@keyframes bounce-in{0%{transform:scale(0)}50%{transform:scale(1.1)}70%{transform:scale(.95)}to{transform:scale(1)}}.lang-ar{direction:rtl}.lang-ar .flashcard-name,.lang-ar .number-display{font-family:var(--font-arabic)!important}.lang-ar .app-header h1,.lang-ar .subtitle{font-family:var(--font-arabic)}@media print{*{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;color-adjust:exact!important}html,body{background:#fff!important;margin:0!important;padding:0!important}#root{min-height:auto!important}.app-header,.flashcard-grid,.hide-on-screen,.show:not(.print-container){visibility:hidden!important;display:none!important}.app{background:#fff!important;min-height:auto!important}.app-main{min-height:auto!important}.print-container,.print-container .print-view{visibility:visible!important;display:block!important}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}.language-selector{display:flex;gap:.25rem;background:#fff;border-radius:var(--radius-pill);padding:4px;box-shadow:0 4px 15px var(--color-shadow);border:2px solid #E8E8E8}.lang-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:none;background:transparent;border-radius:50%;cursor:pointer;transition:all .3s var(--bounce);padding:0}.lang-btn:hover{background:#a55eea1a;transform:scale(1.1)}.lang-btn.active{background:linear-gradient(135deg,var(--color-candy-purple),var(--color-candy-pink));box-shadow:0 4px 12px #a55eea59}.lang-flag{font-size:1.4rem;line-height:1}.select-wrapper{position:relative;display:inline-block}.category-select{-moz-appearance:none;appearance:none;-webkit-appearance:none;background:#fff;border:3px solid var(--color-candy-purple);border-radius:var(--radius-round);padding:.75rem 2.5rem .75rem 1.25rem;font-family:var(--font-body);font-size:1rem;font-weight:700;color:var(--color-text-primary);cursor:pointer;min-width:180px;box-shadow:0 4px 15px #a55eea33;transition:all .3s var(--bounce)}.category-select:hover{border-color:var(--color-candy-pink);transform:translateY(-2px);box-shadow:0 6px 20px #ff6b9d40}.category-select:focus{outline:none;border-color:var(--color-candy-blue);box-shadow:0 0 0 3px #54a0ff4d,0 6px 20px #54a0ff33}.select-arrow{position:absolute;right:1rem;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--color-candy-purple);transition:transform .3s var(--bounce)}.category-select:focus+.select-arrow{transform:translateY(-50%) rotate(180deg)}.view-buttons{display:flex;background:#fff;border-radius:var(--radius-round);padding:4px;box-shadow:0 4px 15px var(--color-shadow);border:2px solid #E8E8E8}.view-btn{display:flex;align-items:center;gap:.5rem;padding:.6rem 1rem;border:none;background:transparent;border-radius:calc(var(--radius-round) - 4px);font-family:var(--font-body);font-size:.9rem;font-weight:700;color:var(--color-text-secondary);cursor:pointer;transition:all .3s var(--bounce)}.view-btn:hover{color:var(--color-candy-purple);background:#a55eea14}.view-btn.active{background:linear-gradient(135deg,var(--color-candy-blue),var(--color-candy-purple));color:#fff;box-shadow:0 4px 12px #54a0ff59}.view-btn.active:hover{transform:translateY(-1px);box-shadow:0 6px 16px #54a0ff66}.btn-icon{display:flex;align-items:center;justify-content:center}.print-btn{display:flex;align-items:center;gap:.6rem;padding:.75rem 1.5rem;border:none;background:linear-gradient(135deg,var(--color-candy-green),#2ECC71);border-radius:var(--radius-round);font-family:var(--font-body);font-size:1rem;font-weight:700;color:#fff;cursor:pointer;box-shadow:0 4px 15px #5cd85a59;transition:all .3s var(--bounce)}.print-btn:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 25px #5cd85a73}.print-btn:active{transform:translateY(-1px) scale(.98)}.format-selector{display:flex;gap:.5rem;background:#fff;border-radius:var(--radius-round);padding:4px;box-shadow:0 4px 15px var(--color-shadow);border:2px solid #E8E8E8}.format-btn{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.5rem .75rem;border:none;background:transparent;border-radius:calc(var(--radius-round) - 4px);cursor:pointer;transition:all .3s var(--bounce)}.format-btn:hover{background:#ff6b9d1a}.format-btn.active{background:linear-gradient(135deg,var(--color-candy-pink),var(--color-candy-orange));box-shadow:0 4px 12px #ff6b9d59}.format-grid{display:grid;gap:2px;padding:2px;background:#0000001a;border-radius:4px}.format-grid[data-format="2x3"]{grid-template-columns:repeat(2,8px);grid-template-rows:repeat(3,6px)}.format-grid[data-format="4x4"]{grid-template-columns:repeat(4,5px);grid-template-rows:repeat(4,5px)}.format-cell{background:var(--color-candy-purple);border-radius:1px;transition:background .2s}.format-btn.active .format-grid{background:#ffffff4d}.format-btn.active .format-cell{background:#fff}.format-label{font-family:var(--font-body);font-size:.7rem;font-weight:700;color:var(--color-text-secondary);white-space:nowrap}.format-btn.active .format-label{color:#fff}.margin-selector{display:flex;align-items:center;gap:.5rem;background:#fff;border-radius:var(--radius-round);padding:4px 12px;box-shadow:0 4px 15px var(--color-shadow);border:2px solid #E8E8E8}.margin-label{font-family:var(--font-body);font-size:.8rem;font-weight:700;color:var(--color-text-secondary);white-space:nowrap}.margin-select-wrapper{min-width:unset}.margin-select{-moz-appearance:none;appearance:none;-webkit-appearance:none;background:linear-gradient(135deg,var(--color-candy-yellow),var(--color-candy-orange));border:none;border-radius:var(--radius-round);padding:.4rem 2rem .4rem .75rem;font-family:var(--font-body);font-size:.8rem;font-weight:700;color:#fff;cursor:pointer;transition:all .3s var(--bounce);text-shadow:0 1px 2px rgba(0,0,0,.15)}.margin-select:hover{transform:translateY(-1px);box-shadow:0 4px 12px #ffb64766}.margin-select:focus{outline:none;box-shadow:0 0 0 3px #ffb64766}.margin-select-wrapper .select-arrow{color:#fff;right:.6rem}@media(max-width:768px){.controls{flex-direction:column;gap:1rem!important}.category-select{width:100%;max-width:250px;min-width:unset}.view-buttons{width:100%;max-width:300px;justify-content:center}.view-btn{flex:1;justify-content:center;padding:.6rem .75rem;font-size:.85rem}.print-btn{width:100%;max-width:200px;justify-content:center}}.flashcard{width:100%;height:100%;border-radius:20px;overflow:visible;box-shadow:0 8px 30px #0000001f,0 4px 8px #00000014,inset 0 1px #ffffff4d;transition:all .4s var(--bounce);animation:bounce-in .5s var(--bounce) both;position:relative}.flashcard-grid-item:nth-child(1) .flashcard{animation-delay:.05s}.flashcard-grid-item:nth-child(2) .flashcard{animation-delay:.1s}.flashcard-grid-item:nth-child(3) .flashcard{animation-delay:.15s}.flashcard-grid-item:nth-child(4) .flashcard{animation-delay:.2s}.flashcard-grid-item:nth-child(5) .flashcard{animation-delay:.25s}.flashcard-grid-item:nth-child(6) .flashcard{animation-delay:.3s}.flashcard-grid-item:nth-child(7) .flashcard{animation-delay:.35s}.flashcard-grid-item:nth-child(8) .flashcard{animation-delay:.4s}.flashcard-grid-item:nth-child(9) .flashcard{animation-delay:.45s}.flashcard-grid-item:nth-child(10) .flashcard{animation-delay:.5s}.flashcard-grid-item:nth-child(11) .flashcard{animation-delay:.55s}.flashcard:hover{transform:translateY(-8px) scale(1.02) rotate(1deg);box-shadow:0 20px 50px #0003,0 10px 20px #0000001f,inset 0 1px #fff6}.flashcard-color{width:100%;height:100%;display:flex;align-items:center;justify-content:center;border:5px solid rgba(255,255,255,.3);border-radius:20px;position:relative;overflow:visible}.flashcard-color:before{content:"";position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(to bottom,#ffffff40,#ffffff0d);pointer-events:none}.flashcard-number{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-between;border:5px solid rgba(255,255,255,.3);border-radius:20px;padding:1rem;position:relative;overflow:hidden}.flashcard-number:before{content:"";position:absolute;top:0;left:0;right:0;height:40%;background:linear-gradient(to bottom,#fff3,#fff0);pointer-events:none;z-index:1}.number-display{font-family:var(--font-display);font-size:4.5rem;font-weight:700;color:#fff;text-shadow:3px 3px 0 rgba(0,0,0,.2),0 0 20px rgba(255,255,255,.3);line-height:1;position:relative;z-index:2}.shapes-container{flex:1;width:100%;display:flex;align-items:center;justify-content:center;position:relative;z-index:2}.shape-grid{max-height:100%}.shape-item{width:32px;height:32px;filter:drop-shadow(2px 2px 3px rgba(0,0,0,.2));transition:transform .3s var(--bounce)}.flashcard:hover .shape-item{animation:wiggle .5s ease-in-out infinite}.shape-grid-empty{display:flex;align-items:center;justify-content:center;font-size:4rem;color:#fff9;font-family:var(--font-display)}.flashcard-shape{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:5px solid rgba(255,255,255,.3);border-radius:20px;padding:1rem;position:relative;overflow:hidden;gap:.5rem}.flashcard-shape:before{content:"";position:absolute;top:0;left:0;right:0;height:40%;background:linear-gradient(to bottom,#fff3,#fff0);pointer-events:none;z-index:1}.shape-display{flex:1;width:100%;display:flex;align-items:center;justify-content:center;position:relative;z-index:2}.shape-display svg{width:60%;height:auto;max-height:70%;filter:drop-shadow(3px 3px 6px rgba(0,0,0,.2));transition:transform .3s var(--bounce)}.flashcard:hover .shape-display svg{transform:scale(1.1) rotate(5deg)}.flashcard-emoji{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:5px solid rgba(255,255,255,.3);border-radius:20px;padding:1rem;position:relative;overflow:hidden;gap:.5rem}.flashcard-emoji:before{content:"";position:absolute;top:0;left:0;right:0;height:40%;background:linear-gradient(to bottom,#fff3,#fff0);pointer-events:none;z-index:1}.emoji-display{display:flex;align-items:center;justify-content:center;position:relative;z-index:2;transition:transform .3s var(--bounce)}.twemoji-img{width:5rem;height:5rem;filter:drop-shadow(3px 3px 6px rgba(0,0,0,.2));-o-object-fit:contain;object-fit:contain}.flashcard:hover .emoji-display{transform:scale(1.15) rotate(5deg)}.flashcard-name{font-family:var(--font-display);font-size:1.6rem;font-weight:600;text-align:center;margin:0;padding:.5rem 1rem;text-shadow:2px 2px 0 rgba(0,0,0,.15),0 0 10px rgba(255,255,255,.2);position:relative;z-index:2;letter-spacing:.02em}.flashcard-name.arabic-text{font-family:var(--font-arabic)!important;font-size:1.6rem;font-weight:700;letter-spacing:0;direction:rtl;unicode-bidi:isolate;text-align:center;width:100%;max-width:100%;padding-left:.3rem;padding-right:.3rem;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis}@media print{.flashcard{box-shadow:none!important;animation:none!important;page-break-inside:avoid!important;border-radius:12px!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;overflow:visible!important}.flashcard:hover{transform:none!important}.flashcard-color,.flashcard-number,.flashcard-shape,.flashcard-emoji{border:3px solid rgba(0,0,0,.3)!important;border-radius:12px!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;overflow:visible!important}.flashcard-color:before,.flashcard-number:before,.flashcard-shape:before,.flashcard-emoji:before{display:none!important}.twemoji-img{width:4rem!important;height:4rem!important;filter:none!important}.shape-display svg{width:50%!important;filter:none!important}.flashcard-name{text-shadow:1px 1px 0 rgba(0,0,0,.1)!important;font-size:1.3rem!important;overflow:visible!important;white-space:nowrap!important}.flashcard-name.arabic-text{font-size:1.2rem!important;direction:rtl!important;unicode-bidi:isolate!important;white-space:normal!important;word-break:keep-all!important;line-height:1.3!important}.number-display{font-size:3.5rem!important;text-shadow:2px 2px 0 rgba(0,0,0,.15)!important}.shape-item{width:24px!important;height:24px!important;filter:none!important;animation:none!important}.shape-grid-empty{font-size:3rem!important}}@media(max-width:768px){.flashcard{border-radius:16px}.flashcard-color,.flashcard-number,.flashcard-emoji{border-width:4px;border-radius:16px}.flashcard-name{font-size:1.3rem}.number-display{font-size:3.5rem}.shape-item{width:24px;height:24px}.twemoji-img{width:4rem;height:4rem}}.flashcard-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:2rem;padding:2.5rem;max-width:1400px;margin:0 auto}.flashcard-grid-item{aspect-ratio:3 / 4;min-height:280px}@media(max-width:1200px){.flashcard-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.5rem;padding:2rem}}@media(max-width:768px){.flashcard-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem;padding:1rem}.flashcard-grid-item{min-height:200px}}@media(max-width:480px){.flashcard-grid{grid-template-columns:repeat(2,1fr);gap:.75rem;padding:.75rem}.flashcard-grid-item{min-height:180px}}.print-view{--print-margin: 15mm;background:linear-gradient(135deg,#e8e8e8,#f5f5f5);padding:2rem;min-height:calc(100vh - 200px)}.print-page{width:210mm;height:297mm;margin:0 auto 2rem;padding:var(--print-margin);background:#fff;box-shadow:0 10px 40px #00000026,0 2px 10px #0000001a;border-radius:4px;box-sizing:border-box;position:relative}.print-page:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-rainbow);border-radius:4px 4px 0 0}.print-grid{display:grid;gap:8mm;width:100%;height:100%}.print-card{width:100%;height:100%;border-radius:12px;overflow:visible}.print-format-4x4 .print-page{padding:10mm}.print-format-4x4 .print-grid{gap:5mm}.print-format-4x4 .print-card{border-radius:8px}.print-format-4x4 .flashcard-name{font-size:.85rem!important;padding:.2rem!important;text-shadow:1px 1px 2px rgba(0,0,0,.3)!important}.print-format-4x4 .flashcard-color .flashcard-name{font-size:1rem!important}.print-format-4x4 .number-display{font-size:2rem}.print-format-4x4 .shape-item{width:14px;height:14px}.print-format-4x4 .flashcard-number{padding:.4rem;gap:.2rem}.print-format-4x4 .shapes-container{flex:.8}@media print{.print-view{display:block!important;visibility:visible!important;background:#fff!important;padding:0!important;min-height:auto!important}.print-page{width:210mm!important;height:297mm!important;margin:0!important;padding:var(--print-margin)!important;background:#fff!important;box-shadow:none!important;border-radius:0!important;page-break-after:always!important;page-break-inside:avoid!important;box-sizing:border-box!important;overflow:visible!important}.print-page:before{display:none!important}.print-page:last-child{page-break-after:auto!important}.print-grid{display:grid!important;width:100%!important;height:100%!important}.print-format-2x3 .print-grid{grid-template-columns:repeat(2,1fr)!important;grid-template-rows:repeat(3,1fr)!important;gap:8mm!important}.print-format-4x4 .print-grid{grid-template-columns:repeat(4,1fr)!important;grid-template-rows:repeat(4,1fr)!important;gap:4mm!important}.print-card{width:100%!important;height:100%!important;overflow:visible!important;page-break-inside:avoid!important}.print-card .flashcard,.print-card .flashcard-color,.print-card .flashcard-number,.print-card .flashcard-shape{width:100%!important;height:100%!important;display:flex!important;visibility:visible!important;overflow:visible!important}.print-card .flashcard-name.arabic-text{direction:rtl!important;text-align:center!important;width:100%!important;overflow:hidden!important;unicode-bidi:isolate!important;white-space:normal!important;word-break:keep-all!important;text-overflow:ellipsis!important;max-width:100%!important}.print-format-4x4 .print-card,.print-format-4x4 .flashcard{border-radius:6px!important}.print-format-4x4 .flashcard-color,.print-format-4x4 .flashcard-number,.print-format-4x4 .flashcard-shape{border-width:2px!important;border-radius:6px!important}.print-format-4x4 .shape-display svg{width:40%!important}.print-format-4x4 .flashcard-name{font-size:.7rem!important;padding:.1rem!important}.print-format-4x4 .flashcard-color .flashcard-name{font-size:.85rem!important}.print-format-4x4 .number-display{font-size:1.5rem!important}.print-format-4x4 .shape-item{width:10px!important;height:10px!important}.print-format-4x4 .flashcard-number{padding:.2rem!important;gap:.1rem!important}.print-format-4x4 .shapes-container{flex:.6!important}.print-format-4x4 .flashcard-name.arabic-text{font-size:.6rem!important;line-height:1.2!important;unicode-bidi:isolate!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.print-format-4x4 .flashcard-color .flashcard-name.arabic-text{font-size:.75rem!important}}@media screen and (max-width:900px){.print-view{padding:1rem}.print-page{width:100%;height:auto;aspect-ratio:210 / 297;padding:5%}.print-grid{gap:3%}.print-format-4x4 .print-grid{gap:2%}}.game-mode{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;flex-direction:column;padding:1rem;touch-action:pan-y;-webkit-user-select:none;-moz-user-select:none;user-select:none}.game-header{display:flex;align-items:center;justify-content:space-between;padding:.5rem;gap:1rem}.game-exit-btn{background:#fff3;border:none;border-radius:20px;padding:.5rem 1rem;color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.game-exit-btn:hover{background:#ffffff4d;transform:scale(1.05)}.game-restart-btn{background:#fff3;border:none;border-radius:50%;width:40px;height:40px;font-size:1.2rem;cursor:pointer;transition:all .2s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.game-restart-btn:hover{background:#ffffff4d;transform:rotate(180deg)}.game-progress{flex:1;display:flex;flex-direction:column;align-items:center;gap:.3rem}.game-progress-text{color:#fff;font-size:1rem;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.2)}.game-progress-bar{width:100%;max-width:200px;height:6px;background:#ffffff4d;border-radius:3px;overflow:hidden}.game-progress-fill{height:100%;background:#fff;border-radius:3px;transition:width .3s ease}.game-card-container{flex:1;display:flex;align-items:center;justify-content:center;perspective:1000px;padding:1rem;position:relative;cursor:pointer}.game-flip-card{width:100%;max-width:320px;aspect-ratio:3 / 4;position:relative;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.4,0,.2,1)}.game-flip-card.flipped{transform:rotateY(180deg)}.game-card-face{position:absolute;top:0;right:0;bottom:0;left:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:20px;overflow:hidden;box-shadow:0 20px 60px #0000004d}.game-card-front{transform:rotateY(0)}.game-card-back{transform:rotateY(180deg)}.game-card-face .flashcard{width:100%;height:100%}.game-tap-hint{position:absolute;bottom:-3rem;left:50%;transform:translate(-50%);background:#ffffffe6;padding:.5rem 1rem;border-radius:20px;font-size:.9rem;font-weight:600;color:#667eea;animation:pulse-hint 2s ease-in-out infinite;white-space:nowrap}@keyframes pulse-hint{0%,to{opacity:1;transform:translate(-50%) scale(1)}50%{opacity:.7;transform:translate(-50%) scale(.95)}}.game-navigation{display:flex;align-items:center;justify-content:space-between;padding:1rem;gap:1rem}.game-nav-btn{background:#fff3;border:none;border-radius:50%;width:50px;height:50px;font-size:1.5rem;color:#fff;cursor:pointer;transition:all .2s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center}.game-nav-btn:hover:not(:disabled){background:#ffffff4d;transform:scale(1.1)}.game-nav-btn:disabled{opacity:.3;cursor:not-allowed}.game-swipe-hint{color:#ffffffb3;font-size:.9rem;font-weight:500}.game-finish-btn{background:#fff;border:none;border-radius:25px;padding:.75rem 1.5rem;font-size:1rem;font-weight:700;color:#667eea;cursor:pointer;transition:all .2s ease;animation:celebrate .5s ease}.game-finish-btn:hover{transform:scale(1.05);box-shadow:0 10px 30px #0003}@keyframes celebrate{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}@media(min-width:768px){.game-flip-card{max-width:400px}.game-tap-hint{bottom:-4rem;font-size:1rem;padding:.75rem 1.5rem}.game-nav-btn{width:60px;height:60px;font-size:2rem}}@media(max-width:480px){.game-mode{padding:.5rem}.game-header{padding:.25rem}.game-exit-btn{padding:.4rem .8rem;font-size:.8rem}.game-flip-card{max-width:280px}.game-tap-hint{bottom:-2.5rem;font-size:.8rem;padding:.4rem .8rem}.game-nav-btn{width:44px;height:44px;font-size:1.3rem}.game-finish-btn{padding:.6rem 1.2rem;font-size:.9rem}}[dir=rtl] .game-flip-card.flipped,[dir=rtl] .game-card-back{transform:rotateY(-180deg)}@supports (padding: env(safe-area-inset-top)){.game-mode{padding-top:calc(1rem + env(safe-area-inset-top));padding-bottom:calc(1rem + env(safe-area-inset-bottom));padding-left:calc(1rem + env(safe-area-inset-left));padding-right:calc(1rem + env(safe-area-inset-right))}}.app{min-height:100vh;background:radial-gradient(circle at 20% 80%,rgba(255,107,157,.15) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(84,160,255,.15) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(254,202,87,.1) 0%,transparent 40%),var(--color-bg-primary);position:relative}.app:before,.app:after{content:"";position:fixed;border-radius:50%;opacity:.4;z-index:0;pointer-events:none}.app:before{width:300px;height:300px;background:linear-gradient(135deg,var(--color-candy-yellow),var(--color-candy-orange));top:-100px;right:-100px;animation:float 6s ease-in-out infinite}.app:after{width:200px;height:200px;background:linear-gradient(135deg,var(--color-candy-blue),var(--color-candy-purple));bottom:-50px;left:-50px;animation:float 8s ease-in-out infinite reverse}.app-header{position:relative;z-index:10;padding:1.5rem 2rem;text-align:center;background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 20px var(--color-shadow),0 1px 3px var(--color-shadow);border-bottom:4px solid transparent;background-image:linear-gradient(#fff,#fff),var(--gradient-rainbow);background-origin:border-box;background-clip:padding-box,border-box}.app-header h1{margin:0 0 .25rem;color:var(--color-text-primary);font-size:2rem;font-weight:700;letter-spacing:-.02em;animation:pop-in .6s var(--bounce) both}.subtitle{margin:0 0 1.25rem;color:var(--color-text-secondary);font-size:1.1rem;font-weight:600;animation:pop-in .6s var(--bounce) .1s both}.controls{display:flex;gap:.75rem;justify-content:center;align-items:center;flex-wrap:wrap;animation:pop-in .6s var(--bounce) .2s both}.category-select{min-width:180px}.category-select [data-slot=base]{background:#fff!important;border:3px solid var(--color-candy-purple)!important;border-radius:var(--radius-round)!important;box-shadow:0 4px 12px #a55eea33!important;transition:all .3s var(--bounce)!important}.category-select [data-slot=base]:hover{border-color:var(--color-candy-pink)!important;transform:translateY(-2px)!important;box-shadow:0 6px 20px #ff6b9d40!important}.category-select [data-slot=label]{color:var(--color-candy-purple)!important;font-weight:700!important;font-family:var(--font-body)!important}.category-select [data-slot=value],.category-select [data-slot=innerWrapper]{font-family:var(--font-body)!important;font-weight:600!important}.controls button[class*=bg-primary]{background:linear-gradient(135deg,var(--color-candy-blue),var(--color-candy-purple))!important;border:none!important;box-shadow:0 4px 15px #54a0ff66!important}.controls button[class*=bg-primary]:hover{transform:translateY(-3px) scale(1.02)!important;box-shadow:0 6px 25px #54a0ff80!important}.controls button[class*=bg-success]{background:linear-gradient(135deg,var(--color-candy-green),#2ECC71)!important;border:none!important;box-shadow:0 4px 15px #5cd85a66!important}.controls button[class*=bg-success]:hover{transform:translateY(-3px) scale(1.02)!important;box-shadow:0 6px 25px #5cd85a80!important}.controls button[class*=bordered]{background:#fff!important;border:3px solid var(--color-candy-blue)!important;color:var(--color-candy-blue)!important}.controls button[class*=bordered]:hover{background:#54a0ff1a!important;transform:translateY(-2px)!important}.app-main{position:relative;z-index:5;min-height:calc(100vh - 180px);padding-bottom:2rem}.show{display:block}.hide-on-screen{display:none}@media print{.app{background:#fff!important;min-height:auto!important}.app:before,.app:after{display:none!important}.app-header{display:none!important}.app-main{min-height:auto!important;padding:0!important}.hide-on-screen{display:block!important}.show:not(.print-container){display:none!important}.print-container{display:block!important}}@media(max-width:768px){.app-header{padding:1rem}.app-header h1{font-size:1.5rem}.subtitle{font-size:1rem;margin-bottom:1rem}.controls{gap:.5rem}.category-select{min-width:150px;width:100%;max-width:200px}}