.tubie-root{--case:#cfc3a9;--case-hi:#ddd2bb;--case-lo:#b1a587;--case-line:#473a27;--bezel:#2c3530;--bezel-hi:#3c4a40;--metal:#9a9078;--ph-bg:#86c08a;--ph-ink:#274b2d;--ph-glow:rgba(118,210,128,.65);--ph-bright:1;display:flex;align-items:center;justify-content:center;position:relative;line-height:0}.tubie-root[data-screen=amber]{--ph-bg:#e0b65f;--ph-ink:#5e4012;--ph-glow:rgba(240,190,80,.6)}.tubie-root[data-screen=clay]{--ph-bg:#e3a07c;--ph-ink:#6f2f17;--ph-glow:rgba(217,119,87,.6)}.tubie-root[data-screen=blue]{--ph-bg:#8fb6d6;--ph-ink:#1f4660;--ph-glow:rgba(120,170,220,.6)}.tubie-svg{width:100%;height:100%;overflow:visible;display:block;animation:tubie-sway 6s ease-in-out infinite;transform-origin:50% 88%}@keyframes tubie-sway{0%,to{transform:rotate(-1.1deg)}50%{transform:rotate(1.1deg)}}.tubie-screen{filter:drop-shadow(0 0 7px var(--ph-glow));animation:tubie-breathe 4.5s ease-in-out infinite}@keyframes tubie-breathe{0%,to{filter:drop-shadow(0 0 5px var(--ph-glow))}50%{filter:drop-shadow(0 0 12px var(--ph-glow))}}.tubie-phosphor{fill:var(--ph-bg);animation:tubie-flicker 6s steps(60) infinite}@keyframes tubie-flicker{0%,96%,to{opacity:1}97%{opacity:.92}98%{opacity:1}99%{opacity:.95}}.tubie-scan{animation:tubie-scan 7s linear infinite}@keyframes tubie-scan{0%{transform:translateY(0)}to{transform:translateY(6px)}}.tubie-root .ink{stroke:var(--ph-ink);fill:none;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}.tubie-root .ink-fill{fill:var(--ph-ink);stroke:none}.tubie-root .brow{stroke-width:4.5;transform-origin:center;transition:transform .25s cubic-bezier(.22,1,.36,1)}.tubie-cheek{fill:#e2887d;opacity:.6}.eye-hi{pointer-events:none}.tubie-root[data-state=error] .brow-l{transform:rotate(20deg) translateY(2px)}.tubie-root[data-state=error] .brow-r{transform:rotate(-20deg) translateY(2px)}.tubie-root[data-state=thinking] .brow-l{transform:translateY(-3px) rotate(-9deg)}.tubie-root[data-state=thinking] .brow-r{transform:translateY(1px) rotate(9deg)}.tubie-root[data-state=success] .brow,.tubie-root[data-state=listening] .brow{transform:translateY(-4px)}.tubie-root[data-state=working] .brow-l{transform:rotate(8deg) translateY(1px)}.tubie-root[data-state=working] .brow-r{transform:rotate(-8deg) translateY(1px)}.tubie-root[data-state=sleeping] .brow{transform:translateY(3px);opacity:.7}.eye-arc-happy,.eye-arc-sleep,.eye-x,.eye-squint,.mouth-flat,.mouth-o,.mouth-frown,.fx-dots,.fx-zzz,.fx-prog,.fx-spark{display:none}.eye-grp{transform-origin:center;transition:transform .25s cubic-bezier(.22,1,.36,1)}.tubie-root[data-state=idle] .eye-open,.tubie-root[data-state=speaking] .eye-open{animation:tubie-blink 4.4s infinite;transform-origin:center}@keyframes tubie-blink{0%,92%,to{transform:scaleY(1)}95%{transform:scaleY(.1)}}.tubie-root[data-state=idle] .face{animation:tubie-look 9s ease-in-out infinite}@keyframes tubie-look{0%,18%,82%,to{transform:translate(0)}30%,46%{transform:translate(5px)}58%,72%{transform:translate(-5px)}}.tubie-root[data-state=listening] .eye-open{transform:scaleY(1.18) scaleX(1.1)}.tubie-root[data-state=listening] .mouth-smile{display:none}.tubie-root[data-state=listening] .mouth-o{display:block;transform:scaleY(.6)}.tubie-root[data-state=listening] .listen-ring{opacity:1;animation:tubie-ring 1.6s ease-out infinite}.tubie-root[data-state=thinking] .face{transform:translateY(-2px)}.tubie-root[data-state=thinking] .eye-open{display:none}.tubie-root[data-state=thinking] .eye-squint{display:block}.tubie-root[data-state=thinking] .eye-grp{transform:translateY(-7px)}.tubie-root[data-state=thinking] .mouth-smile{display:none}.tubie-root[data-state=thinking] .mouth-flat,.tubie-root[data-state=thinking] .fx-dots{display:block}.tubie-root[data-state=thinking] .dot{animation:tubie-dot 1.3s infinite}.tubie-root[data-state=thinking] .dot:nth-child(2){animation-delay:.18s}.tubie-root[data-state=thinking] .dot:nth-child(3){animation-delay:.36s}@keyframes tubie-dot{0%,to{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-2px)}}.tubie-root[data-state=working]{--ph-bg:#e0b65f;--ph-ink:#5e4012;--ph-glow:rgba(240,190,80,.55)}.tubie-root[data-state=working] .eye-open{transform:scaleY(.35)}.tubie-root[data-state=working] .mouth-smile{display:none}.tubie-root[data-state=working] .mouth-flat,.tubie-root[data-state=working] .fx-prog{display:block}.tubie-root[data-state=working] .prog-fill{animation:tubie-prog 1.8s ease-in-out infinite;transform-origin:left center}@keyframes tubie-prog{0%{transform:scaleX(.05)}70%{transform:scaleX(1)}to{transform:scaleX(1);opacity:.4}}.tubie-root[data-state=success]{--ph-bg:#7fd089;--ph-glow:rgba(130,230,140,.8)}.tubie-root[data-state=success] .eye-open{display:none}.tubie-root[data-state=success] .eye-arc-happy{display:block}.tubie-root[data-state=success] .mouth-smile{transform:scale(1.18);transform-origin:center}.tubie-root[data-state=success] .tubie-cheek{opacity:.75}.tubie-root[data-state=success] .tubie-screen{animation:tubie-flash .6s ease-out 1}@keyframes tubie-flash{0%{filter:drop-shadow(0 0 22px var(--ph-glow)) brightness(1.5)}to{filter:drop-shadow(0 0 7px var(--ph-glow)) brightness(1)}}.tubie-root[data-state=success] .fx-spark{display:block}.tubie-root[data-state=success] .spark{animation:tubie-spark 1.4s ease-in-out infinite;transform-origin:center}.tubie-root[data-state=success] .spark:nth-child(2){animation-delay:.4s}.tubie-root[data-state=success] .spark:nth-child(3){animation-delay:.8s}@keyframes tubie-spark{0%,to{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1)}}.tubie-root[data-state=error]{--ph-bg:#d98686;--ph-ink:#6e2222;--ph-glow:rgba(220,90,90,.7)}.tubie-root[data-state=error] .tubie-svg{animation:tubie-shake .35s ease-in-out infinite}@keyframes tubie-shake{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(-2px) rotate(-.6deg)}75%{transform:translate(2px) rotate(.6deg)}}.tubie-root[data-state=error] .eye-open{display:none}.tubie-root[data-state=error] .eye-x{display:block}.tubie-root[data-state=error] .mouth-smile{display:none}.tubie-root[data-state=error] .mouth-frown{display:block}.tubie-root[data-state=error] .tubie-phosphor{animation:tubie-glitch .9s steps(8) infinite}@keyframes tubie-glitch{0%,to{opacity:1}20%{opacity:.7}22%{opacity:1}60%{opacity:.85}}.tubie-root[data-state=speaking] .mouth-smile{display:none}.tubie-root[data-state=speaking] .mouth-o{display:block;animation:tubie-talk .42s ease-in-out infinite;transform-origin:center}@keyframes tubie-talk{0%,to{transform:scaleY(.28)}50%{transform:scaleY(1)}}.tubie-root[data-state=sleeping]{--ph-bright:.55}.tubie-root[data-state=sleeping] .tubie-screen{filter:drop-shadow(0 0 3px var(--ph-glow)) brightness(.6);animation:none}.tubie-root[data-state=sleeping] .eye-open{display:none}.tubie-root[data-state=sleeping] .eye-arc-sleep{display:block}.tubie-root[data-state=sleeping] .mouth-smile{display:none}.tubie-root[data-state=sleeping] .mouth-flat,.tubie-root[data-state=sleeping] .fx-zzz{display:block}.tubie-root[data-state=sleeping] .zzz{animation:tubie-zzz 3s ease-in-out infinite;transform-origin:center}.tubie-root[data-state=sleeping] .zzz:nth-child(2){animation-delay:1s}.tubie-root[data-state=sleeping] .zzz:nth-child(3){animation-delay:2s}@keyframes tubie-zzz{0%{opacity:0;transform:translate(0) scale(.6)}30%{opacity:1}to{opacity:0;transform:translate(7px,-16px) scale(1.1)}}.tubie-root[data-state=sleeping] .tubie-svg{animation:tubie-snooze 5s ease-in-out infinite}@keyframes tubie-snooze{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(2px) rotate(-1deg)}}.tubie-led{fill:#4caf50;animation:tubie-pulse 2.4s ease-in-out infinite}@keyframes tubie-pulse{0%,to{opacity:.45}50%{opacity:1}}.tubie-root[data-state=thinking] .tubie-led,.tubie-root[data-state=working] .tubie-led{fill:#f6c90e;animation-duration:.7s}.tubie-root[data-state=error] .tubie-led{fill:#e5484d;animation-duration:.4s}.tubie-root[data-state=success] .tubie-led{fill:#4caf50;opacity:1;animation:none}.tubie-root[data-state=sleeping] .tubie-led{fill:#506858;animation-duration:5s}.tubie-status{fill:#4caf50;animation:tubie-pulse 2.4s ease-in-out infinite}.tubie-root[data-state=thinking] .tubie-status,.tubie-root[data-state=working] .tubie-status{fill:#f6c90e;animation-duration:.7s}.tubie-root[data-state=error] .tubie-status{fill:#e5484d;animation-duration:.4s}.tubie-root[data-state=sleeping] .tubie-status{fill:#506858}.listen-ring{opacity:0;stroke:var(--ph-ink);fill:none;stroke-width:3}@keyframes tubie-ring{0%{transform:scale(.5);opacity:.7}to{transform:scale(1.5);opacity:0}}.tubie-root[data-boot="1"] .tubie-phosphor{animation:tubie-boot 1.3s ease-out 1}@keyframes tubie-boot{0%{transform:scaleY(.02);opacity:0}18%{transform:scaleY(.02);opacity:1}45%{transform:scaleY(1)}to{transform:scaleY(1)}}.tubie-root[data-boot="1"] .face,.tubie-root[data-boot="1"] .fx-dots,.tubie-root[data-boot="1"] .fx-prog{animation:tubie-bootface 1.3s ease-out 1}@keyframes tubie-bootface{0%,42%{opacity:0}60%{opacity:1}}.boot-line{display:none}.tubie-root[data-boot="1"] .boot-line{display:block;animation:tubie-bootline 1.3s ease-out 1}@keyframes tubie-bootline{0%,18%{opacity:0;transform:translateY(0)}22%{opacity:.9}to{opacity:0;transform:translateY(74px)}}@media(prefers-reduced-motion:reduce){.tubie-svg,.tubie-screen,.tubie-phosphor,.tubie-scan,.eye-open,.face,.brow,.dot,.prog-fill,.spark,.zzz,.tubie-led,.tubie-status,.listen-ring{animation:none!important}}.tubie-dock{position:fixed;right:22px;bottom:22px;z-index:120;display:flex;flex-direction:column;align-items:flex-end;gap:12px;pointer-events:none}.tubie-dock>*{pointer-events:auto}.tubie-launch{width:76px;height:76px;border-radius:50%;border:1px solid var(--border-light);background:#0d0d0dd9;backdrop-filter:blur(8px);padding:4px;cursor:pointer;box-shadow:var(--shadow-pop);transition:transform var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out)}.tubie-launch:hover{transform:translateY(-2px);border-color:var(--green)}.tubie-launch:focus-visible{outline:none;box-shadow:0 0 0 3px #3d8b3f80}.tubie-bubble{max-width:260px;background:var(--surface-card);border:1px solid var(--border-light);border-radius:var(--radius-lg) var(--radius-lg) 2px var(--radius-lg);padding:14px 16px;box-shadow:var(--shadow-card);display:flex;flex-direction:column;gap:5px;cursor:pointer;transition:opacity var(--dur-mid) var(--ease-out),transform var(--dur-mid) var(--ease-out)}.tubie-bubble strong{color:var(--green-bright);font-size:.9rem}.tubie-bubble span{color:var(--text-muted);font-size:.82rem;line-height:1.5}.tubie-bubble.hidden{opacity:0;transform:translateY(6px) scale(.96);pointer-events:none;height:0;padding:0;margin:0;overflow:hidden}.tubie-panel{position:absolute;right:0;bottom:88px;width:min(360px,calc(100vw - 28px));height:min(520px,70vh);background:var(--surface-card);border:1px solid var(--border-light);border-radius:var(--radius-xl);box-shadow:var(--shadow-pop);display:flex;flex-direction:column;overflow:hidden;opacity:0;transform:translateY(10px) scale(.98);pointer-events:none;transition:opacity var(--dur-mid) var(--ease-out),transform var(--dur-mid) var(--ease-out)}.tubie-panel.open{opacity:1;transform:none;pointer-events:auto}.tubie-panel-head{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--border-dim);background:var(--ink-850)}.tubie-head-av{width:40px;height:40px;flex:none}.tubie-head-meta{display:flex;flex-direction:column;line-height:1.2;flex:1}.tubie-head-meta strong{color:var(--text-strong);font-size:.92rem}.tubie-head-meta span{color:var(--green-bright);font-size:.7rem;font-family:var(--font-mono)}.tubie-panel-close{background:none;border:none;color:var(--text-muted);font-size:1.4rem;line-height:1;cursor:pointer}.tubie-panel-close:hover{color:var(--text-strong)}.tubie-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}.tubie-msg{max-width:85%;padding:9px 12px;border-radius:12px;font-size:.86rem;line-height:1.5}.tubie-msg.bot{align-self:flex-start;background:#ffffff0d;color:var(--text-body);border-bottom-left-radius:3px}.tubie-msg.user{align-self:flex-end;background:var(--green);color:#fff;border-bottom-right-radius:3px}.tubie-msg a{color:var(--green-bright)}.tubie-msg.user a{color:#fff;text-decoration:underline}.tubie-input{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--border-dim)}.tubie-input input{flex:1;background:var(--ink-800);border:1px solid var(--border-card);border-radius:var(--radius-pill);padding:.6rem .9rem;color:var(--text-body);font-family:var(--font-sans);font-size:.88rem;outline:none}.tubie-input input:focus{border-color:var(--green)}.tubie-input button{flex:none;width:40px;height:40px;border-radius:50%;border:none;background:var(--green);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}.tubie-input button:hover{background:var(--green-bright)}@media(max-width:600px){.tubie-dock{right:14px;bottom:14px}.tubie-launch{width:64px;height:64px}.tubie-bubble{max-width:220px}.tubie-panel{bottom:76px;height:70vh}}
