*{box-sizing:border-box;margin:0;padding:0;}
:root{
  --bg:#F7F2E8;--bg2:#EDE7D6;--bg3:#E4DCCA;--sur:#FFFDF8;
  --tx:#1C1810;--tx2:#6B5F44;--tx3:#9C8E72;
  --go:#9A6E0A;--go2:#B8820A;--go-bg:#FBF3DC;--go-lt:#F2DBA0;
  --bd:rgba(154,110,10,0.13);--bd2:rgba(154,110,10,0.26);
  --red:#A0392A;--red-bg:#FBF0EE;--red-bd:rgba(160,57,42,0.2);
  --amber:#926200;--amber-bg:#FBF5E0;--amber-bd:rgba(146,98,0,0.2);
  --green:#2D6A45;--green-bg:#EAF4EE;--green-bd:rgba(45,106,69,0.2);
  --blue:#1E5A8A;--blue-bg:#EAF2FA;--blue-bd:rgba(30,90,138,0.2);
  --sidebar-w:220px;
  --sidebar-min:48px;
}
[data-theme="dark"]{
  --bg:#141209;--bg2:#1C1810;--bg3:#242018;--sur:#1E1B10;
  --tx:#F5F0E8;--tx2:#C4AA80;--tx3:#9C8A60;
  --go:#D4A020;--go2:#E8B830;--go-bg:#2A1E06;--go-lt:#3D2E08;
  --bd:rgba(212,160,32,0.12);--bd2:rgba(212,160,32,0.24);
  --red:#E07060;--red-bg:#2A1410;--red-bd:rgba(224,112,96,0.2);
  --amber:#D4A020;--amber-bg:#241C06;--amber-bd:rgba(212,160,32,0.2);
  --green:#5DCAA5;--green-bg:#0A2018;--green-bd:rgba(93,202,165,0.2);
  --blue:#6AABDF;--blue-bg:#0C1E2E;--blue-bd:rgba(106,171,223,0.2);
}
html,body{height:100%;font-family:'Manrope',sans-serif;background:var(--bg);color:var(--tx);transition:background 0.3s,color 0.3s;overflow:hidden;}

/* LAYOUT */
.app{display:flex;height:100vh;overflow:hidden;}

/* SIDEBAR */
.sidebar{width:var(--sidebar-w);min-width:var(--sidebar-min);flex-shrink:0;background:var(--bg2);border-right:0.5px solid var(--bd2);display:flex;flex-direction:column;transition:background 0.3s,border-color 0.3s;overflow-y:auto;overflow-x:hidden;position:relative;}
.sidebar-top{padding:20px 20px 16px;border-bottom:0.5px solid var(--bd);display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:61px;}
.sb-logo{display:flex;align-items:center;gap:9px;overflow:hidden;flex-shrink:0;}
.sb-wordmark{font-size:12px;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;color:var(--tx);white-space:nowrap;overflow:hidden;transition:opacity 0.2s,width 0.2s;}
.sb-toggle{flex-shrink:0;width:24px;height:24px;border:0.5px solid var(--bd2);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:3px;transition:all 0.15s;padding:0;}
.sb-toggle:hover{border-color:var(--go);background:var(--go-bg);}
.sb-toggle svg{width:12px;height:12px;stroke:var(--tx3);fill:none;stroke-width:2;stroke-linecap:round;flex-shrink:0;transition:transform 0.2s;}
.sidebar-nav{padding:16px 12px;flex:1;}
.sb-section{font-size:9px;letter-spacing:0.16em;text-transform:uppercase;color:var(--tx3);font-weight:500;padding:0 8px;margin:16px 0 6px;white-space:nowrap;overflow:hidden;transition:opacity 0.2s;}
.sb-section:first-child{margin-top:0;}
.sb-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:4px;cursor:pointer;transition:background 0.15s;font-size:12px;font-weight:500;color:var(--tx2);letter-spacing:0.01em;text-decoration:none;white-space:nowrap;overflow:hidden;}
.sb-item:hover{background:var(--bd);color:var(--tx);}
.sb-item.active{background:var(--go-bg);color:var(--go);}
.sb-item svg{width:14px;height:14px;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.sb-item-label{overflow:hidden;transition:opacity 0.2s,width 0.2s;}
.sb-badge{margin-left:auto;font-size:10px;font-weight:600;background:var(--red-bg);color:var(--red);padding:1px 6px;border-radius:10px;border:0.5px solid var(--red-bd);transition:opacity 0.2s;}
.sb-badge.amber{background:var(--amber-bg);color:var(--amber);border-color:var(--amber-bd);}
.sidebar-footer{padding:16px 12px;border-top:0.5px solid var(--bd);}
.sb-user{display:flex;align-items:center;gap:10px;overflow:hidden;}
.sb-user-text{overflow:hidden;transition:opacity 0.2s,width 0.2s;}
.sb-avatar{width:28px;height:28px;border-radius:50%;background:var(--go-lt);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;color:var(--go);flex-shrink:0;}
.sb-uname{font-size:11px;font-weight:500;color:var(--tx);white-space:nowrap;}
.sb-urole{font-size:10px;color:var(--tx3);white-space:nowrap;}
.theme-toggle-sb{flex-shrink:0;width:28px;height:28px;border:0.5px solid var(--bd2);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all 0.2s;}
.theme-toggle-sb:hover{border-color:var(--go);background:var(--go-bg);}
.theme-toggle-sb svg{width:12px;height:12px;stroke:var(--tx3);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}

/* SIDEBAR COLLAPSED */
.sidebar.collapsed{width:var(--sidebar-min) !important;}
.sidebar.collapsed .sb-wordmark,
.sidebar.collapsed .sb-section,
.sidebar.collapsed .sb-item-label,
.sidebar.collapsed .sb-badge,
.sidebar.collapsed .sb-user-text,
.sidebar.collapsed .theme-toggle-sb{opacity:0;pointer-events:none;width:0;min-width:0;overflow:hidden;}
.sidebar.collapsed .sb-item{justify-content:center;padding:8px 0;gap:0;}
.sidebar.collapsed .sidebar-nav{padding:16px 4px;}
.sidebar.collapsed .sidebar-footer{padding:12px 0;display:flex;justify-content:center;}
.sidebar.collapsed .sb-user{gap:0;}
.sidebar.collapsed .sb-toggle svg{transform:rotate(180deg);}
.sidebar.collapsed .sidebar-top{justify-content:center;padding:16px 0;}
.sidebar.collapsed .sb-logo{display:none;}
.sidebar.collapsed .sb-toggle{position:static;}

/* RESIZE HANDLE */
.sb-resize{position:absolute;top:0;right:0;width:4px;height:100%;cursor:col-resize;z-index:10;background:transparent;transition:background 0.15s;}
.sb-resize:hover,.sb-resize.dragging{background:var(--go);opacity:0.5;}

/* MAIN */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0;}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:0 24px;height:52px;border-bottom:0.5px solid var(--bd);flex-shrink:0;gap:12px;}
.topbar-title{font-family:'Lora',serif;font-size:18px;font-weight:400;color:var(--tx);letter-spacing:-0.01em;}
.topbar-right{display:flex;align-items:center;gap:10px;flex-shrink:0;}

