/* Scoped game surface: independent of the portal's editorial component rules. */
.utility-page.reflex-page { --arena-cyan:#6ce7ff; --arena-gold:#ffd17a; }
.reflex-page .hero h1 { font-family:inherit; font-weight:900; text-transform:uppercase; font-size:clamp(2.3rem,6vw,4.7rem); line-height:1; letter-spacing:-.055em; }
.reflex-page .hero .eyebrow { color:var(--arena-cyan); }
.reflex-page .tool { border-radius:24px; border:1px solid #304b54; background:linear-gradient(145deg,#10232b,#0a1919 70%); padding:clamp(1rem,3vw,2rem); }
.reflex-page .hero .notice { font-size:.85rem; max-width:75ch; }
.reflex-page .mode-tabs { gap:.6rem; margin-block:1rem; }
.reflex-page .mode-tabs button { flex:1; max-width:220px; border-radius:999px; }
.reflex-page .mode-tabs button[aria-selected=true] { background:var(--arena-cyan); border-color:var(--arena-cyan); color:#06151e; }
.reflex-page .tool-heading h2 { margin:.25rem 0; font-size:clamp(1.4rem,3vw,2rem); }
.reflex-page .tool-heading .field { min-width:135px; }
.reflex-page .eyebrow { color:var(--arena-cyan); }
.reflex-page .toolbar { margin-block:1rem; }
.reflex-page .toolbar button { min-height:48px; }
.reflex-page .primary { background:var(--arena-cyan); border-color:var(--arena-cyan); color:#06151e; }
.reflex-page .reaction-arena { --signal:#94aab5; padding:clamp(1rem,3vw,2rem); border:1px solid #3e5964; border-radius:24px; background:radial-gradient(ellipse at 50% 0,#193944,transparent 70%),#071318; margin-block:1rem 1.6rem; }
.reflex-page .arena-topline { display:flex; justify-content:space-between; gap:.8rem; flex-wrap:wrap; color:#a5bfca; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; font-weight:800; }
.reflex-page .arena-topline span:first-child { color:var(--arena-cyan); }
.reflex-page .signal { min-height:4.5rem; display:grid; place-items:center; text-align:center; margin:1rem 0 1.4rem; font-size:clamp(1.1rem,3.6vw,1.8rem); line-height:1.3; font-weight:850; color:var(--signal); }
.reflex-page .reaction-pad { width:100%; display:grid; place-items:center; min-height:220px; padding:1.5rem; border:3px solid #63828f; border-radius:20px; background:#152d38; color:#edfaff; box-shadow:inset 0 -8px 0 #0004; text-align:center; touch-action:manipulation; user-select:none; -webkit-user-select:none; transition:none; transform:none; }
.reflex-page .reaction-pad strong { display:block; font-size:clamp(1.6rem,6vw,3.5rem); font-weight:950; letter-spacing:.015em; line-height:1.1; }
.reflex-page .reaction-pad small { display:block; margin:.7rem auto 0; max-width:40ch; font-size:clamp(.85rem,2.4vw,1rem); line-height:1.45; color:inherit; opacity:.9; }
.reflex-page .reaction-pad[data-state=waiting] { background:#52380c; border-color:#ffcb64; color:#fff0c9; }
.reflex-page .reaction-pad[data-state=ready] { background:#69ff99; border-color:#c3ffda; color:#032b16; box-shadow:0 0 0 5px #69ff9926,0 0 55px #69ff9933,inset 0 -8px 0 #0002; }
.reflex-page .reaction-pad[data-state=early] { background:#8a2437; border-color:#ff9eae; color:#fff3f5; }
.reflex-page .reaction-pad[data-state=done] { background:#153556; border-color:#7cbbff; color:#ecf5ff; }
.reflex-page .reaction-arena[data-state=waiting] { --signal:#ffd17a; }
.reflex-page .reaction-arena[data-state=ready] { --signal:#69ff99; border-color:#69ff99; }
.reflex-page .reaction-arena[data-state=early] { --signal:#ff9eae; }
.reflex-page .reaction-arena[data-state=done] { --signal:#9dcdff; }
.reflex-page .arena-hint { text-align:center; color:#a5bfca; font-size:.8rem; margin:1rem 0 0; }
.reflex-page kbd { font:inherit; border:1px solid #63828f; border-bottom-width:3px; border-radius:5px; padding:.1rem .35rem; color:#edfaff; }
.reflex-page .results-list { display:flex; flex-wrap:wrap; gap:.5rem; }
.reflex-page .results-list li { flex:1 1 150px; }
.reflex-page .stats-grid { grid-template-columns:repeat(auto-fit,minmax(115px,1fr)); }
.reflex-page .stat { border-color:#304b54; }
.reflex-page .stat strong { color:var(--arena-cyan); }
.reflex-page .objective-board { margin-top:2rem; padding-top:1.8rem; border-top:1px solid #304b54; }
.reflex-page .objective-heading { align-items:center; }
.reflex-page .objective-heading h3 { font-size:clamp(1.4rem,3vw,2rem); }
.reflex-page .rank-emblem { display:grid; justify-items:center; min-width:110px; color:var(--arena-gold); border:1px solid #ffd17a66; border-radius:18px; padding:.5rem .8rem; background:#ffd17a0a; }
.reflex-page .rank-emblem strong { font-size:2.4rem; line-height:1.15; }
.reflex-page .rank-emblem span { font-size:.7rem; }
.reflex-page .objective-ladder { gap:.6rem; list-style:none; padding:0; }
.reflex-page .objective-item { display:grid; grid-template-columns:2.8rem minmax(0,1fr) auto minmax(8rem,auto); align-items:center; gap:.8rem; padding:.9rem; border-radius:14px; border:1px solid #304b54; background:#07171d; }
.reflex-page .objective-item:first-child { border-color:#ffd17a88; background:linear-gradient(100deg,#3b301b66,#07171d); }
.reflex-page .objective-number { width:2.7rem; height:2.7rem; border-radius:10px; color:#d0e1e9; background:#17303b; border-color:#304b54; }
.reflex-page .objective-item:first-child .objective-number { color:var(--arena-gold); border-color:#ffd17a88; }
.reflex-page .objective-copy strong { color:#edfaff; }
.reflex-page .objective-copy small { font-size:.75rem; margin-top:.2rem; color:#a5bfca; }
.reflex-page .objective-target { color:#d0e1e9; }
.reflex-page .objective-state { font-size:.75rem; }
.reflex-page .objective-item.is-current { border:2px solid #69ff99; background:#69ff9912; }
.reflex-page .is-current .objective-number { color:#032b16; background:#69ff99; }
.reflex-page .is-current .objective-state { color:#69ff99; }
.reflex-page .objective-item.is-next { border-color:var(--arena-cyan); }
.reflex-page .is-next .objective-state { color:var(--arena-cyan); }
.reflex-page .duel-score { padding:1rem; border:1px solid #304b54; border-radius:12px; }
.reflex-page .duel-score strong { color:var(--arena-gold); font-size:1.8rem; }
.reflex-page #duel-status { min-height:3rem; font-size:1.15rem; font-weight:800; color:var(--arena-cyan); }
.reflex-page .duel-grid .reaction-pad { min-height:240px; }
.reflex-page :focus-visible { outline:3px solid #fff; outline-offset:5px; }
@media(max-width:650px) {
  .reflex-page .reaction-pad { min-height:190px; padding:1rem; }
  .reflex-page .reaction-arena { padding:1rem; }
  .reflex-page .signal { min-height:5rem; font-size:1.2rem; }
  .reflex-page .arena-topline { font-size:.65rem; letter-spacing:.07em; }
  .reflex-page .objective-item { grid-template-columns:2.7rem minmax(0,1fr); gap:.35rem .7rem; }
  .reflex-page .objective-target,.reflex-page .objective-state { grid-column:2; text-align:left; }
  .reflex-page .objective-number { grid-row:1 / span 3; }
  .reflex-page .rank-emblem { min-width:90px; }
  .reflex-page .duel-grid .reaction-pad { min-height:210px; padding:.7rem; }
  .reflex-page .duel-grid .reaction-pad strong { font-size:1.45rem; overflow-wrap:anywhere; }
  .reflex-page .duel-grid .reaction-pad small { font-size:.8rem; }
}