/* Tarot Yes/No v1.1 - white + #3e68ff */
.tyno-app{--blue:#3e68ff;--blue2:#294dcc;--ink:#16213d;--muted:#69748c;--line:#e7ebf5;max-width:1120px;margin:35px auto;padding:34px 22px;background:#fff;border:1px solid #eef1f7;border-radius:24px;box-shadow:0 16px 55px rgba(29,50,100,.08);box-sizing:border-box;text-align:center;direction:rtl;font-family:inherit}
.tyno-intro{max-width:850px;margin:auto}.tyno-kicker{display:inline-block;color:var(--blue);font-size:11px;letter-spacing:3px;font-weight:800;margin-bottom:8px;direction:ltr}
.tyno-intro h2{margin:0 0 10px;font-size:31px;font-weight:850;color:var(--ink)}.tyno-intro p{margin:0 auto;color:var(--muted);line-height:2;font-size:15px}
.tyno-arrows{color:var(--blue);font-size:32px;line-height:1;margin:19px 0 15px}
.tyno-deck{display:flex;justify-content:center;align-items:flex-end;gap:12px;max-width:980px;margin:0 auto 24px;min-height:285px;perspective:1400px}
.tyno-card{width:142px;height:265px;position:relative;border:0;background:transparent;padding:0;cursor:pointer;perspective:1100px;flex:0 1 142px}
.tyno-card:nth-child(2){transform:translateY(10px)}.tyno-card:nth-child(4){transform:translateY(10px)}
.tyno-card-inner{width:100%;height:100%;position:static;transform-style:preserve-3d;transition:transform .65s cubic-bezier(.18,.8,.2,1)}
.tyno-card:hover .tyno-card-inner{transform:translateY(-12px) rotateZ(-1deg)}.tyno-card.selected .tyno-card-inner{transform:rotateY(180deg)}
.tyno-card-face{position:absolute;inset:0;border-radius:15px;backface-visibility:hidden;overflow:hidden;border:1px solid rgba(62,104,255,.42);box-shadow:0 12px 26px rgba(24,43,92,.16)}
.tyno-card-back{background:#f5f7ff center/cover no-repeat;display:flex;align-items:center;justify-content:center}.tyno-custom-back img{width:100%;height:100%;display:block;object-fit:cover}
.tyno-card-back:not([style*="background-image"]){background:linear-gradient(145deg,#0e1c47,#233f91)}
.tyno-default-back{position:absolute;inset:10px;border:1px solid rgba(255,255,255,.65);border-radius:11px;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;box-shadow:inset 0 0 0 5px rgba(255,255,255,.06)}
.tyno-default-back i{font-style:normal;font-size:38px;color:#9fb5ff}.tyno-default-back b{font-size:14px;letter-spacing:4px;direction:ltr}.tyno-default-back small{font-size:10px;letter-spacing:2px;direction:ltr;color:#cdd7ff}.tyno-default-back em{font-style:normal;font-size:10px;color:#dfe6ff;margin-top:5px}
.tyno-card-front{transform:rotateY(180deg);background:#fff;display:flex;align-items:center;justify-content:center}.tyno-card-front img{width:100%;height:100%;object-fit:cover}.tyno-card-front .tyno-no-image{padding:12px;color:var(--ink);font-weight:700}
.tyno-card.disabled{opacity:.35;pointer-events:none}.tyno-random,.tyno-again{border:0;border-radius:12px;background:var(--blue);color:#fff;padding:13px 25px;font-size:15px;font-weight:800;cursor:pointer;box-shadow:0 8px 20px rgba(62,104,255,.24);transition:.2s}.tyno-random:hover,.tyno-again:hover{background:var(--blue2);transform:translateY(-2px)}
.tyno-result{position:relative;margin:32px auto 0;background:#fff;border:1px solid var(--line);border-radius:20px;padding:28px;max-width:1050px;box-shadow:0 14px 45px rgba(29,50,100,.08);text-align:right}
.tyno-spread-cards{display:flex;justify-content:center;align-items:flex-start;gap:14px;flex-wrap:wrap}.tyno-reading-card{width:160px;text-align:center}.tyno-position{font-size:12px;font-weight:800;color:var(--blue);margin-bottom:7px}.tyno-mini-card{height:220px;border-radius:12px;overflow:hidden;background:#f5f7fb;border:1px solid var(--line);box-shadow:0 8px 20px rgba(29,50,100,.08)}.tyno-mini-card img{width:100%;height:100%;object-fit:cover}.tyno-reading-card h4{margin:10px 0 7px;font-size:16px;color:var(--ink)}.tyno-reading-card p{font-size:13px;line-height:1.9;color:#5e6a82;text-align:right}.tyno-tip{font-size:12px;line-height:1.8;background:#f5f7ff;color:#55617a;padding:8px;border-radius:8px;text-align:right}
.tyno-answer,.tyno-overall-answer{display:inline-block;border-radius:999px;padding:6px 13px;font-size:13px;font-weight:850}.tyno-answer.yes,.tyno-overall-answer.yes{background:#eaf8ef;color:#18733d}.tyno-answer.no,.tyno-overall-answer.no{background:#fff0f0;color:#a32626}.tyno-answer.maybe,.tyno-overall-answer.maybe{background:#fff8df;color:#806000}
.tyno-overall{margin:25px auto 10px;text-align:center}.tyno-overall-answer{font-size:17px;padding:9px 18px}.tyno-reading-summary{max-width:800px;margin:10px auto;color:#667188;line-height:2;text-align:center}
.tyno-close{position:absolute;left:15px;top:12px;border:0;background:#f4f6fb;width:34px;height:34px;border-radius:50%;font-size:23px;cursor:pointer;color:#63708a}.tyno-again{display:block;margin:20px auto 0}.tyno-note{font-size:11px;color:#9aa3b5;margin:20px auto 0}.tyno-empty{padding:25px;background:#f7f9ff;border:1px solid var(--line);border-radius:12px}
@media(max-width:780px){.tyno-app{padding:25px 12px}.tyno-intro h2{font-size:25px}.tyno-deck{gap:5px;min-height:210px}.tyno-card{height:205px;flex-basis:calc(20% - 5px);max-width:120px}.tyno-card:nth-child(2),.tyno-card:nth-child(4){transform:none}.tyno-card-face{border-radius:9px}.tyno-default-back i{font-size:25px}.tyno-default-back b{font-size:10px;letter-spacing:2px}.tyno-default-back small{font-size:7px}.tyno-spread-cards{gap:8px}.tyno-reading-card{width:calc(33.33% - 8px)}.tyno-mini-card{height:175px}.tyno-reading-card p{font-size:12px}}
@media(max-width:470px){.tyno-card{height:165px}.tyno-reading-card{width:calc(50% - 8px)}.tyno-mini-card{height:190px}.tyno-result{padding:18px}}

.tyno-app[data-spread="three"] .tyno-deck,.tyno-app[data-spread="love"] .tyno-deck{display:grid;grid-template-columns:repeat(7,minmax(72px,1fr));gap:10px;max-width:900px;min-height:0;align-items:stretch}
.tyno-app[data-spread="three"] .tyno-card,.tyno-app[data-spread="love"] .tyno-card{width:auto;height:145px;max-width:none;flex:none}
.tyno-app[data-spread="three"] .tyno-card:nth-child(2),.tyno-app[data-spread="three"] .tyno-card:nth-child(4),.tyno-app[data-spread="love"] .tyno-card:nth-child(2),.tyno-app[data-spread="love"] .tyno-card:nth-child(4){transform:none}
.tyno-app[data-spread="three"] .tyno-card:hover .tyno-card-inner,.tyno-app[data-spread="love"] .tyno-card:hover .tyno-card-inner{transform:translateY(-6px) rotateZ(-1deg)}
.tyno-app[data-spread="three"] .tyno-card.selected .tyno-card-inner,.tyno-app[data-spread="love"] .tyno-card.selected .tyno-card-inner{transform:rotateY(180deg)}

@media(max-width:780px){.tyno-app[data-spread="three"] .tyno-deck,.tyno-app[data-spread="love"] .tyno-deck{grid-template-columns:repeat(7,minmax(40px,1fr));gap:5px}.tyno-app[data-spread="three"] .tyno-card,.tyno-app[data-spread="love"] .tyno-card{height:125px}.tyno-app[data-spread="three"] .tyno-default-back i,.tyno-app[data-spread="love"] .tyno-default-back i{font-size:18px}.tyno-app[data-spread="three"] .tyno-default-back b,.tyno-app[data-spread="love"] .tyno-default-back b{font-size:7px}.tyno-app[data-spread="three"] .tyno-default-back small,.tyno-app[data-spread="love"] .tyno-default-back small{font-size:5px}.tyno-app[data-spread="three"] .tyno-default-back em,.tyno-app[data-spread="love"] .tyno-default-back em{display:none}}
@media(max-width:470px){.tyno-app[data-spread="three"] .tyno-deck,.tyno-app[data-spread="love"] .tyno-deck{grid-template-columns:repeat(7,minmax(34px,1fr));gap:4px}.tyno-app[data-spread="three"] .tyno-card,.tyno-app[data-spread="love"] .tyno-card{height:105px}}

/* Three-card / love deck: hard responsive grid override for Elementor/Woodmart */
.tyno-app[data-spread="three"] .tyno-deck,
.tyno-app[data-spread="love"] .tyno-deck{
  display:grid !important;
  grid-template-columns:repeat(7,minmax(0,1fr)) !important;
  width:100% !important;
  max-width:900px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  gap:10px !important;
  overflow:visible !important;
  box-sizing:border-box !important;
}
.tyno-app[data-spread="three"] .tyno-card,
.tyno-app[data-spread="love"] .tyno-card{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:145px !important;
  flex:none !important;
  margin:0 !important;
  box-sizing:border-box !important;
}
.tyno-app[data-spread="three"] .tyno-card-inner,
.tyno-app[data-spread="love"] .tyno-card-inner{
  width:100% !important;
  height:100% !important;
}

@media (max-width:780px){
  .tyno-app[data-spread="three"] .tyno-deck,
  .tyno-app[data-spread="love"] .tyno-deck{
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
    gap:7px !important;
    max-width:100% !important;
  }
  .tyno-app[data-spread="three"] .tyno-card,
  .tyno-app[data-spread="love"] .tyno-card{
    height:125px !important;
  }
}

@media (max-width:470px){
  .tyno-app[data-spread="three"] .tyno-deck,
  .tyno-app[data-spread="love"] .tyno-deck{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:6px !important;
  }
  .tyno-app[data-spread="three"] .tyno-card,
  .tyno-app[data-spread="love"] .tyno-card{
    height:112px !important;
  }
}


/* v1.3.3 - robust selection state + theme-proof responsive deck */
.tyno-app[data-spread="three"] .tyno-deck,
.tyno-app[data-spread="love"] .tyno-deck{
  display:grid !important;
  grid-auto-flow:row !important;
  grid-template-columns:repeat(7,minmax(0,1fr)) !important;
  grid-auto-rows:auto !important;
  align-items:stretch !important;
  justify-items:stretch !important;
  width:100% !important;
  max-width:900px !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}
.tyno-app[data-spread="three"] .tyno-card,
.tyno-app[data-spread="love"] .tyno-card{
  position:relative !important;
  display:block !important;
  grid-column:auto !important;
  grid-row:auto !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  flex:initial !important;
  box-sizing:border-box !important;
}

/* Clearly mark a chosen card. The back/front image is still visible, but the
   selected card becomes darker and gets a blue selection ring + check mark. */
.tyno-card.selected{
  filter:brightness(.72) saturate(.82) !important;
  transform:none !important;
  outline:3px solid rgba(62,104,255,.95) !important;
  outline-offset:2px !important;
  border-radius:15px !important;
  box-shadow:0 0 0 5px rgba(62,104,255,.14),0 12px 28px rgba(29,50,100,.24) !important;
  z-index:5 !important;
}
.tyno-card.selected::after{
  content:'✓ انتخاب شد';
  position:absolute !important;
  z-index:20 !important;
  top:7px !important;
  right:7px !important;
  padding:5px 8px !important;
  border-radius:999px !important;
  background:#3e68ff !important;
  color:#fff !important;
  font:700 10px/1.2 inherit !important;
  white-space:nowrap !important;
  pointer-events:none !important;
  box-shadow:0 3px 10px rgba(29,50,100,.28) !important;
}
.tyno-card.selected .tyno-card-face{
  border-color:rgba(62,104,255,.95) !important;
}

@media(max-width:780px){
  .tyno-app[data-spread="three"] .tyno-deck,
  .tyno-app[data-spread="love"] .tyno-deck{
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
    gap:7px !important;
    max-width:100% !important;
  }
  .tyno-card.selected{outline-width:2px !important;outline-offset:1px !important}
  .tyno-card.selected::after{top:4px !important;right:4px !important;padding:4px 6px !important;font-size:8px !important}
}
@media(max-width:470px){
  .tyno-app[data-spread="three"] .tyno-deck,
  .tyno-app[data-spread="love"] .tyno-deck{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:6px !important;
  }
  .tyno-card.selected::after{content:'✓' !important;width:20px !important;height:20px !important;padding:0 !important;display:flex !important;align-items:center !important;justify-content:center !important;font-size:12px !important}
}


/* v1.3.5 - responsive card count for Yes/No and One-card spreads */
.tyno-app[data-spread="yesno"] .tyno-deck,
.tyno-app[data-spread="one"] .tyno-deck{
  width:100% !important;
  max-width:980px !important;
  display:flex !important;
  flex-wrap:nowrap !important;
  justify-content:center !important;
  align-items:flex-end !important;
  box-sizing:border-box !important;
}
.tyno-app[data-spread="yesno"] .tyno-card,
.tyno-app[data-spread="one"] .tyno-card{
  flex:0 1 142px !important;
  width:142px !important;
  max-width:142px !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

/* On tablet, never show more than 5 cards even if desktop is configured for 6-7. */
@media (max-width:780px){
  .tyno-app[data-spread="yesno"] .tyno-card:nth-child(n+6),
  .tyno-app[data-spread="one"] .tyno-card:nth-child(n+6){
    display:none !important;
  }
  .tyno-app[data-spread="yesno"] .tyno-card,
  .tyno-app[data-spread="one"] .tyno-card{
    flex:0 1 calc(20% - 5px) !important;
    width:calc(20% - 5px) !important;
    max-width:120px !important;
    height:205px !important;
  }
}

/* On phones, show at most 3 cards. This makes the same desktop selection count
   usable without squeezing seven narrow cards into one row. */
@media (max-width:470px){
  .tyno-app[data-spread="yesno"] .tyno-card:nth-child(n+4),
  .tyno-app[data-spread="one"] .tyno-card:nth-child(n+4){
    display:none !important;
  }
  .tyno-app[data-spread="yesno"] .tyno-card,
  .tyno-app[data-spread="one"] .tyno-card{
    flex:0 1 calc(33.333% - 5px) !important;
    width:calc(33.333% - 5px) !important;
    max-width:105px !important;
    height:165px !important;
  }
}
