/* Glossy candy toolbar, scoped to the existing header controls. */
.topbar .tools{align-items:center;gap:5px}
.topbar .tools .tool{min-width:62px;padding:5px 6px;color:#873e72;gap:2px;line-height:1.3}
.topbar .tools .kw-icon,.topbar .tools .kw-avatar{width:46px;height:46px;flex:none;transition:transform .18s ease;overflow:visible}
.topbar .tools .kw-icon{display:block;object-fit:contain;filter:drop-shadow(0 2px 2px #bd5b9520)}
.topbar .tools .kw-avatar{display:grid;place-items:center;position:relative;border-radius:50%;padding:5px;background:conic-gradient(from -45deg,#ff9ed0,#d0a2ed,#eb9dce,#ffc0df,#ff94c6);box-shadow:inset 0 0 0 1px #ffe4f3,0 2px 4px #c57ba22b}
.topbar .tools .kw-avatar::before{content:'';position:absolute;inset:3px;border:2px solid transparent;border-top-color:#fff6fc;border-left-color:#fff6fc;border-radius:50%;transform:rotate(-25deg);pointer-events:none}
.topbar .tools .kw-avatar::after{content:'';position:absolute;top:-3px;right:-4px;width:11px;height:14px;background:linear-gradient(#ffbce2,#d4a4ec);clip-path:polygon(50% 0,65% 34%,100% 50%,65% 66%,50% 100%,35% 66%,0 50%,35% 34%);pointer-events:none}
.topbar .tools .kw-avatar>.avatar,.topbar .tools .kw-guest-photo{width:100%;height:100%;display:grid;place-items:center;object-fit:cover;border-radius:50%;border:2px solid #fff0fa;background:#ffe4f0;color:#9b4e7c;font-size:16px;font-weight:600}
.topbar .tools .tool span.tool-label{max-width:86px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;font-size:11px;font-weight:500}
.topbar .tools .tool:hover .kw-icon,.topbar .tools .tool:hover .kw-avatar{transform:translateY(-2px)}
.topbar .tools .tool:focus-visible{outline:3px solid #a85794;outline-offset:2px}
.topbar .tools .badge{top:1px;right:3px;min-width:21px;height:21px;padding:0 5px;border:2px solid #fff;font:600 11px/17px var(--font);border-radius:99px;background:linear-gradient(#ff8bbd,#ed4a92);color:white;box-shadow:0 2px 4px #c7518926;z-index:2}
.topbar .tools .badge[hidden]{display:none}
@media(min-width:900px){
 .topbar .topbar-in{height:auto;min-height:calc(var(--ref-unit)*68);padding-top:8px;padding-bottom:8px}
 .topbar .tools .tool{min-width:clamp(58px,5.2vw,76px)}
 .topbar .tools .kw-icon,.topbar .tools .kw-avatar{width:clamp(38px,3.4vw,50px);height:clamp(38px,3.4vw,50px)}
}
@media(max-width:899px){
 .topbar .tools{gap:1px}.topbar .tools .tool{padding:4px 3px;min-width:44px;min-height:44px;gap:0}
 .topbar .tools .kw-icon,.topbar .tools .kw-avatar{width:34px;height:34px}
 .topbar .tools .kw-avatar{padding:4px}.topbar .tools .kw-avatar::before{inset:2px;border-width:1.5px}
 .topbar .tools .kw-avatar::after{width:8px;height:10px;right:-3px;top:-2px}
 .topbar .tools .kw-avatar>.avatar{font-size:12px;border-width:1px}
 .topbar .tools .tool span:not(.kw-avatar):not(.avatar){display:none}
 .topbar .tools .badge{min-width:17px;height:17px;font-size:9px;line-height:13px;right:0;top:0;padding:0 3px}
}
@media(max-width:350px){
 .topbar .tools .tool{min-width:44px;padding:4px 2px}
 .topbar .tools .kw-icon,.topbar .tools .kw-avatar{width:31px;height:31px}
 .topbar .tools .kw-avatar{padding:3px}
}
@media(prefers-reduced-motion:reduce){
 .topbar .tools .kw-icon,.topbar .tools .kw-avatar{transition:none}
 .topbar .tools .tool:hover .kw-icon,.topbar .tools .tool:hover .kw-avatar{transform:none}
}