/* 코스픽 금리 시황 — 디자인 시스템: Ink #293237 · Navy #1B2440 · Teal #12A99B · Recess #F2F5F6 · Line #D5DDE0 · Muted #6B7780 · 상승 #DE2F26 · 하락 #1A6CCC */
.kspr{--ink:#293237;--navy:#1B2440;--teal:#12A99B;--teal-t:#0E8478;--recess:#F2F5F6;--line:#D5DDE0;--muted:#6B7780;--up:#DE2F26;--dn:#1A6CCC;
  --teal-soft:#E3F5F2;--navy-soft:#E8EBF3;--up-soft:#FBE9E7;--dn-soft:#E6EFFA;--sun:#D99A1E;--sun-soft:#FBF1DC;--rain-soft:#E6EFFA;--storm-soft:#F6E4E2;--grow:#1B2440;--value:#12A99B;
  color:var(--ink);font-size:15px;line-height:1.7;word-break:keep-all;overflow-wrap:break-word;max-width:960px;margin:0 auto}
.kspr :where(p,ul,ol,h2,h3,figure){margin:0}
.kspr [hidden]{display:none!important}
.kspr .kspr-mono{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-variant-numeric:tabular-nums}
.kspr .kspr-muted{color:var(--muted)} .kspr .kspr-small{font-size:13px}
.kspr .kspr-eyebrow{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.12em;color:var(--teal-t);text-transform:uppercase}
.kspr .kspr-h1{font-size:clamp(28px,4.5vw,38px);line-height:1.25;font-weight:700;color:var(--navy);margin-top:6px;text-wrap:balance}
.kspr .kspr-h1 mark{background:var(--teal-soft);color:var(--navy);padding:0 6px;border-radius:3px}
.kspr .kspr-h2{font-size:24px;line-height:1.3;font-weight:700;color:var(--navy);text-wrap:balance}
.kspr h3{font-size:17px;line-height:1.4;font-weight:700;color:var(--ink)}
.kspr .kspr-lede{font-size:16.5px;color:var(--muted);margin-top:12px;max-width:52ch}
.kspr .kspr-sub{color:var(--muted);max-width:66ch}
.kspr .kspr-sec{margin-top:52px}
.kspr .kspr-sh{display:flex;flex-direction:column;gap:6px;margin-bottom:18px}

/* hero */
.kspr .kspr-hero{display:grid;grid-template-columns:1fr 280px;gap:24px;align-items:center;padding-bottom:28px;border-bottom:1px solid var(--line)}
.kspr .kspr-hero-p svg{width:100%;height:auto;display:block}

