#site-guide{--guide-ink:#21483b;--guide-paper:#fffdf6;color:var(--guide-ink)}
.guide-launcher{position:fixed;right:22px;bottom:20px;z-index:150;border:1px solid #ffffff55;background:#21483b;color:#fffdf6;border-radius:40px;padding:13px 20px;display:flex;align-items:center;gap:12px;font-size:.8rem;font-weight:650;box-shadow:0 12px 35px #163f3933}.guide-launcher>span{font-size:25px;color:#d8ee99}
.guide-welcome,.guide-panel,.guide-tour-card{position:fixed;z-index:151;right:22px;background:var(--guide-paper);border:1px solid #dde5d7;border-radius:20px;box-shadow:0 20px 60px #153c3433}.guide-welcome{bottom:85px;width:310px;padding:26px}.guide-welcome p{font-size:.85rem;line-height:1.7;margin:12px 0}.guide-welcome button:not(.guide-welcome-dismiss){border:1px solid #21483b;border-radius:30px;padding:8px 12px;background:#edf2df;color:#21483b;font-size:.75rem;margin:4px 3px 0 0}.guide-welcome-dismiss{position:absolute;right:9px;top:4px;font-size:24px;background:none;border:0;color:#21483b}
.guide-panel{bottom:82px;width:380px;max-width:calc(100vw - 28px);height:min(600px,calc(100dvh - 100px));display:flex;flex-direction:column;overflow:hidden}.guide-panel[hidden],.guide-welcome[hidden],.guide-tour-card[hidden]{display:none!important}.guide-panel header{background:#21483b;color:#fffdf6;padding:18px;display:flex;align-items:center;justify-content:space-between}.guide-panel header>div{display:flex;align-items:center;gap:12px}.guide-panel h2{font-size:1rem;margin:0 0 5px}.guide-panel small{font-size:.7rem;color:#d8e8d4}.guide-spark{font-size:30px;color:#d8ee99}.guide-close{border:0;color:white;background:none;font-size:26px;padding:0 5px}
.guide-messages{flex:1;min-height:100px;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;overscroll-behavior:contain}.guide-message{white-space:pre-wrap;font-size:.82rem;line-height:1.65;border-radius:14px;padding:12px;background:#edf2e7;overflow-wrap:anywhere;max-width:95%;align-self:flex-start}.guide-message.is-user{background:#21483b;color:white;align-self:flex-end}.guide-message a{display:block;margin-top:9px;background:#fffdf6;color:#21483b;border:1px solid #cbd9c6;padding:8px 10px;border-radius:9px;font-weight:650;text-decoration:none}.guide-message button{border:1px solid;background:white;border-radius:8px;margin-top:10px;padding:6px 10px;color:#21483b}.guide-quick{display:flex;flex-wrap:wrap;gap:6px;padding:10px 14px;border-top:1px solid #dde5d7}.guide-quick button,.guide-quick a{font-size:.68rem;background:none;border:1px solid #d1dbcb;color:#21483b;border-radius:20px;padding:6px 9px;text-decoration:none}
.guide-question-form{display:flex;gap:7px;padding:5px 14px 10px}.guide-question-form input{width:0;flex:1;min-width:0;border:1px solid #cbd9c6;border-radius:10px;padding:10px;font-size:.8rem}.guide-question-form button,.guide-tour-card [data-tour-next]{border:0;background:#21483b;color:white;border-radius:10px;padding:10px 13px;font-size:.8rem}.guide-question-form button:disabled{opacity:.5}.guide-privacy{font-size:.61rem;line-height:1.55;color:#6a786d;padding:0 15px;margin:0 0 12px}
.guide-tour-card{bottom:85px;width:340px;padding:25px}.guide-tour-count{font:600 .7rem monospace;color:#708260}.guide-tour-card h2{font-size:1.4rem;margin:12px 0}.guide-tour-card p{font-size:.85rem;line-height:1.7}.guide-tour-card>div{display:flex;justify-content:space-between;gap:10px}.guide-tour-card [data-tour-exit]{border:0;background:none;font-size:.75rem;color:#21483b}.guide-tour-target{outline:3px solid #8bac42!important;outline-offset:5px;scroll-margin-top:125px!important}
#site-guide button:focus-visible,#site-guide a:focus-visible{outline:3px solid #90b349;outline-offset:3px}
@media(max-width:600px){.guide-launcher{right:14px;bottom:14px;padding:10px 14px;font-size:.72rem}.guide-panel{right:14px;bottom:72px;height:min(610px,calc(100dvh - 90px))}.guide-welcome,.guide-tour-card{right:14px;bottom:72px;width:min(340px,calc(100vw - 28px));padding:20px}.guide-tour-card{max-height:45dvh;overflow:auto}}
@media(prefers-reduced-motion:reduce){.guide-tour-target{scroll-behavior:auto}}
/* Jhilik's small learning companion: shared optimized transparent asset. */
.guide-mascot{position:relative;display:inline-flex;flex-shrink:0;width:54px;height:54px;isolation:isolate}
.guide-mascot img{display:block;width:100%;height:100%;object-fit:contain;position:relative;z-index:1;animation:guide-float 4s ease-in-out infinite;transform-origin:50% 85%;filter:drop-shadow(0 3px 3px #102d3525)}
.guide-mascot i{position:absolute;left:15%;right:15%;bottom:0;height:5px;border-radius:50%;background:#122b3720;animation:guide-shadow 4s ease-in-out infinite}
.guide-launcher{padding:8px 18px 8px 9px;gap:8px;min-height:65px}.guide-launcher>.guide-mascot{width:54px;height:54px}
.guide-panel header .guide-mascot{width:59px;height:59px}.guide-panel header{padding:12px 16px}
.guide-welcome>.guide-mascot{float:left;width:60px;height:60px;margin:0 10px 4px -4px}.guide-welcome p{clear:both;padding-top:8px}
.guide-thinking .guide-panel .guide-mascot img{animation:guide-curious .85s ease-in-out infinite}
.guide-thinking .guide-panel .guide-mascot:after{content:'•••';position:absolute;right:-11px;top:-2px;font:700 14px monospace;color:#d8ee99;letter-spacing:2px;animation:guide-glimmer 1s ease-in-out infinite}
.guide-replied .guide-panel .guide-mascot img{animation:guide-hello .8s ease-in-out}
.guide-launcher:hover .guide-mascot img{animation:guide-hello .8s ease-in-out}
@keyframes guide-float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-4px) rotate(3deg)}}
@keyframes guide-shadow{0%,100%{transform:scaleX(1);opacity:.65}50%{transform:scaleX(.75);opacity:.35}}
@keyframes guide-curious{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-3px) rotate(6deg)}}
@keyframes guide-hello{0%,100%{transform:rotate(0)}25%{transform:rotate(-10deg) translateY(-3px)}65%{transform:rotate(8deg) translateY(-3px)}}
@keyframes guide-glimmer{50%{opacity:.4}}
@media(max-width:600px){.guide-launcher{padding:6px 12px 6px 5px;min-height:56px}.guide-launcher>.guide-mascot{width:46px;height:46px}}
@media(prefers-reduced-motion:reduce){#site-guide .guide-mascot img,#site-guide .guide-mascot i,#site-guide .guide-mascot:after{animation:none!important;transform:none!important}}
