@layer layout,components,motion,utilities,print;

@layer layout {
  :root{
    --private-header-h:148px;
    --private-header-space:148px;
    --private-nav-edge:clamp(.7rem,2vw,1.4rem);
  }

  html{scroll-padding-top:calc(var(--private-header-h) + 1rem)}
  body{padding-top:var(--private-header-space)}
  [id]{scroll-margin-top:calc(var(--private-header-h) + 1rem)}

  .site-header.ius-private-header{
    position:fixed!important;
    inset:0 0 auto 0;
    z-index:600;
    padding:max(.45rem,env(safe-area-inset-top)) 0 .5rem;
    border:0;
    background:transparent;
    isolation:isolate;
    transform:translateZ(0);
    backface-visibility:hidden;
    transition:padding var(--normal) var(--ease);
  }
  .site-header.ius-private-header::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-2;
    pointer-events:none;
    border-bottom:1px solid var(--border-subtle);
    background:linear-gradient(to bottom,color-mix(in srgb,var(--canvas) 98%,transparent),color-mix(in srgb,var(--canvas) 91%,transparent));
    backdrop-filter:blur(22px) saturate(122%);
    -webkit-backdrop-filter:blur(22px) saturate(122%);
    transition:background-color var(--normal),box-shadow var(--normal),border-color var(--normal);
  }
  .site-header.ius-private-header.is-scrolled::before{
    background:linear-gradient(to bottom,color-mix(in srgb,var(--canvas) 100%,transparent),color-mix(in srgb,var(--surface-base) 96%,transparent));
    box-shadow:0 18px 58px rgba(0,0,0,.28);
    border-bottom-color:var(--border-standard);
  }
  .site-header.ius-private-header.is-condensed{padding-bottom:.32rem}

  .ius-header-utility{
    position:relative;
    min-height:42px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:1rem;
    padding:0 var(--private-nav-edge);
    border:1px solid var(--border-standard);
    border-bottom:0;
    border-radius:var(--radius-sm) var(--radius-sm) 0 0;
    background:linear-gradient(180deg,color-mix(in srgb,var(--surface-raised) 76%,transparent),color-mix(in srgb,var(--surface-base) 90%,transparent));
    box-shadow:inset 0 1px color-mix(in srgb,var(--text-strong) 5%,transparent);
    overflow:hidden;
    transition:min-height var(--normal) var(--ease),background-color var(--normal),border-color var(--normal);
  }

  .ius-private-brand{
    position:relative;
    z-index:1;
    display:inline-flex;
    align-items:baseline;
    gap:.72rem;
    width:max-content;
    min-width:0;
    color:var(--text-strong);
    text-decoration:none;
  }
  .ius-private-brand strong{
    font-family:var(--font-serif);
    font-size:clamp(.96rem,1.2vw,1.14rem);
    font-weight:600;
    letter-spacing:.17em;
    white-space:nowrap;
  }
  .ius-private-brand strong sup{color:var(--accent-text);font-family:var(--font-mono);font-size:.42em;vertical-align:top}
  .ius-private-brand small{
    max-width:20rem;
    color:var(--text-muted);
    font-family:var(--font-mono);
    font-size:.51rem;
    letter-spacing:.15em;
    text-transform:uppercase;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    transition:max-width var(--normal) var(--ease),opacity var(--fast),margin var(--normal) var(--ease);
  }

  .ius-utility-actions{
    position:relative;
    z-index:1;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:.36rem;
    margin-left:auto;
    justify-self:end;
    grid-column:2;
    min-width:0;
  }

  .ius-nav-shell{
    position:relative;
    overflow:hidden;
    border:1px solid var(--border-standard);
    border-radius:0 0 var(--radius-sm) var(--radius-sm);
    background:
      linear-gradient(90deg,color-mix(in srgb,var(--accent-fill) 3%,transparent),transparent 14% 86%,color-mix(in srgb,var(--accent-fill) 2%,transparent)),
      linear-gradient(180deg,color-mix(in srgb,var(--surface-base) 96%,transparent),color-mix(in srgb,var(--surface-recessed) 96%,transparent));
    box-shadow:0 20px 62px rgba(0,0,0,.22),inset 0 1px color-mix(in srgb,var(--text-strong) 4%,transparent);
    isolation:isolate;
    transition:border-color var(--normal),background-color var(--normal),box-shadow var(--normal);
  }

  .ius-primary-nav,.ius-social-nav{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    min-width:0;
    transition:min-height var(--normal) var(--ease),padding var(--normal) var(--ease);
  }
  .ius-primary-nav{
    min-height:51px;
    justify-content:center;
    gap:clamp(.32rem,1.25vw,1.2rem);
    padding:.45rem clamp(1.25rem,3vw,3.2rem);
  }
  .ius-social-nav{
    min-height:43px;
    justify-content:center;
    gap:clamp(.28rem,1vw,.8rem);
    padding:.35rem clamp(1.25rem,3vw,3.2rem);
    border-top:1px solid var(--border-subtle);
    background:color-mix(in srgb,var(--surface-recessed) 55%,transparent);
  }

  .ius-reading-progress{
    position:absolute;
    left:0;right:0;bottom:0;
    height:2px;
    overflow:hidden;
    pointer-events:none;
  }
  .ius-reading-progress span{
    display:block;
    width:100%;height:100%;
    background:linear-gradient(90deg,var(--accent-deep),var(--accent-fill));
    transform:scaleX(var(--reading-progress,0));
    transform-origin:left center;
    transition:transform 70ms linear;
  }

  .site-header.is-condensed .ius-header-utility{min-height:35px}
  .site-header.is-condensed .ius-private-brand small{max-width:0;opacity:0;margin-left:-.72rem}
  .site-header.is-condensed .ius-primary-nav{min-height:43px;padding-top:.25rem;padding-bottom:.25rem}
  .site-header.is-condensed .ius-social-nav{min-height:37px;padding-top:.18rem;padding-bottom:.18rem}

  @media(max-width:1120px){
    .ius-primary-nav,.ius-social-nav{
      justify-content:center;
      overflow:visible;
      overscroll-behavior:auto;
      scroll-snap-type:none;
      scrollbar-width:auto;
      mask-image:none;
      -webkit-mask-image:none;
    }
  }

  @media(max-width:680px){
    :root{--private-header-space:135px;--private-header-h:135px;--private-nav-edge:.7rem}
    .site-header.ius-private-header{padding-top:max(.3rem,env(safe-area-inset-top));padding-bottom:.32rem}
    .ius-header-utility{min-height:39px;gap:.35rem;padding-inline:.7rem}
    .ius-private-brand strong{font-size:.84rem;letter-spacing:.12em}
    .ius-private-brand small{display:none}
    .ius-utility-actions{gap:.24rem}
    .ius-primary-nav{min-height:47px;gap:.35rem;padding:.35rem .85rem}
    .ius-social-nav{min-height:40px;gap:.3rem;padding:.25rem .85rem}
    .site-header.is-condensed .ius-header-utility{min-height:36px}
    .site-header.is-condensed .ius-primary-nav{min-height:42px}
    .site-header.is-condensed .ius-social-nav{min-height:36px}
    .ius-nav-shell{border-radius:0 0 var(--radius-sm) var(--radius-sm)}
  }

  @media(max-width:390px){
    :root{--private-header-space:132px;--private-header-h:132px}
    .ius-private-brand strong{font-size:.78rem;letter-spacing:.1em}
    .ius-primary-nav,.ius-social-nav{padding-inline:.65rem}
  }

  @media(max-height:520px) and (orientation:landscape){
    :root{--private-header-space:112px;--private-header-h:112px}
    .site-header.ius-private-header{padding-block:.2rem}
    .ius-header-utility{min-height:32px}
    .ius-primary-nav{min-height:38px;padding-block:.15rem}
    .ius-social-nav{min-height:34px;padding-block:.08rem}
    .ius-private-brand small{display:none}
  }
}

