:root {
  --fw-wire-paper: #ffffff;
  --fw-wire-fill-subtle: #f5f5f5;
  --fw-wire-fill: #e5e5e5;
  --fw-wire-line-subtle: #cccccc;
  --fw-wire-line: #8c8c8c;
  --fw-wire-ink-muted: #595959;
  --fw-wire-ink: #1f1f1f;
  --fw-wire-line-width: 1.5px;
  --fw-wire-radius: 4px;
  --fw-wire-font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
}

.fw-wire-size-xs { --fw-wire-font-size: 0.75rem; --fw-wire-control-size: 1.5rem; }
.fw-wire-size-sm { --fw-wire-font-size: 0.875rem; --fw-wire-control-size: 1.75rem; }
.fw-wire-size-md { --fw-wire-font-size: 1rem; --fw-wire-control-size: 2rem; }
.fw-wire-size-lg { --fw-wire-font-size: 1.125rem; --fw-wire-control-size: 2.5rem; }
.fw-wire-size-xl { --fw-wire-font-size: 1.25rem; --fw-wire-control-size: 3rem; }

.fw-wire-icon-glyph { display: inline-block; width: 1em; height: 1em; font-size: var(--fw-wire-font-size, 1rem); vertical-align: -0.125em; flex-shrink: 0; }

.fw-wire-annotation {
  display: inline-block;
  max-width: 100%;
  box-sizing: border-box;
  padding: 0.5em 0.75em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.4;
}
.fw-wire-annotation-title {
  font-weight: 600;
}
.fw-wire-annotation-description {
  margin-top: 0.25em;
  color: var(--fw-wire-ink-muted);
}
.fw-wire-annotation.fw-wire-primary {
  background: var(--fw-wire-ink);
  border-color: var(--fw-wire-ink);
  color: var(--fw-wire-paper);
}
.fw-wire-annotation.fw-wire-primary .fw-wire-annotation-description {
  color: var(--fw-wire-fill);
}

.fw-wire-grid {
  display: grid;
  box-sizing: border-box;
  max-width: 100%;
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
}
.fw-wire-grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.fw-wire-grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fw-wire-grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fw-wire-grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.fw-wire-grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.fw-wire-grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.fw-wire-grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.fw-wire-grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.fw-wire-grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
.fw-wire-grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.fw-wire-grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); }
.fw-wire-grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.fw-wire-grid.fw-wire-size-xs { gap: 0.25rem; }
.fw-wire-grid.fw-wire-size-sm { gap: 0.5rem; }
.fw-wire-grid.fw-wire-size-md { gap: 1rem; }
.fw-wire-grid.fw-wire-size-lg { gap: 1.5rem; }
.fw-wire-grid.fw-wire-size-xl { gap: 2rem; }
.fw-wire-grid-item {
  min-width: 0;
  box-sizing: border-box;
  padding: 0.5em;
  border: var(--fw-wire-line-width) dashed var(--fw-wire-line-subtle);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
}

.fw-wire-divider {
  display: flex;
  align-items: center;
  color: var(--fw-wire-ink-muted);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
}
.fw-wire-divider::before,
.fw-wire-divider::after {
  content: "";
  flex: 1;
}
.fw-wire-divider.fw-wire-horizontal {
  width: 100%;
  margin: 0.75em 0;
}
.fw-wire-divider.fw-wire-horizontal::before,
.fw-wire-divider.fw-wire-horizontal::after {
  border-top: var(--fw-wire-line-width) solid var(--fw-wire-line);
}
.fw-wire-divider.fw-wire-vertical {
  display: inline-flex;
  flex-direction: column;
  min-height: var(--fw-wire-control-size, 2rem);
  align-self: stretch;
  margin: 0 0.75em;
}
.fw-wire-divider.fw-wire-vertical::before,
.fw-wire-divider.fw-wire-vertical::after {
  border-left: var(--fw-wire-line-width) solid var(--fw-wire-line);
  min-height: 0.75em;
}
.fw-wire-divider-label {
  padding: 0 0.75em;
  white-space: nowrap;
}
.fw-wire-divider.fw-wire-vertical .fw-wire-divider-label {
  padding: 0.5em 0;
}

.fw-wire-stack {
  display: flex;
  box-sizing: border-box;
  max-width: 100%;
  gap: 1rem;
}
.fw-wire-stack.fw-wire-horizontal {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}
.fw-wire-stack.fw-wire-vertical {
  flex-direction: column;
  align-items: stretch;
}
.fw-wire-stack.fw-wire-stack-gap-xs {
  gap: 0.25rem;
}
.fw-wire-stack.fw-wire-stack-gap-sm {
  gap: 0.5rem;
}
.fw-wire-stack.fw-wire-stack-gap-md {
  gap: 1rem;
}
.fw-wire-stack.fw-wire-stack-gap-lg {
  gap: 1.5rem;
}
.fw-wire-stack.fw-wire-stack-gap-xl {
  gap: 2rem;
}

.fw-wire-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25em;
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.4;
}
.fw-wire-link-label {
  text-decoration: underline;
  text-decoration-color: var(--fw-wire-line);
  text-underline-offset: 0.15em;
}
.fw-wire-link.fw-wire-bold {
  font-weight: 600;
}

.fw-wire-rich-text {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  max-width: 100%;
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.4;
}
.fw-wire-rich-text-label {
  min-width: 0;
}
.fw-wire-rich-text.fw-wire-bold {
  font-weight: 600;
}
.fw-wire-rich-text.fw-wire-vertical {
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25em;
}

.fw-wire-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  box-sizing: border-box;
  min-height: var(--fw-wire-control-size, 2rem);
  padding: 0 0.75em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  user-select: none;
}
.fw-wire-button-label {
  white-space: nowrap;
  font-weight: 600;
}
.fw-wire-button.fw-wire-primary {
  background: var(--fw-wire-ink);
  border-color: var(--fw-wire-ink);
  color: var(--fw-wire-paper);
}
.fw-wire-button[data-disabled] {
  opacity: 0.5;
  border-style: dashed;
}

