/* v11l: site-wide rollout of the approved v11j2 tip tile.
   Brighter purple title #E4A8FF, white body 16px / 15px mobile,
   compact content-sized tiles, title 2 lines, body 3 lines.
   Pro tip cards (.tile--pro) are intentionally not styled here. */
.tip-tiles--v11j{
  --tip-title:#E4A8FF;
  --tip-title-rgb:228,168,255;
  --tip-body:#fff;
  --pc:var(--c-tips, #B24BFF);
  --pc-rgb:var(--c-tips-rgb, 178,75,255);
}
.tip-tile{
  --tip-title:#E4A8FF;
  --tip-title-rgb:228,168,255;
  --tip-body:#fff;
  --pc:var(--c-tips, #B24BFF);
  --pc-rgb:var(--c-tips-rgb, 178,75,255);
}

/* Grid conversion: marked tip lists only. Not the Home Etiquette ticker. */
.tip-tiles--v11j.tiles--tips,
.tip-tiles--v11j.tiles--tips-mini,
.area-tips__grid.tip-tiles--v11j,
.tip-tiles--v11j.thin-band,
.band--tips .thin-band.tip-tiles--v11j,
.band--tips .tip-tiles--v11j.thin-track{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px !important;
  width:100% !important;
  max-width:100%;
  min-width:0;
  padding:0 !important;
  overflow:visible !important;
  transform:none !important;
  will-change:auto !important;
  align-items:stretch;
}
@media (min-width:900px){
  .tip-tiles--v11j.tiles--tips,
  .tip-tiles--v11j.tiles--tips-mini,
  .area-tips__grid.tip-tiles--v11j,
  .band--tips .thin-band.tip-tiles--v11j,
  .band--tips .tip-tiles--v11j.thin-track{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:14px !important;
  }
}
.band--tips .thin-band.tip-tiles--v11j{
  overflow:visible !important;
  border:none !important;
  background:transparent !important;
  border-radius:0 !important;
}
.band--tips .thin-band.tip-tiles--v11j .thin-track{
  display:contents;
}

/* Card chrome: .tip-tile (hub, related, standalone) and Home Tips thin-tiles. */
.tip-tiles--v11j .tip-tile,
.tip-tiles--v11j .thin-tile.tip-tile,
.tip-tile.tile--tips{
  display:flex !important;
  flex-direction:column !important;
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
  height:100% !important;
  min-height:0 !important;
  box-sizing:border-box !important;
  padding:0 !important;
  gap:0 !important;
  text-decoration:none !important;
  color:inherit !important;
  background:linear-gradient(180deg,rgba(12,16,22,.92),rgba(5,7,11,.96)) !important;
  border:1px solid rgba(var(--pc-rgb),.45) !important;
  box-shadow:inset 3px 0 0 var(--pc),0 0 0 1px rgba(var(--pc-rgb),.08) !important;
  border-radius:12px !important;
}
.tip-tiles--v11j .tip-tile:hover,
.tip-tiles--v11j .tip-tile:focus-visible,
.tip-tile.tile--tips:hover,
.tip-tile.tile--tips:focus-visible,
.tip-tiles--v11j .thin-tile.tip-tile:hover,
.tip-tiles--v11j .thin-tile.tip-tile:focus-visible{
  border-color:rgba(var(--pc-rgb),.85) !important;
  box-shadow:inset 3px 0 0 var(--pc),0 0 0 1px rgba(var(--pc-rgb),.45),0 0 28px -6px rgba(var(--pc-rgb),.7) !important;
  transform:none !important;
}
.tip-tile .thumb{
  flex:0 0 auto;
  width:100%;
  max-height:7.5rem;
  overflow:hidden;
  border-radius:12px 12px 0 0;
}
.tip-tile .thumb img{
  width:100%;
  height:7.5rem;
  object-fit:contain;
  object-position:center;
  display:block;
}
.tip-tile .tile-body,
.tip-tiles--v11j .thin-tile.tip-tile .tile-body{
  display:flex !important;
  flex-direction:column !important;
  flex:1 1 auto !important;
  gap:6px !important;
  min-width:0 !important;
  min-height:0 !important;
  height:auto !important;
  padding:10px 12px 10px 16px !important;
  box-sizing:border-box !important;
}
.tip-tile .tip-tile__pills{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  min-width:0;
}
.tip-tile .tile-kicker,
.tip-tile .tile-map{
  display:inline-flex !important;
  align-items:center;
  margin:0 !important;
  padding:2px 7px !important;
  border-radius:999px !important;
  font:700 .62rem/1.2 "Chakra Petch",system-ui,sans-serif !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
  color:var(--tip-title) !important;
  background:transparent !important;
  border:1px solid rgba(var(--tip-title-rgb),.55) !important;
  box-shadow:0 0 10px -4px rgba(var(--tip-title-rgb),.55) !important;
  white-space:nowrap;
}
.tip-tile .tile-kicker:empty{display:none !important}
.tip-tile .tile-body h2,
.tip-tile .tile-body h3,
.tip-tile h2,
.tip-tile h3{
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
  overflow:hidden !important;
  margin:0 !important;
  min-width:0 !important;
  min-height:0 !important;
  max-height:calc(1.25em * 2) !important;
  flex:0 0 auto !important;
  height:auto !important;
  font:700 1.05rem/1.25 "Chakra Petch",system-ui,sans-serif !important;
  letter-spacing:.03em;
  color:var(--tip-title) !important;
  text-shadow:0 0 10px rgba(var(--tip-title-rgb),.55) !important;
  overflow-wrap:anywhere;
}
.tip-tile .tip-tile__text,
.tip-tile .tile-body p,
.tip-tiles--v11j .thin-tile.tip-tile p{
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:3 !important;
  overflow:hidden !important;
  margin:0 !important;
  min-width:0 !important;
  min-height:0 !important;
  max-height:calc(1.35em * 3) !important;
  flex:0 0 auto !important;
  font:400 16px/1.35 Geist,ui-sans-serif,system-ui,sans-serif !important;
  color:var(--tip-body) !important;
  text-shadow:none !important;
  opacity:1 !important;
}
.tip-tile .tip-tile__foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-top:2px;
  min-width:0;
}
.tip-tile .cta{
  margin:0 !important;
  color:var(--tip-title) !important;
  font:700 .8rem/1.2 "Chakra Petch",system-ui,sans-serif !important;
  letter-spacing:.04em;
  text-shadow:0 0 10px rgba(var(--tip-title-rgb),.45) !important;
  background:none !important;
  white-space:nowrap;
}
.tip-tile .view-count{
  color:var(--tip-title) !important;
  text-shadow:0 0 8px rgba(var(--tip-title-rgb),.45) !important;
  margin-left:auto;
}

/* Home Etiquette rail: same type/color/clamps, ticker kept (no grid, no transform:none). */
.band--etiquette .tip-tiles--v11j-ticker .thin-tile{
  --tip-title:#E4A8FF;
  --tip-title-rgb:228,168,255;
  --tip-body:#fff;
  --pc:var(--c-tips, #B24BFF);
  --pc-rgb:var(--c-tips-rgb, 178,75,255);
  box-sizing:border-box;
  padding:10px 12px 10px 16px !important;
  background:linear-gradient(180deg,rgba(12,16,22,.92),rgba(5,7,11,.96)) !important;
  border:1px solid rgba(var(--pc-rgb),.45) !important;
  box-shadow:inset 3px 0 0 var(--pc),0 0 0 1px rgba(var(--pc-rgb),.08) !important;
  border-radius:12px !important;
  text-decoration:none !important;
}
.band--etiquette .tip-tiles--v11j-ticker .thin-tile h3{
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
  overflow:hidden !important;
  margin:0 0 6px !important;
  max-height:calc(1.25em * 2) !important;
  font:700 1.05rem/1.25 "Chakra Petch",system-ui,sans-serif !important;
  color:var(--tip-title) !important;
  text-shadow:0 0 10px rgba(var(--tip-title-rgb),.55) !important;
  overflow-wrap:anywhere;
}
.band--etiquette .tip-tiles--v11j-ticker .thin-tile p{
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:3 !important;
  overflow:hidden !important;
  margin:0 !important;
  max-height:calc(1.35em * 3) !important;
  font:400 16px/1.35 Geist,ui-sans-serif,system-ui,sans-serif !important;
  color:var(--tip-body) !important;
  opacity:1 !important;
}

@media (max-width:799px){
  .tip-tiles--v11j,
  .band--tips,
  .tip-tile{
    overflow-x:hidden;
    max-width:100%;
  }
  .tip-tile .tip-tile__text,
  .tip-tile .tile-body p,
  .tip-tiles--v11j .thin-tile.tip-tile p,
  .band--etiquette .tip-tiles--v11j-ticker .thin-tile p{
    font-size:15px !important;
    line-height:1.35 !important;
  }
  .tip-tile .tile-body,
  .tip-tiles--v11j .thin-tile.tip-tile .tile-body,
  .band--etiquette .tip-tiles--v11j-ticker .thin-tile{
    padding:8px 10px 8px 14px !important;
  }
  .tip-tile .tile-body{ gap:5px !important; }
}
