:root{ --sidebar-w: 224px; }

  .sidebar{
    gap:10px !important;
    padding:10px 10px 10px !important;
    max-height:100dvh;
    overflow:visible !important;
  }
  .sidebar-top{
    gap:6px !important;
    flex:0 0 auto;
  }
  .sidebar-brand{
    gap:8px !important;
    padding-top:0 !important;
  }
  .sidebar-logo{
    max-width:118px !important;
  }
  .sidebar-nav{
    gap:6px !important;
  }
  .sidebar-nav .btn,
  #sidebarToolsHost #toolsBtn,
  #sidebarAccountHost .btn,
  #sidebarBackHost > #backToDataBtn{
    width:100%;
    display:block !important;
    min-height:0 !important;
    padding:6px 10px !important;
    text-align:center !important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  #sidebarToolsHost,
  #sidebarToolsHost .tools-wrap{
    width:100%;
  }
  #sidebarToolsHost .tools-wrap{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:0 !important;
  }
  #sidebarToolsHost #toolsBtn{
    justify-content:initial !important;
    align-items:initial !important;
  }
  #sidebarToolsHost .tools-quick-row,
  #sidebarToolIcons{
    display:none !important;
  }
  #sidebarBackHost > #backToDataBtn{
    margin-right:0 !important;
  }

  .sidebar-history-wrap{
    flex:1 1 auto !important;
    min-height:0 !important;
    border-radius:14px !important;
  }
  .sidebar-history-head{
    gap:6px !important;
    padding:9px 10px 6px !important;
  }
  .sidebar-history-head strong{
    font-size:14px;
    line-height:1.2;
  }
  .sidebar-history-meta{
    margin-top:2px !important;
    font-size:11px !important;
  }
  .sidebar-history-actions{
    gap:4px !important;
  }
  .sidebar-history-actions .btn.small{
    padding:4px 8px !important;
    font-size:12px !important;
  }
  .sidebar-history-list{
    padding:0 6px 6px !important;
  }
  #sidebarHistoryList .hist-item{
    gap:4px !important;
    padding:1px 0 !important;
  }
  #sidebarHistoryList .hist-main{
    padding:5px 6px !important;
    border-radius:8px !important;
  }
  #sidebarHistoryList .hist-line{
    font-size:13px !important;
    line-height:1.25 !important;
  }
  #sidebarHistoryList .hist-del{
    width:24px !important;
    min-width:24px !important;
    height:24px !important;
  }

  .sidebar-footer{
    padding-top:8px !important;
    gap:6px !important;
  }

  .mobile-sidebar-toggle{
    width:44px !important;
    height:44px !important;
    left:8px !important;
    bottom:calc(env(safe-area-inset-bottom, 0px) + 10px) !important;
  }
  .mobile-sidebar-toggle .line{
    width:16px !important;
  }

  @media (min-width: 641px){
    .wrap{
      padding:0 14px 24px var(--sidebar-w) !important;
    }
    body > .card,
    body > #relocCard,
    body > #aspectFinderCard,
    body > #natalWheelCard,
    body > #rightWheelCard,
    body > #biWheelCard,
    body > #compositeWheelCard,
    body > #aiCard{
      margin:0 14px 0 var(--sidebar-w) !important;
    }
    #sidebarToolsHost .tools-dropdown{
      left:calc(100% + 8px) !important;
      top:0 !important;
      min-width:280px;
      width:min(280px, calc(100vw - 40px));
    }
  }

  @media (max-width: 640px){
    .sidebar{
      width:min(82vw, 280px) !important;
      max-width:280px !important;
    }
    .sidebar-logo{
      max-width:104px !important;
    }
    .sidebar-close{
      width:30px !important;
      min-width:30px !important;
      height:30px !important;
    }
  }