.fw-wire-select {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  box-sizing: border-box;
  width: 100%;
  max-width: 24em;
  min-height: var(--fw-wire-control-size, 2rem);
  padding: 0 0.75em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  user-select: none;
}
.fw-wire-select-text {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fw-wire-select-indicator {
  display: inline-flex;
  margin-left: auto;
}
.fw-wire-select .fw-wire-icon-glyph {
  color: var(--fw-wire-ink-muted);
}
.fw-wire-select[data-active] {
  border-color: var(--fw-wire-ink);
  box-shadow: 0 0 0 1px var(--fw-wire-ink);
}
.fw-wire-select[data-disabled] {
  opacity: 0.5;
  border-style: dashed;
  background: var(--fw-wire-fill-subtle);
}

.fw-wire-radio {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  box-sizing: border-box;
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  user-select: none;
}
.fw-wire-radio-control {
  position: relative;
  box-sizing: border-box;
  width: 1.25em;
  height: 1.25em;
  flex-shrink: 0;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: 50%;
  background: var(--fw-wire-paper);
}
.fw-wire-radio-label {
  white-space: nowrap;
}
.fw-wire-radio[data-active] .fw-wire-radio-control {
  border-color: var(--fw-wire-ink);
}
.fw-wire-radio[data-active] .fw-wire-radio-control::after {
  content: "";
  position: absolute;
  inset: 0.25em;
  border-radius: 50%;
  background: var(--fw-wire-ink);
}
.fw-wire-radio[data-disabled] {
  opacity: 0.5;
}
.fw-wire-radio[data-disabled] .fw-wire-radio-control {
  border-style: dashed;
  background: var(--fw-wire-fill-subtle);
}

.fw-wire-switch {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  min-height: var(--fw-wire-control-size, 2rem);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  user-select: none;
}
.fw-wire-switch-track {
  position: relative;
  box-sizing: border-box;
  flex: 0 0 auto;
  width: var(--fw-wire-control-size, 2rem);
  height: calc(var(--fw-wire-control-size, 2rem) * 0.55);
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: 999px;
  background: var(--fw-wire-fill-subtle);
}
.fw-wire-switch-thumb {
  position: absolute;
  top: 50%;
  left: 0.125em;
  transform: translateY(-50%);
  height: calc(100% - 0.25em);
  aspect-ratio: 1 / 1;
  box-sizing: border-box;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: 50%;
  background: var(--fw-wire-paper);
}
.fw-wire-switch-label {
  white-space: nowrap;
}
.fw-wire-switch[data-active] .fw-wire-switch-track {
  background: var(--fw-wire-ink);
  border-color: var(--fw-wire-ink);
}
.fw-wire-switch[data-active] .fw-wire-switch-thumb {
  left: auto;
  right: 0.125em;
  border-color: var(--fw-wire-paper);
}
.fw-wire-switch[data-disabled] {
  opacity: 0.5;
}
.fw-wire-switch[data-disabled] .fw-wire-switch-track {
  border-style: dashed;
}

.fw-wire-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  color: var(--fw-wire-ink);
  user-select: none;
}
.fw-wire-checkbox-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 1.25em;
  height: 1.25em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
  flex-shrink: 0;
}
.fw-wire-checkbox-label {
  white-space: nowrap;
}
.fw-wire-checkbox[data-active] .fw-wire-checkbox-box {
  background: var(--fw-wire-ink);
  border-color: var(--fw-wire-ink);
  color: var(--fw-wire-paper);
}
.fw-wire-checkbox[data-disabled] {
  opacity: 0.5;
}

.fw-wire-paragraph {
  display: block;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0;
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.6;
  white-space: pre-line;
  overflow-wrap: anywhere;
}
.fw-wire-paragraph.fw-wire-bold {
  font-weight: 600;
}