@layer components {
  .ius-header-button{
    min-width:66px;
    min-height:34px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.42rem;
    border:1px solid var(--border-standard);
    border-radius:var(--radius-sm);
    background:linear-gradient(180deg,color-mix(in srgb,var(--surface-raised) 78%,transparent),color-mix(in srgb,var(--surface-base) 88%,transparent));
    color:var(--text-body);
    padding:0 .68rem;
    font-family:var(--font-mono);
    font-size:.52rem;
    letter-spacing:.11em;
    text-transform:uppercase;
    box-shadow:inset 0 1px color-mix(in srgb,var(--text-strong) 4%,transparent);
    transition:border-color var(--fast),background-color var(--fast),color var(--fast),transform var(--fast),box-shadow var(--fast);
  }
  .ius-header-button:hover,.ius-header-button:focus-visible{
    border-color:var(--border-emphasis);
    color:var(--text-strong);
    background:color-mix(in srgb,var(--accent-fill) 5%,var(--surface-raised));
    transform:translateY(-1px);
    box-shadow:inset 2px 0 0 var(--accent-fill),inset 0 1px color-mix(in srgb,var(--text-strong) 5%,transparent);
  }
  .ius-header-button:active{transform:translateY(0)}
  .ius-theme-glyph{position:relative;width:13px;height:13px;border:1px solid currentColor;border-radius:50%;overflow:hidden}
  .ius-theme-glyph::after{content:"";position:absolute;inset:-1px 50% -1px -1px;background:currentColor;transition:transform var(--normal)}
  html[data-appearance="light"] .ius-theme-glyph::after{transform:translateX(100%)}

  .ius-primary-link{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:36px;
    padding:.25rem clamp(.62rem,1.1vw,1rem);
    border:1px solid transparent;
    border-radius:var(--radius-sm);
    color:var(--text-muted);
    font-family:var(--font-mono);
    font-size:clamp(.58rem,.7vw,.68rem);
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
    text-decoration:none;
    white-space:nowrap;
    transition:color var(--fast),border-color var(--fast),background-color var(--fast),transform var(--fast),box-shadow var(--fast);
  }
  .ius-primary-link:hover,.ius-primary-link:focus-visible{
    color:var(--text-strong);
    border-color:var(--border-standard);
    background:color-mix(in srgb,var(--surface-raised) 76%,transparent);
    transform:translateY(-1px);
  }
  .ius-primary-link.is-active,.ius-primary-link[aria-current="page"]{
    color:var(--text-strong);
    border-color:color-mix(in srgb,var(--accent-fill) 50%,var(--border-standard));
    background:color-mix(in srgb,var(--accent-fill) 7%,var(--surface-raised));
    box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent-fill) 8%,transparent);
  }

  .ius-social-link{
    position:relative;
    width:38px;height:38px;
    display:grid;
    place-items:center;
    border:1px solid transparent;
    border-radius:var(--radius-sm);
    color:var(--text-muted);
    text-decoration:none;
    transition:color var(--fast),border-color var(--fast),background-color var(--fast),transform var(--fast),box-shadow var(--fast);
  }
  .ius-social-link svg{width:20px;height:20px;fill:currentColor;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
  .ius-social-link .stroke-only{fill:none}
  .ius-social-link:hover,.ius-social-link:focus-visible{
    color:var(--text-strong);
    border-color:var(--border-emphasis);
    background:color-mix(in srgb,var(--accent-fill) 5%,var(--surface-raised));
    transform:translateY(-1px);
    box-shadow:inset 0 -2px 0 var(--accent-fill),0 8px 22px rgba(0,0,0,.17);
  }
  .ius-social-link::after{
    content:attr(data-label);
    position:absolute;
    left:50%;bottom:calc(100% + .55rem);
    transform:translate(-50%,4px);
    padding:.34rem .48rem;
    border:1px solid var(--border-standard);
    border-radius:var(--radius-sm);
    background:var(--surface-floating);
    color:var(--text-body);
    font-family:var(--font-mono);
    font-size:.5rem;
    letter-spacing:.07em;
    white-space:nowrap;
    opacity:0;
    pointer-events:none;
    transition:opacity var(--fast),transform var(--fast);
    box-shadow:var(--shadow-raised);
  }
  @media(hover:hover){.ius-social-link:hover::after,.ius-social-link:focus-visible::after{opacity:1;transform:translate(-50%,0)}}

  .site-header.is-condensed .ius-header-button{min-height:34px}
  .site-header.is-condensed .ius-primary-link{min-height:32px}
  .site-header.is-condensed .ius-social-link{width:38px;height:38px;flex-basis:38px}
  .site-header.is-condensed .ius-social-link svg{width:18px;height:18px}

  @media(max-width:680px){
    .ius-header-button{min-width:38px;width:38px;min-height:34px;padding:0}
    .ius-header-button [data-appearance-label],.ius-header-button .ius-language-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
    .ius-primary-link{min-height:34px;padding-inline:.75rem;font-size:.57rem}
    .ius-social-link{width:38px;height:38px;flex-basis:38px}
    .ius-social-link svg{width:19px;height:19px}
    .site-header.is-condensed .ius-header-button{min-height:34px}
  }
}

@layer motion {
  @media(prefers-reduced-motion:reduce){
    .ius-primary-link,.ius-social-link,.ius-header-button,.ius-private-brand small,.ius-header-utility,.ius-primary-nav,.ius-social-nav{transition:none}
  }
  @media(prefers-reduced-transparency:reduce){
    .site-header.ius-private-header::before,.ius-nav-shell,.ius-header-utility{background:var(--opaque-overlay);backdrop-filter:none;-webkit-backdrop-filter:none}
  }
}

@layer utilities {
  @media(forced-colors:active){
    .ius-header-utility,.ius-nav-shell,.ius-header-button,.ius-primary-link,.ius-social-link{forced-color-adjust:auto;border-color:CanvasText}
    .ius-reading-progress span{background:Highlight}
  }
}

@layer print {
  @media print{.ius-private-header{display:none!important}body{padding-top:0!important}}
}