/* Only channel artwork. Original frames, shadows, highlights and rain remain in style.css/script.js. */
.fkn-channel-heading { color:#72ff8f; font:700 18px 'Courier New',monospace;letter-spacing:3px;text-align:center;margin:0 0 18px; }
.modes[data-channel-art="20261102"] { grid-auto-rows:auto;row-gap:24px; }
.fkn-channel-item { min-width:0;display:flex;flex-direction:column; }
.fkn-channel-item > .fkn-art-card { width:100%;flex:none; }
.fkn-art-card > .fkn-channel-picture {position:absolute!important;inset:0!important;z-index:1!important;display:block;overflow:hidden;border-radius:inherit;pointer-events:none;}
.fkn-channel-picture img {display:block;width:100%;height:100%;object-fit:cover;}
.fkn-art-card > .fkn-channel-badge {position:absolute!important;right:8px;top:8px;width:30px;height:30px;object-fit:contain;z-index:3!important;pointer-events:none;}
.fkn-art-card > .fkn-border-violet,.fkn-art-card > .fkn-border-pink {z-index:3!important;}
.fkn-art-card::before,.fkn-art-card::after {z-index:4;}
.fkn-channel-description {padding:10px 0 0;display:flex;flex-direction:column;gap:2px;pointer-events:none;}
@media(min-width:769px){ .modes[data-channel-art="20261102"] > .fkn-channel-item{grid-column:span 2;} .modes[data-channel-art="20261102"] > .fkn-channel-item:nth-last-child(2){grid-column:2/span 2;} .modes[data-channel-art="20261102"] > .fkn-channel-item:last-child{grid-column:4/span 2;} }
@media(max-width:768px){.fkn-art-card > .fkn-channel-badge{width:24px;height:24px;right:6px;top:6px;}.fkn-channel-heading{font-size:15px;}}
@media(min-width:769px){.fkn-channel-item > .fkn-art-card{height:285.296875px;min-height:285.296875px;}}
.fkn-channel-picture img{object-position:center bottom;}
.fkn-art-card[data-channel="up"] .fkn-channel-picture img{object-position:center top;}
.fkn-art-card[data-channel="ambient"] .fkn-channel-picture img{object-fit:contain;background:#000;}
/* Fit the complete artwork; soft photographic fill prevents hard letterboxing. */
.fkn-art-card > .fkn-channel-picture{background:#000;padding:5px;box-sizing:border-box;}
.fkn-channel-picture::before{content:"";position:absolute;inset:-12px;background-image:var(--art-backdrop);background-position:center;background-size:cover;filter:blur(12px) brightness(.55);}
.fkn-channel-picture img,.fkn-art-card[data-channel="up"] .fkn-channel-picture img,.fkn-art-card[data-channel="ambient"] .fkn-channel-picture img{position:relative;width:100%;height:100%;object-fit:contain;object-position:center;background:transparent;z-index:1;}
.fkn-channel-picture::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 7px 2px rgba(0,0,0,.7);pointer-events:none;z-index:2;}
/* Desktop pointer only: iPhone remains unchanged. */
@media (hover:hover) and (pointer:fine) {
 .fkn-channel-heading {color:#c57a3e!important;}
 .fkn-channel-description p {color:#c57a3e!important;}
 .fkn-art-card > .fkn-channel-picture {padding:0!important;}
 .fkn-art-card .fkn-channel-picture img {object-fit:cover!important;object-position:center bottom!important;}
 .fkn-art-card[data-channel="up"] .fkn-channel-picture img {object-position:center top!important;}
 .fkn-art-card[data-channel="ambient"] .fkn-channel-picture img {object-fit:contain!important;}
 .fkn-art-card > .fkn-channel-badge {width:48px!important;height:48px!important;top:8px;right:8px;}
 .fkn-art-card::after {filter:blur(3px);}
 .fkn-art-card.active {
  transform:translateY(-6px) scale(1.055)!important;
  z-index:8;
  border-color:#a7ffb4!important;
  box-shadow:0 0 3px 2px #6aff70,0 0 15px 4px rgba(57,255,20,.85),-8px 0 23px 4px rgba(255,65,180,.80),8px 0 23px 4px rgba(170,85,255,.85),0 0 48px 10px rgba(57,255,20,.30),inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(0,0,0,.55)!important;
 }
 .fkn-art-card.active > .fkn-border-pink {border-color:rgba(255,70,190,.98)!important;box-shadow:0 0 9px 2px rgba(255,70,190,.65);}
 .fkn-art-card.active > .fkn-border-violet {border-color:rgba(185,95,255,.98)!important;box-shadow:0 0 9px 2px rgba(185,95,255,.65);}
 .fkn-channel-picture::after {box-shadow:inset 0 0 12px 3px rgba(0,0,0,.55);}
}
@media (hover:hover) and (pointer:fine) {
 .fkn-channel-item > .fkn-art-card {height:auto!important;min-height:0!important;max-height:none!important;aspect-ratio:334.65625 / 285.296875;padding:0!important;}
 .fkn-art-card > .mode-icon,.fkn-art-card > h3,.fkn-art-card > p {display:none!important;}
}
/* Keep the original crystal highlight sharp and ABOVE the artwork. */
.fkn-art-card::before {z-index:5;}
.fkn-art-card::after {z-index:6;filter:none!important;}
.fkn-art-card > .fkn-border-violet,.fkn-art-card > .fkn-border-pink {z-index:8!important;}
.fkn-art-card > .fkn-channel-badge {z-index:7!important;width:38px!important;height:38px!important;top:9px!important;right:9px!important;filter:drop-shadow(0 0 3px rgba(65,255,100,.65));}
.fkn-channel-picture::after {z-index:2;background:linear-gradient(180deg,rgba(255,255,255,.10) 0%,rgba(57,255,20,.10) 38%,rgba(0,45,18,.12) 100%);box-shadow:inset 0 0 5px 1px rgba(0,0,0,.45);}
.fkn-art-card.active {border-color:#aaffba!important;box-shadow:0 0 2px 2px #91ff71,0 0 12px 4px rgba(55,255,30,.95),-7px 0 20px 4px rgba(255,40,175,.95),7px 0 20px 4px rgba(165,60,255,.95),0 0 36px 8px rgba(65,255,30,.55),inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(0,0,0,.55)!important;}
.fkn-art-card.active > .fkn-border-pink {border:2px solid #ff48bd!important;box-shadow:0 0 12px 3px rgba(255,45,180,.9);}
.fkn-art-card.active > .fkn-border-violet {border:2px solid #bc65ff!important;box-shadow:0 0 12px 3px rgba(165,60,255,.9);}
@media(hover:hover) and (pointer:fine){
 .fkn-art-card > .fkn-channel-badge {width:48px!important;height:48px!important;}
 .fkn-art-card.active {transform:translateY(-7px) scale(1.075)!important;box-shadow:0 0 3px 3px #91ff71,0 0 19px 6px rgba(55,255,30,.95),-12px 0 32px 7px rgba(255,40,175,.95),12px 0 32px 7px rgba(165,60,255,.95),0 0 62px 14px rgba(65,255,30,.50),inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(0,0,0,.55)!important;}
}
@media(pointer:coarse){
 .fkn-art-card > .fkn-channel-picture {padding:0!important;}
 .fkn-art-card:not([data-channel="ambient"]) .fkn-channel-picture img {object-fit:cover!important;object-position:center bottom!important;transform:scale(1.025);}
 .fkn-art-card[data-channel="up"] .fkn-channel-picture img {object-position:center top!important;}
 .fkn-art-card.active {transform:translateY(-4px) scale(1.035)!important;z-index:8;}
}
