/* ============================================================
   BlockAvatar 公開側スタイル（常時読込・自己完結・テーマ非依存）
   プレフィックス: bkav-
   ============================================================ */
.bk-avatar{ max-width:100%; box-sizing:border-box; }
.bk-avatar *{ box-sizing:border-box; }

.bk-avatar .bkav-hint{ border:2px dashed #c7ced4; border-radius:12px; background:#f7f8fa; padding:18px 16px; text-align:center; color:#5f6b76; font-size:13px; font-weight:700; line-height:1.8; }

.bk-avatar .bkav-list{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:20px 22px; }
.bk-avatar.bkav-layout-row .bkav-list{ flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:6px; }
.bk-avatar.bkav-layout-grid .bkav-list{ flex-wrap:wrap; justify-content:flex-start; }

.bk-avatar .bkav-item{ flex:0 0 auto; }
.bk-avatar.bkav-layout-row .bkav-item{ flex:0 0 auto; }
.bk-avatar.bkav-layout-grid .bkav-item{ flex:0 1 auto; }

.bk-avatar .bkav-card{ position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px; text-decoration:none; color:inherit; padding:6px; border-radius:14px; transition:transform .18s ease, box-shadow .18s ease; }
a.bkav-card{ cursor:pointer; }
.bk-avatar .bkav-card:hover,
.bk-avatar .bkav-card:focus-within{ transform:translateY(-4px); box-shadow:0 10px 24px rgba(20,20,30,.10); }

/* --- アバター本体 --- */
.bk-avatar .bkav-avatar-wrap{ position:relative; display:inline-flex; }
.bk-avatar .bkav-avatar-ring{ display:flex; padding:0; background:transparent; }
.bk-avatar.bkav-ring-on .bkav-avatar-ring{ padding:3px; background:linear-gradient(135deg,#ff6bcb,#7c6bff 50%,#35d0ba); }
.bk-avatar .bkav-avatar-inner{ display:flex; background:#fff; padding:2px; }
.bk-avatar .bkav-avatar-img{ display:block; object-fit:cover; }
.bk-avatar .bkav-avatar-initial{ display:flex; align-items:center; justify-content:center; font-weight:800; background:var(--bkav-init-bg,#e7e9ee); color:var(--bkav-init-fg,#444); user-select:none; }

/* サイズ */
.bk-avatar.bkav-size-sm .bkav-avatar-img,
.bk-avatar.bkav-size-sm .bkav-avatar-initial{ width:40px; height:40px; font-size:15px; }
.bk-avatar.bkav-size-sm .bkav-avatar-ring,
.bk-avatar.bkav-size-sm .bkav-avatar-inner{ width:40px; height:40px; }
.bk-avatar.bkav-size-sm.bkav-ring-on .bkav-avatar-ring{ width:46px; height:46px; }
.bk-avatar.bkav-size-sm.bkav-ring-on .bkav-avatar-inner{ width:40px; height:40px; }

.bk-avatar.bkav-size-md .bkav-avatar-img,
.bk-avatar.bkav-size-md .bkav-avatar-initial{ width:64px; height:64px; font-size:22px; }
.bk-avatar.bkav-size-md .bkav-avatar-ring,
.bk-avatar.bkav-size-md .bkav-avatar-inner{ width:64px; height:64px; }
.bk-avatar.bkav-size-md.bkav-ring-on .bkav-avatar-ring{ width:70px; height:70px; }
.bk-avatar.bkav-size-md.bkav-ring-on .bkav-avatar-inner{ width:64px; height:64px; }

.bk-avatar.bkav-size-lg .bkav-avatar-img,
.bk-avatar.bkav-size-lg .bkav-avatar-initial{ width:88px; height:88px; font-size:30px; }
.bk-avatar.bkav-size-lg .bkav-avatar-ring,
.bk-avatar.bkav-size-lg .bkav-avatar-inner{ width:88px; height:88px; }
.bk-avatar.bkav-size-lg.bkav-ring-on .bkav-avatar-ring{ width:96px; height:96px; }
.bk-avatar.bkav-size-lg.bkav-ring-on .bkav-avatar-inner{ width:88px; height:88px; }

/* 形状 */
.bk-avatar.bkav-shape-circle .bkav-avatar-ring,
.bk-avatar.bkav-shape-circle .bkav-avatar-inner,
.bk-avatar.bkav-shape-circle .bkav-avatar-img,
.bk-avatar.bkav-shape-circle .bkav-avatar-initial{ border-radius:50%; }
.bk-avatar.bkav-shape-rounded .bkav-avatar-ring,
.bk-avatar.bkav-shape-rounded .bkav-avatar-inner,
.bk-avatar.bkav-shape-rounded .bkav-avatar-img,
.bk-avatar.bkav-shape-rounded .bkav-avatar-initial{ border-radius:22%; }
.bk-avatar.bkav-shape-square .bkav-avatar-ring,
.bk-avatar.bkav-shape-square .bkav-avatar-inner,
.bk-avatar.bkav-shape-square .bkav-avatar-img,
.bk-avatar.bkav-shape-square .bkav-avatar-initial{ border-radius:10px; }

/* --- ステータスドット --- */
.bk-avatar .bkav-status-dot{ position:absolute; right:2px; bottom:2px; width:14px; height:14px; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px rgba(0,0,0,.06); }
.bk-avatar.bkav-size-lg .bkav-status-dot{ width:17px; height:17px; }
.bk-avatar.bkav-size-sm .bkav-status-dot{ width:11px; height:11px; }
.bk-avatar .bkav-status-online{ background:#2ecc71; animation:bkav-pulse 1.8s ease-out infinite; }
.bk-avatar .bkav-status-away{ background:#f1c40f; }
.bk-avatar .bkav-status-busy{ background:#e74c3c; }
.bk-avatar .bkav-status-offline{ background:#b6bdc4; }
@keyframes bkav-pulse{
  0%{ box-shadow:0 0 0 0 rgba(46,204,113,.55), 0 0 0 1px rgba(0,0,0,.06); }
  70%{ box-shadow:0 0 0 7px rgba(46,204,113,0), 0 0 0 1px rgba(0,0,0,.06); }
  100%{ box-shadow:0 0 0 0 rgba(46,204,113,0), 0 0 0 1px rgba(0,0,0,.06); }
}

/* --- 名前・肩書 --- */
.bk-avatar .bkav-meta{ display:flex; flex-direction:column; gap:1px; max-width:120px; }
.bk-avatar.bkav-size-lg .bkav-meta{ max-width:150px; }
.bk-avatar .bkav-name{ font-size:13.5px; font-weight:800; color:#2c2c34; line-height:1.4; word-break:break-word; }
.bk-avatar .bkav-role{ font-size:11.5px; font-weight:600; color:#7a7f88; line-height:1.5; word-break:break-word; }

/* --- bio ツールチップ（ホバー/フォーカスで表示） --- */
.bk-avatar .bkav-tooltip{ position:absolute; left:50%; bottom:100%; transform:translate(-50%,6px); width:200px; max-width:60vw; background:rgba(30,28,36,.94); color:#fff; font-size:12px; font-weight:500; line-height:1.6; padding:9px 12px; border-radius:10px; opacity:0; pointer-events:none; transition:opacity .16s ease, transform .16s ease; z-index:20; }
.bk-avatar .bkav-tooltip::after{ content:""; position:absolute; left:50%; top:100%; transform:translateX(-50%); border:6px solid transparent; border-top-color:rgba(30,28,36,.94); }
.bk-avatar .bkav-has-bio .bkav-card:hover .bkav-tooltip,
.bk-avatar .bkav-has-bio .bkav-card:focus-within .bkav-tooltip{ opacity:1; transform:translate(-50%,0); pointer-events:none; }

@media (max-width:480px){
  .bk-avatar .bkav-list{ gap:14px 16px; }
  .bk-avatar .bkav-meta{ max-width:96px; }
  .bk-avatar .bkav-tooltip{ width:160px; }
}

@media (prefers-reduced-motion: reduce){
  .bk-avatar .bkav-status-online{ animation:none; }
  .bk-avatar .bkav-card{ transition:none; }
  .bk-avatar .bkav-tooltip{ transition:none; }
}

/* fix(review): テーマの .bk-block-content img{height:auto!important;max-width:100%!important} に勝つため、
   アバター画像は各サイズで width/height を !important 固定（非正方形写真でも丸/角枠が歪まない）。
   inner に overflow:hidden を足して枠外へのはみ出しも防ぐ。 */
.bk-avatar .bkav-avatar-inner{ overflow:hidden; }
.bk-avatar .bkav-avatar-img{ max-width:none!important; }
.bk-avatar.bkav-size-sm .bkav-avatar-img{ width:40px!important; height:40px!important; }
.bk-avatar.bkav-size-md .bkav-avatar-img{ width:64px!important; height:64px!important; }
.bk-avatar.bkav-size-lg .bkav-avatar-img{ width:88px!important; height:88px!important; }
/* fix(review): 肩書テキストの白背景コントラストを WCAG AA(4.5:1) 以上に */
.bk-avatar .bkav-role{ color:#5f6470; }
