.data-confidence-guide {
  margin: 10px 0 14px;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 92% 18%, rgba(105, 205, 180, 0.18) 0 90px, transparent 91px),
    linear-gradient(135deg, #17324a, #21546a);
  border: 1px solid rgba(24, 50, 74, 0.14);
  border-radius: 18px;
  box-shadow: 0 13px 34px rgba(31, 65, 91, 0.13);
}

.data-confidence-guide summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-height: 50px;
  padding: 10px 15px;
  cursor: pointer;
  list-style: none;
}

.data-confidence-guide summary::-webkit-details-marker {
  display: none;
}

.data-confidence-guide summary::after {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  color: var(--ink);
  content: "+";
  background: var(--yellow);
  border-radius: 50%;
  font-size: 15px;
  font-weight: 950;
}

.data-confidence-guide[open] summary::after {
  content: "−";
}

.data-confidence-guide summary span {
  color: #8be0c8;
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0.08em;
}

.data-confidence-guide summary b {
  color: #f6fafb;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.45;
}

.data-confidence-guide > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  padding: 0 10px 10px;
}

.data-confidence-guide article {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 70px;
  padding: 11px 12px;
  background: rgba(255, 255, 255, 0.09);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
}

.data-confidence-guide article i {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  color: var(--ink);
  background: #8be0c8;
  border-radius: 10px;
  font-size: 13px;
  font-style: normal;
  font-weight: 950;
}

.data-confidence-guide article:nth-child(2) i {
  background: var(--yellow);
}

.data-confidence-guide article:nth-child(3) i {
  background: #f696ad;
}

.data-confidence-guide article span {
  display: grid;
  gap: 3px;
}

.data-confidence-guide article strong {
  font-size: 10px;
}

.data-confidence-guide article small {
  color: #c6d6de;
  font-size: 8px;
  font-weight: 650;
  line-height: 1.55;
}

@media (hover: hover) {
  .data-confidence-guide summary:hover {
    background: rgba(255, 255, 255, 0.05);
  }
}

@media (max-width: 820px) {
  .data-confidence-guide {
    margin-top: 12px;
    border-radius: 16px;
  }

  .data-confidence-guide summary {
    gap: 9px;
    min-height: 52px;
    padding: 10px 12px;
  }

  .data-confidence-guide summary span {
    font-size: 9px;
  }

  .data-confidence-guide summary b {
    font-size: 10px;
  }

  .data-confidence-guide > div {
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 0 8px 8px;
  }

  .data-confidence-guide article {
    min-height: 62px;
  }

  .data-confidence-guide article strong {
    font-size: 11px;
  }

  .data-confidence-guide article small {
    font-size: 10px;
  }
}

.finder-flow{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(190px,.72fr) minmax(190px,.72fr);gap:9px;margin:0 0 16px}
.finder-flow>article{display:grid;align-content:start;gap:9px;min-width:0;padding:15px;color:#17324a;background:rgba(255,255,255,.86);border:1px solid rgba(24,50,74,.11);border-radius:16px;box-shadow:0 8px 22px rgba(31,65,91,.06)}
.finder-flow header{display:flex;gap:10px;align-items:center}
.finder-flow header>b{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;color:#17324a;background:#ffe871;border-radius:10px;font-size:12px}
.finder-flow header>span{display:grid;gap:1px;min-width:0}
.finder-flow header small{color:#687a89;font-size:8px;font-weight:900;letter-spacing:.1em}
.finder-flow header strong{overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.finder-flow p{margin:0;color:#60758a;font-size:9px;font-weight:650;line-height:1.55}
.finder-flow-flavors>div{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.flow-flavor-loading{display:inline-flex;align-items:center;min-height:38px;padding:7px 10px;color:#60758a;background:#f2f6f7;border:1px dashed #b9c8ce;border-radius:999px;font-size:9px;font-weight:900}
.finder-flow-flavors button{min-height:30px;padding:5px 8px;color:#17324a;background:#fff;border:1px solid #d6e2e8;border-radius:999px;cursor:pointer;font-size:8px;font-weight:900}
.finder-flow-flavors button.active{color:#fff;background:#17324a;border-color:#17324a;box-shadow:0 0 0 3px rgba(255,232,113,.7)}
.flow-brand{display:inline-flex;gap:5px;align-items:center;padding:4px 6px;color:#fff;background:#168568;border-radius:999px;font-size:7px;font-weight:950}
.flow-brand.seven{background:#d94359}
.flow-brand.checked:after{content:"✓";display:grid;place-items:center;width:13px;height:13px;color:#17324a;background:#fff;border-radius:50%;font-size:7px}
.flow-locate{justify-self:start;display:inline-flex;gap:7px;align-items:center;min-height:34px;padding:7px 10px;color:#17324a;background:#ffe871;border:0;border-radius:999px;cursor:pointer;font-size:9px;font-weight:950}
.flow-locate.active{color:#fff;background:#168568}
.flow-checked-at{align-self:end;color:#168568;font-size:8px;font-weight:900}
.filter-panel-heading{grid-column:1/-1;display:flex;gap:9px;align-items:baseline;padding:1px 3px 4px}
.filter-panel-heading strong{font-size:11px}
.filter-panel-heading span{color:#60758a;font-size:8px;font-weight:700}
.finder-flow+.target-flavor-banner{margin-top:0}

@media (hover:hover){
  .finder-flow-flavors button:hover{background:#fff6c8;border-color:#17324a;transform:translateY(-1px)}
  .flow-locate:hover{transform:translateY(-1px)}
}

@media (max-width:820px){
  .finder-flow{grid-template-columns:1fr;gap:8px;margin-top:2px}
  .finder-flow>article{padding:14px}
  .finder-flow header strong{font-size:13px}
  .finder-flow p{font-size:10px}
  .finder-flow-flavors button{min-height:44px;padding-inline:12px;font-size:10px}
  .flow-flavor-loading{min-height:44px;font-size:10px}
  .flow-brand{font-size:9px}
  .flow-locate{width:100%;justify-content:center;min-height:44px;font-size:11px}
  .flow-checked-at{font-size:9px}
  .filter-panel-heading{display:grid;gap:2px}
  .filter-panel-heading strong{font-size:12px}
  .filter-panel-heading span{font-size:10px}
}