*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--cream:#fdf6ee;--rose:#f4a0b5;--rose-light:#fce4ec;--sage:#a8c5a0;--sage-light:#d4e8d0;--text:#3d2b1f;--text-light:#7a5c4a;--radius:24px;--shadow:0 4px 16px #3d2b1f1a;--shadow-sm:0 2px 8px #3d2b1f14}html,body,#root{width:100%;height:100%}body{background:var(--cream);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Georgia,Times New Roman,serif;overflow-x:hidden}.app{background:var(--cream);flex-direction:column;align-items:center;min-height:100dvh;display:flex}.screen{flex-direction:column;align-items:center;gap:24px;width:100%;max-width:390px;min-height:100dvh;padding:24px 20px 40px;display:flex}.btn{border-radius:var(--radius);cursor:pointer;box-shadow:var(--shadow);letter-spacing:.01em;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;border:none;justify-content:center;align-items:center;gap:8px;padding:14px 28px;font-family:inherit;font-size:1rem;font-weight:600;transition:transform .15s,box-shadow .15s,background .15s;display:inline-flex}.btn:active{transform:scale(.95)}.btn-primary{background:var(--rose);color:var(--text)}.btn-primary:hover{background:#f08fa5}.btn-secondary{background:var(--sage);color:var(--text)}.btn-secondary:hover{background:#95b58d}.btn-ghost{color:var(--text-light);box-shadow:var(--shadow-sm);background:#fff}.tile{box-shadow:var(--shadow-sm);cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;background:#fff;border:2px solid #0000;border-radius:16px;justify-content:center;align-items:center;padding:10px 14px;font-size:1.5rem;transition:transform .15s,box-shadow .15s;display:inline-flex}.tile:active{transform:scale(.92)}.tile.selected{border-color:var(--rose);background:var(--rose-light)}.tile.correct{border-color:var(--sage);background:var(--sage-light)}.tile.wrong{background:#fff0f0;border-color:#e88;animation:.3s shake}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}@keyframes bounce-in{0%{opacity:0;transform:scale(.7)}60%{transform:scale(1.1)}to{opacity:1;transform:scale(1)}}@keyframes wobble{0%,to{transform:rotate(0)}20%{transform:rotate(-8deg)}40%{transform:rotate(8deg)}60%{transform:rotate(-5deg)}80%{transform:rotate(5deg)}}@keyframes glow-pulse{0%,to{filter:drop-shadow(0 0 8px #f4a0b566)}50%{filter:drop-shadow(0 0 20px #f4a0b5cc)}}@keyframes star-pop{0%{opacity:0;transform:scale(0)rotate(-30deg)}60%{transform:scale(1.3)rotate(10deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes fade-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes crack-left{0%{opacity:1;transform:translate(0)rotate(0)}to{opacity:0;transform:translate(-60px,30px)rotate(-25deg)}}@keyframes crack-right{0%{opacity:1;transform:translate(0)rotate(0)}to{opacity:0;transform:translate(60px,30px)rotate(25deg)}}@keyframes crack-top{0%{opacity:1;transform:translate(0)rotate(0)}to{opacity:0;transform:translateY(-60px)rotate(0)}}@keyframes creature-appear{0%{opacity:0;transform:scale(0)}50%{transform:scale(1.2)}70%{transform:scale(.95)}to{opacity:1;transform:scale(1)}}.wobble{animation:.5s wobble}@keyframes creature-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}h1{color:var(--text);font-size:2rem;font-weight:700}h2{color:var(--text);font-size:1.4rem;font-weight:700}h3{color:var(--text);font-size:1.1rem;font-weight:600}p{color:var(--text-light);font-size:.95rem;line-height:1.5}.text-center{text-align:center}