.app-shell { min-height: 100vh; display: flex; flex-direction: column; }
.site-header { position: sticky; top: 0; z-index: 50; height: var(--header-height); border-bottom: 1px solid rgba(148, 163, 184, .08); background: rgba(4, 7, 17, .9); backdrop-filter: blur(18px); }
.header-inner, .page-container, .footer-inner { width: min(calc(100% - 48px), var(--container-width)); margin: 0 auto; }
.header-inner { height: 100%; display: flex; align-items: center; gap: 24px; }
.site-main { flex: 1; }
.page-container { padding-bottom: 36px; }
.breadcrumb-region { padding: 10px 0; }
.catalog-workspace { display: grid; grid-template-columns: 250px minmax(0, 1fr) 190px; gap: 10px; align-items: start; margin-top: 10px; }
.catalog-sidebar, .filter-sidebar { position: sticky; top: calc(var(--header-height) + 10px); max-height: calc(100vh - var(--header-height) - 20px); overflow: auto; }
.catalog-main { min-width: 0; }
.site-footer { border-top: 1px solid var(--color-border); background: rgba(4, 7, 17, .62); }
.footer-inner { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 24px; color: var(--color-text-muted); }
.drawer-layer { position: fixed; inset: 0; z-index: 100; pointer-events: none; }
.drawer-layer.is-open { pointer-events: auto; }
.drawer-overlay { position: absolute; inset: 0; background: rgba(2, 5, 13, .78); opacity: 0; transition: opacity var(--transition); }
.drawer-layer.is-open .drawer-overlay { opacity: 1; }
.drawer-panel { position: absolute; inset-block: 0; inset-inline-start: 0; width: min(360px, 90vw); padding: 18px; overflow: auto; background: #080e1c; border-inline-end: 1px solid var(--color-border); transform: translateX(calc(-102% * var(--direction-factor, 1))); transition: transform var(--transition); }
.drawer-layer.is-open .drawer-panel { transform: translateX(0); }
.drawer-panel--end { inset-inline-start: auto; inset-inline-end: 0; border-inline-end: 0; border-inline-start: 1px solid var(--color-border); transform: translateX(calc(102% * var(--direction-factor, 1))); }
[dir="rtl"] { --direction-factor: -1; }
.drawer-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.mobile-controls { display: none; gap: 8px; margin: 10px 0; }