/* Cartridge selection, a visible call, and short peer-to-peer reactions. */
.archive-choice{width:min(100%,420px);display:grid;gap:8px;min-height:0}.archive-list{max-height:190px;overflow:auto;display:grid;gap:6px;overscroll-behavior:contain;touch-action:pan-y}.archive-list button{display:flex;gap:10px;align-items:center;justify-content:space-between;text-align:left;min-height:48px;padding:9px 12px}.archive-list button>span{font-size:12px;overflow-wrap:anywhere;min-width:0}.archive-list small{font-size:10px;color:var(--muted);flex-shrink:0}.archive-choice>#archive-cancel{justify-self:center;background:transparent;min-height:40px}
.pause-players{order:0;gap:16px}.pause-players>span{display:inline-flex;gap:6px;align-items:center;padding:0;border:0!important;border-radius:0;background:transparent!important;color:#bac8c2;font-size:11px}.pause-players i{font-style:normal;font-size:16px;display:grid;place-items:center;width:22px;height:22px;border:1px solid #788a83;border-radius:50%;color:#8c9c96}.pause-players>.ready{color:#d3efdf}.pause-players>.ready i{background:#a7d1b9;color:#15251e;border-color:#a7d1b9;font-size:13px;font-weight:700}
.touch-mode .landscape.compact-landscape .pause-players{display:flex}.touch-mode .landscape .pause-players>span{padding:0;font-size:10px}.touch-mode .landscape .pause-players i{width:20px;height:20px}
.pause-players>span>span{padding:0;border:0;background:transparent;font-size:inherit;color:inherit}
.touch-mode .landscape .pause-players>span>span{padding:0;font-size:inherit}
.portable-voice{width:128px;flex-wrap:wrap;row-gap:3px}.portable-call-status{flex:0 0 100%;margin:0;min-height:26px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:10px;line-height:1.3;color:#afc4ba;pointer-events:none;overflow-wrap:anywhere}.touch-mode .touch-heading:has(.portable-voice:not([hidden])){min-height:68px}.touch-mode .landscape .portable-voice{width:118px}.touch-mode .landscape .touch-heading:has(.portable-voice:not([hidden])){min-height:68px}.voice-state{max-width:135px;text-align:right;line-height:1.35}.voice-panel[data-call=incoming] .voice-state,.portable-voice[data-call=incoming] .portable-call-status,.portable-voice[data-call=outgoing] .portable-call-status{color:var(--orange)}.portable-voice[data-call=connected] .portable-call-status{color:#c0e6d1}.portable-voice[data-call=ended] .portable-call-status,.portable-voice[data-call=error] .portable-call-status,.voice-panel[data-call=ended] .voice-state{color:#efad9d}
.portable-voice[data-call=incoming] #portable-voice-connect,.voice-panel[data-call=incoming] #voice-connect{background:#39402a;border-color:var(--orange);color:#ffca97;animation:call-ring-glow 1.6s ease-in-out infinite}.portable-voice[data-call=incoming] #portable-call-symbol,.voice-panel[data-call=incoming] #voice-connect-symbol{animation:call-ring-shake 1.6s ease-in-out infinite;transform-origin:50% 70%}.portable-voice:is([data-call=outgoing],[data-call=connecting],[data-call=reconnecting],[data-call=permission]) #portable-voice-connect{animation:call-pulse 2s ease-in-out infinite}.portable-voice:is([data-call=connected],[data-call=connecting],[data-call=reconnecting],[data-call=outgoing]) #portable-voice-connect,.voice-panel:is([data-call=connected],[data-call=connecting],[data-call=reconnecting],[data-call=outgoing]) #voice-connect{border-color:#a16e66;color:#ffc1b3;background:#51312b60}.portable-voice[data-call=connected] #portable-voice-connect i{background:#9ee4b6}.portable-voice[data-call=ended] #portable-voice-connect{color:#efad9d;border-color:#806059}.voice-panel #voice-connect{min-height:44px}
@keyframes call-ring-glow{0%,100%{box-shadow:0 0 0 0 #ffb06d00}50%{box-shadow:0 0 0 4px #ffb06d35}}@keyframes call-ring-shake{0%,45%,100%{transform:rotate(0)}10%,30%{transform:rotate(-17deg)}20%,40%{transform:rotate(17deg)}}@keyframes call-pulse{0%,100%{opacity:1}50%{opacity:.55}}
.game-console{position:relative}.quick-chat{position:absolute;left:14px;bottom:74px;z-index:9}.quick-chat>#reaction-toggle{display:grid;place-items:center;width:42px;height:42px;min-height:42px;padding:9px;background:#182823ed;border:1px solid #657e71;color:#bed8ca;box-shadow:0 2px 8px #0004;touch-action:manipulation}.quick-chat>#reaction-toggle svg{width:21px;height:21px}.quick-chat>#reaction-toggle[aria-expanded=true]{border-color:var(--orange);color:var(--orange)}.reaction-panel{position:absolute;left:0;bottom:calc(100% + 9px);width:242px;max-height:330px;overflow:auto;padding:11px;border:1px solid #627b6c;border-radius:12px;background:#15241ff7;box-shadow:0 7px 28px #0008;touch-action:pan-y;overscroll-behavior:contain}.reaction-caption{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:5px}.reaction-caption strong{font-size:12px;font-weight:550}.reaction-caption button{width:32px;height:32px;padding:0;border:0;background:transparent;font-size:20px}.reaction-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.reaction-grid button{display:flex;align-items:center;gap:7px;min-height:42px;padding:6px 8px;font-size:10px;background:#23352d;border-color:#425a4d;text-align:left;touch-action:manipulation}.reaction-grid button>span:first-child{font-size:22px}.reaction-panel p{font-size:9px;color:#a2b7aa;line-height:1.5;margin:9px 0 0}.reaction-toast{position:absolute;z-index:8;top:10px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;width:max-content;max-width:calc(100% - 20px);padding:8px 12px;border:1px solid #bad8c3;border-radius:25px;background:#15291feb;color:#eff7f0;box-shadow:0 2px 12px #0006;pointer-events:none;user-select:none;animation:reaction-in .18s ease-out}.reaction-toast>span:first-child{font-size:25px;line-height:1}.reaction-toast>span:last-child{font-size:12px;overflow-wrap:anywhere}.reaction-toast.own{border-color:#708b7a;color:#c2d4c8;background:#18251fdb}.reaction-toast.own>span:first-child{font-size:20px}
@keyframes reaction-in{from{opacity:0;translate:0 -7px}to{opacity:1;translate:0 0}}
.touch-mode .quick-chat{left:22px;bottom:33px}.touch-mode .landscape .quick-chat{left:16px;bottom:13px}.touch-mode .landscape .reaction-panel{left:calc(var(--wing) + 2px);bottom:0;width:min(242px,calc(var(--portable-width) - var(--wing) - var(--right-wing) - 40px));max-height:calc(var(--portable-height) - 28px)}.touch-mode .landscape .reaction-grid button{min-height:38px}.touch-mode .landscape .reaction-panel p{margin-top:6px}.touch-mode .landscape .reaction-caption{margin-bottom:3px}.touch-mode .landscape .reaction-toast{top:10px;padding:6px 10px}.touch-mode .landscape .archive-list{max-height:min(160px,calc(var(--portable-height) - 140px))}.touch-mode .landscape .archive-list button{min-height:40px}.touch-mode .expanded.compact-portrait .touch-controls{padding-top:6px;padding-bottom:6px}.touch-mode .expanded.compact-portrait .touch-heading:has(.portable-voice:not([hidden])){min-height:62px}.touch-mode .expanded.compact-portrait .portable-call-status{min-height:20px;font-size:9px}.touch-mode .expanded.compact-portrait .quick-chat{left:20px;bottom:17px}.touch-mode .expanded.compact-portrait .screen-top{padding-top:5px;padding-bottom:5px}
@media(prefers-reduced-motion:reduce){.portable-voice #portable-voice-connect,.portable-voice #portable-call-symbol,.voice-panel #voice-connect,.voice-panel #voice-connect-symbol,.reaction-toast{animation:none!important}}
.reaction-grid button{gap:6px;padding-left:6px;padding-right:6px}.reaction-grid button>span:first-child{flex:0 0 22px}.reaction-grid button>span:last-child{min-width:0;overflow-wrap:anywhere}
.touch-mode .game-console.expanded:not(.landscape)>.quick-chat{position:relative;grid-column:1;grid-row:4;align-self:end;justify-self:start;left:auto;bottom:auto;margin:0 0 25px 14px;width:42px;height:42px}
.touch-mode .game-console.expanded:not(.landscape)>#touch-controls{grid-column:1;grid-row:4}
.touch-mode .game-console.expanded.compact-portrait:not(.landscape)>.quick-chat{margin-bottom:11px;margin-left:12px}
.file-load-overlay:has(.archive-choice:not([hidden])) .file-load-content{margin:0 auto;height:100%;min-height:0;flex-shrink:1;gap:8px}.file-load-overlay:has(.archive-choice:not([hidden])) .file-load-content>.title-icon{display:none}.file-load-overlay:has(.archive-choice:not([hidden])) .archive-choice{flex:1;grid-template-rows:minmax(0,1fr) auto;min-height:0}.file-load-overlay:has(.archive-choice:not([hidden])) .archive-list{max-height:none;align-content:start}