/* * Navigation Shell enhancement only. The compact symbol remains the default; * the complete platform wordmark is enabled when the header has enough room. */ @media (min-width: 1501px) { body.cspns-active .cspns-toolbar > .cspns-brand { flex: 0 0 156px; width: 156px; max-width: 156px; height: 48px; margin-right: 8px; border-radius: 0; overflow: visible; } body.cspns-active .cspns-toolbar > .cspns-brand > img { content: url('../img/cyberspace-portal-wordmark.png'); width: 156px; height: 48px; max-width: 156px; max-height: 48px; object-fit: contain; object-position: left center; } } @media (forced-colors: active) and (min-width: 1501px) { body.cspns-active .cspns-toolbar > .cspns-brand > img { forced-color-adjust: none; } } /* * The tooltip is attached to , not to the scrollable context rail. This * keeps the collapsed rail at its fixed width and prevents overflow clipping. */ .csp-navigation-ux-tooltip { position: fixed; z-index: 100000; top: 0; left: 0; max-width: min(260px, calc(100vw - 24px)); padding: 8px 11px; border: 1px solid rgba(31, 25, 53, .14); border-radius: 8px; background: #241a36; box-shadow: 0 8px 24px rgba(31, 25, 53, .2); color: #fff; font: 600 12px/1.35 system-ui, -apple-system, "Segoe UI", sans-serif; letter-spacing: 0; white-space: nowrap; pointer-events: none; opacity: 0; transform: translateY(-50%) translateX(-4px); transition: opacity 120ms ease, transform 120ms ease; } .csp-navigation-ux-tooltip::before { position: absolute; top: 50%; right: 100%; width: 8px; height: 8px; border-bottom: 1px solid rgba(31, 25, 53, .14); border-left: 1px solid rgba(31, 25, 53, .14); background: #241a36; content: ""; transform: translate(4px, -50%) rotate(45deg); } .csp-navigation-ux-tooltip.is-visible { opacity: 1; transform: translateY(-50%) translateX(0); } @media (max-width: 1023px) { .csp-navigation-ux-tooltip { display: none !important; } } @media (prefers-reduced-motion: reduce) { .csp-navigation-ux-tooltip { transition: none; } } @media (forced-colors: active) { .csp-navigation-ux-tooltip { border: 1px solid CanvasText; background: Canvas; color: CanvasText; forced-color-adjust: auto; } }