.paf-transfer { position: fixed; top: 14px; right: 16px; z-index: 80; width: max-content; max-width: calc(100vw - 24px); font: 13px/1.35 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #f5f7ff; user-select: none; -webkit-user-select: none; } .paf-transfer-toggle { position: relative; display: inline-flex; align-items: center; gap: 10px; min-width: 154px; height: 58px; border: 1px solid rgba(255,220,112,.62); border-radius: 999px; padding: 5px 42px 5px 6px; color: #fff8d7; background: linear-gradient(135deg, rgba(25,18,41,.95), rgba(10,42,48,.93) 54%, rgba(38,29,20,.94)); box-shadow: 0 0 0 1px rgba(88,214,255,.18), 0 14px 42px rgba(0,0,0,.44), 0 0 30px rgba(255,220,112,.18); cursor: pointer; backdrop-filter: blur(14px); transform: translateZ(0); transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; overflow: hidden; } .paf-transfer-toggle:hover, .paf-transfer-open .paf-transfer-toggle { border-color: rgba(255,220,112,.94); box-shadow: 0 0 0 1px rgba(255,220,112,.25), 0 18px 54px rgba(0,0,0,.48), 0 0 42px rgba(97,224,255,.28); transform: translateY(-1px); } .paf-transfer-label span { font-size: 11px; color: #9beaff; line-height: 1; } .paf-transfer-badge { position: absolute; top: 8px; right: 11px; min-width: 22px; height: 22px; display: none; place-items: center; padding: 0 6px; border-radius: 999px; color: #170f18; background: #ffdc70; font-size: 11px; font-weight: 900; box-shadow: 0 0 0 2px rgba(17,16,33,.92), 0 0 18px rgba(255,220,112,.55); } .paf-transfer-toast { width: 100%; padding: 9px; border: 1px solid rgba(255,220,112,.38); border-radius: 8px; color: #fff8d7; background: rgba(14,15,27,.96); box-shadow: 0 16px 46px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.08); opacity: 0; transform: translateY(-6px) scale(.98); animation: paf-toast 5s ease both; } .paf-transfer-toast-title { color: #fff8d7; font-weight: 850; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .paf-transfer-toast-sub { margin-top: 2px; color: #9beaff; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .paf-transfer-kicker { color: #75f0a6; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; } .paf-transfer-title { color: #fff8d7; font-size: 16px; font-weight: 850; letter-spacing: 0; } .paf-transfer-subtitle { margin-top: 1px; color: #98a6ba; font-size: 12px; } .paf-transfer-close { width: 30px; height: 30px; border: 1px solid rgba(255,255,255,.08); border-radius: 8px; color: #cbd2df; background: rgba(255,255,255,.04); cursor: pointer; font: inherit; font-size: 18px; line-height: 1; } .paf-transfer-close:hover { border-color: rgba(255,220,112,.36); background: rgba(255,255,255,.08); color: #fff; } .paf-transfer-drop { position: relative; min-height: 118px; display: grid; align-content: center; gap: 8px; padding: 16px; border: 1px dashed rgba(255,220,112,.38); border-radius: 8px; color: #d6deec; text-align: center; background: linear-gradient(180deg, rgba(97,224,255,.10), rgba(255,255,255,.025)); transition: border-color .16s ease, background .16s ease, transform .16s ease; overflow: hidden; } .paf-transfer-drop-title { color: #fff; font-size: 15px; font-weight: 800; } .paf-transfer-drop-copy { color: #9baac0; font-size: 12px; } .paf-transfer-drop.paf-transfer-hot { border-color: #ffdc70; color: #fff; background: linear-gradient(180deg, rgba(255,220,112,.16), rgba(97,224,255,.10)); transform: translateY(-1px); } .paf-transfer-btn { min-height: 34px; border: 1px solid rgba(255,255,255,.13); border-radius: 8px; padding: 0 10px; color: #f5f7ff; background: rgba(255,255,255,.055); cursor: pointer; font: inherit; font-weight: 750; } .paf-transfer-btn:hover { border-color: rgba(97,224,255,.58); background: rgba(97,224,255,.12); } .paf-transfer-status { min-height: 20px; color: #98a6ba; overflow-wrap: anywhere; } .paf-transfer-list-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.08); color: #d6deec; font-size: 12px; font-weight: 800; } .paf-transfer-refresh { width: 28px; height: 28px; border: 1px solid rgba(255,255,255,.08); border-radius: 8px; color: #9beaff; background: rgba(255,255,255,.04); cursor: pointer; font: inherit; } .paf-transfer-refresh:hover { border-color: rgba(97,224,255,.48); background: rgba(97,224,255,.10); color: #fff; } .paf-transfer-file.paf-transfer-file-new { border-color: rgba(255,220,112,.48); background: rgba(255,220,112,.08); } .paf-transfer-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #f6f8ff; font-weight: 750; } .paf-transfer-size { color: #8fa0b8; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .paf-transfer-file a { min-height: 30px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(97,224,255,.34); border-radius: 8px; padding: 0 10px; color: #9beaff; background: rgba(97,224,255,.08); text-decoration: none; font-weight: 800; } .paf-transfer-file a:hover { border-color: rgba(255,220,112,.48); color: #fff8d7; background: rgba(255,220,112,.10); } .paf-transfer-empty { padding: 12px; border: 1px solid rgba(255,255,255,.07); border-radius: 8px; color: #8fa0b8; background: rgba(255,255,255,.03); text-align: center; } const target = document.querySelector('.xterm-helper-textarea') || document.querySelector('.xterm'); status.style.color = error ? '#ff8f9b' : '#8fa0b8';