/* Isolated Facebook Reels component. Original homepage selectors remain untouched. */
.fb-reels { --fbr-ink:#293b35; --fbr-muted:#5f665c; --fbr-gold:#80602e; box-sizing:border-box; max-width:1120px; margin:32px auto; padding:44px 28px; color:var(--fbr-ink); border-top:1px solid #d8c9ad; scroll-margin-top:32px; font-family:"Microsoft JhengHei","PingFang TC",sans-serif; }
.fb-reels *, .fb-reels-dialog * { box-sizing:border-box; }
.fb-reels-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:30px; }
.fb-reels--empty .fb-reels-heading { margin-bottom:0; }
.fb-reels-eyebrow { display:flex; align-items:center; gap:10px; margin:0 0 13px; color:var(--fbr-gold); font-size:12px; font-weight:800; letter-spacing:.16em; }
.fb-reels-symbol { display:inline-grid; place-items:center; width:26px; height:26px; background:#e7dfcf; color:#5b451f; border-radius:8px; font-size:15px; }
.fb-reels h2 { margin:0 0 12px; color:var(--fbr-ink); font-size:clamp(27px,3.3vw,38px); line-height:1.4; letter-spacing:.045em; }
.fb-reels-lead { margin:0; color:var(--fbr-muted); font-size:17px; line-height:1.8; }
.fb-reels-all { flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; gap:18px; min-height:46px; padding:11px 19px; border:1px solid #b8a47f; border-radius:999px; color:#665025; font-size:15px; font-weight:700; text-decoration:none; background:#fffdf7; }
.fb-reels-all:hover { background:#eee5d2; }
.fb-reels-track { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin:0; padding:0 0 10px; list-style:none; }
.fb-reels-card { min-width:0; overflow:hidden; border:1px solid #d8cdb8; border-radius:20px; background:#fffef9; box-shadow:0 10px 25px #69512b0d; }
.fb-reels-cover { position:relative; display:block; aspect-ratio:9/16; overflow:hidden; color:#fff; background:#ebe6da; text-decoration:none; }
.fb-reels-placeholder { position:absolute; inset:0; display:grid; place-items:center; padding:28px; text-align:center; background:linear-gradient(145deg,#eee5d2,#bcc6b4); color:#354f43; font-size:25px; font-weight:700; letter-spacing:.12em; }
.fb-reels-placeholder small { display:block; margin-top:10px; font-size:10px; letter-spacing:.16em; }
.fb-reels-cover img { position:relative; display:block; width:100%; height:100%; object-fit:cover; }
.fb-reels-cover img[hidden] { display:none; }
.fb-reels-cover::after { content:""; position:absolute; inset:45% 0 0; background:linear-gradient(transparent,#14211df5); pointer-events:none; }
.fb-reels-badge { position:absolute; z-index:1; left:16px; top:16px; padding:7px 11px; border:1px solid #ffffff66; border-radius:999px; background:#243b32dd; color:#fffdf4; font-size:12px; font-weight:700; letter-spacing:.035em; }
.fb-reels-play { position:absolute; z-index:1; top:43%; left:50%; transform:translate(-50%,-50%); display:grid; place-items:center; width:62px; height:62px; padding-left:4px; border-radius:50%; border:1px solid #ffffffe0; background:#fffcf0e8; color:#394b3e; box-shadow:0 4px 24px #0002; font-size:22px; }
.fb-reels-caption { position:absolute; z-index:1; left:20px; right:20px; bottom:21px; color:#fff; }
.fb-reels-caption small { display:block; margin-bottom:9px; color:#f5e8ca; font-size:12px; letter-spacing:.08em; }
.fb-reels-caption strong { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; overflow-wrap:anywhere; font-size:21px; line-height:1.5; font-weight:700; text-wrap:pretty; }
.fb-reels-meta { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:82px; padding:14px 19px; }
.fb-reels-meta p { margin:0; color:#59635a; font-size:13px; line-height:1.7; }
.fb-reels-meta time { font-size:14px; }
.fb-reels-meta a { display:inline-flex; min-height:44px; align-items:center; color:#76541f; font-size:14px; font-weight:700; text-decoration:underline; text-underline-offset:4px; white-space:nowrap; }
.fb-reels-bottom { display:flex; justify-content:space-between; gap:20px; align-items:center; margin-top:12px; }
.fb-reels-note { margin:0; color:#61665c; font-size:14px; line-height:1.8; }
.fb-reels-arrows { display:none; gap:8px; }
.fb-reels-arrow { display:grid; place-items:center; width:46px; height:46px; border:1px solid #bba783; border-radius:50%; color:#62491f; background:#fffdf6; font-size:24px; cursor:pointer; }
.fb-reels a:focus-visible, .fb-reels button:focus-visible, .fb-reels-dialog a:focus-visible, .fb-reels-dialog button:focus-visible { outline:3px solid #367568; outline-offset:3px; }
.fb-reels-cover:focus-visible { outline-offset:-5px; }
.fb-reels-dialog { padding:0; width:min(440px,calc(100vw - 24px)); max-height:calc(100vh - 24px); max-height:calc(100dvh - 24px); border:1px solid #cabc9f; border-radius:18px; overflow:auto; background:#fffdf7; color:#293b35; box-shadow:0 24px 80px #0006; font-family:"Microsoft JhengHei","PingFang TC",sans-serif; }
.fb-reels-dialog::backdrop { background:#16231edb; }
.fb-reels-dialog-head { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:10px 14px; }
.fb-reels-dialog h3 { margin:0; color:#293b35; font-size:17px; line-height:1.6; }
.fb-reels-close { flex-shrink:0; width:44px; height:44px; border:1px solid #d0c1a9; border-radius:50%; background:#f5efe2; color:#3c4a3e; font-size:26px; cursor:pointer; }
.fb-reels-player { width:min(100%,calc((100vh - 210px) * 9 / 16)); width:min(100%,calc((100dvh - 210px) * 9 / 16)); min-width:160px; margin:auto; aspect-ratio:9/16; background:#16231e; }
.fb-reels-player iframe { display:block; border:0; width:100%; height:100%; }
.fb-reels-dialog-foot { padding:12px 18px 18px; text-align:center; }
.fb-reels-dialog-foot p { margin:0 0 8px; color:#606458; font-size:13px; line-height:1.7; }
.fb-reels-dialog-foot a { display:inline-flex; align-items:center; min-height:44px; color:#674919; font-size:15px; font-weight:700; text-underline-offset:4px; }
@media (max-width:720px) {
 .fb-reels { margin:22px auto; padding:32px 20px; }
 .fb-reels-heading { display:block; margin-bottom:23px; }
 .fb-reels-all { margin-top:19px; font-size:14px; }
 .fb-reels-track { display:grid; grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:min(79%,310px); gap:14px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:thin; scrollbar-color:#c2ab80 #ece5d7; padding-bottom:16px; }
 .fb-reels-card { scroll-snap-align:start; }
 .fb-reels-caption { left:16px; right:16px; bottom:17px; }
 .fb-reels-caption strong { font-size:19px; }
 .fb-reels-meta { flex-wrap:wrap; padding:10px 15px; gap:0; min-height:100px; }
 .fb-reels-meta p { width:100%; }
 .fb-reels-bottom { align-items:flex-start; gap:8px; }
 .fb-reels-arrows { display:flex; flex-shrink:0; }
 .fb-reels-note { font-size:13px; }
}
@media (prefers-reduced-motion:reduce) { .fb-reels-track { scroll-behavior:auto; } }
