/* ══════════════════════════════════════════════════════════════════
   올림픽파크365의원 — 브랜드 오버라이드 레이어
   원칙: 토스(TDS) 디자인 시스템 그대로 두고, adaptive 토큰만 병원 값으로 덮는다.
   vendor/*.css 원본 불변 · 이 파일을 마지막에 로드해 우선순위 확보.
   PDF 공식값: 강조 #1d5b9b · 포인트 #bf4848 · 본문 #383838 · 따뜻한 베이지 베이스.
   ══════════════════════════════════════════════════════════════════ */

/* ══ 라이트 고정 (버킷06) — OS 다크 무력화 ═══════════════════════════════
   vendor/style.css 의 @media(prefers-color-scheme:dark) 는 data-theme 와 무관하게
   OS 가 다크면 전 토큰을 덮는다. html 은 항상 data-theme="light" 이므로, 더 높은
   특정성 :root[data-theme=light] 로 vendor 라이트 토큰 전체를 재확정해 OS 다크에서도
   라이트로 못박는다. 이 블록은 아래 병원 오버라이드보다 먼저 와야 병원 블루가 이긴다. */
:root[data-theme="light"] {
  --ui-opacity50:rgba(0,23,51,0.02);--ui-opacity100:rgba(2,32,71,0.05);--ui-opacity200:rgba(0,27,55,0.1);--ui-opacity300:rgba(0,29,58,0.18);--ui-opacity400:rgba(0,25,54,0.31);--ui-opacity500:rgba(3,24,50,0.46);--ui-opacity600:rgba(0,19,43,0.58);--ui-opacity700:rgba(3,18,40,0.7);--ui-opacity800:rgba(0,12,30,0.8);--ui-opacity900:rgba(2,9,19,0.91);--ui-disabledBlue500:#c9e2ff;--ui-background:#ffffff;--ui-layeredBackground:#ffffff;--ui-floatBackground:#ffffff;--ui-dimmedBackground:rgba(0,0,0,0.2);--ui-hairlineBorder:#e5e8eb;--ui-greyBackground:#f2f4f6;--ui-pcScreenBg:#f6f7f9;--ui-grey50:#f9fafb;--ui-grey100:#f2f4f6;--ui-grey200:#e5e8eb;--ui-grey300:#d1d6db;--ui-grey400:#b0b8c1;--ui-grey500:#8b95a1;--ui-grey600:#6b7684;--ui-grey700:#4e5968;--ui-grey800:#333d4b;--ui-grey900:#191f28;--ui-greyOpacity50:rgba(0,23,51,0.02);--ui-greyOpacity100:rgba(2,32,71,0.05);--ui-greyOpacity200:rgba(0,27,55,0.1);--ui-greyOpacity300:rgba(0,29,58,0.18);--ui-greyOpacity400:rgba(0,25,54,0.31);--ui-greyOpacity500:rgba(3,24,50,0.46);--ui-greyOpacity600:rgba(0,19,43,0.58);--ui-greyOpacity700:rgba(3,18,40,0.7);--ui-greyOpacity800:rgba(0,12,30,0.8);--ui-greyOpacity900:rgba(2,9,19,0.91);--ui-blue50:#e8f3ff;--ui-blue100:#c9e2ff;--ui-blue200:#90c2ff;--ui-blue300:#64a8ff;--ui-blue400:#4593fc;--ui-blue500:#3182f6;--ui-blue600:#2272eb;--ui-blue700:#1b64da;--ui-blue800:#1957c2;--ui-blue900:#194aa6;--ui-red50:#ffeeee;--ui-red100:#ffd4d6;--ui-red200:#feafb4;--ui-red300:#fb8890;--ui-red400:#f66570;--ui-red500:#f04452;--ui-red600:#e42939;--ui-red700:#d22030;--ui-red800:#bc1b2a;--ui-red900:#a51926;--ui-orange50:#fff3e0;--ui-orange100:#ffe0b0;--ui-orange200:#ffcd80;--ui-orange300:#ffbd51;--ui-orange400:#ffa927;--ui-orange500:#fe9800;--ui-orange600:#fb8800;--ui-orange700:#f57800;--ui-orange800:#ed6700;--ui-orange900:#e45600;--ui-yellow50:#fff9e7;--ui-yellow100:#ffefbf;--ui-yellow200:#ffe69b;--ui-yellow300:#ffdd78;--ui-yellow400:#ffd158;--ui-yellow500:#ffc342;--ui-yellow600:#ffb331;--ui-yellow700:#faa131;--ui-yellow800:#ee8f11;--ui-yellow900:#dd7d02;--ui-green50:#f0faf6;--ui-green100:#aeefd5;--ui-green200:#76e4b8;--ui-green300:#3fd599;--ui-green400:#15c47e;--ui-green500:#03b26c;--ui-green600:#02a262;--ui-green700:#029359;--ui-green800:#028450;--ui-green900:#027648;--ui-teal50:#edf8f8;--ui-teal100:#bce9e9;--ui-teal200:#89d8d8;--ui-teal300:#58c7c7;--ui-teal400:#30b6b6;--ui-teal500:#18a5a5;--ui-teal600:#109595;--ui-teal700:#0c8585;--ui-teal800:#097575;--ui-teal900:#076565;--ui-purple50:#f9f0fc;--ui-purple100:#edccf8;--ui-purple200:#da9bef;--ui-purple300:#c770e4;--ui-purple400:#b44bd7;--ui-purple500:#a234c7;--ui-purple600:#9128b4;--ui-purple700:#8222a2;--ui-purple800:#73228e;--ui-purple900:#65237b;--ui-backgroundDimmed:rgba(0,0,0,0.2);--ui-backgroundLevelB01:#f2f4f6;--ui-backgroundLevel01:#ffffff;--ui-backgroundLevel02:#ffffff;--ui-cardBgGrey:rgba(0,23,51,0.02);--ui-cardBgWhite:#ffffff;--tHairlineBackground:repeat-x url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'><rect fill='rgba(0, 0, 33, 0.07)' x='0' y='0' width='1' height='0.5'/></svg>");--tGradientToTop:linear-gradient(to top, #ffffff, rgba(255,255,255,0));--tGradientToBottom:linear-gradient(to bottom, #ffffff, rgba(255,255,255,0));--tGradientToRight:linear-gradient(to right, #ffffff, rgba(255,255,255,0));--tGradientToLeft:linear-gradient(to left, #ffffff, rgba(255,255,255,0));--tLayeredGradientToTop:linear-gradient(to top, #ffffff, rgba(255,255,255,0));--tLayeredGradientToBottom:linear-gradient(to bottom, #ffffff, rgba(255,255,255,0));--tRadioIndicatorBackgroundColor:#ffffff;--tToastBackground:rgba(25,31,40,0.54);--tDarkFillButtonBackground:#4e5968;--tPrimaryWeakButtonBackground:#e8f3ff;--tDangerWeakButtonBackground:#ffeeee;--tDarkWeakButtonBackground:#f2f4f6;--tLightWeakButtonBackground:rgba(222,222,255,0.19);--tButtonPressedAfterBackground:transparent;--tPrimaryWeakButtonPressedBackground:rgba(49,130,246,0.26);--tDangerWeakButtonPressedBackground:rgba(244,67,54,0.26);--tDarkWeakButtonPressedBackground:rgba(78,89,104,0.26);--tLightWeakButtonPressedBackground:rgba(255,255,255,0.26);--tBlueBadgeColor:#1b64da;--tBlueBadgeBackground:rgba(49,130,246,0.16);--tTealBadgeColor:#0c8585;--tTealBadgeBackground:rgba(0,129,138,0.16);--tGreenBadgeColor:#029359;--tGreenBadgeBackground:rgba(2,162,98,0.16);--tRedBadgeColor:#d22030;--tRedBadgeBackground:rgba(244,67,54,0.16);--tYellowBadgeColor:#dd7d02;--tYellowBadgeBackground:rgba(255,179,49,0.16);--tElephantBadgeColor:#4e5968;--tElephantBadgeBackground:rgba(78,89,104,0.16);--tSwiperBulletBackground:rgba(232,232,253,0.36);--tListRowDisabledBackground:rgba(253,253,255,0.75);
}

