Apply pill shape (border-radius 20px) to all buttons and sidebar nav items

src/index.css

@@ -131,7 +131,7 @@ body {
   top: 0;
   width: 26px;
   height: 26px;
-  border-radius: 6px;
+  border-radius: 20px;
   border: 1px solid #333;
   background: transparent;
   color: var(--sidebar-text);
@@ -161,7 +161,7 @@ body {
 
 .sidebar-link {
   display: flex; align-items: center; gap: 10px;
-  padding: 9px 12px; border-radius: 6px;
+  padding: 9px 12px; border-radius: 20px;
   color: var(--sidebar-text); text-decoration: none;
   font-size: 13px; font-weight: 500;
   transition: background 0.15s, color 0.15s;
@@ -169,7 +169,7 @@ body {
   width: 100%; text-align: left;
 }
 .sidebar-link:hover { background: var(--sidebar-hover-bg); color: #fff; }
-.sidebar-link.active { background: var(--sidebar-active-bg); color: #fff; border-left: 2px solid var(--accent); padding-left: 10px; }
+.sidebar-link.active { background: var(--sidebar-active-bg); color: #fff; border: 1px solid rgba(245,165,35,0.3); }
 .sidebar-link .icon { font-size: 15px; width: 18px; text-align: center; opacity: 0.7; }
 
 .sidebar-bottom {
@@ -185,7 +185,7 @@ body {
 .sidebar-theme-toggle {
   background: transparent;
   border: 1px solid #333;
-  border-radius: 6px;
+  border-radius: 20px;
   padding: 7px 10px;
   cursor: pointer;
   color: #888;
@@ -772,7 +772,7 @@ body {
 /* Buttons */
 .btn {
   display: inline-flex; align-items: center; gap: 6px;
-  padding: 9px 18px; border-radius: 6px; font-size: 13px;
+  padding: 9px 18px; border-radius: 20px; font-size: 13px;
   font-weight: 600; cursor: pointer; border: 1px solid transparent;
   transition: all 0.15s; text-decoration: none; white-space: nowrap;
   font-family: inherit; line-height: 1;

src/pages/team/BrandBook.jsx

@@ -2373,7 +2373,7 @@ function DimensionEditorModal({ sourceImage, onApply, onCancel }) {
           <button onClick={onCancel} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-muted)', fontSize: 18, lineHeight: 1, padding: '0 2px' }}>✕</button>
         </div>
         <div style={{ padding: '10px 18px', borderBottom: '1px solid var(--border)', display: 'flex', alignItems: 'center', gap: 10, flexWrap: 'wrap', background: 'var(--card-bg-2, var(--card-bg))', flexShrink: 0 }}>
-          <div style={{ display: 'flex', border: '1px solid var(--border)', borderRadius: 6, overflow: 'hidden' }}>
+          <div style={{ display: 'flex', border: '1px solid var(--border)', borderRadius: 20, overflow: 'hidden' }}>
             {[
               ['line', 'Line'],
               ['box', 'Box'],
@@ -3485,7 +3485,7 @@ function PhotoEditorModal({
 
         {/* Toolbar */}
         <div style={{ padding: '10px 18px', borderBottom: '1px solid var(--border)', display: 'flex', alignItems: 'center', gap: 12, flexWrap: 'wrap', background: 'var(--card-bg-2, var(--card-bg))', flexShrink: 0 }}>
-          <div style={{ display: 'flex', border: '1px solid var(--border)', borderRadius: 6, overflow: 'hidden' }}>
+          <div style={{ display: 'flex', border: '1px solid var(--border)', borderRadius: 20, overflow: 'hidden' }}>
             {[
               ['select', 'Select'],
               ['dimension', 'Line Dim'],