/* Shared light-theme navigation measurements from CraveKit/src/portal.css. */
:root{--sidebar-width:218px}
aside{position:fixed;inset:0 auto 0 0;width:var(--sidebar-width);height:100dvh;overflow-y:auto;padding:34px 18px 24px;background:#fff;color:#24242a;border-right:1px solid #e4e4e6;border-bottom:0;backdrop-filter:none;z-index:20;line-height:normal}
.workspace{margin-left:var(--sidebar-width)}
.brand-top{display:block}
.brand-top>a{display:block;margin:0 12px;color:#24242a}
.brand-top .wordmark{display:block;width:100%;max-width:156px;height:auto;margin:0;fill:currentColor;overflow:visible}
.nav-label{display:block;font-size:9px;font-weight:400;letter-spacing:1.6px;color:#74747d;margin:43px 14px 15px}
aside nav,aside.menu-open nav{display:flex;flex-direction:column;gap:5px;margin:0;max-height:none;overflow:visible}
aside nav a{display:flex;align-items:center;gap:13px;padding:12px 14px;border-radius:6px;color:#74747d;font-size:14px;font-weight:400;white-space:normal;transition:background .15s,color .15s}
aside nav a span{display:block;flex-shrink:0;width:19px;font-size:10px;color:inherit}
aside nav a:hover{background:#f0f0ef;color:#24242a}
aside nav a.active{background:#eee7ff;color:#6214ff;font-weight:600}
.sidebar-bottom{display:block;margin-top:auto;padding:28px 0 0;color:#24242a}
.sidebar-kit-link{display:grid;grid-template-columns:19px minmax(0,1fr) 14px;align-items:center;gap:8px;padding:13px;border:1px solid #e4e4e6;border-radius:7px;font-size:11px;line-height:16px;transition:background 180ms ease,border-color 180ms ease}
.sidebar-kit-link:hover{background:#f0f0ef;border-color:#74747d}
.sidebar-kit-link>svg{flex-shrink:0}.sidebar-kit-link>svg:last-child{justify-self:end}
.sidebar-kit-link>span{display:grid;gap:1px;font-weight:700;white-space:nowrap}
.sidebar-kit-link small{display:block;margin:0;color:#74747d;font-size:9px;font-weight:400;line-height:12px;letter-spacing:normal}
@media(max-width:900px){.sidebar-kit-link{padding-inline:9px}}
.menu-toggle,.sidebar-scrim{display:none}
header{height:78px}
html{scroll-padding-top:30px}
@media(max-width:1200px){:root{--sidebar-width:190px}aside{padding-inline:12px}.brand-top .wordmark{max-width:144px}}
@media(max-width:900px){:root{--sidebar-width:175px}aside nav a{padding:12px 10px}}
@media(min-width:651px) and (max-width:1000px){
  .hero{grid-template-columns:1fr}.hero-copy{padding:32px 28px 0}.character-stage{min-height:300px}
  .section-heading,.intro-bottom,.type-editorial,.colour-application,.voice-example{grid-template-columns:1fr}
  .chapter-grid{grid-template-columns:1fr 1fr}.chapter-logo{grid-row:auto}.chapter-imagery{grid-column:1/-1}
  .chapter-voice p{font-size:23px}.combination-grid{grid-template-columns:1fr}
}
@media(max-width:650px){
  :root{--sidebar-width:0px}
  aside{width:230px;visibility:hidden;transform:translateX(-100%);transition:transform .2s;padding-top:28px}
  aside.menu-open{visibility:visible;transform:translateX(0)}
  .menu-toggle{display:flex;position:absolute;top:22px;left:14px;z-index:10;align-items:center;padding:5px;background:none;border:0;color:#24242a;font-size:12px;cursor:pointer}
  .menu-toggle span{font-size:20px}
  .sidebar-scrim:not([hidden]){display:block;position:fixed;inset:0;background:#0005;border:0;z-index:19}
  header{height:76px;padding-left:106px}
  .workspace{margin-left:0}
}
@media(prefers-reduced-motion:reduce){aside{transition:none}}