/* === 시세흐름 === */
.price-trend-wrap {max-width:800px; margin:42px auto 72px; padding:0 20px;}
.price-trend-header {margin-bottom:28px;}
.price-trend-eyebrow {display:inline-flex; margin-bottom:9px; padding:0; color:#71717a; background:transparent; font-size:11px; font-weight:750; letter-spacing:0.03em;}
.price-trend-title {margin:0 0 8px; color:#18181b; font-size:28px; font-weight:800; letter-spacing:-0.04em;}
.price-trend-desc {margin:0; color:#71717a; font-size:14px; line-height:1.55;}
.pt-device-picker {margin-bottom:12px; padding:17px; border:1px solid #e4e4e7; border-radius:14px; background:#fff; box-shadow:0 1px 2px rgba(24,24,27,0.04);}
.pt-device-picker__head {display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:14px;}
.pt-device-picker__eyebrow {display:block; margin-bottom:4px; color:#71717a; font-size:11px; font-weight:700;}
.pt-device-picker__head h2 {margin:0; color:#18181b; font-size:18px; font-weight:800; letter-spacing:-0.03em;}
.pt-device-filter {display:flex; gap:6px; margin-bottom:13px; overflow-x:auto; scrollbar-width:none;}
.pt-device-filter::-webkit-scrollbar {display:none;}
.pt-device-filter__button {min-height:34px; padding:0 13px; border:1px solid #e4e4e7; border-radius:999px; color:#52525b; background:#fff; font-size:12px; font-weight:700; white-space:nowrap; cursor:pointer; transition:border-color .15s, color .15s, background-color .15s;}
.pt-device-filter__button:hover {border-color:#a1a1aa; color:#18181b;}
.pt-device-filter__button.active {border-color:#27272a; color:#fff; background:#27272a;}
.pt-device-grid {display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:10px;}
.pt-device-card {position:relative; display:flex; align-items:center; flex-direction:column; min-width:0; min-height:158px; padding:12px 9px 11px; overflow:hidden; border:1px solid #e4e4e7; border-radius:12px; color:#27272a; background:#fafafa; text-align:center; cursor:pointer; transition:border-color .15s, background-color .15s, box-shadow .15s, transform .15s;}
.pt-device-card:hover {border-color:#a1a1aa; background:#fff; transform:translateY(-1px);}
.pt-device-card.active {border-color:#1e3a5f; background:#fff; box-shadow:0 0 0 1px #1e3a5f;}
.pt-device-card[hidden] {display:none;}
.pt-device-card__visual {display:flex; align-items:center; justify-content:center; width:100%; height:86px; margin-bottom:7px;}
.pt-device-card__visual img {display:block; max-width:82px; max-height:82px; object-fit:contain;}
.pt-device-card__info {display:block; width:100%; min-width:0;}
.pt-device-card__info strong {display:-webkit-box; overflow:hidden; color:#27272a; font-size:13px; font-weight:750; line-height:1.3; letter-spacing:-0.02em; -webkit-box-orient:vertical; -webkit-line-clamp:2;}
.pt-device-card__info small {display:block; margin-top:3px; color:#71717a; font-size:11px; font-weight:600;}
.pt-device-card__check {position:absolute; top:8px; right:8px; display:none; align-items:center; justify-content:center; width:20px; height:20px; border-radius:50%; color:#fff; background:#1e3a5f; font-size:12px; font-weight:800;}
.pt-device-card.active .pt-device-card__check {display:flex;}
.pt-device-more {display:block; width:100%; min-height:42px; margin-top:12px; border:1px solid #e4e4e7; border-radius:10px; color:#3f3f46; background:#fff; font-size:12px; font-weight:750; cursor:pointer;}
.pt-device-more:hover {border-color:#a1a1aa; background:#fafafa;}
.pt-device-more[hidden] {display:none;}
.price-trend-controls {display:flex; align-items:flex-end; gap:10px; margin-bottom:30px; padding:13px; border:1px solid #e4e4e7; border-radius:12px; background:#fff; box-shadow:0 1px 2px rgba(24,24,27,0.04);}
.price-trend-controls--gaip {align-items:center; justify-content:space-between;}
.price-trend-control-label {color:#52525b; font-size:13px; font-weight:750;}
.price-trend-select-wrap {flex:1; min-width:200px;}
.price-trend-select-wrap label {display:block; margin-bottom:6px; color:#71717a; font-size:12px; font-weight:600;}
.price-trend-select {width:100%; min-height:44px; padding:0 42px 0 13px; border:1px solid #e4e4e7; border-radius:9px; color:#27272a; background:#fff; appearance:none; -webkit-appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M6 8L1 3h10z' fill='%2371717a'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; font-size:14px; font-weight:600;}
.price-trend-tabs {display:flex; flex-shrink:0; gap:6px;}
.pt-tab {min-height:44px; padding:0 19px; border:1px solid #e4e4e7; border-radius:9px; color:#52525b; background:#fff; font-size:13px; font-weight:700; cursor:pointer; transition:border-color 0.15s, background-color 0.15s, color 0.15s;}
.pt-tab:hover {border-color:#a1a1aa; background:#f4f4f5;}
.pt-tab.active {border-color:#1e3a5f; color:#fff; background:#1e3a5f;}
.pt-detail-link {box-sizing:border-box; display:flex; align-items:center; justify-content:center; width:100%; min-height:48px; margin:18px 0 0; padding:11px 16px; border:1px solid #d4d4d8; border-radius:10px; color:#27272a; background:#fff; font-size:13px; font-weight:750; line-height:1.35; text-align:center; text-decoration:none;}
.pt-detail-link::after {margin-left:7px; color:#52525b; font-size:15px; content:"\2192"; transition:transform 0.15s;}
.pt-detail-link:hover {border-color:#a1a1aa; color:#18181b; background:#f4f4f5; text-decoration:none;}
.pt-detail-link:hover::after {transform:translateX(2px);}
.pt-detail-link[hidden] {display:none;}
.price-trend-chart-head {display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin:0 0 10px;}
.price-trend-chart-head h3 {margin:0 0 7px; color:#27272a; font-size:18px; font-weight:750; letter-spacing:-0.02em;}
.price-trend-period {display:flex; flex-shrink:0; gap:2px; margin:0; padding:3px; border-radius:10px; background:#f4f4f5;}
.pt-period {min-width:56px; min-height:34px; padding:0 11px; border:0; border-radius:8px; color:#71717a; background:transparent; font-size:12px; font-weight:650; cursor:pointer; transition:background-color 0.15s, color 0.15s, box-shadow 0.15s;}
.pt-period:hover {color:#27272a;}
.pt-period.active {color:#18181b; background:#fff; box-shadow:0 1px 3px rgba(24,24,27,0.12);}
.price-trend-chart-wrap {position:relative; height:300px; margin-bottom:10px; padding:10px 0 18px; border:0; border-radius:0; background:transparent;}
.pt-chart-empty {position:absolute; top:50%; left:50%; width:80%; transform:translate(-50%,-50%); color:#a1a1aa; font-size:14px; line-height:1.55; text-align:center;}
.price-trend-table-wrap {padding-top:28px; border-top:1px solid #e4e4e7;}
.price-trend-table-wrap h3 {margin:0 0 12px; color:#27272a; font-size:18px; font-weight:750; letter-spacing:-0.02em;}
.price-trend-table {width:100%; border:0; border-spacing:0; border-collapse:collapse;}
.price-trend-table th {padding:10px 12px; border-bottom:1px solid #d4d4d8; color:#a1a1aa; background:transparent; font-size:11px; font-weight:650; text-align:left;}
.price-trend-table td {padding:13px 12px; border-bottom:1px solid #f0f0f1; color:#52525b; background:#fff; font-size:13px; transition:background-color 0.15s;}
.price-trend-table th:nth-child(2),
.price-trend-table th:nth-child(3),
.price-trend-table td:nth-child(2),
.price-trend-table td:nth-child(3) {text-align:right;}
.price-trend-table tbody tr:hover td {background:#fafafa;}
.price-trend-table tbody tr.pt-price-row--latest td {background:#fafafa;}
.price-trend-table tbody tr:last-child td {border-bottom:0;}
.price-trend-table td strong {color:#27272a; font-weight:750;}
.pt-change {display:inline-flex; align-items:center; min-height:24px; padding:2px 7px; border-radius:999px; font-size:11px; font-weight:700; white-space:nowrap;}
.pt-change--up {color:#b42318; background:#fff1f0;}
.pt-change--down {color:#1769aa; background:#eef6ff;}
.pt-change--flat {color:#71717a; background:#f4f4f5;}
.pt-change--none {padding-right:0; color:#a1a1aa; background:transparent;}
@media (max-width:768px){
    .price-trend-wrap {margin:24px auto 52px; padding:0 16px;}
    .price-trend-header {margin-bottom:20px;}
    .price-trend-title {font-size:24px;}
    .price-trend-desc {font-size:13px;}
    .pt-device-picker {padding:14px 12px; border-radius:12px;}
    .pt-device-picker__head {align-items:center; margin-bottom:12px;}
    .pt-device-picker__head h2 {font-size:17px;}
    .pt-device-filter {margin-right:-12px; margin-bottom:12px; padding-right:12px;}
    .pt-device-filter__button {min-height:36px; padding:0 12px;}
    .pt-device-grid {display:flex; gap:9px; margin-right:-12px; padding:1px 12px 4px 1px; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity; scrollbar-width:none; touch-action:pan-x pan-y;}
    .pt-device-grid::-webkit-scrollbar {display:none;}
    .pt-device-card {flex:0 0 clamp(128px, 38vw, 146px); min-height:151px; padding:10px 8px; scroll-snap-align:start;}
    .pt-device-card__visual {height:80px; margin-bottom:6px;}
    .pt-device-card__visual img {max-width:76px; max-height:76px;}
    .pt-device-card__info strong {font-size:13px;}
    .pt-device-more {display:none !important;}
    .price-trend-controls {flex-direction:column; align-items:stretch; gap:11px; margin-bottom:26px; padding:12px;}
    .price-trend-select-wrap {min-width:0;}
    .price-trend-select {min-height:44px; font-size:13px;}
    .price-trend-tabs {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); width:100%;}
    .pt-tab {min-height:44px; padding:0 12px;}
    .pt-detail-link {width:100%; min-height:48px;}
    .price-trend-chart-head {align-items:stretch; flex-direction:column; gap:12px;}
    .price-trend-chart-head h3 {font-size:17px;}
    .price-trend-period {display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); width:100%;}
    .pt-period {min-width:0; min-height:38px;}
    .price-trend-chart-wrap {height:240px; padding:8px 0 14px; border-radius:0;}
    .price-trend-table-wrap {padding-top:20px;}
    .price-trend-table-wrap h3 {font-size:17px;}
    .price-trend-table th {padding:9px 6px;}
    .price-trend-table td {padding:12px 6px; font-size:12px;}
}

/* 임베드 모드 (상품 상세 등에 삽입 시) — 길이 ~50% 축소 */
.pt-embed {max-width:none; margin:8px 0 16px; padding:0;}
.pt-embed .price-trend-controls {margin-bottom:10px; gap:0;}
.pt-embed .price-trend-tabs {width:100%; justify-content:flex-start; gap:4px;}
.pt-embed .pt-tab {padding:6px 12px; font-size:12px;}
.pt-embed .price-trend-chart-wrap {height:160px; min-height:160px; padding:8px; margin-bottom:12px; border:1px solid #eee; border-radius:8px; background:#fff;}
.pt-embed .price-trend-table-wrap {padding-top:0; border-top:0;}
.pt-embed .price-trend-table-wrap h3 {font-size:13px; margin:0 0 6px; color:#666;}
.pt-embed .pt-embed-period {font-size:11px; color:#aaa; font-weight:400;}
.pt-embed .price-trend-table th {padding:6px 8px; font-size:11px;}
.pt-embed .price-trend-table td {padding:6px 8px; font-size:12px;}
.pt-embed .pt-embed-more {display:block; text-align:right; padding:10px 0 4px; font-size:12px; color:#1e3a5f; text-decoration:none; font-weight:500;}
.pt-embed .pt-embed-more:hover {text-decoration:underline;}
.pt-embed .pt-detail-link {width:100%; min-height:42px; margin-top:10px; padding:9px 14px; border-radius:8px; color:#27272a; background:#fff; font-size:12px; text-decoration:none;}
.pt-embed .pt-detail-link:hover {color:#18181b; background:#f4f4f5; text-decoration:none;}
@media (max-width:768px){
    .pt-embed .price-trend-controls {flex-direction:row; align-items:flex-end; padding:0;}
    .pt-embed .price-trend-tabs {display:flex; width:100%;}
    .pt-embed .price-trend-chart-wrap {height:140px; min-height:140px; padding:6px;}
}