.fw-wire-textarea {
  display: block;
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  padding: 0.5em 0.75em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.5;
}
.fw-wire-textarea-line {
  min-height: 1.5em;
}
.fw-wire-textarea-text {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.fw-wire-textarea::after {
  content: "";
  position: absolute;
  right: 0.2em;
  bottom: 0.2em;
  width: 0.6em;
  height: 0.6em;
  border-right: var(--fw-wire-line-width) solid var(--fw-wire-line-subtle);
  border-bottom: var(--fw-wire-line-width) solid var(--fw-wire-line-subtle);
}
.fw-wire-textarea[data-active] {
  border-color: var(--fw-wire-ink);
  box-shadow: 0 0 0 2px var(--fw-wire-fill);
}
.fw-wire-textarea[data-disabled] {
  background: var(--fw-wire-fill-subtle);
  color: var(--fw-wire-ink-muted);
  border-style: dashed;
}

.fw-wire-slider {
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  max-width: 24em;
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  color: var(--fw-wire-ink);
  user-select: none;
  padding-inline: calc(var(--fw-wire-control-size, 2rem) * 0.25);
  padding-block: calc(var(--fw-wire-control-size, 2rem) * 0.15);
}
.fw-wire-slider-track {
  position: relative;
  box-sizing: border-box;
  background: var(--fw-wire-fill);
  border-radius: 999px;
  height: calc(var(--fw-wire-control-size, 2rem) * 0.2);
}
.fw-wire-slider-fill {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: var(--fw-wire-slider-value);
  background: var(--fw-wire-ink);
  border-radius: inherit;
}
.fw-wire-slider-thumb {
  position: absolute;
  top: 50%;
  left: var(--fw-wire-slider-value);
  width: calc(var(--fw-wire-control-size, 2rem) * 0.5);
  height: calc(var(--fw-wire-control-size, 2rem) * 0.5);
  box-sizing: border-box;
  transform: translate(-50%, -50%);
  border: var(--fw-wire-line-width) solid var(--fw-wire-ink);
  border-radius: 50%;
  background: var(--fw-wire-paper);
}
.fw-wire-slider.fw-wire-vertical {
  width: auto;
  height: calc(var(--fw-wire-control-size, 2rem) * 6);
  padding-inline: calc(var(--fw-wire-control-size, 2rem) * 0.15);
  padding-block: calc(var(--fw-wire-control-size, 2rem) * 0.25);
}
.fw-wire-slider.fw-wire-vertical .fw-wire-slider-track {
  height: 100%;
  width: calc(var(--fw-wire-control-size, 2rem) * 0.2);
}
.fw-wire-slider.fw-wire-vertical .fw-wire-slider-fill {
  top: auto;
  bottom: 0;
  left: 0;
  width: 100%;
  height: var(--fw-wire-slider-value);
}
.fw-wire-slider.fw-wire-vertical .fw-wire-slider-thumb {
  top: auto;
  left: 50%;
  bottom: var(--fw-wire-slider-value);
  transform: translate(-50%, 50%);
}
.fw-wire-slider[data-active] .fw-wire-slider-thumb {
  box-shadow: 0 0 0 3px var(--fw-wire-line-subtle);
}
.fw-wire-slider[data-disabled] {
  opacity: 0.5;
}
.fw-wire-slider[data-disabled] .fw-wire-slider-thumb {
  border-style: dashed;
}
.fw-wire-slider-value-0 { --fw-wire-slider-value: 0%; }
.fw-wire-slider-value-5 { --fw-wire-slider-value: 5%; }
.fw-wire-slider-value-10 { --fw-wire-slider-value: 10%; }
.fw-wire-slider-value-15 { --fw-wire-slider-value: 15%; }
.fw-wire-slider-value-20 { --fw-wire-slider-value: 20%; }
.fw-wire-slider-value-25 { --fw-wire-slider-value: 25%; }
.fw-wire-slider-value-30 { --fw-wire-slider-value: 30%; }
.fw-wire-slider-value-35 { --fw-wire-slider-value: 35%; }
.fw-wire-slider-value-40 { --fw-wire-slider-value: 40%; }
.fw-wire-slider-value-45 { --fw-wire-slider-value: 45%; }
.fw-wire-slider-value-50 { --fw-wire-slider-value: 50%; }
.fw-wire-slider-value-55 { --fw-wire-slider-value: 55%; }
.fw-wire-slider-value-60 { --fw-wire-slider-value: 60%; }
.fw-wire-slider-value-65 { --fw-wire-slider-value: 65%; }
.fw-wire-slider-value-70 { --fw-wire-slider-value: 70%; }
.fw-wire-slider-value-75 { --fw-wire-slider-value: 75%; }
.fw-wire-slider-value-80 { --fw-wire-slider-value: 80%; }
.fw-wire-slider-value-85 { --fw-wire-slider-value: 85%; }
.fw-wire-slider-value-90 { --fw-wire-slider-value: 90%; }
.fw-wire-slider-value-95 { --fw-wire-slider-value: 95%; }
.fw-wire-slider-value-100 { --fw-wire-slider-value: 100%; }

.fw-wire-frame {
  display: block;
  box-sizing: border-box;
  min-width: 0;
  border: var(--fw-wire-line-width) solid transparent;
  border-radius: var(--fw-wire-radius);
}
.fw-wire-frame.fw-wire-frame-bordered {
  border-color: var(--fw-wire-line);
}

.fw-wire-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.25em;
  max-width: 100%;
  box-sizing: border-box;
  padding: 0.125em 0.625em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: 999px;
  background: var(--fw-wire-fill-subtle);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.4;
}
.fw-wire-tag-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fw-wire-tag-remove {
  display: inline-flex;
  align-items: center;
  color: var(--fw-wire-ink-muted);
}
.fw-wire-tag.fw-wire-primary {
  background: var(--fw-wire-ink);
  border-color: var(--fw-wire-ink);
  color: var(--fw-wire-paper);
}
.fw-wire-tag.fw-wire-primary .fw-wire-tag-remove {
  color: var(--fw-wire-fill);
}

.fw-wire-input {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  box-sizing: border-box;
  width: 100%;
  max-width: 24em;
  min-height: var(--fw-wire-control-size, 2rem);
  padding: 0 0.75em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink-muted);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  user-select: none;
}
.fw-wire-input-text {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fw-wire-input .fw-wire-icon-glyph {
  color: var(--fw-wire-ink-muted);
}
.fw-wire-input[data-active] {
  border-color: var(--fw-wire-ink);
  box-shadow: 0 0 0 1px var(--fw-wire-ink);
  color: var(--fw-wire-ink);
}
.fw-wire-input[data-disabled] {
  opacity: 0.5;
  border-style: dashed;
  background: var(--fw-wire-fill-subtle);
}

.fw-wire-question {
  display: flex;
  flex-direction: column;
  gap: 0.375em;
  max-width: 100%;
  box-sizing: border-box;
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.4;
}
.fw-wire-question-label {
  font-weight: 600;
}
.fw-wire-question-description {
  color: var(--fw-wire-ink-muted);
}
.fw-wire-question-control {
  display: block;
  max-width: 100%;
}
.fw-wire-question-hint {
  font-size: 0.875em;
  color: var(--fw-wire-ink-muted);
}

.fw-wire-ratings {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--fw-wire-control-size, 2rem) * 0.1);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  color: var(--fw-wire-line);
}
.fw-wire-ratings-star {
  display: inline-flex;
  line-height: 0;
}
.fw-wire-ratings-star[data-active] {
  color: var(--fw-wire-ink);
}
.fw-wire-ratings-star[data-active] .fw-wire-icon-glyph {
  fill: currentColor;
}

.fw-wire-calendar {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 20em;
  padding: 0.75em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
}
.fw-wire-calendar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5em;
  margin-bottom: 0.5em;
}
.fw-wire-calendar-nav {
  display: inline-flex;
  flex-shrink: 0;
  color: var(--fw-wire-ink-muted);
}
.fw-wire-calendar-label {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: center;
  font-weight: 600;
}
.fw-wire-calendar-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.25em;
  margin-bottom: 0.25em;
}
.fw-wire-calendar-weekday {
  height: 0.4em;
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-fill-subtle);
}
.fw-wire-calendar-grid {
  display: flex;
  flex-direction: column;
  gap: 0.25em;
}
.fw-wire-calendar-week {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.25em;
}
.fw-wire-calendar-day {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  aspect-ratio: 1 / 1;
  border-radius: var(--fw-wire-radius);
  color: var(--fw-wire-ink);
}
.fw-wire-calendar-day-empty {
  visibility: hidden;
}
.fw-wire-calendar-day[data-active] {
  background: var(--fw-wire-fill);
  border: var(--fw-wire-line-width) solid var(--fw-wire-ink);
  font-weight: 600;
}

