/* Facebook's open desktop rail proportions, on Selebox's existing sidebar.
   No duplicate navigation, new routes, or changes to the phone drawer. */
@media (min-width:769px) {
  body { --sidebar-w:clamp(236px,22vw,300px); }
  body #appSidebar,
  body.on-books:has(#bookPage.books-mobile-v2) #appSidebar {
    --rail-ink:var(--text);
    --rail-hover:rgba(100,90,125,.08);
    --rail-selected:var(--accent-soft);
    display:flex !important;
    position:fixed;
    top:calc(var(--header-h) + 12px);
    left:8px;
    bottom:12px;
    width:calc(var(--sidebar-w) - 16px);
    padding:0 !important;
    gap:0 !important;
    border:0 !important;
    border-radius:0;
    background:transparent !important;
    box-shadow:none !important;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    visibility:visible;
    transform:none;
    font-family:Inter,system-ui,sans-serif;
  }
  body.on-books:has(#bookPage.books-mobile-v2) #appSidebar { --rail-ink:#202124; }
  body #appSidebar::after { display:none; }
  body #appSidebar :is(.sidebar-nav-card,.sidebar-settings-card) {
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    gap:0 !important;
  }
  body #appSidebar .sidebar-nav-card { scrollbar-width:thin; scrollbar-color:transparent transparent; }
  body #appSidebar .sidebar-nav-card:hover { scrollbar-color:#b9b4c3 transparent; }
  body #appSidebar .sidebar-nav-card::-webkit-scrollbar { width:5px; }
  body #appSidebar .sidebar-nav-card:hover::-webkit-scrollbar-thumb { background:#b9b4c3; border-radius:4px; }
  body #appSidebar .sidebar-item {
    height:56px;
    min-height:56px;
    flex-shrink:0;
    padding:8px !important;
    gap:12px;
    border-radius:8px !important;
    background:transparent;
    color:var(--rail-ink) !important;
    box-shadow:none;
    transition:background .15s ease;
  }
  body #appSidebar .sidebar-label { font-size:15px; line-height:20px; font-weight:500; letter-spacing:0; }
  body #appSidebar .sidebar-item:hover { background:var(--rail-hover) !important; }
  body #appSidebar .sidebar-item:active { transform:none; }
  body #appSidebar .sidebar-item.active { background:var(--rail-selected) !important; color:var(--rail-ink) !important; box-shadow:none; }
  body #appSidebar .sidebar-item.active::before { display:none; }
  body #appSidebar .sidebar-item.active .sidebar-label { font-weight:650; }
  body #appSidebar .sidebar-icon {
    width:36px;
    height:36px;
    border-radius:10px;
    background:color-mix(in srgb,var(--rail-icon,#64748b) 12%,transparent);
    color:var(--rail-icon,#64748b) !important;
  }
  body #appSidebar .sidebar-icon svg { width:27px; height:27px; stroke-width:2; color:inherit !important; }
  body #appSidebar #btnPost { --rail-icon:#1877e8; }
  body #appSidebar #btnVideos { --rail-icon:#e34468; }
  body #appSidebar #btnBook { --rail-icon:#7c3aed; }
  body #appSidebar #btnKomiks { --rail-icon:#df8b16; }
  body #appSidebar #btnRadiobox { --rail-icon:#d847a1; }
  body #appSidebar #btnStudio { --rail-icon:#e28a20; }
  body #appSidebar #btnWriterLounge { --rail-icon:#6366d9; }
  body #appSidebar #btnAuthor { --rail-icon:#9960cf; }
  body #appSidebar #btnBookmarks { --rail-icon:#3e8bdc; }
  body #appSidebar #btnMessages { --rail-icon:#3487f4; }
  body #appSidebar #btnProfile { --rail-icon:#269fa0; }
  body #appSidebar #btnEarnings { --rail-icon:#27a277; }
  body #appSidebar .sidebar-nav-card .sidebar-divider {
    display:block !important;
    flex-shrink:0;
    height:1px;
    width:calc(100% - 16px);
    margin:8px;
    background:rgba(130,123,143,.22);
  }
  body #appSidebar .sidebar-settings-card { border-top:1px solid rgba(130,123,143,.22) !important; padding-top:10px !important; margin:8px 8px 0; }
  body #appSidebar .sidebar-settings-divider { display:none; }
  body #appSidebar .sidebar-theme-toggle { margin:0; padding:3px; border:0; border-radius:8px; background:var(--rail-hover); box-shadow:none; backdrop-filter:none; }
  body #appSidebar .sidebar-theme-option { color:var(--rail-ink); background:transparent; box-shadow:none; min-height:34px; }
  body #appSidebar .sidebar-theme-option.is-selected { background:var(--rail-selected); color:var(--rail-ink); box-shadow:none; }
  body #appSidebar .sidebar-theme-label { font-size:12px; }
  body #appSidebar .sidebar-item:focus-visible { outline:2px solid var(--accent-primary); outline-offset:-2px; }
}