/* LearnNDev brand: the mark as the page logo, a small footer mark, and the watermark on shared chats */
:root { --mkf: brightness(1.4) saturate(1.2); }
:root[data-theme="paper"] { --mkf: none; }
.lmark { display: block; height: 24px; width: auto; filter: var(--mkf); transition: transform .4s cubic-bezier(.22, 1, .36, 1); }
.logo, .brand { align-items: center; } .logo:hover .lmark, .brand:hover .lmark { transform: scale(1.07); }
.fmark { height: 15px; width: auto; vertical-align: -2px; margin: 0 2px 0 4px; filter: var(--mkf); opacity: .9; }
.foot .fbrand { display: inline-flex; align-items: center; gap: 8px; }
/* the watermark behind a shared chat: faint, never in the way, and removed with the badge on the Pro plan */
.wm { position: fixed; inset: 0; z-index: 0; display: grid; place-items: center; pointer-events: none; overflow: hidden; }
.wm[hidden] { display: none; }
.wm::before { content: ""; width: min(64vw, 540px); aspect-ratio: 360 / 223; background: var(--accent, #8b7cff); opacity: .06; -webkit-mask: url(/logo/mark.webp) center / contain no-repeat; mask: url(/logo/mark.webp) center / contain no-repeat; animation: wmFloat 9s ease-in-out infinite; }
@keyframes wmFloat { 50% { transform: translateY(-10px) scale(1.02); } }
.cshell, .orbstage { position: relative; z-index: 1; }
.cbadge { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.cbadge .lmark { height: 13px; }
@media (prefers-reduced-motion: reduce) { .wm::before { animation: none; } }

/* the flat Professional theme shares the light theme's adjustments */
:root[data-theme="pro"] { --mkf: none; }

/* the same light-mode adjustments for the amber and teal light themes */
/* the flat Professional theme shares the light theme's adjustments */
:root[data-theme="ember-light"] { --mkf: none; }
/* the flat Professional theme shares the light theme's adjustments */
:root[data-theme="tide-light"] { --mkf: none; }

/* the LND Aura logo: the horizontal lockup in the bars, the full one (with its line) in the footer. The grey letters are lifted on the dark themes. */
:root { --lgf: none; }
:root[data-theme="aurora"], :root[data-theme="ember"], :root[data-theme="tide"], :root[data-theme="pro-dark"] { --lgf: brightness(2.35) saturate(.95); }
.lockup { display: block; height: 56px; width: auto; max-width: 100%; filter: var(--lgf); transition: transform .4s cubic-bezier(.22, 1, .36, 1); }
.logo:hover .lockup { transform: scale(1.03); }
.nav .logo { margin-left: 0; }
.foot-lockup { height: 80px; margin-bottom: 8px; }
.fbrand { display: grid; gap: 4px; justify-items: start; }
@media (max-width: 680px) { .lockup { height: 46px; } }
