@import"https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Nunito:wght@400;500;600;700&display=swap";:root{--color-red: #E63946;--color-green: #06A77D;--color-blue: #1D3557;--color-yellow: #F4A261;--color-bg: #F8F9FA;--color-text: #2B2D42;--color-white: #FFFFFF;--color-gray: #8D99AE;--color-light-gray: #EDF2F4;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-xxl: 3rem;--font-heading: "Fredoka", "Nunito", sans-serif;--font-body: "Nunito", "Arial", sans-serif;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-round: 50%;--shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--shadow-md: 0 4px 8px rgba(0, 0, 0, .15);--shadow-lg: 0 8px 16px rgba(0, 0, 0, .2)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-body);background:var(--color-bg);color:var(--color-text);padding:var(--space-lg);line-height:1.6}.playground,.pattern-finder,.emoji-calculator,.quick-count,.pattern-math{width:90%;max-width:1400px}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--color-blue);margin-bottom:var(--space-md)}h1{font-size:3rem;text-align:center}h2{font-size:2rem}h3{font-size:1.5rem}.subtitle{text-align:center;font-size:1.5rem;color:var(--color-gray);margin-bottom:var(--space-lg)}.grid{display:grid;gap:var(--space-md)}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}.btn{padding:var(--space-md) var(--space-lg);font-size:1.25rem;font-family:var(--font-heading);border:none;border-radius:var(--radius-md);cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;box-shadow:var(--shadow-sm);font-weight:700}.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.btn:active{transform:translateY(0)}.btn-red{background:var(--color-red);color:var(--color-white)}.btn-green{background:var(--color-green);color:var(--color-white)}.btn-blue{background:var(--color-blue);color:var(--color-white)}.btn-yellow{background:var(--color-yellow);color:var(--color-text)}.btn-gray{background:var(--color-light-gray);color:var(--color-text)}.card{background:var(--color-white);padding:var(--space-lg);border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}.emoji-cell{width:60px;height:60px;display:flex;align-items:center;justify-content:center;font-size:2.5rem;border:2px solid var(--color-gray);border-radius:var(--radius-sm);background:var(--color-white);transition:transform .2s ease,background .2s ease}.emoji-cell:hover{transform:scale(1.1);background:var(--color-light-gray)}.pattern-row{display:flex;gap:var(--space-sm);align-items:center;justify-content:center;flex-wrap:wrap}@media (max-width: 768px){h1{font-size:2rem}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}