html[data-contact-layout-tuning] {
  --tune-workspace-width: 1648px;
  --tune-primary-column: 60%;
  --tune-card-radius: 40px;
  --tune-content-padding: 68px;
  --tune-content-gap: 21px;
  --tune-switch-width: 190px;
  --tune-switch-height: 39px;
  --tune-switch-text: 16px;
  --tune-inquiry-title: 61px;
  --tune-field-label: 17px;
  --tune-field-text: 16px;
  --tune-message-height: 368px;
  --tune-input-height: 47px;
  --tune-segment-height: 46px;
  --tune-file-height: 99px;
  --tune-submit-width: 168px;
  --tune-submit-height: 60px;
  --tune-guide-title: 61px;
  --tune-guide-row-padding: 17px;
  --tune-guide-number-size: 20px;
  --tune-guide-item-title: 17px;
  --tune-guide-item-copy: 16px;
  --tune-history-index-title: 61px;
  --tune-history-row-padding: 23px;
  --tune-history-row-title: 21px;
  --tune-history-meta-size: 13px;
  --tune-history-detail-title: 61px;
  --tune-history-subject-size: 30px;
  --tune-history-body-size: 16px;
  --tune-history-file-height: 54px;
  --tune-history-file-text: 15px;
}

html[data-contact-layout-tuning] .contact-guide-intro {
  display: none !important;
}

html[data-contact-layout-tuning] .contact-page-shell {
  width: min(calc(100% - 32px), var(--tune-workspace-width)) !important;
}

html[data-contact-layout-tuning] .contact-workspace {
  border-radius: var(--tune-card-radius) !important;
}

html[data-contact-layout-tuning] .contact-new-inquiry-panel,
html[data-contact-layout-tuning] .contact-history-detail {
  border-radius: var(--tune-card-radius) 0 0 var(--tune-card-radius) !important;
}

html[data-contact-layout-tuning] .contact-guide,
html[data-contact-layout-tuning] .contact-history-index {
  border-radius: 0 var(--tune-card-radius) var(--tune-card-radius) 0 !important;
}

html[data-contact-layout-tuning] .contact-form-content,
html[data-contact-layout-tuning] .contact-guide,
html[data-contact-layout-tuning] .contact-history-index-content,
html[data-contact-layout-tuning] .contact-history-detail {
  padding: var(--tune-content-padding) !important;
}

html[data-contact-layout-tuning] .contact-form-content,
html[data-contact-layout-tuning] .contact-guide,
html[data-contact-layout-tuning] .contact-history-index-content {
  gap: var(--tune-content-gap) !important;
}

html[data-contact-layout-tuning] .contact-mode-controller {
  margin: var(--tune-content-padding) !important;
}

html[data-contact-layout-tuning] .contact-new-inquiry-panel .contact-history-heading,
html[data-contact-layout-tuning] .contact-history-detail-heading {
  padding-right: calc(var(--tune-switch-width) + 32px) !important;
}

html[data-contact-layout-tuning] .contact-mode-switch {
  width: var(--tune-switch-width) !important;
  min-width: var(--tune-switch-width) !important;
}

html[data-contact-layout-tuning] .contact-mode-switch button {
  min-height: var(--tune-switch-height) !important;
  font-size: var(--tune-switch-text) !important;
}

html[data-contact-layout-tuning]
  .contact-new-inquiry-panel
  .contact-panel-heading
  h1 {
  font-size: var(--tune-inquiry-title) !important;
}

html[data-contact-layout-tuning] .contact-field-label,
html[data-contact-layout-tuning] .contact-reply-method legend {
  font-size: var(--tune-field-label) !important;
}

html[data-contact-layout-tuning] .contact-field input,
html[data-contact-layout-tuning] .contact-field textarea {
  font-size: var(--tune-field-text) !important;
}

html[data-contact-layout-tuning] .contact-message-field textarea {
  height: var(--tune-message-height) !important;
  min-height: var(--tune-message-height) !important;
}

html[data-contact-layout-tuning] .contact-field input {
  min-height: var(--tune-input-height) !important;
}

html[data-contact-layout-tuning] .contact-segmented-control span {
  min-height: var(--tune-segment-height) !important;
}

html[data-contact-layout-tuning] .contact-file-drop {
  min-height: var(--tune-file-height) !important;
}

html[data-contact-layout-tuning] .contact-submit-row button {
  min-width: var(--tune-submit-width) !important;
  min-height: var(--tune-submit-height) !important;
}

html[data-contact-layout-tuning] .contact-guide-heading h2 {
  font-size: var(--tune-guide-title) !important;
}

html[data-contact-layout-tuning] .contact-guide-list button,
html[data-contact-layout-tuning] .contact-guide-row {
  grid-template-columns: var(--tune-guide-number-size) minmax(0, 1fr);
  padding-block: var(--tune-guide-row-padding) !important;
}

html[data-contact-layout-tuning]
  .contact-guide-list
  .contact-guide-expandable-item
  button {
  grid-template-columns: var(--tune-guide-number-size) minmax(0, 1fr) 44px;
}

html[data-contact-layout-tuning]
  .contact-guide-expandable-item
  .contact-guide-number {
  width: var(--tune-guide-number-size) !important;
  height: var(--tune-guide-number-size) !important;
}

html[data-contact-layout-tuning] .contact-guide-copy strong {
  font-size: var(--tune-guide-item-title) !important;
}

html[data-contact-layout-tuning] .contact-guide-copy small {
  font-size: var(--tune-guide-item-copy) !important;
}

html[data-contact-layout-tuning]
  .contact-history-index
  .contact-panel-heading
  h1 {
  font-size: var(--tune-history-index-title) !important;
}

html[data-contact-layout-tuning] .contact-history-list button {
  padding-block: var(--tune-history-row-padding) !important;
}

html[data-contact-layout-tuning] .contact-history-list-copy strong {
  font-size: var(--tune-history-row-title) !important;
}

html[data-contact-layout-tuning] .contact-history-list-copy small,
html[data-contact-layout-tuning] .contact-history-list-copy em {
  font-size: var(--tune-history-meta-size) !important;
}

html[data-contact-layout-tuning] .contact-history-detail-heading h2 {
  font-size: var(--tune-history-detail-title) !important;
}

html[data-contact-layout-tuning] .contact-history-detail h3 {
  font-size: var(--tune-history-subject-size) !important;
}

html[data-contact-layout-tuning] .contact-history-detail article section > p {
  font-size: var(--tune-history-body-size) !important;
}

html[data-contact-layout-tuning] .contact-history-files button {
  min-height: var(--tune-history-file-height) !important;
  font-size: var(--tune-history-file-text) !important;
}

@media (min-width: 48.001rem) {
  html[data-contact-layout-tuning] .contact-workspace,
  html[data-contact-layout-tuning] .contact-workspace[data-mode="history"] {
    grid-template-columns:
      minmax(0, var(--tune-primary-column))
      minmax(0, calc(100% - var(--tune-primary-column))) !important;
  }
}
