:root[data-social-game="reaction"] {--ui-game-light:#087b70;--ui-game-dark:#78dfcb;--game-motif:url('/assets/atmospheres/reaction.svg');}
.reaction-page {width:min(100%,960px);margin:0 auto;display:grid;gap:24px;min-width:0;}
.reaction-page .panel {min-width:0;}
.reaction-setup {display:flex;flex-wrap:wrap;align-items:end;justify-content:center;gap:20px;}
.reaction-setup .field {min-width:180px;}
.reaction-mode-links {display:flex;flex-wrap:wrap;justify-content:center;gap:12px;}
.reaction-play-heading {display:flex;align-items:center;justify-content:space-between;gap:12px;}
.reaction-play-heading h1 {margin:4px 0;font-size:clamp(24px,4vw,40px);}
.reaction-progress {font-weight:700;text-align:center;font-variant-numeric:tabular-nums;min-height:24px;}
.reaction-pad {box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;width:100%;height:clamp(250px,43svh,430px);border:2px solid #358d82;border-radius:28px;background:#123d3a;color:#f0fffa;cursor:pointer;font:inherit;touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;transition:none;box-shadow:0 8px 0 #0c27272b;}
.reaction-pad:focus-visible {outline:4px solid var(--ui-accent,#087b70);outline-offset:5px;}
.reaction-pad:disabled {opacity:1;cursor:default;}
.reaction-pad strong {font-size:clamp(28px,5vw,54px);font-weight:800;line-height:1.15;}
.reaction-glyph {font-size:48px;line-height:1;}
.reaction-pad-help {font-size:16px;}
.reaction-pad[data-phase="waiting"] {background:#822e43;border-color:#a94b63;color:#fff5f6;}
.reaction-pad[data-phase="go"] {background:#83e2b5;color:#073d29;border-color:#48b385;}
.reaction-feedback {min-height:1.6em;margin:18px 0 0;text-align:center;font-weight:700;color:var(--ui-ink,#243044);}
.reaction-fairness {text-align:center;font-size:14px;line-height:1.6;color:var(--ui-muted,#536375);margin:0;}
.reaction-opponents {display:flex;justify-content:center;flex-wrap:wrap;gap:12px;}
.reaction-opponents>span {display:grid;grid-template-columns:8px 1fr;align-items:center;gap:6px 8px;background:var(--ui-surface,#fff);border:1px solid var(--ui-line,#d3dfe7);border-radius:16px;padding:12px 18px;}
.reaction-opponents i {height:8px;width:8px;border-radius:50%;background:#8c97a7;}
.reaction-opponents i.is-online {background:#208458;}
.reaction-opponents small {grid-column:2;}
.reaction-result-grid {display:flex;flex-wrap:wrap;justify-content:center;gap:20px;}
.reaction-result {padding:28px;flex:1 1 300px;max-width:560px;text-align:center;}
.reaction-result h2 {margin:0 0 18px;}
.reaction-average {display:block;font-size:clamp(40px,7vw,76px);line-height:1.2;color:var(--ui-accent,#087b70);font-variant-numeric:tabular-nums;}
.reaction-average small {display:block;font-size:16px;font-weight:600;}
.reaction-trials {list-style:none;padding:0;margin:28px 0 0;display:grid;gap:12px;text-align:left;}
.reaction-trials li {display:grid;grid-template-columns:18px 1fr 72px;gap:6px 8px;align-items:center;font-variant-numeric:tabular-nums;}
.reaction-trials small {grid-column:2 / -1;color:var(--ui-muted,#536375);}
.reaction-bar {width:var(--trial-width);min-width:6px;height:12px;background:#309d88;border-radius:20px;}
.reaction-bar.is-penalty {background:#c87c47;}
.relay-sprint {width:min(100%,840px);margin:20px auto;}
.math-sprint-card {padding:clamp(20px,4vw,48px);text-align:center;border:1px solid var(--ui-line,#d3dfe7);border-radius:28px;background:var(--ui-surface,#fff);}
.math-sprint-problem {font-size:clamp(28px,7vw,56px);font-weight:800;margin:28px 0;}
.math-sprint-card input {box-sizing:border-box;width:min(100%,260px);font:inherit;font-size:32px;text-align:center;padding:14px;border:2px solid var(--ui-line,#d3dfe7);border-radius:16px;background:var(--ui-surface,#fff);color:var(--ui-ink,#243044);}
.math-sprint-card button {margin:16px auto;min-height:48px;}
@media(max-width:600px){.reaction-page {gap:16px;}.reaction-playing {padding-bottom:20px;}.reaction-play-heading {flex-wrap:wrap;}.reaction-result {padding:20px;}.reaction-pad {border-radius:22px;height:clamp(230px,40svh,360px);}.reaction-mode-links>* {flex:1 1 150px;text-align:center;}.reaction-opponents {gap:8px;}.reaction-opponents>span {padding:10px 12px;}.reaction-setup>* {flex:1;}}
@media(forced-colors:active){.reaction-pad{border:3px solid ButtonText;}.reaction-bar{background:Highlight;}}
body[data-social-game="reaction"] .reaction-pad, #relay-content .reaction-pad {border-radius:28px;}
.reaction-setup + .reaction-fairness {margin-top:20px;}
@media(max-width:600px){.reaction-setup{display:grid;grid-template-columns:1fr;gap:16px;}.reaction-setup .field,.reaction-setup>.button{width:100%;}.reaction-play-heading .eyebrow{font-size:13px;}.reaction-play-heading .button{font-size:13px;min-height:40px;padding:8px 12px;}.reaction-play-heading h1{font-size:26px;}.reaction-page .reaction-pad{height:clamp(220px,38svh,340px);}}
#relay-content .relay-sprint [hidden] {display:none !important;}
:root body.is-relay-sprint #topbar,
:root body.is-relay-sprint #view-relay > .multiplayer-modes,
body.is-relay-sprint #logic-privacy-footer {display:none;}
:root body.is-relay-sprint #view-relay {width:min(100%,920px);margin:0 auto;min-height:100svh;padding:max(12px,env(safe-area-inset-top)) 14px 70px;display:grid;align-content:center;}
body.is-relay-sprint #relay-content {display:grid;gap:16px;}
body.is-relay-sprint .relay-sprint {margin:0 auto;gap:10px;}
body.is-relay-sprint .reaction-play-heading p {margin:0;font-size:13px;}
body.is-relay-sprint .reaction-play-heading h1 {font-size:26px;}
body.is-relay-sprint .reaction-pad {height:clamp(210px,35svh,340px);}
body.is-relay-sprint .reaction-feedback {margin:4px 0;}
body.is-relay-sprint .math-sprint-card {padding:18px;}
body.is-relay-sprint .math-sprint-problem {margin:16px 0;}
body.is-relay-sprint .relay-racebar .relay-note {margin:5px 0 0;font-size:11px;line-height:1.4;}
body.is-relay-sprint .skip-link:not(:focus) {position:fixed;top:-100px;}