:root { --portal-sidebar-width: 224px; }

.portal-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 80;
  width: var(--portal-sidebar-width);
  display: flex;
  flex-direction: column;
  padding: 18px 12px;
  color: #dce7f5;
  background: #10243f;
  box-shadow: 8px 0 30px rgba(7, 22, 42, .12);
}
.portal-sidebar-brand { display:flex; align-items:center; gap:10px; min-width:0; padding:4px 8px 18px; color:#fff; text-decoration:none; }
.portal-sidebar-mark { flex:0 0 auto; width:38px; height:38px; display:grid; place-items:center; border-radius:11px; background:#fff; color:#10243f; font-size:11px; font-weight:900; }
.portal-sidebar-brand span:last-child { min-width:0; font-size:15px; font-weight:850; line-height:1.2; overflow-wrap:anywhere; }
.portal-sidebar-label { margin:9px 10px 7px; color:#8296af; font-size:11px; font-weight:800; letter-spacing:.08em; }
.portal-sidebar-nav { display:grid; gap:5px; }
.portal-sidebar-link { min-width:0; display:flex; align-items:center; gap:11px; padding:11px 12px; border-radius:10px; color:#dce7f5; text-decoration:none; font-size:14px; font-weight:720; }
.portal-sidebar-link:hover,.portal-sidebar-link.active { color:#fff; background:rgba(255,255,255,.12); }
.portal-sidebar-icon { flex:0 0 auto; width:22px; text-align:center; font-size:16px; }
.portal-sidebar-link span:last-child { min-width:0; overflow-wrap:anywhere; }
.portal-sidebar-foot { margin-top:auto; padding:13px 10px 4px; border-top:1px solid rgba(255,255,255,.12); color:#90a3ba; font-size:11px; line-height:1.5; overflow-wrap:anywhere; }

@media (min-width: 961px) {
  body.portal-nav-ready { padding-left: var(--portal-sidebar-width); }
  body.portal-nav-ready .desktop-nav,
  body.portal-nav-ready .oc-links a,
  body.portal-nav-ready .mail-topbar > div:last-child,
  body.portal-nav-ready .topbar .links,
  body.portal-nav-ready .embroider-top-actions a,
  body.portal-nav-ready .library-topbar nav { display:none !important; }
}

.portal-menu-button,.portal-sidebar-backdrop { display:none; }

@media (max-width: 960px) {
  body.portal-nav-ready .desktop-nav,
  body.portal-nav-ready .oc-links a,
  body.portal-nav-ready .mail-topbar > div:last-child,
  body.portal-nav-ready .topbar .links,
  body.portal-nav-ready .embroider-top-actions a,
  body.portal-nav-ready .library-topbar nav { display:none !important; }
  .portal-sidebar { display:flex; width:min(82vw,300px); transform:translateX(-105%); transition:transform .2s ease; }
  .portal-sidebar.open { transform:translateX(0); }
  .portal-sidebar-backdrop { position:fixed; inset:0; z-index:79; background:rgba(4,16,31,.48); }
  .portal-sidebar-backdrop.open { display:block; }
  .portal-menu-button { position:fixed; right:16px; bottom:82px; z-index:82; width:48px; height:48px; place-items:center; border:0; border-radius:50%; background:#1768e5; color:#fff; box-shadow:0 10px 28px rgba(20,72,145,.34); font-size:22px; cursor:pointer; }
  body.portal-nav-ready .portal-menu-button { display:grid; }
}

/* Shared overflow guards for Chinese, English and Vietnamese content. */
.main-layout > *, main > *, section > *, article > *,
.oc-row > *, .row > *, .mail-grid > *, .mail-field,
.detail-grid > *, .design-body, .library-tools > *, .form > *, .oc-form > * { min-width:0; }
.row strong,.row small,.oc-row strong,.oc-row span,.mail-panel,.mail-field strong,
.field label,.field div,.card,.section-card,.design-title-line h2 { overflow-wrap:anywhere; word-break:break-word; }
button,a,input,select,textarea { max-width:100%; }
.emb-upload input,.analyzer-upload input { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }
