/* v10n: compact Home-style boss tiles (Home + Hajin/X01 boards).
   Locked to the live Home chip-tile footprint
   measured 2026-11-13: 1440 300×610.656, 390 214.828×478.953.
   Full-width uncropped Boss Board card; info panel overlaps just under CLAIMED.
   Does not change /bosses (.mk-boss-tile without --home). */

.mk-home-tiles .chip-tile.mk-boss-tile,
.mk-home-tiles .chip-tile.mk-boss-tile.is-active{
  width:300px !important;
  height:610.656px !important;
  flex:none !important;
  align-self:flex-start !important;
  transform:none !important;
  opacity:1 !important;
  display:flex !important;
  flex-direction:column;
  box-sizing:border-box;
  overflow:hidden;
}
.mk-home-tiles .chip-tile.mk-boss-tile.is-open{
  /* v10o: keep locked height; the info panel expands upward instead */
  height:610.656px !important;
}

@media (max-width:719px){
  .mk-home-tiles .chip-tile.mk-boss-tile,
  .mk-home-tiles .chip-tile.mk-boss-tile.is-active{
    width:214.828px !important;
    height:478.953px !important;
  }
  .mk-home-tiles .chip-tile.mk-boss-tile.is-open{
    height:478.953px !important;
  }
}

.mk-home-tiles .mk-boss-tile.mk-boss-tile--home{
  --card-ratio: 1267 / 760;
  --claimed-below: 0.806;
  position:relative;
  container-type:inline-size;
  flex:1 1 auto;
  width:100%;
  height:100%;
  min-height:0;
  min-width:0;
  margin:0;
  padding:0;
  border-radius:16px;
  overflow:hidden;
  display:block;
}
.mk-home-tiles .mk-boss-tile.mk-boss-tile--home.is-open,
.mk-home-tiles .mk-boss-tile.mk-boss-tile--home:has(.mk-boss-tile__drops.is-open){
  overflow:hidden; /* keep art and the expanded panel inside the rounded frame */
}

.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__photo{
  position:absolute;
  top:0; left:0; right:0;
  width:100%;
  height:auto;
  margin:0; padding:0;
  border-radius:16px 16px 0 0;
  overflow:hidden;
  background:#03050a;
  z-index:0;
  display:block;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__photo img{
  display:block;
  width:100%;
  height:auto;
  max-width:none;
  max-height:none;
  aspect-ratio:760 / 1267;
  object-fit:contain;
  object-position:top center;
  vertical-align:top;
  background:transparent;
}

.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__info{
  position:absolute;
  left:0; right:0; bottom:0;
  top:calc(100cqw * var(--card-ratio) * var(--claimed-below));
  z-index:1;
  display:flex;
  flex-direction:column;
  min-width:0;
  padding:12px 8px 4px 10px;
  background:
    linear-gradient(
      to bottom,
      rgba(5,7,11,0) 0,
      rgba(5,7,11,.82) 12px,
      rgba(5,7,11,.95) 22px,
      #05070b 30px
    );
  box-sizing:border-box;
}

.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__who{
  flex:none;
  margin:0 0 3px;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__kicker{
  margin:0 0 1px;
  font-size:11px;
  line-height:1.2;
  letter-spacing:.1em;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__name{
  font-size:14px;
  line-height:1.15;
}

.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__facts{
  flex:none;
  gap:2px 6px;
  padding-right:4px;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__facts:has(.mk-boss-tile__cell--diff){
  padding-right:2px;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__cell{ gap:0; }
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__lab{
  font-size:11px;
  line-height:1.15;
  letter-spacing:.06em;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__val{
  font-size:11px;
  line-height:1.2;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__val .pill{
  font-size:11px;
  padding:2px 6px;
  letter-spacing:.06em;
}
.mk-home-tiles .mk-boss-tile--home .mk-diff{
  padding:3px 7px;
  font-size:11px;
  letter-spacing:.08em;
}

.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__intel{
  flex:none;
  margin:3px 0 0;
  min-width:0;
  line-height:1.25;
}
.mk-home-tiles .mk-boss-tile--home .intel-callout{ margin:0; }
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__intel .mission-intel,
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__intel .intel-callout .mission-intel{
  display:inline !important;
  white-space:normal;
  line-height:1.25 !important;
}
.mk-home-tiles .mk-boss-tile--home .intel-callout .intel-icon,
.mk-home-tiles .mk-boss-tile--home .mission-intel > .intel-icon{
  width:12px !important;
  height:12px !important;
  margin-right:4px;
  vertical-align:-0.15em !important;
}
.mk-home-tiles .mk-boss-tile--home .mission-intel__lab{
  font-size:11px !important;
  line-height:1.25 !important;
  letter-spacing:.06em;
  margin-right:.3em;
}
.mk-home-tiles .mk-boss-tile--home .mission-intel__text{
  font-size:11px !important;
  line-height:1.25 !important;
}

.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__drops{
  flex:none;
  margin:4px 0 0;
  padding:4px 0 0;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__drops-head{
  gap:6px;
  margin:0 0 4px;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__drops-lab,
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__catalog,
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__more{
  font-size:11px;
  letter-spacing:.08em;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__more{ margin:3px 0 0; }
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__drops-list{ gap:3px; }

.mk-home-tiles .mk-boss-tile--home .mk-htag{
  grid-template-columns:22px minmax(0,1fr);
  gap:0 5px;
  padding:2px 4px 2px 2px;
  border-radius:6px;
  align-items:center;
}
.mk-home-tiles .mk-boss-tile--home .mk-htag__art{
  width:22px;
  height:22px;
  border-radius:4px;
}
.mk-home-tiles .mk-boss-tile--home .mk-htag__art img.mk-htag__thumb,
.mk-home-tiles .mk-boss-tile--home .mk-htag__art img{
  width:100%;
  height:100%;
  object-fit:contain;
}
.mk-home-tiles .mk-boss-tile--home .mk-htag__body{ gap:1px; }
.mk-home-tiles .mk-boss-tile--home .mk-htag__top{ gap:4px; align-items:center; }
.mk-home-tiles .mk-boss-tile--home .mk-htag__title{
  font-size:11px;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.mk-home-tiles .mk-boss-tile--home .mk-htag__desc{
  display:none; /* compact Home footprint: title + pill only, so SHOW MORE and Intel fit */
}
.mk-home-tiles .mk-boss-tile--home .mk-rarity{
  padding:2px 5px;
  font-size:11px;
  letter-spacing:.06em;
  margin:0;
}

@media (max-width:719px){
  .mk-home-tiles .mk-boss-tile.mk-boss-tile--home{
    border-radius:16px;
  }
  .mk-home-tiles .mk-boss-tile--home .mk-boss-tile__info{ padding:10px 6px 5px 8px; }
  .mk-home-tiles .mk-boss-tile--home .mk-boss-tile__kicker{ display:none; }
  .mk-home-tiles .mk-boss-tile--home .mk-boss-tile__who{ margin:0 0 2px; }
  .mk-home-tiles .mk-boss-tile--home .mk-boss-tile__name{ font-size:13px; }
  .mk-home-tiles .mk-boss-tile--home .mk-boss-tile__facts{ gap:2px 4px; }
  .mk-home-tiles .mk-boss-tile--home .mk-boss-tile__intel{ margin:2px 0 0; }
  .mk-home-tiles .mk-boss-tile--home .mk-boss-tile__drops{ margin:3px 0 0; padding:3px 0 0; }
  .mk-home-tiles .mk-boss-tile--home .mk-htag{
    grid-template-columns:20px minmax(0,1fr);
    gap:0 4px;
    padding:1px 3px 1px 1px;
  }
  .mk-home-tiles .mk-boss-tile--home .mk-htag__art{ width:20px; height:20px; }
}


/* v10n: uncropped card, no title clip; whole tiles only in the carousel;
   Loot catalog sits with SHOW MORE so it does not crowd DROPS. */
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__photo img{
  object-fit:contain !important;
  object-position:top center !important;
  overflow:visible;
  aspect-ratio:3 / 5;
}
.mk-home-tiles .chip-tile.mk-boss-tile{
  scroll-snap-align:start !important;
}
.mk-home-tiles .chip-carousel{
  grid-template-columns:36px max-content 36px;
  justify-content:center;
  gap:10px;
  --mk-home-tile-w:300px;
  --mk-home-tile-gap:12px;
  --mk-home-vis:3;
}
.mk-home-tiles .chip-track{
  width:calc(var(--mk-home-tile-w) * var(--mk-home-vis) + var(--mk-home-tile-gap) * (var(--mk-home-vis) - 1));
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  padding:8px 0;
}
.mk-home-tiles .chip-nav{
  position:static;
  z-index:2;
  flex:none;
}

@media (max-width:1199px){
  .mk-home-tiles .chip-carousel{ --mk-home-vis:2; }
}
@media (max-width:719px){
  .mk-home-tiles .chip-carousel{
    --mk-home-tile-w:214.828px;
    --mk-home-vis:1;
    gap:8px;
  }
}

/* DROPS label alone on the first row; catalog moves next to SHOW MORE. */
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__drops{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:
    "lab lab"
    "list list"
    "more catalog";
  align-items:center;
  column-gap:8px;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__drops-head{
  display:contents;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__drops-lab{
  grid-area:lab;
  margin:0 0 4px;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__drops-list{
  grid-area:list;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__more{
  grid-area:more;
  justify-self:start;
  margin:3px 0 0;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__catalog{
  grid-area:catalog;
  justify-self:end;
  margin:3px 0 0;
  white-space:nowrap;
  letter-spacing:.04em;
}


/* v10o: match the locked /bosses + shared site tile chrome (16px radius,
   red 1px border, 3px left accent, soft red glow). Clip art inside the
   rounded frame. Alive scan on the photo; stronger glitch/electric on
   the selected tile. Alignment (art height, panel y, tile size) is unchanged. */
.mk-home-tiles .chip-tile.mk-boss-tile.mk-boss-tile--home,
.mk-home-tiles .chip-tile.mk-boss-tile.mk-boss-tile--home.is-active{
  --boss:#FF2030;
  --boss-rgb:255,32,48;
  border-radius:16px !important;
  overflow:hidden !important;
  background:linear-gradient(180deg,rgba(12,16,22,.92),rgba(5,7,11,.96)) !important;
  border:1px solid rgba(var(--boss-rgb),.38) !important;
  box-shadow:
    0 0 0 1px rgba(var(--boss-rgb),.08),
    0 0 22px -8px rgba(var(--boss-rgb),.45) !important;
  isolation:isolate;
}
@media (max-width:719px){
  .mk-home-tiles .chip-tile.mk-boss-tile.mk-boss-tile--home{
    border-radius:16px !important;
  }
}

/* 3px left accent, painted above the photo so the art cannot cover it. */
.mk-home-tiles .mk-boss-tile--home::before{
  content:"";
  position:absolute;
  top:0; bottom:0; left:0;
  width:3px;
  background:var(--boss, #FF2030);
  z-index:4;
  pointer-events:none;
  border-radius:16px 0 0 16px;
}

.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__photo{
  overflow:hidden !important;
  border-radius:15px 15px 0 0;
  contain:paint;
}
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__photo img{
  overflow:hidden;
  border-radius:inherit;
  transform:translateZ(0);
}

/* Always-on: light scanline/grain on the art only (under the info panel). */
.mk-home-tiles .mk-boss-tile--home .mk-boss-tile__photo::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    repeating-linear-gradient(
      to bottom,
      rgba(255,255,255,0) 0 3px,
      rgba(8,12,18,.14) 3px 4px
    ),
    radial-gradient(ellipse at 50% 0%, rgba(77,200,255,.05), transparent 55%);
  opacity:.14;
  mix-blend-mode:soft-light;
  animation:mk-home-scan 10s linear infinite;
  transform:translateZ(0);
}
@keyframes mk-home-scan{
  from{transform:translateY(0)}
  to{transform:translateY(6px)}
}

/* Stronger glitch + electric edge: hover/focus on desktop, active slide on touch. */
@keyframes mk-home-electric{
  0%,100%{
    box-shadow:
      0 0 0 1px rgba(255,32,48,.45),
      0 0 18px -6px rgba(255,32,48,.7),
      0 0 0 0 rgba(25,245,230,0);
  }
  50%{
    box-shadow:
      0 0 0 2px rgba(255,48,64,.95),
      0 0 34px -2px rgba(255,32,48,1),
      0 0 16px -6px rgba(25,245,230,.45);
  }
}
@keyframes mk-home-glitch{
  0%,38%,50%,82%,100%{transform:translate3d(0,0,0);filter:none}
  40%{transform:translate3d(-3px,0,0);filter:drop-shadow(4px 0 #19F5E6) drop-shadow(-3px 0 #FF2030)}
  43%{transform:translate3d(3px,1px,0);filter:drop-shadow(-5px 0 #19F5E6) drop-shadow(3px 0 #FF2030)}
  46%{transform:translate3d(-1px,0,0);filter:drop-shadow(3px 0 #4DC8FF) drop-shadow(-2px 0 #FF2030)}
  84%{transform:translate3d(-3px,1px,0);filter:drop-shadow(4px 0 #19F5E6) drop-shadow(-3px 0 #FF2030)}
  88%{transform:translate3d(3px,-1px,0);filter:drop-shadow(-5px 0 #19F5E6) drop-shadow(3px 0 #FF2030)}
  92%{transform:translate3d(0,0,0);filter:none}
  96%{transform:translate3d(2px,0,0);filter:drop-shadow(3px 0 #FF2030) drop-shadow(-3px 0 #4DC8FF)}
}

.mk-home-tiles .mk-boss-tile--home.is-on,
.mk-home-tiles .mk-boss-tile--home:hover,
.mk-home-tiles .mk-boss-tile--home:focus-visible,
.mk-home-tiles .mk-boss-tile--home:focus-within{
  animation:mk-home-electric 1.5s ease-in-out infinite;
  border-color:rgba(255,48,64,.9) !important;
}
.mk-home-tiles .mk-boss-tile--home.is-on .mk-boss-tile__photo img,
.mk-home-tiles .mk-boss-tile--home:hover .mk-boss-tile__photo img,
.mk-home-tiles .mk-boss-tile--home:focus-visible .mk-boss-tile__photo img,
.mk-home-tiles .mk-boss-tile--home:focus-within .mk-boss-tile__photo img{
  animation:mk-home-glitch 2.8s steps(1,end) infinite;
}
.mk-home-tiles .mk-boss-tile--home.is-on .mk-boss-tile__photo::after,
.mk-home-tiles .mk-boss-tile--home:hover .mk-boss-tile__photo::after,
.mk-home-tiles .mk-boss-tile--home:focus-visible .mk-boss-tile__photo::after,
.mk-home-tiles .mk-boss-tile--home:focus-within .mk-boss-tile__photo::after{
  opacity:.22;
}

/* Mobile: the carousel's is-active (centered) slide is the selected tile.
   Bound to the 1-up breakpoint so a coarse pointer on desktop cannot
   light up the first of three tiles. */
@media (max-width:719px){
  .mk-home-tiles .mk-boss-tile--home.is-active{
    animation:mk-home-electric 1.5s ease-in-out infinite;
    border-color:rgba(255,48,64,.9) !important;
  }
  .mk-home-tiles .mk-boss-tile--home.is-active .mk-boss-tile__photo img{
    animation:mk-home-glitch 2.8s steps(1,end) infinite;
  }
  .mk-home-tiles .mk-boss-tile--home.is-active .mk-boss-tile__photo::after{
    opacity:.22;
  }
}

@media (prefers-reduced-motion:reduce){
  .mk-home-tiles .mk-boss-tile--home,
  .mk-home-tiles .mk-boss-tile--home.is-active,
  .mk-home-tiles .mk-boss-tile--home.is-on,
  .mk-home-tiles .mk-boss-tile--home:hover,
  .mk-home-tiles .mk-boss-tile--home:focus-visible,
  .mk-home-tiles .mk-boss-tile--home:focus-within,
  .mk-home-tiles .mk-boss-tile--home .mk-boss-tile__photo::after,
  .mk-home-tiles .mk-boss-tile--home .mk-boss-tile__photo img{
    animation:none !important;
    filter:none !important;
  }
}


/* v10o: SHOW MORE reveals every drop by expanding the info panel upward
   over the art. Tile width/height stay locked so neighbours do not jump. */
.mk-home-tiles .mk-boss-tile--home:has(.mk-boss-tile__drops.is-open) .mk-boss-tile__info{
  top:auto;
  bottom:0;
  height:auto;
  max-height:calc(100% - 12px);
  overflow:visible;
  padding-bottom:8px;
}