/* ---------- top bar ---------- */
  .topbar{
    position:sticky;top:0;z-index:40;
    display:flex;align-items:center;gap:16px;
    height:50px;padding:0 20px;
    background:var(--bar);
    border-top:3px solid var(--brand);
    border-bottom:1px solid rgba(0,0,0,.35);
  }
  .brand{display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none}
  .brand .knot{
    width:24px;height:24px;border-radius:4px;
    background:var(--brand);
    display:grid;place-items:center;color:var(--ink);flex:none;
  }
  .brand .name{font-weight:600;font-size:15px;letter-spacing:.14em;text-transform:uppercase;color:#fff}
  .brand .sub{display:none}
  .topbar .div{width:1px;height:22px;background:rgba(255,255,255,.14);margin:0 18px}
  .topbar .module{font-size:13px;color:rgba(255,255,255,.6);font-weight:500}
  .topbar .spacer{flex:1}
  .topbar .marge{
    display:flex;align-items:center;gap:8px;padding:0 14px 0 0;font-size:12.5px;color:rgba(255,255,255,.6);
    border-right:1px solid rgba(255,255,255,.14);margin-right:16px;height:24px;
  }
  .topbar .marge b{font-weight:600;color:#fff;font-family:'IBM Plex Mono',monospace}
  .topbar .dot{width:6px;height:6px;border-radius:99px;background:var(--green)}
  .topbar .user{width:28px;height:28px;border-radius:4px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);display:grid;place-items:center;font-weight:600;font-size:11px;color:#fff}

  .wrap{max-width:1200px;margin:0 auto;padding:24px 20px 80px}

  /* top navigation */
  .topnav{display:flex;gap:2px}
  .navitem{font-size:13px;color:rgba(255,255,255,.6);font-weight:500;padding:6px 11px;border-radius:var(--r);cursor:pointer}
  .navitem:hover{color:#fff;background:rgba(255,255,255,.08)}
  .navitem.on{color:var(--ink);background:var(--brand-soft);font-weight:600}

  /* ---------- global search ---------- */
  .topbar .tb-side{display:flex;align-items:center;flex:1 1 0;min-width:0;overflow:hidden}
  .topbar .tb-right{justify-content:flex-end}
  .topbar .gsearch{position:relative;flex:0 1 460px;min-width:0}
  .topbar .gs-toggle{display:none;width:34px;height:34px;border-radius:var(--r);border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);color:#fff;place-items:center;flex:none;margin-left:8px}
  .topbar .gs-toggle:hover{background:rgba(255,255,255,.14)}
  .topbar .gsearch>svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:rgba(255,255,255,.5);pointer-events:none}
  .gsearch input{width:100%;height:34px;padding:0 12px 0 34px;border-radius:var(--r);border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);color:#fff;outline:none;font-size:13px}
  .gsearch input::placeholder{color:rgba(255,255,255,.5)}
  .gsearch input:focus{border-color:var(--brand);background:rgba(255,255,255,.13);box-shadow:0 0 0 3px var(--brand-ring)}
  .gsearch-results{position:absolute;top:calc(100% + 8px);left:0;right:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-pop);max-height:min(72vh,460px);overflow:auto;display:none;z-index:70}
  .gsearch-results.show{display:block}
  .gs-group{font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700;padding:9px 14px 5px;position:sticky;top:0;background:var(--surface)}
  .gs-item{display:flex;align-items:center;gap:11px;padding:8px 14px;border-top:1px solid var(--line-2);cursor:pointer}
  .gs-item:hover{background:var(--surface-2)}
  .gs-ic{width:28px;height:28px;border-radius:var(--r);display:grid;place-items:center;flex:none;background:var(--surface-2);border:1px solid var(--line);color:var(--ink-2)}
  .gs-ic.s-sea{color:var(--sea)} .gs-ic.s-air{color:var(--air)} .gs-ic.s-road{color:var(--road)}
  .gs-main{display:flex;flex-direction:column;min-width:0;flex:1}
  .gs-main b{font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .gs-sub{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .gs-tag{font-size:9px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);background:var(--surface-2);border:1px solid var(--line);border-radius:99px;padding:2px 8px;flex:none}
  .gs-empty{padding:16px 14px;font-size:12.5px;color:var(--muted)}

  @media(max-width:1040px){.topbar .gsearch{flex-basis:300px}}
  @media(max-width:860px){.topbar .marge{display:none}}
  @media(max-width:820px){.topbar .gsearch{flex-basis:200px}}
  @media(max-width:720px){
    .topbar .gsearch{display:none}
    .topbar .gs-toggle{display:grid}
    .topbar.gs-open .gsearch{display:block;position:absolute;left:18px;right:60px;top:50%;transform:translateY(-50%);flex:none;z-index:55}
    .topbar.gs-open .tb-side:first-child{display:none}
    .topbar.gs-open .user{display:none}
  }