/* ── 메드노트 디자인 시스템 ("의료 저널") ─────────────────────────────────
   세리프 제목 + 정제된 본문, 오프화이트 바탕, 딥틸 악센트 하나.
   마지막에 로드되어 기존 시트를 덮는다. 새 컴포넌트는 mn- 접두. */
:root{
  --mn-bg:#F7F6F2;--mn-card:#FFFFFF;--mn-line:#E3E0D8;--mn-line-strong:#C9C5BA;
  --mn-ink:#1B1F24;--mn-ink-2:#4A5058;--mn-muted:#6B7178;
  --mn-accent:#0F6E63;--mn-accent-dark:#0B544C;--mn-tint:#E6F1EF;--mn-tint-2:#F0EEE8;--mn-ok:#1E8E3E;
  --mn-serif:'Noto Serif KR',Georgia,serif;--mn-sans:'IBM Plex Sans KR',system-ui,-apple-system,'Malgun Gothic',sans-serif;
  --mn-radius:14px;--mn-radius-s:10px;
}
html{background:var(--mn-bg)}
body,body.portal-site{margin:0;background:var(--mn-bg);color:var(--mn-ink);font-family:var(--mn-sans);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}
body.portal-site a{color:var(--mn-accent);text-decoration:none}
body.portal-site a:hover{color:var(--mn-accent-dark)}
.mobile-shell{max-width:1280px;margin:0 auto;padding:0}
.app-main{padding:0 20px 32px}
h1,h2,h3{margin:0;font-family:var(--mn-serif);font-weight:600;letter-spacing:-.3px;color:var(--mn-ink)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip-content{position:absolute;left:-9999px}.skip-content:focus{left:12px;top:12px;background:#fff;padding:8px;z-index:99}

/* 헤더 */
.mn-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;border-bottom:1px solid var(--mn-line);background:var(--mn-bg)}
.mn-brand{font-family:var(--mn-serif);font-size:22px;font-weight:700;color:var(--mn-ink)!important;letter-spacing:-.5px}
.mn-header-nav{display:none;gap:24px;font-size:15px;font-weight:500}
.mn-header-nav a{color:var(--mn-ink)!important}
.mn-header-nav a.is-current{color:var(--mn-accent)!important}
.mn-header-actions{display:flex;gap:4px;align-items:center}
.mn-icon-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:0;background:transparent;border-radius:var(--mn-radius-s);color:var(--mn-ink)!important;cursor:pointer;padding:0}
.mn-icon-btn:hover{background:var(--mn-tint-2)}
.mn-menu{position:relative}
.mn-menu summary{list-style:none;cursor:pointer}
.mn-menu summary::-webkit-details-marker{display:none}
.mn-menu nav{position:absolute;right:0;top:48px;z-index:50;min-width:200px;display:flex;flex-direction:column;background:var(--mn-card);border:1px solid var(--mn-line);border-radius:var(--mn-radius-s);box-shadow:0 8px 24px rgba(27,31,36,.12);padding:6px}
.mn-menu nav a{padding:12px 14px;color:var(--mn-ink)!important;border-radius:8px;font-size:15px}
.mn-menu nav a:hover{background:var(--mn-tint-2)}
.mn-header-search{display:none;gap:6px}
.mn-header-search input{width:220px;height:42px;padding:0 14px;font:inherit;font-size:14px;border:1.5px solid var(--mn-line-strong);border-radius:var(--mn-radius-s);background:var(--mn-card);color:var(--mn-ink)}
@media(min-width:900px){
  .mn-header{padding:18px 64px}
  .mn-header-nav,.mn-header-search{display:flex}
  .mn-header-actions{display:none}
}

