:root{
  --quick-quiz-panel-padding:var(--space-8);
}

.quickSetupPanel{
  max-width:900px;
  margin:0 auto;
  padding:var(--quick-quiz-panel-padding);
  border:1px solid var(--color-border);
  border-radius:var(--radius-xl);
  background:color-mix(in srgb,var(--color-panel) 88%,transparent);
  box-shadow:0 12px 34px color-mix(in srgb,var(--color-bg) 70%,transparent);
}
.quickSetupPanel > *{margin:0}
.quickSetupPanel > * + *{margin-top:var(--space-8)}
.quickProgress{width:100%;height:18px;border:1px solid var(--color-border);border-radius:999px;background:color-mix(in srgb,var(--color-panel) 75%,transparent);overflow:hidden}
.quickProgressBar{height:100%;width:0;background:var(--color-accent);transition:width .2s ease}
.quickContent{
  display:grid;
  gap:var(--space-8);
  align-content:start;
  padding:var(--quick-quiz-panel-padding);
  border:1px solid color-mix(in srgb,var(--color-border) 82%,transparent);
  border-radius:var(--radius-lg);
  background:color-mix(in srgb,var(--color-panel) 82%,transparent);
}
.quickContent > *{margin:0}
.quickPrompt{margin:0;font-size:clamp(20px,2vw,26px);line-height:1.25}
.quickLead{margin:0;font-size:clamp(14px,1.3vw,16px);color:var(--color-muted)}
.quickPromptBlock{display:grid;gap:var(--space-2)}
.quickPromptBlock--spend .quickHint{font-size:var(--font-size-sm)}
.quickHint{margin:0;font-size:var(--font-size-sm);color:var(--color-muted)}
.quickLabel{font-size:var(--font-size-xl)}
.quickBigInput{font-size:clamp(20px,2.2vw,27px);padding:var(--space-5) var(--space-5)!important;border-radius:var(--radius-xl)!important}
.quickGoalGrid{display:grid;gap:var(--space-4);align-items:start}
.quickGoalBtn{display:flex;align-items:center;justify-content:center;padding:var(--space-5);text-align:center;font-size:clamp(16px,1.5vw,19px);line-height:1.3;min-height:0;border-radius:var(--radius-xl)}
.quickGoalBtn.is-selected{border-color:var(--color-accent);background:color-mix(in srgb,var(--color-accent) 20%,transparent)}
.quickActions{display:flex;justify-content:space-between;gap:var(--space-4)}
.quickActions.hidden{display:none}
.quickActions button{width:auto;min-width:150px;padding:var(--space-4) var(--space-7)}
.quickSearch .listBox{max-height:300px;margin-top:var(--space-4)}
.quickSearch .listOption{padding:var(--space-4);font-size:var(--font-size-lg)}
.cardSearchThumb{display:inline-flex;align-items:center;justify-content:center;line-height:0;flex:0 0 auto}
.quickSearch .cardSearchThumb .thumb{height:52px;width:auto}
.quickSearch .chip{font-size:var(--font-size-base);padding:var(--space-3) var(--space-4)}

.quickAnswerArea{margin:0;display:grid;gap:var(--space-4)}

.quickSliderBounds{display:flex;justify-content:space-between;font-size:var(--font-size-sm);color:var(--color-muted);margin-top:calc(-1 * var(--space-2))}

.quickResultsScreen{display:grid;gap:var(--space-8);align-content:start}
.quickResultsHero{text-align:center;display:grid;gap:var(--space-3)}
.quickResultsHero > *{margin:0}
.quickSetupResultShell{padding:var(--space-6)}
.quickSetupResultPanel{min-height:180px}
.quickUpliftCallout{margin:0;text-align:center}
.quickResultsActions{justify-content:center;flex-wrap:wrap}


.quickResultsHero.is-ideal .quickPrompt{font-size:clamp(28px,3.4vw,44px);line-height:1.1;letter-spacing:-0.02em;color:var(--color-brand-highlight)}
.quickResultsHero.is-ideal .quickHint{font-size:var(--font-size-base);text-transform:uppercase;letter-spacing:.08em}
.quickResultsHero.is-current .quickPrompt{font-size:clamp(22px,2.6vw,30px)}
.quickResultsHero .quickLead{max-width:58ch;margin:0 auto;color:var(--color-muted)}


.quickResultsHero.is-ideal{
  padding:var(--space-6);
  border:1px solid color-mix(in srgb,var(--color-brand-highlight) 45%,var(--color-border));
  border-radius:var(--radius-xl);
  background:
    radial-gradient(120% 100% at 50% -10%, color-mix(in srgb,var(--color-brand-highlight) 22%, transparent), transparent 65%),
    color-mix(in srgb,var(--color-panel) 90%,transparent);
  box-shadow:
    0 0 0 1px color-mix(in srgb,var(--color-brand-highlight) 22%, transparent) inset,
    0 16px 40px color-mix(in srgb,var(--color-brand-highlight) 22%, transparent);
}

.quickResultsHero.is-current{
  padding:var(--space-4);
  border:1px solid color-mix(in srgb,var(--color-border) 84%,transparent);
  border-radius:var(--radius-lg);
  background:color-mix(in srgb,var(--color-panel) 84%,transparent);
}


.quickAnswerArea .quickDetailsToggle{justify-self:start}
.quickAnswerArea .quickDetailsToggle summary{font-size:var(--font-size-sm);line-height:1.35;gap:var(--space-2)}
.quickAnswerArea .quickDetailsToggle .spendControlLabel{text-decoration:underline;font-weight:500}
.quickAnswerArea .quickDetailsPanel{margin-top:var(--space-2);margin-bottom:0;font-size:var(--font-size-sm);line-height:1.45}
