/* Hubshape's palette and type for the web deck runtime, from the app's own tokens (design/hubshape-tokens.css).
   Every colour in the runtime comes from these. Marking yellow lights one thing and never carries text on light. */
:root {
  --ns-primary: #1b1b1d; --ns-primary-2: #26262a; --ns-primary-3: #111113; --ns-primary-rgb: 27,27,29; --ns-primary-3-rgb: 17,17,19;
  --ns-accent: #ffcf1a; --ns-accent-2: #ffcf1a; --ns-accent-deep: #7a5b00; --ns-accent-rgb: 255,207,26;
  --ns-paper: #f7f6f1; --ns-ink: #141416; --ns-muted: #6e6d74; --ns-line: #e4e2da;
  --ns-good: #2f7d4f; --ns-bad: #b3261e;
  --ns-sans: 'Red Hat Text', system-ui, sans-serif;
}

/* Type: Funnel Display for titles and figures, Red Hat Mono for labels */
.slide .ns-title, .slide h1, .slide h2, .slide h3, .slide .ns-stat b, .ns-cover .ns-kpi b, .ns-div .num, .slide .card.num span, .slide .st span {
  font-family: 'Funnel Display', 'Red Hat Text', system-ui, sans-serif !important; letter-spacing: -.02em; }
.slide .ns-title { font-weight: 700 !important; }
.slide .ns-kicker, .slide .ns-chip, .ns-div .ph, #ns-foot .ph, .slide .option em, .slide .ol-stats span {
  font-family: 'Red Hat Mono', ui-monospace, monospace !important; font-weight: 500; }
.slide .ns-kicker { color: var(--ns-accent-deep); }
.slide .ns-kicker::before { background: var(--ns-accent); }

/* Dark grounds: asphalt with the motif instead of the runtime's panels */
.ns-cover, .ns-div { background: #1b1b1d; }
.ns-cover .ns-art, .ns-cover .ns-scrim, .ns-div .ns-art, .ns-div .ns-scrim { display: none; }
.ol-texture { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.ol-texture .h-motif { position: absolute; inset: 0; width: 100%; height: 100%; }
/* On the cover and close the motif fades out behind the words, so it never fights the title */
.ns-cover .ol-texture .h-motif, .ol-close .ol-texture .h-motif { -webkit-mask-image: linear-gradient(100deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.35) 38%, #000 70%); mask-image: linear-gradient(100deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.35) 38%, #000 70%); }
.ol-rule { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: #ffcf1a; }
.slide.ol-light { isolation: isolate; }
.slide.ol-light > .ol-texture { z-index: -1; }
.slide.ol-light > .ol-texture .h-motif { opacity: .55; -webkit-mask-image: linear-gradient(200deg, #000 0%, transparent 34%); mask-image: linear-gradient(200deg, #000 0%, transparent 34%); }
.slide.ol-light > .ol-texture .ol-rule { top: 0; bottom: auto; height: 6px; background: #1b1b1d; }
.h-lit { animation: hLit 4s ease-in-out infinite; } @keyframes hLit { 50% { opacity: .55; } }
@media (prefers-reduced-motion: reduce) { .h-lit { animation: none; } }

/* Cover and openers: hubshape by Libra Europe */
.ol-brandrow { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 64px; }
.ol-lockup { display: flex; flex-direction: column; gap: 14px; }
.ol-lockup .wm { height: 64px; width: auto; }
.ol-by { display: flex; align-items: center; gap: 12px; font-family: 'Red Hat Mono', monospace !important; font-size: 18px; letter-spacing: .14em; text-transform: uppercase; color: rgba(247,246,241,.7); }
.ol-by img { height: 34px; }
.ns-div .ol-mini { position: absolute; right: calc(var(--ox, 0px) + 120px); top: 96px; height: 40px; opacity: .9; }
.ns-cover h1 span { color: var(--ns-accent); }
.ns-cover .ns-kpi.accent b { color: var(--ns-accent); }
.ns-start { background: #ffcf1a !important; color: #1b1b1d !important; }

/* Footer logo: keep the Libra Europe logo's own colours (the runtime would flatten it to one colour); the white version on dark slides */
#stage.ns-dark #ns-foot .logo-img { filter: none; }
#ns-foot .logo { -webkit-mask: none !important; mask: none !important; background: var(--ns-logo) right center / contain no-repeat !important; }
#stage.ns-dark #ns-foot .logo { background-image: var(--logo-light) !important; }

.ol-dwm { filter: none; }
/* Scrollbars: thin, a translucent mustard thumb, as in the app */
html, body, * { scrollbar-width: thin; scrollbar-color: rgba(122,91,0,.32) transparent; }
::-webkit-scrollbar { width: 8px; height: 8px; } ::-webkit-scrollbar-thumb { background: rgba(122,91,0,.32); border-radius: 8px; } ::-webkit-scrollbar-track { background: transparent; }