.fw-wire-file-drop {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  text-align: center;
  box-sizing: border-box;
  max-width: 100%;
  padding: calc(var(--fw-wire-control-size, 2rem) * 0.75) 1.5em;
  min-height: calc(var(--fw-wire-control-size, 2rem) * 4);
  border: var(--fw-wire-line-width) dashed var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-fill-subtle);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.4;
  user-select: none;
}
.fw-wire-file-drop-icon {
  display: flex;
  color: var(--fw-wire-ink-muted);
}
.fw-wire-file-drop-icon .fw-wire-icon-glyph {
  width: 2em;
  height: 2em;
}
.fw-wire-file-drop-label {
  font-weight: 600;
}
.fw-wire-file-drop-hint {
  font-size: 0.875em;
  color: var(--fw-wire-ink-muted);
}

.fw-wire-text {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: bottom;
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.4;
}
.fw-wire-text.fw-wire-bold {
  font-weight: 600;
}

.fw-wire-tabs {
  display: flex;
  box-sizing: border-box;
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  color: var(--fw-wire-ink);
}
.fw-wire-tabs.fw-wire-horizontal {
  flex-direction: row;
  border-bottom: var(--fw-wire-line-width) solid var(--fw-wire-line);
}
.fw-wire-tabs.fw-wire-vertical {
  display: inline-flex;
  flex-direction: column;
  border-right: var(--fw-wire-line-width) solid var(--fw-wire-line);
}
.fw-wire-tabs-item {
  box-sizing: border-box;
  padding: 0.5em 1em;
  white-space: nowrap;
  color: var(--fw-wire-ink-muted);
  border-bottom: calc(var(--fw-wire-line-width) * 2) solid transparent;
}
.fw-wire-tabs.fw-wire-vertical .fw-wire-tabs-item {
  border-bottom: none;
  border-right: calc(var(--fw-wire-line-width) * 2) solid transparent;
}
.fw-wire-tabs-item[data-active] {
  color: var(--fw-wire-ink);
  background: var(--fw-wire-fill-subtle);
  border-bottom-color: var(--fw-wire-ink);
}
.fw-wire-tabs.fw-wire-vertical .fw-wire-tabs-item[data-active] {
  border-bottom-color: transparent;
  border-right-color: var(--fw-wire-ink);
}

.fw-wire-stepper {
  display: flex;
  align-items: flex-start;
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  color: var(--fw-wire-ink);
}
.fw-wire-stepper-step {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.375em;
  flex: 1;
  min-width: 0;
  padding-inline-start: 0.5em;
  padding-inline-end: 0.5em;
}
.fw-wire-stepper-step:not(:first-child)::before {
  content: "";
  position: absolute;
  top: calc(var(--fw-wire-control-size, 2rem) / 2);
  right: calc(50% + var(--fw-wire-control-size, 2rem) / 2);
  width: calc(100% - var(--fw-wire-control-size, 2rem));
  height: var(--fw-wire-line-width);
  background: var(--fw-wire-line-subtle);
}
.fw-wire-stepper-step[data-complete]:not(:first-child)::before,
.fw-wire-stepper-step[data-active]:not(:first-child)::before {
  background: var(--fw-wire-line);
}
.fw-wire-stepper-indicator {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--fw-wire-control-size, 2rem);
  height: var(--fw-wire-control-size, 2rem);
  border-radius: 999px;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
  font-weight: 600;
  flex-shrink: 0;
}
.fw-wire-stepper-step[data-complete] .fw-wire-stepper-indicator {
  background: var(--fw-wire-fill);
  border-color: var(--fw-wire-line);
}
.fw-wire-stepper-step[data-active] .fw-wire-stepper-indicator {
  background: var(--fw-wire-ink);
  border-color: var(--fw-wire-ink);
  color: var(--fw-wire-paper);
}
.fw-wire-stepper-label {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: center;
  color: var(--fw-wire-ink-muted);
}
.fw-wire-stepper-step[data-active] .fw-wire-stepper-label {
  color: var(--fw-wire-ink);
  font-weight: 600;
}

.fw-wire-nav-item {
  display: flex;
  align-items: center;
  gap: 0.5em;
  width: 100%;
  box-sizing: border-box;
  padding: 0.5em 0.75em;
  border-radius: var(--fw-wire-radius);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.4;
}
.fw-wire-nav-item-label {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fw-wire-nav-item-counter {
  flex: 0 0 auto;
  padding: 0.125em 0.5em;
  border-radius: 999px;
  background: var(--fw-wire-fill-subtle);
  color: var(--fw-wire-ink-muted);
  font-size: 0.875em;
  line-height: 1.4;
}
.fw-wire-nav-item[data-active] {
  background: var(--fw-wire-ink);
  color: var(--fw-wire-paper);
}
.fw-wire-nav-item[data-active] .fw-wire-nav-item-counter {
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
}
.fw-wire-nav-item.fw-wire-vertical {
  flex-direction: column;
  align-items: center;
  gap: 0.25em;
}

.fw-wire-accordion {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: 100%;
  max-width: 32em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  color: var(--fw-wire-ink);
}
.fw-wire-accordion-item {
  box-sizing: border-box;
  border-bottom: var(--fw-wire-line-width) solid var(--fw-wire-line);
}
.fw-wire-accordion-item:last-child {
  border-bottom: none;
}
.fw-wire-accordion-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5em;
  box-sizing: border-box;
  min-height: var(--fw-wire-control-size, 2rem);
  padding: 0.5em 0.75em;
}
.fw-wire-accordion-title {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fw-wire-accordion-indicator {
  display: inline-flex;
  flex: 0 0 auto;
  color: var(--fw-wire-ink-muted);
}
.fw-wire-accordion-body {
  box-sizing: border-box;
  padding: 0 0.75em 0.75em;
  color: var(--fw-wire-ink-muted);
}
.fw-wire-accordion-item[data-active] {
  background: var(--fw-wire-fill-subtle);
}
.fw-wire-accordion-item[data-active] .fw-wire-accordion-title {
  color: var(--fw-wire-ink);
  font-weight: 600;
}
.fw-wire-accordion-item[data-active] .fw-wire-accordion-indicator {
  color: var(--fw-wire-ink);
}

.fw-wire-pagination {
  display: inline-flex;
  align-items: center;
  gap: 0.25em;
  box-sizing: border-box;
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  color: var(--fw-wire-ink);
}
.fw-wire-pagination-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: 2em;
  height: 2em;
  padding: 0 0.5em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line-subtle);
  border-radius: var(--fw-wire-radius);
  color: var(--fw-wire-ink-muted);
  white-space: nowrap;
}
.fw-wire-pagination-item[data-active] {
  color: var(--fw-wire-ink);
  background: var(--fw-wire-fill-subtle);
  border-color: var(--fw-wire-ink);
  font-weight: 600;
}
.fw-wire-pagination-control {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2em;
  height: 2em;
  color: var(--fw-wire-ink-muted);
}
.fw-wire-pagination-gap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2em;
  height: 2em;
  color: var(--fw-wire-ink-muted);
}

