/* 소비 아이템 시세 (/tli/price, 2026-10-20) — price_page.js */
    .pr-body #priceApp { width: min(var(--page-w, 1320px), calc(100% - 32px)); margin: 16px auto 32px; color: #e6edf3; }
    .pr-loading { color: #7d8794; padding: 40px; text-align: center; }
    .pr-top { display: flex; align-items: center; gap: 10px 14px; flex-wrap: wrap; padding: 12px 16px; margin-bottom: 12px;
      background: linear-gradient(180deg, #121826, #0b0f17); border: 1px solid #2a3344; border-radius: 14px; }
    .pr-ttl b { color: #f3e3b5; font-size: 18px; margin-right: 8px; } .pr-ttl small { color: #7d8794; font-size: 12px; }
    .pr-ses { display: flex; gap: 6px; }
    .pr-meta { color: #9aa4b2; font-size: 12.5px; } .pr-meta span { border-bottom: 1px dotted #4d5868; cursor: help; }
    .pr-note { margin-left: auto; color: #7d8794; font-size: 12px; } .pr-note summary { cursor: pointer; list-style: none; } .pr-note summary::-webkit-details-marker { display: none; }
    .pr-note[open] div { margin-top: 6px; max-width: 420px; line-height: 1.6; color: #9aa4b2; }
    .pr-chip { display: inline-flex; align-items: center; gap: 4px; padding: 4px 11px; border-radius: 999px; border: 1px solid #2f3a4d; background: #0f141f; color: #c9d1d9; font: inherit; font-size: 12.5px; cursor: pointer; white-space: nowrap; }
    .pr-chip small { color: #7d8794; font-size: 11px; } .pr-chip:hover { border-color: #4a5a78; }
    .pr-chip.on { border-color: #e3b860; color: #f3e3b5; background: #1d1a12; } .pr-chip.on small { color: #c9a95a; }
    .pr-ivs { display: flex; gap: 4px; flex-wrap: wrap; padding: 5px; margin-bottom: 10px; border-radius: 12px; border: 1px solid #3a3220; background: #15130d; }
    .pr-chip.lock { border-style: dashed; } .pr-src { color: #c9a95a; font-weight: 600; border-bottom: 1px dotted #6b5a2a; cursor: help; }
    .pr-iv { flex: 1 1 auto; padding: 8px 12px; border: 0; border-radius: 9px; background: none; color: #c9b98f; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; }
    .pr-iv small { font-weight: 400; opacity: .7; } .pr-iv:hover:not([disabled]) { background: #221d12; color: #f3e3b5; }
    .pr-iv.on { background: linear-gradient(180deg, #f0c66a, #d39a3a); color: #1a1205; } .pr-iv[disabled] { opacity: .35; cursor: default; }
    .pr-cats { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
    .pr-rank { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }
    .pr-rcol { padding: 10px 12px; border-radius: 14px; border: 1px solid #1f2735; background: #0d1117; min-width: 0; }
    .pr-rcol.up { border-color: #2c3d2a; } .pr-rcol.dn { border-color: #452a2a; }
    .pr-rh { font-weight: 700; font-size: 14px; margin: 2px 2px 8px; } .pr-rcol.up .pr-rh { color: #7ee07a; } .pr-rcol.dn .pr-rh { color: #ff8a80; }
    .pr-rcol ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
    .pr-r { display: flex; align-items: center; gap: 8px; padding: 5px 6px; border-radius: 10px; background: #0f141f; min-width: 0; }
    .pr-rk { flex: none; width: 20px; text-align: center; color: #7d8794; font-size: 12px; font-weight: 700; }
    .pr-r img, .pr-tn img, .pr-b img { flex: none; width: 34px; height: 34px; border-radius: 8px; background: #0b0f17; border: 1px solid #263044; object-fit: contain; }
    img.q2 { border-color: #3a5a9a; } img.q3 { border-color: #6b4aa0; } img.q4 { border-color: #a0702a; } img.q5 { border-color: #a03a3a; }
    .pr-in { flex: 1; min-width: 0; display: flex; flex-direction: column; } .pr-in b { font-size: 13px; color: #e6edf3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pr-in small { color: #7d8794; font-size: 11px; }
    .pr-rv { flex: none; display: flex; flex-direction: column; align-items: flex-end; } .pr-rv em { font-style: normal; color: #9aa4b2; font-size: 11.5px; }
    .pr-rv b { font-size: 15px; } .up { color: #7ee07a; } .dn { color: #ff8a80; }
    .pr-none { color: #7d8794; font-size: 12.5px; margin: 6px 4px; }
    .pr-sec { padding: 12px; border-radius: 14px; border: 1px solid #1f2735; background: #0d1117; }
    .pr-sech { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; } .pr-sech b { color: #f3e3b5; font-size: 14px; margin-right: auto; }
    .pr-q, .pr-sort { background: #0b0f17; border: 1px solid #2f3a4d; color: #e6edf3; border-radius: 8px; padding: 6px 10px; font: inherit; font-size: 13px; }
    .pr-q { width: min(240px, 100%); } .pr-q:focus { outline: none; border-color: #e3b860; }
    /* 가로로 넘기는 줄 — 기본 스크롤바 숨김 + 휠·끌기로 넘김 + 끝 흐림 (2026-10-20 사용자: 기본 스크롤바가 생길 때가 있음) */
    .pb-cats, .pb-days, .pr-ivs { scrollbar-width: none; -ms-overflow-style: none; } .pb-cats::-webkit-scrollbar, .pb-days::-webkit-scrollbar, .pr-ivs::-webkit-scrollbar { display: none; }
    .hs-more { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent); }
    .hs-more.hs-left { -webkit-mask-image: linear-gradient(90deg, transparent, #000 48px, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(90deg, transparent, #000 48px, #000 calc(100% - 48px), transparent); }
    .hs-end.hs-left { -webkit-mask-image: linear-gradient(90deg, transparent, #000 48px); mask-image: linear-gradient(90deg, transparent, #000 48px); }
    .hs-drag { cursor: grabbing; user-select: none; }
    /* 맞춤 드롭다운 (2026-10-20 사용자: 기본 셀렉트가 깨져 보임) */
    .dd { position: relative; display: inline-block; }
    .dd-b { display: inline-flex; align-items: center; gap: 8px; min-width: 104px; justify-content: space-between; padding: 7px 12px; border-radius: 8px; border: 1px solid #2f3a4d; background: #0b0f17; color: #e6edf3; font: inherit; font-size: 13px; cursor: pointer; }
    .dd-b i { font-style: normal; color: #7d8794; font-size: 11px; transition: .15s; } .dd.open .dd-b { border-color: #e3b860; } .dd.open .dd-b i { transform: rotate(180deg); }
    .dd-m { display: none; position: absolute; right: 0; top: calc(100% + 4px); z-index: 50; min-width: 100%; padding: 4px; border-radius: 10px; background: #121826; border: 1px solid #2f3a4d; box-shadow: 0 10px 28px rgba(0,0,0,.5); }
    .dd.open .dd-m { display: block; }
    .dd-m button { display: flex; width: 100%; align-items: center; gap: 8px; padding: 7px 10px; border: 0; border-radius: 7px; background: none; color: #c9d1d9; font: inherit; font-size: 13px; text-align: left; cursor: pointer; white-space: nowrap; }
    .dd-m button:hover { background: #1b2230; color: #fff; } .dd-m button.on { color: #f3e3b5; font-weight: 700; } .dd-m button.on::after { content: '✓'; margin-left: auto; color: #e3b860; }
    .pr-tw { overflow-x: auto; }
    .pr-t { width: 100%; border-collapse: collapse; font-size: 13px; }
    .pr-t th { color: #9aa4b2; font-weight: 600; font-size: 12px; text-align: right; padding: 6px 8px; border-bottom: 1px solid #222b3a; white-space: nowrap; }
    .pr-t th:first-child { text-align: left; } .pr-t th.sel { color: #e3b860; }
    .pr-t td { text-align: right; padding: 5px 8px; border-bottom: 1px solid #161c28; white-space: nowrap; font-variant-numeric: tabular-nums; }
    .pr-t td.sel { background: rgba(227,184,96,.05); } .pr-t td.na { color: #4d5868; } .pr-t td.pct { font-weight: 700; }
    .pr-t tr:hover td { background: #121826; }
    .pr-tn { text-align: left !important; min-width: 200px; } .pr-tn a { display: flex; align-items: center; gap: 8px; color: inherit; text-decoration: none; }
    .pr-tn a:hover b { color: #f3e3b5; }
    .pr-empty { padding: 24px; border-radius: 14px; border: 1px dashed #2f3a4d; background: #0d1117; } .pr-empty b { color: #f3e3b5; font-size: 15px; }
    .pr-empty p { color: #9aa4b2; font-size: 13px; margin: 6px 0 14px; } .pr-empty .pr-chip { cursor: default; }
    .pr-bdb { display: flex; flex-direction: column; align-items: center; gap: 2px; position: relative; line-height: 1.25; }
    .pr-bdb small { font-size: 11px; font-weight: 400; opacity: .75; }
    .pr-bdb.today:not(.on) { box-shadow: inset 0 0 0 1.5px #e3b860; color: #f3e3b5; }
    .pr-tdy { position: absolute; top: -8px; right: 6px; padding: 1px 7px; border-radius: 999px; background: #ff7b54; color: #fff; font-size: 10.5px; font-weight: 800; }
    .pr-tdyt { color: #ff9a6a; }
    .pr-flow { font-style: normal; font-size: 11.5px; padding: 2px 8px; border-radius: 999px; white-space: nowrap; border: 1px solid #2f3a4d; color: #9aa4b2; }
    .pr-flow b { font-weight: 700; } .pr-flow small { opacity: .7; font-size: 10.5px; }
    .pr-flow.hot { border-color: #8a4a2a; background: #2a160e; color: #ffb38a; } .pr-flow.cold { border-color: #2c5a3a; background: #0f2016; color: #8fe8a0; }
    .pr-flow.na { opacity: .5; }
    .pr-nohot { margin-left: auto; float: right; font-size: 12px; font-weight: 400; color: #c9d1d9; cursor: pointer; display: inline-flex; align-items: center; gap: 5px; }
    .pr-nohot small { color: #ffb38a !important; margin: 0 !important; }
    .pr-tabs { display: flex; gap: 6px; margin-bottom: 10px; }
    .pr-tab { padding: 7px 16px; border-radius: 10px; border: 1px solid #2f3a4d; background: #0f141f; color: #c9d1d9; font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; }
    .pr-tab.on { border-color: #e3b860; color: #f3e3b5; background: #1d1a12; }
    .pr-buy { display: flex; flex-direction: column; gap: 12px; }
    .pr-buy .pr-rh small { color: #7d8794; font-weight: 400; font-size: 12px; margin-left: 6px; }
    .pr-b { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 10px; background: #0f141f; min-width: 0; }
    .pr-b .pr-in { flex: 0 1 240px; }
    .pr-bper { flex: 1; display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
    .pr-bper i { font-style: normal; font-size: 11.5px; padding: 2px 7px; border-radius: 999px; background: #121826; border: 1px solid #222b3a; white-space: nowrap; }
    .pr-b .pr-rv { min-width: 150px; } .pr-sd { color: #f3e3b5; font-size: 11.5px !important; }
    .pr-tip { position: fixed; z-index: 9999; display: none; max-width: 340px; padding: 8px 11px; border-radius: 10px; background: #1b2230; border: 1px solid #3a4a66;
      color: #e6edf3; font-size: 12.5px; line-height: 1.55; white-space: pre-line; pointer-events: none; box-shadow: 0 8px 24px rgba(0,0,0,.5); }
    .pr-tip.h { white-space: normal; padding: 8px 10px; max-width: 420px; }
    .tt { border-collapse: collapse; font-size: 12.5px; font-variant-numeric: tabular-nums; }
    .tt th, .tt td { padding: 3px 8px; text-align: right; white-space: nowrap; } .tt th:first-child { text-align: left; color: #c9d1d9; font-weight: 600; }
    .tt tr:first-child th { color: #7d8794; font-weight: 600; font-size: 11.5px; border-bottom: 1px solid #2f3a4d; }
    .tt tr.em { background: rgba(227,184,96,.1); } .tt tr.em th { color: #f3e3b5; }
    .tt tr:last-child:not(.em) { border-top: 1px solid #2f3a4d; } .tt td.tt-p { font-weight: 700; }
    .tt-f { margin-top: 6px; padding-top: 6px; border-top: 1px solid #2f3a4d; font-size: 12px; color: #c9d1d9; }
    .pf-hot { color: #ffb38a; } .pf-cold { color: #8fe8a0; } .pf-same { color: #c9d1d9; }
    .pr-flow .pf-k { display: inline-block; margin-right: 6px; padding: 0 6px; border-radius: 6px; font-weight: 700; font-size: 11px; background: rgba(255,255,255,.07); }
    .pr-flow.hot .pf-k { background: #5a2a14; color: #ffd2b8; } .pr-flow.cold .pf-k { background: #1d4a2c; color: #c4f5cf; }
    [data-tip], [data-tiph] { cursor: help; } button[data-tip] { cursor: default; }
    .pr-dstrip .pb-day b { font-size: 12.5px; white-space: nowrap; } .pr-dstrip .pb-day small { font-size: 10.5px; }
    .pb-day[disabled] { opacity: .3; cursor: default; } .pb-day[disabled]:hover { background: none; }
    .pr-spans { display: flex; gap: 6px; margin: -4px 0 10px; }
    .pr-span { flex: 1; display: flex; align-items: baseline; justify-content: center; gap: 8px; padding: 8px 10px; border-radius: 10px; border: 1px solid #2f3a4d; background: #0f141f; color: #c9d1d9; font: inherit; cursor: pointer; }
    .pr-span b { font-size: 13px; } .pr-span small { font-size: 11px; color: #7d8794; } .pr-span:hover:not([disabled]) { border-color: #4a5a78; }
    .pr-span.on { border-color: #e3b860; background: linear-gradient(180deg, #f0c66a, #d39a3a); color: #1a1205; } .pr-span.on small { color: #4a3510; }
    .pr-span[disabled] { opacity: .35; cursor: default; }
    .ph { padding: 10px 14px 8px; margin-bottom: 10px; border-radius: 14px; background: #0d1117; border: 1px solid #1f2735; }
    .ph-t { display: flex; align-items: baseline; gap: 6px 12px; flex-wrap: wrap; font-size: 13px; color: #c9d1d9; } .ph-t b { color: #f3e3b5; font-size: 13.5px; }
    .ph-t em { font-style: normal; font-weight: 700; } .ph-t em.lo { color: #8fe8a0; } .ph-t em.hi { color: #ff9a6a; } .ph-t small { color: #7d8794; }
    .ph-s { margin-left: auto; font-size: 11.5px; }
    .ph-bars { display: grid; grid-template-columns: repeat(24, 1fr); gap: 3px; height: 64px; margin-top: 8px; }
    .ph-b { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 4px; background: #111723; }
    .ph-b::before { content: ''; position: absolute; left: 0; right: 0; top: 50%; border-top: 1px solid #263044; }
    .ph-b i { position: absolute; left: 15%; width: 70%; border-radius: 2px; } .ph-b i.p { bottom: 50%; background: #8a4a2a; } .ph-b i.n { top: 50%; background: #2c5a3a; }
    .ph-b.lo { background: #10241a; } .ph-b.lo i { background: #5fd07a; } .ph-b.hi { background: #2a160e; } .ph-b.hi i { background: #ff8a5c; }
    .ph-b small { position: absolute; bottom: -15px; font-size: 10px; color: #6b7685; } .ph { padding-bottom: 20px; }
    .pr-hour { font-style: normal; font-size: 11.5px; padding: 2px 8px; border-radius: 999px; white-space: nowrap; border: 1px solid #2a3a52; background: #0f1828; color: #9ecbff; }
    /* 추천 구매 (2026-10-20 화면 정리) */
    .pb-hero { display: flex; align-items: center; gap: 12px 18px; flex-wrap: wrap; padding: 14px 18px; margin-bottom: 10px; border-radius: 16px;
      background: radial-gradient(120% 140% at 0% 0%, #2a1d0c 0%, #121826 45%, #0b0f17 100%); border: 1px solid #3a3220; }
    .pb-ht b { display: block; color: #f3e3b5; font-size: 20px; } .pb-ht small { color: #8b949e; font-size: 12px; }
    .pb-now { display: flex; align-items: baseline; gap: 8px; padding: 7px 14px; border-radius: 12px; background: rgba(255,123,84,.1); border: 1px solid rgba(255,123,84,.35); }
    .pb-now span { color: #ffb38a; font-size: 12px; font-weight: 700; } .pb-now b { color: #fff; font-size: 18px; } .pb-now em { font-style: normal; color: #ffb38a; font-size: 13px; font-weight: 600; }
    .pb-hero .pr-note { margin-left: auto; }
    .pb-meta { color: #9aa4b2; font-size: 12.5px; line-height: 1.5; } .pb-meta span { border-bottom: 1px dotted #4d5868; cursor: help; }
    .pb-sec { margin-bottom: 14px; } .pb-sh { font-weight: 700; font-size: 14.5px; margin: 6px 2px 8px; }
    .pb-sec.up .pb-sh { color: #7ee07a; } .pb-sec.dn .pb-sh { color: #ff8a80; }
    .pb-sec.dn .pb-card { border-color: #3a2424; }
    .pb-pl { display: flex; align-items: baseline; gap: 6px; } .pb-pct small.pb-lb { font-size: 11px; font-weight: 600; color: #8b949e; margin: 0; }
    .pb-pct small { white-space: nowrap; } .pb-pct small.pb-great { color: #f3d38a; font-size: 11px; font-weight: 800; margin-top: 2px; } .pb-pct small.pb-net { font-size: 11.5px; font-weight: 700; margin-top: 1px; cursor: help; } .pb-pct small.pb-pp { color: #c9d1d9; font-size: 12px; font-weight: 600; margin-top: 3px; }
    .pb-days { display: grid; grid-template-columns: repeat(13, minmax(0, 1fr)); gap: 4px; padding: 5px; margin-bottom: 10px; border-radius: 14px; background: #0d1117; border: 1px solid #1f2735; }
    .pb-day { position: relative; display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 8px 2px 7px; border: 0; border-radius: 10px; background: none; color: #c9d1d9; font: inherit; cursor: pointer; transition: .12s; }
    .pb-day b { font-size: 13px; } .pb-day small { font-size: 11px; color: #7d8794; }
    .pb-day:hover { background: #151b28; } .pb-day.past { opacity: .55; } .pb-day.past:hover { opacity: .85; }
    .pb-day.today { box-shadow: inset 0 0 0 1.5px rgba(255,123,84,.7); }
    .pb-day.today i { position: absolute; top: -7px; left: 50%; transform: translateX(-50%); padding: 0 6px; border-radius: 999px; background: #ff7b54; color: #fff; font-style: normal; font-size: 10px; font-weight: 800; line-height: 15px; }
    .pb-day.on { background: linear-gradient(180deg, #f0c66a, #d39a3a); color: #1a1205; opacity: 1; } .pb-day.on small { color: #4a3510; }
    .pb-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 4px 2px 8px; }
    .pb-bt { color: #c9d1d9; font-size: 14px; } .pb-bt b { color: #f3e3b5; } .pb-bt small { color: #7d8794; font-size: 12px; margin-left: 6px; }
    .pb-opts { margin-left: auto; display: flex; gap: 14px; flex-wrap: wrap; } .pb-opts .pr-nohot { margin: 0; float: none; }
    .pb-cats { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; margin-bottom: 10px; } .pb-cats .pr-chip { flex: none; }
    .pb-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 460px), 1fr)); gap: 8px; }
    .pb-card { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px; border-radius: 14px; background: #0f141f; border: 1px solid #1f2735; min-width: 0; }
    .pb-card.top { border-color: #4a3d1e; background: linear-gradient(135deg, #1b1610, #0f141f 60%); }
    .pb-h { display: flex; align-items: center; gap: 10px; min-width: 0; }
    .pb-rk { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: #1b2230; color: #9aa4b2; font-size: 12px; font-weight: 800; }
    .pb-card.top .pb-rk { background: #e3b860; color: #1a1205; }
    .pb-h img { flex: none; width: 42px; height: 42px; border-radius: 10px; background: #0b0f17; border: 1px solid #263044; object-fit: contain; }
    .pb-nm { flex: 1; min-width: 0; display: flex; flex-direction: column; } .pb-nm b { font-size: 14px; color: #e6edf3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pb-nm small { color: #7d8794; font-size: 11.5px; }
    .pb-now2 { margin-top: 3px; font-size: 12px; color: #9ecbff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .pb-now2 b { color: #e6edf3; } .pb-now2.na { color: #6b7685; }
    .pb-pct { flex: none; display: flex; flex-direction: column; align-items: flex-end; font-size: 20px; font-weight: 800; line-height: 1.1; }
    .pb-pct small { font-size: 11px; font-weight: 400; color: #7d8794; margin-top: 2px; }
    .pb-f { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding-left: 34px; }
    .pb-buy { color: #e6edf3; font-size: 13px; font-weight: 700; margin-right: 2px; } .pb-buy small { color: #7d8794; font-weight: 400; margin-left: 1px; }
    .pb-ses { display: contents; } .pb-ses i { font-style: normal; font-size: 11px; padding: 2px 7px; border-radius: 999px; background: #121826; border: 1px solid #222b3a; white-space: nowrap; }
    .pb-why { font-size: 11px; color: #ffb38a; } .pb-pct, .pb-ses i { cursor: help; }
    .pb-act { font-style: normal; font-size: 12px; padding: 2px 9px; border-radius: 999px; white-space: nowrap; font-weight: 600; }
    .pb-act.ok { background: #10241a; border: 1px solid #2c5a3a; color: #8fe8a0; } .pb-act.ng { background: #2a1213; border: 1px solid #5a2a2a; color: #ff8a80; }
    .pb-chk { padding: 10px 14px; margin-bottom: 10px; border-radius: 12px; background: #0f1828; border: 1px solid #2a3a52; color: #c9d1d9; font-size: 13px; line-height: 1.6; }
    .pb-chk b { color: #9ecbff; margin-right: 4px; } .pb-chk em { font-style: normal; font-weight: 800; } .pb-chk small { color: #7d8794; }
    .pb-chk-n { display: block; font-size: 11.5px; }
    .pb-sbuy2 { grid-template-columns: repeat(6, minmax(0, 1fr)); } .pb-shs { color: #7d8794; font-weight: 400; font-size: 12px; margin-left: 8px; }
    .pb-sbuy { margin: 0 0 10px; }
    .pb-spark { flex: none; background: #0b0f17; border: 1px solid #1f2735; border-radius: 8px; }
    .pb-spark polyline { fill: none; stroke-width: 1.6; stroke-linejoin: round; } .pb-spark .p { stroke: #6b7685; opacity: .8; } .pb-spark .c { stroke: #f0c66a; stroke-width: 2.2; }
    .pb-spark .b { stroke: #263044; stroke-dasharray: 2 3; } .pb-spark .t { stroke: #ff7b54; opacity: .6; }
    .pb-sl { font-size: 11px; color: #8b949e; display: inline-flex; align-items: center; gap: 4px; } .pb-sl i { display: inline-block; width: 12px; height: 2px; }
    .pb-sl i.c { background: #f0c66a; } .pb-sl i.p { background: #6b7685; margin-left: 4px; } .pb-sbuy .pr-span { flex-direction: column; align-items: center; gap: 2px; }
    .pb-orien { margin-bottom: 10px; padding: 10px 14px; border-radius: 12px; background: #13110c; border: 1px solid #3a3220; }
    .pb-orien summary { cursor: pointer; color: #f3e3b5; font-weight: 700; font-size: 13.5px; } .pb-orien summary small { color: #8b949e; font-weight: 400; margin-left: 6px; }
    .pb-orien ul { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
    .pb-orien li { display: grid; grid-template-columns: 74px 1fr; gap: 0 8px; font-size: 13px; } .pb-orien li b { color: #e6edf3; font-weight: 600; }
    .pb-orien li small { grid-column: 2; color: #8b949e; font-size: 12px; }
    .po-k { grid-row: span 2; align-self: start; font-size: 11px; font-weight: 700; padding: 2px 6px; border-radius: 6px; text-align: center; }
    .po-k.ok { background: #10241a; color: #8fe8a0; } .po-k.mid { background: #2a2210; color: #f3d38a; } .po-k.na { background: #1b2230; color: #8b949e; }
    .pb-thin { padding: 10px 14px; margin-bottom: 10px; border-radius: 12px; background: #2a1d0c; border: 1px solid #6b4a1e; color: #f3d38a; font-size: 13px; line-height: 1.6; } .pb-thin small { color: #c9a95a; }
    .pb-sec.sf { padding: 12px; border-radius: 16px; background: linear-gradient(180deg, #0f1c16, #0b0f17 70%); border: 1px solid #234a32; }
    .pb-sec.sf .pb-sh { color: #8fe8a0; } .pb-card.sf { border-color: #234a32; background: #0e1612; }
    .pb-sh2 { color: #f3e3b5; margin-top: 4px; }
    /* 줄 이름표 카드 (2026-10-20) — 지난 시즌·이번 시즌·예상·시간대 */
    .pb-card.pc { gap: 0; padding: 10px 12px 6px; } .pb-card.pc .pb-h { margin-bottom: 6px; }
    .pc-row { display: grid; grid-template-columns: 70px 1fr; gap: 8px; align-items: start; padding: 6px 0; border-top: 1px solid #1a2130; }
    .pc-k { display: inline-block; text-align: center; font-size: 11px; font-weight: 700; padding: 3px 0; border-radius: 6px; white-space: nowrap; }
    .pc-legend .pc-k { padding: 2px 8px; margin: 0 4px 0 10px; } .pc-legend .pc-k:first-child { margin-left: 0; }
    .pc-k.past, .past > .pc-k { background: #1b2230; color: #aab4c2; }
    .pc-k.now, .now > .pc-k { background: #3a2c10; color: #f3d38a; }
    .pc-k.est, .est > .pc-k { background: #241a3a; color: #cdb8ff; border: 1px dashed #6b54a8; }
    .time > .pc-k { background: #0f1828; color: #9ecbff; }
    .pc-v { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; font-size: 13px; color: #c9d1d9; min-width: 0; }
    .pc-v b { color: #e6edf3; } .pc-s { font-size: 12px; color: #8b949e; }
    .now .pc-v b { color: #f3e3b5; } .est .pc-v { color: #cdb8ff; } .est .pc-v b { color: #e4d8ff; }
    .pc-big { font-size: 20px; font-weight: 800; line-height: 1.1; } .pc-big.up { color: #7ee07a; } .pc-big.dn { color: #ff8a80; }
    .pc-badge { margin-left: auto; flex: none; align-self: center; font-size: 11.5px; font-weight: 800; padding: 3px 9px; border-radius: 999px; background: #10241a; color: #8fe8a0; border: 1px solid #2c5a3a; }
    .pc-badge.g { background: #2a2210; color: #f3d38a; border-color: #6b5a2a; }
    .pc-tw { flex-basis: 100%; } .pc-t { border-collapse: collapse; font-size: 12px; font-variant-numeric: tabular-nums; margin-top: 2px; }
    .pc-t th, .pc-t td { padding: 3px 0 3px 18px; text-align: right; white-space: nowrap; } .pc-t th:first-child { text-align: left; color: #aab4c2; font-weight: 600; padding-left: 0; }
    .pc-t tr:first-child th { color: #6b7685; font-weight: 600; font-size: 11px; } .pc-t td { color: #c9d1d9; } .pc-t td.na { color: #4d5868; }
    .pc-t td small { margin-left: 4px; font-size: 11px; font-weight: 700; } .pc-v small.up { color: #7ee07a; } .pc-v small.dn { color: #ff8a80; }
    .pc-sp { display: flex; align-items: center; gap: 8px; flex-basis: 100%; margin-top: 2px; }
    .pb-card.pg { gap: 0; padding: 12px 14px 10px; }
    .pg-tw { overflow-x: auto; margin: 8px 0 6px; }
    .pg-t { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
    .pg-t th, .pg-t td { padding: 5px 8px; text-align: right; white-space: nowrap; } .pg-t th:first-child { text-align: left; color: #aab4c2; font-weight: 600; }
    .pg-t tr:first-child th { color: #7d8794; font-size: 11.5px; font-weight: 600; border-bottom: 1px solid #222b3a; } .pg-t tr:first-child th.sell { color: #f3e3b5; }
    .pg-t td { color: #c9d1d9; } .pg-t td.na { color: #4d5868; } .pg-t td small { font-size: 11px; font-weight: 700; margin-left: 4px; }
    .pg-t td small.up { color: #7ee07a; } .pg-t td small.dn { color: #ff8a80; }
    .pg-t tr.cur { background: rgba(227,184,96,.09); } .pg-t tr.cur th { color: #f3d38a; } .pg-t tr.cur td { color: #f3e3b5; }
    .pg-t tr.sep th, .pg-t tr.sep td { border-top: 1px solid #2f3a4d; }
    .pg-t td.est { color: #cdb8ff; background: #1a1430; outline: 1px dashed #6b54a8; outline-offset: -2px; } .pg-t td.est small { color: #cdb8ff; }
    .pg-t td.act { font-weight: 700; }
    .pg-foot { display: flex; flex-direction: column; gap: 6px; }
    .pg-f1 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; } .pg-f2 { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
    .pg-now { margin-top: 3px; font-size: 13.5px; font-weight: 700; color: #f3e3b5; cursor: help; } .pg-now small { font-size: 11px; font-weight: 400; color: #7d8794; margin-left: 2px; }
    .pg-lb { font-size: 12px; color: #8b949e; border-bottom: 1px dotted #4d5868; cursor: help; }
    .pc-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 0; padding: 8px 12px; margin-bottom: 10px; border-radius: 12px; background: #0d1117; border: 1px solid #1f2735; font-size: 12.5px; color: #9aa4b2; }
    .pc-legend small { color: #6b7685; margin-left: 8px; }
    .pb-dn { margin-top: 12px; } .pb-dn summary { cursor: pointer; color: #ff8a80; font-size: 13.5px; font-weight: 600; padding: 8px 2px; }
    .pb-dn[open] summary { margin-bottom: 6px; }
    @media (max-width: 760px) {
      .pb-days { display: flex; overflow-x: auto; padding-top: 10px; } .pb-day { flex: 0 0 64px; }
      .pb-hero .pr-note { margin-left: 0; } .pb-opts { margin-left: 0; }
      .pb-f { padding-left: 0; }
      /* 휴대폰: % 묶음을 이름 아래 줄로 — 옆에 두면 이름이 한 글자씩 세로로 찌그러졌다 (2026-10-20 사용자) */
      .pb-h { flex-wrap: wrap; row-gap: 6px; } .pb-nm { flex: 1 1 calc(100% - 90px); }
      .pb-pct { order: 3; flex: 1 1 100%; flex-direction: row; flex-wrap: wrap; align-items: baseline; justify-content: flex-start; gap: 2px 10px; padding: 6px 0 0 34px; border-top: 1px dashed #1f2735; font-size: 18px; }
      .pb-pct small, .pb-pct small.pb-pp, .pb-pct small.pb-net, .pb-pct small.pb-great { margin-top: 0; }
      .pb-pl { flex: 1 1 100%; } .pb-spark { width: 100%; height: 50px; }
      .pg-t th, .pg-t td { padding: 4px 5px; font-size: 12px; } .pg-t td small { display: block; margin: 0; }
      .pc-row { grid-template-columns: 62px 1fr; } .pc-sp { flex-wrap: wrap; } .pc-badge { order: 2; }
      .pr-b { flex-wrap: wrap; } .pr-b .pr-in { flex: 1 1 60%; } .pr-bper { order: 3; flex-basis: 100%; justify-content: flex-start; padding-left: 28px; }
      .pr-b .pr-rv { order: 2; flex-basis: 100%; flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding-left: 28px; min-width: 0; }
      .pr-body #priceApp { width: calc(100% - 32px); }
      .pr-rank { grid-template-columns: 1fr; } .pr-note { margin-left: 0; }
      .pr-ivs { flex-wrap: nowrap; overflow-x: auto; } .pr-cats { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
      .pr-tn { min-width: 160px; }
    }
    /* 실시간 시세 (/tli/live, 2026-10-20) — price.css 위에 */
    .lv-card { padding: 10px 12px; } .lv-card .pg-f2 { margin-top: 8px; padding-left: 34px; }
    .lv-big { flex: none; display: flex; flex-direction: column; align-items: flex-end; font-size: 20px; font-weight: 800; line-height: 1.1; }
    .lv-big.up { color: #7ee07a; } .lv-big.dn { color: #ff8a80; }
    .lv-big small { margin-top: 3px; font-size: 12px; font-weight: 400; color: #9aa4b2; white-space: nowrap; } .lv-big small b { color: #f3e3b5; }
    .lv-chip { font-style: normal; font-size: 11.5px; padding: 2px 8px; border-radius: 999px; border: 1px solid #2f3a4d; background: #121826; color: #c9d1d9; white-space: nowrap; }
    .lv-t td.na { color: #7d8794; font-size: 12px; }
    @media (max-width: 760px) {
      .lv-card .pb-h { flex-wrap: wrap; } .lv-big { order: 3; flex: 1 1 100%; flex-direction: row; align-items: baseline; gap: 8px; padding: 6px 0 0 34px; border-top: 1px dashed #1f2735; }
      .lv-card .pg-f2 { padding-left: 0; }
    }
    .lv-more { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 10px; } .lv-more small { color: #7d8794; font-size: 12px; }