:root{
  --night-0:#150C24;
  --night-1:#1E1236;
  --night-2:#291B49;
  --night-3:#3B2A63;
  --cream:#F1EAF6;
  --cream-dim:#B6A6CE;
  --gold:#D4AF4E;
  --gold-dim:#8C7230;
  --rose:#D07C93;
  --font-display:'Fraunces', serif;
  --font-body:'Inter', sans-serif;
  --font-mono:'IBM Plex Mono', monospace;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--night-0);
  color:var(--cream);
  font-family:var(--font-body);
  line-height:1.6;
  position:relative;
  overflow-x:hidden;
}
.wrap{max-width:1040px;margin:0 auto;padding:0 24px;position:relative;z-index:1}

a{color:inherit}

/* starfield background, continues the hero image's mood across the whole site */
.starfield{
  position:fixed;inset:0;z-index:0;pointer-events:none;
  background-color:var(--night-0);
  background-image:
    radial-gradient(1.5px 1.5px at 10% 20%, var(--gold-dim) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 80% 10%, var(--cream-dim) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 60% 70%, var(--gold-dim) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 30% 85%, var(--cream-dim) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 90% 55%, var(--gold-dim) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 45% 40%, var(--cream-dim) 50%, transparent 51%);
  background-repeat:repeat;
  background-size:340px 340px;
  animation:driftStars 60s linear infinite;
}
@keyframes driftStars{from{background-position:0 0}to{background-position:340px 340px}}

.eyebrow{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--gold);
  margin:0 0 12px;
}
h1,h2,h3{font-family:var(--font-display);font-weight:500;margin:0 0 16px;color:var(--cream)}
h1{font-size:46px;line-height:1.12}
h2{font-size:32px;position:relative;display:inline-block}
h2::after{content:'';display:block;width:56px;height:2px;background:var(--gold-dim);margin-top:10px}
h3{font-size:20px}
.section-sub{color:var(--cream-dim);max-width:560px;margin:0 0 32px;font-size:16px}

.btn{
  font-family:var(--font-body);
  font-size:14px;
  font-weight:500;
  color:var(--cream);
  background:var(--night-2);
  border:1px solid var(--night-3);
  padding:12px 22px;
  border-radius:8px;
  cursor:pointer;
  transition:transform .15s, border-color .15s, background .15s, box-shadow .15s;
  box-shadow:0 2px 0 rgba(0,0,0,0.25);
}
.btn:hover:not(:disabled){border-color:var(--gold-dim);background:var(--night-3);transform:translateY(-1px)}
.btn:active:not(:disabled){transform:translateY(0)}
.btn:disabled{opacity:0.35;cursor:not-allowed}
.btn-primary{background:var(--gold);color:var(--night-0);border-color:var(--gold);font-weight:600}
.btn-primary:hover:not(:disabled){background:#e2c069}
.btn-ghost{border-color:transparent;background:transparent;color:var(--cream-dim);box-shadow:none}
.chip{border-radius:999px;padding:9px 18px;font-size:13px}
.chip.active{background:var(--gold);color:var(--night-0);border-color:var(--gold)}

/* header */
.site-header{position:sticky;top:0;z-index:30;background:var(--night-0);border-bottom:1px solid var(--night-2)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;gap:12px;flex-wrap:wrap}
.brand{font-family:var(--font-display);font-size:20px;letter-spacing:0.08em;color:var(--gold);flex-shrink:0}
.tabs{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.tab-btn{
  font-family:var(--font-body);font-size:13px;font-weight:500;color:var(--cream-dim);
  background:transparent;border:1px solid transparent;padding:9px 16px;border-radius:999px;cursor:pointer;
  transition:background .15s, color .15s;
}
.tab-btn:hover{color:var(--cream)}
.tab-btn.active{background:var(--night-2);color:var(--gold);border-color:var(--night-3)}

/* page intro (per-tab header illustration) */
.page-intro{display:flex;gap:24px;align-items:center;margin-bottom:32px}
.page-intro-illustration{position:relative;width:130px;flex-shrink:0;border-radius:14px;overflow:hidden;border:1px solid var(--night-3);box-shadow:0 10px 24px rgba(0,0,0,0.35)}
.page-intro-illustration img{width:100%;display:block;animation:breathe 7s ease-in-out infinite}
.page-intro h1{font-size:34px;margin-bottom:10px}
.page-intro .section-sub{margin-bottom:0}
@keyframes breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
.sparkle{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--gold);animation:twinkle 2.4s ease-in-out infinite}
.sparkle-a{top:12%;left:16%;animation-delay:0s}
.sparkle-b{bottom:16%;right:14%;animation-delay:.9s;background:var(--cream)}
@keyframes twinkle{0%,100%{opacity:.15;transform:scale(0.8)}50%{opacity:1;transform:scale(1.2)}}

.panel-wide{max-width:920px}

/* unified card stage — fan, face-down spread, gathered deck and 3x3 reveal all live here */
.card-stage{position:relative;min-height:300px;margin-bottom:20px;display:flex;align-items:center;justify-content:center}
.stage-fan{position:relative;width:100%;height:280px}
.stage-reveal-combo{display:flex;flex-direction:column;align-items:center;gap:18px;width:100%}
.reveal-row-overlay{display:flex;gap:10px;min-height:90px;align-items:center}
.reveal-fan-layer{width:100%}
.stage-spread{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-content:center;width:100%;transition:opacity .25s}
.stage-gather{position:relative;width:100%;height:220px;display:flex;align-items:center;justify-content:center}
.piles-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;width:100%;max-width:420px;margin:0 auto}

