/* QSPP guide — design qx-guide.css (2026-10-31), verbatim */
.qgd-spot{position:fixed;z-index:9000;pointer-events:none;border-radius:var(--radius-md);box-shadow:0 0 0 9999px rgba(10,22,36,.42),0 0 0 3px var(--brand),0 0 0 7px color-mix(in srgb,var(--brand) 25%,transparent);transition:left .35s ease,top .35s ease,width .35s ease,height .35s ease}
.qgd-tag{position:fixed;z-index:9001;pointer-events:none;font-size:11px;font-weight:600;letter-spacing:.02em;color:var(--brand-fg);background:var(--brand);padding:3px 8px;border-radius:var(--radius-sm);transition:left .35s ease,top .35s ease}
.qgd-press{transform:scale(.97);transition:transform .15s}
.qgd{position:fixed;right:20px;bottom:20px;z-index:9100;display:flex;flex-direction:column;align-items:flex-end;gap:10px;font-size:13px}
/* a side panel is open: sit above its footer, never on its buttons (it covered "Read and file" in Load documents) */
body:has(.qi-panel) .qgd{bottom:84px}
.qgd-fab{display:flex;align-items:center;gap:8px;height:40px;padding:0 14px 0 12px;border-radius:var(--radius-full);border:1px solid var(--border);background:var(--surface);color:var(--text);box-shadow:var(--shadow-lg);cursor:pointer;font:inherit;font-size:13px;font-weight:600}
.qgd-fab:hover{border-color:var(--brand);color:var(--brand)}
.qgd-fab.is-live{background:var(--brand);color:var(--brand-fg);border-color:var(--brand)}
.qgd.is-open .qgd-fab{width:40px;padding:0;justify-content:center}
.qgd-panel{width:340px;max-height:min(560px,calc(100vh - 90px));display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);overflow:hidden}
.qgd-head{display:flex;align-items:center;gap:10px;padding:12px 12px 12px 14px;border-bottom:1px solid var(--border)}
.qgd-head>div{flex:1;min-width:0;display:flex;flex-direction:column}
.qgd-head b{font-size:13px}.qgd-head span{font-size:11.5px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qgd-dot{width:8px;height:8px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 3px var(--brand-bg)}
.qgd-msgs{flex:1;min-height:120px;overflow:auto;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.qgd-hint{margin:0;color:var(--text-muted);line-height:1.5;text-wrap:pretty}
.qgd-m{max-width:92%;display:flex;flex-direction:column;gap:6px}.qgd-m p{margin:0;line-height:1.5;padding:8px 11px;border-radius:var(--radius-md);text-wrap:pretty}
.qgd-m--guide{align-self:flex-start}.qgd-m--guide p{background:var(--bg-muted);color:var(--text);border-bottom-left-radius:4px}
.qgd-m--me{align-self:flex-end}.qgd-m--me p{background:var(--brand);color:var(--brand-fg);border-bottom-right-radius:4px}
.qgd-m i{font-style:normal;font-size:10.5px;font-weight:600;color:var(--text-subtle);letter-spacing:.04em}
.qgd-m-acts{display:flex;gap:6px}
.qgd-typing{display:flex;gap:4px;align-items:center}.qgd-typing i{width:5px;height:5px;border-radius:50%;background:var(--text-subtle);animation:qgd-b 1s infinite}.qgd-typing i:nth-child(2){animation-delay:.15s}.qgd-typing i:nth-child(3){animation-delay:.3s}
@keyframes qgd-b{0%,100%{opacity:.3}50%{opacity:1}}
.qgd-ctl{display:flex;gap:6px;padding:10px 14px;border-top:1px solid var(--border)}
.qgd-tours{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:10px 14px;border-top:1px solid var(--border)}
.qgd-tours button{display:flex;flex-direction:column;gap:2px;text-align:left;padding:8px 10px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);color:var(--text);cursor:pointer;font:inherit}
.qgd-tours button:hover{border-color:var(--brand);background:var(--brand-bg)}
.qgd-tours b{font-size:12.5px}.qgd-tours span{font-size:11px;color:var(--text-muted);line-height:1.35}
.qgd-tours button:first-child{grid-column:1/-1}
.qgd-ask{display:flex;gap:6px;padding:10px 14px;border-top:1px solid var(--border);background:var(--bg-subtle)}
.qgd-ask .input{flex:1;min-width:0;height:34px}
/* Office additions (Akhil's review, 1 Nov 2026): divider between walkthroughs, status line while asking */
.qgd-div{display:flex;align-items:center;gap:8px;margin:4px 0;font-size:10.5px;font-weight:600;letter-spacing:.04em;color:var(--text-subtle)}
.qgd-div::before,.qgd-div::after{content:"";flex:1;height:1px;background:var(--border)}
.qgd-status{font-size:11.5px;color:var(--text-muted)}