/* Katibem Butik — Hikayeler (halka + viewer) */
.kb-stories{padding:20px 0 14px;background:#fff;border-bottom:1px solid var(--line)}
.kb-stories-row{display:flex;gap:20px;overflow-x:auto;padding:4px 2px 10px;scrollbar-width:none}
.kb-stories-row::-webkit-scrollbar{display:none}
.kb-story{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:8px;background:none;border:none;padding:0;width:76px;cursor:pointer}
.kb-story-ring{display:block;width:72px;height:72px;border-radius:50%;padding:3px;
  background:conic-gradient(from 210deg,var(--clay),var(--gold),var(--rose),var(--clay));transition:background .3s}
.kb-story.seen .kb-story-ring{background:var(--line-2)}
.kb-story-thumb{display:block;width:100%;height:100%;border-radius:50%;background:var(--bg-2) center/cover no-repeat;border:2px solid #fff}
.kb-story-label{font-size:11.5px;color:var(--ink-2);max-width:76px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}
.kb-story:hover .kb-story-thumb{transform:scale(1.03)}

/* Viewer */
.kb-viewer{position:fixed;inset:0;z-index:120;background:rgba(20,18,17,.96);display:flex;align-items:center;justify-content:center}
.kb-viewer[hidden]{display:none}
.kb-v-media{position:relative;width:min(440px,100vw);height:100vh;max-height:100vh;display:flex;align-items:center;justify-content:center;background:#000}
.kb-v-media img,.kb-v-media video{width:100%;height:100%;object-fit:contain;background:#000}
.kb-v-bars{position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(440px,100vw);display:flex;gap:4px;padding:12px 12px 0;z-index:5}
.kb-v-bar{flex:1;height:3px;background:rgba(255,255,255,.3);border-radius:3px;overflow:hidden}
.kb-v-bar i{display:block;height:100%;width:0;background:#fff}
.kb-v-close{position:absolute;top:14px;right:16px;z-index:6;background:none;border:none;color:#fff;font-size:34px;line-height:1;cursor:pointer;opacity:.9}
.kb-v-tap{position:absolute;top:0;bottom:0;width:35%;z-index:4;cursor:pointer}
.kb-v-prev{left:0}
.kb-v-next{right:0;width:65%}
.kb-v-cta{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);z-index:6;display:inline-flex;align-items:center;gap:6px;
  background:#fff;color:var(--ink);font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:13px 30px;border-radius:var(--radius)}
.kb-v-cta:hover{background:var(--clay);color:#fff}
@media(max-width:600px){ .kb-v-media,.kb-v-bars{width:100vw} }