body {
  font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  background:
    radial-gradient(circle at 14% 12%, rgba(135, 94, 182, 0.1), transparent 24%),
    radial-gradient(circle at 86% 18%, rgba(66, 166, 214, 0.1), transparent 28%),
    radial-gradient(circle at 52% 88%, rgba(255, 190, 92, 0.06), transparent 26%),
    linear-gradient(180deg, #ede3db 0%, #e2d7ce 52%, #dbd1c9 100%);
}

body::before,
body::after {
  content: "";
  position: fixed;
  inset: auto;
  width: 34vw;
  height: 34vw;
  border-radius: 999px;
  filter: blur(64px);
  opacity: 0.32;
  pointer-events: none;
  z-index: 0;
}

body::before {
  top: 8%;
  left: -8%;
  background: rgba(138, 102, 172, 0.1);
  animation: drift-a 22s ease-in-out infinite alternate;
}

body::after {
  right: -10%;
  bottom: 8%;
  background: rgba(79, 154, 212, 0.08);
  animation: drift-b 26s ease-in-out infinite alternate;
}

.shell {
  position: relative;
  z-index: 1;
}

.eyebrow {
  color: #6e6270;
}

h1 {
  color: #221b20;
  letter-spacing: -0.03em;
}

.lede,
.control-group p,
.panel-head p,
.result-provenance,
small,
.domain-card span,
.meta dt {
  color: #675d65;
}

.domain-card,
.panel {
  background:
    linear-gradient(180deg, rgba(248, 244, 239, 0.92) 0%, rgba(241, 236, 231, 0.88) 100%);
  border-color: rgba(117, 110, 125, 0.16);
  box-shadow:
    0 20px 44px rgba(62, 48, 58, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.domain-card:hover,
.domain-card.active {
  border-color: rgba(92, 116, 188, 0.4);
  box-shadow:
    0 22px 48px rgba(66, 76, 114, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.6);
}
.domain-card.active {
  background: linear-gradient(180deg, #e8f1ff 0%, #d7e7ff 100%);
  border-color: #72a4f2;
  box-shadow:
    0 22px 48px rgba(60, 95, 160, 0.2),
    0 0 0 1px rgba(114, 164, 242, 0.3) inset;
}
.domain-card.active::after {
  background: linear-gradient(90deg, #72a4f2, #4e84dc);
}
.domain-card.active span {
  color: #415a82;
}
.domain-card.active strong {
  color: #214f99;
}

.field span,
legend,
.control-group h2,
.panel h3 {
  color: #2f2b33;
}

textarea,
input[type="file"],
input[type="text"],
.toggle,
.chip,
.llm-panel,
.report {
  background: rgba(252, 249, 245, 0.84);
  border-color: rgba(118, 112, 128, 0.18);
}

.chip {
  color: #716973;
  border-radius: 999px;
  padding: 9px 16px;
}

.chip.selected {
  color: #23345f;
  border-color: rgba(77, 104, 196, 0.58);
  background: linear-gradient(180deg, rgba(223, 231, 255, 0.94), rgba(198, 214, 255, 0.82));
  box-shadow:
    0 12px 22px rgba(72, 102, 168, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.48);
}

.toggle {
  background:
    linear-gradient(180deg, rgba(248, 245, 250, 0.84), rgba(242, 240, 245, 0.78));
}

.toggle-compact:has(input:checked) {
  color: #23345f;
  border-color: rgba(77, 104, 196, 0.46);
  background: linear-gradient(180deg, rgba(224, 232, 255, 0.9), rgba(209, 219, 249, 0.82));
  box-shadow: 0 12px 22px rgba(72, 102, 168, 0.14);
}

.primary-request {
  background:
    linear-gradient(180deg, rgba(249, 246, 250, 0.96), rgba(242, 238, 245, 0.9));
  border-color: rgba(95, 108, 152, 0.2);
  box-shadow:
    0 18px 38px rgba(71, 72, 101, 0.08),
    0 0 0 1px rgba(255, 255, 255, 0.42) inset;
}

.primary-request textarea {
  background:
    linear-gradient(180deg, rgba(255, 253, 250, 0.96), rgba(246, 244, 248, 0.92));
  border-color: rgba(99, 115, 166, 0.24);
}

.primary-request textarea:focus {
  border-color: rgba(83, 108, 188, 0.5);
  box-shadow:
    0 0 0 4px rgba(111, 142, 229, 0.1),
    0 0 24px rgba(98, 134, 201, 0.08);
}

.submit {
  background: linear-gradient(135deg, #526ba8 0%, #3d5e8e 100%);
  color: #fff9ff;
  border-radius: 999px;
  box-shadow: 0 10px 22px rgba(63, 88, 138, 0.2);
}

.secondary {
  background: rgba(251, 249, 246, 0.72);
  color: #64606c;
  border-color: rgba(118, 112, 128, 0.2);
}

.run-indicator {
  background: linear-gradient(90deg, rgba(220, 229, 249, 0.76), rgba(233, 237, 247, 0.86));
  color: #435273;
}

.run-indicator-dot {
  background: #4d6bb8;
}

.result-panel.is-running {
  border-color: rgba(88, 110, 178, 0.24);
  box-shadow:
    0 22px 48px rgba(77, 88, 122, 0.14),
    0 0 0 1px rgba(255, 255, 255, 0.36) inset;
}

.source-list,
.source-list a {
  color: #4d63b8;
}

@keyframes drift-a {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to { transform: translate3d(5vw, 2vh, 0) scale(1.08); }
}

@keyframes drift-b {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to { transform: translate3d(-4vw, -3vh, 0) scale(1.12); }
}
