/* ── SIDEBAR ─────────────────────────────────────────────────── */
.sidebar{
  width:200px;flex-shrink:0;
  background:var(--sidebar);
  border-right:1px solid #2a2520;
  display:flex;flex-direction:column;
  height:100vh;position:sticky;top:0;
  overflow-y:auto;overflow-x:hidden;
  scrollbar-width:none;
}
.sidebar::-webkit-scrollbar{ display:none; }

/* Header */
.sidebar-head{
  padding:20px 16px 14px;
  border-bottom:1px solid #2a2520;
  display:flex;align-items:center;gap:10px;
}
.sidebar-brand-icon{
  width:32px;height:32px;border-radius:9px;
  background:rgba(201,168,76,.12);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);font-size:16px;flex-shrink:0;
}
.sidebar-title{
  font-family:'DM Serif Display',serif;
  font-size:15px;color:#faf7f2;letter-spacing:-.1px;flex:1;
}
.sidebar-close-btn{
  display:none;background:none;border:none;
  color:#6b5e50;font-size:18px;padding:2px;
}

/* Hint */
.sidebar-hint{
  font-size:9px;color:#4a3e34;padding:8px 16px;
  display:flex;align-items:center;gap:5px;
  border-bottom:1px solid #2a2520;letter-spacing:.05em;
}

/* Tab list */
.sidebar-tabs{
  flex:1;padding:8px 8px;
  display:flex;flex-direction:column;gap:1px;
  overflow-y:auto;scrollbar-width:none;
}
.sidebar-tabs::-webkit-scrollbar{ display:none; }

/* Group label */
.sidebar-group-label{
  font-size:9px;font-weight:800;text-transform:uppercase;
  letter-spacing:.16em;color:#4a3e34;
  padding:12px 8px 4px;
}

/* Tab button */
.tab-btn{
  display:flex;align-items:center;gap:9px;
  width:100%;background:none;border:none;
  border-radius:9px;padding:8px 10px;
  cursor:pointer;color:#a89880;font-size:13px;
  font-weight:500;text-align:left;
  transition:background .15s,color .15s;
  font-family:'IBM Plex Sans',sans-serif;
}
.tab-btn:hover{ background:rgba(201,168,76,.07);color:#faf7f2; }
.tab-btn.active{
  background:rgba(201,168,76,.12);
  color:var(--gold);font-weight:700;
}
.tab-btn.dragging{ opacity:.4; }

.tab-icon-tile{
  width:26px;height:26px;border-radius:7px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.04);font-size:14px;color:inherit;
}
.tab-btn.active .tab-icon-tile{
  background:rgba(201,168,76,.15);
}
.tab-label{ flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }

/* Sync + user footer */
.sidebar-sync{
  padding:12px 16px;border-top:1px solid #2a2520;
  display:flex;flex-direction:column;gap:6px;
}
.sync-badge{
  font-size:10px;font-weight:700;border-radius:5px;padding:3px 8px;
  display:inline-flex;align-items:center;gap:4px;
}
.sync-ok  { background:rgba(5,150,105,.1);color:#059669; }
.sync-err { background:rgba(220,38,38,.1);color:#dc2626; }
.logged-in-row{
  display:flex;align-items:center;gap:6px;
}
.logged-in-email{
  font-size:11px;color:#6b5e50;flex:1;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.logout-btn{
  background:none;border:none;color:#6b5e50;
  font-size:16px;padding:4px;border-radius:6px;
  transition:color .15s;
}
.logout-btn:hover{ color:#b07a6e; }

/* Sidebar collapse button */
.sidebar-collapse-btn{
  display:none;
}

/* Mobile topbar */
.mobile-topbar{
  display:none;position:fixed;
  top:0;left:0;right:0;z-index:200;
  height:52px;background:var(--sidebar);
  border-bottom:1px solid #2a2520;
  align-items:center;padding:0 14px;gap:10px;
}
.mobile-topbar-title{
  font-family:'DM Serif Display',serif;
  font-size:16px;color:#faf7f2;flex:1;text-align:center;
}
.mobile-topbar-spacer{ width:40px; }
.hamburger-btn{
  background:none;border:none;color:var(--gold);
  font-size:20px;padding:6px;
}
.sidebar-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.5);z-index:299;backdrop-filter:blur(4px);
}
.sidebar-overlay.visible{ display:block; }

@media(max-width:768px){
  .sidebar{
    position:fixed;left:0;top:0;bottom:0;z-index:300;
    width:220px;transform:translateX(-220px);
    transition:transform .25s cubic-bezier(.25,.46,.45,.94);
  }
  .sidebar.open{ transform:translateX(0); }
  .sidebar-close-btn{ display:flex; }
  .mobile-topbar{ display:flex; }
  #tab-panels{ padding:72px 16px 24px; }
  .form-row,.form-row.three,.form-row.four{ grid-template-columns:1fr; }
  .stat-grid{ grid-template-columns:1fr 1fr; }
}