/* Featured hero tiles on the raids and dungeons pages (scripts/featured.js). The box has a fixed
   height, so swapping the placeholders for 1-4 real tiles never moves the rest of the page. */
.featured-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:12px;height:352px;min-width:0}
.featured-tiles[data-count="1"]{grid-template-columns:minmax(0,1fr)}.featured-tiles[data-count="3"]>:first-child{grid-column:span 2}
.featured-tile{display:flex;flex-direction:column;min-width:0;min-height:0;border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--surface);transition:border-color .15s}
a.featured-tile:hover{border-color:var(--accent)}a.featured-tile:focus-visible{outline-offset:3px}
.featured-art{flex:1 1 0;min-height:0;background:var(--raised)}.featured-art img{width:100%;height:100%;object-fit:cover}
.featured-cap{display:flex;flex-direction:column;gap:5px;padding:11px 14px 12px;min-width:0}.featured-cap span{font:10px var(--mono);color:var(--muted);letter-spacing:.5px}
.featured-cap strong{font:600 16px var(--display);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:20px}
.no-guide .featured-art{background:repeating-linear-gradient(135deg,var(--raised) 0 12px,var(--surface) 12px 24px)}
.featured-tiles[aria-busy] .featured-art{background:linear-gradient(100deg,var(--raised) 40%,var(--line) 50%,var(--raised) 60%) 0 0/200% 100%;animation:featured-shimmer 1.4s linear infinite}
.featured-tiles[aria-busy] .featured-cap strong{width:55%;border-radius:2px;background:var(--raised)}
@keyframes featured-shimmer{to{background-position:-200% 0}}
@media(prefers-reduced-motion:reduce){.featured-tiles[aria-busy] .featured-art{animation:none}}
@media(min-width:1500px){.featured-tiles{height:392px}}@media(max-width:950px){.featured-tiles{height:342px}}
@media(max-width:600px){.featured-tiles{height:250px;gap:10px}.featured-cap{padding:9px 10px 10px}.featured-cap strong{font-size:14px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.featured-cap span{font-size:9px}}
/* Weekly rotation cards get a "Featured" badge from featured.js (data-weekly-featured).
   Newest raid/dungeon: featured every week, so it never appears in the rotation above. */
.hero-featured{min-width:0}.hero-featured .featured-tiles{height:320px}
.featured-always{margin:10px 0 0;min-height:22px;font:12px/22px var(--mono);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.featured-always a{color:var(--gold);font-weight:500}.featured-always a::before{content:"★";margin-right:5px;font-size:17px;line-height:0;vertical-align:-1px}.featured-always a:hover{text-decoration:underline;text-underline-offset:3px}.featured-always.is-empty{visibility:hidden}
.raid-card[data-always-featured] .art::after,.raid-card[data-weekly-featured] .art::after{content:"Always featured";position:absolute;top:14px;right:14px;padding:5px 9px 5px 27px;border-radius:4px;background:var(--gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23111416' d='M12 1.5l3.1 6.6 7.2.9-5.3 5 1.4 7.1L12 17.6l-6.4 3.5 1.4-7.1-5.3-5 7.2-.9z'/%3E%3C/svg%3E") no-repeat 8px 50%/15px 15px;color:var(--bg);font:500 10px var(--mono);letter-spacing:.5px;text-transform:uppercase;box-shadow:0 2px 10px rgba(0,0,0,.5)}.raid-card[data-weekly-featured]:not([data-always-featured]) .art::after{content:"Featured"}
@media(min-width:1500px){.hero-featured .featured-tiles{height:360px}}@media(max-width:950px){.hero-featured .featured-tiles{height:310px}}@media(max-width:600px){.hero-featured .featured-tiles{height:236px}.featured-always{white-space:normal}}
/* Pantheon page (scripts/pantheon-featured.js): this week's Reprise + Encore boss, and a badge on
   those two in the encounter index. */
.pantheon-featured .featured-tiles{height:320px;margin-top:24px}
.encounter-jump a[data-weekly-featured]{flex-wrap:wrap}.encounter-jump a[data-weekly-featured]::after{content:"Featured";margin-left:auto;padding:3px 8px;border-radius:4px;background:var(--gold);color:var(--bg);font:500 9px var(--mono);letter-spacing:.5px;text-transform:uppercase}
@media(max-width:600px){.pantheon-featured .featured-tiles{height:250px}}
