/* Hallmark · macrostructure: Workbench (existing system, by request)
 * genre: modern-minimal · tone: clean, utilitarian · anchor hue: slate-blue
 * pre-emit critique: P5 H5 E4 S5 R5 V4 · no decorative motion */
.brain-tool { padding:var(--space-lg); color:var(--color-ink); }
.brain-game { scroll-margin-top:6rem; }
.brain-toolbar,.brain-actions,.brain-footer { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-md); }
.brain-toolbar { justify-content:space-between; margin-bottom:var(--space-lg); }
.brain-tool button { min-height:44px; touch-action:manipulation; }
.brain-tool .button { white-space:nowrap; }
.brain-tool button:focus-visible,.brain-tool input:focus-visible,.brain-tool textarea:focus-visible,.typing-passage:focus-visible { outline:3px solid var(--color-focus); outline-offset:3px; }
.brain-tool button:active:not(:disabled) { transform:translateY(1px); }
.brain-tool button:disabled { opacity:.55; cursor:not-allowed; }
.brain-status { min-height:3em; margin:var(--space-lg) 0; line-height:1.6; overflow-wrap:anywhere; }
.brain-footer { border-top:var(--rule) solid var(--color-rule); padding-top:var(--space-md); font-size:var(--text-sm); color:var(--color-muted); }
.brain-footer span { flex:1 1 16rem; }
.brain-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-md); margin:var(--space-lg) 0; }
.brain-metrics > div { padding-block:var(--space-md); border-block:var(--rule) solid var(--color-rule); }
.brain-metrics dt { color:var(--color-muted); font-size:var(--text-sm); }
.brain-metrics dd { margin:var(--space-xs) 0 0; font-size:var(--text-2xl); font-weight:600; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.brain-reaction { display:block; width:100%; min-height:13rem; padding:var(--space-lg); border:var(--rule) solid var(--color-accent); background:var(--color-accent); color:var(--color-accent-ink); font:600 var(--text-2xl)/1.3 var(--font-body); cursor:pointer; }
.brain-reaction[data-state=waiting] { background:var(--color-graphite); color:var(--color-on-dark); }
.brain-reaction[data-state=ready] { background:var(--color-reaction-cue); color:var(--color-ink); border-color:var(--color-success); }
.brain-reaction[data-state=early] { background:var(--color-paper-2); color:var(--color-error); border-color:var(--color-error); }
.sequence-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-sm); max-width:24rem; margin-inline:auto; }
.sequence-tile { aspect-ratio:1; border:var(--rule) solid var(--color-rule); background:var(--color-paper-3); color:var(--color-muted); font:600 var(--text-xl) var(--font-body); cursor:pointer; }
.sequence-tile[aria-disabled=true] { cursor:default; }
.sequence-tile.lit { background:var(--color-accent); color:var(--color-accent-ink); outline:3px solid var(--color-accent); outline-offset:-3px; }
.aim-arena { position:relative; height:clamp(17rem,40vw,25rem); overflow:clip; border:var(--rule) solid var(--color-rule); background:var(--color-paper-2); touch-action:manipulation; }
.aim-arena > p { margin:var(--space-lg); max-width:30rem; }
.aim-target { position:absolute; width:48px; height:48px; padding:0; border:var(--rule) solid var(--color-accent); background:var(--color-paper); color:var(--color-accent); cursor:crosshair; }
.aim-target svg { width:100%; height:100%; stroke:currentColor; fill:none; stroke-width:1.5; pointer-events:none; }
.brain-tool .aim-target:active { transform:none; }
.memory-display { display:grid; place-items:center; min-height:12rem; padding:var(--space-lg); background:var(--color-paper-2); color:var(--color-ink); font:600 clamp(1.5rem,5vw,3rem)/1.5 var(--font-body); font-variant-numeric:tabular-nums; text-align:center; overflow-wrap:anywhere; word-break:break-all; }
.brain-actions { justify-content:center; margin-top:var(--space-lg); }
.brain-actions button { min-width:7rem; }
.number-form { max-width:32rem; margin:var(--space-lg) auto 0; }
.brain-tool label { display:block; margin-bottom:var(--space-xs); font-weight:600; }
.brain-tool input,.brain-tool textarea { display:block; box-sizing:border-box; width:100%; min-height:44px; padding:var(--space-sm); border:var(--rule) solid var(--color-rule); background:var(--color-paper); color:var(--color-ink); font:var(--text-lg)/1.5 var(--font-body); }
.brain-tool input[aria-invalid=true] { border-color:var(--color-error); }
.brain-tool textarea { resize:vertical; }
.brain-tool textarea:disabled { opacity:.55; cursor:not-allowed; }
.typing-passage { position:relative; max-height:12rem; overflow:auto; padding:var(--space-md); border:var(--rule) solid var(--color-rule); margin-bottom:var(--space-lg); font:var(--text-lg)/1.8 var(--font-body); white-space:pre-wrap; }
.typed-correct { color:var(--color-success); }
.typed-error { color:var(--color-error); text-decoration:underline; text-decoration-thickness:2px; background:var(--color-paper-3); }
.typing-caret { border-bottom:3px solid var(--color-accent); }
.brain-tool [hidden] { display:none!important; }
@media(hover:hover) { .brain-tool .sequence-tile:not([aria-disabled=true]):hover,.aim-target:hover { border-color:var(--color-accent); background:var(--color-paper-3); } }
@media(max-width:36rem) { .brain-tool { padding:var(--space-md); } .brain-metrics { gap:var(--space-xs); } .brain-metrics dd { font-size:var(--text-xl); } .brain-metrics dt { font-size:var(--text-xs); } .brain-toolbar { align-items:flex-start; } .brain-toolbar strong { font-size:var(--text-sm); } .brain-reaction { font-size:var(--text-xl); } }
@media(prefers-reduced-motion:reduce) { .brain-tool * { transition:none!important; } }