/* svg tokens */
.kspr .kspr-sv-line{stroke:var(--line);stroke-width:2.5;stroke-linecap:round;fill:none}
.kspr .kspr-sv-ink{fill:var(--ink)} .kspr .kspr-sv-ink2{fill:var(--muted)}
.kspr .kspr-sv-up{fill:var(--up)} .kspr .kspr-sv-navy{fill:var(--navy)}
.kspr .kspr-sv-t{font-family:inherit;font-size:19px;font-weight:700;fill:#fff} .kspr .kspr-sv-ts{font-size:13px} .kspr .kspr-sv-txs{font-size:10px}
.kspr .kspr-sv-lab{font-family:inherit;font-size:12.5px;font-weight:600;fill:var(--ink)}
.kspr .kspr-sv-labup{fill:var(--up)} .kspr .kspr-sv-labdn{fill:var(--dn)} .kspr .kspr-sv-labteal{fill:var(--teal-t)} .kspr .kspr-sv-labnavy{fill:var(--navy)} .kspr .kspr-sv-labmuted{fill:var(--muted);font-weight:400}
.kspr .kspr-sv-tealsoft{fill:var(--teal-soft);stroke:var(--teal);stroke-width:1.5} .kspr .kspr-sv-navysoft{fill:var(--navy-soft);stroke:var(--navy);stroke-width:1.5}
.kspr .kspr-sv-arrow{fill:none;stroke:var(--ink);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.kspr .kspr-sv-coin{fill:var(--sun)} .kspr .kspr-sv-o75{opacity:.75} .kspr .kspr-sv-o50{opacity:.5}
.kspr .kspr-sv-box{fill:#fff;stroke:var(--ink);stroke-width:2}
.kspr .kspr-sv-needle{stroke:var(--up);stroke-width:4;stroke-linecap:round}
.kspr .kspr-sv-pol{fill:none;stroke:var(--navy);stroke-width:3;stroke-dasharray:6 4} .kspr .kspr-sv-long{fill:none;stroke:var(--up);stroke-width:3}
.kspr .kspr-sv-sun{fill:var(--sun)} .kspr .kspr-sv-sunray{stroke:var(--sun);stroke-width:3;stroke-linecap:round}
.kspr .kspr-sv-cloud{fill:#fff;stroke:var(--muted);stroke-width:2} .kspr .kspr-sv-clouddark{fill:var(--muted);stroke:var(--muted);stroke-width:2}
.kspr .kspr-sv-rain{stroke:var(--dn);stroke-width:2.5;stroke-linecap:round} .kspr .kspr-sv-bolt{fill:var(--up)}

/* cards */
.kspr .kspr-cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.kspr .kspr-cards2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.kspr .kspr-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px;display:flex;flex-direction:column;gap:10px;min-width:0}
.kspr .kspr-card p{font-size:14.5px;color:var(--ink)}
.kspr .kspr-pic{height:96px;display:flex;align-items:center;justify-content:center;background:var(--recess);border-radius:8px}
.kspr .kspr-pic svg{height:84px;width:auto;max-width:100%} .kspr .kspr-pic-l{height:120px} .kspr .kspr-pic-l svg{height:108px}
.kspr .kspr-flip{font-size:13.5px!important;color:var(--muted)!important;border-top:1px dashed var(--line);padding-top:8px;margin-top:auto}
.kspr .kspr-chain{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:14px}
.kspr .kspr-chain span{background:var(--recess);border-radius:999px;padding:2px 12px} .kspr .kspr-chain i{color:var(--muted);font-style:normal}
.kspr .kspr-callout{margin-top:14px;background:var(--navy);color:#fff;border-radius:10px;padding:16px 20px;font-size:15.5px}
.kspr .kspr-callout b{color:#fff;border-bottom:2px solid var(--teal)}

/* board */
.kspr .kspr-board{display:grid;grid-template-columns:22px 1fr;grid-template-rows:1fr 24px;gap:6px}
.kspr .kspr-ay{writing-mode:vertical-rl;transform:rotate(180deg);text-align:center;font-size:12.5px;color:var(--muted)}
.kspr .kspr-ax{grid-column:2;text-align:center;font-size:12.5px;color:var(--muted)}
.kspr .kspr-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:10px}
.kspr .kspr-w{border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:8px;position:relative;border:2px solid transparent;background:var(--recess)}
.kspr .kspr-w-sunny{background:var(--teal-soft);--c:var(--teal)} .kspr .kspr-w-cloudy{background:var(--sun-soft);--c:var(--sun)} .kspr .kspr-w-rain{background:var(--rain-soft);--c:var(--dn)} .kspr .kspr-w-storm{background:var(--storm-soft);--c:var(--up)}
.kspr .kspr-w.kspr-now{border-color:var(--navy);box-shadow:0 6px 18px rgba(27,36,64,.12)}
.kspr .kspr-w.kspr-lean{border-style:dashed;border-color:var(--muted)}
.kspr .kspr-pin{position:absolute;top:-13px;right:14px;background:var(--navy);color:#fff;font-size:12.5px;font-weight:700;padding:2px 12px;border-radius:999px;letter-spacing:.04em}
.kspr .kspr-pin-lean{background:#fff;color:var(--muted);border:1px dashed var(--muted)}
.kspr .kspr-wtop{display:flex;align-items:center;gap:10px} .kspr .kspr-wtop svg{width:40px;height:40px;flex:none}
.kspr .kspr-w h3{font-size:20px;color:var(--navy)} .kspr .kspr-cond{font-size:13px;color:var(--muted)}
.kspr .kspr-meter{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.kspr .kspr-track{flex:1;height:10px;background:rgba(41,50,55,.1);border-radius:999px;overflow:hidden} .kspr .kspr-track i{display:block;height:100%;background:var(--c);border-radius:999px}
.kspr .kspr-meter b{font-family:"IBM Plex Mono",monospace;color:var(--ink);min-width:40px;text-align:right}
.kspr .kspr-gv,.kspr .kspr-bar{display:flex;height:22px;border-radius:5px;overflow:hidden;font-size:12px;color:#fff;font-family:"IBM Plex Mono",monospace;gap:2px}
.kspr .kspr-gv span,.kspr .kspr-bar span{display:flex;align-items:center;justify-content:center;white-space:nowrap;overflow:hidden}
.kspr .kspr-g{background:var(--grow)} .kspr .kspr-v{background:var(--value)} .kspr .kspr-cash{background:var(--muted)}
.kspr .kspr-say{font-size:14px;color:var(--ink);line-height:1.55}
.kspr .kspr-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:12px;font-size:13px;color:var(--muted)}
.kspr .kspr-legend span::before{content:"";display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:6px;vertical-align:-1px;background:var(--c)}
.kspr .kspr-l-sunny{--c:var(--teal)} .kspr .kspr-l-cloudy{--c:var(--sun)} .kspr .kspr-l-rain{--c:var(--dn)} .kspr .kspr-l-storm{--c:var(--up)}

/* now */
.kspr .kspr-verdict{display:grid;grid-template-columns:52px 1fr auto;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-left:6px solid var(--c);border-radius:10px;padding:14px 18px;margin-bottom:14px}
.kspr .kspr-vw-sunny{--c:var(--teal)} .kspr .kspr-vw-cloudy{--c:var(--sun)} .kspr .kspr-vw-rain{--c:var(--dn)} .kspr .kspr-vw-storm{--c:var(--up)}
.kspr .kspr-verdict svg{width:52px;height:52px}
.kspr .kspr-vname{font-size:22px;font-weight:700;color:var(--navy)} .kspr .kspr-vwhy{font-size:13.5px;color:var(--muted)} .kspr .kspr-vwhy b{color:var(--ink)}
.kspr .kspr-vact{font-size:14px;color:var(--ink);background:var(--recess);border-radius:8px;padding:8px 14px;max-width:34ch}
.kspr .kspr-now2{display:grid;grid-template-columns:1.15fr 1fr;gap:14px}
.kspr .kspr-nums{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.kspr .kspr-n{background:var(--recess);border-radius:8px;padding:10px 12px}
.kspr .kspr-nl{font-size:12.5px;color:var(--muted)} .kspr .kspr-nv{font-size:24px;line-height:1.2;color:var(--navy)} .kspr .kspr-ns{font-size:12.5px}
.kspr .kspr-up{color:var(--up)} .kspr .kspr-dn{color:var(--dn)} .kspr .kspr-flat{color:var(--muted)}
.kspr .kspr-fig figcaption{font-size:13.5px;font-weight:600;color:var(--ink);margin:6px 0 2px}
.kspr .kspr-chart{position:relative} .kspr .kspr-chart svg{width:100%;height:auto;display:block;overflow:visible}
.kspr .kspr-cg{stroke:#E9EDF0;stroke-width:1} .kspr .kspr-cgy{stroke:var(--line);stroke-width:1}
.kspr .kspr-ct{font-family:"IBM Plex Mono",monospace;font-size:10px;fill:var(--muted)}
.kspr .kspr-cp{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.kspr .kspr-cp-pol{stroke:var(--navy);stroke-dasharray:5 3} .kspr .kspr-cp-s{stroke:var(--teal)} .kspr .kspr-cp-l{stroke:var(--up)}
.kspr .kspr-cd{stroke:#fff;stroke-width:1.5} .kspr .kspr-cd-pol{fill:var(--navy)} .kspr .kspr-cd-s{fill:var(--teal)} .kspr .kspr-cd-l{fill:var(--up)}
.kspr .kspr-cv{font-family:"IBM Plex Mono",monospace;font-size:11px;font-weight:600;fill:var(--ink)}
.kspr .kspr-cx{stroke:var(--muted);stroke-width:1;stroke-dasharray:2 3;opacity:0} .kspr .kspr-hit{fill:transparent;cursor:crosshair}
.kspr .kspr-tip{position:absolute;pointer-events:none;background:var(--ink);color:#fff;font-size:12px;line-height:1.45;padding:6px 10px;border-radius:4px;white-space:nowrap;transform:translate(-50%,-100%);z-index:2}
.kspr .kspr-tip b{font-family:"IBM Plex Mono",monospace;font-weight:500}
.kspr .kspr-tip i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px;font-style:normal}
.kspr .kspr-clegend{display:flex;gap:14px;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}
.kspr .kspr-clegend span::before{content:"";display:inline-block;width:14px;border-top:2px solid var(--c);margin-right:6px;vertical-align:3px}
.kspr .kspr-cl-pol{--c:var(--navy)} .kspr .kspr-cl-s{--c:var(--teal)} .kspr .kspr-cl-l{--c:var(--up)}
.kspr .kspr-signals{list-style:none;padding:0;display:flex;flex-direction:column;gap:6px;font-size:13.5px;color:var(--ink);border-top:1px dashed var(--line);padding-top:10px}
.kspr .kspr-signals li::before{content:"→ ";color:var(--teal-t);font-weight:700}
.kspr .kspr-shift{display:flex;flex-direction:column;gap:8px}
.kspr .kspr-row{display:grid;grid-template-columns:76px 1fr;gap:10px;align-items:center;font-size:13.5px;color:var(--muted)}
.kspr .kspr-bar{height:26px;border-radius:7px;font-size:12.5px}
.kspr .kspr-pick{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kspr .kspr-pick div{border-radius:8px;padding:12px 14px} .kspr .kspr-less{background:var(--up-soft)} .kspr .kspr-more{background:var(--teal-soft)}
.kspr .kspr-pick b{display:block;font-size:15px;margin-bottom:4px;color:var(--navy)} .kspr .kspr-pick p{font-size:14px!important}
.kspr .kspr-comment{background:var(--recess);border-radius:8px;padding:14px 16px;border-left:4px solid var(--muted)}
.kspr .kspr-comment-human{border-left-color:var(--teal);background:var(--teal-soft)}
.kspr .kspr-ctag{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.08em;color:var(--muted);margin-bottom:4px}
.kspr .kspr-comment-human .kspr-ctag{color:var(--teal-t)}
.kspr .kspr-comment p{font-size:15px!important;color:var(--ink)}
.kspr .kspr-why summary{font-size:13px;color:var(--muted);cursor:pointer} .kspr .kspr-why ul{font-size:13px;color:var(--muted);padding-left:18px;margin-top:6px}
.kspr .kspr-foot{margin-top:28px;border-top:1px solid var(--line);padding-top:12px;font-size:12.5px;color:var(--muted);line-height:1.7;display:flex;flex-direction:column;gap:4px}
.kspr .kspr-err{color:var(--up)}

@media (max-width:820px){
  .kspr .kspr-hero{grid-template-columns:1fr} .kspr .kspr-hero-p{max-width:280px}
  .kspr .kspr-cards3,.kspr .kspr-cards2,.kspr .kspr-now2{grid-template-columns:1fr}
  .kspr .kspr-verdict{grid-template-columns:44px 1fr} .kspr .kspr-vact{grid-column:1/-1;max-width:none}
  .kspr .kspr-board{grid-template-columns:1fr;grid-template-rows:auto auto} .kspr .kspr-ay{writing-mode:horizontal-tb;transform:none} .kspr .kspr-ax{grid-column:1}
  .kspr .kspr-grid{grid-template-columns:1fr;grid-template-rows:auto}
}
@media (max-width:480px){.kspr .kspr-nums,.kspr .kspr-pick{grid-template-columns:1fr}}
@media (prefers-reduced-motion:no-preference){.kspr .kspr-tip{transition:opacity .12s}}