:root{--default-grid-pixels:8px;--default-header-height:64px}@property --leftopacity{syntax:"<number>";inherits:false;initial-value:1}@property --rightopacity{syntax:"<number>";inherits:false;initial-value:1}@keyframes leftOn{to{--leftopacity:0}}@keyframes rightOn{to{--rightopacity:0}}@keyframes rightOff{to{--rightopacity:1}}.comp-tabbar{width:100%;min-width:0;max-width:100%;position:relative}.comp-tabbar>div.tabs{white-space:nowrap;scrollbar-width:none;width:calc(100% + 20px);max-width:calc(100% + 20px);-webkit-mask-image:linear-gradient(90deg, rgba(0, 0, 0, var(--leftopacity)) calc(3% + 10px), #000 calc(6% + 10px), #000 94%, rgba(0, 0, 0, var(--rightopacity)) 97%);-webkit-mask-image:linear-gradient(90deg, rgba(0, 0, 0, var(--leftopacity)) calc(3% + 10px), #000 calc(6% + 10px), #000 94%, rgba(0, 0, 0, var(--rightopacity)) 97%);mask-image:linear-gradient(90deg, rgba(0, 0, 0, var(--leftopacity)) calc(3% + 10px), #000 calc(6% + 10px), #000 94%, rgba(0, 0, 0, var(--rightopacity)) 97%);z-index:1;justify-content:flex-start;margin-top:-10px;margin-left:-10px;padding:10px 10px 0;display:flex;position:relative;overflow-x:scroll}.comp-tabbar>.more{z-index:3;opacity:0;pointer-events:none;width:66px;height:calc(100% + 10px);transition:opacity .15s linear;position:absolute;top:-10px}.comp-tabbar>.more>button{color:inherit;transform-origin:50%;cursor:pointer;pointer-events:none;background:0 0;border:0;outline:0;justify-content:center;align-items:center;width:24px;height:24px;display:flex;position:absolute;top:calc(50% + 4px)}.comp-tabbar>.more>button:hover{color:hsla(var(--comp-primary-dark2), 1)}.comp-tabbar>.more.left{width:70px;left:0}.comp-tabbar>.more.left>button{left:0;transform:translateY(-50%)rotate(-90deg)}.comp-tabbar>.more.right{right:0}.comp-tabbar>.more.right>button{right:0;transform:translateY(-50%)rotate(90deg)}.comp-tabbar.scrollable>div.tabs{animation:.1s linear forwards rightOn}.comp-tabbar.scrollable>.more.right{opacity:1}.comp-tabbar.scrollable>.more.right>button{pointer-events:all}.comp-tabbar.scrolled>div.tabs{animation:.1s linear forwards rightOn,.1s linear forwards leftOn}.comp-tabbar.scrolled>.more.right{opacity:1}.comp-tabbar.scrolled>.more.right>button{pointer-events:all}.comp-tabbar.scrolled>.more.left{opacity:1}.comp-tabbar.scrolled>.more.left>button{pointer-events:all}.comp-tabbar.scrollable.scrollend>div.tabs{animation:.1s linear forwards rightOff,.1s linear forwards leftOn}.comp-tabbar.scrollable.scrollend>.more.right{opacity:0}.comp-tabbar.scrollable.scrollend>.more.right>button{pointer-events:none}.comp-tabbar .tab{cursor:pointer;-webkit-user-select:none;user-select:none;text-transform:var(--text-transform);text-shadow:0 0 9px hsla(var(--layout-dark), .5);margin-right:1px;padding:16px;font-family:inherit;font-size:1.4rem;font-weight:700;display:flex;position:relative}.comp-tabbar .tab .comp-icon{margin-right:8px}.comp-tabbar .tab.active{background:hsla(var(--background-container), 1);color:hsla(var(--comp-primary-dark1), 1);text-shadow:none;-webkit-box-shadow:0 0 9px 0 hsla(var(--layout-dark), .5);box-shadow:0 0 9px 0 hsla(var(--layout-dark), .5);position:relative}.comp-tabbar .tab.disabled{pointer-events:none;cursor:default}.comp-tabbar.small .tab{padding:8px}.comp-tabbar .colordot{background-color:var(--color);border-radius:50%;flex-shrink:0;align-self:center;width:8px;height:8px;margin-top:-1px;margin-right:4px;display:inline-block}.comp-tabbar.is-dragging .tab.dragging{cursor:-webkit-grabbing;cursor:grabbing}.comp-tabbar.is-dragging .tab.active{z-index:1}.comp-tabbar.is-dragging .tab:not(.dragging){transition:transform .3s}