*, *::before, *::after { box-sizing: border-box; }
html { font-size: 100%; }
body {
  margin: 0;
  background: var(--color-neutral-bg);
  color: var(--color-ink);
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}
:focus-visible { outline: var(--focus-outline); outline-offset: var(--focus-offset); }
a { color: var(--color-ink); text-underline-offset: var(--underline-offset); }
code, .mono { font-family: var(--font-code); font-size: var(--fs-code); }
.sim-header {
  background: var(--color-surface);
  border-bottom: var(--border-hairline) solid var(--color-line);
}
.sim-header-inner, .sim-banner-inner, main {
  max-width: 880px;
  margin: 0 auto;
  padding: 0 var(--space-md);
}
.sim-header-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  min-height: 64px;
}
.sim-brand { display: flex; align-items: center; gap: var(--space-sm); }
.sim-brand-mark {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: var(--border-emphasis) solid var(--color-ink);
  border-radius: var(--radius-sm);
  font-weight: 700;
}
.sim-brand-name { font-weight: 700; font-size: var(--fs-body-lg); }
.sim-brand-sub { color: var(--color-muted); font-size: var(--fs-caption); }
.sim-lang { display: flex; gap: var(--space-xs); font-size: var(--fs-caption); }
.sim-banner {
  background: var(--color-warning-bg);
  border-bottom: var(--border-hairline) solid var(--color-line);
}
.sim-banner-inner {
  display: flex;
  gap: var(--space-xs);
  align-items: center;
  padding-top: var(--space-xs);
  padding-bottom: var(--space-xs);
  font-weight: 600;
}
main { padding-top: var(--space-lg); padding-bottom: var(--space-2xl); }
h1 { font-size: var(--fs-h2); line-height: var(--lh-h2); margin: 0 0 var(--space-sm); }
h2 { font-size: var(--fs-h3); line-height: var(--lh-h3); margin: var(--space-lg) 0 var(--space-sm); }
p { margin: 0 0 var(--space-sm); max-width: var(--measure-body); }
.muted { color: var(--color-muted); }
.caption { font-size: var(--fs-caption); line-height: var(--lh-caption); color: var(--color-muted); }
.panel {
  background: var(--color-surface);
  border: var(--border-hairline) solid var(--color-line);
  border-radius: var(--radius-lg);
  padding: var(--space-lg);
  margin-bottom: var(--space-md);
}
.kv { display: grid; grid-template-columns: minmax(120px, 200px) 1fr; gap: var(--space-xs) var(--space-md); margin: 0; }
.kv dt { color: var(--color-muted); }
.kv dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.amount { font-size: var(--fs-h2); font-weight: 700; font-variant-numeric: tabular-nums; }
fieldset { border: 0; margin: 0 0 var(--space-md); padding: 0; }
legend { font-weight: 600; font-size: var(--fs-label); margin-bottom: var(--space-xs); }
.choice {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  min-height: var(--control-lg);
  padding: var(--space-xs) var(--space-sm);
  border: var(--border-control) solid var(--color-line-strong);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-xs);
  background: var(--color-surface);
  cursor: pointer;
}
.choice input { width: 20px; height: 20px; margin: 0; }
.field { display: grid; gap: var(--space-2xs); margin-bottom: var(--space-sm); min-width: 0; }
.field label { font-weight: 600; font-size: var(--fs-label); }
.field input, .field select {
  width: 100%;
  min-width: 0;
  min-height: var(--control-lg);
  padding: 0 var(--space-sm);
  font: inherit;
  color: var(--color-ink);
  background: var(--color-surface);
  border: var(--border-control) solid var(--color-line-strong);
  border-radius: var(--radius-md);
}
.row { display: grid; gap: var(--space-sm); grid-template-columns: repeat(auto-fit, minmax(min(140px, 100%), 1fr)); }
.actions { display: flex; flex-wrap: wrap; gap: var(--space-xs); margin-top: var(--space-sm); }
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--control-md);
  padding: 0 var(--btn-pad-inline);
  font: inherit;
  font-weight: 600;
  border-radius: var(--radius-md);
  border: var(--border-control) solid var(--color-ink);
  background: var(--color-surface);
  color: var(--color-ink);
  cursor: pointer;
  text-decoration: none;
}
.btn-primary { background: var(--color-ink); color: var(--color-surface); }
.btn-negative { border-color: var(--color-negative); color: var(--color-negative); }
.btn-small { min-height: var(--control-sm); padding: 0 var(--space-sm); font-size: var(--fs-caption); }
.alert {
  border: var(--border-hairline) solid var(--color-line-strong);
  border-radius: var(--radius-md);
  padding: var(--space-sm) var(--space-md);
  margin-bottom: var(--space-md);
}
.alert-warning { background: var(--color-warning-bg); }
.alert-positive { background: var(--color-positive-bg); }
.alert-negative { background: var(--color-negative-bg); }
.alert-info { background: var(--color-info-bg); }
.alert strong { display: block; margin-bottom: var(--space-2xs); }
.status { display: inline-flex; align-items: center; gap: var(--space-2xs); font-weight: 600; }
.status-positive { color: var(--color-positive); }
.status-negative { color: var(--color-negative); }
.status-warning { color: var(--color-warning); }
.status-neutral { color: var(--color-neutral); }
.table-wrap { overflow-x: auto; border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-md); }
table { border-collapse: collapse; width: 100%; background: var(--color-surface); }
th, td {
  text-align: left;
  vertical-align: top;
  padding: var(--space-xs) var(--space-sm);
  border-bottom: var(--border-hairline) solid var(--color-line);
  font-size: var(--fs-caption);
  line-height: var(--lh-caption);
}
th { font-weight: 600; color: var(--color-ink-2); background: var(--color-neutral-bg); }
td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.faults { display: grid; gap: var(--space-2xs); }
.faults label { display: flex; gap: var(--space-2xs); align-items: center; white-space: nowrap; }
.inline-form { display: inline; }
.console-grid { display: grid; gap: var(--space-md); grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.console main, .console .sim-header-inner, .console .sim-banner-inner { max-width: 1320px; }
footer { color: var(--color-muted); font-size: var(--fs-caption); margin-top: var(--space-xl); }
@media (max-width: 560px) {
  .kv { grid-template-columns: 1fr; }
  .panel { padding: var(--space-md); }
}