/* ClipSync files.css — угловая кнопка выбора файла, кольцо прогресса,
   панель очереди и элементы очереди.
   ВНИМАНИЕ: .corner-btn применяется и к #swap-badge (class="corner-btn
   swap-badge"), чьи правила лежат в clipboard.css. Подробности инверсии
   каскада — в decomposition-index-php.md, раздел 12. */

/* .queue/.queue-item базовые правила перекрыты Variant B (.file-panel .queue*
   ниже) — актуальная разметка queue-item живёт внутри .file-panel. */

.corner-btn { position:absolute; width:44px; height:44px; border-radius:50%; background:var(--surface2); border:1px solid var(--border2); display:flex; align-items:center; justify-content:center; color:var(--text); cursor:pointer; z-index:8; transition:border-color .2s,box-shadow .2s,transform .15s; }
.file-corner { top:-8px; left:-8px; bottom:auto; } .file-corner:hover { border-color:var(--teal); box-shadow:0 0 16px rgba(56,229,196,.4); } .file-corner input{display:none}.file-corner svg{width:18px;height:18px}
.file-corner .ring-progress { position:absolute; inset:0; width:44px; height:44px; transform:rotate(-90deg); } .file-corner .ring-progress circle{fill:none;stroke-width:3;stroke:var(--border2)} .file-corner .ring-progress circle.bar{stroke:var(--violet);stroke-linecap:round;stroke-dasharray:116;stroke-dashoffset:116;transition:stroke-dashoffset .3s}
.file-corner.transferring { border-color:var(--violet); animation:corner-pulse 1.6s infinite; } @keyframes corner-pulse{0%,100%{box-shadow:0 0 0 0 rgba(155,123,255,.4)}50%{box-shadow:0 0 0 6px rgba(155,123,255,0)}} .pct-label{position:absolute;font-size:8px;font-weight:700;color:var(--violet);z-index:1}

.file-panel { position:absolute; top:-8px; left:44px; width:280px; background:var(--surface2); border:1px solid var(--border2); border-radius:10px; box-shadow:0 20px 50px rgba(0,0,0,.55); padding:10px; z-index:50; opacity:0; transform:translateY(-6px) scale(.96); pointer-events:none; transition:opacity .2s,transform .2s; }
.file-panel.visible { opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }.file-panel-head{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:2px 6px 8px;display:flex;justify-content:space-between}.pick-label{color:var(--teal);cursor:pointer}.pick-label input{display:none}
.file-panel .queue{max-height:260px;overflow-y:auto;gap:5px}.file-panel .queue-item{display:grid;grid-template-columns:14px minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:7px 9px}.queue-item.active{border-color:var(--violet);background:rgba(155,123,255,.08)}.queue-item.done{color:var(--teal);opacity:.85}.queue-item.error,.queue-item.cancelled{color:var(--red)}.qi-icon{width:14px;height:14px}.qi-icon svg{width:14px;height:14px}.queue-meta{font-size:10px;white-space:nowrap}.queue-cancel{background:none;border:none;color:var(--muted);cursor:pointer;padding:2px 4px}.queue-cancel:hover{color:var(--red)}.qprogress{grid-column:2/5;width:100%;height:3px;border-radius:2px;background:var(--border2);overflow:hidden}.qprogress i{display:block;height:100%;background:var(--violet)}.queue-empty{font-size:11px;color:var(--muted);text-align:center;padding:14px 0}