feat(auth-files): add quota management features and enhance UI layout

src/pages/AuthFilesPage.module.scss

@@ -184,6 +184,18 @@
   }
 }
 
+.fileGridQuotaManaged {
+  grid-template-columns: repeat(auto-fill, minmax(520px, 1fr));
+
+  @include tablet {
+    grid-template-columns: 1fr;
+  }
+
+  @include mobile {
+    grid-template-columns: 1fr;
+  }
+}
+
 .antigravityGrid {
   display: grid;
   gap: $spacing-md;
@@ -469,6 +481,66 @@
   }
 }
 
+.fileCardLayout {
+  display: flex;
+  align-items: stretch;
+  gap: $spacing-md;
+}
+
+.fileCardLayoutQuota {
+  display: grid;
+  grid-template-columns: 1fr 156px;
+  gap: $spacing-md;
+  align-items: stretch;
+
+  @include mobile {
+    grid-template-columns: 1fr;
+  }
+}
+
+.fileCardMain {
+  display: flex;
+  flex-direction: column;
+  gap: $spacing-sm;
+  flex: 1;
+  min-width: 0;
+}
+
+.fileCardSidebar {
+  display: flex;
+  flex-direction: column;
+  gap: $spacing-sm;
+  padding-left: $spacing-md;
+  border-left: 1px dashed var(--border-color);
+
+  @include mobile {
+    border-left: none;
+    border-top: 1px dashed var(--border-color);
+    padding-left: 0;
+    padding-top: $spacing-md;
+  }
+}
+
+.fileCardSidebarHeader {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: $spacing-xs;
+}
+
+.fileCardSidebarTitle {
+  font-size: 12px;
+  font-weight: 600;
+  color: var(--text-secondary);
+  white-space: nowrap;
+}
+
+.fileCardSidebarHint {
+  font-size: 12px;
+  color: var(--text-tertiary);
+  line-height: 1.4;
+}
+
 .cardHeader {
   display: flex;
   align-items: center;