/* Close-hue colour fields. Only transform moves: no animated blur or colour stops. */
.flow-root { height:100vh; overflow-y:auto; -webkit-overflow-scrolling:touch; isolation:isolate; }
@supports (height:100dvh) { .flow-root { height:100dvh; } }
.flow-gradient { position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; background:var(--flow-base); }
.flow-gradient::before { content:""; position:absolute; inset:-20%; opacity:.95;
  background:radial-gradient(ellipse at 80% 18%,var(--flow-near),transparent 65%),radial-gradient(ellipse at 12% 85%,var(--flow-third),transparent 65%);
  animation:flowWash 42s ease-in-out infinite alternate; }
@keyframes flowWash { from { transform:translate(-3%,-2%) rotate(-5deg); } to { transform:translate(4%,3%) rotate(8deg) scale(1.06); } }
.flow-root[data-paused="true"] .flow-gradient::before { animation-play-state:paused; }
.flow-root .usurf { background:#fff8f2; border:0 !important; }
.flow-root button,.flow-root input,.flow-root textarea { font-family:inherit; }
.flow-root button { min-height:44px; }
.flow-root button:focus-visible,.flow-root a:focus-visible {
  outline:3px solid var(--flow-accent) !important; outline-offset:4px;
}
.flow-root .flow-primary { background:var(--flow-accent) !important; color:#fff !important; border:0; }
.flow-root .flow-primary:hover { filter:brightness(1.07); }
.flow-root .flow-content p { color:var(--flow-ink) !important; }
.flow-root .flow-content input,.flow-root .flow-content textarea { border:0 !important; }
/* Focus belongs to the rounded field surface, not a box inside it. */
.flow-root .flow-content textarea:focus,.flow-root .flow-content input:focus { outline:none !important; }
.flow-root .flow-field,.flow-root .flow-input {
  background:rgba(255,255,255,.68) !important;
  transition:background .18s ease,box-shadow .18s ease;
}
.flow-root .flow-field:focus-within,.flow-root .flow-input:focus {
  background:rgba(255,255,255,.88) !important;
  box-shadow:0 8px 24px rgba(51,35,31,.16) !important;
}
.flow-root .flow-field textarea { background:transparent; }
@media (forced-colors:active) {
  .flow-root .flow-content textarea:focus,.flow-root .flow-content input:focus { outline:2px solid Highlight !important; }
}
.flow-root .flow-content button[aria-pressed="true"] { box-shadow:none !important; }
.flow-root .flow-privacy { font-size:12px; line-height:1.6; text-align:center; margin:4px 0 0; }
.flow-root .step-title { font-size:38px !important; letter-spacing:-1.3px !important; line-height:1.13 !important; }
.flow-root .step-sub { font-size:16px !important; font-weight:400 !important; line-height:1.65 !important; max-width:390px; }
.flow-root .decision-layout { display:flex; flex-direction:column; gap:18px; width:100%; }
.flow-root .decision-card { background:rgba(255,255,255,.74); padding:24px; border-radius:20px; box-shadow:0 9px 22px #214c3c0d; }
.flow-root .decision-card .decision-label { color:#46625a !important; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:1.5px; margin:0 0 10px; }
.flow-root .decision-card .decision-choice { color:#203f3d !important; font-size:25px; line-height:1.4; font-weight:800; letter-spacing:-.5px; overflow-wrap:anywhere; margin:0 0 24px; }
.flow-root .decision-field-label { display:flex; justify-content:space-between; gap:12px; color:#203f3d; font-size:13px; font-weight:700; margin-bottom:10px; }
.flow-root .decision-field-label span { font-weight:400; color:#617165; }
.flow-root .decision-card textarea { width:100%; min-height:80px; resize:vertical; background:#eaf0e3; color:#233f37; font-size:16px; line-height:1.5; border-radius:12px; padding:13px; margin-bottom:20px; }
.flow-root .decision-card fieldset { border:0; padding:0; margin:0; min-width:0; }
.flow-root .decision-card legend { color:#203f3d; font-size:13px; font-weight:700; padding:0; margin-bottom:10px; }
.flow-root .decision-timing { display:flex; gap:8px; }
.flow-root .decision-timing button { flex:1; border:0; border-radius:10px; background:#eaf0e3; color:#345247; font-size:12px; font-weight:600; padding:12px 6px; }
.flow-root .decision-timing button[aria-pressed="true"] { background:var(--flow-accent); color:#fff; }
.flow-root .decision-foot { display:flex; justify-content:space-between; gap:16px; margin-top:23px; font-size:11px; color:#63766a; }
.flow-root .copy-status { min-height:24px; font-size:13px; line-height:1.5; margin:0; text-align:center; }
.flow-root .flow-content { max-width:506px !important; }
.flow-root .flow-header { max-width:506px !important; }
.flow-root .flow-step-count { font-size:12px; font-weight:600; color:var(--flow-ink); }
@media (min-width:900px) {
 .flow-root .step-title { font-size:42px !important; }
 .flow-root .flow-content { padding-top:24px !important; }
}
@media (max-width:370px) {
 .flow-root .flow-header,.flow-root .flow-content { padding-left:20px !important; padding-right:20px !important; }
 .flow-root .decision-card { padding:20px; }
 .flow-root .feeling-label { font-size:13px !important; }
}
@media (prefers-reduced-motion:reduce) { .flow-gradient::before { animation:none; } }
.flow-root .flow-stack { display:flex; flex-direction:column; gap:16px; }
.flow-root .flow-prompt { font-size:17px; font-weight:700; line-height:1.5; margin:0; }
.flow-root .flow-note { font-size:14px; line-height:1.65; margin:0; }
.flow-root .flow-link { background:transparent; border:0; color:var(--flow-ink); font-size:13px; font-weight:600; padding:10px 6px; text-decoration:underline; text-underline-offset:4px; }
.flow-root .flow-help { font-size:13px; line-height:1.6; }
.flow-root .flow-help summary { min-height:44px; padding:11px 0; cursor:pointer; font-weight:600; }
.flow-root .flow-help summary:focus-visible { outline:3px solid var(--flow-accent); outline-offset:3px; }
.flow-root .flow-help p { margin:5px 0 10px; }
.flow-root .option-field { border-radius:15px; padding:16px 18px; }
.flow-root .option-field label { display:block; font-size:11px; font-weight:800; letter-spacing:1px; text-transform:uppercase; color:var(--flow-accent); margin-bottom:8px; }
.flow-root .option-field textarea { width:100%; resize:vertical; min-height:58px; font-size:16px; line-height:1.6; color:#33231f; }
.flow-root .flow-choice { padding:18px 20px; border-radius:16px; font-size:16px; line-height:1.6; text-align:left; font-weight:600; overflow-wrap:anywhere; }