:root{--color-slate-50: #f8fafc;--color-slate-100: #f1f5f9;--color-slate-200: #e2e8f0;--color-slate-300: #cbd5e1;--color-slate-400: #94a3b8;--color-slate-500: #64748b;--color-slate-600: #475569;--color-slate-800: #1e293b;--color-slate-900: #0f172a;--color-yellow-50: #fefce8;--color-yellow-100: #fef9c3;--color-yellow-200: #fef08a;--color-yellow-300: #fde047;--color-yellow-400: #facc15;--color-yellow-500: #eab308;--color-yellow-600: #d97706;--color-yellow-700: #b45309;--color-yellow-800: #854d0e;--color-yellow-900: #713f12;--color-blue-50: #eff6ff;--color-blue-100: #dbeafe;--color-blue-200: #bfdbfe;--color-blue-300: #93c5fd;--color-blue-500: #3b82f6;--color-blue-600: #2563eb;--color-blue-700: #1d4ed8;--color-purple-200: #E9D5FF;--color-purple-300: #D8B4FE;--color-purple-400: #C084FC;--color-purple-500: #A855F7;--color-purple-600: #8B21FF;--color-purple-700: #6d28d9;--color-purple-800: #5b21b6;--color-green-50: #f0fdf4;--color-green-100: #dcfce7;--color-green-200: #bbf7d0;--color-green-500: #22c55e;--color-green-600: #16a34a;--color-green-700: #15803d;--color-white: #ffffff;--color-transparent: transparent;--font-sans: "Inter", sans-serif;--font-heading: "Fredoka", sans-serif;--spacing-1: .25rem;--spacing-2: .5rem;--spacing-3: .75rem;--spacing-4: 1rem;--spacing-6: 1.5rem;--spacing-8: 2rem;--spacing-12: 3rem;--spacing-16: 4rem;--spacing-20: 5rem;--spacing-24: 6rem;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--radius-3xl: 1.5rem;--radius-full: 9999px}body{font-family:var(--font-sans);background-color:var(--color-slate-50);color:var(--color-slate-800);min-height:100vh;display:flex;flex-direction:column;margin:0;line-height:1.5}h1,h2,h3,h4,h5,h6,.font-heading{font-family:var(--font-heading)}::selection{background-color:var(--color-yellow-200);color:var(--color-yellow-900)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:var(--color-slate-300);border-radius:10px}.container{max-width:75rem;margin-left:auto;margin-right:auto;padding-left:var(--spacing-4);padding-right:var(--spacing-4)}@media(min-width:640px){.container{padding-left:var(--spacing-6);padding-right:var(--spacing-6)}}@media(min-width:1024px){.container{padding-left:var(--spacing-8);padding-right:var(--spacing-8)}}.blob-shape{border-radius:60% 40% 30% 70%/60% 30% 70% 40%}.hidden{display:none}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:var(--spacing-2)}.gap-4{gap:var(--spacing-4)}.text-center{text-align:center}.skeleton{background-color:var(--color-slate-200);background-image:linear-gradient(90deg,var(--color-slate-200) 0%,var(--color-slate-100) 50%,var(--color-slate-200) 100%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-md)}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.hero-section{background-color:var(--color-white);width:100%;padding-top:var(--spacing-12);padding-bottom:var(--spacing-12)}@media(min-width:1024px){.hero-section{padding-top:var(--spacing-24);padding-bottom:var(--spacing-24)}}.hero-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-16);align-items:center}@media(min-width:1024px){.hero-grid{grid-template-columns:repeat(2,1fr)}}.hero-content{position:relative;z-index:10;text-align:center}@media(min-width:1024px){.hero-content{text-align:left}}.hero-badge{display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);background-color:var(--color-yellow-100);color:var(--color-yellow-800);border-radius:var(--radius-full);font-weight:700;font-size:.875rem;border:2px solid var(--color-yellow-200);box-shadow:var(--shadow-sm);position:relative}.hero-badge .hero-badge-icon{background-color:var(--color-yellow-400);color:var(--color-slate-900);border-radius:var(--radius-full);padding:.125rem;width:1.25rem;height:1.25rem;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm)}.hero-heading{font-size:3.75rem;font-weight:600;font-family:var(--font-heading);color:var(--color-slate-900);letter-spacing:-.025em;line-height:1;margin-bottom:var(--spacing-8);margin-top:1.25rem;position:relative}@media(max-width:576px){.hero-heading{font-size:2.5rem}}@media(min-width:640px){.hero-heading{font-size:4.5rem}}@media(min-width:1024px){.hero-heading{font-size:6rem}}.hero-text-wrapper{position:relative;z-index:10;font-size:3rem;font-weight:600;font-family:var(--font-heading);letter-spacing:normal}@media(max-width:576px){.hero-text-wrapper{font-size:2.25rem}}.hero-highlight{position:relative;display:inline-block;color:var(--color-blue-500)}.hero-underline{position:absolute;width:110%;bottom:-.25rem;left:-.25rem;color:var(--color-yellow-400);pointer-events:none}.hero-description{font-size:1.25rem;color:var(--color-slate-500);font-weight:700;max-width:32rem;margin-left:auto;margin-right:auto;line-height:1.625;margin-bottom:var(--spacing-12)}@media(min-width:1024px){.hero-description{margin-left:0}}.hero-actions{display:flex;flex-direction:column;gap:var(--spacing-4);justify-content:center;position:relative}@media(min-width:640px){.hero-actions{flex-direction:row}}@media(min-width:1024px){.hero-actions{justify-content:flex-start}}.btn-primary{padding:var(--spacing-4) var(--spacing-8);background-color:var(--color-yellow-400);color:var(--color-slate-900);border-radius:var(--radius-2xl);font-weight:700;font-size:1.125rem;box-shadow:0 6px #ca8a04;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:var(--spacing-2);text-decoration:none;border:none;cursor:pointer}.btn-primary:hover{box-shadow:0 3px #ca8a04;transform:translateY(3px)}.btn-secondary{padding:var(--spacing-4) var(--spacing-8);background-color:transparent;color:var(--color-slate-600);border-radius:var(--radius-2xl);font-weight:700;font-size:1.125rem;border:2px solid var(--color-slate-200);box-shadow:var(--shadow-sm);transition:all .2s;display:flex;align-items:center;justify-content:center;gap:var(--spacing-2);text-decoration:none;cursor:pointer}.btn-secondary:hover{background-color:var(--color-slate-50);border-color:#facc1580}.play-icon-wrapper{background-color:var(--color-blue-100);padding:.375rem;border-radius:var(--radius-full);color:var(--color-blue-600);display:flex}.character-wrapper{display:none}@media(min-width:1024px){.character-wrapper{display:block;position:absolute;top:calc(-6rem + 130px);left:calc(9rem + 180px);width:7rem;height:7rem;z-index:0}}.character-svg{width:100%;height:100%;filter:drop-shadow(0 20px 13px rgba(0,0,0,.03)) drop-shadow(0 8px 5px rgba(0,0,0,.08))}.icon-decoration{display:none;position:absolute;color:var(--color-blue-300);width:6rem;height:6rem;transform:rotate(6deg);pointer-events:none}@media(min-width:1024px){.icon-decoration{display:block}}.arrow-decoration--heading{right:-2rem;z-index:10;top:55%;transform:translateY(-50%)}@media(max-width:1200px){.arrow-decoration--heading{right:0%;opacity:.5}}.arrow-decoration--heading .arrow-svg{width:125px;height:125px;color:var(--color-blue-300)}.star-decoration{top:-130%;left:600px}.star-decoration .star-icon{width:125px;height:125px;color:var(--color-blue-300)}.arrow-decoration--actions{top:-4rem;left:-1.5rem}.illustration-wrapper{position:relative;display:flex;justify-content:center;margin-top:var(--spacing-12)}@media(min-width:1024px){.illustration-wrapper{margin-top:0}}.blob-bg{position:absolute;inset:0;background-color:var(--color-yellow-100);transform:rotate(6deg) scale(1.1);opacity:.6;border-radius:60% 40% 30% 70%/60% 30% 70% 40%}.card-container{position:relative;z-index:10;background-color:var(--color-white);padding:var(--spacing-2);border-radius:var(--radius-3xl);box-shadow:var(--shadow-xl);transform:rotate(-2deg);max-width:28rem;width:100%;transition:all .3s}.card-container .card-inner{background-color:var(--color-slate-50);border-radius:var(--radius-2xl);padding:var(--spacing-8);aspect-ratio:1 / 1;display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px solid var(--color-slate-100);text-align:center}.card-container .card-inner .hero-img{width:100%;max-width:100%;height:auto;margin:auto}.card-container:hover{transform:translateY(-4px)}.features-section{background-color:var(--color-slate-50);padding-top:var(--spacing-16);padding-bottom:var(--spacing-16);border-top:1px solid var(--color-slate-200)}.features-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-8)}.features-grid>a{display:flex;flex-direction:column;height:100%;text-decoration:none}@media(min-width:768px){.features-grid{grid-template-columns:repeat(3,1fr)}}.feature-card{background-color:var(--color-white);padding:var(--spacing-8);border-radius:var(--radius-3xl);box-shadow:var(--shadow-sm);border:2px solid var(--color-slate-100);transition:all .3s;height:100%;display:flex;flex-direction:column}.feature-card:hover{transform:translateY(-4px)}.feature-card.blue:hover{border-color:var(--color-blue-200)}.feature-card.yellow:hover{border-color:var(--color-yellow-200)}.feature-card.green:hover{border-color:var(--color-green-200)}.feature-icon-wrapper{width:3.5rem;height:3.5rem;border-radius:var(--radius-2xl);display:flex;align-items:center;justify-content:center;margin-bottom:var(--spacing-6)}.feature-icon-wrapper.blue{background-color:var(--color-blue-100);color:var(--color-blue-600)}.feature-icon-wrapper.yellow{background-color:var(--color-yellow-100);color:var(--color-yellow-600)}.feature-icon-wrapper.green{background-color:var(--color-green-100);color:var(--color-green-600)}.feature-title{font-size:1.5rem;font-weight:700;color:var(--color-slate-800);margin-bottom:var(--spacing-2);font-family:var(--font-heading)}.feature-description{color:var(--color-slate-500);font-weight:700;line-height:1.625}.gentle-bounce{animation:gentle-bounce 3s infinite ease-in-out}@keyframes gentle-bounce{0%,to{transform:translateY(0) rotate(12deg)}50%{transform:translateY(-10px) rotate(12deg)}}.flashcard-container{height:100%;perspective:1000px;cursor:pointer}.flashcard-inner{position:relative;width:100%;height:100%;min-height:14rem;text-align:center;transition:transform .6s;transform-style:preserve-3d;border-radius:var(--radius-2xl);box-shadow:var(--shadow-sm);border:2px solid var(--color-slate-100);background-color:var(--color-white);display:grid;grid-template-areas:"stack"}.rule-card .flashcard-front{display:flex;justify-content:center}.rule-card:nth-child(3n+1) .flashcard-front{background-color:var(--color-yellow-100)}.rule-card:nth-child(3n+1) .flashcard-back{background-color:var(--color-yellow-50)}.rule-card:nth-child(3n+2) .flashcard-front{background-color:var(--color-green-100)}.rule-card:nth-child(3n+2) .flashcard-back{background-color:var(--color-green-50)}.rule-card:nth-child(3n) .flashcard-front{background-color:var(--color-blue-100)}.rule-card:nth-child(3n) .flashcard-back{background-color:var(--color-blue-50)}.flashcard-container.flipped .flashcard-inner{transform:rotateY(180deg)}.flashcard-container:hover .flashcard-front,.flashcard-container:hover .flashcard-back{box-shadow:var(--shadow-lg)}.flashcard-front,.flashcard-back{grid-area:stack;position:relative;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:var(--radius-2xl);display:flex;flex-direction:column;align-items:center;padding:var(--spacing-4);gap:var(--spacing-2);box-sizing:border-box}.flashcard-front{background-color:var(--color-white);border:1px solid var(--color-slate-200)}.flashcard-back{transform:rotateY(180deg);color:var(--color-slate-900);justify-content:start}.flashcard-back a{color:var(--color-blue-700)}.flashcard-image-wrapper{width:100%;min-height:100px;background-color:var(--color-slate-50);display:flex;align-items:center;justify-content:center;overflow:hidden;padding:var(--spacing-12) var(--spacing-4)}.flashcard-image{width:100px;height:100px;object-fit:contain;transition:transform .3s}.flashcard-container:hover .flashcard-image{transform:scale(1.1)}.flashcard-fallback-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%;opacity:.5}.flashcard-title{font-weight:700;font-size:1.5rem;color:var(--color-slate-900);margin:0;font-family:var(--font-heading)}.flashcard-badge{padding:.25rem .75rem;border-radius:var(--radius-full);font-size:.875rem;font-weight:700;color:var(--color-slate-900);display:inline-flex;align-items:center;gap:.25rem;border:1px solid var(--color-slate-300)}.flashcard-back-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:start;gap:var(--spacing-4);width:100%;padding:var(--spacing-2);box-sizing:border-box}.flashcard-title-back{font-weight:700;font-size:1.35rem;color:var(--color-slate-900);margin:0;font-family:var(--font-heading)}.flashcard-disposal-options{display:flex;flex-direction:column;gap:var(--spacing-1);text-align:center}.flashcard-option{font-size:1rem;font-weight:600;margin:0}.flashcard-conditional{background-color:#ffffff80;padding:var(--spacing-3);border-radius:var(--radius-lg);width:100%;margin-top:var(--spacing-2);border:1px solid rgba(0,0,0,.05)}.flashcard-conditional-text{font-size:1rem;font-style:italic;color:var(--color-slate-800)}.flashcard-hint-back{font-size:.75rem;opacity:.8;margin-top:auto;color:var(--color-slate-600)}.learn-container{padding:var(--spacing-8) var(--spacing-4);max-width:80rem;margin-left:auto;margin-right:auto}.learn-hero{text-align:center;margin-bottom:var(--spacing-8)}.learn-hero-title{font-size:2.5rem;font-weight:700;margin-bottom:var(--spacing-8);font-family:var(--font-heading);color:var(--color-slate-900)}.rules-overview{background-color:var(--color-white);padding:var(--spacing-8);border-radius:var(--radius-3xl);box-shadow:var(--shadow-md);border:2px solid var(--color-slate-100);max-width:48rem;margin:0 auto var(--spacing-8);text-align:left}.rules-overview h2{font-size:1.5rem;font-weight:700;color:var(--color-slate-800);margin-bottom:var(--spacing-4);font-family:var(--font-heading);text-align:center}.rules-overview p{color:var(--color-slate-600);line-height:1.6;margin-bottom:var(--spacing-4);font-size:1.125rem}.rules-overview strong{color:var(--color-slate-900);font-weight:700}.rules-hint{font-size:1rem!important;color:var(--color-slate-500)!important;font-style:italic;text-align:center;margin-bottom:0!important}.search-section{max-width:36rem;margin-left:auto;margin-right:auto;margin-bottom:var(--spacing-8);position:relative;scroll-margin-top:6rem}.search-wrapper{position:relative;display:flex}.search-icon-absolute{position:absolute;left:var(--spacing-4);top:50%;transform:translateY(-50%);color:var(--color-slate-400);width:1.25rem;height:1.25rem}.search-input-field{width:100%;padding:var(--spacing-4) 3rem var(--spacing-4) 3rem;border-radius:var(--radius-2xl);border:2px solid var(--color-slate-200);font-size:1rem;outline:none;transition:border-color .2s;font-family:var(--font-sans)}.search-input-field:focus{border-color:var(--color-blue-400);box-shadow:0 0 0 4px var(--color-blue-100)}.search-clear-btn{position:absolute;right:var(--spacing-4);top:50%;transform:translateY(-50%);background:none;border:none;color:var(--color-slate-400);cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;transition:color .2s}.search-clear-btn:hover{color:var(--color-slate-600)}.filters-section{display:flex;gap:var(--spacing-2);justify-content:center;flex-wrap:wrap;margin-bottom:var(--spacing-8)}.filter-btn{padding:var(--spacing-2) var(--spacing-4);border-radius:var(--radius-full);border:none;cursor:pointer;font-weight:700;font-size:.875rem;box-shadow:var(--shadow-sm);transition:all .2s;font-family:var(--font-sans)}.filter-btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}.filter-btn--active{background-color:var(--color-slate-800);color:var(--color-white)}.filter-btn--inactive{background-color:var(--color-white);color:var(--color-slate-600)}.filter-btn--clear{background-color:var(--color-white);border:1px solid var(--color-slate-200);color:var(--color-slate-600)}.filter-btn--clear:disabled{background-color:transparent}.filter-btn--clear:hover{border-color:var(--color-slate-300);color:var(--color-slate-700)}.results-count{text-align:center;color:var(--color-slate-500);margin-bottom:var(--spacing-6);font-size:.875rem}.flashcards-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-6);margin-bottom:var(--spacing-12)}@media(min-width:640px){.flashcards-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.flashcards-grid{grid-template-columns:repeat(3,1fr)}}@media(min-width:1280px){.flashcards-grid{grid-template-columns:repeat(4,1fr)}}.no-results-message{text-align:center;padding:var(--spacing-12);color:var(--color-slate-500);background-color:var(--color-slate-50);border-radius:var(--radius-2xl);border:2px dashed var(--color-slate-200)}.pagination-controls{display:flex;min-height:40px;flex-direction:column;align-items:center;gap:var(--spacing-6)}@media(min-width:640px){.pagination-controls{flex-direction:row;justify-content:space-between}}.pagination-controls:not(.pagination-top){margin-top:var(--spacing-8);padding-top:var(--spacing-8);border-top:1px solid var(--color-slate-200)}.items-per-page{display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-slate-600);font-weight:500}.items-per-page-select{padding:var(--spacing-2) var(--spacing-4);border-radius:var(--radius-lg);border:1px solid var(--color-slate-300);background-color:var(--color-white);color:var(--color-slate-800);font-family:var(--font-sans);cursor:pointer}.pagination-buttons{display:flex;align-items:center;gap:var(--spacing-4)}.pagination-btn{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:var(--radius-full);border:1px solid var(--color-slate-200);background-color:var(--color-white);color:var(--color-slate-600);cursor:pointer;transition:all .2s}.pagination-btn:hover:not(:disabled){background-color:var(--color-slate-50);border-color:var(--color-slate-300);color:var(--color-slate-900)}.pagination-btn:disabled{opacity:.5;cursor:not-allowed}.pagination-info{color:var(--color-slate-600);font-weight:500;min-width:6rem;text-align:center}.game-root{min-height:100vh;display:flex;flex-direction:column}.game-main{flex-grow:1}.game-container{background-color:var(--color-blue-50);min-height:calc(100vh - 5rem);padding-top:6px;padding-bottom:var(--spacing-8)}.game-layout{max-width:64rem;margin-left:auto;margin-right:auto;padding-left:var(--spacing-4);padding-right:var(--spacing-4);height:100%;display:flex;flex-direction:column;gap:var(--spacing-2);justify-content:center;align-items:center}@media(min-width:576px){.game-container{padding-top:var(--spacing-8)}.game-layout{flex-direction:row;align-items:stretch;gap:var(--spacing-8)}.overlay-content{padding-top:var(--spacing-4)}}.game-center{display:flex;flex-direction:column;align-items:center;width:100%;max-width:28rem}.game-board{position:relative;width:100%;aspect-ratio:3 / 4;background-color:var(--color-blue-100);border-radius:var(--radius-3xl);border:8px solid var(--color-white);box-shadow:var(--shadow-xl);overflow:hidden}.game-overlay{position:absolute;inset:0;z-index:10;background:#ffffffbf;display:flex;align-items:center;justify-content:center}.game-overlay .btn-primary{margin-left:auto;margin-right:auto}.overlay-content{text-align:center;height:100%;padding:var(--spacing-16) var(--spacing-2) var(--spacing-4)}.overlay-title{font-size:1.875rem;font-weight:700;margin-bottom:var(--spacing-4);color:var(--color-slate-800)}.overlay-title-small{font-size:1.875rem;font-weight:700;margin-bottom:var(--spacing-2);color:var(--color-slate-800)}.overlay-text{color:var(--color-slate-600);margin-bottom:var(--spacing-6)}.overlay-score{font-size:1.25rem;color:var(--color-slate-600);margin-bottom:var(--spacing-6)}.cloud-icon{position:absolute;color:var(--color-white);fill:var(--color-white)}.cloud-1{top:2.5rem;left:2.5rem;opacity:.5;width:3rem;height:3rem}.cloud-2{top:5rem;right:5rem;opacity:.4;width:4rem;height:4rem}.falling-item-container{position:relative}.falling-item{position:absolute;top:25%;left:50%;transform:translate(0);display:flex;flex-direction:column;align-items:center;width:60px;height:60px;border-radius:99px;border:2px solid white;overflow:visible}.falling-item[style*=background-image]{background-size:contain;background-repeat:no-repeat;background-position:center bottom;height:4rem}.falling-item-emoji{font-size:3rem;line-height:1}.falling-item-name{margin-top:.25rem;background-color:#ffffffe6;color:var(--color-slate-900);font-size:.7rem;font-weight:700;padding:2px 6px;border-radius:4px;white-space:nowrap;box-shadow:0 2px 4px #0000001a;text-align:center}.game-bins{position:absolute;bottom:0;left:0;right:0;height:6rem;display:flex;gap:var(--spacing-2)}.game-bin{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:var(--spacing-2);min-width:0}.game-bin-blue{background-color:var(--color-blue-500);border-top:4px solid var(--color-blue-600);border-right:1px solid rgba(0,0,0,.1)}.game-bin-green{background-color:var(--color-green-500);border-top:4px solid var(--color-green-600);border-right:1px solid rgba(0,0,0,.1)}.game-bin-black{background-color:var(--color-slate-800);border-top:4px solid var(--color-slate-700);border-right:1px solid rgba(0,0,0,.1)}.game-bin-yellow{background-color:var(--color-yellow-400);border-top:4px solid var(--color-yellow-500);border-right:1px solid rgba(0,0,0,.1)}.game-bin-yellow .game-bin-icon,.game-bin-yellow .game-bin-label{color:var(--color-slate-900)}.game-bin-purple{background-color:var(--color-purple-500);border-top:4px solid var(--color-purple-600)}.game-bin-icon{color:var(--color-white);opacity:.8;width:1.75rem;height:1.75rem;margin-bottom:.25rem}.game-bin-label{color:var(--color-white);font-weight:700;font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;opacity:.9;text-align:center}.game-controls{width:100%;max-width:24rem;margin-top:var(--spacing-2);display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-4)}.control-btn{border-radius:var(--radius-2xl);padding:var(--spacing-6);display:flex;align-items:center;justify-content:center;transition:all .2s;cursor:pointer;border:none}.control-btn-white{background-color:var(--color-white);color:var(--color-blue-600);box-shadow:0 6px 0 var(--color-slate-300);border:2px solid var(--color-slate-100)}.control-btn-white:hover{transform:translateY(3px);box-shadow:0 3px 0 var(--color-slate-300)}.control-btn-white:active{background-color:var(--color-slate-50)}.control-btn-yellow{background-color:var(--color-yellow-400);color:var(--color-slate-900);box-shadow:0 6px #ca8a04}.control-btn-yellow:hover{transform:translateY(3px);box-shadow:0 3px #ca8a04}.game-sidebar{width:100%;display:flex;flex-direction:row;flex-wrap:wrap;gap:var(--spacing-4);justify-content:center}.stat-card{background-color:var(--color-white);padding:var(--spacing-6);border-radius:var(--radius-3xl);box-shadow:var(--shadow-lg);border:2px solid var(--color-slate-100)}.stat-card.timer-card{width:calc(40% - var(--spacing-4))}.stat-card.score-card{width:calc(30% - var(--spacing-4))}.stat-label{color:var(--color-slate-400);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.25rem;font-family:var(--font-heading)}.stat-value{font-size:3rem;font-weight:700;color:var(--color-blue-600);font-family:var(--font-heading)}.stat-value-time{font-size:2.25rem;color:var(--color-yellow-500);display:flex;align-items:center;gap:var(--spacing-2)}.progress-bar{width:100%;background-color:var(--color-slate-100);border-radius:var(--radius-full);height:.75rem;margin-top:.75rem}.progress-fill{background-color:var(--color-yellow-500);height:100%;border-radius:var(--radius-full);width:75%}.game-menu{background-color:var(--color-slate-800);padding:var(--spacing-6);border-radius:var(--radius-3xl);box-shadow:var(--shadow-lg);color:var(--color-white)}.game-menu.mobile-hidden{display:none}.game-menu-mobile{display:flex;justify-content:center;gap:var(--spacing-2)}.game-menu-mobile .game-menu{padding-top:var(--spacing-3);padding-bottom:var(--spacing-3)}.game-menu-mobile div{width:117px}.menu-btn{width:100%;padding:var(--spacing-3);border-radius:var(--radius-xl);font-weight:700;letter-spacing:.05em;cursor:pointer;transition:background-color .2s;border:none;font-size:1rem;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:var(--spacing-2)}.menu-btn-primary{background-color:var(--color-yellow-400);color:var(--color-slate-900)}.menu-btn-primary:hover{background-color:var(--color-yellow-300)}.menu-btn-outline{background-color:transparent;border:2px solid var(--color-slate-600);color:var(--color-slate-300)}.menu-btn-outline:hover{border-color:var(--color-white);color:var(--color-white)}@media(min-width:576px){.game-sidebar{width:16rem;justify-content:start;align-content:start}.game-container{padding-top:var(--spacing-8)}.stat-card,.menu-btn,.stat-card.timer-card,.stat-card.score-card{width:100%}.game-menu-mobile{display:none}.game-menu{width:100%}.game-menu.mobile-hidden{display:block}}@keyframes bin-flash{0%{border-color:#ef4444;box-shadow:0 0 0 4px #ef444480}50%{border-color:#fff;box-shadow:0 0 0 8px #ef444433}to{border-color:#ef4444;box-shadow:0 0 0 4px #ef444480}}.bin-highlight{animation:bin-flash 1s ease-in-out;position:relative;z-index:5}.mobile-game-stats{position:absolute;top:var(--spacing-3);left:var(--spacing-4);right:var(--spacing-4);display:flex;justify-content:space-between;z-index:20;pointer-events:none}.mobile-stat{background-color:#ffffffe6;padding:var(--spacing-1) var(--spacing-3);border-radius:var(--radius-full);display:flex;align-items:center;gap:var(--spacing-2);box-shadow:0 2px 4px #0000001a;font-weight:700;color:var(--color-slate-700);font-size:.875rem}.mobile-stat-label{text-transform:uppercase;font-size:.65rem;color:var(--color-slate-500);letter-spacing:.05em;margin-right:var(--spacing-1)}.mobile-stat-value{color:var(--color-blue-600);font-family:var(--font-heading)}.mobile-stat-icon{width:1rem;height:1rem;color:var(--color-slate-400)}.desktop-only{display:none}@media(min-width:576px){.mobile-game-stats{display:none}.desktop-only{display:block}}@keyframes bin-flash-green{0%{border-color:green;box-shadow:0 0 0 2px #1b721b}50%{border-color:green;box-shadow:0 0 0 4px #1b721b}to{border-color:green;box-shadow:0 0 0 2px #1b721b}}.bin-success{animation:bin-flash-green .5s ease-in-out;position:relative;z-index:5}.not-found-container{padding:var(--spacing-8) var(--spacing-4);max-width:80rem;margin-left:auto;margin-right:auto}.not-found-container .features-section{border:none;padding-top:var(--spacing-4)}.not-found-hero{text-align:center;margin-bottom:var(--spacing-8)}.not-found-hero-title{font-size:2.5rem;font-weight:700;margin-bottom:var(--spacing-8);font-family:var(--font-heading);color:var(--color-slate-900)}.not-found-overview{background-color:var(--color-white);padding:var(--spacing-8);border-radius:var(--radius-3xl);box-shadow:var(--shadow-md);border:2px solid var(--color-slate-100);max-width:48rem;margin:0 auto var(--spacing-8);text-align:left;display:flex;align-items:center;flex-direction:column}@media(min-width:768px){.not-found-overview{flex-direction:row}}img{max-width:15rem;margin-right:var(--spacing-8)}p{color:var(--color-slate-600);line-height:1.6;margin-bottom:var(--spacing-4);font-size:1.125rem}.yyc-header{position:sticky;top:0;z-index:50;background-color:#fffc;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--color-slate-200)}.yyc-header.game-mode .container{width:100%!important;max-width:none!important;padding-left:var(--spacing-4);padding-right:var(--spacing-4);transition:all 0s ease 0s!important}.yyc-header-container{display:flex;justify-content:space-between;align-items:center;height:5rem}.yyc-logo-link{display:flex;align-items:center;text-decoration:none;cursor:pointer}.yyc-logo-icon-wrapper{background-color:var(--color-yellow-400);color:var(--color-slate-900);padding:var(--spacing-2);border-radius:var(--radius-xl);margin-right:var(--spacing-3);transform:rotate(-3deg);box-shadow:var(--shadow-md);transition:transform .3s ease}.yyc-logo-link:hover .yyc-logo-icon-wrapper{transform:rotate(0)}.yyc-logo-text{font-size:1.25rem;font-family:var(--font-heading);font-weight:700;letter-spacing:-.025em;color:var(--color-slate-800)}.yyc-nav-links{display:none}@media(min-width:768px){.yyc-nav-links{display:flex;gap:var(--spacing-2)}}.yyc-nav-link{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);border-radius:var(--radius-full);font-weight:700;font-size:.875rem;color:var(--color-slate-600);text-decoration:none;transition:all .3s ease}.yyc-nav-link:hover{background-color:var(--color-yellow-50);text-decoration:underline}.yyc-nav-link.active{text-decoration:underline;color:var(--color-slate-900);background-color:var(--color-yellow-50)}.yyc-mobile-menu-btn{display:block;padding:var(--spacing-2);border-radius:var(--radius-md);color:var(--color-slate-800);background:none;border:none;cursor:pointer}.yyc-mobile-menu-btn:hover{background-color:var(--color-slate-50)}@media(min-width:768px){.yyc-mobile-menu-btn{display:none}}.yyc-mobile-menu-wrapper{display:block}@media(min-width:768px){.yyc-mobile-menu-wrapper{display:none}}.yyc-mobile-menu-overlay{position:fixed;top:5rem;left:0;width:100%;height:calc(100vh - 5rem);background-color:var(--color-white);z-index:49;padding:var(--spacing-6);display:flex;flex-direction:column;gap:var(--spacing-4);border-top:1px solid var(--color-slate-200);animation:slideDown .3s ease-out forwards}.yyc-mobile-menu-overlay.closing{animation:slideUp .3s ease-in forwards}.yyc-mobile-nav-link{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);border-radius:var(--radius-xl);font-weight:700;font-size:1.125rem;color:var(--color-slate-800);text-decoration:none;background-color:var(--color-slate-50);transition:all .2s}.yyc-mobile-nav-link:hover{background-color:var(--color-yellow-50);color:var(--color-slate-900)}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-10px)}}.yyc-footer{background-color:var(--color-slate-900);color:var(--color-slate-400);padding-top:var(--spacing-8);padding-bottom:var(--spacing-8);margin-top:auto}.yyc-footer-content{display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:var(--spacing-4)}@media(min-width:768px){.yyc-footer-content{flex-direction:row}}.yyc-footer-brand{display:flex;align-items:center;gap:var(--spacing-2)}.yyc-footer-logo{background-color:var(--color-yellow-400);padding:var(--spacing-1);border-radius:var(--radius-md);color:var(--color-slate-900);display:flex}.yyc-footer-title{font-weight:700;color:var(--color-slate-200);font-family:var(--font-heading)}.yyc-footer-copyright{font-size:.875rem;font-weight:700;text-align:center}.yyc-footer-links{display:flex;gap:var(--spacing-4)}.yyc-footer-link{color:var(--color-slate-400);text-decoration:none;transition:color .2s}.yyc-footer-link:hover{color:var(--color-yellow-400)}