@import url("/static/palette.css?v=d087293871ba");
/* LOGIN-1: equal outer tracks centre the shared navigation, not the leftover space. */
@media(min-width:601px){
 body .nav:has(>.mid){display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;column-gap:0}
 body .nav:has(>.mid)>.mid{position:static;transform:none;margin:0;justify-self:center;grid-column:2}
 body .nav:has(>.mid)>.right{justify-self:end;margin-left:0;grid-column:3}
}


/* UI-9: keep the existing top bar above scrolling content; sorting retains its three scroll roots. */
body .nav{position:sticky;top:0;z-index:80;background:var(--site-page);view-transition-name:bindery-topbar}
body .works-rail{top:88px}

/* MOBILE-1: phone hit areas and supporting copy; desktop composition unchanged. */
@media(max-width:600px){


body .nav:has(>.mid){height:auto;min-height:88px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 12px}
body .nav:has(>.mid)>.mid{display:flex;flex-wrap:wrap;gap:0 20px;grid-column:1/-1;grid-row:2;justify-self:center;position:static;transform:none;margin:0}
body .nav:has(>.mid)>.right{grid-column:2;grid-row:1;justify-self:end;margin:0}
body .nav :is(a,.account-entry){box-sizing:border-box;min-height:44px;min-width:44px;display:inline-flex;align-items:center;padding-top:10px;padding-bottom:10px}
body .nav :is(.mid,.right,.account-entry){font-size:14px}
body footer,body .make-footer{font-size:14px}
body footer a,body .make-footer a{display:inline-flex;align-items:center;box-sizing:border-box;min-height:44px;min-width:44px;padding:10px 0;font-size:14px}
body footer [data-legal-links]{display:flex;align-items:center;flex-wrap:wrap;gap:0 16px}

}

@media(max-width:600px){body .products-page footer,body .products-page footer a{font-size:14px}}

/* NAV-1: shared bar height; editor-owned navigation has no nav-v1 class. */
@font-face{font-family:BinderyArchivo;src:url('/static/fonts/typography/archivo/PB-archivo-regular.ttf') format('truetype');font-display:swap}
:root{--site-bar-height:64px}   /* SITE-CHROME-1: one row (was 56 + 36) */
html body .nav.nav-v1{display:block;position:sticky;top:0;z-index:80;flex:none;height:var(--site-bar-height);min-height:var(--site-bar-height);width:100%;max-width:none;margin:0;padding:0;border:0;border-bottom:1px solid var(--site-line);box-sizing:border-box;background:var(--site-page);color:var(--site-ink);font:17px/1.3 var(--site-body);letter-spacing:normal}
html body :is(.home-page,.make-shell:not(.wrap))>.nav.nav-v1{padding-inline:0}
.nav-v1 *{box-sizing:border-box}
html body .nav.nav-v1 [hidden]{display:none!important}
html body .nav.nav-v1 a{color:inherit;text-decoration:none}
html body .nav.nav-v1 a:hover{text-decoration:underline}
/* SITE-CHROME-1: one row - the wordmark left, the six links in the middle, Support, the basket, the account and the
   credits right; the phone row keeps the menu, the wordmark and the account (the drawer holds the rest) */
