Align controls to 36/10 and make create modals full-screen on mobile.

Co-authored-by: Cursor <cursoragent@cursor.com>

apps/web/src/layouts/AppLayout.vue

@@ -1038,15 +1038,17 @@ onUnmounted(() => {
   .sidebar.collapsed .brand-row {
     width: max-content;
     max-width: none;
-    height: 49px;
+    height: var(--control-h);
+    min-height: var(--control-h);
     box-sizing: border-box;
+    overflow: hidden;
     align-self: flex-start;
     align-items: center;
     justify-content: flex-start;
     z-index: 3;
-    padding: 0.25rem 0.55rem;
+    padding: 0 0.5rem;
     background: #fff;
-    border-radius: 18px;
+    border-radius: var(--radius);
     box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
   }
 
@@ -1055,7 +1057,7 @@ onUnmounted(() => {
     width: max-content;
     flex-direction: row;
     align-items: center;
-    gap: 1.5rem;
+    gap: 0.55rem;
   }
 
   .sidebar.collapsed .sidebar-logo,
@@ -1080,22 +1082,16 @@ onUnmounted(() => {
   }
 
   .sidebar.collapsed .profile-card {
-    flex-direction: column;
+    flex-direction: row;
     align-items: center;
-    max-width: 4.8rem;
+    max-width: none;
     flex: 0 0 auto;
-    gap: 0.05rem;
+    gap: 0;
     padding: 0;
   }
 
   .sidebar.collapsed .profile-meta {
-    text-align: center;
-  }
-
-  .sidebar.collapsed .profile-meta strong {
-    font-size: 0.62rem;
-    line-height: 1.1;
-    white-space: nowrap;
+    display: none;
   }
 
   .sidebar.collapsed .avatar-wrap,
@@ -1163,10 +1159,10 @@ onUnmounted(() => {
     display: grid;
     place-items: center;
     flex-shrink: 0;
-    min-height: 42px;
-    height: 42px;
+    min-height: var(--control-h);
+    height: var(--control-h);
     padding: 0;
-    border-radius: 12px;
+    border-radius: var(--radius);
     position: relative;
   }
 
@@ -1212,9 +1208,9 @@ onUnmounted(() => {
     display: grid;
     place-items: center;
     width: 100%;
-    min-height: 42px;
+    min-height: var(--control-h);
     padding: 0;
-    border-radius: 12px;
+    border-radius: var(--radius);
     color: #94a3b8;
   }
 
@@ -1260,7 +1256,7 @@ onUnmounted(() => {
 .desktop-topbar {
   display: grid;
   grid-template-columns: minmax(0, 1fr) auto;
-  align-items: start;
+  align-items: center;
   gap: 1rem;
   min-width: 0;
   /* همان فاصله بالای سایدبار شناور (14px) */
@@ -1307,9 +1303,9 @@ onUnmounted(() => {
 
 .round-btn {
   position: relative;
-  width: 42px;
-  height: 42px;
-  border-radius: 999px;
+  width: var(--control-h);
+  height: var(--control-h);
+  border-radius: var(--radius);
   border: 0;
   background: #fff;
   color: #64748b;
@@ -1334,8 +1330,10 @@ onUnmounted(() => {
   display: inline-flex;
   align-items: center;
   gap: 0.45rem;
-  padding: 0.55rem 0.85rem;
-  border-radius: 999px;
+  height: var(--control-h);
+  box-sizing: border-box;
+  padding: 0 0.75rem;
+  border-radius: var(--radius);
   background: #fff;
   color: #64748b;
   font-size: 0.84rem;