/* ============================================================
   morning.css - 모닝 리포트 컴포넌트 스타일 (단일 출처)
   ------------------------------------------------------------
   네임스페이스: 컴포넌트 셀렉터는 .mr 컨테이너 하위로 스코프됨
     (attachMorning(rootEl)이 rootEl에 'mr' 클래스 부여)
     -> 이브닝(index.html)과 클래스명이 겹쳐도 격리됨 (.mkt-chg 등)
   모달(.modal-*/.glo-*/.dd-*)은 body 직속이라 전역 유지 (고유명, 충돌 없음)
   ------------------------------------------------------------
   · morning.html·index.html(모닝 팝업) 둘 다 <link>로 가져온다.
   · 호스트(:root)가 디자인 토큰을 제공한다:
       공통  --bg --border --border-h --text --muted --live --live-bg
             --up --down --err --mono --serif --bv-mid --gold --gold-bg
             --gold-bd --theme-ink --theme-bd
       모닝  --morning-accent --morning-bg --morning-bd
   · 모닝/이브닝 구조 공유 시 공통 토큰은 seam-core.css로 추출 예정.
   · z-index: .modal-ov는 300 (모닝 팝업 오버레이 200 위로).
   ============================================================ */

.mr /* 미리보기 카드 */
.preview{border:1px solid var(--morning-bd);background:var(--morning-bg);border-radius:11px;padding:17px 18px;margin-bottom:24px}
.mr .preview .cardtitle{font-size:10px;letter-spacing:2.5px;color:var(--morning-accent);text-transform:uppercase;margin-bottom:9px}
.mr .preview .pv{font-size:13.5px;line-height:1.62;color:var(--text)}
.mr .preview .pv.r{color:var(--bv-mid);margin-top:5px}
.mr /* 좌열 */
.col-left{margin-bottom:30px}
.mr .col-left .ltitle{font-size:11px;letter-spacing:2px;color:var(--muted);text-transform:uppercase;margin-bottom:14px}
.mr .para{margin-bottom:16px}
.mr .para h4{font-family:var(--serif);font-style:italic;font-size:18px;font-weight:600;margin-bottom:6px;color:var(--text)}
.mr .para p{font-size:13.5px;line-height:1.66;color:var(--bv-mid)}
.mr /* 우열 블록 */
.section-label{font-size:11px;letter-spacing:2px;color:var(--muted);text-transform:uppercase;margin:26px 0 12px}
.mr .block{border:1px solid var(--border);border-radius:10px;padding:15px 16px;margin-bottom:13px}
.mr .block .bhead{font-size:12px;letter-spacing:1px;color:var(--morning-accent);margin-bottom:9px;font-weight:500}
.mr .block .ph{font-size:11px;color:var(--muted);font-style:italic}
.mr /* 등락색 (한국 컨벤션) */
.up{color:var(--up)}.mr .down{color:var(--down)}.mr .muted{color:var(--muted)}.mr .gold{color:var(--gold)}
.mr /* [A] us_market */
.mkt-group{margin-bottom:13px}
.mr .mkt-group:last-child{margin-bottom:0}
.mr .mkt-gtitle{font-size:10px;letter-spacing:1.5px;color:var(--muted);text-transform:uppercase;margin-bottom:6px}
.mr .mkt-row{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:3.5px 0;font-size:13px}
.mr .mkt-label{color:var(--text);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mr .mkt-val{color:var(--bv-mid);text-align:right;min-width:78px;font-variant-numeric:tabular-nums}
.mr .mkt-chg{text-align:right;min-width:82px;font-variant-numeric:tabular-nums;font-size:12.5px}
.mr .theme-row{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}
.mr .theme-chip{border:1px solid var(--border);border-radius:6px;padding:5px 9px;font-size:12px;display:inline-flex;align-items:center;gap:7px;cursor:pointer;transition:border-color .15s}
.mr .theme-chip:hover{border-color:var(--border-h)}
.mr .theme-chip .tn{color:var(--text)}
.mr .theme-chip .tc{font-variant-numeric:tabular-nums;font-size:11.5px}
.mr /* [D] news 클러스터 */
.nws{border-top:1px solid var(--border);padding:13px 0}
.mr .nws:first-child{border-top:none;padding-top:2px}
.mr .nws-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:7px}
.mr .nws-hl{font-size:13.5px;line-height:1.5;color:var(--text);font-weight:500;flex:1}
.mr .nws-badge{flex-shrink:0;font-size:10px;letter-spacing:.5px;padding:3px 7px;border-radius:5px;white-space:nowrap;margin-top:1px}
.mr .nws-badge.high{background:rgba(239,68,68,0.12);color:#f08a8a;border:1px solid rgba(239,68,68,0.3)}
.mr .nws-badge.mid{background:rgba(216,178,94,0.1);color:var(--gold);border:1px solid var(--gold-bd)}
.mr .nws-badge.low{background:rgba(255,255,255,0.04);color:var(--muted);border:1px solid var(--border)}
.mr .nws-rel{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:7px}
.mr .nws-rel .rl{font-size:10px;letter-spacing:1.5px;color:var(--muted);margin-right:3px;align-self:center}
.mr .nws-rel .rt{font-size:11.5px;color:var(--bv-mid);background:rgba(255,255,255,0.04);border:1px solid var(--border);border-radius:5px;padding:2.5px 7px}
.mr .nws-sum{font-size:12.5px;line-height:1.6;color:var(--bv-mid);margin-bottom:8px}
.mr .nws-src{font-size:11px;color:var(--muted)}
.mr .nws-src .sl{letter-spacing:1.5px;margin-right:6px}
.mr .nws-src a{color:var(--bv-mid);text-decoration:none;border-bottom:1px solid var(--border-h);padding-bottom:1px}
.mr .nws-src a:hover{color:var(--text)}
.mr .nws-src a+a{margin-left:9px}
.mr /* 인라인 용어 마크업 */
.term{border-bottom:1px dotted var(--muted);cursor:help}
.mr .stk-name.nav{cursor:pointer;border-bottom:1px dotted var(--theme-bd)}
.mr .stk-name.nav:hover{color:var(--morning-accent)}
.mr .dd-stk .dn[data-code]{cursor:pointer;border-bottom:1px dotted var(--theme-bd)}
.mr .disc-row.click{cursor:pointer}
.mr .disc-row.click:hover .disc-name{color:var(--morning-accent)}
.mr /* 종목 리스트 (surge_radar · bigcap_swing 공용) */
.stk-row{display:flex;align-items:baseline;gap:9px;padding:4px 0;font-size:13px}
.mr .stk-row+.stk-row{border-top:1px solid var(--border)}
.mr .stk-name{color:var(--text);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mr .stk-tag{font-size:10px;letter-spacing:.5px;color:var(--muted);border:1px solid var(--border);border-radius:4px;padding:1.5px 6px;flex-shrink:0}
.mr .stk-ratio{color:var(--bv-mid);font-variant-numeric:tabular-nums;min-width:54px;text-align:right;font-size:12px}
.mr .stk-ret{font-variant-numeric:tabular-nums;min-width:64px;text-align:right;font-size:12.5px}
.mr .blk-body{font-size:12.5px;line-height:1.62;color:var(--bv-mid);margin-top:10px;padding-top:10px;border-top:1px solid var(--border)}
.mr .blk-note{font-size:11.5px;line-height:1.55;color:var(--muted);margin-top:9px;font-style:italic}
.mr /* [B] disclosures */
.disc-row{padding:9px 0;border-top:1px solid var(--border)}
.mr .disc-row:first-child{border-top:none;padding-top:2px}
.mr .disc-top{display:flex;align-items:baseline;gap:8px;margin-bottom:4px}
.mr .disc-name{color:var(--text);font-size:13px;font-weight:500}
.mr .disc-type{color:var(--muted);font-size:11px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mr .disc-sum{font-size:12px;line-height:1.5;color:var(--bv-mid)}
.mr /* [C] events */
.evt-row{display:flex;gap:10px;padding:8px 0;border-top:1px solid var(--border)}
.mr .evt-row:first-child{border-top:none;padding-top:2px}
.mr .evt-doff{flex-shrink:0;font-size:10px;letter-spacing:.5px;padding:3px 7px;border-radius:5px;height:fit-content;background:var(--morning-bg);color:var(--morning-accent);border:1px solid var(--morning-bd)}
.mr .evt-doff.soon{background:rgba(255,255,255,0.04);color:var(--muted);border-color:var(--border)}
.mr .evt-main{flex:1}
.mr .evt-name{font-size:13px;color:var(--text);font-weight:500;margin-bottom:3px}
.mr .evt-sum{font-size:12px;line-height:1.55;color:var(--bv-mid)}
.mr /* [E] observe */
.obs-item{padding:8px 0;border-top:1px solid var(--border)}
.mr .obs-item:first-child{border-top:none;padding-top:2px}
.mr .obs-label{font-size:12.5px;color:var(--morning-accent);font-weight:500;margin-bottom:3px}
.mr .obs-body{font-size:12px;line-height:1.58;color:var(--bv-mid)}
.mr /* 유동성 전망 (모닝 핵심) */
.lo-regime{display:flex;align-items:baseline;gap:10px;background:var(--morning-bg);border:1px solid var(--morning-bd);border-radius:8px;padding:11px 13px;margin-bottom:11px}
.mr .lo-regime .rgm-l{font-size:10px;letter-spacing:1.5px;color:var(--muted);text-transform:uppercase}
.mr .lo-regime .rgm-v{font-size:15px;color:var(--morning-accent);font-weight:600;flex:1}
.mr .lo-regime .rgm-c{font-size:11px;color:var(--muted)}
.mr .lo-flow{font-size:12.5px;line-height:1.6;color:var(--bv-mid);margin-bottom:12px}
.mr .lo-sec{display:flex;gap:9px;padding:6px 0;border-top:1px solid var(--border);font-size:12.5px}
.mr .lo-sec-name{color:var(--text);min-width:90px;flex-shrink:0}
.mr .lo-sec-dir{font-size:11px;min-width:46px;flex-shrink:0}
.mr .lo-sec-why{color:var(--bv-mid);font-size:11.5px;line-height:1.5}
/* 팝업 (용어 · 테마 드릴다운) — body 직속, 전역(.mr 스코프 금지) */
.modal-ov{position:fixed;inset:0;background:rgba(0,0,0,0.6);display:flex;align-items:center;justify-content:center;padding:20px;z-index:300;opacity:0;pointer-events:none;transition:opacity .15s}
.modal-ov.show{opacity:1;pointer-events:auto}
.modal{background:#15140f;border:1px solid var(--morning-bd);border-radius:12px;max-width:440px;width:100%;max-height:80vh;overflow-y:auto;padding:18px 20px}
.modal-x{float:right;color:var(--muted);cursor:pointer;font-size:18px;line-height:1;border:none;background:none}
.modal-x:hover{color:var(--text)}
.modal-tt{font-size:15px;color:var(--morning-accent);font-weight:600;margin-bottom:10px;padding-right:20px}
.glo-def{font-size:13px;line-height:1.66;color:var(--text)}
.dd-desc{font-size:12px;line-height:1.55;color:var(--bv-mid);margin-bottom:12px;padding-bottom:11px;border-bottom:1px solid var(--border)}
.dd-stk{display:flex;align-items:baseline;gap:9px;padding:6px 0;border-top:1px solid var(--border);font-size:13px}
.dd-stk:first-of-type{border-top:none}
.dd-stk .dn{color:var(--text);flex:1}
.dd-stk .dr{font-variant-numeric:tabular-nums;min-width:62px;text-align:right;font-size:12.5px}
.dd-stk .dt{color:var(--muted);font-variant-numeric:tabular-nums;min-width:64px;text-align:right;font-size:11px}
.dd-empty{font-size:12px;color:var(--muted);font-style:italic}
.dd-hint{font-size:10.5px;color:var(--muted);margin-bottom:8px;letter-spacing:.02em}
.dd-sortbar{display:flex;gap:6px;margin-bottom:10px}
.dd-sbtn{font-size:11px;padding:4px 9px;border:1px solid var(--border);background:transparent;color:var(--muted);border-radius:3px;cursor:pointer;white-space:nowrap}
.dd-sbtn:hover{border-color:var(--border-h);color:var(--text)}
.dd-sbtn.on{border-color:var(--morning-bd);color:var(--morning-accent);background:var(--morning-bg)}
.dd-rk{color:var(--muted);font-size:11px;margin-right:8px}
.dd-stk{cursor:pointer}
.dd-stk:hover{background:rgba(255,255,255,0.03)}
