#trending-templates { padding:clamp(40px,6vw,76px) 0; background:radial-gradient(ellipse at 100% 0,rgba(109,40,217,.07),transparent 65%),var(--background-2); border-block:1px solid var(--border); }
#trending-templates h2 { display:flex; align-items:center; gap:12px; }
#trending-templates .pws-trending-fire { width:27px; height:30px; color:#c45b0c; fill:rgba(245,158,11,.12); }
#trending-templates .pws-trending-controls { display:flex; gap:8px; flex-shrink:0; }
#trending-templates [hidden] { display:none; }
#trending-templates button { width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--border); border-radius:50%; color:var(--text-main); background:var(--card-background); transition:background .2s,border-color .2s; }
#trending-templates button:hover:not(:disabled) { color:var(--card-background); background:var(--primary); border-color:var(--primary); }
#trending-templates button:disabled { opacity:.35; cursor:default; }
#trending-templates button:focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
#trending-templates .pws-trending-track { display:flex; gap:22px; margin:0 -3px; padding:8px 3px 18px; list-style:none; overflow-x:auto; scroll-snap-type:x proximity; scroll-padding-inline:3px; scrollbar-width:none; overscroll-behavior-x:contain; }
#trending-templates .pws-trending-track::-webkit-scrollbar { display:none; }
#trending-templates .pws-trending-track > li { flex:0 0 calc((100% - 44px)/3); scroll-snap-align:start; }
#trending-templates .pws-latest-card { display:flex; }
#trending-templates .pws-latest-card-link { width:100%; }
#trending-templates .pws-latest-preview { aspect-ratio:1200/630; flex-shrink:0; }
#trending-templates .pws-latest-image { object-fit:contain; object-position:center; }
#trending-templates .pws-trending-rank { position:absolute; top:12px; left:12px; display:flex; align-items:center; gap:7px; padding:5px 12px 5px 5px; border-radius:999px; border:1px solid rgba(255,255,255,.3); background:linear-gradient(120deg,#4c1d95,#6d28d9); color:#fff; box-shadow:0 4px 14px rgba(30,10,65,.22); font-size:11px; font-weight:750; }
#trending-templates .pws-trending-rank-number { min-width:28px; height:28px; padding:0 5px; display:grid; place-items:center; background:rgba(255,255,255,.16); border-radius:50%; font-size:12px; }
#trending-templates .pws-trending-rank svg { width:14px; height:16px; color:#fde68a; fill:rgba(253,230,138,.18); }
#trending-templates .pws-trending-category { display:inline-flex; align-items:center; gap:7px; align-self:flex-start; color:var(--primary); padding:0; font-size:13px; font-weight:750; margin-bottom:12px; max-width:100%; overflow-wrap:anywhere; }
#trending-templates .pws-trending-category > span { width:6px; height:6px; border-radius:50%; background:var(--primary); flex-shrink:0; }
#trending-templates .pws-trending-categories { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 20px; }
#trending-templates .pws-trending-categories > span { max-width:100%; overflow-wrap:anywhere; padding:6px 10px; border:1px solid var(--border); border-radius:7px; background:var(--background-2); color:var(--text-secondary); font-size:12px; line-height:1.5; }
#trending-templates .pws-latest-commerce { padding-top:16px; border-top:1px solid var(--border); }
#trending-templates h3 { font-size:20px; line-height:1.45; font-weight:750; margin-bottom:10px; }
#trending-templates .pws-latest-author { margin-bottom:16px; font-size:14px; line-height:1.6; }
#trending-templates .pws-latest-price { font-size:24px; line-height:1.3; }
#trending-templates .pws-latest-rating { font-size:13px; line-height:1.5; }
#trending-templates .pws-latest-rating strong { font-size:15px; }
#trending-templates .pws-latest-rating small { font-size:12px; }
#trending-templates .pws-latest-details { font-size:14px; line-height:1.5; min-height:46px; }
#trending-templates .pws-trending-footer { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:10px; color:var(--text-secondary); font-size:12px; }
#trending-templates .pws-trending-progress { width:130px; height:3px; background:var(--border); border-radius:5px; overflow:hidden; }
#trending-templates .pws-trending-progress span { display:block; height:100%; width:0; background:var(--primary); border-radius:5px; }
#trending-templates .pws-trending-empty { padding:30px; border:1px solid var(--border); border-radius:22px; background:var(--card-background); }
#trending-templates .pws-trending-empty p { color:var(--text-secondary); font-size:14px; margin:8px 0 20px; }
#trending-templates .pws-trending-empty a { width:fit-content; }
@media (max-width:900px) { #trending-templates .pws-trending-track > li { flex-basis:calc((100% - 22px)/2.2); } }
@media (max-width:600px) { #trending-templates h3 { font-size:19px; } #trending-templates .pws-latest-body { padding:20px; } }
@media (max-width:600px) { #trending-templates .pws-latest-heading { gap:16px; } #trending-templates .pws-trending-controls { align-self:flex-end; } #trending-templates .pws-trending-track > li { flex-basis:88%; } #trending-templates .pws-trending-footer { gap:12px; font-size:11px; } #trending-templates .pws-trending-progress { width:70px; flex-shrink:0; } #trending-templates h2 { font-size:25px; gap:8px; } }
@media (prefers-color-scheme:dark) { #trending-templates .pws-trending-fire { color:#fbbf24; } }
@media (prefers-reduced-motion:reduce) { #trending-templates button { transition:none; } }