/* 브랜드 램프(강조·포인트·본문)는 /brand-tokens.css 가 host 별로 생성한다.
   이 파일 뒤에 로드되어 같은 특정성 + 나중 순서로 이긴다.
   ⚠️ 여기에 브랜드 색을 다시 넣지 말 것 — 테넌트마다 달라야 하는 값이다. */

/* 다크 토큰 제거됨 (버킷06 라이트 고정) — 위 라이트락이 OS 다크까지 덮는다. */

/* 본문 폰트 — Pretendard Variable(자체 호스팅). 폴백은 시스템 폰트 스택. */
html body {
  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo",
    system-ui, Roboto, "Noto Sans KR", sans-serif;
}

/* 영문·숫자 제목 라인은 Space Grotesk 결(브랜드 로고·영문 이빗브로우에 클래스로 부여) */
.brand-eng {
  font-family: "Space Grotesk", "Pretendard Variable", sans-serif;
  letter-spacing: 0.01em;
}


/* ── 라운드 톤 — 병원/의료 느낌으로 덜 둥글게(스타트업 톤 완화) ─────────
 * 벤더 뒤에 로드되므로 !important로 주요 표면만 조정. 값은 조절 여지 있음. */
/* 히어로 이미지 */
.hb-temvy4 { border-radius: 8px !important; }
/* 카드 썸네일/이미지 래퍼(최근·큐레이션·시리즈·아티클) */
.hb-15b6hr, .hb-bega0q, .hb-1ebbiu, .recent-m-thumb,
.hb-1xu5vr, .hb-uviaw4 { border-radius: 6px !important; }
/* 시리즈·카테고리·추천 카드 컨테이너 */
.hb-1o8axt, .hb-f6wphb, .hb-1sbv5i { border-radius: 8px !important; }
/* 사진영역(카드 안쪽) — 0으로 둬 사진↔패널이 만나는 seam이 각지게 딱 맞닿게 한다.
   사진 바깥 모서리는 래퍼(overflow:hidden 8px)가 알아서 라운드시킴. */