.fw-wire-cursor {
  display: inline-flex;
  align-items: flex-start;
  gap: 0.25em;
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.4;
}
.fw-wire-cursor .fw-wire-icon-glyph {
  fill: var(--fw-wire-paper);
}
.fw-wire-cursor-label {
  margin-top: 0.75em;
  padding: 0.125em 0.5em;
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-ink);
  color: var(--fw-wire-paper);
  font-size: 0.75em;
  line-height: 1.4;
  white-space: nowrap;
}

.fw-wire-menu {
  display: inline-flex;
  flex-direction: column;
  box-sizing: border-box;
  min-width: 12em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
}
.fw-wire-menu-search {
  display: flex;
  align-items: center;
  gap: 0.5em;
  box-sizing: border-box;
  padding: 0.5em 0.75em;
  border-bottom: var(--fw-wire-line-width) solid var(--fw-wire-line);
}
.fw-wire-menu-search-text {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--fw-wire-ink-muted);
}
.fw-wire-menu .fw-wire-icon-glyph {
  color: var(--fw-wire-ink-muted);
}
.fw-wire-menu-item {
  box-sizing: border-box;
  padding: 0.5em 0.75em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fw-wire-menu-item[data-active] {
  background: var(--fw-wire-fill-subtle);
  color: var(--fw-wire-ink);
}
.fw-wire-menu-item[data-disabled] {
  color: var(--fw-wire-ink-muted);
  opacity: 0.6;
}

.fw-wire-breadcrumbs {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  align-items: center;
  box-sizing: border-box;
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  color: var(--fw-wire-ink-muted);
}
.fw-wire-breadcrumbs-item {
  box-sizing: border-box;
  white-space: nowrap;
  color: var(--fw-wire-ink-muted);
}
.fw-wire-breadcrumbs-item + .fw-wire-breadcrumbs-item {
  margin-left: 0.4em;
}
.fw-wire-breadcrumbs-item + .fw-wire-breadcrumbs-item::before {
  content: "/";
  display: inline-block;
  margin-right: 0.4em;
  color: var(--fw-wire-line);
}
.fw-wire-breadcrumbs-item[data-active] {
  color: var(--fw-wire-ink);
  font-weight: 600;
}
.fw-wire-breadcrumbs-item[data-active]::before {
  font-weight: normal;
}

.fw-wire-tooltip {
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  max-width: 100%;
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.4;
}
.fw-wire-tooltip-content {
  padding: 0.375em 0.625em;
  max-width: 16em;
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-ink-muted);
  color: var(--fw-wire-paper);
  overflow-wrap: anywhere;
}
.fw-wire-tooltip-arrow {
  flex: 0 0 auto;
  width: 0;
  height: 0;
  border: 0.375em solid transparent;
}
.fw-wire-tooltip.fw-wire-tooltip-side-top {
  flex-direction: column;
}
.fw-wire-tooltip.fw-wire-tooltip-side-top .fw-wire-tooltip-arrow {
  border-top-color: var(--fw-wire-ink-muted);
  border-bottom-width: 0;
}
.fw-wire-tooltip.fw-wire-tooltip-side-bottom {
  flex-direction: column-reverse;
}
.fw-wire-tooltip.fw-wire-tooltip-side-bottom .fw-wire-tooltip-arrow {
  border-bottom-color: var(--fw-wire-ink-muted);
  border-top-width: 0;
}
.fw-wire-tooltip.fw-wire-tooltip-side-left {
  flex-direction: row;
}
.fw-wire-tooltip.fw-wire-tooltip-side-left .fw-wire-tooltip-arrow {
  border-left-color: var(--fw-wire-ink-muted);
  border-right-width: 0;
}
.fw-wire-tooltip.fw-wire-tooltip-side-right {
  flex-direction: row-reverse;
}
.fw-wire-tooltip.fw-wire-tooltip-side-right .fw-wire-tooltip-arrow {
  border-right-color: var(--fw-wire-ink-muted);
  border-left-width: 0;
}

.fw-wire-toast {
  display: flex;
  align-items: center;
  gap: 0.5em;
  box-sizing: border-box;
  max-width: 100%;
  padding: calc(var(--fw-wire-control-size, 2rem) * 0.4) 1em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.4;
  box-shadow: 0 0.25em 0 var(--fw-wire-line-subtle);
  user-select: none;
}
.fw-wire-toast-icon {
  display: flex;
  flex-shrink: 0;
  color: var(--fw-wire-ink-muted);
}
.fw-wire-toast-icon .fw-wire-icon-glyph {
  width: 1.25em;
  height: 1.25em;
}
.fw-wire-toast-message {
  flex: 1;
  min-width: 0;
}
.fw-wire-toast-dismiss {
  display: inline-flex;
  flex-shrink: 0;
  margin-inline-start: auto;
  color: var(--fw-wire-ink-muted);
}

.fw-wire-alert {
  display: flex;
  align-items: flex-start;
  gap: 0.625em;
  box-sizing: border-box;
  max-width: 100%;
  padding: 0.75em 1em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.4;
}
.fw-wire-alert-icon {
  display: flex;
  flex-shrink: 0;
  color: var(--fw-wire-ink-muted);
}
.fw-wire-alert-icon .fw-wire-icon-glyph {
  width: 1.25em;
  height: 1.25em;
}
.fw-wire-alert-body {
  display: flex;
  flex-direction: column;
  gap: 0.25em;
  min-width: 0;
}
.fw-wire-alert-title {
  font-weight: 600;
}
.fw-wire-alert-description {
  color: var(--fw-wire-ink-muted);
}
.fw-wire-alert-warning {
  background: var(--fw-wire-fill-subtle);
  border-inline-start-width: calc(var(--fw-wire-line-width) * 3);
}
.fw-wire-alert-error {
  background: var(--fw-wire-ink);
  border-color: var(--fw-wire-ink);
  color: var(--fw-wire-paper);
}
.fw-wire-alert-error .fw-wire-alert-icon {
  color: var(--fw-wire-paper);
}
.fw-wire-alert-error .fw-wire-alert-description {
  color: var(--fw-wire-fill);
}

