*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0f0f0f;min-height:100vh;color:#e0e0e0}.container{min-height:100vh;display:flex;flex-direction:column}.loading{flex:1;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:gray}.header{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;background:#1a1a1a;border-bottom:1px solid #2a2a2a;position:relative}.header-brand{font-size:1.25rem;font-weight:700;color:#fff;letter-spacing:-.02em}.header-brand.clickable{cursor:pointer;transition:opacity .15s}.header-brand.clickable:hover{opacity:.7}.header-center{display:flex;align-items:center;gap:8px;position:absolute;left:50%;transform:translate(-50%)}.refresh-btn{background:transparent;border:none;font-size:1rem;cursor:pointer;padding:4px;opacity:.6;transition:opacity .2s}.refresh-btn:hover{opacity:1}.username,.session-label,.connected-label{font-weight:600;color:#e0e0e0}.connected-label{color:#4caf50}.status-badge{font-size:.75rem;padding:4px 8px;border-radius:12px;font-weight:500}.status-badge.waiting{background:#ffa72633;color:#ffa726}.status-badge.connected{background:#4caf5033;color:#4caf50}.container.fullscreen{height:100vh;display:flex;flex-direction:column}.split-layout{flex:1;display:flex;overflow:hidden}.files-pane{flex:1;display:flex;flex-direction:column;overflow-y:auto}.chat-pane{width:400px;border-left:1px solid #2a2a2a;display:flex;flex-direction:column}.chat-pane .chat-container{flex:1;display:flex;flex-direction:column;border:none;border-radius:0;margin:0}.chat-pane .chat-messages{flex:1;height:auto}.share-banner{display:flex;align-items:center;gap:16px;background:#1a1a1a;border:1px solid #2a2a2a;border-radius:12px;padding:16px 20px;margin-bottom:24px}.share-code{display:flex;align-items:center;gap:8px;cursor:pointer}.share-code .code{font-size:1.25rem}.session-code{font-family:SF Mono,Monaco,Consolas,monospace;font-size:1.1rem;font-weight:600;letter-spacing:.1em;color:#4a9eff;cursor:pointer;padding:4px 12px;background:#4a9eff1a;border-radius:6px;transition:background .2s}.session-code:hover{background:#4a9eff33}.session-code-wrapper{display:flex;flex-direction:column;align-items:center}.session-code-row{display:flex;align-items:center;gap:4px}.session-code-hint{font-size:.65rem;color:#666;margin-top:2px}.qr-popout{position:absolute;top:100%;left:50%;transform:translate(-50%);margin-top:12px;background:#fff;padding:16px;border-radius:12px;box-shadow:0 8px 32px #0006;z-index:1000;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:8px;animation:popout-fade-in .15s ease-out}.qr-popout:before{content:"";position:absolute;top:-8px;left:50%;transform:translate(-50%);border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:8px solid white}.qr-popout .qr-code{width:180px;height:180px;display:block}.qr-popout .qr-hint{color:#666;font-size:.75rem;margin-top:4px}@keyframes popout-fade-in{0%{opacity:0;transform:translate(-50%) translateY(-8px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.peer-info{color:#4caf50;font-weight:500}.peer-info.warning{color:#ff9800}.lock-button{background:none;border:none;font-size:1rem;cursor:pointer;padding:4px 8px;border-radius:4px;transition:background .2s;opacity:.6}.lock-button:hover{background:#ffffff1a;opacity:1}.lock-button.locked{opacity:1}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:#1a1a1a;border:1px solid #2a2a2a;border-radius:12px;padding:24px;min-width:300px;max-width:400px}.modal h3{margin-bottom:8px;color:#fff}.modal p{margin-bottom:16px;color:gray;font-size:.9rem}.modal .input{width:100%;margin-bottom:16px}.modal-buttons{display:flex;justify-content:flex-end;gap:8px}.file-list{background:#1a1a1a;border:1px solid #2a2a2a;border-radius:12px;overflow:hidden}.file-list.full{flex:1;display:flex;flex-direction:column;border-radius:0;border:none}.pane-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#151515;border-bottom:1px solid #2a2a2a;font-size:.85rem;font-weight:600;color:gray;text-transform:uppercase;letter-spacing:.05em;min-height:44px}.file-list-header{display:flex;align-items:center;justify-content:space-between;padding:0 16px;background:#151515;border-bottom:1px solid #2a2a2a;font-size:.85rem;font-weight:600;color:gray;text-transform:uppercase;letter-spacing:.05em;height:49px}.header-action{background:transparent;border:1px solid #3a3a3a;color:gray;padding:4px 12px;border-radius:6px;font-size:.8rem;cursor:pointer;transition:all .2s;text-transform:none;letter-spacing:normal;font-weight:500}.header-action:hover{border-color:#4a9eff;color:#4a9eff}.file-list-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:48px 24px;color:#606060}.empty-icon{font-size:3rem;opacity:.5}.empty-text{font-size:1rem;color:gray}.empty-hint{font-size:.85rem;color:#505050}.file-row{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid #2a2a2a}.file-row:last-child{border-bottom:none}.file-icon{font-size:1.25rem;flex-shrink:0}.file-direction{font-size:.9rem;color:gray;flex-shrink:0}.file-name{flex:1;font-weight:500;color:#e0e0e0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-size{font-size:.85rem;color:#606060;flex-shrink:0}.file-status{font-size:.8rem;font-weight:600;flex-shrink:0}.file-status.queued{color:#ffa726}.file-status.ready{color:#4a9eff}.file-status.requesting,.file-status.uploading{color:#ffa726}.file-status.complete{color:#4caf50}.file-status.verified{display:flex;align-items:center;gap:4px}.verified-check{color:#4caf50;font-size:.9rem;font-weight:700}.file-uploader{color:gray;font-size:.8rem;max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.guest-upload-toggle{background:transparent;border:none;font-size:.9rem;cursor:pointer;padding:4px 6px;border-radius:4px;opacity:.6;transition:all .2s}.guest-upload-toggle:hover{opacity:1;background:#ffffff1a}.guest-upload-toggle.enabled{opacity:1;background:#4caf5033}.table-link{color:#4a9eff;cursor:pointer;font-size:.85rem;text-decoration:none}.table-link:hover{text-decoration:underline}.upload-count{color:#4caf50;font-size:.8rem;margin-left:4px}.file-progress{display:flex;align-items:center;gap:8px;flex-shrink:0}.progress-bar-inline{width:80px;height:4px;background:#2a2a2a;border-radius:2px;overflow:hidden}.progress-text{font-size:.8rem;color:#4a9eff;font-family:SF Mono,Monaco,Consolas,monospace}.chat-fab{display:none;position:fixed;bottom:24px;right:24px;width:56px;height:56px;border-radius:50%;background:#4a9eff;color:#fff;border:none;font-size:1.5rem;cursor:pointer;box-shadow:0 4px 12px #0000004d;z-index:1000;transition:transform .2s,background .2s}.chat-fab:hover{transform:scale(1.1);background:#3d8ee6}.chat-badge{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 6px;background:#f44336;color:#fff;border-radius:10px;font-size:.75rem;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #0000004d}.center-box{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;max-width:480px;margin:0 auto;width:100%}.title{font-size:2.5rem;font-weight:700;margin-bottom:8px;color:#fff;letter-spacing:-.02em}.subtitle{font-size:1.1rem;color:gray;margin-bottom:40px}.waiting-title{font-size:1.5rem;font-weight:600;margin-bottom:8px;color:#e0e0e0}.waiting-subtitle{font-size:1rem;color:gray;margin-bottom:32px}.connection-stages{display:flex;gap:24px;margin-bottom:32px}.stage{display:flex;flex-direction:column;align-items:center;gap:8px;opacity:.4;transition:opacity .3s}.stage.active,.stage.done{opacity:1}.stage-emoji{font-size:2rem}.stage.active .stage-emoji{animation:pulse 1.5s ease-in-out infinite}.stage-text{font-size:.85rem;color:gray}.stage.active .stage-text{color:#4a9eff}.stage.done .stage-text{color:#4caf50}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.form-group{width:100%;margin-bottom:24px}.input{width:100%;padding:14px 16px;font-size:1rem;background:#1a1a1a;border:2px solid #2a2a2a;border-radius:10px;color:#e0e0e0;outline:none;transition:border-color .2s}.input:focus{border-color:#4a9eff}.input::placeholder{color:#606060}.hint{font-size:.85rem;color:#606060;margin-top:8px}.code-input{font-family:SF Mono,Monaco,Consolas,monospace;font-size:1.2rem;letter-spacing:.2em;text-align:center;text-transform:uppercase}.button{padding:14px 24px;font-size:1rem;font-weight:600;border:none;border-radius:10px;cursor:pointer;transition:all .2s}.button.primary{background:#4a9eff;color:#fff}.button.primary:hover:not(:disabled){background:#3d8ee6;transform:translateY(-1px)}.button.primary:disabled{background:#2a2a2a;color:#606060;cursor:not-allowed}.button.text{background:transparent;color:gray;padding:8px 16px}.button.text:hover{color:#e0e0e0}.button.text.danger:hover{color:#ff6b6b}.button.small{padding:8px 16px;font-size:.9rem}.button.full{width:100%}.button.large{padding:18px 32px;font-size:1.1rem}.divider{display:flex;align-items:center;width:100%;margin:32px 0}.divider:before,.divider:after{content:"";flex:1;height:1px;background:#2a2a2a}.divider span{padding:0 16px;color:#606060;font-size:.9rem}.join-row{display:flex;gap:12px;width:100%}.join-row .input{flex:1}.code-display{display:flex;align-items:center;gap:16px;background:#1a1a1a;border:2px solid #2a2a2a;border-radius:12px;padding:16px 24px;cursor:pointer;transition:border-color .2s;margin-bottom:24px}.code-display:hover{border-color:#4a9eff}.code{font-family:SF Mono,Monaco,Consolas,monospace;font-size:2rem;font-weight:700;letter-spacing:.15em;color:#4a9eff}.copy-btn{background:#2a2a2a;color:gray;border:none;padding:8px 12px;border-radius:6px;font-size:.85rem;cursor:pointer;transition:all .2s}.copy-btn:hover{background:#3a3a3a;color:#e0e0e0}.qr-container{background:#fff;padding:16px;border-radius:12px;margin-bottom:24px}.qr-code{display:block;width:200px;height:200px}.share-url{font-size:.9rem;color:#606060;font-family:SF Mono,Monaco,Consolas,monospace}.main-content{flex:1;padding:24px;max-width:640px;margin:0 auto;width:100%}.container.drag-over{position:relative}.drop-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#4a9eff26;border:4px dashed #4a9eff;display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:600;color:#4a9eff;z-index:1000;pointer-events:none}.drop-hint-banner{display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 24px;background:#1a1a1a;border:1px solid #2a2a2a;border-radius:12px;margin-bottom:24px;text-align:center;color:gray;cursor:pointer;transition:all .2s}.drop-hint-banner:hover{border-color:#4a9eff;color:#e0e0e0}.drop-hint-banner .link-button{background:none;border:none;color:#4a9eff;cursor:pointer;font-size:inherit;padding:0;text-decoration:underline}.drop-hint-banner .link-button:hover{color:#6ab0ff}.drop-hint-sub{font-size:.85rem;color:#606060}.header-controls{display:flex;align-items:center;gap:12px}.ice-select{background:#1a1a1a;border:1px solid #2a2a2a;border-radius:6px;color:gray;padding:6px 10px;font-size:.85rem;cursor:pointer;outline:none}.ice-select:hover{border-color:#4a9eff;color:#e0e0e0}.ice-select:focus{border-color:#4a9eff}.connection-trouble{margin-top:32px;width:100%}.connection-trouble details{background:#ffffff08;border:1px solid #2a2a2a;border-radius:8px;padding:12px 16px}.connection-trouble summary{cursor:pointer;color:gray;font-size:.9rem;-webkit-user-select:none;user-select:none}.connection-trouble summary:hover{color:#4a9eff}.connection-trouble details[open] summary{margin-bottom:12px;color:#e0e0e0}.connection-trouble .trouble-hint{color:gray;font-size:.85rem;margin:8px 0}.connection-trouble .trouble-hint.small{font-size:.75rem;color:#666}.connection-trouble .ice-select{width:100%;margin-top:8px}.transfers{background:#1a1a1a;border-radius:12px;border:1px solid #2a2a2a;overflow:hidden}.transfers-title{font-size:.85rem;font-weight:600;color:gray;text-transform:uppercase;letter-spacing:.05em;padding:16px 20px;border-bottom:1px solid #2a2a2a}.transfer-item{display:flex;align-items:center;gap:16px;padding:16px 20px;border-bottom:1px solid #2a2a2a}.transfer-item:last-child{border-bottom:none}.transfer-icon{font-size:1.5rem;flex-shrink:0}.transfer-info{flex:1;min-width:0}.transfer-name{font-weight:600;color:#e0e0e0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:4px}.transfer-meta{font-size:.85rem;color:#606060}.transfer-actions{flex-shrink:0}.status-sent{color:#4caf50;font-weight:600}.status-available{color:#4a9eff;font-weight:600}.status-progress{color:#4a9eff;font-weight:600;font-family:SF Mono,Monaco,Consolas,monospace}.status-waiting{color:#ffa726;font-weight:600}.status-declined{color:#ef5350;font-weight:600}.transfer-actions{display:flex;gap:8px;align-items:center}.progress-bar{height:4px;background:#2a2a2a;border-radius:2px;margin-top:8px;overflow:hidden}.progress-fill{height:100%;background:#4a9eff;border-radius:2px;transition:width .1s ease-out}.share-section{text-align:center;margin-bottom:24px}.share-section .code-display{display:inline-flex;margin-bottom:8px}.share-section .share-url{margin:0}.share-link{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:8px}.share-link .share-url{color:#888;font-size:13px;font-family:SF Mono,Monaco,Consolas,monospace}.header-left{display:flex;align-items:center;gap:12px}.session-info{background:#2a2a2a;padding:4px 10px;border-radius:6px;font-family:SF Mono,Monaco,Consolas,monospace;font-size:12px;color:#888;cursor:pointer;transition:background .2s,color .2s}.session-info:hover{background:#3a3a3a;color:#fff}.chat-container{background:#1a1a1a;border:1px solid #2a2a2a;border-radius:12px;margin-top:24px;overflow:hidden}.chat-header{display:flex;align-items:center;justify-content:space-between;padding:0 16px;background:#151515;border-bottom:1px solid #2a2a2a;font-size:.85rem;font-weight:600;color:gray;text-transform:uppercase;letter-spacing:.05em;height:49px}.chat-messages{height:200px;overflow-y:auto;padding:12px 16px;font-family:SF Mono,Monaco,Consolas,monospace;font-size:.9rem;line-height:1.5}.chat-empty{color:#606060;font-style:italic}.chat-line{margin-bottom:4px;word-wrap:break-word}.chat-sender{color:#4a9eff;margin-right:8px}.chat-text{color:#e0e0e0}.chat-input-form{display:flex;border-top:1px solid #2a2a2a}.chat-input{flex:1;background:#0f0f0f;border:none;padding:12px 16px;color:#e0e0e0;font-family:SF Mono,Monaco,Consolas,monospace;font-size:.9rem;outline:none}.chat-input::placeholder{color:#606060}.chat-send{background:#4a9eff;color:#fff;border:none;padding:12px 20px;font-weight:600;cursor:pointer;transition:background .2s}.chat-send:hover{background:#3d8ee6}@media (max-width: 768px){.header{padding:12px 16px}.header-brand{font-size:1rem}.header-center{gap:4px}.username,.refresh-btn{display:none}.status-badge{font-size:.65rem;padding:2px 6px}.ice-select{display:none}.center-box{padding:24px 16px}.title{font-size:2rem}.code{font-size:1.5rem}.main-content{padding:16px}.drop-zone{padding:32px 16px}.drop-icon{font-size:2.5rem}.split-layout{flex-direction:column}.chat-pane{display:none;position:fixed;top:0;left:0;right:0;bottom:0;width:100%;background:#0f0f0f;z-index:999;border:none}.chat-pane.open{display:flex}.chat-fab{display:flex;align-items:center;justify-content:center}.chat-fab.chat-open{top:16px;bottom:auto;right:16px;width:44px;height:44px;font-size:1.2rem}.share-banner{flex-direction:column;gap:12px;text-align:center}.share-code .code{font-size:1.5rem}.file-row{flex-wrap:wrap;gap:8px}.file-name{order:1;flex-basis:100%;padding-left:36px;margin-top:-4px}.file-size{order:2;margin-left:auto}.session-code{font-size:.95rem;padding:4px 10px}.peer-info{font-size:.85rem}.chat-pane.open .chat-container{padding-top:60px}}