.reaction-panel{gap:10px;display:grid}@media (width>=1024px){.reaction-panel{gap:14px}}.reaction-stage{height:clamp(220px,100svh - 520px,380px);position:relative}@media (width>=1024px){.reaction-stage{height:420px}}.reaction-surface{border:1px solid var(--screen);border-radius:var(--radius-sm);background:var(--screen);width:100%;height:100%;color:var(--screen-ink);font:inherit;text-align:center;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;flex-direction:column;justify-content:center;align-items:center;margin:0;padding:16px;display:flex;position:absolute;inset:0}.reaction-surface[data-phase=ready]{background:var(--panel);border-color:var(--line);color:var(--ink)}.reaction-surface[data-phase=go]{background:var(--accent);border-color:var(--accent);color:var(--ink)}.reaction-label{letter-spacing:-.01em;font-size:26px;font-weight:700;line-height:1.15}.reaction-go{letter-spacing:-.02em;font-size:56px;font-weight:800;line-height:1}.reaction-result{direction:ltr;align-items:baseline;gap:10px;display:flex}.reaction-value{font-variant-numeric:tabular-nums;letter-spacing:-.04em;font-size:96px;font-weight:200;font-stretch:125%;line-height:1}.reaction-unit{color:var(--screen-muted);font-size:22px}.reaction-early{flex-direction:column;align-items:center;gap:8px;display:flex}.reaction-sub{color:var(--screen-muted);font-size:17px}.reaction-touch{display:none}@media (pointer:coarse){.reaction-touch{display:inline}.reaction-mouse{display:none}}@media (width>=1024px){.reaction-surface{padding:24px}.reaction-label{letter-spacing:-.015em;font-size:34px}.reaction-go{font-size:88px}.reaction-result{gap:14px}.reaction-value{font-size:150px}.reaction-unit{font-size:28px}.reaction-early{gap:10px}.reaction-sub{font-size:20px}}.reaction-slots{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:0;padding:0;list-style:none;display:grid}.reaction-slot{border:1px dashed var(--input);border-radius:var(--radius-xs);font-variant-numeric:tabular-nums;letter-spacing:-.02em;justify-content:center;align-items:center;height:40px;font-size:17px;font-stretch:125%;display:flex}.reaction-slot.is-set{border:1px solid var(--ink);background:var(--ink);color:var(--screen-ink)}@media (width>=1024px){.reaction-slot{height:52px;font-size:20px}}.reaction-scale{border-top:1px solid var(--line-2);padding:10px 2px 0}.reaction-track{direction:ltr;height:46px;position:relative}.reaction-track:before{content:"";background:var(--input);height:1px;position:absolute;top:22px;left:0;right:0}.reaction-tick{background:var(--input);width:1px;height:6px;margin-left:-.5px;position:absolute;top:22px}.reaction-tick-label{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:13px;line-height:1;position:absolute;top:32px;transform:translate(-50%)}.reaction-tick-label.is-first{transform:none}.reaction-tick-label.is-last{transform:translate(-100%)}.reaction-mark{background:var(--ink);border-radius:2px;width:4px;height:14px;margin-left:-2px;position:absolute;top:8px}.reaction-mark.is-new{background:var(--accent);height:20px;top:2px}@media (width>=1024px){.reaction-scale{padding-top:14px}.reaction-track{height:52px}.reaction-track:before,.reaction-tick{top:26px}.reaction-tick{height:7px}.reaction-tick-label{font-size:14px;top:38px}.reaction-mark{width:5px;height:18px;margin-left:-2.5px}.reaction-mark.is-new{height:26px;top:0}}.reaction-levels{border-top:1px solid var(--line);gap:10px;padding-top:16px;display:grid}.reaction-levels-title{font-size:14px;font-weight:600}.reaction-levels ul{gap:10px;margin:0;display:grid}.reaction-level{font-variant-numeric:tabular-nums;justify-content:space-between;gap:12px;font-size:16px;display:flex}.reaction-level.is-current{color:var(--accent-text);font-weight:700}@media (prefers-reduced-motion:no-preference){.reaction-result,.reaction-slot.is-new{animation:.24s cubic-bezier(.2,.8,.2,1) reaction-in}.reaction-early{animation:.34s ease-out reaction-shake}.reaction-mark.is-new{animation:.3s cubic-bezier(.2,.8,.2,1) reaction-drop}}@keyframes reaction-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes reaction-shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(7px)}60%{transform:translate(-4px)}80%{transform:translate(2px)}}@keyframes reaction-drop{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}