:root{--bg-1: #170f2b;--bg-2: #241542;--bg-3: #2d1a52;--panel: rgba(255, 255, 255, .07);--panel-border: rgba(255, 216, 107, .28);--gold: #ffd86b;--ember: #ffb347;--ember-deep: #ff8c42;--text: #fff8ec;--muted: #c3b3e0;--good: #9be89e;--radius-lg: 28px;--radius-md: 20px;--tap: 88px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}body{margin:0;font-family:Nunito,Segoe UI,system-ui,-apple-system,sans-serif;color:var(--text);background:radial-gradient(1200px 800px at 70% -10%,var(--bg-3),transparent),linear-gradient(160deg,var(--bg-1),var(--bg-2) 60%,var(--bg-1));overflow:hidden;user-select:none;-webkit-user-select:none}button{font-family:inherit;cursor:pointer}.app{position:relative;height:100dvh;display:flex;flex-direction:column;overflow:hidden}.hud{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:10px 18px 0}.hud__stars{font-size:24px;font-weight:800;background:var(--panel);border:2px solid var(--panel-border);padding:6px 18px;border-radius:999px}.hud__lesson{font-size:20px;font-weight:700;color:var(--muted)}.hud__sound{font-size:26px;background:var(--panel);border:2px solid var(--panel-border);border-radius:16px;width:56px;height:56px}.app-main{position:relative;z-index:2;flex:1;min-height:0;display:grid;grid-template-columns:1.15fr .85fr;gap:18px;padding:8px 22px}.app-left{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:0}.app-right{display:flex;align-items:center;justify-content:center;background:var(--panel);border:2px solid var(--panel-border);border-radius:var(--radius-lg);min-height:0}.app-bottom{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;gap:22px;padding:10px 22px calc(14px + env(safe-area-inset-bottom))}.app-bottom__fallback{align-self:center}.app__sparkles{position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center;pointer-events:none}.app__parent{position:fixed;left:14px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:8}.sparky{flex-shrink:0;animation:bob 3.2s ease-in-out infinite}.sparky--happy{animation:wiggle .9s ease-in-out infinite}.sparky--thinking{animation:bob 4.5s ease-in-out infinite}.sparky__rays{transform-origin:75px 65px;animation:spin 14s linear infinite}.sparky--happy .sparky__rays{animation-duration:3s}.bubble{position:relative;max-width:640px;background:var(--panel);border:2px solid var(--panel-border);border-radius:var(--radius-lg);padding:16px 24px;text-align:center;backdrop-filter:blur(4px)}.bubble__main{font-size:clamp(22px,2.6vw,30px);font-weight:700;line-height:1.3}.bubble__sub{margin-top:10px;padding-top:10px;border-top:1px dashed rgba(255,216,107,.35);font-size:clamp(24px,3vw,36px);font-weight:800;color:var(--gold);display:flex;flex-direction:column;gap:4px}.bubble__emoji{font-size:clamp(28px,3.4vw,40px);letter-spacing:4px}.bubble__tail{position:absolute;left:64px;bottom:-14px;border:12px solid transparent;border-top-color:var(--panel-border)}.answers{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}.answers__btn{min-height:var(--tap);min-width:128px;padding:12px 30px;font-size:34px;font-weight:800;color:var(--text);background:linear-gradient(180deg,#4b2a86,#35205e);border:3px solid rgba(255,216,107,.45);border-radius:24px;box-shadow:0 6px #00000059,0 10px 24px #0000004d;transition:transform .12s ease,box-shadow .12s ease}.answers__btn:hover{transform:translateY(-2px)}.answers__btn:active{transform:translateY(3px) scale(.97);box-shadow:0 2px #00000059}.answers__btn:disabled{opacity:.55}.mic{position:relative;width:118px;height:118px;border-radius:50%;border:4px solid var(--gold);background:radial-gradient(circle at 35% 30%,#ffe29a,var(--ember) 60%,var(--ember-deep));color:#4a2c10;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 8px #00000059,0 14px 30px #ffb34759;flex-shrink:0}.mic__icon,.mic__wave{font-size:40px;line-height:1}.mic__label{font-size:13px;font-weight:800;margin-top:2px}.mic:active{transform:scale(.95)}.mic:disabled{opacity:.5}.mic--listening{animation:micPulse 1s ease-in-out infinite}.mic__ring{position:absolute;inset:-10px;border-radius:50%;border:3px solid rgba(255,216,107,.7);animation:ring 1.2s ease-out infinite;pointer-events:none}.creature{display:flex;flex-direction:column;align-items:center;width:100%;max-width:380px}.creature__svg{width:min(34vh,100%);max-height:42vh}.creature--growing .creature__svg{animation:breathe 1.6s ease-in-out}.creature__cell{transform-box:fill-box;transform-origin:center;animation:cellFloat 3.4s ease-in-out infinite}.organ--new{animation:pop .9s cubic-bezier(.34,1.56,.64,1);transform-box:fill-box;transform-origin:center}.organ--heart{transform-box:fill-box;transform-origin:center;animation:heartbeat 2.2s ease-in-out infinite}.organ--voice{transform-box:fill-box;transform-origin:center;animation:voiceWave 2.4s ease-in-out infinite}.creature__dots{display:flex;gap:8px;margin-top:6px}.creature__dot{width:12px;height:12px;border-radius:50%;background:#ffffff2e}.creature__dot--on{background:var(--gold);box-shadow:0 0 8px #ffd86bcc}.starfield{position:absolute;inset:0;z-index:0;pointer-events:none}.starfield__star{position:absolute;border-radius:50%;background:#fff;opacity:.75;animation:twinkle 3s ease-in-out infinite}.starfield__planet{position:absolute;font-size:54px;opacity:.85}.starfield__planet--1{right:6%;top:12%;animation:floatY 9s ease-in-out infinite}.starfield__planet--2{left:4%;top:20%;font-size:38px;animation:floatY 11s ease-in-out infinite reverse}.sparkles{position:relative;width:0;height:0}.sparkles__item{position:absolute;left:0;top:0;font-size:26px;animation:sparkleFly 1s ease-out forwards;opacity:0}.welcome,.done{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;text-align:center}.welcome__title,.done__title{font-size:clamp(30px,4.5vw,46px);margin:0}.welcome__text,.done__text{font-size:clamp(20px,2.4vw,28px);color:var(--muted);margin:0}.welcome__input{font-size:30px;font-weight:800;text-align:center;padding:14px 22px;width:min(420px,80vw);border-radius:20px;border:3px solid var(--panel-border);background:var(--panel);color:var(--text);outline:none}.welcome__input::placeholder{color:#fff8ec66}.welcome__actions{display:flex;gap:16px;align-items:center}.welcome__go{background:linear-gradient(180deg,#ffc44d,#ff8c42);color:#4a2c10;border-color:var(--gold)}.welcome__skip{background:none;border:none;color:var(--muted);font-size:18px;text-decoration:underline}.welcome__parent{margin-top:10px}.done__creature{position:relative;width:min(320px,60vw)}.done__again{background:linear-gradient(180deg,#ffc44d,#ff8c42);color:#4a2c10;border-color:var(--gold)}.parent-gate{position:relative;overflow:hidden;height:52px;padding:0 18px;border-radius:16px;font-size:15px;font-weight:700;color:var(--muted);background:var(--panel);border:2px solid rgba(195,179,224,.35);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;touch-action:none}.parent-gate__hint{font-size:11px;font-weight:500;opacity:.75}.parent-gate__fill{position:absolute;left:0;top:0;bottom:0;width:calc(var(--gate-progress) * 100%);background:#ffd86b40}.settings-overlay{position:fixed;inset:0;z-index:20;background:#0a0614b8;display:flex;align-items:center;justify-content:center;padding:20px}.settings{width:min(560px,94vw);max-height:86vh;overflow:auto;background:linear-gradient(180deg,#2b1b4d,#241542);border:2px solid var(--panel-border);border-radius:var(--radius-lg);padding:24px 28px}.settings__title{margin:0 0 16px;font-size:26px}.settings__row{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:14px 0;font-size:18px}.settings__input{font-size:18px;padding:10px 14px;border-radius:12px;border:2px solid var(--panel-border);background:var(--panel);color:var(--text);width:220px}.settings__switch{font-size:18px;padding:10px 18px;border-radius:12px;background:var(--panel);border:2px solid var(--panel-border);color:var(--text)}.settings__info{margin:18px 0;padding:14px 16px;border-radius:14px;background:#0003}.settings__info h3{margin:0 0 8px;font-size:16px;color:var(--muted)}.settings__info p{margin:6px 0;font-size:15px;color:var(--text)}.settings__row--danger{gap:10px}.settings__btn{font-size:17px;font-weight:700;padding:12px 20px;border-radius:14px;border:2px solid transparent}.settings__btn--primary{width:100%;background:linear-gradient(180deg,#ffc44d,#ff8c42);color:#4a2c10;margin-top:10px}.settings__btn--ghost{background:var(--panel);color:var(--text);border-color:var(--panel-border)}.settings__btn--danger{background:#a33b3b;color:#fff}.growth-overlay{position:fixed;inset:0;z-index:15;background:#0a0614c7;display:flex;align-items:center;justify-content:center;animation:fadeIn .4s ease}.growth-overlay__card{position:relative;text-align:center;padding:26px 40px;border-radius:var(--radius-lg);background:linear-gradient(180deg,#2b1b4d,#241542);border:2px solid var(--gold);animation:popIn .5s cubic-bezier(.34,1.56,.64,1)}.growth-overlay__title{margin:0 0 6px;font-size:clamp(26px,3.4vw,38px);color:var(--gold)}.growth-overlay__creature{position:relative;width:min(280px,52vw);margin:0 auto}.growth-overlay__stage{font-size:22px;font-weight:800;margin:10px 0 6px}.growth-overlay__organs{list-style:none;margin:0;padding:0;font-size:18px;color:var(--good)}.growth-overlay__organs li{margin:4px 0}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes wiggle{0%,to{transform:rotate(-3deg)}50%{transform:rotate(3deg) translateY(-6px)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes twinkle{0%,to{opacity:.25;transform:scale(1)}50%{opacity:1;transform:scale(1.35)}}@keyframes floatY{0%,to{transform:translateY(0)}50%{transform:translateY(14px)}}@keyframes micPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes ring{0%{transform:scale(.9);opacity:.9}to{transform:scale(1.45);opacity:0}}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.06)}}@keyframes cellFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes pop{0%{transform:scale(0);opacity:0}70%{transform:scale(1.25)}to{transform:scale(1);opacity:1}}@keyframes popIn{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes heartbeat{0%,to{transform:scale(1)}30%{transform:scale(1.14)}60%{transform:scale(.98)}}@keyframes voiceWave{0%,to{opacity:.5}50%{opacity:1}}@keyframes sparkleFly{0%{opacity:0;transform:translate(0) scale(.4)}15%{opacity:1}to{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1.15)}}@media (max-width: 860px),(max-height: 520px){.app-main{grid-template-columns:1fr;grid-template-rows:auto 1fr;gap:8px}.app-right{max-height:30vh;padding:4px}.creature__svg{max-height:24vh}.bubble{padding:12px 18px}.answers__btn{min-width:96px;font-size:28px;min-height:80px}.mic{width:96px;height:96px}.mic__icon,.mic__wave{font-size:32px}}@media (min-width: 1400px){.bubble__main{font-size:32px}.answers__btn{font-size:40px;min-height:104px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:1ms!important;animation-iteration-count:1!important}}