.coop-setup { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.8fr); gap:24px; max-width:1000px; margin:auto; }
.coop-panel { padding:28px; border:1px solid var(--line); border-radius:24px; background:var(--surface); min-width:0; }
.coop-panel h2 { margin:0 0 8px; font-size:1.5rem; }
.coop-panel p { color:var(--muted); margin:0 0 24px; }
.coop-panel label { display:flex; flex-direction:column; gap:7px; margin:18px 0; color:var(--ink); font-weight:650; }
.coop-panel input,.coop-panel select { width:100%; min-height:46px; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:var(--bg); color:var(--ink); font:inherit; box-sizing:border-box; }
#view-coop .coop-panel select { appearance:none; -webkit-appearance:none; height:46px; min-height:46px; padding:10px 32px 10px 12px; font-size:16px; line-height:1.25; background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%); background-position:calc(100% - 16px) 50%,calc(100% - 11px) 50%; background-size:5px 5px; background-repeat:no-repeat; }
#view-coop .coop-panel :is(input,select):focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.coop-fields { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.coop-fields label { margin-top:0; }
.coop-error { color:var(--danger,#b43b47); min-height:24px; font-size:.9rem; }
.coop-join,.coop-lobby,.coop-result { max-width:660px; margin:auto; }
.coop-lobby-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px; }
.coop-lobby-heading h2 span { color:var(--muted); font-size:1rem; margin-left:8px; }
.coop-players { display:flex; flex-wrap:wrap; gap:8px; }
.coop-player { position:relative; display:grid; gap:2px; padding:7px 10px 7px 13px; border:1px solid var(--line); background:var(--bg); border-radius:10px; min-width:0; max-width:100%; }
.coop-player::before { content:''; position:absolute; left:0; top:9px; bottom:9px; width:3px; border-radius:3px; background:var(--coop-player-color); }
.coop-player-name { display:flex; align-items:baseline; gap:5px; min-width:0; height:19px; line-height:19px; white-space:nowrap; }
.coop-player b { min-width:0; overflow:hidden; text-overflow:ellipsis; max-width:180px; font-size:.9rem; }
.coop-player small { flex:none; color:var(--muted); font-size:.65rem; }
[data-coop-color="teal"],[data-coop-cursor="teal"] { --coop-player-color:#168779; }
[data-coop-color="coral"],[data-coop-cursor="coral"] { --coop-player-color:#c95640; }
[data-coop-color="violet"],[data-coop-cursor="violet"] { --coop-player-color:#7955c7; }
[data-coop-color="gold"],[data-coop-cursor="gold"] { --coop-player-color:#b87a0e; }
.coop-presence { display:flex; align-items:center; gap:5px; height:15px; line-height:15px; color:var(--muted); font-size:.65rem; white-space:nowrap; }
.coop-presence::before { content:''; flex:none; width:6px; height:6px; border:1px solid #25845a; border-radius:50%; background:#25845a; box-sizing:border-box; }
.coop-presence.is-offline::before { background:transparent; border-color:var(--muted); }
.coop-invite { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 0; margin-top:12px; }
.coop-invite code { font:750 1.25rem monospace; letter-spacing:.1em; }
.coop-settings { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:17px 0; margin-bottom:18px; }
.coop-settings summary { cursor:pointer; font-weight:650; }
.coop-settings summary span { float:right; color:var(--accent); font-size:.85rem; }
.coop-result { text-align:center; }
.coop-result .coop-players,.coop-result-actions { justify-content:center; }
.coop-result-time { font-size:3rem; font-weight:800; margin:22px 0; font-variant-numeric:tabular-nums; }
.coop-result-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.coop-directory { display:grid; gap:10px; margin-top:18px; }
.coop-directory a { display:flex; flex-direction:column; gap:5px; padding:14px; border:1px solid var(--line); border-radius:12px; text-decoration:none; color:var(--ink); }
.coop-directory a span { font-size:.85rem; color:var(--muted); }
.coop-gamebar { display:flex; align-items:center; gap:12px; width:100%; margin:0 0 10px; padding:8px 10px; border:1px solid var(--line); border-radius:var(--radius-md,12px); background:var(--surface); }
.coop-game-label { flex:none; font-size:.75rem; font-weight:750; color:var(--accent-strong); }
#coop-game-players { flex:1; min-width:0; }
.is-coop-game [data-coop-round]:disabled { opacity:.5; cursor:default; }
.coop-result-actions [data-coop-round="new"] { background:var(--accent); color:#fff; border-color:var(--accent); order:-1; }
.coop-gamebar .coop-players { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.coop-gamebar .coop-player { padding:4px 8px 4px 11px; }
.coop-gamebar .coop-player b { max-width:none; font-size:.8rem; }
.coop-game-status { position:fixed; z-index:120; bottom:max(20px,env(safe-area-inset-bottom)); left:50%; transform:translateX(-50%); max-width:calc(100vw - 32px); width:max-content; padding:9px 14px; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-sm); text-align:center; font-size:.8rem; color:var(--muted); pointer-events:none; }
.coop-game-status:empty { display:none; }
.coop-game-status.has-error { color:var(--danger,#b43b47); }
.is-coop-game :is(#g-hint,#g-reset,#g-help,#g-report-problem,#howto,[data-mini-hint],[data-mini-undo]) { display:none!important; }
body[data-game] #view-game.is-coop-game #g-connection { display:none; }
:root body[data-game] #view-game.is-coop-game .g-actions { display:flex; gap:6px; margin-top:10px; padding:6px; }
:root body[data-game] #view-game.is-coop-game .g-actions .pill-btn { min-width:0; min-height:46px; padding:10px 6px; gap:6px; white-space:nowrap; font-size:13px; }
.is-coop-game #g-undo { order:0; }
.is-coop-game #room-chat-toolbar-launcher { order:1; }
.is-coop-game #coop-game-more { order:2; }
:root body[data-game] #view-game.is-coop-game .g-header { grid-template-columns:88px minmax(0,1fr) 88px; min-height:54px; padding:5px 8px; margin-bottom:8px; }
:root body[data-game] #view-game.is-coop-game .g-header-actions { grid-column:3; gap:0; max-width:88px; }
:root body[data-game] #view-game.is-coop-game .g-title { grid-column:2; min-width:0; max-width:100%; }
.coop-undo-status { min-height:18px; margin:3px 6px 0; color:var(--muted); font-size:.75rem; line-height:1.45; text-align:center; }
.coop-options-modal { max-width:420px; }
.coop-options h3 { margin:0 44px 20px 0; }
.coop-option-group { display:grid; gap:4px; }
.coop-option-group + .coop-option-group { border-top:1px solid var(--line); padding-top:10px; margin-top:10px; }
.coop-options .coop-option { display:flex; align-items:center; gap:14px; width:100%; min-height:52px; padding:12px; border:0; border-radius:12px; background:transparent; color:var(--ink); text-align:left; font:inherit; cursor:pointer; }
.coop-options .coop-option:hover:not(:disabled) { background:var(--pill); }
.coop-options .coop-option:focus-visible { outline:3px solid var(--accent); outline-offset:1px; }
.coop-options .coop-option:disabled { opacity:.5; cursor:default; }
.coop-options .coop-option svg { width:22px; height:22px; flex:none; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; color:var(--muted); }
.coop-options .coop-option span { display:grid; gap:3px; }
.coop-options .coop-option strong { font-size:.95rem; font-weight:650; }
.coop-options .coop-option small { font-size:.75rem; color:var(--muted); }
.coop-options-status { min-height:20px; margin:10px 12px 0; color:var(--muted); font-size:.8rem; }
.is-coop-game .g-actions [data-coop-game-control] { min-height:44px; }
.coop-vote-card { position:fixed; z-index:130; bottom:max(84px,calc(env(safe-area-inset-bottom) + 76px)); left:50%; transform:translateX(-50%); width:min(460px,calc(100vw - 24px)); padding:14px; border:1px solid var(--line); border-radius:var(--radius-md,16px); background:var(--surface); box-shadow:var(--shadow-lg); }
.coop-vote-copy { display:flex; flex-direction:column; gap:3px; margin-bottom:10px; }
.coop-vote-copy strong { font-size:.95rem; }
.coop-vote-copy span { color:var(--muted); font-size:.8rem; }
.coop-vote-actions { display:flex; gap:8px; }
.coop-vote-actions .btn { flex:1; min-height:44px; padding:8px 12px; }
.coop-vote-card .coop-error { margin:8px 0 0; min-height:0; }
.coop-vote-card .coop-error:empty { display:none; }
.is-coop-game #board .cell[data-coop-cursor] { outline:3px solid var(--coop-player-color); outline-offset:-3px; z-index:2; }
.coop-replay { max-width:740px; margin:auto; }
.coop-replay-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.coop-replay-heading h2 { margin:8px 0; }
.coop-replay-team { display:flex; flex-wrap:wrap; gap:8px; color:var(--muted); margin:12px 0 20px; }
.coop-replay-team span + span::before { content:' + '; }
.coop-replay-board { max-width:520px; margin:auto; }
.coop-replay-actor { min-height:24px; margin:10px 0; text-align:center; color:var(--muted); }
.coop-stats { margin-top:24px; text-align:left; min-width:0; }
.coop-stats-heading { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:6px 16px; margin-bottom:12px; }
.coop-stats h3 { margin:0; font-size:1.05rem; }
.coop-stats-heading > span { color:var(--muted); font-size:.8rem; }
.coop-stats .coop-credit-note { margin:0 0 14px; color:var(--muted); font-size:.8rem; line-height:1.5; }
.coop-stats .coop-credit-note.is-legacy { padding:10px 12px; border-radius:10px; background:var(--pill); }
.coop-share-band { display:flex; gap:3px; height:10px; margin:0 0 16px; border-radius:10px; overflow:hidden; background:var(--pill); }
.coop-share-band > span { min-width:0; background:var(--coop-player-color,var(--accent)); }
.coop-contribution-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.coop-contribution-card { min-width:0; padding:14px; border:1px solid var(--line); border-radius:16px; background:var(--surface); }
.coop-contribution-header { display:flex; justify-content:space-between; align-items:start; gap:10px; margin-bottom:12px; }
.coop-contribution-card .coop-stats-name { flex:1; align-items:baseline; flex-wrap:wrap; gap:5px; }
.coop-contribution-card .coop-stats-name > b { max-width:100%; font-size:.9rem; }
.coop-contribution-card .coop-stats-name > i { align-self:center; }
.coop-contribution-share { color:var(--muted); font-size:.75rem; font-variant-numeric:tabular-nums; }
.coop-contribution-numbers { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.coop-contribution-numbers > span { display:flex; align-items:baseline; gap:6px; min-width:0; }
.coop-contribution-numbers strong { font-size:1.85rem; line-height:1; letter-spacing:-.04em; font-variant-numeric:tabular-nums; }
.coop-contribution-numbers small { color:var(--muted); font-size:.75rem; line-height:1.3; }
.coop-contribution-numbers .coop-contribution-mistakes { text-align:right; }
.coop-contribution-mistakes strong { font-size:1rem; color:var(--muted); }
.coop-contribution-mistakes.has-mistakes strong { color:var(--danger,#b43b47); }
.coop-moments-heading { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin:20px 0 10px; }
.coop-moments-heading h4 { margin:0; font-size:.85rem; }
.coop-moments-heading > span { color:var(--muted); font-size:.7rem; }
.coop-moments { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.coop-stats .coop-moment { min-width:0; display:grid; gap:8px; padding:13px; border:1px solid var(--line); border-radius:14px; background:var(--pill); text-align:left; color:var(--ink); text-decoration:none; font:inherit; }
.coop-stats :is(a,button).coop-moment { cursor:pointer; }
.coop-stats :is(a,button).coop-moment:hover { border-color:var(--accent); }
.coop-stats :is(a,button).coop-moment:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.coop-moment-label { color:var(--muted); font-size:.7rem; }
.coop-moment > strong { overflow-wrap:anywhere; font-size:.82rem; font-weight:650; }
.coop-moment-detail { display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--accent); font-size:.75rem; font-variant-numeric:tabular-nums; }
.coop-moment-detail i { font-style:normal; }
@media (max-width:480px) {
  .coop-contribution-cards { grid-template-columns:minmax(0,1fr); gap:8px; }
  .coop-contribution-card { padding:12px 14px; border-radius:13px; }
  .coop-contribution-header { margin-bottom:8px; }
  .coop-contribution-numbers strong { font-size:1.6rem; }
  .coop-contribution-numbers .coop-contribution-mistakes strong { font-size:1rem; }
  .coop-moments { grid-template-columns:minmax(0,1fr); gap:6px; }
  .coop-stats .coop-moment { grid-template-columns:minmax(0,1fr) auto; gap:4px 12px; padding:11px 13px; }
  .coop-moment-label,.coop-moment > strong { grid-column:1; }
  .coop-moment-detail { grid-column:2; grid-row:1/3; align-self:center; max-width:130px; }
}
.coop-stats-table { width:100%; border-collapse:collapse; table-layout:fixed; font-size:.9rem; }
.coop-stats-table th,.coop-stats-table td { padding:12px 8px; border-bottom:1px solid var(--line); text-align:right; vertical-align:middle; overflow-wrap:anywhere; }
.coop-stats-table th:first-child { width:50%; padding-left:0; text-align:left; }
@media (max-width:400px) {
  .coop-stats-table th,.coop-stats-table td { padding-left:6px; padding-right:6px; }
  .coop-stats-table th:first-child { width:44%; }
}
.coop-stats-table thead th { color:var(--muted); font-size:.75rem; font-weight:600; }
.coop-stats-table td { font-size:1.05rem; font-weight:750; font-variant-numeric:tabular-nums; }
.coop-stats-name { display:flex; align-items:center; gap:7px; min-width:0; }
.coop-stats-name > i { flex:none; width:8px; height:8px; border-radius:50%; background:var(--coop-player-color); }
.coop-stats-name > b { min-width:0; overflow-wrap:anywhere; font-size:.85rem; }
.coop-stats-name small { color:var(--muted); font-weight:500; font-size:.65rem; }
.coop-stats .duel-progress-chart { margin:20px 0 14px; border-radius:14px; }
.coop-stats-details { border-top:1px solid var(--line); padding-top:12px; }
.coop-stats-details summary { cursor:pointer; color:var(--muted); font-size:.85rem; padding:5px 0; }
.coop-stats-details p,.coop-stats-unavailable p { color:var(--muted); font-size:.8rem; margin:12px 0 0; }
.coop-replay > .coop-stats { padding:20px; background:var(--surface); border:1px solid var(--line); border-radius:18px; }
@media (max-width:650px) {
  .coop-setup { grid-template-columns:minmax(0,1fr); gap:16px; }
  .coop-panel { padding:20px; border-radius:18px; }
  .coop-panel h2 { font-size:1.25rem; }
  .coop-player b { max-width:130px; }
  .coop-gamebar .coop-player { padding:4px 6px 4px 10px; }
  .coop-gamebar .coop-player b { font-size:.75rem; }
  :root body[data-game] #view-game.is-coop-game .g-title { white-space:normal; text-align:center; line-height:1.2; }
  :root body[data-game] #view-game.is-coop-game .g-title :is(.logo,.classic-title-icon,.tango-title-icons) { display:none; }
  .coop-gamebar { gap:8px; padding:7px 8px; margin-bottom:6px; }
  .coop-gamebar .coop-players { gap:5px 8px; }
  .is-coop-game #mini-sudoku-tools { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .coop-fields { gap:10px; }
  .coop-result-actions .btn { flex:1; }
  .coop-invite code { font-size:1rem; }
}

@media (max-width:480px) {
  .coop-gamebar { display:block; }
  .coop-game-label { display:block; margin-bottom:5px; font-size:.65rem; line-height:14px; }
}

@media(max-width:360px) {
  .coop-stats .coop-moment { grid-template-columns:minmax(0,1fr); }
  .coop-moment-detail { grid-column:1; grid-row:auto; max-width:none; margin-top:3px; }
}
