/* İlerleme, yanlış defteri, kavram kartları, günün sorusu, yardım penceresi, künye */

/* ---------- İlerleme çubukları ---------- */
.pbar{height:6px;border-radius:9px;background:var(--line);overflow:hidden;flex:1;min-width:60px}
.pbar i{display:block;height:100%;border-radius:9px;background:var(--c,var(--accent));transition:width .4s ease}
.pbar-l{font:600 .74rem var(--font-mono);color:var(--ink-3);min-width:36px;text-align:right}
.tc-prog,.theme-prog{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:8px}
.theme-prog{max-width:420px;margin-top:16px}
.theme-card li.done{color:var(--ink)}
.theme-card li.done span{color:var(--green)}
.theme-card li.done span::after{content:" ✓"}
.topic-card .pbar{flex:none;margin-top:6px}
.steps{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px}
.step{font-size:.78rem;font-weight:600;padding:3px 10px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-3);background:var(--paper)}
.step.ok{border-color:color-mix(in srgb,var(--green) 50%,transparent);color:var(--green);background:color-mix(in srgb,var(--green) 9%,var(--paper))}
.step-p{font:600 .8rem var(--font-mono);color:var(--c,var(--accent));margin-left:4px}

/* Kenar menüde konu ilerleme halkası */
.side-topic[data-tp]::after{content:"";flex:none;margin:4px 0 0 auto;width:10px;height:10px;border-radius:50%;background:conic-gradient(var(--c) calc(var(--p,0)*1%),var(--line) 0)}
.side-topic.done::after{background:var(--c);box-shadow:0 0 0 2px var(--paper),0 0 0 3px var(--c)}
button.side-link{width:100%;border:0;background:none;cursor:pointer;text-align:left;font:inherit;font-weight:500;font-size:.93rem}
.side-link .count{margin-left:auto;min-width:22px;height:20px;padding:0 6px;border-radius:999px;background:var(--red);color:var(--bg);font:700 .72rem/20px var(--font-mono);text-align:center}
.side-link .count[hidden]{display:none}
.side-credit{margin:22px 10px 0;padding-top:12px;border-top:1px dashed var(--line);font-size:.7rem;color:var(--ink-3);letter-spacing:.02em}

/* ---------- Boş durum ---------- */
.empty{padding:40px 24px;text-align:center;margin-top:20px}
.empty-ico{width:56px;height:56px;margin:0 auto 12px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--green) 14%,transparent);color:var(--green);font-size:1.6rem;font-weight:700}

/* ---------- Kavram kartları ---------- */
.flash-wrap{perspective:1400px;max-width:660px;margin:24px auto 12px}
.flash{height:320px;cursor:pointer;outline:none;border-radius:22px}
.flash:focus-visible{box-shadow:0 0 0 3px var(--soft)}
.flash-in{position:relative;width:100%;height:100%;transition:transform .55s cubic-bezier(.3,.7,.3,1);transform-style:preserve-3d}
.flash.flip .flash-in{transform:rotateY(180deg)}
.flash-f,.flash-b{position:absolute;inset:0;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:22px;border:1px solid var(--line);border-top:5px solid var(--c,var(--accent));background-color:var(--paper);
  background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:22px 22px;
  box-shadow:var(--shadow-lg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:28px;text-align:center}
.flash-b{transform:rotateY(180deg)}
.flash-f b{font:600 clamp(1.7rem,5vw,2.7rem)/1.15 var(--font-display);letter-spacing:-.01em}
.flash-def{font-size:clamp(1.05rem,2.4vw,1.3rem);line-height:1.55;max-width:46ch;margin:0}
.flash-bar{display:flex;align-items:center;gap:12px;max-width:660px;margin:0 auto 14px}
.flash-nav{justify-content:center;margin-bottom:10px}
@media (max-width:560px){.flash{height:300px}}

/* ---------- Günün sorusu ---------- */
.daily .qcard{border-top:4px solid var(--c);background-image:linear-gradient(135deg,color-mix(in srgb,var(--c) 6%,transparent),transparent 40%)}
.daily .qno{background:var(--c)}
.daily .qno::before{content:"☀ "}

/* ---------- Yardım penceresi ---------- */
.help-box{width:min(720px,100%);padding:20px 22px 16px;max-height:84vh;overflow-y:auto}
.help-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
@media (max-width:620px){.help-grid{grid-template-columns:1fr}}
.kb{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px dashed var(--line);font-size:.88rem}
.kb span:last-child{color:var(--ink-2);text-align:right}

/* ---------- Künye ---------- */
.site-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 24px;margin-top:44px;padding-top:16px;border-top:1px solid var(--line);font-size:.78rem;color:var(--ink-3)}
.site-foot span:first-child{max-width:70ch}
.credit-line{font-size:.72rem;color:var(--ink-3);letter-spacing:.03em;margin:14px 0 0}
.site-foot .credit-line{margin:0}
@media print{.side-credit,.site-foot{display:none}}