/* sections */
main{padding:64px 0 32px}
.tab-panel{display:none;padding:8px 0 56px}
.tab-panel.active{display:block}

.fal-panel{
  position:relative;background:var(--night-1);border:1px solid var(--night-2);
  border-radius:16px;padding:32px;max-width:760px;
  box-shadow:0 16px 40px rgba(0,0,0,0.35);
}
.panel-corner{position:absolute;width:22px;height:22px;border:1.5px solid var(--gold-dim);opacity:.7}
.panel-corner.tl{top:14px;left:14px;border-right:none;border-bottom:none;border-radius:6px 0 0 0}
.panel-corner.br{bottom:14px;right:14px;border-left:none;border-top:none;border-radius:0 0 6px 0}

.controls{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}
.grid-area{display:grid;grid-template-columns:repeat(13,1fr);gap:4px;margin-bottom:16px}
.status-text{font-size:14px;color:var(--cream-dim);margin:8px 0}
.micro-label{font-family:var(--font-mono);font-size:11px;letter-spacing:0.08em;text-transform:uppercase;color:var(--cream-dim);margin:0 0 8px}
.card-row{display:flex;gap:8px;flex-wrap:wrap}
.picked-area,.remain-area{margin-top:18px}
.board-area{margin-top:20px}
.deal-status{font-size:13px;color:var(--cream-dim);margin-bottom:10px}
.reveal-row{min-height:66px;align-items:center}
.pile-col{display:flex;flex-direction:column;align-items:center;gap:4px}
.pile-suit{font-size:18px}
.pile-line{font-size:12px;color:var(--cream-dim)}
.question-buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.yorum-area{margin-top:20px;border-top:1px solid var(--night-2);padding-top:18px}
.yorum-text{font-family:var(--font-display);font-size:17px;line-height:1.75;color:var(--cream);white-space:pre-wrap;min-height:1.75em}
.yorum-text.is-loading{color:var(--cream-dim);font-style:italic}
.yorum-text.is-loading::after{content:'';display:inline-block;width:7px;height:7px;margin-left:8px;border-radius:50%;background:var(--gold);animation:pulseDot 1.1s ease-in-out infinite;vertical-align:middle}
.yorum-text.is-error{font-family:var(--font-body);font-size:14px;color:var(--rose);white-space:normal}
@keyframes pulseDot{0%,100%{opacity:.2;transform:scale(.7)}50%{opacity:1;transform:scale(1)}}

