.titlebar{position:fixed;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:100;transition:transform 0.4s cubic-bezier(0.27, 0, 0.1, 1)}.titlebar .titlebar-container{position:relative;width:calc(100% - var(--padding-xxl) * 2);padding:var(--padding-m) var(--padding-xxl);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;transition:all 0.4s cubic-bezier(0.27, 0, 0.1, 1)}.titlebar .titlebar-container .titlebar-logo{width:200px}.titlebar .titlebar-container .titlebar-links,.titlebar .titlebar-container .titlebar-functions{margin-right:calc(var(--padding-xxl) * -0.5);display:flex;align-items:flex-end;justify-content:flex-end;flex-direction:row;gap:12px}.titlebar .titlebar-container .titlebar-links .titlebar-link,.titlebar .titlebar-container .titlebar-links .titlebar-function,.titlebar .titlebar-container .titlebar-functions .titlebar-link,.titlebar .titlebar-container .titlebar-functions .titlebar-function{user-select:none;cursor:pointer;position:relative;padding:var(--padding-s) var(--padding-l);display:flex;align-items:center;justify-content:center;flex-direction:row;flex-shrink:0;gap:var(--gap-s);background:transparent;border-radius:999px;color:var(--text-invert);z-index:1;transition:color 0.4s cubic-bezier(0.27, 0, 0.1, 1);overflow:hidden}.titlebar .titlebar-container .titlebar-links .titlebar-link:before,.titlebar .titlebar-container .titlebar-links .titlebar-function:before,.titlebar .titlebar-container .titlebar-functions .titlebar-link:before,.titlebar .titlebar-container .titlebar-functions .titlebar-function:before{position:absolute;content:"";left:0;top:0;width:100%;height:100%;background:var(--bg-light);border-radius:999px;transform:translate(-110%, 0);transition:transform 0.4s cubic-bezier(0.27, 0, 0.1, 1);z-index:-1}.titlebar .titlebar-container .titlebar-links .titlebar-link:hover,.titlebar .titlebar-container .titlebar-links .titlebar-function:hover,.titlebar .titlebar-container .titlebar-functions .titlebar-link:hover,.titlebar .titlebar-container .titlebar-functions .titlebar-function:hover{color:var(--text)}.titlebar .titlebar-container .titlebar-links .titlebar-link:hover svg.filled,.titlebar .titlebar-container .titlebar-links .titlebar-function:hover svg.filled,.titlebar .titlebar-container .titlebar-functions .titlebar-link:hover svg.filled,.titlebar .titlebar-container .titlebar-functions .titlebar-function:hover svg.filled{fill:var(--text)}.titlebar .titlebar-container .titlebar-links .titlebar-link:hover svg.colored,.titlebar .titlebar-container .titlebar-links .titlebar-function:hover svg.colored,.titlebar .titlebar-container .titlebar-functions .titlebar-link:hover svg.colored,.titlebar .titlebar-container .titlebar-functions .titlebar-function:hover svg.colored{color:var(--text)}.titlebar .titlebar-container .titlebar-links .titlebar-link:hover:before,.titlebar .titlebar-container .titlebar-links .titlebar-function:hover:before,.titlebar .titlebar-container .titlebar-functions .titlebar-link:hover:before,.titlebar .titlebar-container .titlebar-functions .titlebar-function:hover:before{transform:translate(0, 0)}.titlebar .titlebar-container .titlebar-links .titlebar-link svg,.titlebar .titlebar-container .titlebar-links .titlebar-function svg,.titlebar .titlebar-container .titlebar-functions .titlebar-link svg,.titlebar .titlebar-container .titlebar-functions .titlebar-function svg{width:18px;height:18px;opacity:0.4;transition:fill 0.4s cubic-bezier(0.27, 0, 0.1, 1),color 0.4s cubic-bezier(0.27, 0, 0.1, 1)}.titlebar .titlebar-container .titlebar-links .titlebar-link svg.filled,.titlebar .titlebar-container .titlebar-links .titlebar-function svg.filled,.titlebar .titlebar-container .titlebar-functions .titlebar-link svg.filled,.titlebar .titlebar-container .titlebar-functions .titlebar-function svg.filled{fill:var(--text-invert)}.titlebar .titlebar-container .titlebar-links .titlebar-link svg.colored,.titlebar .titlebar-container .titlebar-links .titlebar-function svg.colored,.titlebar .titlebar-container .titlebar-functions .titlebar-link svg.colored,.titlebar .titlebar-container .titlebar-functions .titlebar-function svg.colored{color:var(--text-invert)}.titlebar .titlebar-container .titlebar-links .titlebar-link a,.titlebar .titlebar-container .titlebar-links .titlebar-function a,.titlebar .titlebar-container .titlebar-functions .titlebar-link a,.titlebar .titlebar-container .titlebar-functions .titlebar-function a{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;z-index:2}.titlebar .titlebar-container .titlebar-links .titlebar-link span,.titlebar .titlebar-container .titlebar-links .titlebar-function span,.titlebar .titlebar-container .titlebar-functions .titlebar-link span,.titlebar .titlebar-container .titlebar-functions .titlebar-function span{font-family:"Montserrat", sans-serif;font-size:var(--font-s);font-weight:var(--font-weight-semibold)}.titlebar .titlebar-container .titlebar-links{justify-content:flex-start;margin-right:0;margin-left:calc(var(--padding-xxl) * -0.5)}.titlebar.hidden{transform:translate(0, -120%)}.titlebar.separate .titlebar-container{width:auto;margin:var(--margin-l);grid-template-columns:auto auto auto;background:var(--bg-inverted);box-shadow:var(--shadow-light-inverted);gap:var(--gap-xxl);border-radius:999px}