.hb-1721gu, .hb-1hk0n3, .hb-d1lytl { border-radius: 0 !important; }
/* 커버 다크 패널도 seam 각지게 — 패널 자체 radius(0 0 16 16)가 가로 커버(이미지 좌·패널 우)
   에선 이음새 쪽 아래 모서리를 둥글려 노치를 만든다. 바깥 카드(overflow:hidden)가 바깥
   모서리를 처리하므로 패널 radius는 0이어야 한다. e78dsrh5=데스크톱 패널, e8ur3eh3=모바일 패널. */
.e78dsrh5, .e8ur3eh3 { border-radius: 0 !important; }
/* 칩·필터·버튼(풀 pill → 살짝 각지게) */
.olpark-chip, .recent-m-more, .olpark-cta-btn { border-radius: 8px !important; }
/* 큐레이션/기타 카드 */
.hb-19xl5k, .hb-7o25g9, .hb-4avlhl { border-radius: 8px !important; }
/* 커버 카드(카테고리·코너 상세 상단) — 토스식: 바깥 4모서리 라운드, 가운데 seam 평평.
   외곽 카드(overflow:hidden)에만 라운드를 주면 이미지·패널이 클립돼 바깥 모서리만 둥글고
   둘이 만나는 seam은 평평해진다. 이미지 래퍼는 0으로 둬 seam에 라운드가 안 생기게.
   커버 섹션(hb-1ei5qw) 안으로 스코프 → 추천 카드(공유 클래스)는 영향 없음. */
.hb-1ei5qw .hb-f6wphb,
.hb-1ei5qw .hb-1o8axt {
  border-radius: 16px !important;
}
.hb-1ei5qw .hb-d1lytl,
.hb-1ei5qw .hb-1721gu {
  border-radius: 0 !important;
}

/* ── 한글 어절 단위 줄바꿈 ─────────────────────────────────────────────
 * CJK는 word-break 기본값/break-word에서 글자 사이를 끊어("신/호") 어색하다.
 * 제목·부제류에 keep-all을 적용해 공백(어절) 단위로만 줄바꿈한다.
 * 벤더 CSS 뒤에 로드되므로 동일 특정성으로 덮어쓴다. */
.hb-181kgj, .hb-c69b5j,                 /* 섹션 제목(데스크톱/모바일) */
.hb-1brcc5, .hb-cmvwnf,                /* 섹션 부제 */
.hb-1di4nv, .hb-nqt6t4,                /* 지금 많이 보는(Trending) 제목 */
.hb-1iz46c, .hb-1gpgxk,                 /* 큐레이션 데스크톱 제목/부제 */
.hb-1gsrf1, .hb-ux20h9,               /* 큐레이션 모바일 제목/부제 */
.ei1m07y1, .recent-m-title,               /* 최근 발행 카드 제목 */
.hb-35awit, .tfHeroTitle, .tfHeroSubtitle, /* 아카이브(Original) 제목 */
.hb-zallzp, .hb-4ii1ch,                /* 이 주의 이야기(Hero) 제목 */
.hb-cl1sm7, .hb-tlqzmq {               /* 이 주의 이야기 부제 */
  word-break: keep-all;
}