/* card */
.card{
  border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  font-weight:600;cursor:pointer;
  background-color:var(--night-2);
  background-size:cover;background-position:center;
  transition:transform .2s, opacity .2s;flex-shrink:0;
}
.card:not(.face){background-image:url('assets/card-back.jpg')}
.card:focus-visible,.btn:focus-visible,.tab-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.card.face{border:1px solid var(--night-3);background:var(--cream)}
.card.face.red{color:#A8324A}
.card.face.black{color:var(--night-0)}

.suit-red{color:var(--rose)}
.suit-black{color:var(--cream)}

/* coffee */
.upload-box{
  border:1.5px dashed var(--night-3);border-radius:12px;
  min-height:160px;display:flex;align-items:center;justify-content:center;
  margin-bottom:18px;overflow:hidden;background:var(--night-2);cursor:pointer;
  transition:border-color .15s, background .15s;
}
.upload-box.is-drag{border-color:var(--gold);background:var(--night-3)}
.upload-prompt{text-align:center;color:var(--cream-dim);padding:24px}
.upload-prompt p{margin-bottom:14px}

.coffee-preview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px;margin-bottom:14px}
.coffee-thumb{position:relative;border-radius:8px;overflow:hidden;border:1px solid var(--night-3);aspect-ratio:1/1}
.coffee-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.coffee-thumb button{
  position:absolute;top:4px;right:4px;width:22px;height:22px;border-radius:50%;
  border:none;background:rgba(21,12,36,0.8);color:var(--cream);cursor:pointer;font-size:13px;line-height:1;
}

/* soon */
.soon-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.soon-card{background:var(--night-1);border:1px solid var(--night-2);border-radius:16px;padding:24px;box-shadow:0 10px 26px rgba(0,0,0,0.3)}
.soon-badge{
  display:inline-block;font-family:var(--font-mono);font-size:11px;letter-spacing:0.08em;
  text-transform:uppercase;color:var(--gold);background:rgba(212,175,78,0.14);
  padding:4px 10px;border-radius:999px;margin-bottom:12px;
}

/* footer */
.site-footer{padding:32px 0;border-top:1px solid var(--night-2);color:var(--cream-dim);font-size:13px;position:relative;z-index:1}

@media(max-width:720px){
  h1{font-size:28px}
  .page-intro{flex-direction:column;align-items:flex-start;gap:16px}
  .page-intro-illustration{width:100px}
  .fal-panel{padding:20px 14px}
  .panel-wide{max-width:100%}
  .controls{gap:8px}
  .controls .btn{flex:1 1 auto;font-size:13px;padding:10px 14px;text-align:center}
  .card-stage{min-height:200px}
  .stage-fan{height:180px}
  .grid-area{grid-template-columns:repeat(9,1fr)}
  .soon-grid{grid-template-columns:1fr}
  .piles-grid{grid-template-columns:repeat(2,1fr);max-width:100%}
  .tabs{flex-wrap:wrap;justify-content:flex-start}
  .header-inner{padding:14px 16px}
  main{padding:32px 0 16px}
  .wrap{padding:0 16px}
}
@media(max-width:420px){
  .page-intro-illustration{width:84px}
  h1{font-size:24px}
  .stage-fan{height:150px}
}


@media(prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  html{scroll-behavior:auto}
}

