/* Header and compact navigation inspired by the supplied layout. */
:root{--sidebar:72px}
.brand{position:relative;display:inline-block;padding-right:.58em;white-space:nowrap;font-family:Geist,sans-serif;font-size:35px;font-weight:750;letter-spacing:-1.8px;line-height:1}
.brand>span.brand-accent{color:#f36b90;font-weight:750;letter-spacing:-1.5px}
.brand>span.brand-domain{position:absolute;right:0;top:50%;display:block;writing-mode:vertical-rl;transform:translateY(-50%);font-family:inherit;font-size:.55em;font-weight:650;line-height:1;letter-spacing:-.02em;color:#fff}
.brand i{display:none}
.topbar{position:fixed;inset:0 0 auto 0;height:80px;padding:0 25px;z-index:80;background:#121214;border-bottom:1px solid #2b2b2e;gap:30px}
.header-brand{display:flex;align-items:center;gap:22px;flex-shrink:0;width:263px}
.mobile-menu{display:inline-flex;width:33px;height:42px;color:#f4f4f5;border-radius:4px}
.mobile-menu .icon{height:30px;width:30px;stroke-width:2}
.mobile-brand{display:flex;margin:0}
.category-nav{display:flex;align-self:stretch;gap:18px;flex:1;max-width:520px}
.category-nav>button{display:flex;align-items:center;justify-content:center;gap:10px;min-width:117px;padding:0 20px;position:relative;font-size:19px;font-weight:650;color:#f3f3f4;letter-spacing:-.045em}
.category-nav .icon{width:25px;height:25px;stroke-width:2.3}
.category-nav>button.active{color:#f36b90}
.category-nav>button.active:after{content:'';position:absolute;bottom:0;height:4px;left:0;right:0;background:#f36b90}
.category-nav>button:hover{background:#1e1e21}
.global-search{width:280px;margin-left:auto;max-width:26vw;background:#1b1b1e;border-color:#333337}
.topbar-right{gap:15px}
.topbar-right>.btn,.beta-badge{display:none}
.app-content{margin-left:72px;padding-top:80px}
.sidebar{top:80px;height:calc(100dvh - 80px);width:72px;padding:16px 13px 12px;background:#141416;border-right:1px solid #303034;align-items:center;transition:width .15s}
.sidebar .brand-link,.sidebar-label,.little-note,.sidebar-legal,.sidebar .account{display:none}
.sidebar>nav{width:100%;display:flex;flex-direction:column;gap:8px}
.nav-link{height:44px;width:44px;padding:0;display:flex;align-items:center;justify-content:center;border:1px solid #353539;border-radius:9px;background:#171719;margin:0;color:#f4f4f5}
.nav-link>.icon{width:21px;height:21px;color:inherit;stroke-width:2.1}
.nav-link>span,.nav-link>b{display:none}
.nav-link.active{background:#303033;color:#f36b90;border-color:#49494e}
.nav-link.active .icon{color:#f36b90}
.nav-link:hover{background:#29292d;border-color:#505055}
.sidebar-create{height:44px;width:44px;margin-top:8px;padding:0;flex-shrink:0;border:1px solid #353539;border-radius:9px;background:#171719;color:#f3f3f4}
.sidebar-create .icon{width:21px;height:21px;stroke-width:2.2}
.sidebar-create>span{display:none}
.sidebar-bottom{padding-top:18px;align-self:stretch;display:flex;flex-direction:column;gap:8px}.premium-nav{margin-top:8px}
.main{max-width:1640px;padding-left:38px;padding-right:38px}
.menu-open .sidebar{width:224px;align-items:stretch;box-shadow:8px 0 40px #0004;z-index:90;padding-left:18px;padding-right:18px}
.menu-open .sidebar .nav-link,.menu-open .sidebar-create{width:100%;justify-content:flex-start;gap:12px;padding:0 12px;height:44px;font-size:12px}
.menu-open .sidebar .nav-link>span,.menu-open .sidebar-create>span{display:inline}
.menu-open .sidebar .nav-link>.icon,.menu-open .sidebar-create>.icon{width:21px;height:21px}
.menu-open .sidebar .nav-link>b{display:inline;margin-left:auto}
.menu-open .mobile-scrim{display:block;position:fixed;inset:80px 0 0 0;background:#0006;z-index:85;backdrop-filter:none}
.demo-notice{font-size:11px;color:#c8b7bf;background:#2e262c;border:1px solid #55404b;padding:10px 14px;margin:0 0 20px;border-radius:6px}
.main-chat>.demo-notice{margin:14px 20px 0}
.main-chat:has(>.demo-notice) .chat-layout{height:calc(100dvh - 139px);min-height:calc(100dvh - 139px)}
.demo-login-info{margin-top:24px;padding:14px;background:#2a2b2e;border:1px solid #4c4249;border-radius:7px;display:flex;flex-direction:column;gap:5px;font-size:12px;color:#c9c8cd}
.demo-login-info strong{font-size:12px;font-weight:600;color:#ecc4cf}
.demo-login-info code{font-family:inherit;font-size:12px;color:#dedbe0;user-select:all}
.page-footer .brand{font-size:18px;font-weight:700;letter-spacing:-.8px}
.page-footer .brand>span.brand-accent{letter-spacing:-.8px}
.chat-layout{height:calc(100dvh - 80px);min-height:calc(100dvh - 80px)}
@media(max-width:1250px){.header-brand{width:230px;gap:18px}.brand{font-size:32px}.category-nav{gap:5px;max-width:430px}.category-nav>button{font-size:17px;min-width:100px;padding:0 16px}.category-nav .icon{height:23px;width:23px}.global-search{width:230px}.topbar{gap:17px}.main{padding-left:28px;padding-right:28px}}
@media(max-width:1000px){.global-search{width:36px;max-width:none;background:none;border:0;padding:0}.global-search input,.global-search kbd{display:none}.global-search.search-open,.global-search:focus-within{position:absolute;right:80px;left:auto;top:17px;width:300px;background:#202024;border:1px solid #55545d;padding:0 12px}.global-search.search-open input,.global-search:focus-within input{display:block}.category-nav{max-width:none;justify-content:center}.category-nav>button{padding:0 12px;min-width:94px}.header-brand{width:215px}.topbar-right{flex-shrink:0}.topbar{gap:15px}}
@media(max-width:760px){:root{--sidebar:0px}.topbar{height:72px;padding:0 18px;gap:15px}.header-brand{width:auto;gap:15px;margin-right:auto}.brand{font-size:29px;letter-spacing:-1.5px}.brand>span.brand-accent{letter-spacing:-1.3px}.category-nav{gap:0;flex:none;max-width:none}.category-nav>button{font-size:15px;gap:6px;min-width:auto;padding:0 15px}.category-nav .icon{height:20px;width:20px}.topbar-right{margin-left:0;order:0}.global-search{order:0;margin-left:0;width:22px}.search-toggle .icon{height:20px;width:20px}.app-content{margin-left:0;padding-top:72px}.sidebar{top:72px;height:calc(100dvh - 72px);width:0;padding:0;transform:translateX(-100%);z-index:90;border:0}.sidebar>nav{gap:9px}.menu-open .sidebar{width:246px;padding:22px 18px 17px;transform:translateX(0);border-right:1px solid #353539}.menu-open .mobile-scrim{inset:72px 0 0 0;z-index:85}.main{padding-left:22px;padding-right:22px}.mobile-nav{background:#19191cf7;border-color:#38383d}.mobile-nav a{color:#96969f}.mobile-nav a.active{color:#f36b90}.global-search.search-open,.global-search:focus-within{left:18px;right:18px;top:13px;width:auto;z-index:3}.global-search.search-open input,.global-search:focus-within input{display:block}.main-chat{padding-left:0;padding-right:0}.chat-layout{height:calc(100dvh - 138px);min-height:calc(100dvh - 138px)}.main-chat:has(>.demo-notice) .chat-layout{height:calc(100dvh - 205px);min-height:calc(100dvh - 205px)}}
@media(max-width:680px){.topbar{height:72px;align-items:center;padding-top:0;gap:12px}.header-brand{height:34px;gap:17px}.mobile-menu{height:32px;width:27px}.mobile-menu .icon{height:25px;width:25px}.brand{font-size:29px}.topbar-right{height:34px}.global-search{height:34px;margin-left:auto}.category-nav{position:absolute;bottom:0;left:0;right:0;height:48px;display:grid;grid-template-columns:repeat(3,1fr);gap:0;justify-content:stretch}.category-nav>button{font-size:16px;min-width:0;gap:8px;padding:0 12px}.category-nav>button.active:after{height:3px}.category-nav .icon{height:21px;width:21px}.app-content{padding-top:72px}.sidebar{top:72px;height:calc(100dvh - 72px)}.menu-open .mobile-scrim{inset:72px 0 0 0}.global-search.search-open,.global-search:focus-within{top:16px;left:16px;right:16px;height:38px;padding:0 11px;background:#222225;border-color:#67646d}.main{padding-left:17px;padding-right:17px}.main-chat{padding-left:0;padding-right:0}.chat-layout{height:calc(100dvh - 138px);min-height:calc(100dvh - 138px)}.main-chat:has(>.demo-notice) .chat-layout{height:calc(100dvh - 213px);min-height:calc(100dvh - 213px)}.demo-notice{font-size:10px;padding:10px 12px}.main-chat>.demo-notice{margin:12px 12px 0}}

.hero-editorial.single-portrait{grid-template-columns:1fr}.hero-editorial.single-portrait figure img{object-position:center 25%}
/* Keep the entire drawer off-screen; a zero-width element leaves its children visible. */
@media(max-width:760px){.sidebar{width:246px;visibility:hidden;pointer-events:none;overflow-x:hidden;overflow-y:auto}.menu-open .sidebar{visibility:visible;pointer-events:auto}}

/* Compact rail; desktop expansion makes space for labels instead of covering content. */
.sidebar{overflow-x:hidden;flex-shrink:0}.sidebar>nav,.sidebar-bottom{flex-shrink:0}.sidebar .nav-link{flex-shrink:0}
.sidebar-toggle{display:flex;align-items:center;justify-content:center;gap:12px;width:44px;min-height:44px;padding:0;border:1px solid #353539;border-radius:9px;color:#a6a6af;background:transparent;text-align:left}
.sidebar-toggle:hover{background:#252528;color:#f5f0f2}.sidebar-toggle .icon{width:18px;height:18px;transition:transform .15s}.sidebar-toggle span{display:none}
.menu-open .sidebar-toggle{width:100%;justify-content:flex-start;padding:0 12px;font-size:12px}.menu-open .sidebar-toggle span{display:inline}.menu-open .sidebar-toggle .icon{transform:rotate(180deg)}
@media(min-width:761px){.menu-open{--sidebar:224px}.menu-open .app-content{margin-left:224px}.menu-open .sidebar{box-shadow:none}.menu-open .mobile-scrim{display:none}.app-content{transition:margin-left .15s}}
@media(max-width:760px){.sidebar-toggle{display:none}}
@media(prefers-reduced-motion:reduce){.sidebar,.app-content,.sidebar-toggle .icon{transition:none}}

@media(max-width:680px){.category-nav{grid-template-columns:1fr;right:auto;width:130px}.category-nav>button{justify-content:flex-start;padding-left:20px}}