@layer components{.app-shell{grid-template-columns:var(--sidebar-width,15rem) 1fr;background:var(--color-base-100);grid-template-rows:auto 1fr;min-height:100dvh;display:grid}.app-sidebar{background:color-mix(in oklab, var(--color-base-100) 85%, var(--color-base-200));border-right:1px solid color-mix(in oklab, var(--color-base-300) 80%, transparent);z-index:40;flex-direction:column;grid-row:1/-1;height:100dvh;display:flex;position:sticky;top:0;overflow-y:auto}.app-sidebar-brand{border-bottom:1px solid color-mix(in oklab, var(--color-base-300) 60%, transparent);align-items:center;gap:.625rem;padding:1.25rem 1rem;text-decoration:none;display:flex}.app-sidebar-brand-icon{background:var(--color-primary-500);color:#fff;border-radius:.5rem;flex-shrink:0;justify-content:center;align-items:center;width:2rem;height:2rem;display:flex}.app-sidebar-brand-name{color:var(--color-base-content);font-size:.9375rem;font-weight:700;line-height:1.2}.app-sidebar-brand-tag{color:color-mix(in oklab, var(--color-base-content) 45%, transparent);margin-top:.125rem;font-size:.6875rem;font-weight:500;line-height:1}.app-nav{flex-direction:column;flex:1;gap:.125rem;padding:.75rem .5rem;display:flex}.app-nav-section-label{text-transform:uppercase;letter-spacing:.08em;color:color-mix(in oklab, var(--color-base-content) 40%, transparent);margin-top:.5rem;padding:.625rem .625rem .25rem;font-size:.6875rem;font-weight:600}.app-nav-item{color:color-mix(in oklab, var(--color-base-content) 70%, transparent);border-radius:.625rem;align-items:center;gap:.625rem;min-height:2.375rem;padding:.5rem .75rem;font-size:.875rem;font-weight:500;text-decoration:none;transition:background .1s,color .1s;display:flex}.app-nav-item:hover{background:color-mix(in oklab, var(--color-primary-500) 8%, transparent);color:var(--color-primary-600)}.app-nav-item.active,.app-nav-item[aria-current=page]{background:color-mix(in oklab, var(--color-primary-500) 12%, transparent);color:var(--color-primary-600);font-weight:600}.app-nav-item svg,.app-nav-item .nav-icon{opacity:.75;flex-shrink:0;width:1.125rem;height:1.125rem}.app-nav-item:hover .nav-icon,.app-nav-item.active .nav-icon{opacity:1}.app-nav-item .nav-badge{background:color-mix(in oklab, var(--color-primary-500) 15%, transparent);color:var(--color-primary-600);text-align:center;border-radius:9999px;min-width:1.25rem;margin-left:auto;padding:.125rem .4rem;font-size:.6875rem;font-weight:600}.app-nav-divider{background:color-mix(in oklab, var(--color-base-300) 60%, transparent);height:1px;margin:.5rem}.app-sidebar-footer{border-top:1px solid color-mix(in oklab, var(--color-base-300) 60%, transparent);padding:.75rem .5rem}.app-topbar{z-index:30;background:color-mix(in oklab, var(--color-base-100) 92%, transparent);backdrop-filter:blur(12px);border-bottom:1px solid color-mix(in oklab, var(--color-base-300) 60%, transparent);grid-column:2;align-items:center;gap:.75rem;height:3.25rem;padding:0 1.25rem;display:flex;position:sticky;top:0}.app-topbar-title{color:var(--color-base-content);font-size:.9375rem;font-weight:600}.app-topbar-spacer{flex:1}.app-topbar-status{color:color-mix(in oklab, var(--color-base-content) 55%, transparent);align-items:center;gap:.5rem;font-size:.75rem;display:flex}.app-topbar-status-dot{background:var(--color-base-300);border-radius:50%;flex-shrink:0;width:.5rem;height:.5rem}.app-topbar-status-dot.online{background:var(--color-success-500)}.app-topbar-btn{color:color-mix(in oklab, var(--color-base-content) 70%, transparent);background:color-mix(in oklab, var(--color-base-200) 80%, transparent);border:1px solid color-mix(in oklab, var(--color-base-300) 70%, transparent);cursor:pointer;border-radius:.5rem;align-items:center;gap:.375rem;padding:.3125rem .75rem;font-size:.75rem;font-weight:500;text-decoration:none;transition:background .1s,color .1s;display:flex}.app-topbar-btn:hover{background:var(--color-base-200);color:var(--color-base-content)}.app-topbar-shop-btn{background:color-mix(in oklab, var(--color-primary-500) 12%, transparent);color:var(--color-primary-600);border-color:color-mix(in oklab, var(--color-primary-500) 20%, transparent)}.app-topbar-shop-btn:hover{background:color-mix(in oklab, var(--color-primary-500) 20%, transparent);color:var(--color-primary-700)}.app-mobile-header{background:var(--color-base-100);border-bottom:1px solid var(--color-base-300);z-index:50;align-items:center;gap:.75rem;height:3.25rem;padding:0 1rem;display:none;position:sticky;top:0}.app-mobile-menu-btn{border:1px solid var(--color-base-300);cursor:pointer;width:2.25rem;height:2.25rem;color:var(--color-base-content);background:0 0;border-radius:.5rem;justify-content:center;align-items:center;display:flex}.app-main{grid-column:2;min-width:0;padding:1.5rem}.app-page-header{margin-bottom:1.5rem}.app-page-title{color:var(--color-base-content);font-size:1.375rem;font-weight:700;line-height:1.2}.app-page-subtitle{color:color-mix(in oklab, var(--color-base-content) 55%, transparent);margin-top:.25rem;font-size:.875rem}@media (width<=768px){.app-shell{grid-template-columns:1fr}.app-sidebar{z-index:50;width:15rem;transition:transform .2s;position:fixed;top:0;bottom:0;left:0;transform:translate(-100%)}.app-sidebar.open{transform:translate(0)}.app-mobile-header{display:flex}.app-topbar{grid-column:1;display:none}.app-main{grid-column:1;padding:1rem}.app-sidebar-overlay{z-index:49;background:#0006;display:none;position:fixed;inset:0}.app-sidebar-overlay.open{display:block}}}