:root{--bg-deep: #0a0a0f;--bg-surface: #12121a;--bg-elevated: #1a1a25;--accent: #00ffc8;--accent-dim: #00ffc840;--text: #e8e8f0;--text-muted: #888899;--border: #2a2a3a;--success: #00ff88;--warning: #f59e0b;--error: #ff4466;--font-display: "Outfit", system-ui, sans-serif;--font-mono: "JetBrains Mono", monospace;--radius: 12px;--radius-sm: 8px}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:var(--font-display);background:var(--bg-deep);color:var(--text);line-height:1.5;background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);background-size:60px 60px;background-position:-1px -1px}.beam-app{min-height:100%;display:flex;flex-direction:column;align-items:center;padding:3rem 1.5rem}header{text-align:center;margin-bottom:3rem}header .logo-link{text-decoration:none;color:inherit;display:inline-block;transition:transform .2s ease}header .logo-link:hover{transform:scale(1.02)}header .logo-link:hover h1 .accent{text-shadow:0 0 20px var(--accent)}header h1{font-size:3.5rem;font-weight:700;letter-spacing:-.03em;margin-bottom:.25rem}header .accent{color:var(--accent)}header .tagline{font-size:1rem;color:var(--text-muted);font-weight:300;letter-spacing:.1em;text-transform:uppercase}main{width:100%;max-width:480px;flex:1}.panel{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);padding:2rem;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.hidden{display:none!important}.mode-select{display:flex;flex-direction:column;align-items:stretch;gap:.75rem}.mode-btn{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:.5rem;padding:1rem;background:var(--bg-elevated);border:2px solid transparent;border-radius:var(--radius);color:var(--text);cursor:pointer;transition:all .2s}.mode-btn:hover{border-color:var(--accent);background:var(--accent-dim)}.mode-btn .icon{font-size:1.25rem;line-height:1}.mode-btn .label{font-size:1rem;font-weight:600;line-height:1;margin:0;display:inline}.mode-divider{color:var(--text-muted);font-size:.875rem;text-align:center}@media (min-width: 420px){.mode-select{flex-direction:row;align-items:center;gap:1.5rem}.mode-btn{flex:1;flex-direction:column;gap:.75rem;padding:2rem 1rem}.mode-btn .icon{font-size:2rem}.mode-btn .label{font-size:1.1rem}}.drop-zone{border:2px dashed var(--border);border-radius:var(--radius);padding:3rem 1.5rem;text-align:center;cursor:pointer;transition:all .2s}.drop-zone:hover,.drop-zone.dragover{border-color:var(--accent);background:var(--accent-dim)}.drop-icon{font-size:2.5rem;display:block;margin-bottom:1rem}.drop-zone p{color:var(--text-muted)}.drop-zone .link{color:var(--accent);cursor:pointer;text-decoration:underline}.file-info{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--bg-elevated);border-radius:var(--radius-sm);margin-bottom:1.5rem}.file-name{font-family:var(--font-mono);font-size:.9rem;color:var(--accent);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-size{font-size:.875rem;color:var(--text-muted);flex-shrink:0;margin-left:1rem}.passphrase-display{text-align:center;margin-bottom:1.5rem}.passphrase-display .label{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin-bottom:.75rem}.passphrase-code{font-family:var(--font-mono);font-size:1.75rem;font-weight:600;color:var(--accent);letter-spacing:.05em;margin-bottom:1rem}.copy-buttons{display:flex;gap:.75rem;justify-content:center}.copy-btn{background:transparent;border:1px solid var(--border);color:var(--text-muted);padding:.5rem 1rem;border-radius:var(--radius-sm);font-family:var(--font-display);font-size:.875rem;cursor:pointer;transition:all .2s}.copy-btn:hover{border-color:var(--accent);color:var(--accent)}.copy-btn.primary{background:var(--accent);border-color:var(--accent);color:var(--bg-deep)}.copy-btn.primary:hover{filter:brightness(1.1)}.status-message{text-align:center;padding:1rem;color:var(--text-muted)}.status-message .waiting:before{content:"";display:inline-block;width:8px;height:8px;background:var(--text-muted);border-radius:50%;margin-right:.5rem;animation:pulse 1.5s infinite}@keyframes pulse{0%,to{opacity:.3}50%{opacity:1}}.status-message .connected{color:var(--success)}.status-message .connected:before{content:"";display:inline-block;width:8px;height:8px;background:var(--success);border-radius:50%;margin-right:.5rem}.status-message .hashing{color:var(--accent)}.status-message .hashing:before{content:"";display:inline-block;width:8px;height:8px;background:var(--accent);border-radius:50%;margin-right:.5rem;animation:pulse .8s infinite}.progress-container{margin-top:1.5rem}.progress-bar{height:8px;background:var(--bg-elevated);border-radius:4px;overflow:hidden}.progress-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--accent),#00ff88);border-radius:4px;transition:width .2s ease}.progress-text{display:flex;justify-content:space-between;margin-top:.5rem;font-size:.875rem;color:var(--text-muted)}.passphrase-input{display:flex;align-items:center;gap:.5rem;margin-bottom:1.5rem}.passphrase-input input{flex:1;min-width:0;padding:.875rem 1rem;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);font-family:var(--font-mono);font-size:1rem;text-align:center}.passphrase-input input:focus{outline:none;border-color:var(--accent)}.passphrase-input .sep{color:var(--text-muted);font-weight:600}.connect-btn{width:100%;padding:1rem;background:var(--accent);border:none;border-radius:var(--radius-sm);color:var(--bg-deep);font-family:var(--font-display);font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.connect-btn:hover{filter:brightness(1.1)}.connect-error{margin:-.5rem 0 1rem;padding:.75rem 1rem;background:#ef44441a;border:1px solid var(--error);border-radius:var(--radius-sm);color:var(--error);font-size:.875rem;text-align:center}.connect-btn:disabled{opacity:.5;cursor:not-allowed}.receive-waiting{text-align:center;margin-top:1.5rem}.waiting-text{color:var(--text-muted);margin-bottom:1rem}.receive-done{text-align:center;padding:2rem}.receive-done .file-info{margin-top:1rem;margin-bottom:1rem}.done-icon{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;background:var(--success);color:var(--bg-deep);border-radius:50%;font-size:2rem;margin-bottom:1rem}.hash-verified{display:inline-block;padding:.25rem .5rem;background:var(--success);color:var(--bg-deep);border-radius:4px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-left:.5rem}.hash-failed{display:inline-block;padding:.25rem .5rem;background:var(--warning, #f59e0b);color:var(--bg-deep);border-radius:4px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-left:.5rem}.file-list{margin-bottom:1.5rem}.file-list-header{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:var(--bg-elevated);border-radius:var(--radius-sm) var(--radius-sm) 0 0;border-bottom:1px solid var(--border)}.file-count{font-weight:600;color:var(--text)}.total-size{color:var(--text-muted);font-size:.875rem}.file-list-header .text-btn{margin-left:auto}.file-list-header .text-btn:last-child{margin-left:0}.text-btn{background:none;border:none;color:var(--accent);font-family:var(--font-display);font-size:.875rem;cursor:pointer;padding:.25rem .5rem;border-radius:4px;transition:all .2s}.text-btn:hover{background:var(--accent-dim)}.file-items{max-height:200px;overflow-y:auto;background:var(--bg-elevated);border-radius:0 0 var(--radius-sm) var(--radius-sm)}.file-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-bottom:1px solid var(--border)}.file-item:last-child{border-bottom:none}.file-item .file-icon{font-size:1.25rem;flex-shrink:0}.file-item .file-details{flex:1;min-width:0;display:flex;flex-direction:column;gap:.125rem}.file-item .file-name{font-family:var(--font-mono);font-size:.85rem;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-item .file-size{font-size:.75rem;color:var(--text-muted);margin-left:0}.file-item .remove-file{background:none;border:none;color:var(--text-muted);font-size:1.25rem;cursor:pointer;padding:.25rem;line-height:1;border-radius:4px;transition:all .2s}.file-item .remove-file:hover{color:var(--error);background:#ff44661a}.file-progress-list{margin-top:1rem}.file-progress{display:flex;align-items:center;gap:.75rem;padding:.625rem .75rem;background:var(--bg-elevated);border-radius:var(--radius-sm);margin-bottom:.5rem;position:relative;overflow:hidden}.file-progress .status-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:.875rem;flex-shrink:0}.file-progress .file-name{flex:1;font-family:var(--font-mono);font-size:.8rem;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-progress .file-size{font-size:.75rem;color:var(--text-muted);margin-left:0}.file-progress .verification{font-size:.7rem;color:var(--success);text-transform:uppercase;letter-spacing:.05em}.file-progress.pending .status-icon{color:var(--text-muted)}.file-progress.active{border:1px solid var(--accent-dim)}.file-progress.active .mini-progress{position:absolute;left:0;bottom:0;height:3px;background:var(--accent);transition:width .2s ease}.file-progress.complete .status-icon{color:var(--success)}.file-progress.failed .status-icon{color:var(--error)}.file-progress.failed .file-name{color:var(--text-muted)}.receive-manifest{margin-top:1.5rem}.receive-manifest h3{font-size:1rem;font-weight:600;margin-bottom:1rem;color:var(--text)}.manifest-file-list{max-height:200px;overflow-y:auto;background:var(--bg-elevated);border-radius:var(--radius-sm);margin-bottom:1rem}.manifest-file-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-bottom:1px solid var(--border)}.manifest-file-item:last-child{border-bottom:none}.manifest-file-item .file-icon{font-size:1.25rem}.manifest-file-item .file-details{flex:1;min-width:0}.manifest-file-item .file-name{font-family:var(--font-mono);font-size:.85rem;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.manifest-file-item .file-meta{font-size:.75rem;color:var(--text-muted)}.manifest-summary{display:flex;justify-content:center;gap:.5rem;font-size:.875rem;color:var(--text-muted);margin-bottom:1rem}.action-buttons{display:flex;gap:.75rem}.secondary-btn{flex:1;padding:1rem;background:transparent;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted);font-family:var(--font-display);font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.secondary-btn:hover{border-color:var(--error);color:var(--error)}.action-buttons .connect-btn{flex:2}.done-file-list{max-height:200px;overflow-y:auto;margin:1rem 0}.done-file-item{display:flex;align-items:center;gap:.75rem;padding:.5rem .75rem;background:var(--bg-elevated);border-radius:var(--radius-sm);margin-bottom:.5rem}.done-file-item .status-icon{font-size:.875rem}.done-file-item.success .status-icon{color:var(--success)}.done-file-item.failed .status-icon{color:var(--error)}.done-file-item .file-name{flex:1;font-family:var(--font-mono);font-size:.8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.done-file-item .download-btn{background:none;border:none;color:var(--accent);cursor:pointer;padding:.25rem;font-size:.875rem}.done-file-item .download-btn:hover{text-decoration:underline}.session-restore{text-align:center;padding:1.5rem;background:var(--bg-elevated);border-radius:var(--radius);margin-bottom:1.5rem;border:1px solid var(--border)}.restore-header{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-bottom:.75rem}.restore-icon{font-size:1.5rem;color:var(--accent)}.restore-header h3{font-size:1.1rem;font-weight:600;color:var(--text)}.restore-text{font-size:.875rem;color:var(--text-muted);margin-bottom:1rem}.restore-code{margin-bottom:1.25rem}.restore-code .passphrase-code{font-size:1.25rem;margin-bottom:0}.restore-actions{display:flex;gap:.75rem}.restore-actions .secondary-btn,.restore-actions .connect-btn{flex:1;padding:.75rem 1rem}.restore-file-list{max-height:120px;overflow-y:auto;background:var(--bg-surface);border-radius:var(--radius-sm);margin-bottom:1rem;text-align:left}.restore-file-list .file-item{padding:.5rem .75rem;display:flex;align-items:center;gap:.5rem;border-bottom:1px solid var(--border)}.restore-file-list .file-item:last-child{border-bottom:none}.restore-file-list .file-icon{font-size:1rem}.restore-file-list .file-name{flex:1;font-family:var(--font-mono);font-size:.8rem;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.restore-file-list .file-size{font-size:.7rem;color:var(--text-muted)}.file-reselect{text-align:center}.reselect-header{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-bottom:.75rem}.reselect-icon{font-size:1.5rem}.reselect-header h3{font-size:1.1rem;font-weight:600;color:var(--text)}.reselect-text{font-size:.875rem;color:var(--text-muted);margin-bottom:1rem}.reselect-file-list{max-height:200px;overflow-y:auto;background:var(--bg-elevated);border-radius:var(--radius-sm);margin-bottom:1rem;text-align:left}.reselect-file-item{display:flex;align-items:center;gap:.75rem;padding:.625rem .75rem;border-bottom:1px solid var(--border)}.reselect-file-item:last-child{border-bottom:none}.reselect-file-item .match-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:.875rem;flex-shrink:0}.reselect-file-item.matched .match-icon{color:var(--success)}.reselect-file-item.missing .match-icon{color:var(--text-muted)}.reselect-file-item.hashing .match-icon{color:var(--accent);animation:pulse .8s infinite}.reselect-file-item.changed .match-icon,.reselect-file-item.changed .file-name{color:var(--warning)}.reselect-file-item.new .match-icon,.reselect-file-item.new .file-name{color:var(--accent)}.reselect-file-item .hash-status{font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;margin-left:auto;padding:.15rem .4rem;border-radius:3px}.reselect-file-item.changed .hash-status{background:var(--warning);color:var(--bg-deep)}.reselect-file-item.new .hash-status{background:var(--accent-dim);color:var(--accent)}.reselect-file-item .use-anyway-btn{background:none;border:1px solid var(--warning);color:var(--warning);font-size:.65rem;padding:.15rem .4rem;border-radius:3px;cursor:pointer;margin-left:.5rem;transition:all .2s}.reselect-file-item .use-anyway-btn:hover{background:var(--warning);color:var(--bg-deep)}.reselect-file-item .file-details{flex:1;min-width:0}.reselect-file-item .file-name{font-family:var(--font-mono);font-size:.8rem;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reselect-file-item.missing .file-name{color:var(--text-muted)}.reselect-file-item .file-size{font-size:.7rem;color:var(--text-muted)}.reselect-drop-zone{border:2px dashed var(--border);border-radius:var(--radius-sm);padding:1.5rem 1rem;cursor:pointer;transition:all .2s;margin-bottom:1rem}.reselect-drop-zone:hover,.reselect-drop-zone.dragover{border-color:var(--accent);background:var(--accent-dim)}.reselect-drop-zone .drop-icon{font-size:1.5rem;margin-bottom:.5rem}.reselect-drop-zone p{font-size:.875rem;color:var(--text-muted)}.reselect-drop-zone .link{color:var(--accent);cursor:pointer;text-decoration:underline}.reselect-actions{display:flex;gap:.75rem}.reselect-actions .secondary-btn,.reselect-actions .connect-btn{flex:1;padding:.75rem 1rem}.reselect-status{font-size:.8rem;color:var(--text-muted);margin-bottom:.75rem}.reselect-status.complete{color:var(--success)}.reselect-status.partial{color:var(--warning)}.connection-status{background:var(--bg-elevated);border-radius:var(--radius-sm);padding:.75rem 1rem;margin-bottom:1rem}.status-row{display:flex;align-items:center;justify-content:space-between;padding:.5rem 0}.status-row:not(:last-child){border-bottom:1px solid var(--border)}.status-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted)}.status-value{display:flex;align-items:center;gap:.5rem;font-size:.875rem}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--text-muted);flex-shrink:0}.status-dot.connecting{background:var(--accent);animation:pulse 1s infinite}.status-dot.connected{background:var(--success)}.status-dot.disconnected{background:var(--error)}.status-dot.waiting{background:var(--text-muted);animation:pulse 1.5s infinite}.status-text{color:var(--text)}.status-value.muted .status-text{color:var(--text-muted)}.ice-details{margin-top:.5rem;border-top:1px solid var(--border);padding-top:.5rem}.ice-details.hidden{display:none!important}.ice-summary{font-size:.75rem;color:var(--text-muted);cursor:pointer;padding:.25rem 0;-webkit-user-select:none;user-select:none;display:flex;align-items:center;gap:.5rem}.ice-summary:before{content:"▶";font-size:.6rem;transition:transform .2s}.ice-details[open] .ice-summary:before{transform:rotate(90deg)}.ice-summary:hover{color:var(--text)}.ice-table-container{margin-top:.5rem;animation:fadeIn .2s ease-out}.ice-table{width:100%;font-size:.75rem;border-collapse:collapse}.ice-table th,.ice-table td{padding:.375rem .5rem;text-align:left}.ice-table th{color:var(--text-muted);font-weight:500;text-transform:uppercase;letter-spacing:.05em;font-size:.65rem;border-bottom:1px solid var(--border)}.ice-table tr:not(:last-child) td{border-bottom:1px solid var(--border)}.ice-table .ice-type{font-weight:500}.ice-table .ice-type-hint{color:var(--text-muted);font-weight:400;margin-left:.25rem}.ice-status{display:inline-flex;align-items:center;gap:.375rem}.ice-status-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.ice-status-dot.testing{background:var(--accent);animation:pulse 1s infinite}.ice-status-dot.succeeded{background:var(--success)}.ice-status-dot.failed{background:var(--error)}.ice-status-dot.pending{background:var(--text-muted)}.ice-hint{font-size:.7rem;color:var(--text-muted);margin-top:.5rem;font-style:italic}.ice-empty{color:var(--text-muted);font-style:italic;padding:.5rem;text-align:center}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}footer{margin-top:3rem;text-align:center}footer p{font-size:.75rem;color:var(--text-muted);letter-spacing:.05em}.label{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin-bottom:.75rem;display:block}@media (max-width: 480px){header h1{font-size:2.5rem}.passphrase-code{font-size:1.25rem}.passphrase-input input{padding:.75rem .5rem;font-size:.9rem}}
