:root{--bg: #0f1117;--surface: #1a1d27;--border: #2a3042;--text: #e8ecf4;--muted: #8b95a8;--accent: #5b8def;--accent-hover: #7aa3f5;--success: #3ecf8e;--warn: #e8b84a;--error: #ef6b6b;--radius: 10px;--font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.5}.app{max-width:680px;margin:0 auto;padding:1.5rem 1rem 3rem}.header h1{margin:0;font-size:1.75rem;font-weight:700}.subtitle{margin:.35rem 0 0;color:var(--muted);font-size:.9rem;line-height:1.55}.role-card{margin:1.5rem 0 1rem;padding:1rem 1.1rem;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface)}.role-card[data-mode=send]{border-color:#5b8def73;background:linear-gradient(135deg,rgba(91,141,239,.1),var(--surface) 55%)}.role-card[data-mode=receive]{border-color:#3ecf8e73;background:linear-gradient(135deg,rgba(62,207,142,.1),var(--surface) 55%)}.role-eyebrow{margin:0 0 .25rem;font-size:.75rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.role-title{margin:0;font-size:1.2rem;font-weight:600;line-height:1.3}.role-summary{margin:.5rem 0 0;font-size:.9rem;color:var(--muted);line-height:1.5}.workflow{margin-bottom:1.25rem}.workflow-heading{margin:0 0 .65rem;font-size:.8rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}.workflow-steps{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:.5rem}.workflow-steps li{display:grid;grid-template-columns:1.75rem 1fr;gap:.35rem .75rem;padding:.75rem .85rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}.workflow-steps li:before{content:attr(data-step-num);grid-row:1 / span 2;grid-column:1;align-self:start;display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border-radius:50%;background:var(--border);color:var(--muted);font-size:.8rem;font-weight:600}.workflow-steps .step-title{grid-column:2;font-size:.95rem;font-weight:600;color:var(--text)}.workflow-steps .step-detail{grid-column:2;font-size:.82rem;color:var(--muted);line-height:1.45}.workflow-steps .step-detail code{font-size:.9em;padding:.1em .35em;border-radius:4px;background:#ffffff0f;color:var(--text)}.workflow-steps .step-action{display:none;grid-column:1 / -1;margin-top:.35rem;padding-top:.75rem;border-top:1px solid var(--border)}.workflow-steps li.active .step-action,.workflow-steps li.done .step-action--persist{display:block}.step-hint{margin:0;font-size:.85rem;color:var(--muted);line-height:1.45}.workflow-steps li.active{border-color:var(--accent);background:#5b8def14}.workflow-steps li.active:before{background:var(--accent);color:#fff}.workflow-steps li.done:not(:has(.step-action--persist)){opacity:.72}.workflow-steps li.done:has(.step-action--persist) .step-title,.workflow-steps li.done:has(.step-action--persist) .step-detail{opacity:.85}.workflow-steps li.done:before{background:var(--success);color:#fff;content:"\2713";font-size:.75rem}#workflow-receive .workflow-steps li.active{border-color:var(--success);background:#3ecf8e14}#workflow-receive .workflow-steps li.active:before{background:var(--success)}.status-block{margin:0 0 1.25rem}.status-label{margin:0 0 .35rem;font-size:.8rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}.status{padding:.65rem .9rem;border-radius:var(--radius);background:var(--surface);font-size:.9rem;margin:0}.status.connecting{border-left:3px solid var(--warn)}.status.connected{border-left:3px solid var(--success)}.status.failed{border-left:3px solid var(--error)}.drop-zone{border:2px dashed var(--border);border-radius:var(--radius);padding:2.5rem 1rem;text-align:center;cursor:pointer;transition:border-color .15s,background .15s}.drop-zone:hover:not(.disabled),.drop-zone.dragover{border-color:var(--accent);background:#5b8def0f}.drop-zone.disabled{opacity:.55;cursor:not-allowed}.drop-zone.disabled p{color:var(--muted)}.drop-zone p{margin:0;color:var(--muted)}.file-info{margin:.75rem 0;font-size:.9rem;color:var(--muted)}.setting{display:block;margin:1rem 0;font-size:.85rem;color:var(--muted)}.setting input[type=number]{display:block;width:100%;margin-top:.35rem;padding:.5rem .65rem;border:1px solid var(--border);border-radius:6px;background:var(--surface);color:var(--text);font:inherit}.setting.checkbox{display:flex;align-items:center;gap:.5rem;cursor:pointer}.setting.checkbox input{width:auto}.receive-storage{padding:0;border:none;border-radius:0;background:transparent}.receive-storage-heading{margin:0 0 .65rem;font-size:.95rem;font-weight:600}.receive-folder-status{margin:.65rem 0 0;font-size:.85rem;color:var(--muted)}.save-file-prompt{margin-top:.75rem;padding:.75rem;border:1px solid var(--warn);border-radius:var(--radius);background:#e8b84a1a}.save-file-prompt p{margin:0 0 .75rem;font-size:.9rem}.saved-badge{flex-shrink:0;display:inline-block;padding:.35rem .65rem;border-radius:6px;background:#3ecf8e26;color:var(--success);font-size:.8rem;font-weight:500;line-height:1.2}.app button.saved-badge{border:none;cursor:default;font-size:.8rem;font-weight:500}.hidden{display:none!important}.paste-section{margin:0;padding:0;border:none;border-radius:0;background:transparent}.paste-section label{display:block;font-size:.95rem;font-weight:600;color:var(--text);margin-bottom:.5rem}.send-file-block{margin:0}.paste-section textarea{width:100%;padding:.6rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font:inherit;resize:vertical}.paste-section textarea:disabled{opacity:.7;cursor:not-allowed}.paste-feedback{margin:.65rem 0 0;padding:.55rem .7rem;border-radius:6px;font-size:.85rem;line-height:1.45}.paste-feedback.hidden{display:none}.paste-feedback--info{background:#5b8def1f;color:var(--text)}.paste-feedback--success{background:#3ecf8e1f;color:var(--success)}.paste-feedback--error{background:#ef6b6b1f;color:var(--error)}.paste-section.paste-section--done .paste-feedback--success{display:block}.send-file-hint{margin:0 0 .65rem;font-size:.85rem;color:var(--muted);line-height:1.45}.share-section{margin:0;padding:0;border:none;border-radius:0;background:transparent}.share-section h2{margin:0 0 .35rem;font-size:.95rem;font-weight:600}.share-instruction{margin:0 0 .75rem;font-size:.9rem;color:var(--text)}#share-url{width:100%;padding:.55rem .65rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font-size:.8rem}.share-actions{margin-top:.75rem}.app button,.app button[type=button],.app button[type=submit],.app button[type=reset]{appearance:none;-webkit-appearance:none;-moz-appearance:none;margin:0;box-shadow:none;background-image:none;font:inherit;line-height:1.2;-webkit-tap-highlight-color:transparent}.app button:focus{outline:none}.app button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.app button:disabled{opacity:.65;cursor:not-allowed}.app .btn{display:inline-block;padding:.6rem 1.1rem;border:none;border-radius:var(--radius);background:var(--accent);color:#fff;font-weight:500;cursor:pointer;text-decoration:none;transition:background .15s}.app .btn:hover:not(:disabled){background:var(--accent-hover)}.app .btn.secondary{background:var(--surface);border:1px solid var(--border);color:var(--text);margin-top:.5rem}.app .btn.secondary:hover:not(:disabled){background:var(--border)}.retry-hint{margin:.5rem 0 0;font-size:.8rem;color:var(--warn);text-align:center}.retry-hint:empty{display:none}.progress-section{margin-top:1.5rem}.progress-text:empty{display:none}.progress-section:has(.progress-text:empty) .progress-track{display:none}.progress-section:has(.progress-text:empty){margin-top:0}.progress-track{height:6px;background:var(--surface);border-radius:3px;overflow:hidden}.progress-bar{height:100%;width:0%;background:var(--accent);transition:width .2s ease}.progress-text{margin:.5rem 0 0;font-size:.85rem;color:var(--muted)}.download-section{margin-top:1.25rem}.downloads-heading{margin:0 0 .75rem;font-size:1rem}.downloads-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}.downloads-list li{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.65rem .75rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}.downloads-list .file-name{font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.app .download-btn{flex-shrink:0;display:inline-block;padding:.45rem .85rem;border:none;border-radius:6px;background:var(--success);color:#fff;font-size:.85rem;font-weight:500;text-decoration:none;cursor:pointer;transition:filter .15s}.app button.download-btn{appearance:none;-webkit-appearance:none;-moz-appearance:none;box-shadow:none;background-color:var(--success);background-image:none}.app .download-btn:hover:not(:disabled){filter:brightness(1.08)}.app button.download-btn:disabled{cursor:wait}@media (max-width: 480px){.app{padding:1rem .75rem 2rem}.drop-zone{padding:2rem .75rem}}