/* Makarya — Hayat Zarı */
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
:root{
  --bg:#11100e; --paper:#f4ead7; --card:#fbf6ea; --card-2:#f8efd9;
  --ink:#1d1915; --muted:#6c5f4d; --line:#d8c9ad;
  --red:#a52f26; --red-dark:#7f231d; --green:#2b7a4f; --gold:#9a6d16;
  --good-bg:#e6f1e1; --bad-bg:#f6e4df;
  --serif:Georgia,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15px}
body{display:flex;justify-content:center}
button{font:inherit;color:inherit;cursor:pointer}
button:disabled{cursor:default}
#app{width:100%;max-width:480px;height:100dvh;overflow:hidden;background:var(--paper);box-shadow:0 0 50px rgba(0,0,0,.5);position:relative}
.screen{height:100%;display:flex;flex-direction:column;overflow:hidden}

/* Üst çubuk */
.topbar{flex:0 0 52px;background:#0f0f0f;color:#fff;display:grid;grid-template-columns:40px 1fr 40px;align-items:center;padding:0 10px;gap:6px}
.brandWord{font-family:var(--serif);font-size:17px;font-weight:800;text-align:center;letter-spacing:.3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topBtn{width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);color:#fff;font-size:17px;font-weight:900;display:grid;place-items:center}
.progress{height:3px;background:#2a2622;flex:0 0 3px}
.progress i{display:block;height:100%;background:var(--gold);transition:width .4s}

/* Sahne görseli */
.art{position:relative;flex:0 0 36%;overflow:hidden;
  background:radial-gradient(circle at 50% 38%,#f6d9a4 0,#d9a25f 45%,#7a4a2a 100%)}
.art.tall{flex-basis:46%}
.artIcon{position:absolute;inset:0;display:grid;place-items:center;font-size:84px;padding-bottom:40px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.25))}
.artImg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 35%}
.art:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.72) 100%);pointer-events:none}
.artCaption{position:absolute;z-index:2;left:16px;right:16px;bottom:12px;color:#fff;text-shadow:0 2px 6px rgba(0,0,0,.6)}
.artMeta{display:inline-block;font-size:11px;font-weight:900;letter-spacing:.7px;text-transform:uppercase;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:4px 9px;margin-bottom:6px}
.artCaption h1{margin:0 0 4px;font-family:var(--serif);font-size:28px;line-height:1.05}
.artCaption p{margin:0;font-size:14.5px;line-height:1.35}

/* Panel */
.panel{flex:1;min-height:0;overflow:auto;padding:14px 14px calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px}
.sectionTitle{font-family:var(--serif);font-size:22px;font-weight:900;text-align:center;margin:2px 0 0}
.sectionSub{font-size:13.5px;color:var(--muted);text-align:center;line-height:1.4}
.muted{font-size:12.5px;color:var(--muted);text-align:center;line-height:1.35}
.primary,.secondary{min-height:50px;border-radius:12px;padding:12px 14px;font-weight:900;font-size:15px;letter-spacing:.3px}
.primary{border:0;background:var(--red);color:#fff;box-shadow:0 3px 0 var(--red-dark)}
.primary:active{transform:translateY(2px);box-shadow:0 1px 0 var(--red-dark)}
.secondary{border:1px solid var(--line);background:var(--card)}
.row{display:flex;gap:10px}.row>*{flex:1}

/* Başlangıç */
.genderRow{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.genderBtn{border:0;border-radius:14px;min-height:74px;color:#fff;font-weight:900;font-size:17px;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 3px 0 rgba(0,0,0,.25)}
.genderBtn.kiz{background:#a8433a}.genderBtn.erkek{background:#26405e}
.genderBtn span{font-size:26px}
.genderBtn.soon{opacity:.55;position:relative;cursor:default}
.genderBtn em{position:absolute;top:6px;right:8px;font-style:normal;font-size:10.5px;letter-spacing:.6px;background:rgba(0,0,0,.35);border-radius:999px;padding:2px 7px;text-transform:uppercase}
.saveCard{border:1px solid #d7c08b;background:#f7edd3;border-radius:12px;padding:10px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.saveCard b{font-size:14px}.saveCard small{display:block;color:var(--muted);font-size:12.5px;margin-top:2px}
.saveCard button{border:0;background:var(--ink);color:#fff;border-radius:10px;padding:10px 12px;font-weight:900;font-size:13px}

/* Aile */
.familyGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.familyMini{border:1px solid var(--line);background:var(--card);border-radius:12px;padding:9px 10px;font-size:12.5px;line-height:1.3;color:var(--muted);transition:.12s}
.familyMini b{display:block;font-size:15px;color:var(--ink);font-family:var(--serif);margin-bottom:2px}
.familyMini.hot{background:#1d1915;color:#e9dcc3;border-color:#1d1915;transform:scale(1.03)}
.familyMini.hot b{color:#fff}
.statGrid{display:grid;grid-template-columns:1fr 1fr;gap:4px 14px}
.statCard{border-bottom:1px solid var(--line);padding:7px 2px;font-size:14px;display:flex;justify-content:space-between;align-items:center}
.delta{font-size:12px;font-weight:900;margin-left:4px}.delta.pos{color:var(--green)}.delta.neg{color:var(--red)}
.idCard{border:1px solid #dcc99f;background:linear-gradient(135deg,#fff8e9,#f1dfbb);border-radius:14px;padding:11px 12px}
.idTitle{font-size:11.5px;font-weight:900;letter-spacing:.9px;color:var(--gold);margin-bottom:7px}
.famTrait{display:flex;justify-content:space-between;gap:10px;border-radius:9px;padding:8px 9px;font-size:13.5px;font-weight:800;margin-top:5px}
.famTrait.good{background:var(--good-bg);color:#2c6945}.famTrait.bad{background:var(--bad-bg);color:#8a3028}
.famTrait small{display:block;font-size:12px;font-weight:600;opacity:.9;margin-top:2px}

/* Olay */
.recall{border-left:3px solid var(--gold);background:var(--card-2);border-radius:0 10px 10px 0;padding:8px 10px;font-size:13.5px;line-height:1.35;font-style:italic;color:#4c3f2e}
.recall b{font-style:normal;color:var(--gold);font-size:11.5px;letter-spacing:.8px;display:block;margin-bottom:2px}
.famLine{font-size:13px;color:var(--muted);display:flex;gap:6px;align-items:flex-start;line-height:1.35}
.choice{border:1px solid #d6c8ad;background:var(--card);border-radius:13px;min-height:62px;padding:10px 12px;text-align:left;display:flex;gap:11px;align-items:center;width:100%}
.choice:active{background:#f1e6cf}
.choiceIcon{width:34px;height:34px;flex:0 0 34px;border-radius:50%;display:grid;place-items:center;font-size:17px;background:#f1e8d4;border:1px solid #ddcfb2}
.choiceMain{flex:1;min-width:0}
.choiceMain b{display:block;font-size:16px;line-height:1.2}
.choiceMain small{display:block;margin-top:4px;font-size:12.5px;line-height:1.3;color:var(--muted);font-weight:650}
.tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.tag{display:inline-flex;align-items:center;gap:3px;border-radius:999px;padding:3px 8px;font-size:11.5px;font-weight:850}
.tag.mini{background:#1b1b1b;color:#fff}.tag.fam{background:var(--good-bg);color:#256140}.tag.trait{background:#f7e9c6;color:#7a560f}
.chance{flex:0 0 auto;text-align:right;font-weight:900;font-size:15px}
.chance small{display:block;font-size:10.5px;color:var(--muted);font-weight:700}
.chance.hi{color:var(--green)}.chance.lo{color:var(--red)}
.choice.locked{opacity:.55;border-style:dashed;background:transparent}
.choice.locked .choiceMain b{font-size:14.5px}

/* Zar */
.checkFocus{display:flex;flex-direction:column;align-items:center;gap:10px;padding-top:4px}
.dieFace{width:108px;height:108px;border-radius:22px;background:#fff;box-shadow:0 10px 25px rgba(0,0,0,.12),inset 0 0 0 1px #ded3c1;display:grid;place-items:center;font-size:50px;font-weight:900;overflow:hidden}
.dieFace.spin{animation:wob .1s linear infinite}
@keyframes wob{0%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}100%{transform:rotate(-6deg)}}
.targetPill{padding:8px 18px;border-radius:999px;background:#101010;color:#fff;font-size:24px;font-weight:900}
.breakdown{border:1px solid var(--line);background:var(--card);border-radius:12px;overflow:hidden}
.bRow{display:flex;justify-content:space-between;gap:10px;padding:9px 11px;font-size:14px;border-bottom:1px solid #eadfca}
.bRow:last-child{border-bottom:0}
.bRow b{white-space:nowrap}.bRow .minus{color:var(--green)}.bRow .plus{color:var(--red)}
.bRow.total{background:#f1e6cf;font-weight:900}

/* Sonuç */
.resultImg{width:100%;height:150px;border-radius:16px;position:relative;overflow:hidden;flex:0 0 150px;
  background:radial-gradient(circle at 50% 40%,#f6d9a4 0,#d9a25f 50%,#7a4a2a 100%)}
.resultImg .artIcon{font-size:60px;padding:0}
.resultHeader{text-align:center}
.badge{display:inline-block;border-radius:999px;padding:5px 11px;font-size:11.5px;font-weight:900;letter-spacing:.6px;text-transform:uppercase;margin-bottom:6px}
.o-crit{background:#dff0d8;color:#1f5d39}.o-win{background:#e5f0e8;color:#23623f}.o-mid,.o-direct{background:#eee8da;color:#5a5044}.o-fail{background:#f6e4df;color:#8b2d26}.o-bad{background:#f0d0ca;color:#7b211b}
.resultTitle{font-family:var(--serif);font-size:30px;font-weight:900;line-height:1.05}
.resultText{font-size:16px;line-height:1.45;margin-top:8px;color:#2e2720}
.note{font-size:13px;color:var(--muted);font-style:italic;margin-top:4px}
.rollCard{border:1px solid var(--line);background:var(--card);border-radius:12px;padding:10px;text-align:center}
.rollCard .l{font-size:12px;color:var(--muted);font-weight:800}
.rollCard .v{font-size:40px;font-weight:900;line-height:1.1}
.rollCard .t{font-size:13px;color:#5c5145;font-weight:800}
.gainGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}
.gainCard{border:1px solid var(--line);background:var(--card);border-radius:12px;padding:8px;text-align:center}
.gainCard .k{font-size:12.5px;color:var(--muted);font-weight:800}
.gainCard .v{font-size:22px;font-weight:900}
.gainCard.good .v{color:var(--green)}.gainCard.bad .v{color:var(--red)}
.traitCard{border:1px solid #dcc48e;background:#f8efd8;border-radius:14px;padding:12px}
.traitCard .l{font-size:11.5px;font-weight:900;color:var(--gold);letter-spacing:.6px}
.traitCard .n{font-size:21px;font-weight:900;font-family:var(--serif);margin-top:3px}
.traitCard .d{font-size:13.5px;color:#5d5246;margin-top:4px;line-height:1.35}

/* Bölüm sonu ve final */
.compare{display:grid;grid-template-columns:1fr auto;border-bottom:1px solid var(--line);padding:8px 2px;font-size:14px}
.compare b .up{color:var(--green)}.compare b .down{color:var(--red)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:6px 10px;font-size:13px;font-weight:800}
.finalCard{border-radius:18px;background:#1d1915;color:#f4ead7;padding:16px;text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.finalCard .k{font-size:11.5px;letter-spacing:1.2px;font-weight:900;color:#d8b16a}
.finalCard h2{font-family:var(--serif);font-size:30px;margin:6px 0 4px;line-height:1.05}
.finalCard p{margin:6px 0 0;font-size:14.5px;line-height:1.4;color:#e7dbc4}
.bars{display:flex;flex-direction:column;gap:7px}
.bar{display:grid;grid-template-columns:120px 1fr 34px;gap:8px;align-items:center;font-size:13.5px}
.bar .track{height:10px;background:#e5d9c3;border-radius:99px;overflow:hidden}
.bar .fill{height:100%;background:linear-gradient(90deg,#c69b49,#a52f26);border-radius:99px}
.bar b{text-align:right}
.logList{display:flex;flex-direction:column;gap:6px}
.logItem{border:1px solid var(--line);background:var(--card);border-radius:10px;padding:8px 10px;font-size:13.5px;line-height:1.35}
.logItem small{color:var(--muted);font-weight:800;display:block;font-size:11.5px}

/* Pencere */
.modal{position:fixed;z-index:100;inset:0;background:rgba(0,0,0,.72);display:grid;place-items:center;padding:16px}
.modalCard{width:min(94vw,440px);max-height:86dvh;overflow:auto;background:var(--paper);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px}
.modalCard h2{font-family:var(--serif);margin:0;font-size:23px}
.modalCard h3{font-family:var(--serif);margin:6px 0 0;font-size:18px}
.modalCard p{font-size:14px;line-height:1.45;margin:0}
.tCard{border:1px solid var(--line);background:var(--card);border-radius:10px;padding:9px 10px}
.tCard b{font-size:14.5px}.tCard div{font-size:13px;color:var(--muted);margin-top:2px;line-height:1.3}

/* Mini oyunlar */
.mgStage{border:1px solid var(--line);background:var(--card);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:12px;min-height:250px;justify-content:center}
.mgTitle{font-family:var(--serif);font-size:21px;font-weight:900;text-align:center}
.mgHint{font-size:14px;line-height:1.4;color:var(--muted);text-align:center}
.mgBar{position:relative;height:40px;border-radius:999px;overflow:hidden;background:#e5d9c3;border:1px solid #cdbb99}
.mgZone{position:absolute;top:0;bottom:0;background:rgba(46,118,81,.3);border-left:2px solid #2e7651;border-right:2px solid #2e7651}
.mgNeedle{position:absolute;top:-4px;bottom:-4px;width:5px;margin-left:-2px;border-radius:4px;background:var(--red);box-shadow:0 0 0 1px rgba(255,255,255,.8)}
.mgBig{min-height:72px;border:0;border-radius:16px;background:var(--red);color:#fff;font-weight:900;font-size:18px;box-shadow:0 4px 0 var(--red-dark);touch-action:manipulation;user-select:none;-webkit-user-select:none}
.mgBig:active{transform:translateY(2px);box-shadow:0 2px 0 var(--red-dark)}
.mgPower{position:relative;height:44px;border-radius:12px;overflow:hidden;background:#e6d9c2;border:1px solid #cdbb99}
.mgFill{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,#d8c792,#a9c69a)}
.mgStatus{font-size:15px;font-weight:900;text-align:center;color:#5d5043;min-height:20px}
.mgDots i.cur{background:var(--gold);animation:mgCurPulse 1s ease-in-out infinite}
.mgStage.mgFlashGood{animation:mgFlashG .35s ease}
.mgStage.mgFlashBad{animation:mgFlashB .4s ease}
@keyframes mgCurPulse{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes mgFlashG{0%{box-shadow:inset 0 0 0 3px var(--green);background:var(--good-bg)}100%{box-shadow:inset 0 0 0 0 rgba(0,0,0,0);background:var(--card)}}
@keyframes mgFlashB{0%{box-shadow:inset 0 0 0 3px var(--red);background:var(--bad-bg)}20%{transform:translateX(-7px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}100%{box-shadow:inset 0 0 0 0 rgba(0,0,0,0);background:var(--card);transform:translateX(0)}}
.mgField{position:relative;height:210px;border:1px solid var(--line);border-radius:14px;background:#f1e5cc;overflow:hidden}
.mgPiece{position:absolute;width:52px;height:52px;border:0;border-radius:50%;background:#fff8ea;font-size:26px;display:grid;place-items:center;box-shadow:0 3px 10px rgba(0,0,0,.15);animation:pop .25s ease-out}
@keyframes pop{from{transform:scale(.2)}to{transform:scale(1)}}
.mgTrack{position:relative;height:96px;border-radius:14px;overflow:hidden;border:1px solid #cdbb99;background:repeating-linear-gradient(90deg,#e5d8bf 0 22px,#dccdb0 22px 24px)}
.mgRunner{position:absolute;font-size:30px;left:4px;transition:left .08s linear}
.mgRunner.you{top:8px}.mgRunner.opp{bottom:8px}
.mgRunner small{position:absolute;left:0;top:-2px;font-size:9px;font-weight:900;background:#1d1915;color:#fff;border-radius:4px;padding:0 3px}
.mgFinish{position:absolute;right:10px;top:0;bottom:0;width:4px;background:repeating-linear-gradient(0deg,#111 0 6px,#fff 6px 12px)}
.mgKids{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.mgKid{border:1px solid var(--line);background:#fffaf0;border-radius:12px;padding:10px 4px;text-align:center;min-height:92px}
.mgKid .face{font-size:34px}.mgKid .stars{font-size:13px;margin-top:4px;font-weight:900;color:#9b731e}
.mgCups{position:relative;height:130px}
.mgCup{position:absolute;top:30px;width:30%;height:84px;border:0;background:transparent;transition:left .35s ease-in-out,transform .3s;font-size:58px;display:grid;place-items:center;padding:0}
.mgCup.lift{transform:translateY(-34px)}
.mgCoin{position:absolute;top:78px;width:30%;text-align:center;font-size:34px;transition:opacity .2s}
.mgDoors{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.mgDoor{border:1px solid var(--line);border-radius:14px;background:#fffaf0;padding:10px 6px;text-align:center;min-height:118px}
.mgDoor .door{font-size:40px}
.sign{display:inline-flex;align-items:center;gap:4px;border-radius:8px;padding:4px 8px;font-size:12.5px;font-weight:900;margin-top:6px;color:#1d1915}
.sign.Sarı{background:#f3d34a}.sign.Mavi{background:#8cc2ec}.sign.Kırmızı{background:#ec8f86}.sign.Yeşil{background:#9fd49a}
.clue{border:2px dashed var(--gold);border-radius:12px;padding:12px;text-align:center;font-size:15px;font-weight:800;background:#fff8e6}

@media (max-height:700px){
  .art{flex-basis:30%}.artCaption h1{font-size:24px}.artCaption p{font-size:13.5px}
  .choice{min-height:56px;padding:8px 10px}.mgStage{min-height:210px}
}

/* İç sesler */
.voice{border-left:4px solid var(--vc);background:#fbf6ea;border-radius:0 12px 12px 0;padding:8px 11px;font-size:14px;line-height:1.4;color:#2e2720;animation:vin .35s ease-out both}
.voice b{display:block;font-size:11.5px;letter-spacing:1px;color:var(--vc);margin-bottom:2px}
.voice b i{font-style:normal;font-weight:700;color:var(--muted);letter-spacing:.2px}
.voice.off{opacity:.62;font-style:italic}
.voice:nth-child(2){animation-delay:.15s}.voice:nth-child(3){animation-delay:.3s}
@keyframes vin{from{opacity:0;transform:translateX(-8px)}to{transform:none}}
.tag.voiceTag{background:#e3eef0;color:#23606a}

/* Yeni mini oyunlar */
.mgPulse{width:132px;height:132px;margin:0 auto;border-radius:50%;border:0;background:#2b2438;font-size:58px;display:grid;place-items:center;box-shadow:0 0 0 0 rgba(246,217,120,0);transition:transform .08s,box-shadow .12s;touch-action:manipulation}
.mgPulse.on{transform:scale(1.1);box-shadow:0 0 0 14px rgba(246,217,120,.35),0 0 40px rgba(246,217,120,.8);background:#3d3352}
.mgDots{display:flex;justify-content:center;gap:8px}
.mgDots i{width:14px;height:14px;border-radius:50%;background:#e1d4bb;display:block}
.mgDots i.hit{background:var(--green)}.mgDots i.miss{background:var(--red)}
.mgLanes{position:relative;height:260px;border-radius:14px;overflow:hidden;border:1px solid #cdbb99;touch-action:none;
  background:linear-gradient(90deg,transparent 33%,rgba(0,0,0,.08) 33.3%,transparent 33.6%,transparent 66.3%,rgba(0,0,0,.08) 66.6%,transparent 67%),#eadcc1}
.mgMe,.mgObs{position:absolute;transform:translate(-50%,-50%);font-size:34px;transition:left .1s}
.mgMe{top:82%}.mgMe.bump,.mgObs.bump{animation:shake .25s}
@keyframes shake{25%{transform:translate(-58%,-50%)}75%{transform:translate(-42%,-50%)}}
.mgSimon{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mgTile{min-height:84px;border-radius:16px;border:1px solid var(--line);background:#fffaf0;font-size:40px;transition:transform .1s,background .1s}
.mgTile.lit{background:#f6d978;transform:scale(1.06)}
.mgPoker{position:relative;height:280px;border-radius:14px;background:#f1e5cc;border:1px solid var(--line);overflow:hidden}
.mgQ{position:absolute;top:10px;left:0;right:0;text-align:center;font-family:var(--serif);font-size:18px;font-weight:900;color:#5a4a36}
.mgRing{position:absolute;border-radius:50%;border:4px solid var(--green);background:rgba(43,122,79,.12);display:grid;place-items:center;font-size:34px;pointer-events:none}
.mgRing.bad{border-color:var(--red);background:rgba(165,47,38,.12)}
.mgTrace{width:100%;height:auto;background:#fffaf0;border:1px solid var(--line);border-radius:14px}
.mgTrace .guide{fill:none;stroke:#c9b48c;stroke-width:14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:2 14}
.mgTrace .ink{fill:none;stroke:#26405e;stroke-width:7;stroke-linecap:round;stroke-linejoin:round}
.mgTrace .startDot{fill:var(--green)}

/* Ölüm */
.tag.risk{background:#2a211c;color:#f3d9c9}
.deathCard{border-radius:14px;background:#1d1915;color:#f1e4cf;padding:13px;text-align:center}
.deathCard .l{font-size:11.5px;letter-spacing:1px;font-weight:900;color:#e0a07a}
.deathCard .d{font-family:var(--serif);font-size:17px;line-height:1.4;margin-top:5px}
.primary.dark{background:#1d1915;box-shadow:0 3px 0 #000}
.finalCard.grave{background:linear-gradient(180deg,#3b3631,#1d1915);border:2px solid #5a524a}
.finalCard.grave .k{color:#c9c0b3}

/* Pazarlık, kart ayırma, nefes, denge */
.mgPatience{height:12px;border-radius:99px;background:#e5d9c3;overflow:hidden}
.mgPatience i{display:block;height:100%;background:linear-gradient(90deg,#a52f26,#c69b49);transition:width .3s}
.bgOffer{font-size:44px;font-weight:900;text-align:center;font-family:var(--serif)}
.bgSlider{width:100%;accent-color:#a52f26;height:34px}
.swCard{min-height:120px;border-radius:16px;background:#fffaf0;border:1px solid var(--line);display:grid;place-items:center;text-align:center;padding:14px;font-size:17px;font-weight:800;line-height:1.35;touch-action:none;transition:transform .15s,opacity .15s}
.swCard.out{opacity:0;transform:scale(.9)}.swCard.out.r{transform:translateX(40%) rotate(8deg)}.swCard.out.l{transform:translateX(-40%) rotate(-8deg)}
.mgTimerBar{height:6px;border-radius:99px;background:#e5d9c3;overflow:hidden}.mgTimerBar i{display:block;height:100%;background:#26405e}
.mgBig.sw{font-size:15px;min-height:60px}.mgBig.sw.right{background:#2b7a4f;box-shadow:0 4px 0 #1d5a39}
.brWrap{height:190px;display:grid;place-items:center}
.brCircle{width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,#f6d9a4,#c69b49);box-shadow:0 0 30px rgba(198,155,73,.5)}
.brCircle.in{background:radial-gradient(circle,#dff0d8,#6fae8a)}
.blField{position:relative;height:200px;border-radius:14px;background:#f1e5cc;border:1px solid var(--line);overflow:hidden}
.blItem{position:absolute;top:70px;transform:translateX(-50%);font-size:42px;transition:filter .1s}
.blItem.bad{filter:drop-shadow(0 0 8px rgba(165,47,38,.9))}
.blTray{position:absolute;top:122px;height:12px;transform:translateX(-50%);border-radius:99px;background:#6b5a48;box-shadow:0 3px 0 #3d3329}

/* Panel içindeki kutular küçülüp içeriğini kırpmasın; sığmazsa panel kaydırılır */
.panel > *{flex-shrink:0}
/* Seçim kartı: lehine / aleyhine / başarırsan */
.choice.pvPast{box-shadow:inset 5px 0 0 var(--rk,#b8892a)}
.pvRib{display:inline-block;font-size:11.5px;font-weight:800;color:#fff;background:var(--rk,#8a6212);padding:2px 8px;border-radius:999px;margin-bottom:5px;line-height:1.35}
.pvK-past{--rk:#6d3fb0}.pvK-hat{--rk:#1f6f8b}.pvK-badge{--rk:#c2410c}.pvK-voice{--rk:#a3237a}
.pvK-money{--rk:#1f7a45}.pvK-family{--rk:#b4233a}.pvK-stat{--rk:#2f5fc4}
.pvRow{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin-top:5px}
.pvLbl{font-size:9.5px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;color:#8b7c66;margin-right:1px}
.pv{display:inline-flex;align-items:center;gap:3px;border-radius:999px;padding:2px 8px;font-size:11.5px;font-weight:800;line-height:1.35}
.choiceMain .pv b{display:inline;font-size:inherit;font-weight:900;font-variant-numeric:tabular-nums}
.pvHelp{background:#e2efe3;color:#1f5e3a;border:1px solid #b9d7bf}
.pvHurt{background:#f6e1dc;color:#8a2c22;border:1px solid #e3bbb2}
.pvEarn{background:transparent;color:#7a560f;border:1.5px dashed #c9a14a}
.pvSure{background:#f1e8d4;color:#4a3f30;border:1px solid #d9caa9}
.pvDim{opacity:.7;font-weight:700}
/* Kavşak ekranları */
.kvGate{flex:1;min-height:0;overflow:auto;background:radial-gradient(120% 70% at 50% 18%,#2c241b 0%,#17130f 60%);color:#efe4cf;padding:22px 20px calc(20px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:18px}
.kvDone{background:radial-gradient(120% 60% at 50% 30%,#23301f 0%,#17130f 62%)}
.kvDone.kvLost{background:radial-gradient(120% 60% at 50% 30%,#3a2320 0%,#17130f 62%)}
.kvLine{display:flex;align-items:center;padding:0 4px}
.kvSeg{flex:1;height:2px;background:#3d342a}.kvSeg.on{background:#c69a3c}
.kvDot{width:12px;height:12px;flex:0 0 12px;border-radius:50%;border:2px solid #4a4034;background:#17130f}
.kvDot.on{background:#c69a3c;border-color:#c69a3c}
.kvDot.org{width:8px;height:8px;flex-basis:8px;border-width:2px;background:#17130f;border-color:#6b5d4b}
.kvDot.last{width:16px;height:16px;flex-basis:16px;box-shadow:0 0 0 5px rgba(198,154,60,.3)}
.kvDot.now{width:18px;height:18px;flex-basis:18px;border:3px solid #a52f26;background:#fff;box-shadow:0 0 0 6px rgba(165,47,38,.25)}
.kvLineLbl{display:flex;justify-content:space-between;font-size:10px;font-weight:800;color:#8f8170;letter-spacing:.06em;text-transform:uppercase;margin-top:7px}
.kvKick{font-size:11.5px;font-weight:900;letter-spacing:.18em;color:#c69a3c;text-transform:uppercase}
.kvTitle{font-family:var(--serif);font-size:38px;line-height:1.02;font-weight:800;margin:6px 0 4px}
.kvTitle.center,.kvText.center{text-align:center}
.kvAge{font-size:14px;font-weight:700;color:#b3a58c}
.kvText{margin:0;font-family:var(--serif);font-size:16.5px;line-height:1.5;color:#e6d8bf}
.kvNote{font-size:14px;font-weight:700;color:#e9dcc3;border-left:3px solid #c69a3c;padding-left:10px}
.kvFork{position:relative;height:140px;flex:0 0 140px}
.kvFork svg{position:absolute;inset:0;width:100%;height:100%}
.kvWay{position:absolute;right:0;width:52%;font-size:13px;font-weight:700;line-height:1.35;color:#e9dcc3}
.kvWay b{display:block;font-size:10.5px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;margin-bottom:2px}
.kvWay.up{top:0}.kvWay.up b{color:#8fd1a8}.kvWay.down{bottom:0}.kvWay.down b{color:#ef9a8a}
.kvBring{border:1px solid #3d342a;border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:6px;background:rgba(255,255,255,.03)}
.kvBringT{font-size:10.5px;font-weight:900;letter-spacing:.12em;color:#b3a58c;text-transform:uppercase}
.kvMuted{font-size:13.5px;color:#b3a58c}
.pvHelpD{background:rgba(143,209,168,.12);color:#9fe0b7;border:1px solid rgba(143,209,168,.35)}
.kvBtn{margin-top:auto;min-height:56px;border:0;border-radius:14px;background:#c69a3c;color:#1a130b;font-weight:900;font-size:16px;letter-spacing:.08em;box-shadow:0 4px 0 #7d5e1d;flex:0 0 auto}
.kvBtn:active{transform:translateY(2px);box-shadow:0 2px 0 #7d5e1d}
.kvHead{background:#17130f;color:#efe4cf;padding:12px 16px 14px;display:flex;flex-direction:column;gap:7px;border-bottom:3px solid #c69a3c;flex:0 0 auto}
.kvHeadRow{display:flex;justify-content:space-between;align-items:center;gap:8px}
.kvStake{font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:#a52f26;border-radius:6px;padding:3px 7px;white-space:nowrap}
.kvHead h2{font-family:var(--serif);font-size:26px;line-height:1.05;margin:0}
.kvHead p{margin:0;font-family:var(--serif);font-size:14.5px;line-height:1.45;color:#e6d8bf}
.kvStakes{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.kvStakes div{border-radius:9px;padding:6px 8px;font-size:12px;font-weight:700;line-height:1.3}
.kvStakes b{display:block;font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.kvStakes .up{background:rgba(143,209,168,.12);color:#cdeed9}.kvStakes .up b{color:#8fd1a8}
.kvStakes .dn{background:rgba(239,154,138,.12);color:#f3d3cc}.kvStakes .dn b{color:#ef9a8a}
.kvStamp{align-self:center;margin-top:6px;border:3px solid #8fd1a8;color:#8fd1a8;border-radius:12px;padding:7px 15px;font-size:13px;font-weight:900;letter-spacing:.2em;transform:rotate(-4deg)}
.kvLost .kvStamp{border-color:#ef9a8a;color:#ef9a8a}
.kvRoll{display:flex;justify-content:center;gap:16px;align-items:center}
.kvDie{width:70px;height:70px;border-radius:16px;background:#fff;color:#1d1915;display:grid;place-items:center;font-size:34px;font-weight:900}
.kvDie.small{font-size:20px}
.kvRoll span{font-size:14px;font-weight:700;color:#b3a58c}
.pvRow.center{justify-content:center}

/* Bölüm sonu: kavşak özeti ve sıradaki bölümde bekleyenler */
.kvSum{background:#17130f;color:#efe4cf;border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:2px;border-left:4px solid #8fd1a8}
.kvSum.lost{border-left-color:#ef9a8a}
.kvSumN{font-size:10.5px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#c69a3c}
.kvSumT{font-size:13px;color:#b3a58c;font-weight:700}
.kvSum b{font-family:var(--serif);font-size:19px;line-height:1.2}
.kvWaits{border:1px solid #d8c9ad;background:#f8efd9;border-radius:12px;padding:11px 13px;display:flex;flex-direction:column;gap:6px}
.kvWaitsT{font-size:11px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#8a6212}
.kvWaits ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:5px;font-size:14px;line-height:1.4;color:#3c3226}
.tCard .tFx{margin-top:6px;font-size:12.5px;font-weight:800;color:#2f6b45}
.kvWaits.lost{background:#f8e6df;border-color:#e2b9a8}
.kvWaits.lost .kvWaitsT{color:#9b3a24}

/* Tanıtım */
.tutWrap{position:absolute;inset:0;z-index:90;background:rgba(10,9,8,.78);display:flex;align-items:center;justify-content:center;padding:14px}
.tutCard{width:100%;max-height:100%;background:var(--paper);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:10px;overflow:hidden}
.tutCard.ask{gap:12px}
.tutCard h2{font-family:var(--serif);margin:0;font-size:23px;line-height:1.15}
.tutCard p{margin:0;font-size:14.5px;line-height:1.45}
.tutTop{display:flex;justify-content:space-between;align-items:center}
.tutKick{font-size:11px;font-weight:900;letter-spacing:.14em;color:var(--gold)}
.tutX{border:0;background:none;font-size:18px;color:var(--muted);padding:4px 6px}
.tutBody{overflow:auto;display:flex;flex-direction:column;gap:10px;min-height:0;flex:1 1 auto;padding-right:2px}
.tutDots{display:flex;gap:6px;justify-content:center}
.tutDots i{width:7px;height:7px;border-radius:50%;background:#d8c9ad}.tutDots i.on{background:var(--red);width:18px;border-radius:4px}
.tutLine{display:grid;grid-template-columns:repeat(10,1fr);gap:3px}
.tutLine span{background:#2a2622;color:#f4ead7;font-family:var(--serif);font-size:11px;text-align:center;padding:5px 0;border-radius:5px}
.tutLineL{display:flex;justify-content:space-between;font-size:11px;font-weight:800;color:var(--muted)}
.tutStats{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.tutStats div{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:8px 9px;display:flex;flex-direction:column;gap:2px}
.tutStats b{font-size:13.5px}.tutStats span{font-size:12px;color:var(--muted);line-height:1.3}
.tutMock{display:flex;flex-direction:column;gap:8px}
.tutEv{background:#1d1915;color:#f4ead7;border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:3px}
.tutEv small{font-size:10.5px;letter-spacing:.12em;color:#d2a54a;font-weight:900}.tutEv b{font-family:var(--serif);font-size:18px}.tutEv span{font-size:13px;line-height:1.35;opacity:.9}
.tutChoice{cursor:default}
.tutN{display:inline-grid;place-items:center;width:17px;height:17px;border-radius:50%;background:var(--red);color:#fff;font-size:10.5px;font-style:normal;font-weight:900;margin-right:4px;vertical-align:1px}
.chance .tutN{display:grid;margin:0 0 3px auto}
.tutList{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px;font-size:13.5px;line-height:1.4}
.tutOut{display:flex;flex-direction:column;gap:6px}
.tutOut .o{border-radius:10px;padding:8px 10px;font-size:13.5px;line-height:1.35;border:1px solid var(--line);background:var(--card)}
.tutOut .o b{display:block;font-size:12px;letter-spacing:.04em;margin-bottom:2px}
.tutOut .o em{font-style:normal;font-weight:900;margin-left:4px}
.tutOut .crit{background:#e3f0dc;border-color:#b9d6ad}.tutOut .crit b,.tutOut .crit em{color:var(--green)}
.tutOut .win b,.tutOut .win em{color:var(--green)}
.tutOut .bad{background:var(--bad-bg);border-color:#e2b9a8}.tutOut .bad b,.tutOut .bad em{color:var(--red)}
.tutRib{background:var(--card);border:1px solid var(--line);border-left:4px solid #c69a3c;border-radius:10px;padding:8px 10px}
.tutBar{background:#0f0f0f;border-radius:12px;display:grid;grid-template-columns:40px 1fr 40px;align-items:center;padding:6px 10px;color:#fff}
.tutBarT{font-family:var(--serif);font-weight:800;text-align:center;font-size:15px}
.tutGlow{box-shadow:0 0 0 3px var(--gold),0 0 18px 4px rgba(198,154,60,.8);animation:tutPulse 1.4s ease-in-out infinite}
@keyframes tutPulse{50%{box-shadow:0 0 0 3px var(--gold),0 0 4px 1px rgba(198,154,60,.4)}}
.tutPoint{font-weight:600}
.tutTag{display:inline-block;background:var(--red);color:#fff;font-size:10.5px;font-weight:900;letter-spacing:.08em;border-radius:6px;padding:1px 6px;margin-left:2px}
.gFrom{font-size:12px;color:var(--muted);font-weight:700;margin-top:2px}.gFrom b{color:var(--ink)}
.gTrack{height:6px;background:#e7dcc6;border-radius:4px;overflow:hidden;margin-top:5px}
.gTrack i{display:block;height:100%;width:var(--b);background:var(--green);border-radius:4px;animation:gGrow 1.1s cubic-bezier(.2,.8,.2,1) both}
.gainCard.bad .gTrack i{background:var(--red)}
@keyframes gGrow{from{width:var(--a)}to{width:var(--b)}}
.starStat{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"l l l" "i n p" "s s s";align-items:center;gap:2px 10px;background:#1d1915;color:#f4ead7;border-radius:14px;padding:12px 14px;animation:ssIn .6s ease-out both}
.starStat .ssL{grid-area:l;font-size:10.5px;font-weight:900;letter-spacing:.14em;color:#d2a54a}
.starStat .ssI{grid-area:i;font-size:30px}.starStat b{grid-area:n;font-family:var(--serif);font-size:22px}
.starStat em{grid-area:p;font-style:normal;font-weight:900;font-size:22px;color:#8fd1a8}
.starStat small{grid-area:s;font-size:12.5px;opacity:.8;line-height:1.35}
@keyframes ssIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}

/* ── ajan sürümü: iç ses karakteri, lakap, babaanne kutusu, taziye, puan çipi animasyonu ── */
.voice b .vChar{font-style:italic;font-weight:600;font-size:11px;opacity:.75;text-transform:none;letter-spacing:0;margin-left:4px}
.lakapCard{border:1px solid #d9b3a6;background:#f9e9e3;border-radius:14px;padding:12px;margin-top:10px}
.lakapCard .l{font-size:11.5px;font-weight:900;color:var(--red);letter-spacing:.6px}
.lakapCard .n{font-size:21px;font-weight:900;font-family:var(--serif);margin-top:3px}
.lakapCard .d{font-size:13px;color:#6a4e45;margin-top:4px}
.nine{border:1px solid #d8c7a4;background:#fbf4e3;border-radius:14px;padding:12px 14px;margin:10px 0}
.nineT{font-size:12px;font-weight:900;color:#8a6d1c;letter-spacing:.4px}
.nineQ{font-family:var(--serif);font-size:17px;line-height:1.35;margin-top:6px;font-style:italic}
.nineL{font-size:13px;color:#6b5a48;margin-top:8px}
.finalCard .taziye{font-style:italic;color:#cdbfa6;font-size:13.5px}
.finalCard .lakaplar{color:#d8b16a;font-size:13.5px}
.pv small{display:block;font-weight:600;font-size:11px;opacity:.8;margin-top:1px}
@keyframes chipPop{0%{transform:translateY(8px) scale(.9);opacity:0}60%{transform:translateY(-3px) scale(1.04);opacity:1}100%{transform:none;opacity:1}}
@keyframes chipShake{0%,100%{transform:none}20%{transform:translateX(-4px)}40%{transform:translateX(4px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}
.gainGrid.o-win .gainCard,.gainGrid.o-direct .gainCard,.pvRow.o-win .pv,.pvRow.o-direct .pv{animation:chipPop .45s cubic-bezier(.2,.8,.3,1.2) both}
.gainGrid.o-crit .gainCard,.pvRow.o-crit .pv{animation:chipPop .45s cubic-bezier(.2,.8,.3,1.2) both;box-shadow:0 0 0 2px #e4c272 inset}
.gainGrid.o-bad .gainCard,.pvRow.o-bad .pv{animation:chipShake .45s ease both}

.karneBox{border-left-width:5px}
.karne-iyi{border-color:#2b7a4f!important}.karne-kotu{border-color:#a52f26!important}.karne-orta{border-color:#b8892a!important}

/* ── mini oyunlar v2 ── */
.dlQ{background:#fffaf0;border:1px solid var(--line);border-radius:14px;padding:12px 14px;font-family:var(--serif);font-size:18px;font-weight:700;line-height:1.3;text-align:center}
.dlQ small{display:block;font-family:var(--sans);font-size:11px;letter-spacing:.8px;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.dlOpts{display:flex;flex-direction:column;gap:8px}
.dlOpt{border:1px solid var(--line);background:var(--card);border-radius:12px;padding:12px;font-size:15px;font-weight:700;text-align:left;line-height:1.3;color:var(--ink)}
.dlOpt:active{transform:translateY(1px)}.dlOpt.good{background:var(--good-bg);border-color:var(--green)}.dlOpt.bad{background:var(--bad-bg);border-color:var(--red)}
.lieFacts{display:flex;flex-direction:column;gap:6px}.lieFacts div{background:#fffaf0;border:1px solid var(--line);border-radius:10px;padding:9px 12px;font-size:15px;font-weight:700}
.dfWrap{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dfGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;background:#f1e5cc;padding:4px;border-radius:10px;border:1px solid var(--line)}
.dfCell{aspect-ratio:1;border:0;background:#fffaf0;border-radius:8px;font-size:22px;padding:0;display:grid;place-items:center}
.dfCell.found{background:#cfe8d3;outline:2px solid var(--green)}.dfCell.wrong{background:#f2c9c2}
.fgLanes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.fgLane{height:110px;border-radius:12px;background:repeating-linear-gradient(180deg,#e7dcc4 0 14px,#dfd2b6 14px 16px);border:1px solid #cdbb99;display:grid;place-items:center}
.fgLane span{font-size:44px;opacity:0;transform:scale(.6);transition:opacity .12s,transform .12s}.fgLane span.on{opacity:1;transform:scale(1)}
.fgBtns{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.fgBtn{min-height:62px;font-size:14px;padding:6px}.fgBtn small{font-size:11px;opacity:.85}.fgBtn:disabled{opacity:.45}
.hdGrid{display:grid;grid-template-columns:repeat(6,1fr);gap:3px;background:#f1e5cc;padding:4px;border-radius:10px;border:1px solid var(--line)}
.hdCell{aspect-ratio:1;border:0;background:#fffaf0;border-radius:8px;font-size:21px;padding:0;display:grid;place-items:center}
.hdCell.found{background:#cfe8d3;outline:2px solid var(--green)}.hdCell.wrong{background:#f2c9c2}.hdT{font-size:26px;vertical-align:middle}
.twField{position:relative;height:230px;border-radius:14px;background:linear-gradient(#f6ecd6,#e8dbbd);border:1px solid #cdbb99;overflow:hidden}
.twBlk{position:absolute;display:grid;place-items:center;background:#c69b49;border:1px solid #8f6b24;border-radius:6px;font-size:18px;overflow:hidden;white-space:nowrap}
.twBlk.base{background:#8a7a5a}.twBlk.cur{background:#d8b16a}.twBlk.perfect{box-shadow:0 0 0 3px rgba(246,217,120,.9)}.twBlk.fall{transition:transform .6s,opacity .6s;transform:translateY(200px) rotate(25deg);opacity:0}

/* Kavşak: gece yolu (lacivert) · Bölüm sonu: akşam kızıllığı (mor-bordo) · normal sahneler: kâğıt */
.kvGate{background:radial-gradient(120% 70% at 50% 14%,#26315a 0%,#12172c 62%)}
.kvDone{background:radial-gradient(120% 60% at 50% 30%,#1c4a44 0%,#101a24 64%)}
.kvDone.kvLost{background:radial-gradient(120% 60% at 50% 30%,#4a2038 0%,#1a1020 64%)}
.kvHead{background:#12172c;border-bottom-color:#c69a3c}
.forkArt{position:relative;height:150px;margin:-12px -16px 2px;overflow:hidden;background:#12172c;display:flex}
.kvGate .forkArt{margin:0 -20px;flex:0 0 150px}
.fk{position:absolute;top:0;bottom:0;overflow:hidden}
.fkL{left:0;width:56%;clip-path:polygon(0 0,100% 0,calc(100% - 22px) 100%,0 100%)}
.fkR{right:0;width:56%;clip-path:polygon(22px 0,100% 0,100% 100%,0 100%)}
.fkImg{position:absolute;top:0;height:100%;width:178%;max-width:none;object-fit:cover}
.fkL .fkImg{left:0;filter:saturate(1.15) brightness(.8) sepia(.25) hue-rotate(60deg)}
.fkR .fkImg{right:0;filter:grayscale(.85) brightness(.6) sepia(.5) hue-rotate(-35deg)}
.fk:before{content:"";position:absolute;inset:0;z-index:1}
.fkL:before{background:linear-gradient(180deg,rgba(18,23,44,.1),rgba(30,90,60,.65))}
.fkR:before{background:linear-gradient(180deg,rgba(18,23,44,.1),rgba(110,30,30,.7))}
.fkTxt{position:absolute;z-index:2;left:10px;right:10px;bottom:8px;font-size:11.5px;font-weight:700;line-height:1.3;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.8)}
.fkR .fkTxt{left:26px}.fkL .fkTxt{right:26px}
.fkTxt b{display:block;font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;margin-bottom:2px}
.fkL .fkTxt b{color:#9fe3b8}.fkR .fkTxt b{color:#f4a897}
.fkSeam{position:absolute;z-index:3;left:calc(50% - 2px);top:0;bottom:0;width:4px;background:#c69a3c;transform:skewX(8deg);box-shadow:0 0 14px rgba(198,154,60,.8)}
.fkSign{position:absolute;z-index:4;left:50%;top:8px;transform:translateX(-50%);width:30px;height:30px;border-radius:50%;background:#c69a3c;color:#1a130b;display:grid;place-items:center;font-weight:900;font-size:18px}
.chEnd .panel{background:linear-gradient(180deg,#2d2145 0%,#43263a 55%,#2a1a20 100%)}
.chEnd .panel .sectionTitle,.chEnd .panel h3,.chEnd .panel .sectionSub,.chEnd .panel .muted{color:#f3e7d4}
.chEnd .art{background:radial-gradient(circle at 50% 38%,#e8a98a 0,#a2556a 50%,#3a2145 100%)}
.chEnd .compare,.chEnd .logList,.chEnd .logList .logItem small{color:#f3e7d4}
.chEnd .compare{border-color:rgba(243,231,212,.25)}
.chEnd .compare .up{color:#8fd1a8}.chEnd .compare .down{color:#f4a897}

.langRow{justify-content:center;gap:8px;margin-top:10px}.langRow .secondary{flex:0 0 auto;min-width:56px}.langRow .secondary.on{outline:2px solid currentColor;font-weight:700}
.hud{flex:0 0 auto;display:flex;flex-wrap:wrap;justify-content:center;gap:2px 12px;background:#1a1714;color:#e9e1d3;font-size:12px;padding:5px 8px;border-top:1px solid #2a2622}.hud span{white-space:nowrap}
.hud{cursor:pointer}.hud:active{background:#2a2622}
.topbar{flex:0 0 34px;grid-template-columns:26px 1fr 26px;padding:0 10px}.brandWord{font-size:15px}.topBtn{width:24px;height:24px;font-size:13px;border-color:rgba(255,255,255,.25)}.hud{border-top:0;padding:2px 8px 6px}
.chEnd .logList{color:inherit}.chEnd .logItem{color:var(--ink,#241d17)}.chEnd .logItem small{color:var(--muted)}
.dfCell span{display:block;line-height:1}.dfCell .dfTilt{transform:rotate(-17deg)}.dfCell .dfSmall{transform:scale(.72)}.dfCell .dfFade{opacity:.5}.dfCell .dfDark{filter:brightness(.55)}
.chEnd .kvWaits,.chEnd .kvWaits b{color:#3c3226}.chEnd .kvWaits .kvWaitsT{color:#8a6212}.chEnd .kvWaits.lost .kvWaitsT{color:#9b3a24}
.kvWaits ul{list-style:none;padding-left:0}.kvWaits li{margin:2px 0}.kvWaits small{opacity:.8}

.famShift{border-radius:14px;padding:12px 14px;margin:10px 0;border:2px solid;animation:fsPulse .9s ease-out}
.famShift.down{background:#f9e1da;border-color:#c0452c;color:#5a1d10}.famShift.up{background:#e0f1e2;border-color:#3f9a54;color:#17421f}
.famShift .fsL{font-size:12px;font-weight:900;letter-spacing:.8px}
.famShift .fsV{font-size:22px;font-family:var(--serif);margin:3px 0}
.famShift .fsD{font-size:13.5px;line-height:1.4}
@keyframes fsPulse{0%{transform:scale(.94);opacity:0}60%{transform:scale(1.03);opacity:1}100%{transform:scale(1)}}

.curtainArt{position:relative;flex:1 1 auto;min-height:0;overflow:hidden;background:#1a1714;cursor:pointer}
.curtainArt .artImg{object-position:center 30%}
.curtainArt:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 38%,rgba(0,0,0,.82) 100%);pointer-events:none}
.curCap{position:absolute;z-index:2;left:18px;right:18px;bottom:66px;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.7)}
.curCap h1{margin:0 0 8px;font-family:var(--serif);font-size:32px;line-height:1.05}
.curCap p{margin:0;font-size:16px;line-height:1.4}
.curNext{position:absolute;z-index:3;right:16px;bottom:16px;border:0;border-radius:999px;padding:12px 22px;font-size:16px;font-weight:900;background:var(--gold);color:#1a1714;box-shadow:0 4px 14px rgba(0,0,0,.4);animation:curPulse 1.6s ease-in-out infinite}
@keyframes curPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.deathWhy{margin-top:8px;font-size:12.5px;opacity:.85;border-top:1px solid rgba(255,255,255,.25);padding-top:6px}

/* Sahne perdesi v2: görsel kırpılmadan tam genişlikte (3:2), arkası aynı görselin bulanık hâli */
.curtainArt{display:flex;flex-direction:column}
.curtainArt:after{display:none}
.curBg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(26px) brightness(.5) saturate(1.15);transform:scale(1.2)}
.curFrame{position:relative;z-index:1;flex:0 0 auto;width:100%;aspect-ratio:3/2;box-shadow:0 10px 28px rgba(0,0,0,.55)}
.curFrame .curImg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.curCap{position:relative;left:auto;right:auto;bottom:auto;padding:18px 18px 76px;z-index:1}

/* Perdede bağlam bölümü: çizgiyle ayrılmış, koyu zeminde okunur */
.curRule{display:flex;align-items:center;gap:10px;margin:18px 0 10px;color:var(--gold);font-size:11px;font-weight:900;letter-spacing:1.2px;text-transform:uppercase;text-shadow:none}
.curRule:before,.curRule:after{content:"";height:1px;background:linear-gradient(90deg,transparent,var(--gold));flex:1}
.curRule:after{background:linear-gradient(270deg,transparent,var(--gold))}
.curCtx{display:flex;flex-direction:column;gap:8px;text-shadow:none}
.curCtx .recall,.curCtx .voice{background:rgba(255,255,255,.10);color:#f3e7d4;border-radius:0 10px 10px 0;font-style:normal;font-size:14px}
.curCtx .recall{border-left-color:var(--gold)}.curCtx .recall b{color:#f1c565}
.curCtx .voice b{filter:brightness(1.5)}.curCtx .voice b i{color:#d9cdb8}
.curCtx .voice.off{opacity:.7}
.curCtx .famLine{color:#e8dcc6;font-size:13.5px}
/* Bölüm sonu 'Unutulmayan anlar' alt başlığı okunur */
.chEnd .logList .logItem small{color:var(--muted)}
.chEnd .compare .logItem small,.chEnd .logItem small{color:#6c5f4d!important}
.curCtx>*{animation:ctxIn .45s ease-out both}.curCtx>*:nth-child(2){animation-delay:.12s}.curCtx>*:nth-child(3){animation-delay:.24s}.curCtx>*:nth-child(4){animation-delay:.36s}@keyframes ctxIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.famFx{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}.famFx em{font-style:normal;font-size:11.5px;font-weight:800;border-radius:999px;padding:2px 8px;background:rgba(255,255,255,.16);color:#f1c565}.famFx small{flex-basis:100%;font-size:11.5px;opacity:.8}.famLine .famFx em{background:var(--card-2);color:#7a5a12}.curCtx .famLine .famFx em{background:rgba(255,255,255,.16);color:#f1c565}
/* Perde v3: metin, görselin altına binen koyu cam bir kart (bottom sheet) */
.curBg{filter:blur(30px) brightness(.38) saturate(1.2)}
.curFrame{box-shadow:0 6px 22px rgba(0,0,0,.5)}
.curCap{flex:1 1 auto;min-height:0;margin-top:-26px;z-index:2;border-radius:26px 26px 0 0;border-top:1px solid rgba(241,197,101,.4);
  padding:24px 20px 88px;background:linear-gradient(180deg,rgba(30,24,18,.80),rgba(16,12,9,.94));
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 -10px 26px rgba(0,0,0,.4);overflow:auto}
.curCap:before{content:"";display:block;width:38px;height:4px;border-radius:4px;background:var(--gold);margin:-10px auto 16px;opacity:.85}
.curCap h1{font-size:30px;letter-spacing:.2px;margin-bottom:10px}
.curCap p{font-size:16.5px;line-height:1.55;color:#eadfca;text-shadow:none}
.curNext{right:18px;bottom:18px}
/* Perde v4: tutamaç yok, görsele binmez; metin bitince kart kapanır (dört köşe yuvarlak) */
.curCap{flex:0 0 auto;margin:14px 12px 0;border-radius:22px;border:1px solid rgba(241,197,101,.35);padding:20px 18px 20px;
  background:linear-gradient(180deg,rgba(30,24,18,.82),rgba(18,14,11,.92));box-shadow:0 8px 24px rgba(0,0,0,.4);overflow:visible}
.curCap:before{display:none}
.curtainArt{padding-bottom:84px;overflow:auto}
/* Perde v5: bulanık zemin yok; kendine özgü koyu petrol yeşili zemin (bölüm sonu mor-bordo, kavşak lacivertinden ayrı) */
.curBg{display:none}
.curtainArt{background:radial-gradient(120% 70% at 50% 0%,#1d3a3b 0%,#122526 45%,#0b1617 100%)}
.curCap{background:linear-gradient(180deg,rgba(9,19,20,.78),rgba(7,14,15,.9));border-color:rgba(241,197,101,.38);box-shadow:0 8px 22px rgba(0,0,0,.35)}
/* Perde v6: açık kâğıt kart, koyu mürekkep yazı */
.curCap{background:linear-gradient(180deg,#fbf3df 0%,#f3e6c8 100%);border:1px solid #cdb88c;box-shadow:0 10px 26px rgba(0,0,0,.45),inset 0 0 0 4px #fbf3df,inset 0 0 0 5px rgba(166,124,36,.35);color:#2a2118;padding:24px 22px}
.curCap h1{color:#1d1915;text-shadow:none;font-size:30px;margin-bottom:12px}
.curCap h1:after{content:"";display:block;width:44px;height:3px;border-radius:3px;background:var(--gold);margin-top:10px}
.curCap p{color:#3a2f24;font-size:16.5px;line-height:1.6;text-shadow:none}
.curCap .curRule{color:#8a6212}
.curCap .curRule:before{background:linear-gradient(90deg,transparent,#a67c24)}.curCap .curRule:after{background:linear-gradient(270deg,transparent,#a67c24)}
.curCap .curCtx .recall,.curCap .curCtx .voice{background:rgba(166,124,36,.10);color:#4c3f2e;font-style:italic}
.curCap .curCtx .recall b{color:#8a6212}
.curCap .curCtx .karneBox{color:#3a2f24}

/* aşağı kaydır tutamacı */
.screen{position:relative}
#scrollDn{position:absolute;right:12px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:30;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(20,30,32,.78);color:#f3e6c8;font-size:24px;line-height:36px;padding:0;cursor:pointer;box-shadow:0 3px 12px rgba(0,0,0,.35);animation:dnBob 1.8s ease-in-out infinite}
#scrollDn[hidden]{display:none}
@keyframes dnBob{0%,100%{transform:translateY(0)}50%{transform:translateY(3px)}}
.panel{scrollbar-width:thin;scrollbar-color:rgba(120,100,70,.55) transparent}
.panel::-webkit-scrollbar{width:4px}.panel::-webkit-scrollbar-thumb{background:rgba(120,100,70,.55);border-radius:4px}

/* kavşak: her yön kendi görseli (kavsak-yol.js) */
.fkNew .fkImg{width:100%;height:100%;object-fit:cover}
.fkNew .fkL .fkImg{left:0;filter:saturate(1.05) brightness(.82)}
.fkNew .fkR .fkImg{right:0;left:auto;filter:saturate(.95) brightness(.74)}
.fkNew .fkTxt b{font-size:12px}
.fkNew .fkR .fkTxt{left:36px}.fkNew .fkL .fkTxt{right:36px}
.kvGate .forkArt.fkNew{flex-basis:172px;height:172px}
/* Devam düğmesi: alt çubukta sabit; içerik uzarsa altından kayar, kartın üstüne binmez */
.curtainArt{padding-bottom:0}
.curBar{position:sticky;bottom:0;z-index:5;margin-top:auto;flex:0 0 auto;display:flex;justify-content:flex-end;padding:22px 16px 16px;background:linear-gradient(180deg,rgba(11,22,23,0),rgba(11,22,23,.92) 38%)}
.curBar .curNext{position:static;margin:0;right:auto;bottom:auto}
.curtainArt .curCap{margin-bottom:0}
/* kavşak v2: parlak görsel, hafif renk tonu, doğru eğimli ayraç */
.fkNew .fkL .fkImg,.fkNew .fkR .fkImg{filter:none;object-position:center}
.fkNew .fkL:before{background:linear-gradient(180deg,rgba(40,150,90,.16) 0%,rgba(0,0,0,0) 40%,rgba(8,14,12,.82) 100%)}
.fkNew .fkR:before{background:linear-gradient(180deg,rgba(190,60,50,.16) 0%,rgba(0,0,0,0) 40%,rgba(20,8,8,.82) 100%)}
.fkNew .fkSeam{transform:skewX(-7.3deg);width:3px;left:calc(50% - 1.5px)}
.fkNew .fkL,.fkNew .fkR{width:54%}
.fkNew .fkL{clip-path:polygon(0 0,100% 0,calc(100% - 22px) 100%,0 100%)}
.fkNew .fkR{clip-path:polygon(22px 0,100% 0,100% 100%,0 100%)}
.fkNew .fkL,.fkNew .fkR{width:56%}
.fkNew .fkSeam{width:4px;left:calc(50% - 2px);background:linear-gradient(180deg,#f1c565,#c69a3c);box-shadow:0 0 0 1px rgba(0,0,0,.35),0 0 12px rgba(241,197,101,.7)}
