body {
  background:
    radial-gradient(circle at top, var(--participant-bg-accent), transparent 34%),
    linear-gradient(180deg, #fbfdff 0, var(--participant-bg) 100%) !important;
  color: var(--participant-ink) !important;
}

body,
input,
select,
textarea,
button {
  font-family: "IBM Plex Sans", "Segoe UI", "Helvetica Neue", sans-serif !important;
}

.shell {
  gap: 12px !important;
  padding: 16px 14px 24px !important;
}

.topbar {
  align-items: center !important;
}

.topbar-tools {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.theme-switcher {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px 6px 10px;
  border-radius: 12px;
  border: 1px solid var(--participant-line);
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 6px 14px rgba(31, 45, 61, 0.05);
}

.theme-switcher span {
  color: var(--participant-muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.theme-switcher select {
  min-width: 108px;
  padding: 7px 30px 7px 10px !important;
  border-radius: 10px !important;
  background: #fff !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
}

.eyebrow {
  color: var(--participant-muted) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
}

.back-link,
.close-btn,
.logout-btn {
  border: 1px solid var(--participant-line) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--participant-brand-deep) !important;
  box-shadow: 0 6px 14px rgba(31, 45, 61, 0.06) !important;
}

.mini-nav,
.actions {
  gap: 8px !important;
}

.mini-nav-link,
.action-link,
.open-link,
.link-btn {
  min-height: 36px !important;
  padding: 9px 13px !important;
  border-radius: 12px !important;
  border: 1px solid var(--participant-line) !important;
  background: var(--participant-panel) !important;
  color: var(--participant-brand-deep) !important;
  box-shadow: 0 6px 14px rgba(31, 45, 61, 0.06) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.action-link,
.link-btn.primary,
button.primary,
.submit {
  background: linear-gradient(180deg, #5d88b3 0, #3b6793 100%) !important;
  border-color: #3b6793 !important;
  color: #f8fbff !important;
}

.mini-nav-link.current {
  background: linear-gradient(180deg, #edf4fb 0, #ddeaf7 100%) !important;
  border-color: #bfd1e3 !important;
  color: #274f79 !important;
}

.card,
.panel,
.result,
.item,
.summary,
.group,
.checks,
.fact {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0, var(--participant-panel-soft) 100%) !important;
  border-color: var(--participant-line) !important;
  box-shadow: var(--participant-shadow) !important;
}

.card,
.panel {
  border-radius: 20px !important;
}

.content,
.summary,
.section,
.section-card,
.panel,
.fact,
.fact-list,
.grid > *,
.layout > * {
  align-content: start !important;
  align-items: start !important;
}

.content,
.panel,
.summary,
.group,
.checks,
.fact-list,
.list,
.cards,
.stack {
  gap: 12px !important;
}

.headline h1,
.summary h1,
h1 {
  color: var(--participant-ink) !important;
  font-size: clamp(24px, 3vw, 32px) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.02em !important;
  font-weight: 760 !important;
}

h2,
.panel h2,
.fact strong {
  color: #73859a !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.card-title,
.title {
  color: var(--participant-ink) !important;
  font-size: 20px !important;
  line-height: 1.12 !important;
  font-weight: 740 !important;
}

.meta,
.help,
.notice,
p {
  color: var(--participant-muted) !important;
  font-size: 14px !important;
  line-height: 1.58 !important;
}

.body,
.about,
.fact span,
.text {
  display: block !important;
  align-self: start !important;
  color: #314355 !important;
  font-size: 15px !important;
  line-height: 1.62 !important;
  text-align: left !important;
  white-space: pre-wrap !important;
}

label {
  color: #42576c !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

input[type="text"],
input[type="date"],
input[type="number"],
select,
textarea {
  border-radius: 12px !important;
  border: 1px solid var(--participant-line-strong) !important;
  background: #fff !important;
  color: var(--participant-ink) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.65), 0 1px 2px rgba(31, 45, 61, 0.03) !important;
}

textarea {
  display: block !important;
  min-height: 128px !important;
  height: auto !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  text-align: left !important;
  text-align-last: left !important;
  vertical-align: top !important;
  align-self: start !important;
  padding: 12px 14px !important;
  line-height: 1.55 !important;
  white-space: pre-wrap !important;
  overflow: auto !important;
  resize: vertical !important;
}

textarea::placeholder,
input::placeholder {
  color: #98a5b3 !important;
}

.errors,
.errorlist {
  color: #ac4e4e !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

.notice {
  border-radius: 16px !important;
  background: #f7fbff !important;
  border: 1px solid var(--participant-line) !important;
}

.chip {
  background: #eef4fa !important;
  border-color: #d5e1ec !important;
  color: #49647e !important;
  font-size: 13px !important;
}

.checks-option {
  background: #f9fbfd !important;
  border-color: var(--participant-line) !important;
  color: #36495d !important;
  box-shadow: none !important;
}

.checks input[type="checkbox"] {
  border-color: #bfcede !important;
  background: linear-gradient(180deg, #dfe7ef 0, #d0dbe7 100%) !important;
  box-shadow: inset 0 1px 2px rgba(31, 45, 61, 0.12) !important;
}

.checks input[type="checkbox"]:checked {
  background: linear-gradient(180deg, #6f95bb 0, #4977a6 100%) !important;
  border-color: #4977a6 !important;
  box-shadow: inset 0 1px 2px rgba(31, 45, 61, 0.16), 0 0 0 3px rgba(73, 119, 166, 0.12) !important;
}

.fact,
.group,
.summary {
  padding: 14px 16px !important;
  border-radius: 16px !important;
}

.hero,
.thumb,
.gallery-item,
.photo {
  border-color: var(--participant-line) !important;
  box-shadow: none !important;
}

.hero-placeholder,
.thumb-placeholder,
.photo-placeholder {
  color: #8a9aac !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

.help {
  font-size: 12px !important;
  color: #7b8b9b !important;
}

@media (max-width: 720px) {
  .shell {
    padding-inline: 12px !important;
  }
  .topbar {
    align-items: flex-start !important;
  }
  .topbar-tools {
    width: 100%;
    justify-content: space-between;
  }
  .mini-nav-link,
  .action-link,
  .open-link,
  .link-btn,
  .submit {
    width: 100%;
  }
}