/* ================= 头像 ================= */
.av { --av: 36px; --avr: #d9b26f88; width: var(--av); height: var(--av); flex: none; display: inline-grid; place-items: center; border-radius: 50%; overflow: hidden;
  box-shadow: 0 0 0 1.5px var(--avr), 0 0 14px -4px #d9b26f55; background: #140a0e; vertical-align: middle; position: relative; }
.av svg, .av img { width: 100%; height: 100%; display: block; object-fit: cover; }
.av.mu::after { content: ""; position: absolute; inset: 0; background: #0009 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffb3c0' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M9 9v3a3 3 0 0 0 5.1 2.1M15 9.3V6a3 3 0 0 0-5.7-1.3M5 11a7 7 0 0 0 11.6 5.3M19 11a7 7 0 0 1-.6 2.8M12 18v3M4 4l16 16'/%3E%3C/svg%3E") center / 55% no-repeat; }

/* 小圆点换成头像（轮到谁 / 首页 / 计分板） */
.dot.av-dot { background: none !important; overflow: hidden; display: inline-block; vertical-align: middle; box-shadow: 0 0 0 1.5px #d9b26f88, 0 0 10px -2px #d9b26f55; }
.dot.av-dot svg, .dot.av-dot img { width: 100%; height: 100%; display: block; object-fit: cover; }
.turn > .dot.av-dot { width: 30px; height: 30px; }
.hero .who > .dot.av-dot { width: 22px; height: 22px; margin-right: 2px; }
.ol-meis > .dot.av-dot { width: 16px; height: 16px; }
.ol-nv .dot.av-dot, .pt-alive .dot.av-dot, .plist .dot.av-dot, .bd-plist .dot.av-dot, .pt-nums .dot.av-dot { width: 22px; height: 22px; }
.cp-row .dot.av-dot, .cp-duo .dot.av-dot { width: 20px; height: 20px; }

/* 开局设置：点头像换 */
.av-btn { width: auto; flex: none; padding: 0; border: 0; background: none; box-shadow: none; border-radius: 50%; display: inline-grid; place-items: center; }
.av-btn.none .av { opacity: .55; }

/* 选头像弹窗 */
.av-sheet { position: fixed; inset: 0; z-index: 95; background: #000b; display: flex; align-items: flex-end; justify-content: center; animation: olFade .2s ease both; }
.av-sheet-in { width: 100%; max-width: 480px; max-height: 88vh; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; padding: 20px 16px calc(18px + env(safe-area-inset-bottom));
  border-radius: 22px 22px 0 0; background: linear-gradient(180deg, #2a121d, #140a0f); border: 1px solid #d9b26f44; border-bottom: 0; box-shadow: 0 -20px 50px -20px #000; animation: olUp .3s var(--ease) both; }
.av-sheet-in .big { text-align: center; font: 600 19px var(--serif); letter-spacing: .1em; margin: 0; }
.av-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
.av-grid button { padding: 0; aspect-ratio: 1; border-radius: 50%; border: 1px solid #d9b26f33; background: none; overflow: hidden; box-shadow: none; transition: transform .15s, box-shadow .2s; }
.av-grid button svg { width: 100%; height: 100%; display: block; }
.av-grid button.on { box-shadow: 0 0 0 2px var(--gold), 0 0 18px -4px var(--gold); }
.av-grid button:active { transform: scale(.94); }
.av-up { display: flex; justify-content: center; padding: 13px; border-radius: 14px; border: 1px dashed #d9b26f66; color: var(--gold2); font: 500 15px var(--serif); letter-spacing: .08em; cursor: pointer; }
.av-up input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.av-warn { font-size: 12px; text-align: center; margin: -4px 0 0; }
@media (max-width: 359px) { .av-grid { grid-template-columns: repeat(5, 1fr); gap: 8px; } }