/* CONTENT */
.content{flex:1;overflow-y:auto;padding:24px;display:flex;flex-direction:column;gap:20px;}

/* PANELS */
.panel{background:var(--sur);border:0.5px solid var(--bd);transition:background 0.3s,border-color 0.3s;}
.panel-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:0.5px solid var(--bd);}
.ph-title{font-size:12px;font-weight:600;color:var(--tx);letter-spacing:0.02em;}
.ph-sub{font-size:11px;color:var(--tx3);}
.ph-action{font-size:11px;color:var(--go);cursor:pointer;letter-spacing:0.04em;font-weight:500;}
.panel-body{padding:0;}

/* MOBILE */
@media(max-width:768px){
  .sidebar{width:var(--sidebar-min) !important;}
  .sidebar .sb-wordmark,.sidebar .sb-section,.sidebar .sb-item-label,.sidebar .sb-badge,.sidebar .sb-user-text,.sidebar .theme-toggle-sb{opacity:0;pointer-events:none;width:0;overflow:hidden;}
  .sidebar .sb-item{justify-content:center;padding:8px 0;gap:0;}
  .sidebar .sidebar-nav{padding:16px 4px;}
  .sidebar .sidebar-footer{padding:12px 0;display:flex;justify-content:center;}
  .sidebar .sb-user{gap:0;}
  .sidebar .sidebar-top{justify-content:center;padding:16px 0;}
  .sidebar .sb-logo{display:none;}
  .sidebar .sb-toggle{position:static;}

  .sidebar.mobile-open{width:220px !important;}
  .sidebar.mobile-open .sb-wordmark,.sidebar.mobile-open .sb-section,.sidebar.mobile-open .sb-item-label,.sidebar.mobile-open .sb-badge,.sidebar.mobile-open .sb-user-text,.sidebar.mobile-open .theme-toggle-sb{opacity:1;pointer-events:auto;width:auto;overflow:visible;}
  .sidebar.mobile-open .sb-item{justify-content:flex-start;padding:8px 10px;}
  .sidebar.mobile-open .sidebar-nav{padding:16px 12px;}
  .sidebar.mobile-open .sidebar-footer{padding:16px 12px;display:block;}
  .sidebar.mobile-open .sb-user{justify-content:flex-start;gap:10px;}

  .topbar{padding:0 16px;}
  .content{padding:16px;gap:14px;}
  .tb-search{display:none;}
}