/* 品傳媒 社群熱議（沿用佈景主題變數：--pin-brand、--pin-text、--pin-muted、--pin-border、--pin-chip-bg、--pin-chip-text） */
.pin-st { margin: 0 0 64px; }
.pin-st .pin-section-head { align-items: baseline; }
.pin-st__note { font-size: 13px; color: var(--pin-muted, #888); }
.pin-st__tabs { margin-bottom: 20px; }
.pin-st__source { margin: 16px 0 0; font-size: 12px; color: var(--pin-muted, #888); }

/* YouTube 發燒 */
.pin-st-yt { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 20px; }
.pin-st-yt__media { position: relative; aspect-ratio: 16 / 9; border-radius: 10px; overflow: hidden; background: #000; }
.pin-st-yt__play { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: pointer; }
.pin-st-yt__play img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease, opacity .3s; }
.pin-st-yt__play:hover img { transform: scale(1.04); opacity: .85; }
.pin-st-yt__icon { position: absolute; left: 50%; top: 50%; width: 56px; height: 40px; margin: -20px 0 0 -28px; border-radius: 12px; background: rgba(0, 0, 0, .7); transition: background .2s; }
.pin-st-yt__icon::after { content: ""; position: absolute; left: 23px; top: 12px; border-style: solid; border-width: 8px 0 8px 14px; border-color: transparent transparent transparent #fff; }
.pin-st-yt__play:hover .pin-st-yt__icon { background: #ff0033; }
.pin-st-yt__frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.pin-st-yt__rank { position: absolute; left: 8px; top: 8px; min-width: 28px; height: 28px; padding: 0 6px; border-radius: 8px; background: var(--pin-brand, #f8b62b); color: #1a1a1a; font-size: 15px; font-weight: 900; line-height: 28px; text-align: center; pointer-events: none; }
.pin-st-yt__title { margin: 10px 0 4px; font-size: 15px; font-weight: 700; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pin-st-yt__title a { color: var(--pin-text, #1a1a1a); }
.pin-st-yt__title a:hover { color: var(--pin-chip-text, #b07800); }
.pin-st-yt__meta { margin: 0; font-size: 13px; color: var(--pin-muted, #888); }

/* 熱搜關鍵字：電腦版兩欄 */
.pin-st-tr { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-flow: column; grid-template-rows: repeat(var(--pin-st-rows, 5), auto); gap: 0 40px; }
.pin-st-tr__item { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--pin-border, #eee); min-width: 0; }
.pin-st-tr__n { flex: none; width: 28px; font-size: 22px; font-weight: 900; line-height: 1.2; color: var(--pin-brand, #f8b62b); }
.pin-st-tr__body { min-width: 0; }
.pin-st-tr__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.pin-st-tr__kw { font-size: 17px; font-weight: 800; color: var(--pin-text, #1a1a1a); }
.pin-st-tr__kw:hover { color: var(--pin-chip-text, #b07800); }
.pin-st-tr__traffic { font-size: 12px; font-weight: 700; padding: 1px 8px; border-radius: 999px; background: var(--pin-chip-bg, #fff4dc); color: var(--pin-chip-text, #b07800); }
.pin-st-tr__news { display: block; margin-top: 4px; font-size: 13px; line-height: 1.5; color: var(--pin-muted, #888); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pin-st-tr__news:hover { color: var(--pin-text, #1a1a1a); }

/* 編輯精選 */
.pin-st-picks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 20px; align-items: start; }
.pin-st-pick { min-width: 0; }
.pin-st-pick__meta { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 13px; min-width: 0; }
.pin-st-pick__platform { flex: none; padding: 1px 8px; border-radius: 999px; background: var(--pin-text, #1a1a1a); color: var(--pin-bg, #fff); font-size: 12px; font-weight: 700; }
.pin-st-pick--threads .pin-st-pick__platform, .pin-st-pick--x .pin-st-pick__platform { background: #000; color: #fff; }
.pin-st-pick--instagram .pin-st-pick__platform { background: #e1306c; color: #fff; }
.pin-st-pick--tiktok .pin-st-pick__platform { background: #fe2c55; color: #fff; }
.pin-st-pick--youtube .pin-st-pick__platform { background: #ff0033; color: #fff; }
.pin-st-pick__title { font-weight: 700; color: var(--pin-text, #1a1a1a); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pin-st-pick__embed { min-width: 0; }
.pin-st-pick__embed blockquote { margin: 0 !important; max-width: 100% !important; min-width: 0 !important; }
.pin-st-pick__embed iframe { max-width: 100% !important; }
.pin-st-pick__embed.is-embedded > .pin-st-pick__link { display: none; }
.pin-st-pick__link { display: block; padding: 16px; border: 1px solid var(--pin-border, #eee); border-radius: 10px; font-size: 14px; font-weight: 700; color: var(--pin-text, #1a1a1a); word-break: break-all; }
.pin-st-pick__link span { display: block; margin-top: 4px; font-size: 12px; font-weight: 400; color: var(--pin-muted, #888); }
.pin-st-pick__link:hover { border-color: var(--pin-brand, #f8b62b); }

@media (max-width: 1023px) {
	.pin-st-yt, .pin-st-picks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
	.pin-st { margin-bottom: 48px; }
	.pin-st-yt { grid-template-columns: minmax(0, 1fr); gap: 20px; }
	.pin-st-picks { grid-template-columns: minmax(0, 1fr); }
	.pin-st-tr { grid-template-columns: minmax(0, 1fr); grid-auto-flow: row; grid-template-rows: none; }
}
