/* Csatolmányok (files.js): ötlethez és kívánsághoz. */
.kjf { display: grid; gap: 10px; }
.kjf-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.kjf-quota { height: 5px; }
.kjf-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.kjf-item { display: flex; gap: 12px; align-items: flex-start; padding: 10px; border-radius: 14px; background: rgba(10, 6, 30, .35); border: 1px solid var(--line); }
.kjf-thumb, .kjf-ico { flex: none; width: 64px; height: 64px; border-radius: 10px; overflow: hidden; background: var(--card2); }
.kjf-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kjf-ico { display: grid; place-items: center; font: 800 .74rem var(--sans); letter-spacing: .06em; color: var(--ink2); }
.kjf-audio .kjf-ico { color: var(--teal); }
.kjf-media { flex: none; width: 120px; max-height: 90px; border-radius: 10px; background: #000; }
.kjf-meta { min-width: 0; flex: 1; display: grid; gap: 3px; }
.kjf-meta b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .95rem; }
.kjf-meta > span { color: var(--mute); font-size: .82rem; }
.kjf-meta audio { width: 100%; height: 36px; margin: 4px 0 2px; }
.kjf-acts { display: flex; gap: 16px; }
.kjf-acts .link { font-size: .88rem; }
.kjf-drop { position: relative; display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; border: 2px dashed rgba(245, 196, 81, .45); cursor: pointer;
  background: rgba(245, 196, 81, .05); transition: background .2s, border-color .2s; }
.kjf-drop:hover, .kjf-drop.over, .kjf-drop:focus-within { border-color: var(--gold); background: rgba(245, 196, 81, .12); }
.kjf-drop input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.kjf-drop small { display: block; color: var(--mute); font-size: .84rem; margin-top: 2px; }
.kjf-plus { flex: none; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--gold); color: var(--btn); font: 900 1.4rem/1 var(--sans); }
.kjf-prog { display: grid; gap: 6px; padding: 10px 12px; border-radius: 14px; background: rgba(63, 193, 208, .08); border: 1px solid rgba(63, 193, 208, .4); }
.kjf-prog[hidden], .kjf-drop[hidden] { display: none; }
.kjf-prog .kjf-pname { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kjf-prog .bar-v i { transition: width .2s; }
.kjf .err:empty { display: none; }
.kjf-note { margin: 0; }
@media (max-width: 520px) { .kjf-media { width: 96px; } }
