/* Endurance Lab 11.1 — calm, grouped navigation */
:root { --nav-ink:#c5d7e1; --nav-highlight:#d7f39f; }
.app { grid-template-columns: 254px minmax(0,1fr); }
.sidebar {
  position:sticky; top:0; height:100dvh; overflow-y:auto; overscroll-behavior:contain;
  gap:0; padding:26px 16px 18px; scrollbar-width:thin; scrollbar-color:#344b57 transparent;
  background:linear-gradient(180deg,#101e2c 0%,#0b1724 76%,#0c1a28 100%);
  border-right:1px solid #263d4f;
}
.sidebar .brand {padding:5px 9px 22px; margin-bottom:23px; border-bottom:1px solid #273b4a;}
.sidebar .brand-mark {width:43px;height:43px;border:1px solid #7a9c72;background:#203329;border-radius:14px;font-size:18px;letter-spacing:-1px;}
.sidebar .brand strong{font-size:18px;letter-spacing:-.45px;}
.sidebar .brand span{font-size:10px;color:#90aebd;letter-spacing:1.7px;}
.nav {display:block; gap:0;}
.nav-caption {color:#7894a4;font-size:10px;font-weight:850;letter-spacing:1.6px;text-transform:uppercase;padding:2px 13px 10px;}
.nav-primary {display:grid;gap:4px;}
.sidebar .nav button[data-nav] {
  width:100%; border:1px solid transparent; min-height:43px; border-radius:11px;
  padding:10px 12px; font-size:13px; font-weight:660; color:#bbcfda;
  background:transparent; text-align:left; display:flex; gap:12px; align-items:center;
  position:relative; transition:background .15s,border-color .15s,color .15s;
}
.sidebar .nav button[data-nav]:hover {background:#203347;color:#f3fafc;}
.sidebar .nav button[data-nav].active {
  background:linear-gradient(100deg,#2c443d 0%,#263b3d 95%);
  border-color:#446653;color:#edffd0;
  box-shadow:inset 3px 0 0 #cbee91;
}
.sidebar .nav button[data-nav][hidden] { display:none!important; }
.nav-icon {flex:none; width:21px; height:21px;display:grid;place-items:center;font-size:17px;line-height:1;color:#8cb5bb;}
.sidebar .nav button.active .nav-icon{color:#d7f39f;}
.nav-icon svg{display:block;width:20px;height:20px;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;fill:none;}
.nav-collections{margin:22px 0 0;padding-top:19px;border-top:1px solid #273c4b;}
.nav-details{margin:4px 0;border-radius:12px;overflow:hidden;}
.nav-details[hidden]{display:none!important;}
.nav-details summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;
  padding:12px 12px;border-radius:11px;color:#adc5d0;
  font-size:12px;font-weight:770;user-select:none;
}
.nav-details summary::-webkit-details-marker{display:none;}
.nav-details summary:hover,.nav-details[open]>summary{color:#eff9fb;background:#1b3040;}
.nav-summary-icon{font-size:15px;color:#86c8c3;width:20px;text-align:center;flex:none;}
.nav-caret{margin-left:auto;font-size:11px;color:#829bac;transform:rotate(0deg);transition:transform .18s ease;}
.nav-details[open] .nav-caret{transform:rotate(90deg);}
.nav-secondary{padding:4px 0 7px 10px;border-left:1px solid #344b55;margin:3px 0 7px 21px;}
.sidebar .nav-secondary button[data-nav]{min-height:35px;padding:7px 10px 7px 12px;gap:9px;font-size:12px;border-radius:9px;}
.nav-secondary .nav-icon{width:17px;height:17px;font-size:14px;}
.sidebar .nav-secondary button.active{box-shadow:none;border-color:#39594a;}
.sidebar .nav-secondary button.active::before{content:"";position:absolute;left:-13px;top:9px;bottom:9px;width:2px;border-radius:3px;background:#cbee91;}
.side-footer{margin-top:auto;padding:18px 6px 5px;border:0;border-top:1px solid #273d4c;border-radius:0;background:transparent;}
.sidebar .nav-account{padding:0 0 12px;}
.sidebar .nav-account button[data-nav] {margin:0;}
.side-footer-note {padding:0 10px;font-size:11px;line-height:1.55;color:#7799a9;display:flex;gap:8px;align-items:flex-start;}
.side-footer-note i{width:7px;height:7px;background:#bde890;flex:none;border-radius:50%;margin-top:5px;box-shadow:0 0 0 3px #bde89022;}
.main {max-width:1610px;padding-top:31px;}
.topbar {margin-bottom:28px;padding:0 0 18px;border-bottom:1px solid #273b4c;}
.workspace-label {display:flex;align-items:center;gap:9px;min-width:0;}
.workspace-label .eyebrow {font-size:11px;letter-spacing:1.35px;color:#9ab1bb;}
.workspace-label .crumb-sep{color:#577480;font-size:15px;}
.workspace-label #navBreadcrumb{color:#d7f39f;letter-spacing:1px;font-size:11px;font-weight:850;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.top-actions .btn {border-radius:11px;}
.top-actions .btn.primary{box-shadow:0 4px 16px #cbee9120;}
.panel{box-shadow:0 9px 32px #03091528;}
.hero{border-color:#38584f;}
.view > .page-head h1 {letter-spacing:-1.4px;}
#syncBadge[data-sync="synced"]{background:#223b30;}
.nav-explorer{display:grid;gap:21px;padding:1px 0 6px;}
.nav-explorer-section{display:grid;gap:8px;}
.nav-explorer-section h3{font-size:10px;letter-spacing:1.6px;color:#a0c8b0;text-transform:uppercase;margin:0 0 1px;}
.nav-explorer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
.nav-explore-tile{width:100%;text-align:left;display:flex;align-items:center;gap:11px;border-radius:12px;border:1px solid #344d5d;background:#182d3f;padding:12px 11px;color:#e5f1f6;min-height:55px;font-weight:700;font-size:12px;cursor:pointer;}
.nav-explore-tile:hover,.nav-explore-tile:focus-visible{background:#264539;border-color:#799c77;color:#e7ffd9;}
.nav-explore-tile .nav-icon{color:#addba5;width:23px;}
.nav-explore-tile[hidden]{display:none!important;}
.mobile-tabs {display:none;}
@media (max-width:1150px) and (min-width:821px) {
  .app{grid-template-columns:224px minmax(0,1fr);}
  .sidebar{padding:24px 11px 17px;}
  .main{padding:26px 25px 70px;}
}
@media (max-width:820px) {
  .app{display:block;}
  .sidebar{display:none;}
  .main{padding:19px 16px 98px;}
  .topbar{gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:21px;padding-bottom:14px;}
  .workspace-label{min-height:27px;max-width:100%;}
  .workspace-label .eyebrow {letter-spacing:.8px;}
  .top-actions {gap:7px;width:100%;justify-content:space-between;}
  .top-actions #profileQuickButton {display:none;}
  .top-actions .btn{font-size:12px;padding:9px 12px;}
  .top-actions #topImport{display:inline-flex;}
  #syncBadge{display:inline-flex;font-size:11px;align-items:center;padding:7px 10px;}
  .mobile-tabs{
    display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;
    bottom:0;left:0;right:0;z-index:29;padding:7px 5px calc(8px + env(safe-area-inset-bottom));
    border-top:1px solid #405b5b;background:#101e2eec;
    backdrop-filter:blur(17px);-webkit-backdrop-filter:blur(17px);
    box-shadow:0 -12px 45px #050b18b8;
  }
  .mobile-tabs button{
    display:flex;align-items:center;justify-content:center;gap:4px;flex-direction:column;
    border:0;border-radius:12px;min-height:52px;padding:6px 1px;
    color:#a1b8c5;font-size:10px;font-weight:780;background:transparent;
  }
  .mobile-tabs button b{font-weight:500;font-size:21px;line-height:24px;}
  .mobile-tabs button.active{color:#d7f39f;background:#283d36;}
  .mobile-tabs button:focus-visible{outline:2px solid #cbee91;outline-offset:-3px;}
}
@media(max-width:420px){
  .topbar{align-items:stretch;}
  .top-actions{gap:6px;}
  .top-actions .btn:not(.primary){display:inline-flex;}
  .top-actions #topImport{font-size:11px;padding:8px 10px;}
  #syncBadge{font-size:10px;}
  .nav-explorer-grid{grid-template-columns:1fr;}
}
@media(prefers-reduced-motion:reduce){.sidebar .nav button,.nav-caret{transition:none;}}
