*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,system-ui,sans-serif;background:#fff8f0;color:#4a3728;min-height:100dvh;overflow-x:hidden}button{cursor:pointer;border:none;background:none}.app{min-height:100dvh;display:flex;flex-direction:column;align-items:center;padding:12px 16px 24px;max-width:480px;margin:0 auto;position:relative}.app-header{width:100%;display:flex;justify-content:space-between;margin-bottom:8px}.icon-btn{font-size:28px;padding:4px 8px;border-radius:12px;transition:transform .15s}.icon-btn:hover{transform:scale(1.15)}.icon-btn--muted{opacity:.6}.rabbit{margin:8px 0;display:flex;align-items:center;gap:8px;transition:transform .3s;min-height:96px}.rabbit-img{width:96px;height:96px;object-fit:contain;border-radius:50%}.rabbit--listening{animation:rabbit-listen .6s ease-in-out infinite alternate}.rabbit--generating{animation:rabbit-think 1s ease-in-out infinite alternate}.rabbit--drawing{animation:rabbit-draw .4s ease-in-out infinite alternate}.rabbit--rated .rabbit-emoji{animation:rabbit-happy .5s ease-in-out 3}@keyframes rabbit-listen{to{transform:rotate(-10deg) scale(1.05)}}@keyframes rabbit-think{to{transform:translateY(-8px)}}@keyframes rabbit-draw{to{transform:translate(6px) rotate(5deg)}}@keyframes rabbit-happy{0%,to{transform:scale(1)}50%{transform:scale(1.2) rotate(10deg)}}.rabbit-pencil{font-size:36px;animation:pencil-move .4s ease-in-out infinite alternate}@keyframes pencil-move{to{transform:translate(8px) translateY(-4px) rotate(15deg)}}.speech-bubble{background:#fff3cd;border:2px solid #FFB347;border-radius:16px;padding:8px 16px;font-size:15px;text-align:center;margin:4px 0 8px;max-width:320px;animation:pop-in .2s ease-out}.speech-bubble.hint{background:#f0f8f0;border-color:#7bc67e;color:#5a7355;font-size:14px}@keyframes pop-in{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.paper-canvas-wrap{width:100%;max-width:340px;aspect-ratio:1;background:#fff;border-radius:16px;box-shadow:0 4px 16px #0000001a;overflow:hidden;display:flex;align-items:center;justify-content:center;margin:8px 0}.paper-empty{width:64px;height:64px;border-radius:50%;background:#f5f0e8}.paper-loading{display:flex;flex-direction:column;align-items:center;gap:8px;color:#8b7355}.loading-pencil{font-size:48px;animation:loading-swing 1s ease-in-out infinite alternate}@keyframes loading-swing{0%{transform:rotate(-15deg)}to{transform:rotate(15deg)}}.paper-loading p{font-size:16px}.paper-canvas{width:100%;height:100%;object-fit:contain;display:block}.star-rating{text-align:center;margin:8px 0}.star-label{font-size:16px;margin-bottom:4px;color:#8b7355}.stars{display:flex;gap:8px;justify-content:center}.star-btn{font-size:40px;transition:transform .1s;padding:4px;line-height:1}.star-btn:hover{transform:scale(1.2)}.rating-response{font-size:20px;text-align:center;padding:8px;animation:pop-in .3s ease-out}.text-input-row{display:flex;gap:8px;width:100%;max-width:340px;margin:8px 0}.text-input{flex:1;padding:10px 16px;border:2px solid #DDD;border-radius:24px;font-size:16px;outline:none;font-family:inherit;background:#fff;color:#4a3728}.text-input:focus{border-color:#7bc67e}.send-btn{width:44px;height:44px;background:#7bc67e;color:#fff;border-radius:50%;font-size:20px;display:flex;align-items:center;justify-content:center;transition:transform .1s,background .15s;flex-shrink:0}.send-btn:hover{transform:scale(1.1);background:#68b86b}.bottom-controls{display:flex;align-items:center;gap:24px;margin-top:12px}.text-toggle{font-size:18px;color:#8b7355;padding:8px 16px;border-radius:20px;border:2px solid #DDD;background:#fff;transition:border-color .2s}.text-toggle:hover{border-color:#8b7355}.text-toggle:disabled{opacity:.4;cursor:not-allowed}.mic-btn{width:88px;height:88px;border-radius:50%;background:#7bc67e;font-size:36px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px #7bc67e66;transition:transform .1s,box-shadow .2s;animation:mic-pulse 2s ease-in-out infinite}.mic-btn:hover{transform:scale(1.05)}.mic-btn:disabled{background:#ccc;box-shadow:none;animation:none;cursor:not-allowed}.mic-btn--listening{background:#ff6b6b;box-shadow:0 4px 20px #ff6b6b80;animation:mic-listening .6s ease-in-out infinite alternate}@keyframes mic-pulse{0%,to{box-shadow:0 4px 16px #7bc67e66}50%{box-shadow:0 4px 24px #7bc67eb3}}@keyframes mic-listening{to{transform:scale(1.1);box-shadow:0 4px 28px #ff6b6bb3}}.offline-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;gap:8px;padding:40px 0}.offline-rabbit{font-size:96px;animation:sleep 2s ease-in-out infinite alternate}@keyframes sleep{to{transform:translateY(-8px)}}.offline-screen p{font-size:22px;font-weight:600}.offline-sub{font-size:16px;color:#8b7355;font-weight:400}.free-counter{display:flex;align-items:center;gap:4px;background:#f0faf0;border:1.5px solid #B2DFB4;border-radius:20px;padding:4px 10px;font-size:13px;color:#4a7a4c;white-space:nowrap}.free-counter--low{background:#fff3e0;border-color:#ffcc80;color:#e65100}.free-counter--empty{background:#fdecea;border-color:#f5b8b5;color:#c62828;cursor:pointer;font-weight:600;transition:opacity .15s}.free-counter--empty:hover{opacity:.8}.free-counter-label{margin-left:4px;font-weight:600}.paywall-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fade-in .2s ease-out}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.paywall-modal{background:#fffdf8;border-radius:24px;padding:32px 28px;max-width:320px;width:90%;text-align:center;box-shadow:0 20px 60px #00000040;animation:slide-up .3s ease-out}@keyframes slide-up{0%{transform:translateY(40px);opacity:0}to{transform:translateY(0);opacity:1}}.paywall-rabbit{font-size:64px;margin-bottom:12px}.paywall-title{font-size:22px;color:#4a3728;margin-bottom:12px}.paywall-text{font-size:15px;color:#7a6350;line-height:1.65;margin-bottom:24px}.paywall-btn{display:block;background:linear-gradient(135deg,#7bc67e,#5aad5e);color:#fff;font-size:17px;font-weight:700;padding:14px 24px;border-radius:16px;text-decoration:none;margin-bottom:12px;transition:transform .15s,box-shadow .15s;box-shadow:0 4px 16px #7bc67e73}.paywall-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #7bc67e99}.paywall-hint{font-size:13px;color:#bfb0a0;margin-bottom:16px}.paywall-close{font-size:14px;color:#bfb0a0;background:none;border:none;cursor:pointer;padding:4px 8px;text-decoration:underline}.paywall-close:hover{color:#7a6350}.gallery{width:100%;min-height:100dvh;padding:16px;max-width:480px;margin:0 auto}.gallery-header{display:flex;align-items:center;gap:16px;margin-bottom:16px}.back-btn{font-size:16px;color:#7bc67e;padding:6px 12px;border:2px solid #7BC67E;border-radius:20px;background:#fff;transition:background .15s;white-space:nowrap}.back-btn:hover{background:#f0faf0}.gallery-header h2{font-size:20px}.gallery-empty{text-align:center;padding:60px 0;font-size:18px;line-height:2;color:#8b7355}.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.gallery-item{border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #0000001a;cursor:pointer;transition:transform .15s;background:#fff}.gallery-item:hover{transform:scale(.97)}.gallery-item img{width:100%;aspect-ratio:1;object-fit:cover;display:block}.gallery-item-info{padding:6px 8px;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#4a3728;gap:4px}.gallery-item-prompt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}