/* ShulkerShop shared site header + page-load motion. One header for every page (site + tools). */
.sbn{--sbn-h:64px;position:sticky;top:0;z-index:1000;height:var(--sbn-h);background:#09080dd9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .2s;font-family:"Inter",system-ui,sans-serif;box-sizing:border-box}
.sbn *,.sbn-menu *{box-sizing:border-box}
.sbn.scrolled,html.sbn-app .sbn{border-color:#211e2b}
.sbn-in{max-width:1120px;height:100%;margin:0 auto;padding:0 24px;display:flex;align-items:center;gap:32px}
.sbn-brand{display:flex;align-items:center;gap:10px;font:400 16px/1 "Silkscreen",monospace;letter-spacing:.02em;color:#ecebf2;text-decoration:none;white-space:nowrap;text-transform:uppercase}
.sbn-brand img{width:24px;height:24px;display:block;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.sbn-brand:hover img{transform:rotate(-10deg) scale(1.08)}
.sbn-links{display:flex;gap:4px}
.sbn-links a{padding:6px 12px;border-radius:8px;color:#9a97a8;font-size:14px;font-weight:500;line-height:1.6;text-decoration:none;transition:color .15s,background .15s}
.sbn-links a:hover{color:#ecebf2}
.sbn-links a.on{color:#ecebf2;background:#17151f}
.sbn-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.sbn-acct{color:#9a97a8;font-size:14px;font-weight:500;padding:6px 10px;text-decoration:none;transition:color .15s}
.sbn-acct:hover{color:#ecebf2}
.sbn-burger{display:none;width:36px;height:36px;border:1px solid #2d2939;border-radius:8px;background:none;cursor:pointer;place-items:center;padding:0}
.sbn-burger i,.sbn-burger i:before,.sbn-burger i:after{display:block;width:14px;height:1.5px;background:#ecebf2;position:relative;transition:transform .2s}
.sbn-burger i:before,.sbn-burger i:after{content:"";position:absolute;left:0}.sbn-burger i:before{top:-5px}.sbn-burger i:after{top:5px}
.sbn-burger.x i{background:none}.sbn-burger.x i:before{transform:translateY(5px) rotate(45deg)}.sbn-burger.x i:after{transform:translateY(-5px) rotate(-45deg)}
.sbn-menu{display:none}
@media (max-width:760px){
  .sbn-in{padding:0 16px}.sbn-links,.sbn-right .sbn-acct{display:none}.sbn-burger{display:grid}
  .sbn-menu{display:block;position:fixed;top:64px;left:0;right:0;z-index:999;background:#09080d;border-bottom:1px solid #211e2b;padding:8px 16px 16px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s,transform .2s,visibility .2s}
  .sbn-menu.open{opacity:1;visibility:visible;transform:none}
  .sbn-menu a{display:block;padding:12px 4px;font:500 16px/1.4 "Inter",system-ui,sans-serif;color:#ecebf2;text-decoration:none;border-bottom:1px solid #211e2b}.sbn-menu a:last-child{border:0}
}
/* Full-height tool apps: fixed header, app fills the rest of the viewport. */
html.sbn-app .sbn{position:fixed;left:0;right:0;top:0}
html.sbn-app .sbn-in{max-width:none}
html.sbn-app .s3{height:calc(100vh - 64px)!important;margin-top:64px}
html.sbn-app .app{height:calc(100vh - 64px)!important;margin-top:64px}
html.sbn-app body.studio{top:64px!important}
html.sbn-app body.gate-page{padding-top:64px}

/* ---------- page-load motion ---------- */
@keyframes sbnFade{from{opacity:0}to{opacity:1}}
@keyframes sbnUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.sbn{animation:sbnFade .35s ease-out both}
.sbn-up{animation:sbnUp .45s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d,0ms)}
.sbn-rv{opacity:0;transform:translateY(16px);transition:opacity .5s cubic-bezier(.2,.8,.2,1),transform .5s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0ms)}
.sbn-rv.in{opacity:1;transform:none}
html.sbn-app main,html.sbn-app .s3,html.sbn-app .app,html.sbn-app body.studio>*:not(.sbn){animation:sbnFade .4s ease-out both}
html.sbn-leave body{opacity:0;transition:opacity .16s ease-in}
@media (prefers-reduced-motion:reduce){.sbn,.sbn-up,html.sbn-app main,html.sbn-app .s3,html.sbn-app .app,html.sbn-app body.studio>*{animation:none!important}.sbn-rv{opacity:1;transform:none;transition:none}html.sbn-leave body{opacity:1;transition:none}}
html.sbn-app body.gate-page>header.top{display:none}
