/* Layers: workspace 0–10, guide 30, sidebar 49–50, native dialogs/top-layer above all. */
.workspace{padding-bottom:0}
.small-bear-guide{position:fixed;right:24px;bottom:max(9px,env(safe-area-inset-bottom));z-index:30;width:180px;height:68px;--guide-viewport-height:100dvh;--guide-keyboard:0px;pointer-events:none}
.small-bear-guide[data-side=left]{right:auto;left:max(24px,calc((100vw - 1200px)/2))}
/* Reading uses the full viewport; only the last content needs clearance. */
body[data-page]:not([data-page=welcome]) .guide-label{display:none}
body[data-page]:not([data-page=welcome]) .small-bear-guide{width:108px}
body[data-page]:not([data-page=welcome]) .guide-actor{width:64px;height:64px}
body[data-page]:not([data-page=welcome]) .guide-dock-actions{right:66px;bottom:6px}
.small-bear-guide button,.small-bear-guide textarea,.guide-chat{pointer-events:auto}
.small-bear-guide[data-occluded=true]{visibility:hidden;pointer-events:none}
.guide-actor{position:absolute;right:0;bottom:0;width:78px;height:78px;transform-origin:0 0;z-index:2}
.character-button{border:0;background:transparent;padding:0;width:100%;height:100%;display:block;border-radius:12px;cursor:pointer;filter:drop-shadow(0 4px 3px #49362218)}
.character-button:disabled{opacity:1;cursor:default}.character-button:active{transform:none!important}
.character-art{display:block;position:relative;width:100%;height:100%}.character-art>span,.character-art>img{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .6s ease,transform .6s ease;display:grid;place-items:center}
.character-art svg{display:block;width:100%;height:100%;overflow:visible}.character-art>img{object-fit:contain;transform:translate(1%,2%) scale(1.15)}
[data-guide-pixel] .float-keyboard{transform-origin:87px 70px}
[data-phase=sketch] [data-guide-sketch],[data-phase=line] [data-guide-line],[data-phase=color] [data-guide-pixel],[data-phase=pixel] [data-guide-pixel],[data-phase=volume] [data-guide-volume]{opacity:1}
[data-phase=volume] [data-guide-volume]{animation:volume-hello 2s .2s ease-in-out 1}
.guide-dock-actions{position:absolute;right:82px;bottom:13px;display:flex;align-items:center;gap:1px;white-space:nowrap}
.guide-label,.guide-collapse,.guide-restore{border:0;border-radius:8px;background:transparent;color:#526a60;font-size:13px;padding:7px 5px;min-height:34px}
.guide-label span{margin-left:4px}.guide-collapse{color:#6d7e74;padding:7px 6px}.guide-label:hover,.guide-collapse:hover,.guide-restore:hover{background:var(--accent-soft);color:var(--accent)}
.guide-restore{position:absolute;right:0;bottom:12px;padding:8px 13px;background:#e6eee8}
[data-collapsed=true] .guide-actor,[data-collapsed=true] .guide-dock-actions{display:none}
[data-opening=true] .guide-dock-actions{visibility:hidden}.intro-controls{position:fixed;top:11px;right:106px;display:flex;justify-content:center;gap:7px;white-space:nowrap}.intro-controls button{border:0;padding:4px 8px;background:var(--accent-soft);border-radius:6px;font-size:12px;color:#3c6652;min-height:32px}
.guide-welcome{position:absolute;right:185px;bottom:1px;display:flex;align-items:flex-start;gap:6px;width:370px;padding:10px 12px 10px 15px;background:#fffefb;border:1px solid #dde5dc;border-radius:14px;box-shadow:0 9px 35px #283b3115}
.guide-welcome button{background:none;border:0;padding:0;font-size:13px;line-height:1.8;text-align:left;color:var(--copy)}.guide-welcome [data-guide-tip-dismiss]{padding:0 4px;font-size:18px;color:var(--muted)}
.guide-chat{position:absolute;right:0;bottom:87px;display:flex;flex-direction:column;width:min(392px,calc(100vw - 34px));height:min(565px,calc(var(--guide-viewport-height) - 140px));min-height:260px;border:1px solid #d6e0d7;border-radius:18px;background:#fcfdf9;box-shadow:0 20px 70px #203b3029;overflow:hidden;animation:dialog-in .22s var(--ease)}
[data-side=left] .guide-chat{right:auto;left:0}.guide-chat-header{display:flex;justify-content:space-between;align-items:center;padding:18px 20px 13px;flex-shrink:0}.guide-chat-header h2{font-size:22px}.guide-chat-header p{font-size:12px;margin-top:3px;color:#6b7b71}.guide-chat-header>button{border:0;background:transparent;border-radius:7px;font-size:24px;min-height:38px;min-width:38px;color:#61746a}
.guide-connection{padding:8px 20px;font-size:12px;color:#526e5e;background:#edf3ed;flex-shrink:0;line-height:1.5}.guide-messages{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:20px;scrollbar-width:thin}
.guide-empty{font-size:15px;line-height:1.9;max-width:260px}.guide-message{margin-bottom:21px}.guide-message small{display:block;font-size:12px;color:#6b7b71;margin-bottom:5px}.guide-message p{font-size:15px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere}.guide-message.is-user{margin-left:38px;padding:10px 13px;border-radius:12px 12px 3px 12px;background:#e9f0e9}.guide-message.is-user p{color:#2c493b}.guide-message summary{font-size:13px;color:var(--accent);margin:7px 0;cursor:pointer}.guide-message .guide-notice{font-size:12px;color:#856c43;margin:6px 0}
.guide-references{display:grid;gap:6px;margin-top:10px}.guide-reference{background:transparent;border:0;border-bottom:1px solid #dce5db;text-align:left;color:var(--accent);font-size:13px;padding:7px 0;line-height:1.65}.guide-reference:hover{color:#134e46;border-color:var(--accent)}.guide-pending{font-size:14px;color:#637a68;padding-bottom:16px}
.guide-shortcuts{display:flex;gap:5px;padding:10px 14px;flex-shrink:0;flex-wrap:wrap}.guide-shortcuts button{font-size:12px;border:1px solid #dce5db;border-radius:7px;background:transparent;padding:6px 8px;min-height:34px;white-space:nowrap}.guide-shortcuts button:hover{background:var(--accent-soft)}
.guide-form{padding:0 14px 14px;flex-shrink:0}.guide-form textarea{display:block;width:100%;resize:none;min-height:65px;max-height:120px;line-height:1.6;border:1px solid #ccd9cc;border-radius:10px;background:white;font-family:inherit;font-size:16px;padding:10px 12px;color:var(--ink)}.guide-form textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.guide-form textarea::placeholder{color:#7b877e}
.guide-form-actions{display:flex;align-items:center;gap:8px;margin-top:9px}.guide-form-actions button{border:0;border-radius:7px;padding:7px 9px;min-height:36px;font-size:13px;white-space:nowrap;background:var(--accent-soft);color:#315c49}.guide-form-actions .guide-clear{padding-left:0;background:none;font-size:12px;color:#6c7e70}.guide-form-actions .guide-send{margin-left:auto;background:var(--accent);color:white;padding-inline:15px}.guide-form-actions [data-guide-count]{font-size:11px;color:#7a8a7d;margin-left:auto}.guide-form-actions [data-guide-stop]{margin-left:auto;background:#edf1e9}.guide-form-actions:has([data-guide-stop]:not([hidden])) .guide-send{display:none}
.guide-location{position:fixed;bottom:28px;left:calc(50% + 90px);transform:translateX(-50%);font-size:13px;padding:7px 14px;border-radius:8px;background:#e8f0e8;color:#38634c;box-shadow:0 4px 15px #24402b12;max-width:calc(100vw - 230px);pointer-events:none}
.guide-located{outline:2px solid #7ca491;outline-offset:8px;border-radius:3px;transition:outline-color .4s}
.bear-head{transform-origin:41px 56px}.bear-hand{transform-origin:21px 74px}.bear-eyes{transform-origin:43px 45px}
[data-opening=false][data-state=idle] .character-art{animation:bear-breathe 5s ease-in-out infinite}
[data-opening=false][data-state=idle] .bear-eyes{animation:bear-blink 9s 3s infinite}
[data-state=greeting] .bear-hand{animation:bear-wave .65s ease-in-out 2}
[data-state=listening] .bear-head{transform:rotate(-5deg);transition:transform .3s}
[data-state=thinking] .bear-head{transform:rotate(4deg)}[data-state=thinking] .float-keyboard{animation:bear-tap 1.1s ease-in-out infinite}
[data-state=recommending] .bear-hand{transform:rotate(-28deg);transition:transform .25s}
[data-state=arrived] .bear-head{animation:bear-nod .65s ease 1}
[data-state=error] .bear-head{animation:bear-nod 1s ease 1}
@keyframes bear-breathe{50%{transform:translateY(-1.2px)}}@keyframes bear-blink{0%,45%,49%,100%{transform:scaleY(1)}47%{transform:scaleY(.12)}}@keyframes bear-wave{0%,100%{transform:rotate(0)}50%{transform:rotate(28deg)}}@keyframes bear-tap{50%{transform:translateY(1px) rotate(2deg)}}@keyframes bear-nod{50%{transform:translateY(1.5px) rotate(3deg)}}@keyframes volume-hello{0%,100%{transform:translate(1%,2%) scale(1.15)}45%{transform:translate(1%,3%) rotate(-3deg) scale(1.15)}}
@media(max-width:960px){.guide-location{left:35%;max-width:55vw}}
@media(max-width:620px){.small-bear-guide{right:14px;bottom:max(6px,env(safe-area-inset-bottom));height:60px;width:170px}.guide-actor{width:68px;height:68px}.guide-dock-actions{right:71px;bottom:9px}.guide-label{font-size:13px}.guide-chat{position:fixed;right:8px;left:8px;bottom:calc(var(--guide-keyboard) + max(8px,env(safe-area-inset-bottom)));width:auto;height:min(620px,calc(var(--guide-viewport-height) - 24px));min-height:200px;border-radius:18px 18px 10px 10px}.small-bear-guide[data-chat=true] .guide-actor,.small-bear-guide[data-chat=true] .guide-dock-actions{visibility:hidden}.guide-chat-header{padding:14px 17px 10px}.guide-chat-header h2{font-size:21px}.guide-messages{padding:16px}.guide-shortcuts{padding:8px 12px}.guide-form{padding:0 12px 12px}.guide-form textarea{min-height:58px}.guide-welcome{bottom:0;right:76px;width:calc(100vw - 108px);padding:7px 8px}.guide-welcome button{font-size:12px;line-height:1.65}.small-bear-guide:has(.guide-welcome:not([hidden])) .guide-dock-actions{visibility:hidden}.guide-location{bottom:20px;left:16px;transform:none;max-width:calc(100vw - 195px);font-size:12px}.intro-controls button{font-size:12px;padding:3px 6px}.intro-controls{top:10px;right:77px;bottom:auto;left:auto}.guide-form-actions [data-guide-count]{display:none}}
@media(max-height:520px){.guide-chat{height:calc(var(--guide-viewport-height) - 12px);bottom:var(--guide-keyboard);min-height:190px}.guide-chat-header p,.guide-shortcuts{display:none}.guide-chat-header{padding-block:7px}.guide-connection{padding-block:5px}.guide-form textarea{height:42px;min-height:42px}.guide-form-actions{margin-top:5px}.guide-messages{padding-block:10px}}
@media(max-width:620px),(max-height:520px){.small-bear-guide,body[data-page]:not([data-page=welcome]) .small-bear-guide{width:88px;height:52px;right:12px}.guide-actor,body[data-page]:not([data-page=welcome]) .guide-actor{width:52px;height:52px}.guide-label{display:none}.guide-dock-actions,body[data-page]:not([data-page=welcome]) .guide-dock-actions{right:53px;bottom:3px}.guide-collapse{min-width:30px;padding-inline:5px}.guide-welcome{right:61px}.guide-restore{font-size:12px;padding:6px 9px;bottom:5px}}
.small-bear-guide[data-opening=false][data-chat=false][data-tucked=true]{top:7px;bottom:auto;right:105px;height:44px;width:44px}
.small-bear-guide[data-opening=false][data-chat=false][data-tucked=true] .guide-actor{width:44px;height:44px}
.small-bear-guide[data-tucked=true] .guide-dock-actions{right:44px;bottom:3px}
.small-bear-guide[data-tucked=true] .guide-label{display:none}
.small-bear-guide[data-tucked=true] .guide-restore{font-size:0;width:44px;padding:0;bottom:0;height:44px}
.small-bear-guide[data-tucked=true] .guide-restore::after{content:'小熊 ↗';font-size:11px}
@media(max-width:620px){body[data-page]:not([data-page=welcome]) .breadcrumbs{max-width:calc(100% - 170px)}.small-bear-guide[data-opening=false][data-chat=false][data-tucked=true]{top:5px;right:72px}.small-bear-guide[data-tucked=true] .guide-dock-actions{right:44px;bottom:3px}}
body[data-reduce-motion=true] .small-bear-guide *,body[data-reduce-motion=true] .small-bear-guide *::before{animation:none!important;transition:none!important}
