@font-face { font-family: 'Meridian Sora'; src: url('/assets/brand/fonts/Sora.ttf') format('truetype'); font-weight: 100 800; font-display: block; }
.meridian-brand { --brand-ink: #111; --brand-icon-size: 36px; --brand-type-size: 24px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; color: var(--brand-ink); text-decoration: none; flex-shrink: 0; }
[data-theme="dark"] .meridian-brand { --brand-ink: #fff; }
.meridian-brand .meridian-symbol { display: block; width: var(--brand-icon-size); height: var(--brand-icon-size); flex-shrink: 0; object-fit: contain; }
.meridian-brand .meridian-wordmark { display: inline-block; margin: 0; font-family: 'Meridian Sora', sans-serif; font-size: var(--brand-type-size); font-weight: 600; letter-spacing: -.04em; line-height: 1; white-space: nowrap; color: var(--brand-ink); }
.meridian-brand[data-brand-color="gradient"] .meridian-wordmark { color: transparent; background: linear-gradient(90deg,#0968c6,#1689df 50%,#44b4ed); background-clip: text; -webkit-background-clip: text; }
.meridian-brand[data-brand-color="mono"] .meridian-symbol { filter: brightness(0); }
[data-theme="dark"] .meridian-brand[data-brand-color="mono"] .meridian-symbol { filter: brightness(0) invert(1); }
.meridian-brand[data-brand-animate="once"]:not([data-brand-ready]) > * { visibility: hidden; }
.header .logo .meridian-brand { --brand-icon-size: 28px; --brand-type-size: 26px; gap: 7px; }
/* 헤더 로고 영상이 붙기 전(playback.js 가 manifest 를 받아 --brand-media-ratio 를 인라인 style 로 달기 전)에도 최종 크기로 자리를 잡는다. 빈 로고 너비 0 이면 휴대폰 햄버거·데스크톱 메뉴가 로고 자리로 밀렸다가 원위치했다(원장 261019). 비율·높이는 video/manifest.json layouts.header(588×112, icon 28·font 26)와 일치 */
.header .logo .meridian-brand[data-brand-animate="once"]:not([style]) { display: block; aspect-ratio: 588 / 112; height: calc(var(--brand-type-size) * 28 / 26); }
.meridian-brand[data-brand-media] { display: block; max-width: 100%; aspect-ratio: var(--brand-media-ratio); height: calc(var(--brand-type-size) * var(--brand-media-em)); width: auto; }
.meridian-brand-media { display: block; width: 100%; height: 100%; object-fit: contain; }
.meridian-brand[data-brand-media-theme="light"] .meridian-brand-media { mix-blend-mode: multiply; }
.meridian-brand[data-brand-media-theme="dark"] .meridian-brand-media { mix-blend-mode: screen; }
/* 헤더 로고 너비는 비율로만 정한다. max-width:100% 이면 Safari 가 .logo 너비(뒤로가기 복원 때 0)에 묶어 로고가 줄거나 아래로 밀린다(261010 실측). */
.header .logo .meridian-brand[data-brand-media] { max-width: none; }
.login-logo-text, .logo-name, .workspace-brand-title { font-family: 'Meridian Sora', sans-serif !important; font-weight: 600 !important; letter-spacing: -.04em !important; }
@media (max-width: 640px) { .header .logo .meridian-brand { --brand-icon-size: 26px; --brand-type-size: 24px; } }

.meridian-brand[data-brand-transparent] .meridian-brand-media { mix-blend-mode: normal; }