/* EŞİK — Arc 7 / 4–25 ekleri (Claude, 2026-10-19). static-reader.css bütün animasyonları
 * kapattığı için buradaki animasyonlar !important ile yazılır. */
:root{--ek-echo:#7fa8c9;--ek-gold:#c99a3b;--ek-blood:#8f0d18}
.night{--ek-echo:#a9cff0;--ek-gold:#f0c46a}

/* Kapak: veri yüklenene kadar düğmeler bekler */
body:not([data-ready]) .coveractions button{opacity:.5;pointer-events:none}
body:not([data-ready]) #start::after{content:' · hazırlanıyor';font-size:.72em;letter-spacing:.5px;opacity:.8}

/* Katman */
#ekFx{position:fixed;inset:0;z-index:41;pointer-events:none}
#ekFx>.ekCanvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}
#ekFx>.ekStage{z-index:2}#ekFx>.ekFlash,#ekFx>.ekBloom,#ekFx>.ekCrimson,#ekFx>.ekWound{z-index:4}#ekFx>.ekGrey{z-index:1}
#ekFx .ekFlash,#ekFx .ekBloom,#ekFx .ekCrimson,#ekFx .ekWound,#ekFx .ekGrey{position:absolute;inset:0;pointer-events:none;opacity:0}
#ekFx .ekGrey{transition:opacity .9s ease!important;backdrop-filter:grayscale(1) contrast(1.08) brightness(.9);-webkit-backdrop-filter:grayscale(1) contrast(1.08) brightness(.9)}
html.ekStill #ekFx .ekGrey{opacity:1}
#ekFx .ekBloom{backdrop-filter:saturate(1.9) brightness(1.12);-webkit-backdrop-filter:saturate(1.9) brightness(1.12);background:radial-gradient(ellipse at 50% 50%,#fff3,transparent 70%)}
#ekFx .ekCrimson{background:radial-gradient(ellipse 70% 60% at 50% 55%,transparent 30%,#7a001055 65%,#3d0008cc 100%),radial-gradient(circle at 50% 40%,#ff3b3b22,transparent 40%)}
#ekFx .ekWound{background:linear-gradient(90deg,#8f0d1899,transparent 38%)}
html.ekStill .flow{transition:filter .9s!important}

/* Yeniden oynat bağlantısı */
.flow .ekReplay{display:block;margin:4px 0 16px;font:500 10px Ui,sans-serif;letter-spacing:.8px;color:var(--orange);background:none;border:0;padding:4px 0;cursor:pointer;opacity:.75}
.flow .ekReplay:hover,.flow .ekReplay:focus-visible{opacity:1;text-decoration:underline}

/* Yankı */
.flow .ekEchoTarget{position:relative}
.flow .ekEchoMark{display:inline-block;font:600 9px/1 Ui,sans-serif;letter-spacing:.6px;color:var(--ek-echo);border:1px solid currentColor;border-radius:9px;padding:2px 6px 2px 5px;margin-left:2px;vertical-align:.25em;cursor:pointer;opacity:.7;white-space:nowrap;text-indent:0}
.flow .ekEchoMark:hover,.flow .ekEchoMark:focus-visible{opacity:1;outline:none;background:color-mix(in srgb,var(--ek-echo) 14%,transparent)}
/* Yankı: önceki döngünün sözü üstüne kopya olarak yazılmaz (iki kez görünüyor gibi duruyordu); satır bir an sarsılıp tanıdık bir ışıkla yanar */
.flow .ekEchoTarget.ekEchoPlay::after{content:none!important}
.flow .ekEchoTarget.ekEchoPlay{animation:ekEchoGlow 2.4s ease-out,ekDeja .5s steps(5) 1!important}
@keyframes ekDeja{0%{transform:translateX(-3px);filter:blur(.8px)}40%{transform:translateX(2px);filter:none}70%{transform:translateX(-1px)}100%{transform:none}}
@keyframes ekGhost{0%{opacity:.85;transform:translate(-14px,-4px);filter:blur(2px)}35%{opacity:.6;transform:translate(3px,1px);filter:blur(.6px)}70%{opacity:.25;transform:translate(0,0);filter:blur(0)}100%{opacity:0;transform:none}}
@keyframes ekEchoGlow{0%{text-shadow:0 0 0 transparent}30%{text-shadow:0 0 14px color-mix(in srgb,var(--ek-echo) 70%,transparent)}100%{text-shadow:0 0 0 transparent}}
@media (prefers-reduced-motion:reduce){.flow .ekEchoTarget.ekEchoPlay::after{animation:none!important;content:none}.flow .ekEchoTarget.ekEchoPlay{animation:none!important}}

/* Sözlük terimi */
.flow .ekTerm{border-bottom:1px dotted color-mix(in srgb,var(--orange) 70%,transparent);cursor:help;border-radius:1px}
.flow .ekTerm:hover,.flow .ekTerm:focus-visible,.flow .ekTerm[aria-expanded=true]{outline:none;background:color-mix(in srgb,var(--orange) 14%,transparent)}
.ekPop .ekPopTitle{display:block;font:400 19px/1.2 Georgia,serif;margin:0 0 6px;color:var(--ink)}
.ekPop .ekPopLead{color:var(--muted);margin-bottom:8px}
.ekPop .ekPopQuote{margin:0 0 10px;padding:8px 0 8px 12px;border-left:2px solid var(--ek-echo);font:400 13px/1.6 Georgia,serif;color:var(--ink)}
.ekPop .ekPopQuote cite{display:block;margin-top:6px;font:500 8px Ui,sans-serif;letter-spacing:1px;color:var(--muted);font-style:normal}
.ekPop .ekPopLink{margin-top:10px;font:500 11px Ui,sans-serif;color:var(--orange);background:none;border:0;border-bottom:1px solid var(--orange);padding:3px 0;cursor:pointer}
.ekTocGlossary{display:inline-block;margin:0 0 18px;font:500 12px Ui,sans-serif;color:var(--orange);background:none;border:0;border-bottom:1px solid var(--orange);padding:6px 0;cursor:pointer}
.ekGlossary{max-width:720px}
.ekGlossary .ekGlossarySearch{width:100%;box-sizing:border-box;font:400 14px Ui,sans-serif;padding:10px 12px;margin:4px 0 20px;background:var(--canvas);color:var(--ink);border:1px solid var(--hair)}
.ekGlossaryItem{padding:16px 0;border-top:1px solid var(--hair)}
.ekGlossaryItem h3{font:400 21px/1.2 Georgia,serif;margin:0 0 6px}
.ekGlossaryItem p{margin:0 0 8px!important;font-size:13px!important;color:var(--ink)!important;line-height:1.7!important}
.ekGlossaryMeta{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.ekGlossaryMeta small{font:500 9px Ui,sans-serif;letter-spacing:1px;color:var(--muted);text-transform:uppercase}
.ekGlossaryMeta button{font:500 11px Ui,sans-serif;color:var(--orange);background:none;border:0;border-bottom:1px solid var(--orange);padding:2px 0;cursor:pointer}
.ekGlossaryEmpty{font-size:12px!important}

/* Söyleyemezsin */
.flow .ekCut{animation:ekCut 1.1s steps(1,end)!important}
@keyframes ekCut{0%{clip-path:inset(0 0 0 0);transform:none}12%{clip-path:inset(0 38% 0 0);transform:translateX(2px)}22%{clip-path:inset(0 0 0 0);transform:translateX(-3px);filter:blur(.6px)}34%{clip-path:inset(0 55% 0 0);transform:none}52%{clip-path:inset(0 0 0 0);filter:none}100%{clip-path:none}}
#ekFx .ekWhisper{display:grid;place-items:center}
#ekFx .ekWhisperText{font:italic 400 clamp(34px,7vw,88px)/1 Georgia,serif;letter-spacing:2px;color:#f2e9ea;text-shadow:0 0 22px #000,0 0 46px #000;opacity:0;animation:ekWhisper 3.4s ease-in-out forwards!important}
@keyframes ekWhisper{0%{opacity:0;filter:blur(8px);transform:scale(1.06)}30%{opacity:.5;filter:blur(1px)}55%{opacity:.42;transform:scale(1) translateX(2px)}62%{transform:translateX(-2px)}100%{opacity:0;filter:blur(10px);transform:scale(.97)}}

/* Altın mürekkep (Vincent Abellux) */

/* Sessiz an */
.flow .ekHush{animation:ekHush 3.2s ease-out!important}
@keyframes ekHush{0%{letter-spacing:0;text-shadow:none}25%{letter-spacing:.4px;text-shadow:0 0 18px color-mix(in srgb,var(--ink) 35%,transparent)}100%{letter-spacing:0;text-shadow:none}}
@media (prefers-reduced-motion:reduce){.flow .ekHush,.flow .ekCut{animation:none!important}}

/* Sahne kartları */
#ekFx .ekStage{position:absolute;inset:0;pointer-events:auto;cursor:pointer;overflow:hidden;animation:ekIn .5s ease-out both!important}
#ekFx .ekStage.ekLeaving{animation:ekOut .8s ease-in forwards!important}
@keyframes ekIn{from{opacity:0}to{opacity:1}}
@keyframes ekOut{from{opacity:1}to{opacity:0}}
#ekFx .ekStar{position:absolute;left:50%;top:50%;margin:0;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:14px}
#ekFx .ekStar img{height:min(70vh,640px);max-width:86vw;object-fit:contain;filter:drop-shadow(0 18px 40px #000a)}
#ekFx .ekStar figcaption{text-align:center;color:#f4ecdf;text-shadow:0 2px 14px #000}
#ekFx .ekStar figcaption small{display:block;font:500 9px Ui,sans-serif;letter-spacing:3px;color:#e9c98d}
#ekFx .ekStar figcaption strong{display:block;font:400 clamp(28px,4.6vw,52px)/1.1 Georgia,serif;letter-spacing:.5px;margin-top:6px}
/* Perde: Natsumi Schwarz */
#ekFx .ekCurtain{background:radial-gradient(ellipse 45% 60% at 50% 45%,#2a1a14ee,#0a0605f5 75%)}
#ekFx .ekCurtain .ekStar{animation:ekStar 6.2s ease-out both!important}
@keyframes ekStar{0%,22%{opacity:0;transform:translate(-50%,-46%) scale(.96)}36%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:1;transform:translate(-50%,-50%) scale(1.02)}}
#ekFx .ekDrape{position:absolute;top:0;bottom:0;width:52%;background:repeating-linear-gradient(90deg,#4a0710 0 3%,#7c1020 6%,#a31a2c 8%,#6a0c19 11%,#4a0710 14%),#5a0a14;box-shadow:inset 0 -60px 80px #0008,0 0 40px #000a}
#ekFx .ekDrape::after{content:'';position:absolute;left:0;right:0;bottom:0;height:12px;background:repeating-linear-gradient(90deg,#c99a3b 0 6px,#8a6420 6px 10px)}
#ekFx .ekDrapeL{left:0;transform-origin:0 0;animation:ekDrapeL 6.2s cubic-bezier(.6,0,.2,1) both!important}
#ekFx .ekDrapeR{right:0;transform-origin:100% 0;animation:ekDrapeR 6.2s cubic-bezier(.6,0,.2,1) both!important}
@keyframes ekDrapeL{0%{transform:translateX(-100%)}10%,20%{transform:translateX(0)}42%,100%{transform:translateX(-88%) skewX(4deg)}}
@keyframes ekDrapeR{0%{transform:translateX(100%)}10%,20%{transform:translateX(0)}42%,100%{transform:translateX(88%) skewX(-4deg)}}
#ekFx .ekValance{position:absolute;left:-2%;right:-2%;top:0;height:9vh;background:radial-gradient(ellipse 8% 100% at 50% 0,#a31a2c 60%,transparent 62%) 0 0/12.5% 100%,linear-gradient(#5a0a14,#7c1020);box-shadow:0 8px 24px #000b;border-bottom:3px solid #c99a3b}
/* Spot: Bianca */
#ekFx .ekSpot{background:#000c}
#ekFx .ekSpotLight{position:absolute;left:50%;top:-10%;width:min(70vw,640px);height:120%;transform:translateX(-50%);background:radial-gradient(ellipse 50% 60% at 50% 62%,#fff4dc33,transparent 70%),conic-gradient(from 168deg at 50% 0%,transparent 0deg,#fff2d814 6deg,#fff2d81c 12deg,#fff2d814 18deg,transparent 24deg);mix-blend-mode:screen;animation:ekSpot 6s ease-out both!important}
@keyframes ekSpot{0%{opacity:0;transform:translateX(-50%) translateY(-6%)}25%{opacity:1;transform:translateX(-50%)}100%{opacity:1}}
#ekFx .ekSpot .ekStar{animation:ekStar2 6s ease-out both!important}
@keyframes ekStar2{0%,18%{opacity:0;filter:brightness(2) blur(4px)}40%{opacity:1;filter:none}100%{opacity:1}}
/* Mühür */
#ekFx .ekSeal{display:grid;place-items:center;background:radial-gradient(ellipse at 50% 46%,#000000e0,#000000f4 78%);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
#ekFx .ekSealWrap{display:flex;flex-direction:column;align-items:center;gap:18px;margin-top:-4vh}
#ekFx .ekSealImg,#ekFx .ekSealFallback{width:min(44vh,340px,70vw);height:min(44vh,340px,70vw);object-fit:contain;filter:drop-shadow(0 16px 30px #000c)}
#ekFx .ekSealFallback{border-radius:50%;background:radial-gradient(circle at 40% 35%,#c2283a,#7a0d18 55%,#4a0610);box-shadow:inset 0 0 0 10px #0002,inset 0 0 40px #0006}
#ekFx .ekSealCap{text-align:center;color:#f1e5d2;text-shadow:0 2px 12px #000;animation:ekCap 5.2s ease-out both!important}
#ekFx .ekSealCap small{display:block;font:500 9px Ui,sans-serif;letter-spacing:3px;color:#e3b36a}
#ekFx .ekSealCap strong{display:block;font:400 clamp(24px,3.6vw,40px)/1.15 Georgia,serif;margin-top:8px}
@keyframes ekCap{0%,12%{opacity:0;transform:translateY(8px)}24%,100%{opacity:1;transform:none}}
/* Bayrak */
#ekFx .ekFlag{display:grid;place-items:start center;padding-top:12vh;background:linear-gradient(#05070cf0,#05070ccc 55%,#05070c55)}
#ekFx .ekFlagCanvas{display:block;transform-origin:0 50%;filter:drop-shadow(0 10px 22px #000a)}
#ekFx .ekFlagImg{width:min(82vw,620px)}
@media (prefers-reduced-motion:reduce){#ekFx .ekStage,#ekFx .ekStage *{animation-duration:.01s!important}#ekFx .ekStage{animation:ekIn .3s both!important}#ekFx .ekDrape,#ekFx .ekValance,#ekFx .ekSpotLight{display:none}}

/* Guaral krokisi: açıldığında parşömen gibi serilir */
.flow .ekPlanPlate img{transform-origin:50% 0}
.flow .ekPlanPlate.ekUnroll img{animation:ekUnroll 1.4s cubic-bezier(.2,.7,.2,1) both!important}
@keyframes ekUnroll{0%{clip-path:inset(0 0 100% 0);transform:perspective(900px) rotateX(18deg)}70%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 0 0 0);transform:none}}

/* Özel sahneler: sahne oynamadan kapının ötesi görünmez */
.flow .ekGated{visibility:hidden!important}
.flow .ekGateReveal{animation:ekGateIn 1.1s ease-out both!important}
@keyframes ekGateIn{from{opacity:0;filter:blur(2px)}to{opacity:1;filter:none}}
/* Vincent Abellux: altın mürekkep (kalıcı) */
.flow .ekGoldInk{background:linear-gradient(100deg,#a8741f 0%,#e9c46a 30%,#fff1c2 46%,#d9a441 62%,#a8741f 100%);background-size:220% 100%;background-position:0 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#c9963a}
html:not(.night) .flow .ekGoldInk{background-image:linear-gradient(100deg,#7a520f 0%,#b5832a 35%,#d9a441 50%,#9a6a1a 70%,#7a520f 100%)}
.flow .ekGoldInk.ekGold{animation:ekGoldSweep 2.6s ease-out forwards!important}
@keyframes ekGoldSweep{from{background-position:100% 0;filter:drop-shadow(0 0 0 transparent)}40%{filter:drop-shadow(0 0 6px #f0c46a88)}to{background-position:0 0;filter:none}}
@media (prefers-reduced-motion:reduce){.flow .ekGateReveal,.flow .ekGoldInk.ekGold{animation:none!important}}
/* Cadı'nın elleri (tabu anı): üstten iner, kalbi kavrar; yazının üst yarısında durur */
#ekFx>.ekHands{position:absolute;left:50%;top:0;height:min(46vh,500px);aspect-ratio:2400/1300;z-index:3;pointer-events:none;
 transform:translate(-50%,var(--hy,-62%)) scale(var(--hs,1));transform-origin:50% 0;
 -webkit-mask-image:linear-gradient(180deg,#000 55%,transparent 100%);mask-image:linear-gradient(180deg,#000 55%,transparent 100%);filter:drop-shadow(0 8px 30px rgba(60,10,90,.55))}
#ekFx>.ekHands img{width:100%;height:100%;display:block}
@media(max-width:700px){#ekFx>.ekHands{height:34vh}}

/* Fısıltı: satırın kendisi (ayrı yazı yok) — dumandan belirir, harfler açılır, titrer, kızıl-mor bir hale ile kalır */
.flow .ekWhisperRow{transform-origin:0 50%;animation:ekWhisperRow 3.4s cubic-bezier(.3,.1,.3,1) both!important}
.flow .ekWhisperRow.done{animation:none!important;color:#eadff4;text-shadow:0 0 10px rgba(120,40,160,.55),0 0 1px rgba(255,255,255,.6)}
html:not(.night) .flow .ekWhisperRow.done{color:#3a1f4a;text-shadow:0 0 8px rgba(120,40,160,.3)}
@keyframes ekWhisperRow{0%{opacity:.15;filter:blur(7px);letter-spacing:.32em;transform:scale(1.18);text-shadow:0 0 34px rgba(110,20,140,.9)}
 30%{opacity:1;filter:blur(0);letter-spacing:.14em;transform:scale(1.22);color:#f6eefb;text-shadow:0 0 18px rgba(130,40,170,.95),0 0 2px #fff}
 52%{transform:scale(1.22) translateX(1.5px)}56%{transform:scale(1.22) translateX(-1.5px)}60%{transform:scale(1.22)}
 100%{opacity:1;letter-spacing:normal;transform:none;color:#eadff4;text-shadow:0 0 10px rgba(120,40,160,.55),0 0 1px rgba(255,255,255,.6)}}
@media (prefers-reduced-motion:reduce){.flow .ekWhisperRow{animation:none!important}}