.header{height:var(--header-height);background-color:var(--surface);border-bottom:1px solid var(--border);z-index:50;justify-content:space-between;align-items:center;padding:0 1.5rem;display:flex;position:absolute;top:0;left:0;right:0}.header-logo b{color:var(--text-main);font-size:1.25rem}.header-logo span{color:var(--primary)}.avatar{background:linear-gradient(135deg, var(--primary), var(--primary-light));color:#fff;width:36px;height:36px;box-shadow:var(--shadow-sm);border-radius:50%;justify-content:center;align-items:center;font-size:.875rem;font-weight:700;display:flex}.bottom-nav{height:var(--bottom-nav-height);background-color:var(--surface);border-top:1px solid var(--border);z-index:50;padding-bottom:env(safe-area-inset-bottom);justify-content:space-around;align-items:center;display:flex;position:absolute;bottom:0;left:0;right:0}.nav-item{color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;transition:color .2s;display:flex}.nav-item.active{color:var(--primary)}.nav-icon{margin-bottom:.25rem;font-size:1.25rem;transition:transform .2s}.nav-item.active .nav-icon{transform:translateY(-2px)}.nav-label{font-size:.7rem;font-weight:500}