.tp-bar{flex:0 0 auto;letter-spacing:0}
.tp-bar[hidden],.tp-panel [hidden]{display:none!important}
.tp-toggle{display:flex;align-items:center;gap:8px;height:36px;padding:0 9px;border:1px solid #dce3ec;border-radius:6px;background:#fff;color:#344257;font:600 12px/1.2 var(--body,system-ui);white-space:nowrap;cursor:pointer}
.tp-toggle:hover,.tp-toggle[aria-expanded=true]{background:#f2f6fc;border-color:#b6c7e3}
.tp-toggle:focus-visible,.tp-panel button:focus-visible,.tp-panel input:focus-visible{outline:2px solid #2858ff;outline-offset:3px}
.tp-team-icon{display:flex;align-items:center;justify-content:center}
.tp-preview{display:flex;gap:9px;align-items:center}
.tp-preview:empty{display:none}
.tp-preview-person{display:flex;align-items:center;gap:5px}
.tp-preview-name{max-width:64px;overflow:hidden;text-overflow:ellipsis}
.tp-avatar{position:relative;display:inline-grid;place-items:center;width:27px;height:27px;flex:0 0 27px;border-radius:50%;background:#edf1f6;color:#42516a;font:600 10px/1 var(--body,system-ui);letter-spacing:0}
.tp-dot{display:inline-block;width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:#8793a5}
.tp-avatar>.tp-dot{position:absolute;right:-1px;bottom:0;border:2px solid #fff;width:10px;height:10px}
[data-status=active]>.tp-dot{background:#138357}
[data-status=on_call]>.tp-dot{background:#2858ff}
[data-status=away]>.tp-dot{background:#b2760c}
.tp-total{color:#617086;font-size:11px;font-weight:400;min-width:42px}
.tp-mobile-count{display:none}
.tp-panel{position:fixed;z-index:10070;box-sizing:border-box;max-width:calc(100vw - 24px);overflow:auto;overscroll-behavior:contain;border:1px solid #dce3ec;border-radius:8px;background:#fff;box-shadow:0 10px 30px #1b29451f;color:#253149;font-family:var(--body,system-ui);letter-spacing:0}
.tp-panel>header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid #e3e8ef}
.tp-panel h2{margin:0;font-size:15px;font-weight:650;line-height:1.4;letter-spacing:0}
.tp-panel button{display:grid;place-items:center;width:30px;height:30px;padding:0;border:0;border-radius:4px;background:transparent;color:#65748b;cursor:pointer}
.tp-panel button:hover{background:#f0f4fa}
.tp-members{list-style:none;margin:0;padding:0 16px}
.tp-members>li{display:flex;gap:10px;align-items:center;min-height:68px;padding:13px 0;border-bottom:1px solid #eef1f5}
.tp-members>li:last-child{border-bottom:0}
.tp-members .tp-avatar{width:32px;height:32px;flex-basis:32px;font-size:11px}
.tp-person{display:flex;flex:1;min-width:0;flex-direction:column;gap:5px;font-size:12px}
.tp-person strong{font-weight:600;overflow-wrap:anywhere;line-height:1.4}
.tp-person small{font-size:10px;color:#788398;font-weight:400}
.tp-person>span{font-size:11px;color:#718098;line-height:1.35}
.tp-status{display:flex;align-items:center;gap:5px;flex-shrink:0;font-size:11px;color:#66758a}
.tp-status[data-status=active]{color:#116e4a}
.tp-status[data-status=on_call]{color:#2858ff}
.tp-status[data-status=away]{color:#986109}
.tp-empty{padding:18px 16px;margin:0;color:#65748b;font-size:12px;line-height:1.5}
.tp-notice{margin:0;padding:10px 16px;background:#fff8e8;color:#805617;font-size:12px;line-height:1.5}
.tp-panel>footer{padding:13px 16px;border-top:1px solid #e3e8ef;background:#fafbfd}
.tp-panel footer label{display:flex;align-items:center;gap:8px;font-size:12px;color:#4f5f76;cursor:pointer}
.tp-panel footer input{width:15px;height:15px;margin:0;accent-color:#2858ff}
.tp-panel [role=alert]{margin:10px 0 0;font-size:12px;line-height:1.4;color:#b12636}
@media(max-width:1650px){html body .topbar:has(.tp-bar:not([hidden])) .owner-location{display:none}.tp-preview-name{display:none}}
@media(max-width:1450px){html body .topbar:has(.tp-bar:not([hidden])) .sync{display:none}.tp-label{display:none}}
@media(max-width:1100px){.tp-preview{display:none}.tp-label{display:inline}}
@media(max-width:700px){.tp-panel{left:12px!important}.tp-label,.tp-total{display:none}.tp-toggle{position:relative;width:36px;padding:0;justify-content:center}.tp-mobile-count:not(:empty){display:grid;place-items:center;position:absolute;top:-5px;right:-5px;min-width:14px;height:14px;padding:0 3px;border-radius:7px;background:#e7f4ed;color:#116e4a;font-size:9px;border:1px solid #fff}}
@media(max-width:480px){html body .topbar:has(.tp-bar:not([hidden])){padding-inline:10px;gap:8px}html body .topbar:has(.tp-bar:not([hidden])) .workspace-topbar-actions{gap:5px}html body .topbar:has(.tp-bar:not([hidden])) .renew-logo{width:95px}}
@media(max-width:350px){html body .topbar:has(.tp-bar:not([hidden])) .renew-logo{width:78px}html body .topbar:has(.tp-bar:not([hidden])) .workspace-topbar-actions{gap:3px}}
