/* 경쟁사 모니터 Beta(/summary/) 스타일 */
:root{
  --page:#F2F4F7; --surface:#FFFFFF; --line:#E3E7EE; --grid:#EEF1F6; --ink:#121B2B; --ink-2:#4A5568; --muted:#6B778A; --faint:#9AA5B5;
  --navy:#13233D; --navy-2:#22365A; --navy-ink:#C9D4E5; --accent:#2B5CA8; --up:#D3433A; --down:#2467C9; --tag:#EEF1F6;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--page);color:var(--ink);font-family:'Pretendard','Noto Sans KR','Apple SD Gothic Neo','Malgun Gothic',sans-serif;font-size:16px;line-height:1.5;word-break:keep-all}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
.up{color:var(--up)}.dn{color:var(--down)}.mu{color:var(--muted)}.dim{color:var(--faint)}

/* 헤더 */
header{background:var(--navy);color:#fff;padding:14px 28px}
.hd{max-width:1280px;margin:0 auto;display:flex;align-items:center;gap:12px 24px;flex-wrap:wrap}
.brand{font-size:21px;font-weight:700;letter-spacing:-.02em;white-space:nowrap}
.nav{display:flex;gap:2px;background:var(--navy-2);border-radius:999px;padding:4px;margin:0 auto}
.nav a{padding:8px 18px;border-radius:999px;color:var(--navy-ink);font-size:15px;white-space:nowrap}
.nav a[aria-current="page"]{background:#fff;color:var(--navy);font-weight:700}
.nav .ni,.nav .ns{display:none}
.hd-r{display:flex;gap:8px;align-items:center}
.sw{display:flex;background:var(--navy-2);border-radius:10px;padding:3px;gap:2px}
.sw a,.sw button{border:0;background:none;padding:7px 12px;border-radius:8px;color:var(--navy-ink);font-size:14px;white-space:nowrap}
.sw [aria-current="true"]{background:#fff;color:var(--navy);font-weight:700}
.view a{padding:7px 14px}

main{max-width:1280px;margin:0 auto;padding:20px 28px 56px;display:flex;flex-direction:column;gap:18px}
.fresh{font-size:14px;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px 16px}
.fresh i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:1px}
.ph{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px}
.ph h1{margin:0;font-size:28px;letter-spacing:-.02em}
.ph .m{font-size:14px;color:var(--muted)}
.ph .r{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.seg{display:inline-flex;background:#E3E8EF;border-radius:8px;padding:2px;gap:2px}
.seg button{border:0;background:none;padding:6px 13px;border-radius:6px;font-size:14px;color:var(--ink-2)}
.seg button[aria-pressed="true"]{background:#fff;font-weight:700;color:var(--ink)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px 22px;min-width:0}
.card h2{margin:0 0 14px;font-size:19px;letter-spacing:-.01em}
.card h2 small{font-weight:400;font-size:14px;color:var(--muted);margin-left:8px}
.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.col{display:flex;flex-direction:column;gap:18px;min-width:0}
.more{font-size:14.5px;color:var(--accent)}
.right{text-align:right}
.note{font-size:13px;color:var(--faint);margin:10px 0 0}
.empty{color:var(--faint);padding:24px 0;text-align:center}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none}
.co{display:inline-flex;align-items:center;gap:8px;font-weight:600}
.tag{display:inline-block;font-size:12.5px;background:var(--tag);border-radius:999px;padding:2px 9px;color:var(--ink-2);white-space:nowrap}
.est{font-size:11px;font-weight:700;color:#7A5A12;background:#F3EAD7;border-radius:3px;padding:1px 5px;margin-left:6px}
.new{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--up);margin-left:8px;vertical-align:1px}
svg text{font-family:inherit}

/* 요약: 인사이트 카드 */
.ic{display:flex;flex-direction:column;gap:10px}
.ic .meta{font-size:14px;color:var(--muted);display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.ic .meta .more{font-size:14px;white-space:nowrap}
.ic .big{display:flex;align-items:baseline;gap:6px 14px;flex-wrap:wrap}
.ic .big b{font-size:38px;letter-spacing:-.02em;line-height:1.1}
.ic .big span{font-size:20px;font-weight:700;line-height:1.35}
.ic .sub{font-size:15px;color:var(--ink-2)}
a.card:hover{border-color:#C9D2DF}

/* 상세: 인사이트 카드 */
.dc{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;align-items:center}
.dc .n{font-size:26px;font-weight:700;letter-spacing:-.02em}
.dc .meta{font-size:13px;color:var(--muted)}
.dc .h{font-size:17px;font-weight:700;margin:2px 0}
.dc .s{font-size:14px;color:var(--ink-2)}
.ai{background:var(--navy);color:#fff;border:0}
.ai .meta{color:#B9A8F0}.ai .s{color:#C9D4E5}

/* 표 */
.tw{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:15px}
th{font-size:13px;font-weight:700;color:var(--ink-2);text-align:right;padding:8px 10px;border-bottom:1px solid #D9DFE8;white-space:nowrap;vertical-align:bottom}
th small{display:block;font-weight:400;color:var(--muted)}
td{text-align:right;padding:10px;border-bottom:1px solid var(--grid);white-space:nowrap}
th:first-child,td:first-child{text-align:left}
td small{display:block;font-size:12.5px;color:var(--muted)}
td.l,th.l{text-align:left}
tr.avg td{background:#EEF2F8;font-weight:700}
tr.sub td{background:#FAFBFC;color:var(--ink-2);font-size:14px}
tr.grp td{background:#F6F8FB;font-size:13px;font-weight:700;color:var(--ink-2);padding:7px 10px}
td.wrap{white-space:normal;text-align:left}
th[data-k]{cursor:pointer}

.nrow{display:grid;grid-template-columns:62px 160px minmax(0,1fr);gap:14px;align-items:center;padding:13px 0;border-top:1px solid var(--grid);font-size:16.5px;min-width:0}

.prow{display:grid;grid-template-columns:150px minmax(0,1fr) 170px;gap:12px;padding:10px 0;border-top:1px solid var(--grid);font-size:15.5px;min-width:0}
.prow > span:last-child{text-align:right}


/* 숫자 확인: 그래프 위 투명 칸, 떠 있는 상자 */
.hit{fill:transparent;cursor:pointer}
.hit:hover,.hit.on{fill:rgba(43,92,168,.07)}
circle.pt{cursor:pointer}circle.pt.on{stroke:var(--ink);stroke-width:2}
[data-tip]{cursor:pointer}
#tip{position:fixed;z-index:50;pointer-events:none;background:var(--navy);color:#fff;border-radius:10px;padding:9px 12px;font-size:13.5px;line-height:1.45;min-width:150px;max-width:min(320px,calc(100vw - 16px));box-shadow:0 6px 18px rgba(19,35,61,.25);font-variant-numeric:tabular-nums}
#tip[hidden]{display:none}
#tip .tt{display:block;font-size:14px;margin-bottom:3px}
#tip .tr{display:flex;justify-content:space-between;gap:14px}
#tip .tr span{color:var(--navy-ink)}
#tip .tr b{font-weight:700;white-space:nowrap}
.hint{margin:-6px 0 0;font-size:13.5px;color:var(--faint)}
/* 카드 아래 펼치는 숫자 표 */
.fold{margin-top:12px;border-top:1px solid var(--grid);padding-top:8px}
.fold summary{cursor:pointer;font-size:14px;color:var(--accent);list-style:none;display:flex;align-items:center;gap:6px;padding:2px 0;width:fit-content;max-width:100%}
.fold summary::-webkit-details-marker{display:none}
.fold summary::before{content:"";width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(-45deg);transition:transform .15s;margin-right:2px}
.fold[open] summary::before{transform:rotate(45deg)}
.fold-b{margin-top:8px}
.fold table{font-size:14px}
.fold td a{color:var(--ink)}
.wrapcells td:last-child{white-space:normal;text-align:left;min-width:240px}

/* 헤더 오른쪽: 경쟁사 실적 리포트 */
.rep{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:10px;background:var(--navy-2);color:#fff;font-size:14px;font-weight:600;white-space:nowrap;border:1px solid rgba(255,255,255,.14)}
.rep:hover{background:#2C4470}
.rep .rs{display:none}
.fresh .fr{margin-left:auto;display:inline-flex;align-items:center;gap:16px}
.fsb{display:inline-flex;align-items:center;gap:7px;padding:0;background:none;border:0;color:var(--muted);font-size:14px;white-space:nowrap;cursor:pointer}
.fsb i{width:30px;height:17px;border-radius:999px;background:#C9D2DE;position:relative;flex:none;transition:background .15s}
.fsb i::after{content:"";position:absolute;left:2px;top:2px;width:13px;height:13px;border-radius:50%;background:#fff;transition:left .15s}
.fsb[aria-pressed="true"]{color:var(--ink);font-weight:700}
.fsb[aria-pressed="true"] i{background:var(--accent)}
.fsb[aria-pressed="true"] i::after{left:15px}

/* 회사 이름 = 버튼(약식 PL) */
.cob{border:0;background:none;padding:0;text-align:left;font:inherit;color:inherit;cursor:pointer}
.cob:hover{color:var(--accent)}
.cob .cob-h{font-size:13px;font-weight:400;color:var(--accent);margin-left:auto}
button.co{font-weight:600}
/* 회사 약식 PL 창 */
#coPop{border:0;border-radius:18px;padding:0;width:min(1000px,calc(100vw - 32px));max-height:calc(100vh - 48px);color:var(--ink);background:var(--surface);box-shadow:0 18px 50px rgba(19,35,61,.3)}
#coPop::backdrop{background:rgba(19,35,61,.45)}
#coPopBody{padding:22px 26px 10px}
.cp-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;border-bottom:3px solid var(--cc);padding-bottom:14px;margin-bottom:18px}
.cp-head h2{font-size:24px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0}
.cp-head h2 i{width:12px;height:12px;border-radius:50%;background:var(--cc);display:inline-block}
.cp-meta{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:8px;color:var(--ink-2);font-size:14.5px}
.cp-meta b{color:var(--ink)}.cp-meta a{text-decoration:underline;text-decoration-color:var(--line)}
.cp-x{border:1px solid var(--line);background:var(--surface);border-radius:8px;width:36px;height:36px;font-size:18px;flex:none;color:var(--ink-2)}
.cp-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:20px}
.cp-kpi{border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.cp-kpi .l{font-size:14px;color:var(--ink-2)}
.cp-kpi .v{font-size:26px;font-weight:700;letter-spacing:-.02em;margin:2px 0 4px;font-variant-numeric:tabular-nums}
.cp-kpi .c{font-size:13.5px;color:var(--ink-2)}
.cp-seg{display:flex;flex-wrap:wrap;gap:6px;margin:-6px 0 20px}
.cp-seg > span{white-space:nowrap;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:14px;color:var(--ink-2)}
.cp-seg > span.main{border-color:var(--cc);color:var(--ink)}
.cp-sec{margin:0 0 22px}
.cp-sec h3{font-size:17px;margin:0 0 10px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.cp-sec h3 small{font-size:13px;color:var(--muted);font-weight:400}
.cp-tw{overflow-x:auto}
.cp-pl th,.cp-pl td{padding:8px 10px}
.cp-pl th small{display:block;font-weight:400}
.cp-pl td.l{text-align:left;font-weight:600}
.cp-pl tr.sub td.l{font-weight:400;color:var(--ink-2);padding-left:24px}
.cp-pl tr.sub td{font-size:14.5px;color:var(--ink-2)}
.cp-pl tr.key td{background:var(--page)}
.cp-pl tr.pct td{padding-top:0;color:var(--ink-2);font-size:14.5px}
.cp-pl tr.key + tr.pct td{background:var(--page)}
.cp-pl tr:has(+ tr.pct) td{border-bottom:0;padding-bottom:2px}
.cp-pl td.avg,.cp-pl th.avg{color:var(--ink-2);border-left:1px solid var(--line)}
.cp-n{display:grid;grid-template-columns:48px auto minmax(0,1fr);gap:10px;align-items:baseline;padding:9px 0;border-top:1px solid var(--grid);font-size:15px}
.cp-n:hover span:last-child{text-decoration:underline}

/* 최근 공시/기사 */
.flt{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 10px}
.flt select{font:inherit;font-size:14px;padding:6px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);max-width:200px}
.linkbtn{border:0;background:none;padding:4px 6px;font-size:14.5px}
.morebtn{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:8px 18px;font-size:14px;color:var(--accent)}
.tag.new-t{background:#FBE7E5;color:var(--up);font-weight:700;font-size:11px;margin-left:6px;padding:1px 6px}
.chip{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:3px 10px;font-size:13.5px;color:var(--accent);white-space:nowrap}
.chip small{color:var(--muted);margin-left:2px}
.chip:hover{border-color:var(--accent)}
.dgrid{table-layout:fixed;min-width:560px}
.dgrid th,.dgrid td{text-align:center}
.dgrid th:first-child,.dgrid td:first-child{text-align:left;width:30%}
.disc th,.disc td{text-align:left}.disc .dgrid th:not(:first-child),.disc .dgrid td:not(:first-child){text-align:center}
.disc td a{color:var(--ink)}.disc td a:hover{text-decoration:underline}
/* 기업가치 */
.big1{display:flex;align-items:baseline;gap:10px;margin:-4px 0 10px}.big1 b{font-size:30px;letter-spacing:-.02em}.big1 span{font-size:15px;color:var(--muted)}
td .est{font-size:11px;font-weight:700;color:#7A5A12;background:#F3EAD7;border-radius:3px;padding:1px 5px;margin:0 4px 0 0}

/* 관리자 모드 (브랜드명 길게 누르기) */
.brand{-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}
#adm{border:0;border-radius:18px;padding:0;width:min(860px,calc(100vw - 32px));max-height:calc(100vh - 48px);color:var(--ink);background:var(--surface);box-shadow:0 18px 50px rgba(19,35,61,.3)}
#adm::backdrop{background:rgba(19,35,61,.45)}
.adm-in{padding:20px 24px 22px}
.adm-hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.adm-hd h2{margin:0;font-size:21px}
#adm h3{font-size:16px;margin:18px 0 8px}#adm h3 small{font-size:13px;font-weight:400;color:var(--muted);margin-left:8px}
.adm-tool{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 10px}
.adm-tool input{font:inherit;font-size:14px;padding:6px 10px;border:1px solid var(--line);border-radius:8px}
.cap-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.cap-sec{border:1px solid var(--line);border-radius:10px;overflow:hidden}
.cap-sec h3{margin:0 !important;padding:8px 12px;font-size:14px !important;background:var(--tag)}
.cap-sec td{padding:7px 12px;font-size:14px}.cap-sec tr:last-child td{border-bottom:0}
#admList{width:100%;font:inherit;font-size:14px;padding:8px;border:1px solid var(--line);border-radius:8px;margin-bottom:8px}

/* 휴대폰 */
@media (max-width:760px){
  header{padding:12px 14px}
  .hd{gap:10px}
  .brand{font-size:20px}
  .hd-r{margin-left:auto}
  /* 아래 떠 있는 알약 메뉴 */
  .nav{position:fixed;left:12px;right:12px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:20;margin:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;background:var(--navy);border-radius:24px;padding:6px;box-shadow:0 6px 20px rgba(19,35,61,.28)}
  .nav a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:7px 0;border-radius:18px;color:#A9B8CF;font-size:11.5px}
  .nav a[aria-current="page"]{background:#2B3F60;color:#fff}
  .nav .ni{display:block;width:21px;height:21px}.nav .nl{display:none}.nav .ns{display:block}
  main{padding-bottom:110px !important}
  .fsw{order:4;width:100%}
  .fsw a,.fsw button{flex:1;text-align:center;font-size:13px;padding:7px 4px}
  .view a{padding:6px 10px;font-size:13px}
  main{padding:14px 14px 40px;gap:14px}
  .g2,.g3{grid-template-columns:minmax(0,1fr)}
  .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .prow{grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;font-size:14.5px}.prow > span:nth-child(2){grid-column:1/-1;grid-row:2}
  .nrow{grid-template-columns:auto minmax(0,1fr);gap:4px 10px;font-size:15px}.nrow > span:last-child{grid-column:1/-1}
  .card{padding:16px;border-radius:16px}
  .card h2{font-size:17px}
  .ph h1{font-size:23px}
  .ph .r{margin-left:0}
  .ic .big b{font-size:32px}.ic .big span{font-size:17px}
  .dc{grid-template-columns:92px minmax(0,1fr);gap:12px}.dc .n{font-size:21px}.dc .h{font-size:15.5px}
  /* 표 → 회사별 카드 */
  .tw:not(.keep) table,.tw:not(.keep) tbody{display:block}
  .tw:not(.keep) thead{display:none}
  .tw:not(.keep) tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px 14px;padding:11px 2px;border-bottom:1px solid var(--grid)}
  .tw:not(.keep) tbody td{display:flex;justify-content:space-between;align-items:baseline;gap:6px;padding:0;border:0;white-space:normal;font-size:14px;min-width:0}
  .tw:not(.keep) tbody td::before{content:attr(data-l);color:var(--muted);font-size:12.5px;text-align:left;flex:0 1 auto;min-width:0}
  .tw:not(.keep) tbody td:first-child,.tw:not(.keep) tbody td[colspan],.tw:not(.keep) tbody td.full{grid-column:1/-1;justify-content:flex-start;font-size:15.5px}
  .tw:not(.keep) tbody td:first-child::before,.tw:not(.keep) tbody td[colspan]::before,.tw:not(.keep) tbody td.full::before,.tw:not(.keep) tbody td[data-l=""]::before{display:none}
  .tw:not(.keep) tbody td small{display:inline;margin-left:6px}
  .tw:not(.keep) tbody td > b,.tw:not(.keep) tbody td > span:not(.co){white-space:nowrap}
  .tw:not(.keep) tbody td::before{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:55%}
  .tw:not(.keep) tbody td.l:has(svg){display:none}
  .tw:not(.keep) tbody td:first-child small{display:block;margin:2px 0 0}
  .tw:not(.keep) tbody tr.avg{background:#EEF2F8;border-radius:8px;padding:10px}
  .tw:not(.keep) tbody tr.avg td{background:none}
  .tw:not(.keep) tbody tr.grp{display:block;padding:6px 8px;background:#F6F8FB}
  .tw:not(.keep) tbody tr.grp td{background:none}
  .flt select{flex:1 1 40%;max-width:none}
  .flt .seg{width:100%}.flt .seg button{flex:1}
  .dgrid th:first-child,.dgrid td:first-child{width:104px}
  .disc .tw:not(.keep) tbody td:last-child{grid-column:1/-1;font-size:15px}.disc .tw:not(.keep) tbody td:last-child::before{display:none}
  .disc .tw:not(.keep) tbody td small{display:inline;margin-left:6px}
  .rep{padding:7px 11px;font-size:13px}.rep .rl{display:none}.rep .rs{display:inline}
  #coPop{width:100vw;max-width:100vw;max-height:100%;height:100%;border-radius:0;margin:0}
  #coPopBody{padding:16px 14px 40px}
  .cp-head h2{font-size:20px}
  .cp-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .cp-kpi{padding:10px 12px}.cp-kpi .v{font-size:21px}.cp-kpi .c{font-size:12.5px}
  .cp-pl{font-size:13.5px}.cp-pl th,.cp-pl td{padding:7px 6px}
  .cp-n{grid-template-columns:auto minmax(0,1fr);font-size:14px}.cp-n span:last-child{grid-column:1/-1}
  .wrapcells td:last-child{min-width:0}
  .fold summary{font-size:14.5px;padding:6px 0}
}
/* 재무 회사 카드: 누르면 약식 PL */
.fcard{cursor:pointer;transition:border-color .15s,box-shadow .15s}
.fcard:hover{border-color:#B9C6DA;box-shadow:0 2px 10px rgba(19,35,61,.06)}
.fcard:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* 재무: 분기 자료 없는 카드, 판관비 표 */
.qempty{display:flex;align-items:center;justify-content:center;min-height:190px;color:var(--muted);font-size:15px}
.sga-t{margin-top:14px}
.sga-t td small,.sga-t th small{display:block;font-size:13px;font-weight:400;color:var(--muted)}
@media (max-width:760px){
  .qempty{min-height:56px}
  .sga-t .tw:not(.keep) tbody tr{grid-template-columns:minmax(0,1fr)}
  .sga-t .tw:not(.keep) tbody td::before{max-width:none}
  .sga-t .tw:not(.keep) tbody td small{display:inline;margin-left:8px}
}
.sga-t .sv small{display:block}
@media (max-width:760px){ .sga-t .sv small{display:inline;margin-left:8px} }

/* 약식 PL: 매출 100원의 쓰임 */
.cs{display:grid;gap:8px}
.cs-row{display:grid;grid-template-columns:44px minmax(0,1fr) 82px;gap:10px;align-items:center;font-size:14px}
.cs-y{color:var(--muted)}
.cs-row > b{text-align:right;font-size:14px}
.cs-h{margin-bottom:-4px}.cs-h > b{font-size:13px;font-weight:600;color:var(--muted)}
.cs-bar{position:relative;display:flex;height:26px;border-radius:4px;overflow:hidden;background:var(--tag)}
.cs-bar.over::after{content:"";position:absolute;left:var(--h);top:-2px;bottom:-2px;border-left:1.5px dashed var(--ink);opacity:.55}
.cs-bar i{display:flex;align-items:center;justify-content:center;font-style:normal;font-size:12.5px;font-weight:700;color:#fff;min-width:0;overflow:hidden;white-space:nowrap;cursor:pointer}
.cs-lg{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:13px;color:var(--ink-2);margin:2px 0 0 54px}
.cs-lg i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;vertical-align:0}
@media (max-width:760px){ .cs-row{grid-template-columns:38px minmax(0,1fr) 70px;gap:6px} .cs-lg{margin-left:0} }

/* 가로 막대(HTML) */
.hb{display:grid;gap:2px;max-width:640px;font-size:15px;position:relative}
.hb-r,.hb-rr{display:grid;grid-template-columns:var(--lab) minmax(0,1fr);align-items:center;gap:12px;min-height:32px;border-radius:6px}
.hb-r:hover,.hb-r.on{background:rgba(43,92,168,.06)}
.hb-l{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:2px}
.hb-t{position:relative;height:18px;margin-right:72px}
.hb.neg .hb-t{margin-left:64px}
.hb.neg .hb-t::before{content:"";position:absolute;left:var(--z);top:-7px;bottom:-7px;border-left:1px solid #B4BFCF}
.hb-b{position:absolute;top:0;bottom:0;border-radius:3px}
.hb-v{position:absolute;top:50%;transform:translateY(-50%);font-size:14.5px;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
.hb.hbdot .hb-t::after{content:"";position:absolute;left:0;right:0;top:50%;border-top:1px solid var(--grid)}
.hb-d{position:absolute;top:50%;width:13px;height:13px;border-radius:50%;transform:translate(-50%,-50%);z-index:1;box-shadow:0 0 0 2px var(--surface)}
.hb-rr{min-height:20px}
.hb-ref{position:absolute;top:-2px;transform:translateX(-50%);font-size:12.5px;color:var(--muted);white-space:nowrap}
.hb-ref em{font-style:normal}
.hb-ref::before{content:"";position:absolute;left:50%;bottom:100%;height:var(--refh,200px);border-left:1.5px dashed #8C98AB}
@media (max-width:760px){ .hb{font-size:14px;max-width:none} .hb-r{gap:8px;--lab:96px !important} .hb-t{margin-right:58px} .hb.neg .hb-t{margin-left:50px} }

/* 넓은 화면 2단: 그래프 | 표 */
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:32px;align-items:start}
.split.wide{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.split .sp-r .tw{margin-top:0}
.split .sga-t{margin-top:0}
@media (max-width:1180px){ .split,.split.wide{grid-template-columns:minmax(0,1fr);gap:16px} .split .sp-l .hb{max-width:640px} }
.hb.stk .hb-b{border-radius:0}.hb.stk .hb-b:first-child{border-radius:3px 0 0 3px}
/* 표 안 작은 막대 */
.mb2{display:inline-flex;align-items:center;gap:10px;justify-content:flex-end}
.mbt{position:relative;width:110px;height:10px;background:var(--grid);border-radius:3px;flex:none}
.mbt i{position:absolute;top:0;bottom:0;border-radius:3px}
.mbt i.p{left:50%;background:var(--up)}.mbt i.n{right:50%;background:var(--down)}
.mbt:not(.cap)::after{content:"";position:absolute;left:50%;top:-3px;bottom:-3px;border-left:1px solid #B4BFCF}
.mbt.cap i{left:0}
.mb2 b{min-width:64px;text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:760px){ .mbt{width:64px} .mb2 b{min-width:0} }
.val-t td:first-child{white-space:normal}.val-t td:first-child small{max-width:300px}
.hb.hbdot .hb-v{background:var(--surface);padding:0 3px;z-index:2}
.sig-t td:last-child{min-width:150px}.sig-t td,.sig-t th{padding-left:6px;padding-right:6px}
/* 홈: 웹에서 좌우 열의 끝을 맞춤(짧은 열의 마지막 카드가 늘어남) */
.g2.home{align-items:stretch}
.g2.home > .col{display:flex;flex-direction:column}
.g2.home > .col > .card:last-child{flex:1 1 auto}
.g2.home.measure > .col > .card:last-child{flex:none}

/* 이용 안내 */
.ib{border:0;background:none;padding:0;color:var(--accent);font-size:14px;cursor:pointer}
#intro{border:0;border-radius:20px;padding:0;width:min(840px,calc(100vw - 32px));max-height:calc(100vh - 48px);color:var(--ink);background:var(--surface);box-shadow:0 18px 50px rgba(19,35,61,.3);overflow:auto}
#intro::backdrop{background:rgba(19,35,61,.5)}
.in-hero{background:var(--navy);color:#fff;padding:30px 32px 26px}
.in-k{font-size:12px;font-weight:700;letter-spacing:.14em;color:#8FB0E3}
.in-hero h2{margin:6px 0 6px;font-size:28px;letter-spacing:-.02em}
.in-hero p{margin:0;font-size:15px;color:var(--navy-ink)}
.in-in{padding:20px 32px 22px}
.in-sh{margin:0 0 8px;font-size:13.5px;font-weight:700;color:var(--ink-2)}
.in-st{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);border-radius:14px;margin:0 0 20px}
.in-st > div{padding:14px 16px;display:flex;flex-direction:column;gap:2px;min-width:0}
.in-st > div + div{border-left:1px solid var(--line)}
.in-st b{font-size:22px;letter-spacing:-.02em;white-space:nowrap}
.in-st span{font-size:12.5px;color:var(--muted)}
.in-fl{display:flex;align-items:stretch;gap:0;margin:0 0 22px}
.in-f{flex:1;min-width:0;background:var(--page);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:3px}
.in-f i{font-style:normal;width:24px;height:24px;border-radius:50%;background:var(--accent);color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.in-f b{font-size:17px}
.in-f span{font-size:13.5px;color:var(--ink-2);line-height:1.45}
.in-f em{font-style:normal;font-size:12.5px;color:var(--accent);font-weight:600;margin-top:auto;padding-top:4px}
.in-ar{flex:none;width:26px;position:relative}
.in-out{flex:2.2;min-width:0;display:grid;grid-template-columns:1fr 1fr;border:2px solid var(--navy);border-radius:14px;overflow:hidden}
.in-o{padding:14px 16px;display:flex;flex-direction:column;gap:3px;min-width:0;color:inherit}
.in-o i{font-style:normal;width:24px;height:24px;border-radius:50%;background:var(--navy);color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.in-o b{font-size:17px;white-space:nowrap}.in-o span{font-size:14px;font-weight:600;color:var(--ink)}
.in-o em{font-style:normal;font-size:12.5px;color:var(--muted);margin-top:auto;padding-top:4px}
.in-o.rp{background:var(--navy);color:#fff;text-decoration:none}
.in-o.rp i{background:#fff;color:var(--navy)}.in-o.rp span{color:#fff}.in-o.rp em{color:var(--navy-ink)}
.in-o.rp:hover{background:#22365A}
.in-ar::after{content:"";position:absolute;top:50%;left:8px;width:9px;height:9px;border-top:2px solid #9AA8BD;border-right:2px solid #9AA8BD;transform:translateY(-50%) rotate(45deg)}
.in-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.in-foot small{color:var(--muted);font-size:12.5px}
.in-go{border:0;background:var(--navy);color:#fff;border-radius:10px;padding:10px 22px;font-weight:700;font-size:14.5px;cursor:pointer}
@media (max-width:760px){
  .in-hero{padding:22px 20px 18px}.in-hero h2{font-size:22px}.in-in{padding:16px 20px 18px}
  .in-st{grid-template-columns:repeat(2,minmax(0,1fr))}.in-st > div:nth-child(3){border-left:0}.in-st > div:nth-child(n+3){border-top:1px solid var(--line)}
  .in-st b{font-size:19px}
  .in-fl{flex-direction:column}.in-out{flex:none}.in-ar{width:auto;height:18px}.in-ar::after{left:50%;top:2px;transform:translateX(-50%) rotate(135deg)}
}
/* 판관비 히트맵: 셀 = 매출액 대비 비중, 색 진하기 = 열 안 상대 크기 */
.hmt th{white-space:nowrap}
.hmt th:not(:first-child),.hmt td:not(:first-child){text-align:center}
.hmt td{padding-top:4px;padding-bottom:4px}
.hm{display:block;width:100%;min-width:64px;border:0;border-radius:6px;padding:7px 6px;font:inherit;font-size:14px;color:var(--ink);cursor:pointer;font-variant-numeric:tabular-nums}
.hm[data-b]{font-weight:700}
.hm:hover,.hm:focus-visible{outline:2px solid #2B5CA8;outline-offset:-2px}
.hmt td small{display:block;font-size:13px;font-weight:400;color:var(--muted)}
@media (max-width:760px){
  .hmt .tw:not(.keep) tbody td{align-items:center}
  .hmt .hm{width:auto;min-width:54px;padding:4px 6px;font-size:13.5px}
  .hmt .tw:not(.keep) tbody tr{gap:3px 10px}
  .hmt .tw:not(.keep) tbody td::before{font-size:12.5px;letter-spacing:-.02em}
  .hmt td small{display:inline;margin-left:6px}
}
/* 히트맵·광고비 효율 표: 회사 열 고정, 나머지 열 같은 너비 */
@media (min-width:761px){
  .hmt table{table-layout:fixed;width:100%}
  .hmt th:first-child,.hmt td:first-child{width:170px}
  .hmt th{white-space:nowrap;letter-spacing:-.03em;font-size:13.5px}
}
/* 연구개발 투자 회수 표: 회수율 칸 막대 · 모바일에서 회수율 한 줄 */
.rdt td a{white-space:nowrap}
@media (max-width:760px){ .rdt .tw:not(.keep) tbody td:nth-child(6){grid-column:1/-1} }
/* 칸 안 막대(광고비 효율·연구개발 회수): 값은 막대 끝에 바로 붙임, 막대 길이 = --f × 최대 길이 */
.adt small.in{display:inline;margin-left:4px}
.ib2{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.ib2 i{display:block;height:12px;border-radius:3px;flex:0 0 auto;width:calc(var(--f,0) * 150px);min-width:2px}
@media (min-width:761px){
  .adt:not(.rdt) th:nth-child(5),.adt:not(.rdt) td:nth-child(5),.rdt th:nth-child(6),.rdt td:nth-child(6){text-align:left!important;padding-left:16px}
  .adt:not(.rdt) th:nth-child(5),.rdt th:nth-child(6){width:24%}
}
@media (max-width:760px){ .ib2 i{width:calc(var(--f,0) * 110px)} .adt:not(.rdt) .tw:not(.keep) tbody td:nth-child(5){grid-column:1/-1} }
/* 제목 옆 기준 설명(ⓘ) */
.ii{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;margin-left:8px;border:1.5px solid var(--muted);border-radius:50%;background:none;color:var(--muted);font:700 11.5px/1 Georgia,serif;font-style:italic;cursor:help;vertical-align:2px;padding:0;flex:none}
.ii:hover,.ii.on,.ii:focus-visible{border-color:var(--ink);color:var(--ink)}
/* 비중 도넛 + 범례 */
.dnut{display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px;align-items:center;max-width:620px}
.dnut svg{width:100%;height:auto;display:block}
.dnut circle{cursor:pointer}
.dnut-l{display:grid;gap:2px}
.dnut-r{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--grid);font-size:14.5px}
.dnut-r:last-child{border-bottom:0}
.dnut-r i{width:12px;height:12px;border-radius:3px}
.dnut-r b{font-variant-numeric:tabular-nums}
@media (max-width:760px){ .dnut{grid-template-columns:1fr;gap:14px} .dnut svg{width:170px;justify-self:center} }
.dnut-r span,.dnut-r b{color:var(--ink)}
.dnut-card{align-self:stretch;display:flex;flex-direction:column}
.dnut-card .dnut{flex:1;align-content:center}
/* 이례적 주가 변동: 회사마다 두 줄(등락 · 같은 시기 공시·보도 제목 전체) */
.sg-l{display:grid;margin-top:4px}
.sg-r{padding:10px 0;border-top:1px solid var(--grid)}
.sg-r:first-child{border-top:0;padding-top:4px}
.sg-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;font-size:15px}
.sg-h b{font-size:16px;font-variant-numeric:tabular-nums}
.sg-h .mu{font-size:14px}
.sg-m{margin-left:auto;font-size:13.5px;color:var(--muted);white-space:nowrap}
.sg-w{display:flex;gap:8px;align-items:baseline;margin-top:5px;font-size:14px;line-height:1.5}
.sg-w .tag{flex:none;white-space:nowrap}
.sg-w a.more{color:var(--ink);font-weight:500}
.sg-w a.more:hover{text-decoration:underline}
.sg-c{margin:12px 0 2px;font-size:13px;color:var(--muted)}
@media (max-width:760px){ .sg-m{margin-left:0;flex-basis:100%} }
/* 구역 안 별도 재무제표 스위치: 제목 줄 오른쪽 */
.h2o,.h3o{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.h3o .cp-fs{margin-left:auto;align-self:center;font-size:13.5px;font-weight:500}
.h2o .fsb,.h3o .fsb{margin-left:auto;font-size:13.5px;font-weight:500;align-self:center}
.ic .meta .mr{display:inline-flex;align-items:center;gap:14px;flex:none}
.ic .meta .fsb{font-size:13.5px}
.fsb .fx{white-space:pre}
@media (max-width:760px){ .fsb .fx{display:none} .h2o .fsb{font-size:13px} }
.ph .r .fsb{margin-right:6px;align-self:center}
/* ---------- 머리·화면 머리 정리 (2026.10.15) ---------- */
.hlp{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:10px;background:none;border:1px solid rgba(255,255,255,.18);color:var(--navy-ink);font-size:14px;font-weight:600;white-space:nowrap;cursor:pointer}
.hlp:hover{background:var(--navy-2);color:#fff}
/* 화면 머리: 제목·기준 한 덩어리, 조작은 오른쪽 한 줄 */
.ph{align-items:center;gap:8px 14px;min-height:40px}
.ph h1{font-size:24px}
.ph .m{display:inline-flex;align-items:center;gap:2px}
.ph .r{align-items:center;gap:10px}
.pick{font:inherit;font-size:14px;font-weight:600;color:var(--ink);height:34px;padding:0 30px 0 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%236B7A90' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 11px center;appearance:none;-webkit-appearance:none;cursor:pointer}
.ph .seg{height:34px;align-items:center}
@media (max-width:760px){
  .hlp{padding:7px 9px}.hlp .hl{display:none}
  .ph h1{font-size:21px}
  .ph .r{width:100%;gap:8px}
  .ph .r .seg{flex:1 1 100%}.ph .r .seg button{flex:1;padding:6px 6px;font-size:13.5px}
  .ph .r .pick{flex:1 1 0;min-width:0}
}
/* ---------- 머리 B안 (웹): 한 줄 = 제목 · 분야 선택 상자 · 메뉴 알약 · ? · 리포트 ---------- */
@media (min-width:761px){
  header{padding:12px 28px}
  .hd{flex-wrap:nowrap;gap:16px;max-width:none;margin:0;padding:0 max(0px,calc((100% - 1224px) / 2))}   /* 카드 왼쪽·오른쪽 끝과 맞춤 */
  .brand{font-size:24px;letter-spacing:-.03em}
  .hd-sep{display:none}
  .fsw{display:none}
  .nav{margin:0 0 0 14px}
  .nav .nav-in{display:flex;gap:2px}
  .hd-r{margin-left:auto}
  .hlp{width:36px;height:36px;padding:0;justify-content:center}.hlp .hl{display:none}
}
/* 분야 선택 상자 */
.fdd{position:relative}
.fdd-b{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 14px;border-radius:10px;background:var(--navy-2);color:#fff;font-size:15px;font-weight:700;border:1px solid rgba(255,255,255,.14);white-space:nowrap}
.fdd-b:hover{background:#2C4470}
.fdd-b svg{opacity:.8}
.fdd-m{position:absolute;left:0;top:calc(100% + 6px);z-index:40;display:flex;flex-direction:column;min-width:200px;background:var(--surface);border-radius:12px;box-shadow:0 10px 30px rgba(19,35,61,.25);padding:6px}
.fdd-m[hidden]{display:none}
.fdd-m a{display:flex;justify-content:space-between;gap:16px;padding:9px 12px;border-radius:8px;color:var(--ink);font-size:14.5px;font-weight:500}
.fdd-m a:hover{background:var(--tag)}
.fdd-m a[aria-selected="true"]{background:#EEF2F8;font-weight:700}
.fdd-m small{color:var(--muted);font-weight:400}
@media (max-width:760px){
  .fdd,.hd-sep{display:none}
  .nav .nav-in{display:contents}
}
/* 기업가치 표: 칸 안에 맞춤(가로 넘침 없이) — 추정·피어 표시는 숫자 위·아래 작은 글씨 */
.val-t .est{display:block;width:max-content;margin:0 0 2px auto}
.val-t .sv small{display:block;font-size:12.5px;color:var(--muted)}
.val-t td,.val-t th{padding-left:8px;padding-right:8px}
.val-t td:nth-child(2),.val-t td:nth-child(4){white-space:normal;min-width:84px}
@media (min-width:761px){
  .val-t table{table-layout:fixed;width:100%}
  .val-t th:first-child,.val-t td:first-child{width:150px}
  .val-t td:nth-child(2),.val-t td:nth-child(4){min-width:0}
}
/* 기업가치: 왼쪽 점 그래프 높이를 오른쪽 표에 맞춤(행 간격을 늘려 아래 빈칸 없앰) */
@media (min-width:1181px){
  .valc .split{align-items:stretch}
  .valc .sp-l{display:flex;flex-direction:column}
  .valc .sp-l .hb{flex:1;align-content:space-around;padding-top:34px}
}
/* 평균 제외 표시 */
.xa{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:5px;background:var(--tag);color:var(--muted);font-size:12px;font-weight:500;vertical-align:1px;white-space:nowrap}
.hmt td:first-child .xa,.val-t td:first-child .xa,.adt td:first-child .xa{display:block;width:max-content;margin:3px 0 0 18px}
/* 최근 7일 보도 유형: 막대를 누르면 그 유형 기사 목록 */
.hb-r[data-ui]{cursor:pointer}
.hb-r.on{background:rgba(43,92,168,.1)}
.tl{margin-top:14px;border-top:1px solid var(--grid);padding-top:10px}
.tl-h{margin:0 0 4px;font-size:14px;font-weight:700;color:var(--ink-2)}
.tl-r{display:grid;grid-template-columns:44px minmax(0,1fr);gap:10px;padding:7px 0;border-bottom:1px solid var(--grid);font-size:14.5px;line-height:1.45}
.tl-r:last-of-type{border-bottom:0}
.tl-r:hover .tl-t{text-decoration:underline}
.tl-r .mu{font-size:13.5px;padding-top:1px}
.tl-t b{font-weight:700;margin-right:4px;white-space:nowrap}
.tl-t b .dot{margin-right:5px}
.tl-t small{display:block;color:var(--muted);font-size:13px}
.tl-m{margin:6px 0 0;font-size:13px;color:var(--muted)}

/* 시장: 출처 번호(누르면 원문)와 접힌 출처 목록 */
.srcn{font-size:13px;font-weight:600;margin-left:3px;vertical-align:baseline;position:relative;top:-.45em;white-space:nowrap}
.srcn a,.srcn span{color:var(--accent);text-decoration:none}
.srcn a:hover{text-decoration:underline}
.mk-src{margin-top:4px}
.mk-src ol{margin:6px 0 0;padding-left:28px;font-size:14px;line-height:1.7;color:var(--ink-2)}
.mk-src ol a{color:inherit}

/* 대표 브랜드 칩: 회사 이름 옆, 회사 색 옅은 바탕 */
.bchip{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;font-size:13px;font-weight:600;line-height:1.5;white-space:nowrap;vertical-align:middle;color:var(--cc);background:color-mix(in srgb,var(--cc) 12%,#fff)}
.cp-head h2 .bchip{font-size:14px}
.home td .bchip{display:table;margin:2px 0 0 16px}   /* 홈 좁은 열의 표: 브랜드는 이름 아래 줄로(표가 넘치지 않게) */
/* 첫 열 폭이 고정된 표(판관비 세부·기업가치·광고비 등): 브랜드는 이름 아래 줄로 */
.hmt td:first-child .bchip,.val-t td:first-child .bchip,.adt td:first-child .bchip{display:table;margin:3px 0 0 18px}
