/* Topa v08: the left-hand path is reserved inside the hero, with a static fallback. */
:is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root) .tcd-character {
  position:relative; display:block; flex:0 0 235px; width:235px; height:130px;
  overflow:visible; pointer-events:none; isolation:isolate;
}
:is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root) .tcd-character img.tcd-hero-art {
  position:absolute; inset:0 0 0 auto; width:130px; height:100%; margin:0; opacity:1; visibility:visible;
}
:is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root) .tcd-character canvas {
  position:absolute; inset:-5% 0; display:block; width:100%; height:110%; opacity:0; visibility:hidden;
}
:is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root) .tcd-character.is-3d-ready img.tcd-hero-art { opacity:0; visibility:hidden; }
:is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root) .tcd-character.is-3d-ready canvas { opacity:1; visibility:visible; }
:is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root):not([data-mode="list"]) .tcd-character { flex-basis:180px; width:180px; height:100px; }
:is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root):not([data-mode="list"]) .tcd-character img.tcd-hero-art { width:100px; }
:is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root):is([data-mode="write"],[data-mode="reply"]) .tcd-character,
:is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root)[data-mode="modify"] .tcd-character { flex-basis:145px; width:145px; height:80px; }
:is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root):is([data-mode="write"],[data-mode="reply"]) .tcd-character img.tcd-hero-art,
:is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root)[data-mode="modify"] .tcd-character img.tcd-hero-art { width:80px; }
html:not([data-tcd-design="hybrid"]) #tcd-root .tcd-character { display:none; }
@media (max-width:1099px) {
  :is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root) .tcd-character,
  :is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root):not([data-mode="list"]) .tcd-character {
    flex-basis:140px; width:140px; height:80px;
  }
  :is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root) .tcd-character img.tcd-hero-art,
  :is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root):not([data-mode="list"]) .tcd-character img.tcd-hero-art { width:80px; }
  :is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root):is([data-mode="write"],[data-mode="reply"]) .tcd-character,
  :is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root)[data-mode="modify"] .tcd-character { flex-basis:112px; width:112px; height:64px; }
  :is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root):is([data-mode="write"],[data-mode="reply"]) .tcd-character img.tcd-hero-art,
  :is(html[data-tcd-design="hybrid"] #tcd-root, html.tcd-call-page #tcd-call-root)[data-mode="modify"] .tcd-character img.tcd-hero-art { width:64px; }
}
@media (prefers-reduced-motion:reduce) {
  :is(#tcd-root,#tcd-call-root) .tcd-character canvas { display:none!important; }
  :is(#tcd-root,#tcd-call-root) .tcd-character img.tcd-hero-art { opacity:1!important; visibility:visible!important; }
}