
@media(max-width:430px){
  /* Match the reference composition: the hero is almost as tall as the three item slots,
     so more torso is visible instead of a face-only crop. */
  #character.v514-reference-hero .v510-portrait{
    height:196px!important;
    margin:0 -33px!important;
    overflow:visible!important;
  }
  #character.v514-reference-hero .v510-portrait::before{
    width:226px!important;
    height:201px!important;
    bottom:-6px!important;
    background:radial-gradient(ellipse 75% 82% at 50% 47%,rgba(104,221,76,.30),rgba(38,101,43,.10) 62%,transparent 83%)!important;
  }
  #character.v514-reference-hero #v510HeroRoot .avatar-scene,
  #character.v514-reference-hero #v510HeroRoot .class-avatar-big,
  #character.v514-reference-hero #v510HeroRoot .class-avatar-big img,
  #character.v514-reference-hero #v510HeroRoot .v080-class-avatar-img,
  #character.v514-reference-hero #v510HeroRoot .v41-portrait{
    width:226px!important;
    height:201px!important;
    min-height:201px!important;
    max-width:none!important;
  }
  #character.v514-reference-hero #v510HeroRoot .v080-class-avatar-img,
  #character.v514-reference-hero #v510HeroRoot .class-avatar-big img{
    object-fit:cover!important;
    object-position:center 28%!important;
    transform:scale(1)!important;
    transform-origin:center center!important;
    -webkit-mask-image:radial-gradient(ellipse 82% 88% at 50% 48%,#000 0 58%,rgba(0,0,0,.97) 66%,rgba(0,0,0,.68) 76%,rgba(0,0,0,.24) 89%,transparent 100%)!important;
    mask-image:radial-gradient(ellipse 82% 88% at 50% 48%,#000 0 58%,rgba(0,0,0,.97) 66%,rgba(0,0,0,.68) 76%,rgba(0,0,0,.24) 89%,transparent 100%)!important;
    filter:drop-shadow(0 8px 7px #000d) saturate(1.10) contrast(1.035)!important;
  }
  #character.v514-reference-hero #v510HeroRoot .center-name{
    margin:-25px -30% 0!important;
    font-size:16.5px!important;
  }
  #character.v514-reference-hero #v510HeroRoot .center-class{margin-top:3px!important}

  /* This row was still being overwritten by the old character renderer.
     V5.19 gives both values their own reference-style cards. */
  #character.v514-reference-hero #v459SetSummary{
    min-height:28px!important;
    margin:4px 0 0!important;
    padding:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:5px!important;
    border:0!important;
    border-radius:0!important;
    background:none!important;
  }
  #character.v514-reference-hero #v459SetSummary .v519-set-cell,
  #character.v514-reference-hero #v459SetSummary .v519-talent-cell{
    min-width:0!important;
    min-height:28px!important;
    padding:4px 7px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:5px!important;
    border:1px solid #3f553d!important;
    border-radius:7px!important;
    background:linear-gradient(180deg,#0d1910,#08110b)!important;
    box-shadow:inset 0 0 10px rgba(0,0,0,.5)!important;
    color:#dce4d8!important;
    font-size:6.5px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  #character.v514-reference-hero #v459SetSummary .v519-summary-label{
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    gap:3px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  #character.v514-reference-hero #v459SetSummary .v519-summary-icon{font-size:9px!important;flex:0 0 auto!important}
  #character.v514-reference-hero #v459SetSummary .v519-summary-text{
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    color:#e0e7dc!important;
    font-weight:800!important;
  }
  #character.v514-reference-hero #v459SetSummary b{
    flex:0 0 auto!important;
    color:#efc45d!important;
    font-size:8px!important;
    line-height:1!important;
  }
}

@media(max-width:350px){
  #character.v514-reference-hero .v510-portrait{height:186px!important;margin-left:-30px!important;margin-right:-30px!important}
  #character.v514-reference-hero #v510HeroRoot .avatar-scene,
  #character.v514-reference-hero #v510HeroRoot .class-avatar-big,
  #character.v514-reference-hero #v510HeroRoot .class-avatar-big img,
  #character.v514-reference-hero #v510HeroRoot .v080-class-avatar-img,
  #character.v514-reference-hero #v510HeroRoot .v41-portrait{width:214px!important;height:191px!important;min-height:191px!important}
  #character.v514-reference-hero #v459SetSummary .v519-set-cell,
  #character.v514-reference-hero #v459SetSummary .v519-talent-cell{padding-left:5px!important;padding-right:5px!important;font-size:6px!important}
}
