/* Film Rating Toolkit core styles */
.frw-card{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;border-radius:16px;overflow:hidden;box-shadow:0 10px 24px rgba(0,0,0,.08);max-width:520px;background:#fff}
.frw-dark.frw-card,.frw-card.frw-dark{background:#0f1115;color:#fff}
.frw-poster{position:relative;height:0;padding-top:130%;overflow:hidden}
.frw-poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;filter:contrast(1.05) saturate(1.05)}
.frw-ribbon{position:absolute;left:14px;bottom:14px;background:#ff6a18;color:#fff;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:12px;padding:10px 14px;border-radius:8px}
.frw-content{padding:16px 18px 20px}
.frw-title{margin:0 0 10px;font-size:22px;line-height:1.25}
.frw-title a{text-decoration:none;color:inherit}
.frw-rating{display:flex;gap:8px;align-items:center;flex-wrap:nowrap}
.frw-numeric{margin-top:6px;font-weight:600;opacity:.7}

/* Icons */
.frw-icon{width:28px;height:28px;display:inline-block;flex:0 0 auto}
.frw-icon .frw-outline{stroke:currentColor;stroke-width:6;fill:none}
.frw-icon .frw-fill{fill:currentColor}
.frw-light .frw-icon,.frw-card.frw-light .frw-icon{color:#ff6a18}
.frw-dark  .frw-icon,.frw-card.frw-dark .frw-icon{color:#ff8133}
.frw-icon.frw-half .frw-fill{clip-path:inset(0 50% 0 0)}
.frw-icon.frw-empty .frw-fill{opacity:.15}
.frw-icon.frw-empty .frw-outline{opacity:.35}

/* Grid */
.frw-grid{display:grid;gap:24px;margin-top:8px}
.frw-grid.frw-grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.frw-grid.frw-grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.frw-grid.frw-grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.frw-grid.frw-grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.frw-grid.frw-grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}

/* Section title */
.frw-grid-title{font-weight:900;margin:0 0 12px}
.frw-style-A{font-size:44px;line-height:1.1;color:#2bb24c;text-transform:lowercase}

/* Carousel (Style B: track + arrows) */
.frw-carousel{position:relative}
.frw-carousel .frw-track{display:flex;gap:20px;overflow:hidden;scroll-behavior:smooth;scroll-snap-type:x mandatory;padding:2px}
.frw-carousel .frw-slide{flex:0 0 auto;width:25%;scroll-snap-align:start}
.frw-carousel .frw-nav{position:absolute;top:40%;transform:translateY(-50%);background:#00000080;color:#fff;border:none;border-radius:999px;width:40px;height:40px;cursor:pointer;z-index:5}
.frw-carousel .frw-prev{left:-8px}
.frw-carousel .frw-next{right:-8px}

/* --- v1.4.1 mobile fixes & clamping --- */
.frw-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
.frw-card{min-width:0}

/* Responsive breakpoints (JS adjusts width too) */
@media (max-width:1024px){ .frw-carousel .frw-slide{width:33.3333%} }
@media (max-width:768px){  .frw-carousel .frw-slide{width:50%} .frw-title{font-size:20px}}
@media (max-width:480px){  .frw-carousel .frw-slide{width:100%} .frw-title{font-size:19px}}
