/* Tools / Mesa contract. The opt-in is absent from public Home and internal Inicio. */
html.statera-app[data-ui-system="tools"] {
  --ui-bg:#101216;--ui-surface:#191d23;--ui-raised:#222832;--ui-input:#15191f;
  --ui-text:#f5f6f8;--ui-muted:#b6becb;--ui-line:#3e4652;--ui-action:#ef6175;
  --ui-focus:#ff8ea0;--ui-positive:#91d4b2;--ui-negative:#ffabb6;
  --ui-red:#a9394b;--ui-black:#292a29;--ui-zero:#236d54;--ui-number-ink:#fffefa;
  --ui-control-border:#78776e;--st-control-border:var(--ui-control-border);
  --ui-radius:10px;--ui-control:44px;
  --st-bg:var(--ui-bg);--st-surface:var(--ui-surface);--st-raised:var(--ui-raised);--st-input:var(--ui-input);
  --st-text:var(--ui-text);--st-muted:var(--ui-muted);--st-border:var(--ui-line);--st-gold:var(--ui-action);
  --st-focus:var(--ui-focus);--st-positive:var(--ui-positive);--st-negative:var(--ui-negative);
  --st-game-red:var(--ui-red);--st-game-red-border:#bb6674;--st-game-zero:var(--ui-zero);--st-game-ink:var(--ui-number-ink);
  --st-game-black:var(--ui-black);--st-game-ink-red:var(--ui-number-ink);--st-game-ink-zero:var(--ui-number-ink);
}
html.statera-app[data-ui-system="tools"].st-app-light {
  --ui-bg:#f6f7f9;--ui-surface:#fff;--ui-raised:#f0f2f5;--ui-input:#fff;
  --ui-text:#18191d;--ui-muted:#555b65;--ui-line:#d7dbe2;--ui-action:#b5122b;
  --ui-focus:#b5122b;--ui-positive:#196344;--ui-negative:#a12d40;
  --ui-control-border:#818791;
  --st-gold-hover:#900f23;--st-selected:#fcebee;
}
html[data-ui-system="tools"] :is(.workspace,.app-container,dialog) {
  color:var(--ui-text);font-variant-numeric:tabular-nums;
}
html[data-ui-system="tools"] :is(button,a,input,select,textarea,summary):focus-visible {
  outline:3px solid var(--ui-focus)!important;outline-offset:3px!important;
}
html[data-ui-system="tools"] .workspace #content :is(h2,h3,h4) {text-wrap:balance}
html[data-ui-system="tools"] .workspace #content h2 {font-size:21px!important;line-height:1.25!important;letter-spacing:-.025em}
html[data-ui-system="tools"] .workspace #content h3 {font-size:17px!important;line-height:1.35!important}
html[data-ui-system="tools"] .workspace #content :is(label,.muted,.tip) {font-size:14px;line-height:1.5}
html[data-ui-system="tools"] .workspace #content .small {font-size:13px;line-height:1.5}
html[data-ui-system="tools"] .workspace #content :is(input:not([type=checkbox]):not([type=range]),select) {
  min-height:44px!important;font-size:16px!important;border-radius:7px;background:var(--ui-input);border-color:var(--ui-control-border);
}
html[data-ui-system="tools"] .workspace #content :is(.button,.secondary,.icon-button) {
  min-height:44px!important;font-size:14px;line-height:1.3;padding:10px 14px;border-radius:7px;
}
html[data-ui-system="tools"] .workspace #content .panel {border-radius:var(--ui-radius);box-shadow:none}
html[data-ui-system="tools"] .workspace #content .panel-head {gap:12px;margin-bottom:16px}
html[data-ui-system="tools"] .workspace #content .panel-head :is(h2,h3) {margin:0}
html[data-ui-system="tools"] .workspace #content :is(.toolbar,.preset-row) {gap:8px}
html[data-ui-system="tools"] .workspace #content details>summary {min-height:44px;align-content:center;cursor:pointer}
html[data-ui-system="tools"] .workspace #content details:not([open])>summary {margin-bottom:0}
html[data-ui-system="tools"] .workspace #content table {font-size:14px}
html[data-ui-system="tools"] .workspace #content th {font-size:12px;letter-spacing:.025em;color:var(--ui-muted)}
html[data-ui-system="tools"] .workspace #content :is(th,td) {padding:12px}
html[data-ui-system="tools"] .workspace #content .metric {border-left:0;border-top:1px solid var(--ui-line);background:transparent!important;padding:14px 0}
html[data-ui-system="tools"] .workspace #content .metric strong {font-size:26px!important;line-height:1.2;margin-top:6px}
html[data-ui-system="tools"] .workspace #content .metric > span {font-size:13px!important}
html[data-ui-system="tools"] .workspace #content .metric strong > span {font-size:inherit!important;line-height:inherit}
html[data-ui-system="tools"] .workspace #content .metric.accent {border-color:var(--ui-action)}
/* Roulette categories remain the same in both themes. Selection uses a separate outline. */
html[data-ui-system="tools"] :is(.number-chip,.cloth-number,.numpad button,.wheel-num).red {
  background:var(--ui-red)!important;color:var(--ui-number-ink)!important;border-color:#b76473!important;
}
html[data-ui-system="tools"] :is(.number-chip,.cloth-number,.numpad button,.wheel-num).black {
  background:var(--ui-black)!important;color:var(--ui-number-ink)!important;border-color:#666b60!important;
}
html[data-ui-system="tools"] :is(.number-chip,.cloth-number,.numpad button,.wheel-num).zero {
  background:var(--ui-zero)!important;color:var(--ui-number-ink)!important;border-color:#548a74!important;
}
html[data-ui-system="tools"] :is(.number-chip,.cloth-number,.numpad button,.wheel-num).selected {
  outline:2px solid var(--ui-action)!important;outline-offset:2px!important;
}
html[data-ui-system="tools"] :is(.number-chip,.cloth-number,.numpad button,.wheel-num).selected:focus-visible {
  outline:3px solid var(--ui-focus)!important;outline-offset:4px!important;
}
html[data-ui-system="tools"] .workspace #content .ui-kicker {display:block;color:var(--ui-muted);font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px}
html[data-ui-system="tools"] .workspace #content .ui-section-copy {max-width:68ch;margin-bottom:16px;color:var(--ui-muted);font-size:14px}
html[data-ui-system="tools"] .workspace #content .ui-empty-inline {padding:24px 0;max-width:48ch;color:var(--ui-muted)}
html[data-ui-system="tools"] .workspace #content .study-note[data-analysis-order] {margin:0 0 12px;padding:0;background:none;border:0;color:var(--ui-muted);font-size:12px}
@media(max-width:600px){
  html[data-ui-system="tools"] .workspace #content h2 {font-size:20px!important}
  html[data-ui-system="tools"] .workspace #content .panel {padding:16px}
  html[data-ui-system="tools"] .workspace #content :is(input:not([type=checkbox]),select,textarea) {max-width:100%}
  html[data-ui-system="tools"] .workspace #content :is(th,td) {padding:10px}
}
@media(prefers-reduced-motion:reduce){html[data-ui-system="tools"] * {scroll-behavior:auto!important}}