:root{--bg: #fafaf8;--fg: #1a1a1a;--subtle: #999;--bubble-tint: rgba(0, 0, 0, .03)}[data-theme=dark]{--bg: #0a0a0a;--fg: #e8e8e8;--subtle: #555;--bubble-tint: rgba(255, 255, 255, .05)}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;height:100dvh;background:var(--bg);color:var(--fg);font-family:Caveat,cursive;font-size:clamp(20px,4.5vw,24px);transition:background .3s ease,color .3s ease;overflow:hidden}#app{display:flex;flex-direction:column;height:100%;max-width:clamp(540px,75vw,860px);margin:0 auto;padding:clamp(16px,3vw,32px);padding-bottom:env(safe-area-inset-bottom,16px)}header{text-align:center;padding:clamp(12px,2vw,24px) 0 clamp(8px,1.5vw,16px);position:relative;flex-shrink:0}h1{font-size:clamp(2.2rem,8vw,3.5rem);font-weight:700;line-height:1.15;letter-spacing:-.01em}.tagline{font-size:clamp(1.2rem,4vw,1.4rem);color:var(--subtle);margin-top:4px;font-style:italic}#theme-toggle{position:absolute;top:clamp(12px,2vw,24px);right:0;background:none;border:none;color:var(--fg);font-size:clamp(1.3rem,2.5vw,1.8rem);cursor:pointer;padding:4px 8px;font-family:inherit;opacity:.6;transition:opacity .2s}#theme-toggle:hover{opacity:1}#chat-area{flex:1;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(12px,2vw,24px) 0;min-height:0}#messages{display:flex;flex-direction:column;gap:clamp(12px,2vw,20px);overflow-y:auto;overflow-x:hidden;scrollbar-width:none}#messages::-webkit-scrollbar{display:none}.bubble{max-width:85%;animation:bubble-in .5s cubic-bezier(.34,1.56,.64,1) both}.bubble.user{align-self:flex-end}.bubble.assistant{align-self:flex-start;display:flex;align-items:flex-end;gap:8px}.bubble.assistant .bubble-content{margin-bottom:36px}.rocky-avatar{flex-shrink:0;width:clamp(56px,10vw,80px);align-self:flex-end;margin-bottom:12px;animation:rocky-breathe 6s ease-in-out infinite}.rocky-avatar svg{display:block;width:100%;height:100%}@keyframes rocky-breathe{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-1.5px) scale(1.015)}}.rocky-eyelid{opacity:0;animation:eyelid-blink 6s ease-in-out infinite}.rocky-eyelid:nth-of-type(2){animation-delay:.06s}@keyframes eyelid-blink{0%,90%,to{opacity:0}92%,93.5%{opacity:1}94%,95%{opacity:0}95.5%,97%{opacity:1}97.5%{opacity:0}}.steam-wisp{animation:steam-rise 4s ease-in-out infinite;opacity:0}@keyframes steam-rise{0%{opacity:0;transform:translateY(2px)}20%{opacity:.4}60%{opacity:.25}to{opacity:0;transform:translateY(-6px)}}.rocky-avatar.warp-in{animation:rocky-warp-in .6s cubic-bezier(.34,1.56,.64,1) both}@keyframes rocky-warp-in{0%{opacity:0;transform:translateY(40px) scale(.2)}60%{opacity:1;transform:translateY(-8px) scale(1.05)}to{opacity:1;transform:translateY(0) scale(1)}}.rocky-avatar.warp-out{animation:rocky-warp-out .7s ease-in forwards}@keyframes rocky-warp-out{0%{opacity:1;transform:translateY(0) scale(1)}35%{opacity:1;transform:translateY(-20px) scale(1.05)}to{opacity:0;transform:translateY(50px) scale(0)}}.bubble-content{display:inline-block;position:relative;padding:clamp(10px,2vw,16px) clamp(18px,3vw,28px);font-size:clamp(1.25rem,4.5vw,1.5rem);line-height:1.4;color:var(--fg);margin-bottom:10px}.bubble.correct .bubble-content{font-weight:700;font-size:clamp(1.25rem,2.5vw,1.6rem)}@keyframes bubble-in{0%{opacity:0;transform:translateY(12px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}.typing-bubble .bubble-content{padding:clamp(10px,2vw,16px) clamp(18px,3vw,30px)}.typing span{display:inline-block;font-size:clamp(1.5rem,2.5vw,2rem);font-weight:700;line-height:1;animation:typing-bounce 1.4s ease-in-out infinite}.typing span:nth-child(2){animation-delay:.15s}.typing span:nth-child(3){animation-delay:.3s}@keyframes typing-bounce{0%,60%,to{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}#input-area{display:flex;gap:clamp(8px,1.5vw,14px);padding:clamp(8px,1.5vw,16px) 0;align-items:center;flex-shrink:0}#chat-input{flex:1;font-family:Caveat,cursive;font-size:clamp(1.25rem,4.5vw,1.5rem);color:var(--fg);--wired-input-color: var(--fg)}#send-btn{font-family:Caveat,cursive;font-size:clamp(1.15rem,2.2vw,1.5rem);cursor:pointer;color:var(--fg);padding:0 clamp(4px,1vw,8px)}footer{text-align:center;padding:4px 0;flex-shrink:0}footer p{font-size:clamp(.75rem,1.2vw,.9rem);color:var(--subtle);letter-spacing:.05em}wired-input,wired-button{color:var(--fg);border-radius:24px!important;overflow:hidden!important}#intro-screen{flex:1;display:flex;align-items:center;justify-content:center}#intro-content{text-align:center;max-width:400px;padding:0 20px}.intro-text{font-size:clamp(1.5rem,5vw,1.8rem);line-height:1.4;margin-bottom:6px}.intro-text-sub{font-size:clamp(1.1rem,3.5vw,1.1rem);color:var(--subtle);font-style:italic;margin-bottom:clamp(20px,4vw,36px)}.intro-start{font-family:Caveat,cursive;font-size:clamp(1.4rem,5vw,1.5rem);background:none;border:none;color:var(--fg);cursor:pointer;padding:10px 28px;position:relative;transition:opacity .2s}.intro-start:hover{opacity:.7}.download-status{margin-top:20px;min-height:40px}.download-text{font-size:clamp(.95rem,1.8vw,1.15rem);color:var(--subtle);font-style:italic;margin-bottom:8px}.download-bar{width:70%;max-width:280px;height:4px;margin:0 auto;background:var(--bubble-tint);border-radius:2px;overflow:hidden}.download-fill{height:100%;background:var(--fg);border-radius:2px;transition:width .3s ease;width:0%}.hidden,#intro-screen.hidden{display:none!important}.revealed #input-area{opacity:.4;pointer-events:none;transition:opacity .6s ease}@media(min-width:600px){.bubble{max-width:75%}}@media(min-width:1200px){.bubble{max-width:65%}}