.fw-wire-progress {
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  max-width: 24em;
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  color: var(--fw-wire-ink);
}
.fw-wire-progress-track {
  position: relative;
  box-sizing: border-box;
  background: var(--fw-wire-fill);
  border-radius: 999px;
  height: calc(var(--fw-wire-control-size, 2rem) * 0.25);
}
.fw-wire-progress-fill {
  position: absolute;
  inset-block: 0;
  left: 0;
  width: var(--fw-wire-progress-value);
  background: var(--fw-wire-ink);
  border-radius: inherit;
}
.fw-wire-progress.fw-wire-progress-circle {
  width: auto;
}
.fw-wire-progress.fw-wire-progress-circle .fw-wire-progress-track {
  position: relative;
  box-sizing: border-box;
  width: calc(var(--fw-wire-control-size, 2rem) * 2);
  height: calc(var(--fw-wire-control-size, 2rem) * 2);
  border-radius: 50%;
  background: conic-gradient(
    var(--fw-wire-ink) var(--fw-wire-progress-value),
    var(--fw-wire-fill) 0
  );
}
.fw-wire-progress-hole {
  position: absolute;
  inset: calc(var(--fw-wire-control-size, 2rem) * 0.3);
  box-sizing: border-box;
  border-radius: 50%;
  background: var(--fw-wire-paper);
}
.fw-wire-progress-value-0 { --fw-wire-progress-value: 0%; }
.fw-wire-progress-value-5 { --fw-wire-progress-value: 5%; }
.fw-wire-progress-value-10 { --fw-wire-progress-value: 10%; }
.fw-wire-progress-value-15 { --fw-wire-progress-value: 15%; }
.fw-wire-progress-value-20 { --fw-wire-progress-value: 20%; }
.fw-wire-progress-value-25 { --fw-wire-progress-value: 25%; }
.fw-wire-progress-value-30 { --fw-wire-progress-value: 30%; }
.fw-wire-progress-value-35 { --fw-wire-progress-value: 35%; }
.fw-wire-progress-value-40 { --fw-wire-progress-value: 40%; }
.fw-wire-progress-value-45 { --fw-wire-progress-value: 45%; }
.fw-wire-progress-value-50 { --fw-wire-progress-value: 50%; }
.fw-wire-progress-value-55 { --fw-wire-progress-value: 55%; }
.fw-wire-progress-value-60 { --fw-wire-progress-value: 60%; }
.fw-wire-progress-value-65 { --fw-wire-progress-value: 65%; }
.fw-wire-progress-value-70 { --fw-wire-progress-value: 70%; }
.fw-wire-progress-value-75 { --fw-wire-progress-value: 75%; }
.fw-wire-progress-value-80 { --fw-wire-progress-value: 80%; }
.fw-wire-progress-value-85 { --fw-wire-progress-value: 85%; }
.fw-wire-progress-value-90 { --fw-wire-progress-value: 90%; }
.fw-wire-progress-value-95 { --fw-wire-progress-value: 95%; }
.fw-wire-progress-value-100 { --fw-wire-progress-value: 100%; }

.fw-wire-spinner {
  display: inline-block;
  box-sizing: border-box;
  width: var(--fw-wire-control-size);
  height: var(--fw-wire-control-size);
  border: var(--fw-wire-line-width) solid var(--fw-wire-line-subtle);
  border-top-color: var(--fw-wire-ink);
  border-radius: 50%;
  vertical-align: middle;
  flex-shrink: 0;
}

.fw-wire-modal {
  display: grid;
  place-items: center;
  min-height: 12rem;
  padding: 1.5rem;
  box-sizing: border-box;
  background: var(--fw-wire-fill-subtle);
}
.fw-wire-modal-panel {
  display: flex;
  flex-direction: column;
  gap: 0.75em;
  width: 100%;
  box-sizing: border-box;
  padding: 1.25em;
  background: var(--fw-wire-paper);
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  line-height: 1.4;
}
.fw-wire-modal-title {
  font-weight: 600;
}
.fw-wire-modal-body {
  color: var(--fw-wire-ink-muted);
}
.fw-wire-modal-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.5em;
  flex-wrap: wrap;
}
.fw-wire-modal.fw-wire-modal-max-width-xs .fw-wire-modal-panel {
  max-width: 20rem;
}
.fw-wire-modal.fw-wire-modal-max-width-sm .fw-wire-modal-panel {
  max-width: 26rem;
}
.fw-wire-modal.fw-wire-modal-max-width-md .fw-wire-modal-panel {
  max-width: 32rem;
}
.fw-wire-modal.fw-wire-modal-max-width-lg .fw-wire-modal-panel {
  max-width: 40rem;
}
.fw-wire-modal.fw-wire-modal-max-width-xl .fw-wire-modal-panel {
  max-width: 50rem;
}

.fw-wire-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-sizing: border-box;
  width: var(--fw-wire-control-size, 2rem);
  height: var(--fw-wire-control-size, 2rem);
  overflow: hidden;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-fill-subtle);
  color: var(--fw-wire-ink-muted);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1;
}
.fw-wire-avatar.fw-wire-avatar-circle {
  border-radius: 50%;
}
.fw-wire-avatar .fw-wire-icon-glyph {
  font-size: calc(var(--fw-wire-control-size, 2rem) * 0.6);
}

.fw-wire-counter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: 1.5em;
  height: 1.5em;
  padding: 0 0.4em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: 999px;
  background: var(--fw-wire-fill-subtle);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  font-variant-numeric: tabular-nums;
  line-height: 1;
  white-space: nowrap;
}
.fw-wire-counter.fw-wire-primary {
  background: var(--fw-wire-ink);
  border-color: var(--fw-wire-ink);
  color: var(--fw-wire-paper);
}

.fw-wire-emoji {
  display: inline-block;
  line-height: 1;
  white-space: nowrap;
  vertical-align: -0.125em;
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  color: var(--fw-wire-ink);
  filter: grayscale(1);
}
.fw-wire-emoji:empty {
  width: 1em;
  height: 1em;
  box-sizing: border-box;
  border: var(--fw-wire-line-width) dashed var(--fw-wire-line);
  border-radius: 50%;
}

