/* Immediate input feedback is separate from server-confirmed action outcomes. */
.auto-pass-control { display:flex; align-items:center; gap:6px; min-height:38px; cursor:pointer; color:#75684f; font-size:12px; white-space:nowrap; }
.auto-pass-control input { appearance:auto; width:17px; height:17px; min-height:0; margin:0; padding:0; accent-color:#69734d; cursor:pointer; }
.auto-pass-control:has(input:checked) { color:#405740; font-weight:650; }
.auto-pass-control:has(input:focus-visible) { outline:2px solid #a88b4b; outline-offset:4px; border-radius:3px; }
.action-history-link { display:inline; padding:0; border:0; background:none; color:inherit; font:inherit; text-align:left; cursor:pointer; letter-spacing:inherit; }
.history-cue { display:inline-block; margin-left:7px; color:#927a4e; font:500 13px/1 system-ui,sans-serif; vertical-align:middle; }
.action-history-link:hover .history-cue { transform:translate(2px,-2px); }
.action-history-link:focus-visible { outline:2px solid #a88b4b; outline-offset:4px; border-radius:3px; }
#event-history-open,[data-history-surface] { cursor:pointer; }
#event-history-open:focus-visible,[data-history-surface]:focus-visible { outline:2px solid #a88b4b; outline-offset:3px; border-radius:12px; }
#event-history-open::after { content:'History ↗'; flex-shrink:0; margin-left:auto; font:500 10px/1.2 var(--sans,system-ui,sans-serif); color:#847046; }
#event-history-open.has-stage-recap::after { position:absolute; bottom:4px; right:8px; z-index:5; padding:2px 4px; background:#f7efd7; color:#55442b; border-radius:3px; }
.history-intro { margin:0 0 14px; color:#81745d; font:12px/1.5 var(--sans,system-ui,sans-serif); }
#history-modal { width:min(560px,calc(100vw - 24px)); padding:20px; }
#history-modal .modal-top { position:sticky; top:-20px; z-index:2; background:var(--paper,#fcf8ee); margin:-20px -20px 0; padding:12px 16px; border-bottom:1px solid #d8ceba; }
#history-modal h2 { margin:14px 0 7px; font-size:29px; }
#history-modal .activity-list { margin:0; }
#history-modal .story-event { padding:12px 0; }
.interaction-feedback { position:fixed; z-index:80; pointer-events:none; border:1px solid var(--interaction-color,#b18b48); border-radius:8px; box-shadow:inset 0 0 20px #dfc18135,0 0 20px #ba975b22; }
.interaction-ring { position:absolute; inset:0; border:1px solid var(--interaction-color); border-radius:inherit; animation:interaction-ring-out 600ms ease-out both; }
.interaction-mark { position:absolute; top:50%; left:50%; width:26px; height:26px; display:grid; place-items:center; color:var(--interaction-color); padding:4px; background:#fff7e8eb; border-radius:50%; box-shadow:0 2px 8px #54462922; animation:interaction-mark-lift 620ms cubic-bezier(.2,.7,.3,1) both; }
.interaction-mark svg { width:100%; height:100%; }
.fx-hand-loss-focus { position:fixed; z-index:75; overflow:hidden; pointer-events:none; border:2px solid #a65340; border-radius:8px; background:#e6dcca; box-shadow:0 8px 20px #502c3340,inset 0 0 0 2px #f8e0b9; }
.fx-hand-loss-focus .character-art { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.fx-hand-loss-focus::after { content:''; position:absolute; inset:0; background:linear-gradient(115deg,transparent 47%,#efe0b9c9 48%,#692e2d99 49%,transparent 50%); opacity:0; animation:influence-fracture 1400ms 250ms ease-out both; }
.loss-focus-seal { position:absolute; z-index:1; left:3%; right:3%; top:50%; padding:5px 2px; transform:translateY(-50%) rotate(-7deg); border:2px double #eadcc6; background:#87382eee; color:#fff1dc; text-align:center; font:750 clamp(9px,1vw,12px)/1.1 var(--sans,system-ui,sans-serif); letter-spacing:.05em; animation:influence-seal 700ms 240ms both; }
.is-opponent .loss-focus-seal { border:0; font-size:15px; padding:0; }
.influence-card[data-deal-state="front"]::after { content:''; position:absolute; inset:0; z-index:3; pointer-events:none; border-radius:inherit; background:linear-gradient(115deg,transparent 25%,#fff7dc99 48%,transparent 72%); animation:influence-reveal-glint 650ms ease-out both; }
.in-game .action-button,.in-game .response-buttons .button,.in-game .target-option,.in-game .guess-role,.in-game .influence-card { transition:border-color 160ms ease,background-color 160ms ease,box-shadow 160ms ease,filter 180ms ease; }
.in-game .action-button:not(:disabled):hover,.in-game .target-option:hover { border-color:#ae8b4d; box-shadow:0 3px 0 #bfa87355,0 5px 13px #8c78581a; }
.in-game .response-buttons .button:not(:disabled):hover { box-shadow:0 3px 0 #71624844,0 5px 12px #51432b20; }
.in-game .influence-card.selected .character-art { filter:brightness(1.08) saturate(1.08); }
.in-game .influence-card.selected .card-check { animation:interaction-select 240ms ease-out both; }
.in-game .influence-card.loss-choice.selected { border-color:#a34f3e; }
.in-game .influence-card.loss-choice.selected .character-art { filter:sepia(.18) saturate(.8); }
.in-game .guess-role[aria-pressed="true"] { box-shadow:0 0 0 2px #a98a47,0 3px 10px #80643133; }
dialog[open] { animation:interaction-dialog-in 160ms ease-out both; }
dialog::backdrop { background:#20251ccc; backdrop-filter:blur(3px); }
@keyframes interaction-ring-out { from { opacity:.7; transform:scale(.98); } to { opacity:0; transform:scale(1.09,1.23); } }
@keyframes interaction-mark-lift { 0% { opacity:0; transform:translate(-50%,-10%) scale(.7); } 25% { opacity:1; transform:translate(-50%,-75%) scale(1.06); } 100% { opacity:0; transform:translate(-50%,-155%) scale(.8); } }
@keyframes influence-fracture { 0% { opacity:0; clip-path:inset(0 0 100% 0); } 55%,100% { opacity:.7; clip-path:inset(0); } }
@keyframes influence-seal { 0% { opacity:0; transform:translateY(-50%) rotate(-12deg) scale(1.4); } 45% { opacity:1; transform:translateY(-50%) rotate(-7deg) scale(.96); } 100% { opacity:1; transform:translateY(-50%) rotate(-7deg) scale(1); } }
@keyframes influence-reveal-glint { from { opacity:0; transform:translateX(-100%); } 30% { opacity:.75; } to { opacity:0; transform:translateX(100%); } }
@keyframes interaction-select { from { transform:scale(.5); } 70% { transform:scale(1.12); } to { transform:scale(1); } }
@keyframes interaction-dialog-in { from { opacity:0; transform:translateY(8px) scale(.99); } to { opacity:1; transform:translateY(0) scale(1); } }
@media(max-width:760px) {
  .room-actions { gap:7px; }
  .auto-pass-control { gap:4px; font-size:11px; min-height:40px; }
  .auto-pass-long,.room-actions #history-open { display:none; }
  .auto-pass-control input { width:15px; height:15px; }
  .history-cue { font-size:11px; margin-left:4px; }
  #event-history-open::after { font-size:9px; }
  .in-game .decision-panel .response-buttons .button { font-size:12px; min-height:48px; }
  #history-modal { padding:16px; }
  #history-modal .modal-top { top:-16px; margin:-16px -16px 0; }
}
@media(max-width:360px) {
  .history-cue { display:none; }
  .room-actions { gap:5px; }
  .room-breadcrumb { gap:3px; }
  .room-breadcrumb > span:last-child { display:none; }
  .auto-pass-control { font-size:10px; }
  .in-game .decision-panel .response-buttons .button { font-size:11px; padding:7px 4px; }
}
@media(prefers-reduced-motion:reduce) {
  .interaction-feedback,.fx-hand-loss-focus { display:none!important; }
  .influence-card::after,.influence-card .card-check,dialog[open] { animation:none!important; }
  .in-game button,.history-cue { transition:none!important; }
}
html[data-motion="reduced"] .interaction-feedback,html[data-motion="reduced"] .fx-hand-loss-focus { display:none!important; }
html[data-motion="reduced"] .influence-card::after,html[data-motion="reduced"] .influence-card .card-check,html[data-motion="reduced"] dialog[open] { animation:none!important; }
html[data-motion="reduced"] .in-game button,html[data-motion="reduced"] .history-cue { transition:none!important; }