html body .nav.nav-v1 .nav-row{height:var(--site-bar-height);padding:0 32px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;column-gap:24px}
html body .nav.nav-v1 .wordmark{grid-column:1;grid-row:1;justify-self:start;display:flex;align-items:center;padding:0;min-height:44px;font-size:25px;font-weight:600;letter-spacing:-1px;white-space:nowrap}
html body .nav.nav-v1 .nav-tools{grid-column:3;grid-row:1;justify-self:end;display:flex;align-items:center;gap:0;white-space:nowrap}
html body .nav.nav-v1 .nav-support{margin-right:16px}
html body .nav.nav-v1 .nav-tools .nav-account{overflow:hidden}   /* the account is an icon: no text spills past the bar's edge */
html body .nav.nav-v1 .nav-icon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:0;background:none;box-shadow:none;color:var(--site-ink);cursor:pointer;flex:none}
.nav-v1 .nav-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
html body .nav.nav-v1 .right{margin:0;overflow:visible}
html body .nav.nav-v1 .nav-menu{display:none}
html body .nav.nav-v1 .mid{grid-column:2;grid-row:1;position:static;transform:none;display:flex;align-items:center;gap:32px;margin:0;padding:0;justify-self:center;font-size:14px;white-space:nowrap}
html body .nav.nav-v1 .mid a{color:var(--site-muted);padding:0;min-height:44px;height:44px;display:flex;align-items:center}
html body .nav.nav-v1 .mid a[aria-current=page]{color:var(--site-ink)}
html body .nav.nav-v1 .nav-tools .nav-balance{display:flex;align-items:center;gap:8px;margin-left:8px;font-size:14px;color:var(--site-muted);white-space:nowrap}
html body .nav-drawer .nav-balance{gap:8px;color:var(--site-muted)}
#bookshelf{scroll-margin-top:calc(var(--site-bar-height) + 16px)}
.nav-v1 .member{background-image:linear-gradient(90deg,var(--site-muted),var(--site-ink));background-clip:text;-webkit-background-clip:text;color:transparent;background-size:400% 100%;animation:member-name-sweep 8s linear infinite!important}
html body .nav.nav-v1 .nav-drawer{position:fixed;inset:0 auto 0 0;margin:0;padding:16px 24px 24px;width:min(360px,85vw);max-width:85vw;height:100dvh;max-height:none;border:0;border-right:1px solid var(--site-line);border-radius:0;background:var(--site-panel);color:var(--site-ink);font:17px/1.3 var(--site-body);overflow-y:auto}
.nav-drawer::backdrop{background:color-mix(in srgb, var(--site-button) 32%, transparent)}
html body .nav-drawer>a{display:flex;align-items:center;min-height:44px;width:100%;border-bottom:1px solid var(--site-line);padding:10px 0}
html body .nav.nav-v1 .nav-close{margin:0 0 8px auto;font-size:28px}
html.nav-drawer-open,html.nav-drawer-open body{overflow:hidden!important}
body:has(.nav-v1) .works-rail{top:var(--site-bar-height)}
body:has(.nav-v1) #step2{top:calc(var(--site-bar-height) + 24px)}
.info-page{margin:0;background:var(--site-page);color:var(--site-ink);font:17px/1.7 var(--site-body)}
.info-page main{max-width:720px;padding:72px 40px 80px;margin:auto;box-sizing:border-box}
.info-page h1{font-size:28px;font-weight:600;line-height:1.2;margin:0 0 32px}.info-page p{margin:0 0 24px}.info-page main a{color:inherit;text-underline-offset:3px}
@media(min-width:1280px){html body .nav.nav-v1 .nav-row{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}}   /* the links at the page's centre */
@media(max-width:1279px) and (min-width:901px){
 html body .nav.nav-v1 .nav-row{padding:0 24px;column-gap:16px}
 html body .nav.nav-v1 .mid{gap:18px}
}
@media(max-width:900px){
 :root{--site-bar-height:56px}
 html body .nav.nav-v1 .nav-row{height:var(--site-bar-height);padding:0 16px;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);column-gap:0}
 html body .nav.nav-v1 .nav-menu{display:inline-flex;grid-column:1;grid-row:1;justify-self:start}
 html body .nav.nav-v1 .wordmark{grid-column:2;justify-self:center}
 html body .nav.nav-v1 :is(.mid,.nav-support,.nav-bag,.nav-tools .nav-balance){display:none!important}
 html body .nav.nav-v1 .wordmark{font-size:22px}
 .info-page main{padding:48px 24px 64px}.info-page main a{display:inline-flex;align-items:center;min-height:44px}
}

/* UI-FIX-2: scale only the desktop bar; the phone bar and drawer are unchanged. */
@media(min-width:901px){
 html body .nav.nav-v1{font-size:15px}
 html body .nav.nav-v1 .wordmark{font-size:22px}
 html body .nav.nav-v1 .wordmark img{width:24px;height:24px}
 .nav-v1 .nav-icon svg{width:18px;height:18px}
}

/* UI-FIX-2: server-rendered, shared offer. Inline storage check runs before paint. */
#firstBookOffer{position:relative;box-sizing:border-box;width:100%;min-height:44px;display:flex;align-items:center;justify-content:center;padding:6px 52px;background:var(--site-button);color:var(--site-page);font:13px/1.4 var(--site-body);text-align:center}
#firstBookOffer[hidden]{display:none!important}
#firstBookOffer a{color:var(--site-page);text-decoration:underline;text-underline-offset:2px}
#firstBookOffer button{position:absolute;right:0;top:0;width:44px;height:44px;padding:0;border:0;background:none;color:var(--site-page);font:22px var(--site-body);cursor:pointer}

/* LANDING-FIX-2: centre the short label inside its existing 44px tap target. */
@media(max-width:599px){body footer a[href="/terms"]{justify-content:center}}