.sidebar-brand-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 6px; }
.app-brand { display: inline-flex; align-items: center; gap: 11px; color: #fff; }
.app-brand-mark { width: 43px; height: 43px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 13px; color: var(--ink); background: var(--yellow); font: 800 .72rem "Manrope", sans-serif; box-shadow: 0 10px 24px rgba(247, 201, 72, .14); }
.app-brand-name { font: 800 1.12rem "Manrope", sans-serif; letter-spacing: -.04em; }
.app-brand-name em { color: var(--yellow); font-style: normal; }
.sidebar-close { display: none; width: 38px; height: 38px; border-radius: 10px; color: #c6ced9; background: #1b2635; }
.sidebar-project { display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 10px; margin-top: 26px; padding: 11px; border: 1px solid #2a3646; border-radius: 13px; background: rgba(255, 255, 255, .035); }
.sidebar-project-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; color: var(--yellow); background: rgba(247, 201, 72, .12); }
.sidebar-project small, .sidebar-project strong { display: block; }
.sidebar-project small { color: #758195; font-size: .55rem; font-weight: 800; letter-spacing: .08em; }
.sidebar-project strong { color: #f8fafc; font-size: .72rem; }
.sidebar-project-arrow { color: #687487; font-size: .7rem; }
.sidebar-nav { margin-top: 10px; }
.nav-section-title { display: block; margin: 21px 12px 8px; color: #677387; font-size: .57rem; font-weight: 800; letter-spacing: .13em; }
.sidebar-link { min-height: 42px; display: grid; grid-template-columns: 21px 1fr auto; align-items: center; gap: 10px; padding: 9px 11px; margin: 3px 0; border-radius: 10px; color: #9fa9b8; font-size: .82rem; font-weight: 700; transition: .18s ease; }
.sidebar-link > i { color: #7e8999; font-size: .96rem; }
.sidebar-link > small { padding: 2px 6px; border-radius: 999px; color: #7f8a9a; background: #1b2635; font-size: .5rem; }
.sidebar-link:hover { color: #fff; background: rgba(255, 255, 255, .055); transform: translateX(2px); }
.sidebar-link.active { color: #fff; background: linear-gradient(90deg, rgba(247, 201, 72, .18), rgba(247, 201, 72, .06)); box-shadow: inset 3px 0 var(--yellow); }
.sidebar-link.active > i { color: var(--yellow); }
.sidebar-support { display: flex; gap: 10px; margin: auto 2px 15px; padding: 13px; border: 1px solid rgba(247, 201, 72, .17); border-radius: 13px; background: rgba(247, 201, 72, .075); }
.sidebar-support > span { width: 32px; height: 32px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 9px; color: var(--yellow); background: rgba(247, 201, 72, .12); }
.sidebar-support strong, .sidebar-support small { display: block; }
.sidebar-support strong { color: #fff; font-size: .66rem; }
.sidebar-support small { margin-top: 3px; color: #8490a0; font-size: .57rem; line-height: 1.4; }
.sidebar-user { display: grid; grid-template-columns: 38px 1fr 30px; align-items: center; gap: 10px; padding: 14px 8px 2px; border-top: 1px solid #263141; }
.user-avatar { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: #543e00; background: var(--yellow); font: 800 .7rem "Manrope", sans-serif; }
.user-avatar.small { width: 36px; height: 36px; flex: 0 0 auto; }
.sidebar-user-info { min-width: 0; }
.sidebar-user-info strong, .sidebar-user-info small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-user-info strong { color: #fff; font-size: .7rem; }
.sidebar-user-info small { color: #7e8999; font-size: .59rem; }
.sidebar-user-menu { width: 30px; height: 30px; color: #7e8999; background: transparent; border-radius: 8px; }
.sidebar-user-menu:hover { color: #fff; background: #1c2736; }

.header-leading, .header-actions { display: flex; align-items: center; gap: 14px; }
.header-leading { min-width: 0; }
.header-title { min-width: 0; }
.header-title h1 { margin: 1px 0 0; font-size: 1.2rem; letter-spacing: -.035em; }
.header-title p { margin: 1px 0 0; color: var(--muted); font-size: .68rem; }
.breadcrumb { display: flex; align-items: center; gap: 6px; color: var(--muted-2); font-size: .59rem; }
.breadcrumb a { color: #9a7100; font-weight: 700; }
.breadcrumb i { font-size: .48rem; }
.menu-toggle { display: none !important; }
.header-icon-button { position: relative; width: 40px; height: 40px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 11px; color: #475467; background: var(--surface); }
.header-icon-button:hover { background: #f9fafb; box-shadow: var(--shadow-sm); }
.notification-button > span { position: absolute; top: -4px; right: -4px; min-width: 17px; height: 17px; display: grid; place-items: center; padding: 0 4px; border: 2px solid #fff; border-radius: 999px; color: #fff; background: var(--red); font-size: .52rem; font-weight: 800; }
.header-search { width: min(300px, 23vw); height: 43px; display: flex; align-items: center; gap: 9px; padding: 0 11px; border: 1px solid var(--line); border-radius: 11px; color: var(--muted-2); background: #f9fafb; }
.header-search input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; font-size: .73rem; }
.header-search kbd { padding: 2px 6px; border: 1px solid var(--line); border-radius: 5px; color: var(--muted-2); background: #fff; font: 600 .54rem "DM Sans", sans-serif; white-space: nowrap; }
.header-date { display: flex; align-items: center; gap: 9px; padding: 0 12px; border-left: 1px solid var(--line); }
.header-date > i { color: #9a7100; }
.header-date small, .header-date strong { display: block; }
.header-date small { color: var(--muted-2); font-size: .49rem; font-weight: 800; letter-spacing: .08em; }
.header-date strong { font-size: .66rem; }
.profile-wrap { position: relative; }
.header-profile { min-height: 46px; display: flex; align-items: center; gap: 9px; padding: 4px 6px 4px 4px; border-radius: 12px; background: transparent; }
.header-profile:hover { background: #f7f8fa; }
.header-profile > span:not(.user-avatar) { max-width: 130px; text-align: left; }
.header-profile strong, .header-profile small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.header-profile strong { font-size: .67rem; }
.header-profile small { color: var(--muted); font-size: .56rem; }
.header-profile > i { color: var(--muted-2); font-size: .58rem; }
.profile-menu { position: absolute; top: calc(100% + 10px); right: 0; z-index: 100; width: 240px; padding: 8px; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: 0 20px 50px rgba(16, 24, 40, .16); }
.profile-menu-head { padding: 11px 10px 12px; border-bottom: 1px solid var(--line-soft); }
.profile-menu-head strong, .profile-menu-head small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-menu-head strong { font-size: .76rem; }.profile-menu-head small { color: var(--muted); font-size: .64rem; }
.profile-menu a, .profile-menu form button { width: 100%; min-height: 38px; display: grid; grid-template-columns: 20px 1fr auto; align-items: center; gap: 7px; padding: 7px 9px; border-radius: 8px; color: #344054; background: transparent; text-align: left; font-size: .7rem; font-weight: 700; }
.profile-menu a:hover, .profile-menu form button:hover { background: #f5f6f8; }
.profile-menu a small { color: var(--muted-2); font-size: .5rem; }
.profile-menu form { margin-top: 4px; padding-top: 4px; border-top: 1px solid var(--line-soft); }
.profile-menu form button { color: #b42318; }
.system-status { display: inline-flex; align-items: center; gap: 6px; }
.system-status i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(18, 183, 106, .11); }

.eyebrow-app { color: #9a7100; font-size: .62rem; font-weight: 800; letter-spacing: .12em; }
.primary-button { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 0 18px; border-radius: 11px; color: #fff; background: var(--ink); font-size: .76rem; font-weight: 800; box-shadow: 0 10px 24px rgba(16, 24, 40, .14); }
.primary-button:hover { background: #253044; transform: translateY(-1px); }
.primary-button.compact { min-height: 42px; }
.secondary-button { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 14px; border: 1px solid var(--line); border-radius: 10px; color: #344054; background: #fff; font-size: .7rem; font-weight: 800; }
.secondary-button:hover { background: #f9fafb; }
.content-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 21px 22px; border-bottom: 1px solid var(--line-soft); }
.card-heading h2 { margin: 4px 0 0; font-size: 1.05rem; letter-spacing: -.035em; }
.card-heading p { margin: 4px 0 0; color: var(--muted); font-size: .7rem; }

@media (max-width: 900px) {
    .sidebar-close, .menu-toggle { display: grid !important; }
}

@media (max-width: 640px) {
    .header-title p, .breadcrumb { display: none; }
    .header-actions { gap: 7px; }
    .header-profile { padding: 2px; }
}