/* 共通の操作は動画の外に置き、チャットの入室操作と投稿欄の間へ収める。 */
utamita-chat-watch{display:flex;flex-direction:column;gap:var(--sp-8);min-width:0;padding:var(--sp-12);border:1px solid var(--c-border);border-radius:var(--radius-m);background:var(--c-white);color:var(--c-text);font-family:var(--font-body)}
utamita-chat-watch[hidden],utamita-chat-watch [hidden]{display:none!important}
.chat-watch-heading,.chat-watch-dialog-title{margin:0;font-family:var(--font-heading);font-size:var(--fs-ui-heading);font-weight:800;line-height:var(--lh-normal)}
.chat-watch-title{margin:0;font-size:var(--fs-ui-body);font-weight:700;line-height:var(--lh-normal);overflow-wrap:anywhere}
.chat-watch-meta,.chat-watch-progress,.chat-watch-search-status{margin:0;color:var(--c-text-sub);font-size:var(--fs-ui-meta);line-height:var(--lh-normal);overflow-wrap:anywhere}
.chat-watch-progress,.chat-watch-actions,.chat-watch-dialog-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-8)}
.chat-watch-position,.chat-watch-seek-time{font-variant-numeric:tabular-nums}
.chat-watch-controls,.chat-watch-dialog-body{display:flex;flex-direction:column;gap:var(--sp-12);min-width:0}
.chat-watch-controls{padding-top:var(--sp-8);border-top:1px solid var(--c-border)}
.chat-watch-actions button,.chat-watch-dialog-actions button,.chat-watch-search-submit,.chat-watch-seek-submit,.chat-watch-vote-actions button,.chat-watch-moderation button,.chat-watch-request-item button{box-sizing:border-box;max-width:100%;min-height:var(--control-h);padding:var(--sp-4) var(--sp-12);border:1px solid var(--c-border-input);border-radius:var(--radius-m);background:var(--c-white);color:var(--c-navy);font-family:var(--font-body);font-size:var(--fs-ui-meta);font-weight:700;line-height:var(--lh-normal);overflow-wrap:anywhere;cursor:pointer}
.chat-watch-actions .chat-watch-start,.chat-watch-actions .chat-watch-join,.chat-watch-dialog-actions .chat-watch-confirm{border-color:var(--c-navy);background:var(--c-navy);color:var(--c-white)}
.chat-watch-actions button:hover,.chat-watch-dialog-actions button:hover,.chat-watch-search-submit:hover,.chat-watch-seek-submit:hover,.chat-watch-vote-actions button:hover,.chat-watch-moderation button:hover,.chat-watch-request-item button:hover{border-color:var(--c-navy);background:var(--c-bg-soft)}
.chat-watch-actions .chat-watch-start:hover,.chat-watch-actions .chat-watch-join:hover,.chat-watch-dialog-actions .chat-watch-confirm:hover{background:var(--c-navy-deep)}
/* みんなで巡回：投票・リクエスト・主催の操作も動画の外に置く。 */
.chat-watch-vote{display:flex;flex-direction:column;gap:var(--sp-8);padding:var(--sp-8) var(--sp-12);border:1px solid var(--c-border);border-radius:var(--radius-m);background:var(--c-bg-soft)}
.chat-watch-vote-status,.chat-watch-requests-heading{margin:0;font-size:var(--fs-ui-meta);font-weight:700;line-height:var(--lh-normal);font-variant-numeric:tabular-nums}
.chat-watch-vote-actions,.chat-watch-moderation{display:flex;flex-wrap:wrap;gap:var(--sp-8)}
.chat-watch-vote-actions button{flex:1 1 auto;font-variant-numeric:tabular-nums}
.chat-watch-vote-actions button[aria-pressed="true"],.chat-watch-vote-actions button[aria-pressed="true"]:hover{border-color:var(--c-navy);background:var(--c-navy);color:var(--c-white)}
.chat-watch-requests,.chat-watch-moderation{padding-top:var(--sp-8);border-top:1px solid var(--c-border)}
.chat-watch-requests{display:flex;flex-direction:column;gap:var(--sp-8);min-width:0}
.chat-watch-request-list{display:flex;flex-direction:column;gap:var(--sp-8);margin:0;padding-left:var(--sp-20)}
.chat-watch-request-item{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-8);min-width:0}
.chat-watch-request-text{display:flex;flex:1 1 auto;flex-direction:column;min-width:0;margin:0;font-size:var(--fs-ui-body);line-height:var(--lh-normal);overflow-wrap:anywhere}
.chat-watch-request-name{color:var(--c-text-sub);font-size:var(--fs-ui-meta)}
utamita-chat-watch button:disabled{background:var(--c-bg-muted);color:var(--c-text-sub);cursor:default}
utamita-chat-watch button:focus-visible,utamita-chat-watch input:focus-visible{outline:var(--focus-ring);box-shadow:var(--shadow-focus)}
.chat-watch-seek-form{display:flex;flex-wrap:wrap;align-items:end;gap:var(--sp-8)}
.chat-watch-seek-label{display:grid;flex:1 1 100%;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:var(--sp-8);color:var(--c-text-sub);font-size:var(--fs-ui-meta);line-height:var(--lh-normal)}
.chat-watch-seek-input{grid-column:1;width:100%;min-width:0;min-height:var(--control-h);margin:0;accent-color:var(--c-navy);cursor:pointer}
.chat-watch-seek-time{grid-column:2;grid-row:2}
.chat-watch-feedback{margin:0;padding:var(--sp-8) var(--sp-12);border:1px solid var(--c-border);border-radius:var(--radius-m);background:var(--c-bg-soft);color:var(--c-text);font-size:var(--fs-ui-meta);line-height:var(--lh-normal);overflow-wrap:anywhere}
.chat-watch-dialog{box-sizing:border-box;width:min(calc(100% - var(--sp-32)),calc(var(--sp-40) * 15));max-height:calc(100dvh - var(--sp-32));padding:var(--sp-16);border:0;border-radius:var(--radius-l);background:var(--c-white);color:var(--c-navy);box-shadow:var(--shadow-float);overflow-y:auto}
.chat-watch-dialog::backdrop{background:var(--c-overlay)}
.chat-watch-dialog-title{margin-bottom:var(--sp-12)}
.chat-watch-dialog-actions{margin-top:var(--sp-16)}
.chat-watch-dialog-actions button{flex:1 1 auto}
.chat-watch-search-form{display:flex;flex-wrap:wrap;gap:var(--sp-8)}
.chat-watch-search-input{box-sizing:border-box;flex:1 1 100%;min-width:0;width:100%;min-height:var(--control-h);padding:var(--sp-8) var(--sp-12);border:1px solid var(--c-border-input);border-radius:var(--radius-m);background:var(--c-white);color:var(--c-text);font-family:var(--font-body);font-size:var(--fs-ui-input);font-weight:400;line-height:var(--lh-normal)}
.chat-watch-results{display:flex;flex-direction:column;gap:var(--sp-4);margin:0;padding:0;list-style:none}
.chat-watch-result{min-width:0;border-bottom:1px solid var(--c-border)}
.chat-watch-choice{display:flex;align-items:center;gap:var(--sp-8);min-height:var(--control-h);padding:var(--sp-8) 0;font-size:var(--fs-ui-body);line-height:var(--lh-normal);overflow-wrap:anywhere;cursor:pointer}
.chat-watch-choice input{flex:none;width:var(--sp-20);height:var(--sp-20);margin:0;accent-color:var(--c-navy)}
.chat-watch-work-title,.chat-watch-person-name{min-width:0}
@media (min-width:960px){
  .chat-watch-seek-label{flex-basis:50%}
  .chat-watch-search-input{flex-basis:50%}
}

.chat-watch-vote[data-urgent="true"]{border-color:var(--c-yellow-border);background:var(--c-warning-bg);color:var(--c-warning)}
.chat-watch-vote[data-urgent="true"] .chat-watch-vote-status{font-weight:800}