/* Quantum - v2 - 20.09.2026 */

/* ---- TEMA: butun sayfalar ayni degisken adlarini kullaniyor ---- */
main.qm-app.qm-app,
main.u-app.u-app,
main.tarot-app.tarot-app,
main.ruya-app.ruya-app,
main.fk-app.fk-app,
main.cuzdan-app.cuzdan-app,
main.ask-app.ask-app,
main.kahve-app.kahve-app,
main.el-app.el-app,
main.bur-app.bur-app,
main.qo-app.qo-app,
main.om-app.om-app,
main.g-app.g-app {
  --bg:        #1b1220;
  --card:      #2b1a33bf;
  --line:      #e6a9a64d;
  --gold:      #e7ab9f;
  --gold-soft: #f7d5c7;
  --violet:    #caa6f2;
  --vurgu:     #caa6f2;
  --text:      #f8f0ea;
  --muted:     #cdb5c3;
}
html body { background: #1b1220 !important; }

/* ---- Menu kartlari ---- */
main.qm-app .qm-card      { border-radius: 16px; }
main.qm-app .qm-card-icon { width: 46px; height: 46px; }
main.qm-app .qm-card h2   { font-size: 1.02rem; line-height: 1.25; margin: 8px 0 4px; }
main.qm-app .qm-card p {
  font-size: .82rem; line-height: 1.4; min-height: 2.3em;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
main.qm-app .qm-card-cta {
  display: block; margin-top: 10px; padding: 9px 8px;
  border-radius: 999px; text-align: center;
  font-weight: 700; font-size: .88rem; letter-spacing: .02em;
  background: linear-gradient(90deg, #e7ab9f, #caa6f2);
}
main.qm-app .qm-card .qm-card-cta       { color: #241429 !important; border: 0 !important; }
main.qm-app .qm-card:hover .qm-card-cta { filter: brightness(1.08); }

/* ---- GIRIS EKRANI SIRASI: once Google ---- */
div:has(> form.space-y-3)                        { display: flex; flex-direction: column; gap: 14px; }
div:has(> form.space-y-3) > *                    { margin-top: 0 !important; order: 6; }
div:has(> form.space-y-3) > button               { order: 1; }
div:has(> form.space-y-3) > div.py-2             { order: 2; }
div:has(> form.space-y-3) > form.space-y-3       { order: 3; }
div:has(> form.space-y-3) > div.py-1             { order: 4; }
div:has(> form.space-y-3) > form:not(.space-y-3) { order: 5; }

/* ---- FAL SAYFASI: uyelik uyarisi paket dugmelerinin altina ---- */
main.tarot-app                                { display: flex; flex-direction: column; }
main.tarot-app > *                            { order: 5; }
main.tarot-app > .t-header                    { order: 1; }
main.tarot-app > section.t-card:first-of-type { order: 2; }
main.tarot-app > div:has(> .qm-duvar)         { order: 3; }
main.tarot-app > .t-submit                    { order: 9; }
body:has(.qm-duvar) > div:has(> a + button)   { display: none !important; }

/* ---- TELEFON: ilk acilis ve menu duzeni ----
   .qm-misafir-kart yalnizca giris yapmamis kisiye cizilir. */
@media (max-width: 640px) {
  main.qm-app                     { display: flex; flex-direction: column; }
  main.qm-app > *                 { order: 5; }
  main.qm-app > .qm-arka          { order: 0; }
  main.qm-app > .qm-header        { order: 1; }
  main.qm-app > .qm-token-serit   { order: 2; }
  main.qm-app > .qm-hero          { order: 3; }
  main.qm-app > .qm-misafir-kart  { order: 4; }
  main.qm-app > .qm-cards         { order: 5; }
  main.qm-app > .qm-serit         { order: 7; }
  main.qm-app > .qm-trust         { order: 8; }

  main.qm-app:has(.qm-misafir-kart) > .qm-token-serit { display: none; }

  main.qm-app > .qm-misafir-kart {
    display: flex; flex-direction: column; align-items: center;
    text-align: center; gap: 6px; padding: 14px 12px; margin: 12px 0 2px;
  }
  main.qm-app > .qm-misafir-kart .qm-mk-hediye { display: none; }
  main.qm-app > .qm-misafir-kart .qm-mk-metin  { display: block; }
  main.qm-app > .qm-misafir-kart .qm-mk-baslik { font-size: 1.05rem; font-weight: 700; }
  main.qm-app > .qm-misafir-kart .qm-mk-dugme  {
    width: 100%; max-width: 300px; padding: 13px 10px; font-size: 1rem; font-weight: 700;
  }

  main.qm-app > .qm-cards          { grid-template-columns: 1fr 1fr; gap: 10px; }
  main.qm-app > .qm-cards .qm-card { padding: 14px 10px 12px; }

  main.qm-app > .qm-hero           { padding-top: 14px; padding-bottom: 10px; }
  main.qm-app > .qm-hero h1        { font-size: 1.5rem; line-height: 1.2; }
  main.qm-app > .qm-hero .qm-cizgi { display: none; }
}

/* Tanitim sayfasinda "Kartlari ac" dugmesi tam genislikte olsun.
   Gecici: menu dogrudan fala baglanana kadar. */
@media (max-width: 640px) {
  main.u-app .u-cta {
    display: block; width: 100%; text-align: center;
    padding: 14px 10px; font-size: 1.02rem; font-weight: 700;
  }
}

/* ---- FAL SONUCU: kartlar ustte butun ekrani kaplamasin ----
   Telefonda 7 kart alt alta 1175 piksel tutuyordu, yorum ancak
   1375. pikselde basliyordu. Kartlar tek sirada kaydirilir serit oldu,
   "Sesli Oku" da metnin ustune alindi. */
main.tarot-app .t-result                     { display: flex; flex-direction: column; }
main.tarot-app .t-result > *                 { order: 5; }
main.tarot-app .t-result > .t-tier-label     { order: 1; }
main.tarot-app .t-result > .t-cards-grid     { order: 2; }
main.tarot-app .t-result > div:has(> button) { order: 3; margin: 2px 0 10px; }
main.tarot-app .t-result > .tmd              { order: 4; }
main.tarot-app .t-result > .t-result-actions { order: 6; }

@media (max-width: 640px) {
  main.tarot-app .t-cards-grid {
    display: flex; gap: 10px; overflow-x: auto;
    scroll-snap-type: x mandatory; padding-bottom: 8px; margin: 12px 0;
  }
  main.tarot-app .t-cards-grid > * { flex: 0 0 104px; scroll-snap-align: start; min-width: 0; }
}

/* ---- ANA MENU: uc sutun, iki satir ----
   Ust satir Tarot, Ask, Kahve; alt satir Ruya, Frekans, El.
   Kahve ve El kartlari studyodan eklenen dugmeler, kart gibi giydirildi. */
main.qm-app > .qm-cards                  { grid-template-columns: repeat(3, 1fr); gap: 10px; }
main.qm-app > .qm-cards > *:nth-child(1) { order: 1; }
main.qm-app > .qm-cards > *:nth-child(3) { order: 2; }
main.qm-app > .qm-cards > *:nth-child(5) { order: 3; }
main.qm-app > .qm-cards > *:nth-child(6) { order: 4; }
main.qm-app > .qm-cards > *:nth-child(2) { order: 5; }
main.qm-app > .qm-cards > *:nth-child(4) { order: 6; }

/* eklenen dugmeler kart gibi dursun */
main.qm-app > .qm-cards > .qs-blok { margin: 0; display: flex; }
main.qm-app > .qm-cards > .qs-blok a,
main.qm-app > .qm-cards > .qs-blok a.ikincil {
  flex: 1 1 auto; display: flex; flex-direction: column;
  align-items: center; justify-content: center; text-align: center;
  background: rgba(43, 26, 51, .75) !important;
  border: 1px solid rgba(230, 169, 166, .3) !important;
  box-shadow: none !important;
  border-radius: 16px; padding: 14px 10px 12px;
  font-size: .9rem; font-weight: 700; line-height: 1.25;
  color: var(--text);
}
main.qm-app > .qm-cards > .qs-blok a::before {
  display: flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; border-radius: 50%;
  border: 1px solid rgba(230,169,166,.35); color: var(--gold);
  font-size: 20px; margin-bottom: 4px;
}
main.qm-app > .qm-cards > *:nth-child(5) a::before { content: "◡"; }
main.qm-app > .qm-cards > *:nth-child(6) a::before { content: "☖"; }
main.qm-app > .qm-cards > .qs-blok a::after {
  content: "→"; display: block; margin-top: 8px; padding: 7px 6px;
  border-radius: 999px; font-size: .8rem; font-weight: 700; color: #241429;
  background: linear-gradient(90deg, #e7ab9f, #caa6f2); min-width: 64px;
}

/* Uc sutunda aciklama sigmiyor: telefonda simge ve baslik kalsin */
@media (max-width: 640px) {
  main.qm-app > .qm-cards .qm-card p       { display: none; }
  main.qm-app > .qm-cards .qm-card h2      { font-size: .9rem; margin: 8px 0 6px; }
  main.qm-app > .qm-cards .qm-card-cta     { margin-top: 4px; padding: 7px 6px; font-size: .8rem; }
}
main.qm-app > .qm-cards { grid-auto-rows: 1fr; }


/* ---- ASK SONUCU: kartlar raporu asagi itmesin ----
   Telefonda 3 kartlik izgara 419 piksel tutuyor ve uzun rapor ancak
   onun altinda basliyor. Tarottaki serit kurali burada da uygulaniyor.
   Hucre olcusu tarotla ayni (104px), ust satirdaki taban kural
   justify-content:center oldugu icin tasmada ilk kart kirpilmasin diye
   flex-start'a cekildi. */
@media (max-width: 640px) {
  main.ask-app .a-cards-grid {
    display: flex; gap: 10px; overflow-x: auto;
    scroll-snap-type: x mandatory; padding-bottom: 8px; margin: 12px 0;
    justify-content: flex-start;
  }
  main.ask-app .a-cards-grid > * { flex: 0 0 104px; scroll-snap-align: start; min-width: 0; }
}
/* Frekans: ses seviyesi cubugu (21 Eyl) */
/* Once cubuk nefes kuresiyle ayni satira sikisiyor, 38 px kaliyordu.
   Kure kendi satirina flex-basis 100% ile iner. fr.js kureyi acarken
   style.display='block' yazdigi icin burada display yazmak ise yaramaz. */
.fk-app .audio-ctrl{flex-wrap:wrap;justify-content:center;row-gap:14px}
.fk-app .audio-ctrl > .breath-orb-wrap{flex:0 0 100%;max-width:100%;width:100%}
.fk-app .audio-ctrl > button, .fk-app .audio-ctrl > .bw-badge{flex:0 0 auto}
.fk-app .audio-ctrl > .vol-wrap{flex:1 1 200px;min-width:0}
.fk-app .audio-ctrl > .vol-wrap > input[type=range]{width:100%;height:6px;margin:12px 0;border-radius:999px;cursor:pointer}
/* Tutamak parmak boyunda: cubuk genislese de 16 px'lik tutamak parmakla
   zor tutuluyordu. Ses ve ortam sesi cubuklarinin ikisine de gecerli. */
.fk-app input[type=range]::-webkit-slider-thumb{width:26px;height:26px}
.fk-app input[type=range]::-moz-range-thumb{width:26px;height:26px;border-radius:50%}
.fk-app .breath-orb-wrap #breathLabel{font-size:13px;line-height:1.3;text-align:center;max-width:110px;margin:0 auto}

/* Frekans mor tema 22 Eyl */
.fk-app{background:radial-gradient(at 50% 0%,#3a1f5a 0%,#1b1220 60%,#0d0912 100%) !important}