/* UI 017.3A.1 — Character polish
   Additive override for the isolated Character shell only.
   Never styles or mutates shared body > nav. */

#i173a-character-layer{
  --i173a-dock-reserve:98px;
}

#i173a-character-layer .i173a-scroll{
  padding-top:calc(env(safe-area-inset-top) + 12px);
  padding-left:max(12px,env(safe-area-inset-left));
  padding-right:max(12px,env(safe-area-inset-right));
  padding-bottom:calc(var(--i173a-dock-reserve) + 14px);
  scroll-padding-bottom:calc(var(--i173a-dock-reserve) + 14px);
}

#i173a-character-layer .i173a-shell{
  width:100%;
  max-width:420px;
  margin-inline:auto;
}

#i173a-character-layer .i173a-topline{
  margin:0 0 10px;
  padding:0 3px;
  gap:8px;
}

#i173a-character-layer .i173a-brand{
  min-width:0;
  flex:1 1 auto;
  gap:7px;
  font-size:10px;
  letter-spacing:.19em;
  white-space:nowrap;
}

#i173a-character-layer .i173a-brand > span:last-child{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}

#i173a-character-layer .i173a-close{
  flex:0 0 38px;
  margin-left:4px;
}

#i173a-character-layer .i173a-stage{
  min-height:0;
  height:clamp(440px,54svh,480px);
}

#i173a-character-layer .i173a-stage-head{
  padding:16px 17px 0;
}

#i173a-character-layer .i173a-stage-badge{
  display:none!important;
}

#i173a-character-layer .i173a-art-zone{
  inset:56px 10px 52px;
}

#i173a-character-layer .i173a-art-zone::before{
  width:min(320px,82vw);
  height:min(320px,82vw);
  top:47%;
}

#i173a-character-layer .i173a-hero-art{
  height:410px;
  max-height:92%;
  max-width:84%;
  transform:translate3d(0,-5px,0);
}

#i173a-character-layer .i173a-stage-foot{
  left:12px;
  right:12px;
  bottom:11px;
  min-height:40px;
}

#i173a-character-layer .i173a-local-dock button.is-active{
  color:#d9c7a1;
  background:transparent;
  box-shadow:none;
}

#i173a-character-layer .i173a-local-dock svg{
  color:inherit!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
}

#i173a-character-layer .i173a-local-dock svg *{
  fill:none!important;
  stroke:currentColor!important;
  vector-effect:non-scaling-stroke;
}

@media (max-width:380px){
  #i173a-character-layer .i173a-scroll{
    padding-left:max(8px,env(safe-area-inset-left));
    padding-right:max(8px,env(safe-area-inset-right));
  }

  #i173a-character-layer .i173a-shell{max-width:100%}
  #i173a-character-layer .i173a-stage{height:440px;min-height:0}
  #i173a-character-layer .i173a-hero-art{height:385px;max-height:91%;max-width:86%}
}

@supports not (height:1svh){
  #i173a-character-layer .i173a-stage{height:min(480px,54vh)}
}