.work-cheers { display:block; margin:var(--sp-8) 0 0; min-width:0; }
.work-cheers[hidden] { display:none; }
.work-cheer-row { display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-8); min-width:0; }
.work-cheer-info { display:inline-grid; place-items:center; box-sizing:border-box; flex:none; width:var(--control-h); height:var(--control-h); padding:0; border-radius:50%; font-family:inherit; cursor:pointer; }
.work-cheer-button { display:inline-flex; align-items:center; gap:var(--sp-4); box-sizing:border-box; flex:none; height:var(--control-h); padding:0 var(--sp-16); border-radius:var(--radius-pill); font-family:inherit; font-size:var(--fs-ui-body); font-weight:800; line-height:var(--lh-normal); white-space:nowrap; cursor:pointer; }
.work-cheer-action { display:inline-flex; flex:none; }
.work-cheer-action[hidden] { display:none; }
.work-cheer-button { border:2px solid var(--c-pink); background:var(--c-white); color:var(--c-pink); }
.work-cheer-button:hover:not(:disabled) { background:var(--c-bg-pink); }
.work-cheer-button[aria-pressed="true"] { border-color:var(--c-pink-strong); background:var(--c-pink-strong); color:var(--c-white); }
.work-cheer-button:disabled { border-color:var(--c-text-sub); background:var(--c-white); color:var(--c-text-sub); cursor:default; }
.work-cheer-icon { flex:none; width:var(--sp-20); height:var(--sp-20); fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.work-cheer-button[aria-pressed="true"] .work-cheer-icon { fill:currentColor; }
.work-cheer-info { border:0; background:transparent; color:var(--c-text-sub); }
.work-cheer-info:hover { color:var(--c-navy); }
.work-cheer-info-icon,.work-cheer-avatar-fallback { width:var(--sp-20); height:var(--sp-20); fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.work-cheer-button:focus-visible,.work-cheer-info:focus-visible,.work-cheer-profile:focus-visible,.work-cheer-link:focus-visible { outline:var(--focus-ring); outline-offset:var(--focus-offset); }
.work-cheer-guide,.work-details-body .work-cheer-guide { box-sizing:border-box; position:fixed; inset:0; width:calc(100% - var(--sp-32)); max-width:calc(var(--sp-40) * 7); height:fit-content; margin:auto; padding:var(--sp-16); border:1px solid var(--c-border); border-radius:var(--radius-m); background:var(--c-white); color:var(--c-navy); font-family:var(--font-body); font-size:var(--fs-ui-meta); line-height:var(--lh-relaxed); box-shadow:var(--shadow-float); }
.work-cheer-guide-title { margin:0 0 var(--sp-8); font-size:var(--fs-ui-body); font-weight:800; line-height:var(--lh-normal); }
.work-cheer-guide-list { display:grid; gap:var(--sp-4); margin:0; padding:0 0 0 var(--sp-16); }
.work-cheer-guide-item { overflow-wrap:anywhere; }
.work-cheer-people { display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-4); min-width:0; margin:0; padding:0; list-style:none; }
.work-cheer-person { display:block; flex:none; }
.work-cheer-profile,.work-cheer-more { position:relative; display:grid; place-items:center; box-sizing:border-box; width:var(--control-h); height:var(--control-h); border-radius:50%; color:var(--c-navy); text-decoration:none; }
/* 残り時間の輪：12時から時計回りに、残りの割合だけを星の黄からピンクへ塗る */
.work-cheer-ring { position:absolute; inset:0; border-radius:50%; background:conic-gradient(var(--c-star), var(--c-pink-bright) calc(var(--cheer-left, 1) * 1turn), var(--c-border) 0); -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - var(--sp-4)), black calc(100% - var(--sp-4))); mask:radial-gradient(farthest-side, transparent calc(100% - var(--sp-4)), black calc(100% - var(--sp-4))); }
.work-cheer-avatar { display:grid; place-items:center; width:var(--sp-32); height:var(--sp-32); border-radius:50%; background:var(--c-bg-soft); color:var(--c-text-sub); overflow:hidden; }
.work-cheer-avatar img { width:100%; height:100%; object-fit:cover; }
.work-cheer-sparkle { position:absolute; inset:0; transform:rotate(calc(var(--cheer-left, 1) * 1turn)); pointer-events:none; }
.work-cheer-sparkle-icon { position:absolute; top:var(--sp-2); left:50%; width:var(--sp-12); height:var(--sp-12); fill:var(--c-white); transform:translate(-50%, -50%); animation:work-cheer-twinkle calc(var(--motion-sparkle) * 3) ease-in-out infinite alternate; }
@keyframes work-cheer-twinkle { from { opacity:.55; transform:translate(-50%, -50%) scale(.7); } to { opacity:1; transform:translate(-50%, -50%) scale(1.25) rotate(45deg); } }
@media (prefers-reduced-motion: reduce) { .work-cheer-sparkle-icon { animation:none; } }
.work-cheer-tip { display:none; position:absolute; bottom:calc(100% + var(--sp-4)); left:50%; z-index:1; padding:var(--sp-2) var(--sp-8); border-radius:var(--radius-s); background:var(--c-navy); color:var(--c-white); font-size:var(--fs-ui-meta); font-weight:700; line-height:var(--lh-normal); white-space:nowrap; transform:translateX(-50%); pointer-events:none; }
.work-cheer-profile:hover .work-cheer-tip,.work-cheer-profile:focus-visible .work-cheer-tip { display:block; }
.work-cheer-more { background:var(--c-bg-soft); font-size:var(--fs-ui-meta); font-weight:700; line-height:var(--lh-normal); }
.work-cheer-count { color:var(--c-text-sub); font-size:var(--fs-ui-meta); font-weight:700; line-height:var(--lh-normal); }
/* みんなで完走：応援者の右に、アイコンと人数を並べる。説明は重ねる・選ぶと表示する */
.work-cheer-complete { display:inline-flex; align-items:center; gap:var(--sp-4); min-height:var(--control-h); color:var(--c-navy); border-radius:var(--radius-m); }
.work-cheer-complete .work-cheer-count { color:var(--c-navy); }
.work-cheer-complete-icon { flex:none; width:var(--sp-24); height:var(--sp-24); fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.work-cheer-complete-icon .work-cheer-complete-flag { fill:var(--c-pink); stroke:var(--c-pink-strong); }
/* 説明は応援欄の幅に収め、狭い画面でも横にはみ出さない */
.work-cheer-row:has(.work-cheer-complete) { position:relative; }
.work-cheer-complete .work-cheer-complete-tip { left:0; right:0; white-space:normal; transform:none; }
.work-cheer-complete:hover .work-cheer-tip,.work-cheer-complete:focus-visible .work-cheer-tip { display:block; }
.work-cheer-complete:focus-visible { outline:var(--focus-ring); box-shadow:var(--shadow-focus); }
.work-cheer-help,.work-cheer-feedback { margin:var(--sp-4) 0 0; color:var(--c-text-sub); font-size:var(--fs-ui-meta); line-height:var(--lh-relaxed); overflow-wrap:anywhere; }
.work-cheer-feedback { color:var(--c-error); }
.work-cheer-feedback[hidden] { display:none; }
.work-cheer-link { display:inline-flex; align-items:center; min-height:var(--control-h); color:var(--c-navy); font-size:var(--fs-ui-meta); font-weight:700; }
.work-cheer-link:hover { color:var(--c-pink); }
.work-cheer-time { font-size:var(--fs-ui-meta); font-weight:700; }
.my-active-cheer { display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-8); min-width:0; }
.my-active-cheer .work-cheer-link { max-width:100%; overflow-wrap:anywhere; }