/* A stable rail lets the navigation glide between full and compact without moving content. */
.header-rail{position:sticky;top:16px;z-index:20;height:68px;margin:16px auto 0;pointer-events:none}
.header-rail .header{position:relative;top:0;margin:0 auto;pointer-events:auto;transition:width .58s var(--flow),height .5s var(--flow),padding .5s var(--flow),gap .5s var(--flow),background .4s,box-shadow .5s}
.header .wordmark{position:relative;width:96px;height:40px;transition:width .5s var(--flow)}
.header .wordmark img{transition:opacity .3s,transform .5s var(--flow)}
.header .wordmark .header-mark{position:absolute;left:0;top:6px;width:28px;height:28px;opacity:0;transform:scale(.7)}
.header-caption{overflow:hidden;white-space:nowrap;transition:max-width .5s var(--flow),padding .5s var(--flow),opacity .25s,border-color .3s}
.header nav{transition:gap .5s var(--flow),padding .5s var(--flow),background .4s,border-color .4s}
.header nav a{display:flex;align-items:center;justify-content:center;gap:0;transition:padding .5s var(--flow),background .25s,color .25s}
.header-nav-icon,.header-dashboard-icon{width:0;height:18px;opacity:0;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:width .5s var(--flow),opacity .3s,transform .5s var(--flow);transform:scale(.8)}
.header-nav-label{display:block;max-width:90px;overflow:hidden;white-space:nowrap;transition:max-width .5s var(--flow),opacity .22s}
.header .header-dashboard{transition:gap .5s var(--flow),padding .5s var(--flow),background .3s,border-color .3s;gap:0}
.header-dashboard-label{display:block;max-width:90px;overflow:hidden;transition:max-width .5s var(--flow),opacity .22s}
.header.scroll-compact{width:min(490px,calc(100% - 48px));height:56px;padding:0 14px;gap:12px;background:#140c20ed;box-shadow:inset 0 1px 0 #ead5ff0a,0 10px 35px #0005}
.header.scroll-compact .wordmark{width:28px}
.header.scroll-compact .header-wordmark{opacity:0;transform:scale(.8);pointer-events:none}
.header.scroll-compact .wordmark .header-mark{opacity:1;transform:scale(1)}
.header.scroll-compact .header-caption{max-width:0;padding-left:0;opacity:0;border-color:transparent}
.header.scroll-compact nav{padding:2px;gap:2px;border-color:transparent;background:transparent}
.header.scroll-compact nav a{padding:8px 12px;min-height:36px}
.header.scroll-compact .header-nav-label,.header.scroll-compact .header-dashboard-label{max-width:0;opacity:0}
.header.scroll-compact .header-nav-icon,.header.scroll-compact .header-dashboard-icon{width:18px;opacity:1;transform:scale(1)}
.header.scroll-compact .header-dashboard{padding:9px 10px;min-height:38px;border-radius:12px}
.header.scroll-compact .palette-trigger{width:38px;min-height:38px;border-radius:12px}
@media(max-width:650px){
 .header-rail{top:10px;margin-top:10px;height:105px}
 .header .wordmark{width:83px}
 .header .wordmark .header-mark{top:6px}
 .header.scroll-compact{display:flex;grid-template-rows:none;width:calc(100% - 24px);max-width:390px;height:56px;gap:8px;padding:0 12px;border-radius:30px}
 .header.scroll-compact .wordmark{flex-shrink:0}
 .header.scroll-compact nav{width:auto;min-height:0;margin:0 auto;justify-content:center;align-self:auto;gap:0;padding:0}
 .header.scroll-compact nav a{flex:0 0 auto;padding:9px 10px}
 .header.scroll-compact .header-dashboard{font-size:10px;min-height:36px;padding:8px 9px}
 .header.scroll-compact .palette-trigger{width:34px;min-height:36px}
}

.header .header-dashboard-label{font-size:11px}.header.scroll-compact .header-dashboard-label{font-size:11px}

/* A luminous workspace entrance, retaining the same compact icon state. */
.header .header-dashboard{position:relative;isolation:isolate;overflow:hidden;min-height:42px;padding:7px 14px;border-radius:30px;border-color:#cba2f177;background:linear-gradient(135deg,#9561c8,#653c91 56%,#44295f);color:#fcf6ff;box-shadow:inset 0 1px 0 #f5dcff40,inset 0 -1px 0 #2d123944,0 3px 16px #a457df26;transition:padding .5s var(--flow),border-radius .5s var(--flow),border-color .25s,box-shadow .35s,transform .35s var(--flow)}
.header .header-dashboard:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 20%,#fff2 48%,transparent 76%);transform:translateX(-120%);transition:transform .85s var(--flow);pointer-events:none}
.header .header-dashboard:hover{border-color:#e5c1ffbd;box-shadow:inset 0 1px 0 #f5dcff55,0 4px 24px #a457df52;transform:translateY(-1px)}
.header .header-dashboard:hover:before{transform:translateX(120%)}
.header .header-dashboard:active{transform:translateY(0) scale(.98)}
.header .header-dashboard:focus-visible{outline:2px solid #e8cdff;outline-offset:4px}
.header .header-dashboard-icon{width:15px;height:17px;margin-right:8px;opacity:1;transform:scale(1);stroke-width:1.7;transition:width .5s var(--flow),margin .5s var(--flow),transform .5s var(--flow)}
.header .header-dashboard-label{font-size:12px;font-weight:650;letter-spacing:-.1px}
.header.scroll-compact .header-dashboard{min-height:38px;padding:9px 10px;border-radius:13px}
.header.scroll-compact .header-dashboard-icon{width:18px;margin-right:0}
@media(max-width:650px){
 .header .header-dashboard{min-height:36px;padding:6px 10px}
 .header .header-dashboard-label{font-size:10px}
 .header .header-dashboard-icon{width:13px;height:15px;margin-right:6px}
 .header.scroll-compact .header-dashboard{min-height:36px;padding:8px 9px}
 .header.scroll-compact .header-dashboard-icon{width:18px;margin-right:0}
}