/* Person page: a profile card that stays beside the content, then about, the characters they voice (tiles)
 * and the shows they worked on (a ledger of rows). */
.ps-main{background:var(--paper); padding:22px 0 70px; min-height:70vh;}
.ps-wrap{width:min(1080px,100% - 32px); margin-inline:auto;}
.ps-back{display:inline-flex; align-items:center; gap:6px; margin-bottom:16px; padding:8px 14px 8px 10px; border-radius:999px; border:1px solid var(--border-soft); background:var(--white); color:var(--navy); font:600 13.5px/1 'Inter',sans-serif; text-decoration:none;}
.ps-back:hover{border-color:var(--blue);}
.ps-back svg{width:16px; height:16px;}
html[dir="rtl"] .ps-back svg{transform:scaleX(-1);}

.ps-layout{display:grid; grid-template-columns:300px minmax(0,1fr); gap:30px; align-items:start;}

/* the profile card */
.ps-card{position:sticky; top:156px; display:flex; flex-direction:column; align-items:center; text-align:center; padding:26px 22px 22px; border-radius:26px; background:linear-gradient(180deg, var(--blue-tint), var(--white) 62%); border:1px solid var(--border-soft); transition:top .28s ease;}
html.nav-hidden .ps-card{top:76px;}
html.nav-instant .ps-card{transition:none;}
.ps-photo{width:176px; height:176px; border-radius:50%; overflow:hidden; background:var(--white); border:5px solid var(--white); box-shadow:0 0 0 2px var(--blue), 0 16px 30px -16px rgb(0 0 0 / .55);}
.ps-photo .hm-ph{width:100%; height:100%;}
.ps-card h1{margin-top:18px; font:800 24px/1.3 'Sora','Inter',sans-serif; letter-spacing:-.01em; color:var(--navy); overflow-wrap:anywhere;}
html[lang="ar"] .ps-card h1,html[lang="ja"] .ps-card h1{font-family:inherit; letter-spacing:0; line-height:1.45;}
.ps-sub{margin-top:4px; color:var(--navy-soft); font:500 15px/1.4 'Inter',sans-serif; overflow-wrap:anywhere;}
html[lang="ar"] .ps-sub,html[lang="ja"] .ps-sub{font-family:inherit;}
.ps-fav{display:inline-flex; align-items:center; gap:7px; margin-top:14px; padding:8px 14px; border-radius:999px; background:var(--white); border:1px solid var(--border-soft); color:var(--navy-soft); font:600 13px/1 'Inter',sans-serif;}
.ps-fav svg{width:15px; height:15px; fill:#f5a623;}
.ps-fav b{color:var(--navy); font:800 15px/1 'Sora','Inter',sans-serif;}
html[lang="ar"] .ps-fav,html[lang="ja"] .ps-fav{font-family:inherit;}
.ps-share{display:inline-flex; align-items:center; justify-content:center; gap:8px; margin-top:14px; width:100%; padding:12px 16px; border:0; border-radius:14px; background:var(--blue); color:#06121F; font:700 14px/1 'Inter',sans-serif; cursor:pointer; transition:background .15s;}
.ps-share svg{width:17px; height:17px;}
.ps-share:hover{background:var(--blue-dark); color:#fff;}
.ps-share:focus-visible{outline:2px solid var(--navy); outline-offset:2px;}
html[lang="ar"] .ps-share,html[lang="ja"] .ps-share{font-family:inherit;}
.ps-names{width:100%; margin-top:20px; padding-top:16px; border-top:1px solid var(--border-soft); text-align:start;}
.ps-names h2{font:700 12px/1.2 'JetBrains Mono',monospace; text-transform:uppercase; letter-spacing:.08em; color:var(--blue-dark); margin-bottom:8px;}
html[lang="ar"] .ps-names h2,html[lang="ja"] .ps-names h2{text-transform:none; letter-spacing:0; font-family:inherit; font-size:14px;}
.ps-names ul{list-style:none; margin:0; padding:0;}
.ps-names li{display:flex; justify-content:space-between; align-items:baseline; gap:10px; padding:7px 0; color:var(--navy); font:500 14px/1.4 'Inter',sans-serif; overflow-wrap:anywhere;}
.ps-names i{flex:none; font:600 10.5px 'JetBrains Mono',monospace; font-style:normal; color:var(--navy-soft);}

/* the content */
.ps-body{display:flex; flex-direction:column; gap:34px; min-width:0;}
.ps-sec{padding:0;}
.ps-sec > h2{display:flex; align-items:center; gap:10px; margin-bottom:14px; padding-inline-start:12px; border-inline-start:4px solid var(--blue); font:800 21px/1.2 'Sora','Inter',sans-serif; color:var(--navy);}
html[lang="ar"] .ps-sec > h2,html[lang="ja"] .ps-sec > h2{font-family:inherit;}
.ps-count{padding:3px 10px; border-radius:999px; background:var(--blue-tint); color:var(--blue-dark); font:700 12px/1 'JetBrains Mono',monospace;}
.ps-about-title{font:700 17px/1.4 'Inter',sans-serif; color:var(--navy); margin-bottom:8px;}
.ps-text{font:400 16.5px/1.85 'Inter',sans-serif; color:var(--prose-text); overflow-wrap:anywhere; max-width:68ch;}
html[lang="ar"] .ps-text{font-family:'Noto Sans Arabic','Inter',sans-serif; line-height:2.05;}
html[lang="ja"] .ps-text{font-family:'Noto Sans JP','Inter',sans-serif; line-height:1.95;}
#ps-about-text.is-clamped{display:-webkit-box; -webkit-line-clamp:8; -webkit-box-orient:vertical; overflow:hidden;}
.ps-more{margin-top:8px; padding:6px 0; border:0; background:none; color:var(--blue-dark); font:700 14px/1 'Inter',sans-serif; cursor:pointer;}
.ps-more:hover{color:var(--blue);}
.ps-muted{color:var(--navy-soft);}

.ps-tiles{display:grid; grid-template-columns:repeat(auto-fill,minmax(132px,1fr)); gap:14px;}
.ps-tile{display:flex; flex-direction:column; align-items:center; gap:8px; padding:12px 10px 14px; border-radius:20px; background:var(--white); border:1px solid var(--border-soft); color:inherit; text-decoration:none; text-align:center; min-width:0; transition:transform .16s, border-color .16s;}
.ps-tile:hover{transform:translateY(-3px); border-color:var(--blue);}
.ps-tile:focus-visible{outline:2px solid var(--blue); outline-offset:2px;}
.ps-tile-pic{width:100%; aspect-ratio:1/1; border-radius:14px; overflow:hidden; background:var(--blue-tint);}
.ps-tile-pic .hm-ph{width:100%; height:100%;}
.ps-tile b{font:600 13.5px/1.35 'Inter',sans-serif; color:var(--navy); overflow-wrap:anywhere;}
html[lang="ar"] .ps-tile b,html[lang="ja"] .ps-tile b{font-family:inherit;}
.ps-lang{padding:3px 9px; border-radius:999px; background:var(--mint-tint); color:var(--teal-dark); font:700 10.5px/1 'JetBrains Mono',monospace; letter-spacing:.08em; text-transform:uppercase;}

.ps-rows{list-style:none; margin:0; padding:0; border:1px solid var(--border-soft); border-radius:20px; overflow:hidden; background:var(--white);}
.ps-rows li + li{border-top:1px solid var(--border-soft);}
.ps-rows a{display:flex; align-items:center; gap:14px; padding:10px 16px 10px 10px; color:inherit; text-decoration:none; min-width:0;}
html[dir="rtl"] .ps-rows a{padding:10px 10px 10px 16px;}
.ps-rows a:hover{background:var(--blue-tint);}
.ps-rows a:focus-visible{outline:2px solid var(--blue); outline-offset:-2px;}
.ps-row-pic{flex:none; width:48px; aspect-ratio:2/3; border-radius:8px; overflow:hidden; background:var(--blue-tint);}
.ps-row-pic .hm-ph{width:100%; height:100%;}
.ps-row-text{flex:1; min-width:0; display:flex; flex-direction:column; gap:4px;}
.ps-row-text b{font:600 15px/1.35 'Inter',sans-serif; color:var(--navy); overflow-wrap:anywhere;}
.ps-pos{font:500 13px/1.4 'Inter',sans-serif; color:var(--navy-soft);}
html[lang="ar"] .ps-row-text b,html[lang="ja"] .ps-row-text b,html[lang="ar"] .ps-pos,html[lang="ja"] .ps-pos{font-family:inherit;}
.ps-rows small{flex:none; color:var(--navy-soft); font:600 12.5px/1 'Inter',sans-serif;}

.ps-missing{text-align:center; padding:80px 0; max-width:520px;}
.ps-missing h1{font:800 28px/1.3 'Sora','Inter',sans-serif; color:var(--navy);}
.ps-missing p{margin:12px 0 22px; color:var(--navy-soft);}
.ps-toast{position:fixed; inset-inline:0; bottom:90px; margin:auto; width:max-content; max-width:calc(100% - 32px); padding:11px 18px; border-radius:999px; background:var(--navy); color:var(--white); font:600 14px/1.3 'Inter',sans-serif; opacity:0; transform:translateY(8px); transition:opacity .25s, transform .25s; z-index:300;}
.ps-toast.is-in{opacity:1; transform:none;}

@media (max-width:860px){
  .ps-layout{grid-template-columns:minmax(0,1fr);}
  .ps-card{position:static; flex-direction:column;}
  .ps-photo{width:140px; height:140px;}
  .ps-names{text-align:start;}
}
@media (max-width:560px){
  .ps-rows small{display:none;}
  .ps-tiles{grid-template-columns:repeat(auto-fill,minmax(110px,1fr)); gap:10px;}
}