.fw-wire-stat {
  display: inline-flex;
  flex-direction: column;
  gap: 0.25em;
  box-sizing: border-box;
  max-width: 100%;
  padding: 0.75em 1em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
}
.fw-wire-stat-label {
  color: var(--fw-wire-ink-muted);
}
.fw-wire-stat-value {
  font-size: 2em;
  font-weight: 600;
  line-height: 1.1;
}
.fw-wire-stat-delta {
  display: inline-flex;
  align-items: center;
  gap: 0.25em;
  font-size: 0.875em;
  color: var(--fw-wire-ink-muted);
}
.fw-wire-stat-delta-icon .fw-wire-icon-glyph {
  width: 1em;
  height: 1em;
}
.fw-wire-stat-up {
  font-weight: 600;
  color: var(--fw-wire-ink);
}

.fw-wire-card-basic {
  display: flex;
  align-items: center;
  gap: 0.75em;
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
  padding: 0.75em 1em;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1.4;
}
.fw-wire-card-basic-body {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  flex-direction: column;
}
.fw-wire-card-basic-primary {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fw-wire-card-basic-secondary {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--fw-wire-ink-muted);
  font-size: 0.875em;
}

.fw-wire-list {
  display: flex;
  flex-direction: column;
  gap: 0.5em;
  box-sizing: border-box;
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  color: var(--fw-wire-ink);
}
.fw-wire-list > .fw-wire-list-item {
  display: flex;
  align-items: baseline;
  gap: 0.5em;
}
.fw-wire-list > .fw-wire-list-item::before {
  content: "";
  flex-shrink: 0;
  align-self: flex-start;
  margin-top: 0.575em;
  width: 0.35em;
  height: 0.35em;
  border-radius: 50%;
  background: var(--fw-wire-ink-muted);
}
.fw-wire-list > .fw-wire-list-item .fw-wire-list {
  margin-left: 1.5em;
  margin-top: 0.25em;
}
.fw-wire-list.fw-wire-list-ordered {
  counter-reset: fw-wire-list;
}
.fw-wire-list.fw-wire-list-ordered > .fw-wire-list-item {
  counter-increment: fw-wire-list;
}
.fw-wire-list.fw-wire-list-ordered > .fw-wire-list-item::before {
  content: counter(fw-wire-list) ".";
  align-self: baseline;
  margin-top: 0;
  width: auto;
  height: auto;
  border-radius: 0;
  background: none;
  color: var(--fw-wire-ink-muted);
  font-variant-numeric: tabular-nums;
}

.fw-wire-image {
  --fw-wire-image-x-color: var(--fw-wire-line);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-sizing: border-box;
  width: calc(var(--fw-wire-control-size, 2rem) * 3);
  height: calc(var(--fw-wire-control-size, 2rem) * 3);
  overflow: hidden;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-fill-subtle);
}
.fw-wire-image.fw-wire-image-circle {
  border-radius: 50%;
}
.fw-wire-image.fw-wire-image-placeholder {
  background-image:
    linear-gradient(to top right, transparent calc(50% - var(--fw-wire-line-width) / 2), var(--fw-wire-image-x-color) calc(50% - var(--fw-wire-line-width) / 2), var(--fw-wire-image-x-color) calc(50% + var(--fw-wire-line-width) / 2), transparent calc(50% + var(--fw-wire-line-width) / 2)),
    linear-gradient(to bottom right, transparent calc(50% - var(--fw-wire-line-width) / 2), var(--fw-wire-image-x-color) calc(50% - var(--fw-wire-line-width) / 2), var(--fw-wire-image-x-color) calc(50% + var(--fw-wire-line-width) / 2), transparent calc(50% + var(--fw-wire-line-width) / 2));
}
.fw-wire-image.fw-wire-primary {
  --fw-wire-image-x-color: var(--fw-wire-paper);
  color: var(--fw-wire-image-x-color);
  background-color: var(--fw-wire-ink);
  border-color: var(--fw-wire-ink);
}

.fw-wire-chart {
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  max-width: 32em;
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  color: var(--fw-wire-ink);
}
.fw-wire-chart-plot {
  display: flex;
  align-items: flex-end;
  gap: calc(var(--fw-wire-control-size, 2rem) * 0.25);
  box-sizing: border-box;
  border-inline-start: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-block-end: var(--fw-wire-line-width) solid var(--fw-wire-line);
  padding: calc(var(--fw-wire-control-size, 2rem) * 0.25);
  height: calc(var(--fw-wire-control-size, 2rem) * 4);
}
.fw-wire-chart-bar {
  flex: 1 0 auto;
  box-sizing: border-box;
  min-width: calc(var(--fw-wire-control-size, 2rem) * 0.25);
  background: var(--fw-wire-ink-muted, var(--fw-wire-ink));
  border-radius: var(--fw-wire-radius) var(--fw-wire-radius) 0 0;
  height: var(--fw-wire-chart-value);
}
.fw-wire-chart.fw-wire-horizontal .fw-wire-chart-plot {
  flex-direction: column;
  align-items: stretch;
  height: auto;
}
.fw-wire-chart.fw-wire-horizontal .fw-wire-chart-bar {
  flex: 0 0 auto;
  min-width: 0;
  min-height: calc(var(--fw-wire-control-size, 2rem) * 0.25);
  width: var(--fw-wire-chart-value);
  height: calc(var(--fw-wire-control-size, 2rem) * 0.5);
  border-radius: 0 var(--fw-wire-radius) var(--fw-wire-radius) 0;
}
.fw-wire-chart-value-0 { --fw-wire-chart-value: 0%; }
.fw-wire-chart-value-5 { --fw-wire-chart-value: 5%; }
.fw-wire-chart-value-10 { --fw-wire-chart-value: 10%; }
.fw-wire-chart-value-15 { --fw-wire-chart-value: 15%; }
.fw-wire-chart-value-20 { --fw-wire-chart-value: 20%; }
.fw-wire-chart-value-25 { --fw-wire-chart-value: 25%; }
.fw-wire-chart-value-30 { --fw-wire-chart-value: 30%; }
.fw-wire-chart-value-35 { --fw-wire-chart-value: 35%; }
.fw-wire-chart-value-40 { --fw-wire-chart-value: 40%; }
.fw-wire-chart-value-45 { --fw-wire-chart-value: 45%; }
.fw-wire-chart-value-50 { --fw-wire-chart-value: 50%; }
.fw-wire-chart-value-55 { --fw-wire-chart-value: 55%; }
.fw-wire-chart-value-60 { --fw-wire-chart-value: 60%; }
.fw-wire-chart-value-65 { --fw-wire-chart-value: 65%; }
.fw-wire-chart-value-70 { --fw-wire-chart-value: 70%; }
.fw-wire-chart-value-75 { --fw-wire-chart-value: 75%; }
.fw-wire-chart-value-80 { --fw-wire-chart-value: 80%; }
.fw-wire-chart-value-85 { --fw-wire-chart-value: 85%; }
.fw-wire-chart-value-90 { --fw-wire-chart-value: 90%; }
.fw-wire-chart-value-95 { --fw-wire-chart-value: 95%; }
.fw-wire-chart-value-100 { --fw-wire-chart-value: 100%; }