/* 버튼 */
.mn-btn{height:52px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 20px;font:inherit;font-size:15px;font-weight:600;border-radius:12px;cursor:pointer;text-decoration:none}
.mn-btn-primary{color:#fff!important;background:var(--mn-accent);border:0}
.mn-btn-primary:hover{background:var(--mn-accent-dark)}
.mn-btn-outline{color:var(--mn-ink)!important;background:var(--mn-card);border:1.5px solid var(--mn-line-strong)}
.mn-btn-outline:hover{background:var(--mn-tint-2)}
.mn-btn-soft{height:44px;font-size:14px;font-weight:500;color:var(--mn-ink)!important;background:var(--mn-bg);border:1px solid var(--mn-line)}
.mn-btn-soft:hover{background:var(--mn-tint-2)}
.mn-chip{height:36px;display:inline-flex;align-items:center;padding:0 14px;font:inherit;font-size:13px;font-weight:500;color:var(--mn-ink);background:var(--mn-card);border:1px solid var(--mn-line-strong);border-radius:18px;cursor:pointer}
.mn-chip.is-on{color:#fff;background:var(--mn-accent);border-color:var(--mn-accent);font-weight:600}
.mn-tag{display:inline-block;font-size:12px;font-weight:500;padding:4px 9px;color:var(--mn-accent);background:var(--mn-tint);border-radius:6px}

/* 카드·섹션 */
.mn-card{background:var(--mn-card);border:1px solid var(--mn-line);border-radius:var(--mn-radius);padding:18px 20px}
.mn-section{display:flex;flex-direction:column;gap:12px}
.mn-section h2{font-size:19px}
.mn-section h3{font-family:var(--mn-sans);font-size:14px;font-weight:600;color:var(--mn-accent)}
.mn-section p{margin:0;line-height:1.7}
.mn-sub{color:var(--mn-ink-2);font-size:14px}
.mn-note{color:var(--mn-muted);font-size:13px;line-height:1.6}
.mn-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.mn-section-head a{font-size:13px;font-weight:500}
.mn-ad{height:100px;display:flex;align-items:center;justify-content:center;border:1px dashed var(--mn-line-strong);border-radius:var(--mn-radius-s);font-size:12px;color:var(--mn-muted)}
.ad-slot{margin:16px 0}
.ad-slot:empty{display:none}
.mn-link-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 16px;background:var(--mn-card);border:1px solid var(--mn-line);border-radius:12px;color:var(--mn-ink)!important}
.mn-link-row:hover{border-color:var(--mn-line-strong)}
.mn-link-row b{display:block;font-size:15px;font-weight:600}
.mn-link-row small{display:block;font-size:13px;color:var(--mn-ink-2)}
.mn-link-row i{font-style:normal;color:var(--mn-accent)}
.mn-list{display:flex;flex-direction:column;gap:10px}
.mn-breadcrumb{display:flex;flex-wrap:wrap;gap:6px;padding:14px 0 0;font-size:12px;color:var(--mn-muted)}
.mn-breadcrumb a{color:var(--mn-muted)!important}

/* 홈 */
.mn-home{display:flex;flex-direction:column;gap:28px;padding-top:12px}
.mn-hero{display:flex;flex-direction:column;gap:16px;padding:20px 0 4px}
.mn-hero h1{font-size:30px;line-height:1.3;font-weight:700;letter-spacing:-.5px}
.mn-hero p{margin:0;font-size:15px;color:var(--mn-ink-2)}
.mn-search{display:flex;gap:8px}
.mn-search input{flex:1;min-width:0;height:52px;padding:0 16px;font:inherit;font-size:16px;border:1.5px solid var(--mn-line-strong);border-radius:12px;background:var(--mn-card);color:var(--mn-ink)}
.mn-search input:focus{outline:2px solid var(--mn-accent);outline-offset:1px}
.mn-search button{height:52px;padding:0 20px;font:inherit;font-size:15px;font-weight:600;color:#fff;background:var(--mn-accent);border:0;border-radius:12px;cursor:pointer}
.mn-grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.mn-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.mn-dept{height:48px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:500;color:var(--mn-ink)!important;background:var(--mn-card);border:1px solid var(--mn-line);border-radius:var(--mn-radius-s);text-align:center;padding:0 6px}
.mn-dept:hover{border-color:var(--mn-accent)}
.mn-soft-link{height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;font-size:15px;font-weight:500;color:var(--mn-ink)!important;background:var(--mn-tint);border-radius:var(--mn-radius-s)}
.mn-soft-link span{color:var(--mn-accent)}
.mn-finder label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--mn-ink-2)}
.mn-finder select{height:46px;padding:0 12px;font:inherit;font-size:15px;border:1px solid var(--mn-line-strong);border-radius:var(--mn-radius-s);background:var(--mn-card);color:var(--mn-ink)}
.mn-guide{display:flex;flex-direction:column;gap:6px;padding:16px;background:var(--mn-card);border:1px solid var(--mn-line);border-radius:12px;color:var(--mn-ink)!important}
.mn-guide small{font-size:12px;font-weight:600;color:var(--mn-accent)}
.mn-guide b{font-size:16px;font-weight:600}
.mn-guide span{font-size:13px;color:var(--mn-ink-2)}
.mn-region-links{display:flex;flex-wrap:wrap;gap:8px}
.mn-region-links a{height:40px;display:inline-flex;align-items:center;padding:0 14px;font-size:14px;font-weight:500;color:var(--mn-ink)!important;background:var(--mn-card);border:1px solid var(--mn-line);border-radius:20px}
@media(min-width:900px){
  .app-main{padding:0 64px 48px}
  .mn-home{max-width:1152px;margin:0 auto}
  .mn-hero{padding:40px 0 12px;max-width:720px}
  .mn-hero h1{font-size:40px}
  .mn-grid-4{grid-template-columns:repeat(8,minmax(0,1fr))}
  .mn-home-2col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .mn-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
}

