/* «🎤 مقدم الفقرة» card shared by the host-run games (owner 2026-10-27) */
.hc{max-width:460px;margin:0 auto 10px}
.hc-card{display:flex;align-items:center;gap:12px;padding:8px 12px;border:3px solid #2d2a32;border-radius:20px;background:#fff;box-shadow:4px 4px 0 #2d2a32}
.hc-ring{position:relative;flex:none;width:54px;height:54px;border-radius:50%;padding:3px;background:conic-gradient(#ff595e,#ffca3a,#8ac926,#1982c4,#6a4c93,#ff595e);animation:hcspin 6s linear infinite}
.hc-ring img,.hc-ring i{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;object-fit:cover;border:2.5px solid #fff;background:#ffe9a8;font-style:normal;font-size:24px;font-weight:800;color:#2d2a32;animation:hcspin 6s linear infinite reverse}
.hc-ring [hidden]{display:none!important}
@keyframes hcspin{to{transform:rotate(360deg)}}
.hc-txt{display:flex;flex-direction:column;min-width:0;text-align:start}
.hc-txt small{font-size:12px;color:#7b7480}.hc-txt b{font-size:19px;line-height:1.2;color:#2d2a32;unicode-bidi:plaintext;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hc-edit{margin-inline-start:auto;flex:none;border:2px solid #2d2a32;border-radius:12px;background:#ffca3a;color:#2d2a32;font:inherit;font-size:13px;font-weight:800;padding:6px 10px;cursor:pointer}
.hc-form{display:flex;gap:6px;margin-top:8px}
.hc-form[hidden]{display:none}
.hc-form input{flex:1;min-width:0;border:2px solid #2d2a32;border-radius:12px;padding:9px 10px;font:inherit;font-size:15px;background:#fff;color:#2d2a32}
.hc-form button{border:2px solid #2d2a32;border-radius:12px;background:#8ac926;color:#2d2a32;font:inherit;font-weight:800;padding:0 12px;cursor:pointer}
.hc-form .hc-reset{background:#fff}
.hc-msg{margin:6px 0 0;text-align:center;font-size:14px;font-weight:700;color:#7b7480}
.hc-msg[hidden]{display:none}
body:not(.kids) .hc-card{border-width:1px;border-color:#d9d2d0;box-shadow:0 6px 16px #0000000f}
@media(prefers-reduced-motion:reduce){.hc-ring,.hc-ring img,.hc-ring i{animation:none}}

/* 2026-10-31 owner: the photo looked tilted (letter-challenge) — the ring spun and the photo counter-spun, on Safari the
   two drift apart. Now only a colour layer behind the photo spins; the photo never moves. */
.hc-ring{animation:none;overflow:hidden;isolation:isolate;background:none}
.hc-ring::before{content:"";position:absolute;inset:-30%;z-index:-1;background:conic-gradient(#ff595e,#ffca3a,#8ac926,#1982c4,#6a4c93,#ff595e);animation:hcspin 6s linear infinite}
.hc-ring img,.hc-ring i{position:relative;animation:none;transform:none}

/* full names (decorated ones too): up to two lines instead of «…», a bit smaller when long */
.hc-txt b{white-space:normal;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere;line-height:1.25}
.hc-txt b.long{font-size:16px}
.hc-txt b.xlong{font-size:13px}