.fw-wire-table {
  display: block;
  box-sizing: border-box;
  width: 100%;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  overflow: hidden;
}
.fw-wire-table-header {
  background: var(--fw-wire-fill-subtle);
  font-weight: 600;
}
.fw-wire-table-body {
  display: block;
}
.fw-wire-table-row {
  display: grid;
  border-top: var(--fw-wire-line-width) solid var(--fw-wire-line-subtle);
}
.fw-wire-table-header .fw-wire-table-row {
  border-top: none;
}
.fw-wire-table-body:first-child .fw-wire-table-row:first-child {
  border-top: none;
}
.fw-wire-table-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.fw-wire-table-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fw-wire-table-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fw-wire-table-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.fw-wire-table-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.fw-wire-table-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.fw-wire-table-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.fw-wire-table-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.fw-wire-table-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
.fw-wire-table-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.fw-wire-table-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); }
.fw-wire-table-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.fw-wire-table-cell {
  min-width: 0;
  box-sizing: border-box;
  padding: 0.4em 0.6em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fw-wire-table-cell-empty {
  min-height: 1em;
}

.fw-wire-map {
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  max-width: 32em;
  height: calc(var(--fw-wire-control-size, 2rem) * 6);
  overflow: hidden;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-paper);
}
.fw-wire-map-zoom-far {
  --fw-wire-map-cell: calc(var(--fw-wire-control-size, 2rem) * 0.5);
}
.fw-wire-map-zoom-medium {
  --fw-wire-map-cell: var(--fw-wire-control-size, 2rem);
}
.fw-wire-map-zoom-near {
  --fw-wire-map-cell: calc(var(--fw-wire-control-size, 2rem) * 2);
}
.fw-wire-map-tile {
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(
      0deg,
      var(--fw-wire-line-subtle) 0,
      var(--fw-wire-line-subtle) var(--fw-wire-line-width),
      transparent var(--fw-wire-line-width),
      transparent var(--fw-wire-map-cell)
    ),
    repeating-linear-gradient(
      90deg,
      var(--fw-wire-line-subtle) 0,
      var(--fw-wire-line-subtle) var(--fw-wire-line-width),
      transparent var(--fw-wire-line-width),
      transparent var(--fw-wire-map-cell)
    );
}
.fw-wire-map-area {
  position: absolute;
  top: 15%;
  left: 10%;
  width: 30%;
  height: 25%;
  background: var(--fw-wire-fill-subtle);
}
.fw-wire-map-road-h {
  position: absolute;
  top: 55%;
  left: 0;
  width: 100%;
  height: calc(var(--fw-wire-line-width) * 3);
  background: var(--fw-wire-line);
}
.fw-wire-map-road-v {
  position: absolute;
  top: 0;
  left: 40%;
  width: calc(var(--fw-wire-line-width) * 3);
  height: 100%;
  background: var(--fw-wire-line);
}
.fw-wire-map-marker {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  color: var(--fw-wire-ink);
}
.fw-wire-map-marker .fw-wire-icon-glyph {
  width: 1.5em;
  height: 1.5em;
}

.fw-wire-media {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-fill-subtle);
  color: var(--fw-wire-ink-muted);
  overflow: hidden;
  --fw-wire-media-control-size: var(--fw-wire-control-size, 2rem);
}
.fw-wire-media .fw-wire-media-disc {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-sizing: border-box;
  width: calc(var(--fw-wire-media-control-size) * 1.5);
  height: calc(var(--fw-wire-media-control-size) * 1.5);
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: 50%;
  background: var(--fw-wire-paper);
}
.fw-wire-media .fw-wire-icon-glyph {
  font-size: calc(var(--fw-wire-media-control-size) * 0.6);
}

.fw-wire-icon { display: inline-flex; align-items: center; justify-content: center; line-height: 1; vertical-align: middle; color: var(--fw-wire-ink); }

.fw-wire-brand {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-sizing: border-box;
  width: var(--fw-wire-control-size, 2rem);
  height: var(--fw-wire-control-size, 2rem);
  overflow: hidden;
  border: var(--fw-wire-line-width) solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  background: var(--fw-wire-fill-subtle);
  color: var(--fw-wire-ink-muted);
  font-family: var(--fw-wire-font-family);
  font-size: var(--fw-wire-font-size, 1rem);
  line-height: 1;
}
.fw-wire-brand .fw-wire-icon-glyph {
  font-size: calc(var(--fw-wire-control-size, 2rem) * 0.6);
}

.fw-wire-frame.fw-wire-frame-padding-xs {
  padding: calc(1.5rem / 2);
}
.fw-wire-frame.fw-wire-frame-padding-sm {
  padding: calc(1.75rem / 2);
}
.fw-wire-frame.fw-wire-frame-padding-md {
  padding: calc(2rem / 2);
}
.fw-wire-frame.fw-wire-frame-padding-lg {
  padding: calc(2.5rem / 2);
}
.fw-wire-frame.fw-wire-frame-padding-xl {
  padding: calc(3rem / 2);
}
.wireframes-demo {
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid var(--fw-wire-line);
  border-radius: var(--fw-wire-radius);
  padding: 1.5rem;
  margin: 0 0 1.5rem;
  background: var(--fw-wire-paper);
  color: var(--fw-wire-ink);
  color-scheme: light;
}