/* 목록 */
.mn-dir{display:flex;flex-direction:column;gap:16px;padding-top:4px}
.mn-dir-head{display:flex;flex-direction:column;gap:10px}
.mn-dir-head h1{font-size:26px;line-height:1.3;font-weight:700;letter-spacing:-.5px}
.mn-dir-head p{margin:0;font-size:14px;color:var(--mn-ink-2)}
.mn-dir-tools{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.mn-dir-tools [data-sort-status]{font-size:12px;color:var(--mn-muted)}
.mn-filter{display:flex;gap:8px}
.mn-filter input{flex:1;min-width:0;height:46px;padding:0 14px;font:inherit;font-size:15px;border:1.5px solid var(--mn-line-strong);border-radius:var(--mn-radius-s);background:var(--mn-card);color:var(--mn-ink)}
.mn-fc{display:flex;flex-direction:column;gap:8px;padding:16px;background:var(--mn-card);border:1px solid var(--mn-line);border-radius:var(--mn-radius)}
.mn-fc:hover{border-color:var(--mn-line-strong)}
.mn-fc-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.mn-fc h2{font-family:var(--mn-sans);font-size:17px;font-weight:600;letter-spacing:0}
.mn-fc h2 a{color:var(--mn-ink)!important}
.mn-fc-type{font-size:13px;color:var(--mn-ink-2)}
.mn-fc-dist{font-size:12px;font-weight:500;color:var(--mn-ink-2);white-space:nowrap}
.mn-fc-addr{margin:0;font-size:14px;color:var(--mn-ink-2)}
.mn-fc-line{margin:0;font-size:14px}
.mn-fc-tags{display:flex;gap:6px;flex-wrap:wrap}
.mn-fc-actions{display:flex;gap:8px;margin-top:4px}
.mn-fc-actions a{flex:1;height:44px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:500;border-radius:var(--mn-radius-s)}
.mn-fc-actions .go{color:#fff!important;background:var(--mn-accent)}
.mn-fc-actions .call{color:var(--mn-ink)!important;background:var(--mn-bg);border:1px solid var(--mn-line)}
.mn-empty{padding:32px 16px;text-align:center;color:var(--mn-ink-2);background:var(--mn-card);border:1px solid var(--mn-line);border-radius:var(--mn-radius)}
.mn-pager{display:flex;justify-content:center;gap:6px;padding:8px 0}
.mn-pager a,.mn-pager span{min-width:40px;height:40px;padding:0 12px;display:inline-flex;align-items:center;justify-content:center;font-size:14px;color:var(--mn-ink)!important;background:var(--mn-card);border:1px solid var(--mn-line);border-radius:var(--mn-radius-s)}
.mn-pager span{color:#fff!important;background:var(--mn-accent);border-color:var(--mn-accent);font-weight:600}
@media(min-width:900px){.mn-dir{max-width:860px;margin:0 auto}}

/* 상세 */
.mn-profile{display:flex;flex-direction:column;gap:12px;padding-top:0}
.mn-identity{display:flex;flex-direction:column;gap:10px;padding:12px 0 8px}
.mn-identity .kicker{font-size:13px;font-weight:500;color:var(--mn-accent)}
.mn-identity h1{font-size:28px;line-height:1.25;font-weight:700;letter-spacing:-.5px}
.mn-identity .addr{margin:0;font-size:14px;line-height:1.55;color:var(--mn-ink-2)}
.mn-status{display:flex;align-items:center;gap:8px;font-size:14px;flex-wrap:wrap}
.mn-status .dot{width:8px;height:8px;border-radius:50%;background:var(--mn-ok);flex:none}
.mn-status .dot.off{background:var(--mn-muted)}
.mn-status b{font-weight:600}
.mn-status span{color:var(--mn-ink-2)}
.mn-cta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:4px}
.mn-cta .mn-btn{padding:0 10px;font-size:15px}
.mn-closure{padding:12px 14px;border:1px solid #E5B4A6;background:#FBEEEA;border-radius:var(--mn-radius-s);font-size:14px;color:#7A2E1E}
.mn-hours{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;text-align:center}
.mn-hours div{display:flex;flex-direction:column;gap:6px;padding:10px 0;background:var(--mn-tint);border-radius:8px}
.mn-hours div.off{background:var(--mn-tint-2);color:var(--mn-muted)}
.mn-hours b{font-size:12px;font-weight:600}
.mn-hours span{font-size:11px;line-height:1.3}
.mn-kv{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 12px;font-size:14px}
.mn-kv dt{color:var(--mn-ink-2)}
.mn-kv dd{margin:0;font-weight:500}
.mn-map{height:220px;border-radius:var(--mn-radius-s);background:var(--mn-tint);z-index:0}
.mn-map-links{display:flex;gap:8px}
.mn-map-links .mn-btn{flex:1;padding:0 8px}
.mn-video{position:relative;width:100%;aspect-ratio:16/9;border-radius:var(--mn-radius-s);overflow:hidden;background:#0d1512}
.mn-video.is-short{aspect-ratio:9/16;max-width:300px;margin:0 auto}
.mn-video iframe,.mn-video .video-play{position:absolute;inset:0;width:100%;height:100%;border:0}
.mn-video .video-play{padding:0;cursor:pointer;background:none;display:block}
.mn-video .video-play img{width:100%;height:100%;object-fit:cover;display:block}
.mn-video .video-play-icon{position:absolute;top:50%;left:50%;width:56px;height:40px;transform:translate(-50%,-50%);border-radius:10px;background:rgba(255,255,255,.92)}
.mn-video .video-play-icon::after{content:"";position:absolute;top:50%;left:52%;transform:translate(-50%,-50%);border-style:solid;border-width:8px 0 8px 14px;border-color:transparent transparent transparent #1B1F24}
.mn-foot-note{display:flex;flex-direction:column;gap:6px;padding:20px 0 8px;border-top:1px solid var(--mn-line);font-size:12px;line-height:1.6;color:var(--mn-muted)}
.mn-foot-note a{color:var(--mn-ink-2)!important}
.mn-side{display:contents}
.mn-side-cta{display:none}
@media(min-width:900px){
  .mn-profile{max-width:1152px;margin:0 auto;display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:32px;padding-top:28px}
  .mn-profile>.mn-main{grid-column:1;display:flex;flex-direction:column;gap:16px}
  .mn-profile>.mn-side{grid-column:2;display:flex;flex-direction:column;gap:16px}
  .mn-identity h1{font-size:38px}
  .mn-cta{display:none}
  .mn-side-cta{display:flex}
  .mn-side .mn-cta{display:flex;flex-direction:column}
  .mn-side .mn-cta .mn-btn{height:52px;font-size:16px}
  .mn-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .mn-paras{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 28px}
  .mn-paras .wide{grid-column:span 2}
  .mn-nearby-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .mn-nearby-grid .mn-link-row{flex-direction:column;align-items:flex-start;gap:4px}
  .mn-nearby-grid .mn-link-row i{display:none}
  .mn-foot-note{grid-column:1/-1}
}

/* 푸터·하단 내비 */
.mn-footer{margin-top:24px;padding:24px 20px calc(28px + env(safe-area-inset-bottom,0px) + 56px);border-top:1px solid var(--mn-line);display:flex;flex-direction:column;gap:8px;font-size:12px;line-height:1.6;color:var(--mn-muted)}
.mn-footer nav{display:flex;flex-wrap:wrap;gap:14px;margin-top:4px}
.mn-footer nav a{color:var(--mn-ink-2)!important}
.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:repeat(4,1fr);background:var(--mn-card);border-top:1px solid var(--mn-line);padding-bottom:env(safe-area-inset-bottom,0px)}
.bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;height:56px;font-size:11px;font-weight:500;color:var(--mn-muted)!important}
.bottom-nav a.active{color:var(--mn-accent)!important}
@media(min-width:900px){
  .bottom-nav{display:none}
  .mn-footer{padding:24px 64px 32px;flex-direction:row;justify-content:space-between;align-items:flex-start;gap:32px}
  .mn-footer>div{display:flex;flex-direction:column;gap:6px}
}