.tarot-yes-no-tool {
  position: relative;
  margin: 28px 0;
  padding: clamp(22px, 4vw, 42px);
  overflow: hidden;
  border: 1px solid rgba(255, 128, 132, 0.28);
  border-radius: 26px;
  background: linear-gradient(145deg, rgba(45, 39, 47, 0.97), rgba(25, 25, 32, 0.99));
  box-shadow: 0 34px 80px rgba(0, 0, 0, 0.22);
}

.tarot-yes-no-tool,
.tarot-yes-no-tool * { box-sizing: border-box; }

.tarot-yes-no-tool__heading {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr);
  gap: clamp(20px, 4vw, 42px);
  align-items: end;
  margin-bottom: 30px;
}

.tarot-yes-no-tool__heading h2,
.tarot-yes-no-result__top h2 {
  margin: 5px 0 0;
  font-size: clamp(1.75rem, 3.5vw, 2.75rem);
  line-height: 1.08;
  letter-spacing: -.03em;
  text-wrap: balance;
}

.tarot-yes-no-tool__heading > p,
.tarot-yes-no-result__top p {
  margin: 0;
  color: var(--m3-text-soft, #bbb8ca);
  line-height: 1.62;
}

.tarot-yes-no-form { display: grid; gap: 22px; }
.tarot-yes-no-form fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.tarot-yes-no-form legend,
.tarot-yes-no-question > span:first-child { display: block; margin-bottom: 11px; color: var(--m3-text, #f4f4fa); font-weight: 850; }
.tarot-yes-no-question small { color: var(--m3-text-soft, #bbb8ca); font-weight: 550; }

.tarot-yes-no-topics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 9px; }
.tarot-yes-no-topics button,
.tarot-yes-no-examples button,
.tarot-yes-no-redraw {
  min-height: 46px;
  padding: 9px 12px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 14px;
  background: rgba(255, 255, 255, .035);
  color: var(--m3-text-soft, #bbb8ca);
  font: inherit;
  font-weight: 780;
  cursor: pointer;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, color 160ms ease;
}
.tarot-yes-no-topics button:hover,
.tarot-yes-no-examples button:hover,
.tarot-yes-no-redraw:hover { transform: translateY(-1px); border-color: rgba(255, 128, 132, .5); color: #fff; }
.tarot-yes-no-topics button[aria-pressed="true"] { border-color: rgba(255, 128, 132, .72); background: rgba(255, 128, 132, .14); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 128, 132, .15); }

.tarot-yes-no-question textarea {
  display: block;
  width: 100%;
  min-height: 112px;
  resize: vertical;
  padding: 16px 17px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 16px;
  outline: 0;
  background: rgba(13, 14, 19, .52);
  color: #fff;
  font: inherit;
  line-height: 1.5;
}
.tarot-yes-no-question textarea:focus { border-color: rgba(255, 128, 132, .76); box-shadow: 0 0 0 4px rgba(255, 128, 132, .1); }
.tarot-yes-no-question textarea[aria-invalid="true"] { border-color: #ff8e91; }
.tarot-yes-no-question__meta { display: flex; justify-content: space-between; gap: 12px; min-height: 22px; margin-top: 7px; color: var(--m3-text-soft, #bbb8ca); font-size: .78rem; }
.tarot-yes-no-question__meta > span:first-child { color: #ffb0b2; }

.tarot-yes-no-examples { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: -8px; }
.tarot-yes-no-examples > span { color: var(--m3-text-soft, #bbb8ca); font-size: .82rem; }
.tarot-yes-no-examples button { min-height: 36px; padding: 6px 10px; border-radius: 999px; font-size: .78rem; }
.tarot-yes-no-draw { display: inline-flex !important; align-items: center; justify-content: center; width: 100%; min-height: 58px !important; white-space: nowrap; }

.tarot-yes-no-loading { display: grid; place-items: center; gap: 14px; min-height: 300px; margin-top: 24px; text-align: center; color: var(--m3-text-soft, #bbb8ca); }
.tarot-yes-no-loading[hidden], .tarot-yes-no-result[hidden] { display: none !important; }
.tarot-yes-no-loading__card { width: 110px; aspect-ratio: 3/5; border: 1px solid rgba(255, 128, 132, .35); border-radius: 15px; background: radial-gradient(circle at 50% 40%, rgba(242, 189, 126, .22), transparent 26%), linear-gradient(145deg, rgba(255, 128, 132, .2), rgba(18, 19, 25, .9)); box-shadow: 0 20px 45px rgba(0, 0, 0, .36); animation: tarot-card-pulse 900ms ease-in-out infinite alternate; }
@keyframes tarot-card-pulse { to { transform: translateY(-5px) rotate(1deg); box-shadow: 0 28px 55px rgba(255, 128, 132, .14); } }

.tarot-yes-no-result { scroll-margin-top: 16px; margin-top: 28px; padding-top: 28px; border-top: 1px solid rgba(255, 255, 255, .1); outline: 0; }
.tarot-yes-no-result__top { display: flex; justify-content: space-between; gap: 18px; align-items: end; margin-bottom: 22px; }
.tarot-yes-no-result__top > div { min-width: 0; }
.tarot-yes-no-result__top > div > p:last-child { margin-top: 10px; }
.tarot-yes-no-redraw { flex: 0 0 auto; }
.tarot-yes-no-result__body { display: grid; grid-template-columns: minmax(190px, 270px) minmax(0, 1fr); gap: clamp(22px, 4vw, 44px); align-items: center; }
.tarot-yes-no-result figure { min-width: 0; margin: 0; }
.tarot-yes-no-result figure img { display: block; width: 100%; aspect-ratio: 3/5; object-fit: cover; border: 1px solid rgba(255, 255, 255, .18); border-radius: 18px; background: #191a20; box-shadow: 0 28px 65px rgba(0, 0, 0, .4); }
.tarot-yes-no-result figcaption { margin-top: 10px; color: #fff; font-size: 1.05rem; font-weight: 850; text-align: center; }
.tarot-yes-no-result__reading { display: grid; gap: 16px; min-width: 0; }
.tarot-yes-no-verdict { width: max-content; max-width: 100%; padding: 8px 13px; border: 1px solid rgba(255, 255, 255, .14); border-radius: 999px; color: #fff; background: rgba(255, 255, 255, .06); font-weight: 900; }
.tarot-yes-no-verdict[data-tone="positive"] { border-color: rgba(124, 219, 167, .5); background: rgba(72, 174, 118, .14); }
.tarot-yes-no-verdict[data-tone="negative"] { border-color: rgba(255, 128, 132, .56); background: rgba(255, 128, 132, .14); }
.tarot-yes-no-verdict[data-tone="conditional"] { border-color: rgba(242, 189, 126, .5); background: rgba(242, 189, 126, .12); }
.tarot-yes-no-meaning { margin: 0; color: var(--m3-text, #f4f4fa); font-size: clamp(1.08rem, 2vw, 1.28rem); line-height: 1.58; }
.tarot-yes-no-reality { padding: 16px; border-left: 3px solid rgba(242, 189, 126, .72); border-radius: 0 14px 14px 0; background: rgba(242, 189, 126, .065); }
.tarot-yes-no-reality strong { color: var(--m3-secondary, #f2bd7e); }
.tarot-yes-no-reality p { margin: 6px 0 0; color: var(--m3-text-soft, #bbb8ca); line-height: 1.55; }
.tarot-yes-no-card-link { width: max-content; max-width: 100%; color: var(--m3-primary, #ff8084); font-weight: 800; text-decoration: none; }

.tarot-yes-no-transfer { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px 22px; align-items: center; margin-top: 26px; padding: clamp(18px, 3vw, 26px); border: 1px solid rgba(255, 128, 132, .3); border-radius: 20px; background: linear-gradient(135deg, rgba(255, 128, 132, .11), rgba(242, 189, 126, .055)); }
.tarot-yes-no-transfer > div { grid-row: 1 / span 2; min-width: 0; }
.tarot-yes-no-transfer strong { color: #fff; font-size: 1.15rem; }
.tarot-yes-no-transfer p { max-width: 650px; margin: 7px 0 0; color: var(--m3-text-soft, #bbb8ca); line-height: 1.52; }
.tarot-yes-no-transfer__facts { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0; padding: 0; list-style: none; }
.tarot-yes-no-transfer__facts li { padding: 6px 9px; border: 1px solid rgba(255, 255, 255, .11); border-radius: 999px; color: var(--m3-text-soft, #bbb8ca); background: rgba(255, 255, 255, .035); font-size: .76rem; font-weight: 760; line-height: 1.25; }
.tarot-yes-no-transfer__facts li::before { content: "✓"; margin-right: 5px; color: var(--m3-secondary, #f2bd7e); }
.tarot-yes-no-transfer .button { min-width: 210px; text-align: center; white-space: nowrap; }
.tarot-yes-no-transfer > small { grid-column: 1 / -1; color: var(--m3-text-soft, #bbb8ca); }
.tarot-yes-no-transfer [aria-disabled="true"] { pointer-events: none; opacity: .66; }
.tarot-yes-no-disclaimer { margin: 20px 0 0; color: var(--m3-text-soft, #bbb8ca); font-size: .78rem; line-height: 1.5; }

@media (max-width: 860px) {
  .tarot-yes-no-tool__heading { grid-template-columns: 1fr; align-items: start; }
  .tarot-yes-no-topics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tarot-yes-no-transfer { grid-template-columns: 1fr; }
  .tarot-yes-no-transfer > div { grid-row: auto; }
  .tarot-yes-no-transfer .button { width: 100%; min-width: 0; }
}

@media (max-width: 600px) {
  .tarot-yes-no-tool { margin-inline: 0; padding: 18px; border-radius: 20px; }
  .tarot-yes-no-topics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tarot-yes-no-result__top { display: grid; align-items: start; }
  .tarot-yes-no-redraw { width: 100%; }
  .tarot-yes-no-result__body { grid-template-columns: minmax(0, 1fr); }
  .tarot-yes-no-result figure { width: min(230px, 78vw); margin-inline: auto; }
  .tarot-yes-no-transfer { padding: 17px; border-radius: 17px; }
  .tarot-yes-no-draw,
  .tarot-yes-no-transfer .button { font-size: clamp(.88rem, 4.1vw, 1rem); }
}

@media (prefers-reduced-motion: reduce) {
  .tarot-yes-no-loading__card { animation: none; }
  .tarot-yes-no-topics button,
  .tarot-yes-no-examples button,
  .tarot-yes-no-redraw { transition: none; }
}