/* Local character prototype. Art has no text; layout follows writing direction. */
.character-group{display:flex;align-items:flex-end;justify-content:center;position:relative;isolation:isolate;pointer-events:none;overflow:hidden;direction:ltr}
.character-group .character{display:block;object-fit:contain;object-position:center bottom;min-width:0;height:100%;width:65%;max-width:100%;flex:0 1 auto}
.character-group.count-2 .character{width:53%}
.character-group.count-3 .character{width:39%;margin-inline:-3%}
.character-group .character-wata{transform:scale(1.22);transform-origin:center 60%}
.character-group .character:nth-child(2){z-index:2}
.card-icon{height:174px;overflow:hidden;flex:none}
.character-card{height:160px;width:100%;padding:6px 10px 0}
.diagnosis-card>div{position:relative;background:#fffdf8;z-index:3}
.hero{gap:20px;min-height:390px;overflow:hidden}
.hero-copy{width:58%;flex-shrink:0}
.character-hero{height:340px;width:42%;align-self:flex-end;flex-shrink:0}
.character-title{height:134px;width:220px;margin:0 auto 16px}
.diagnosis-intro.compact .character-title{display:none}
.character-result{height:170px;width:min(100%,330px);margin:0 auto 12px;border-radius:14px;background:#fae6ee}
.character-consent{height:190px;max-width:310px;margin:auto}
.character-tarot{height:150px;width:100%;border-radius:8px}
.tarot-card{overflow:hidden;gap:4px}
.related .card-icon{height:128px}
.related .character-card{height:120px}
@media(max-width:760px){
  .hero{display:flex;flex-direction:column;padding:16px 22px 0;gap:0;min-height:0;margin-bottom:24px}
  .hero-copy{display:block;width:100%}
  .hero h1{max-width:none;font-size:34px}
  .hero p{width:100%;max-width:520px;font-size:14px}
  .character-hero{height:226px;width:min(100%,330px);align-self:center;margin-top:14px}
  .card-icon{height:144px}
  .character-card{height:136px;padding-inline:0}
  .character-title{height:114px;width:200px;margin-bottom:10px}
  .character-result{height:150px}
  .character-tarot{height:125px}
}
@media(max-width:360px){
  .hero{padding:14px 18px 0}
  .hero h1{font-size:30px}
  .hero p{width:100%;font-size:13px}
  .character-hero{height:204px;width:290px;max-width:100%}
  .diagnosis-card{flex-direction:column}
  .card-icon{height:154px;min-width:0}
  .character-card{height:146px}
  .related .card-icon{height:136px;min-width:0}
  .related .character-card{height:130px}
}