/* ===== Tarot ===== */
body{transition:background .5s}
body.theme-tarot{background:#050d18 radial-gradient(ellipse at 50% -10%,#14405a 0%,#0a1f33 38%,#050d18 80%) fixed}
body.theme-tarot::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.55;
  background-image:radial-gradient(1.2px 1.2px at 20% 30%,#f3e3a6 50%,transparent 51%),radial-gradient(1px 1px at 70% 20%,#fff 50%,transparent 51%),radial-gradient(1.4px 1.4px at 85% 65%,#f3e3a6 50%,transparent 51%),radial-gradient(1px 1px at 35% 80%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 55% 55%,#9fe3f0 50%,transparent 51%);
  background-size:380px 380px}
#tarot,#kelt{--night-0:#050d18;--night-1:#0a1f33;--night-2:#10304a;--night-3:#1a4766;--gold:#E3BE62;--gold-dim:#8f7634}
#tarot .fal-panel,#kelt .fal-panel{background:linear-gradient(180deg,rgba(16,48,74,.72),rgba(8,24,40,.82));border-color:rgba(227,190,98,.35)}
.chip.is-on{background:var(--gold);color:var(--night-0);border-color:var(--gold)}
.tarot-focus{margin:0 0 20px;justify-content:center}
.tarot-rows{display:flex;flex-direction:column;gap:14px;margin-bottom:20px}
.tarot-row{border:1px solid rgba(227,190,98,.18);border-radius:12px;padding:12px 14px 14px;background:rgba(5,13,24,.45);opacity:.5;transition:opacity .3s,border-color .3s}
.tarot-row.is-active{opacity:1;border-color:var(--gold);box-shadow:0 0 24px rgba(227,190,98,.12)}
.tarot-row.is-done{opacity:.9}
.tarot-row-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.tarot-row-no{width:24px;height:24px;border-radius:50%;border:1px solid var(--gold);color:var(--gold);display:grid;place-items:center;font-size:12px}
.tarot-row.is-done .tarot-row-no{background:var(--gold);color:var(--night-0)}
.tarot-row-label{font-family:var(--font-display);font-size:18px;color:var(--cream)}
.tarot-row-tag{margin-left:auto;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.tarot-row-body{min-height:112px;display:flex;align-items:center;justify-content:center}
/* kapalı kart sırtı: ortak */
.tarot-stack-card,.tarot-fan-card,.tarot-aside,.tarot-back{background:#10304a url('assets/card-back-tarot.jpg') center/cover;border-radius:6px;box-shadow:0 0 0 1px var(--gold-dim)}
.tarot-stack{all:unset;position:relative;display:block;width:78px;height:128px;margin:6px 10px}
.tarot-stack-card{position:absolute;inset:0;transition:transform .25s}
.tarot-stack-card:nth-child(2){transform:translate(3px,-3px)}
.tarot-stack-card:nth-child(3){transform:translate(6px,-6px)}
.tarot-stack-card:nth-child(4){transform:translate(9px,-9px)}
.tarot-stack-card:nth-child(5){transform:translate(12px,-12px)}
.tarot-stack.is-ready{cursor:pointer;animation:tarotPulse 1.8s ease-in-out infinite}
.tarot-stack.is-ready:hover .tarot-stack-card:nth-child(n+2){transform:translate(calc(var(--n,1)*4px),calc(var(--n,1)*-4px))}
.tarot-stack.is-ready:focus-visible{outline:2px solid var(--gold);outline-offset:6px;border-radius:8px}
@keyframes tarotPulse{0%,100%{filter:drop-shadow(0 0 0 rgba(227,190,98,0))}50%{filter:drop-shadow(0 0 14px rgba(227,190,98,.6))}}
.tarot-stack.is-shuffling .tarot-stack-card:nth-child(odd){animation:tarotRiffleL .5s ease-in-out infinite}
.tarot-stack.is-shuffling .tarot-stack-card:nth-child(even){animation:tarotRiffleR .5s ease-in-out infinite}
@keyframes tarotRiffleL{0%,100%{transform:translateX(0) rotate(0)}50%{transform:translateX(-34px) rotate(-8deg)}}
@keyframes tarotRiffleR{0%,100%{transform:translateX(0) rotate(0)}50%{transform:translateX(34px) rotate(8deg)}}
.tarot-aside{width:66px;height:106px;position:relative}
.tarot-aside::after{content:'\2713';position:absolute;inset:0;display:grid;place-items:center;font-size:26px;color:var(--gold);background:rgba(5,13,24,.55);border-radius:6px}
/* geniş, kaydırılabilir yelpaze */
.tarot-fan-wrap{width:100%;position:relative}
.tarot-fan{display:flex;width:100%;overflow-x:auto;overflow-y:hidden;padding:34px 24px 12px;-webkit-overflow-scrolling:touch;touch-action:pan-x;scrollbar-width:thin;scrollbar-color:var(--gold-dim) transparent;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 26px,#000 calc(100% - 26px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 26px,#000 calc(100% - 26px),transparent 100%)}
.tarot-fan-card{all:unset;flex:0 0 auto;box-sizing:border-box;width:84px;height:138px;margin-left:-38px;cursor:pointer;
  background:#10304a url('assets/card-back-tarot.jpg') center/cover;border-radius:7px;box-shadow:-3px 0 8px rgba(0,0,0,.5),0 0 0 1px var(--gold-dim);transition:transform .2s,box-shadow .2s;animation:tarotIn .4s both}
.tarot-fan-card:first-child{margin-left:0}
.tarot-fan-card.is-lifted{transform:translateY(-26px);z-index:8;box-shadow:0 0 0 2px var(--gold),0 0 20px rgba(227,190,98,.55)}
.tarot-fan-card:focus-visible{outline:2px solid var(--gold);z-index:8}
.tarot-fan-card.is-picked{transform:translateY(-40px) scale(1.1);z-index:9;box-shadow:0 0 24px var(--gold)}
.tarot-fan-hint{margin:2px 0 0;text-align:center;font-size:11px;letter-spacing:.14em;color:var(--cream-dim)}
@keyframes tarotIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.tarot-row-body{min-height:150px}
/* açılış: seçilen üç kart */
.tarot-reveal{display:flex;justify-content:center;gap:clamp(10px,3vw,28px);margin:6px 0 22px}
.tarot-reveal-slot{display:flex;flex-direction:column;align-items:center;gap:8px;width:clamp(92px,27vw,180px)}
.tarot-slot-label{margin:0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.tarot-card{position:relative;display:block;width:100%;aspect-ratio:300/490;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.3,.7,.3,1);perspective:900px}
.tarot-card.is-flipped{transform:rotateY(180deg)}
.tarot-face{position:absolute;inset:0;border-radius:8px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.tarot-front{transform:rotateY(180deg);border:2px solid var(--gold);background:#10304a;box-shadow:0 0 22px rgba(227,190,98,.25)}
.tarot-front img{width:100%;height:100%;object-fit:cover;display:block}
.tarot-cap{position:absolute;left:0;right:0;bottom:0;padding:5px 4px;text-align:center;font-family:var(--font-display);font-size:clamp(11px,2.5vw,14px);color:var(--cream);background:linear-gradient(0deg,rgba(5,13,24,.92),rgba(5,13,24,.6))}
@media (prefers-reduced-motion:reduce){.tarot-card{transition:none}.tarot-stack.is-ready{animation:none}.tarot-fan-card{animation:none}}
body.theme-tarot .starfield{background-color:transparent}
body.theme-tarot .site-header{background:#07162a;border-bottom-color:#14405a}

.tarot-follow{margin-top:20px;justify-content:center}
.chip-advice{border-color:var(--gold);color:var(--gold)}
.tarot-more{display:flex;flex-direction:column;align-items:center}
.tarot-block{width:100%;margin-top:22px;padding-top:18px;border-top:1px solid rgba(227,190,98,.25)}
.tarot-block-title{margin:0 0 10px;font-family:var(--font-display);font-size:16px;font-weight:600;color:var(--gold)}
.tarot-advice-slot{margin-top:24px}

/* ===== Falcıyla sohbet ===== */
.chat-box{margin-top:26px;padding:16px 16px 14px;border:1px solid var(--night-3);border-radius:12px;background:rgba(0,0,0,.18)}
.chat-title{margin:0 0 4px;font-family:var(--font-display);font-size:17px;color:var(--gold)}
.chat-hint{margin:0 0 12px;font-size:12px;color:var(--cream-dim)}
.chat-log{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}
.chat-msg{max-width:88%;padding:10px 13px;border-radius:12px;font-size:15px;line-height:1.6;white-space:pre-wrap}
.chat-user{align-self:flex-end;background:var(--night-3);color:var(--cream);border-bottom-right-radius:4px}
.chat-bot{align-self:flex-start;background:rgba(227,190,98,.1);border:1px solid rgba(227,190,98,.25);font-family:var(--font-display);border-bottom-left-radius:4px}
.chat-bot.is-loading{color:var(--cream-dim);font-style:italic}
.chat-bot.is-error{color:var(--rose);font-family:var(--font-body);font-size:14px}
.chat-form{display:flex;gap:8px;align-items:flex-end}
.chat-input{flex:1;resize:none;padding:10px 12px;border-radius:10px;border:1px solid var(--night-3);background:var(--night-1);color:var(--cream);font:inherit;font-size:15px}
.chat-input:focus{outline:2px solid var(--gold);outline-offset:1px}
.chat-send{padding:10px 16px}

/* ===== Kelt Haçı ===== */
.kelt-step{max-width:560px;margin:0 auto}
.kelt-q{margin:18px 0 8px;font-family:var(--font-display);font-size:18px;color:var(--cream)}
.kelt-sub{margin:16px 0 8px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.kelt-note{margin:6px 0 14px;font-size:13px;color:var(--cream-dim)}
.kelt-question{width:100%;box-sizing:border-box;font-size:15px}
.kelt-opts{justify-content:flex-start;margin:0}
.kelt-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.kelt-opt{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;padding:10px 12px;border-radius:10px;font-size:14px}
.kelt-opt b{font-family:var(--font-display);font-size:16px;color:var(--gold)}
.kelt-opt span{font-size:12px;color:var(--cream-dim);line-height:1.4}
.kelt-opt.is-on,.chip.is-on{border-color:var(--gold);background:rgba(227,190,98,.16)}
.kelt-opt.is-on b{color:var(--cream)}
.kelt-sig{display:flex;justify-content:center;margin:8px 0}
.kelt-sig .tarot-card{width:clamp(110px,34vw,150px)}
.kelt-ritual{display:flex;justify-content:center;margin:20px 0 8px;min-height:150px}
.kelt-stagewrap{display:flex;flex-direction:column;align-items:center}
.kelt-stage{position:relative;margin:6px auto}
.kc{position:absolute;transition:left .75s cubic-bezier(.3,.7,.3,1),top .75s cubic-bezier(.3,.7,.3,1),transform .75s}
.kc .tarot-card{width:100%;height:100%;aspect-ratio:auto;cursor:pointer}
.kc .tarot-back{background:#10304a url('assets/card-back-tarot.jpg') center/cover;box-shadow:0 0 0 1px var(--gold-dim)}
.kc .kc-no{position:absolute;top:-8px;left:-8px;width:20px;height:20px;border-radius:50%;background:var(--gold);color:var(--night-0);font:700 11px var(--font-body);display:grid;place-items:center;z-index:5;opacity:0;transition:opacity .4s}
.kc.is-placed .kc-no{opacity:1}
.kc.is-sig{z-index:1}
.kc.is-focus .tarot-front{box-shadow:0 0 0 2px #fff,0 0 22px var(--gold)}
.kelt-caption{min-height:3.2em;margin:10px 0 0;text-align:center;font-size:14px;color:var(--cream);max-width:420px}
.kelt-caption b{color:var(--gold);font-family:var(--font-display)}
.kelt-caption small{display:block;color:var(--cream-dim);font-size:12px}
.kelt-block{margin-top:22px;padding-top:16px;border-top:1px solid rgba(227,190,98,.25)}
.kelt-retry{margin-top:8px}
.kelt-zoom{position:fixed;inset:0;z-index:100;background:rgba(3,8,16,.88);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:20px;cursor:pointer}
.kelt-zoom img{max-height:68vh;max-width:90vw;border-radius:10px;border:2px solid var(--gold)}
.kelt-zoom p{margin:0;color:var(--cream);text-align:center;max-width:420px}
.kelt-restart{margin-top:18px;justify-content:center}
@media (max-width:480px){.kelt-grid{grid-template-columns:1fr}}
.kelt-step .controls{margin-top:18px}

/* karakter sayacı */
.chat-field{flex:1;min-width:0}
.chat-field .chat-input{width:100%;box-sizing:border-box}
.char-count{margin:3px 4px 0;text-align:right;font-size:11px;color:var(--cream-dim);transition:color .2s}
.char-count.is-near{color:var(--gold)}
.char-count.is-max{color:#ff9d8a}

/* Kelt: geniş ekranda dolgun deste ve üç ayrı karıştırma hareketi (telefona dokunmaz) */
@media (min-width:900px) and (hover:hover){
  .kelt-ritual{min-height:340px;align-items:center}
  .kelt-ritual .tarot-stack.is-big{width:132px;height:216px;margin:50px 120px}
  .kelt-ritual .tarot-stack.is-big .tarot-stack-card{transform:translate(calc(var(--i,0)*1.4px),calc(var(--i,0)*-1.4px));transform-origin:50% 115%}
  .kelt-ritual .tarot-stack.is-big.is-shuffling{animation:kdGlow 2s ease-in-out}
  .kelt-ritual .tarot-stack.is-big.is-shuffling .tarot-stack-card{animation:none}
  /* 1. karıştırma: iki yarı ayrılıp iç içe geçer */
  .kelt-ritual .tarot-stack.is-big[data-step="1"].is-shuffling .tarot-stack-card:nth-child(odd){animation:kdRiffleL 1.9s ease-in-out both;animation-delay:calc(var(--i)*25ms)}
  .kelt-ritual .tarot-stack.is-big[data-step="1"].is-shuffling .tarot-stack-card:nth-child(even){animation:kdRiffleR 1.9s ease-in-out both;animation-delay:calc(var(--i)*25ms)}
  /* 2. karıştırma: deste kesilir */
  .kelt-ritual .tarot-stack.is-big[data-step="2"].is-shuffling .tarot-stack-card:nth-child(n+8){animation:kdCutTop 1.9s ease-in-out both}
  .kelt-ritual .tarot-stack.is-big[data-step="2"].is-shuffling .tarot-stack-card:nth-child(-n+7){animation:kdCutBottom 1.9s ease-in-out both}
  /* 3. karıştırma: yelpaze açılır, toplanır */
  .kelt-ritual .tarot-stack.is-big[data-step="3"].is-shuffling .tarot-stack-card{animation:kdFan 2s cubic-bezier(.5,0,.3,1) both;animation-delay:calc(var(--i)*18ms)}
}
@keyframes kdRiffleL{0%,100%{translate:0 0;rotate:0deg}30%{translate:-120px -10px;rotate:-16deg}62%{translate:-14px -4px;rotate:-2deg}80%{translate:6px 0;rotate:0deg}}
@keyframes kdRiffleR{0%,100%{translate:0 0;rotate:0deg}30%{translate:120px -10px;rotate:16deg}62%{translate:14px -4px;rotate:2deg}80%{translate:-6px 0;rotate:0deg}}
@keyframes kdCutTop{0%,100%{translate:0 0;rotate:0deg}30%{translate:0 -90px;rotate:0deg}55%{translate:-110px -90px;rotate:-6deg}80%{translate:-110px 0;rotate:-3deg}92%{translate:-20px 0}}
@keyframes kdCutBottom{0%,100%{translate:0 0}55%{translate:70px 0}80%{translate:70px 0}92%{translate:20px 0}}
@keyframes kdFan{0%,100%{rotate:0deg;translate:0 0}40%,62%{rotate:calc((var(--i) - 6.5)*9deg);translate:0 -14px}}
@keyframes kdGlow{0%,100%{filter:drop-shadow(0 0 0 rgba(227,190,98,0))}50%{filter:drop-shadow(0 0 30px rgba(227,190,98,.75))}}

/* Karıştırma ritüeli kullanıcının kendi dokunuşuyla başlar; sistemde "animasyonları azalt" açık olsa bile görünsün (sert hareketler yumuşatılmış hâlde) */
@media (prefers-reduced-motion:reduce){
  .tarot-stack.is-shuffling .tarot-stack-card{animation-duration:.5s !important;animation-iteration-count:infinite !important}
}
@media (prefers-reduced-motion:reduce) and (min-width:900px) and (hover:hover){
  .kelt-ritual .tarot-stack.is-big.is-shuffling .tarot-stack-card{animation-duration:1.9s !important;animation-iteration-count:1 !important}
  .kelt-ritual .tarot-stack.is-big.is-shuffling{animation-duration:2s !important}
}
/* geniş ekranda fare üstündeyken deste büzülmesin */
@media (min-width:900px) and (hover:hover){
  .kelt-ritual .tarot-stack.is-big.is-ready:hover .tarot-stack-card:nth-child(n+2){transform:translate(calc(var(--i,0)*1.4px),calc(var(--i,0)*-1.4px))}
  .kelt-ritual .tarot-stack.is-big.is-ready:hover{transform:translateY(-4px)}
}

/* Kelt merkezi: gösterge ve çapraz kartta isim şeridi gizli (adlar büyütmede ve açıklamada) */
.kc.kc-nocap .tarot-cap{display:none}
.kc.is-sig .tarot-front{box-shadow:0 0 0 2px var(--gold-dim)}
.kc .kc-no:empty{display:none}