/* One chat button at a time: in a call the room has its own Chat button,
     so the app-wide messages bubble steps aside instead of stacking on it. */
  body.in-live-room #chatLauncherBtn, body.in-solo-call #chatLauncherBtn,
  body.in-live-room #chatLauncherMenu, body.in-solo-call #chatLauncherMenu{ display:none !important; }
  /* Small "back" chip, top-left, whenever there's somewhere to go back to. */
  #vcBackBtn{ position:fixed; top:calc(12px + env(safe-area-inset-top)); left:12px; z-index:70; display:none; align-items:center; gap:6px;
    max-width:min(46vw, 220px); height:38px; padding:0 14px 0 10px; border-radius:999px; border:1.5px solid var(--line);
    background:color-mix(in srgb, var(--card) 92%, transparent); color:var(--ink); font:800 13px var(--font); cursor:pointer;
    box-shadow:0 4px 14px rgba(6,40,34,.10); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
  /* The floating ← chip is retired: the bottom bar already switches tabs, and
     Gõ Chữ and Mini Games have their own back buttons. The phone / browser
     back button still steps back through tabs and closes popups. */
  #vcBackBtn, #vcBackBtn.show{ display:none !important; }
  #vcBackBtn .vb-arrow{ font-size:17px; line-height:1; }
  #vcBackBtn .vb-label{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  #vcBackBtn:hover{ border-color:var(--cover-light); }
  body.in-live-room #vcBackBtn, body.in-solo-call #vcBackBtn, body.in-type-tutor #vcBackBtn, body.session-mode #vcBackBtn{ display:none !important; }
  /* ---- Brand (mockup B): logo mark + name on the left of the header row.
     When the ← back chip is showing it shrinks to just the mark and moves
     over to sit beside the chip. Tapping it goes Home. */
  .vc-brand{ display:flex; align-items:center; gap:9px; margin-right:auto; min-width:0; text-decoration:none; color:var(--ink);
    text-align:left; padding:2px 6px 2px 2px; border-radius:14px; transition:padding-left .18s ease; -webkit-tap-highlight-color:transparent; }
  .vc-brand:active{ background:var(--paper-dark); }
  .vc-brand-mark{ width:44px; height:44px; flex-shrink:0; object-fit:contain; filter:drop-shadow(0 2px 4px rgba(6,40,34,.14)); }
  .vc-brand-text{ display:flex; flex-direction:column; min-width:0; line-height:1.1; }
  .vc-brand-text b{ font-family:var(--font); font-size:18px; font-weight:800; letter-spacing:-0.01em; color:var(--cover, #006b57); white-space:nowrap; }
  .vc-brand-text small{ font:700 11px var(--font); color:var(--muted); white-space:nowrap; margin-top:2px; }
  body.vc-has-back .vc-brand{ padding-left:var(--vc-back-w, 150px); }
  body.vc-has-back .vc-brand-text{ display:none; }
  body.vc-has-back .vc-brand-mark{ width:40px; height:40px; }
  @media (max-width:430px){
    .vc-brand{ gap:7px; }
    .vc-brand-mark{ width:38px; height:38px; }
    .vc-brand-text b{ font-size:16px; }
    .vc-brand-text small{ font-size:10px; }
    .cover-title .dark-toggle, .cover-title .account-toggle{ width:36px !important; height:36px !important; font-size:16px; }
  }
  @media (max-width:350px){ .vc-brand-text small{ display:none; } .vc-brand-text b{ font-size:15px; } }
  @media (min-width:380px) and (max-width:430px){ .vc-brand-text b{ font-size:17.5px; } .vc-brand-text small{ font-size:10.5px; } .vc-brand-mark{ width:42px; height:42px; } }
  #vcBackBtn{ top:calc(14px + env(safe-area-inset-top)); }