@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap";:root{--bg:#f6f7f9;--surface:#fff;--surface-2:#f2f3f5;--fg:#14161a;--muted:#71767f;--line:#e6e8eb;--line-strong:#d3d7de;--accent:#2f6bff;--accent-fg:#fff;--accent-soft:#2f6bff1a;--accent-line:#2f6bff52;--accent-strong:#1e59f0;--danger:#d94848;--radius:16px;--radius-sm:10px;--shadow:0 1px 2px #10141e0d, 0 8px 24px #10141e0f;color:var(--fg);-webkit-font-smoothing:antialiased;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.45}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#0e1013;--surface:#16191e;--surface-2:#1e2228;--fg:#e9eaec;--muted:#8b919b;--line:#262b33;--line-strong:#343b46;--accent:#5b8cff;--accent-soft:#5b8cff29;--accent-line:#5b8cff66;--accent-strong:#7ba5ff;--shadow:0 1px 2px #0006, 0 8px 24px #0000004d}}*,:before,:after{box-sizing:border-box}[hidden]{display:none!important}html,body{background:var(--bg);min-height:100%;margin:0}#app{max-width:100%;min-height:100dvh;overflow-x:clip}.shell{width:min(440px,100% - 1.5rem);max-width:100%;padding:calc(1rem + env(safe-area-inset-top,0px)) max(0px, env(safe-area-inset-right,0px)) calc(2.5rem + env(safe-area-inset-bottom,0px)) max(0px, env(safe-area-inset-left,0px));gap:.75rem;min-width:0;margin:0 auto;display:grid;overflow-x:clip}.icon{flex:none;width:20px;height:20px;display:block}.statusbar .icon,.empty .icon,.tile .icon,.file-list .icon{width:16px;height:16px}.brand .icon{width:18px;height:18px;color:var(--accent)}.top{align-items:center;gap:.5rem;padding:.25rem .25rem .5rem;display:flex}.brand{letter-spacing:-.02em;align-items:center;gap:.4rem;margin:0;font-size:.95rem;font-weight:600;display:flex}.brand a{color:inherit;align-items:center;gap:.4rem;text-decoration:none;display:flex}.spacer{flex:1}.btn{appearance:none;border:1px solid var(--line);background:var(--surface);color:var(--fg);font:inherit;cursor:pointer;border-radius:999px;justify-content:center;align-items:center;gap:.4rem;padding:.5rem .9rem;font-size:.875rem;font-weight:500;text-decoration:none;transition:background .15s,border-color .15s,color .15s,opacity .15s,transform .1s;display:inline-flex}.btn:hover:not(:disabled){background:var(--surface-2);border-color:var(--line-strong)}.btn:active:not(:disabled){transform:scale(.97)}.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn.icon-btn{border-radius:12px;width:40px;height:40px;padding:0}.btn.primary{background:var(--accent);color:var(--accent-fg);border-color:#0000}.btn.primary:hover:not(:disabled){background:var(--accent-strong)}.btn.on{background:var(--accent-soft);border-color:var(--accent-line);color:var(--accent)}.btn.on:hover:not(:disabled){background:var(--accent-soft);border-color:var(--accent)}.btn:disabled{cursor:not-allowed;border-color:var(--line);color:var(--muted);box-shadow:none;background:0 0}.btn:disabled .icon{opacity:.6}.btn.wide{width:100%;padding:.75rem;font-size:.95rem}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);gap:.75rem;min-width:0;max-width:100%;padding:1rem;display:grid}.share{justify-items:center;gap:.75rem;width:100%;min-width:0;display:grid;overflow:hidden}.qr{aspect-ratio:1;background:#fff;border-radius:12px;width:min(200px,100%);height:auto;margin-inline:auto;padding:8px;display:block}.row{align-items:center;gap:.5rem;width:100%;min-width:0;max-width:100%;display:flex}.row .btn{flex:none}.endpoint{min-width:0;max-width:100%;color:var(--muted);background:var(--surface-2);border-radius:var(--radius-sm);text-overflow:ellipsis;white-space:nowrap;flex:1 1 0;padding:.55rem .7rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.75rem;overflow:hidden}.statusbar{color:var(--muted);align-items:center;gap:.5rem;min-width:0;max-width:100%;min-height:1.5em;padding:0 .35rem;font-size:.8rem;display:flex;overflow:hidden}.dot{background:var(--muted);border-radius:50%;flex:none;width:7px;height:7px}.dot.live{background:#29b567;box-shadow:0 0 0 3px #29b5672e}.peer-tag{text-overflow:ellipsis;white-space:nowrap;flex:none;align-items:center;gap:.3rem;min-width:0;max-width:42%;margin-left:auto;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.72rem;display:inline-flex;overflow:hidden}.mode-ic{align-items:center;display:inline-flex}.status{text-overflow:ellipsis;white-space:nowrap;flex:1 1 0;min-width:0;overflow:hidden}.files{gap:.4rem;min-width:0;max-width:100%;display:grid;overflow:hidden}.files:empty{display:none}.save-all{justify-content:center;gap:.45rem;width:100%}.autosave{align-items:center;gap:.35rem;min-width:0;display:flex}.autosave-btn{border-radius:var(--radius-sm);min-width:0;color:var(--muted);flex:1 1 0;justify-content:flex-start;padding:.55rem .75rem;font-size:.8rem}.autosave-btn span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.autosave-btn .icon{width:16px;height:16px;color:var(--accent)}.autosave-label{min-width:0;color:var(--muted);flex:1;align-items:center;gap:.4rem;padding:.35rem .25rem;font-size:.8rem;display:flex}.autosave-label .icon{width:16px;height:16px;color:var(--accent);flex:none}.autosave-label span:last-child{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.tile.saved .tile-action{color:#29b567}.tile{border-radius:var(--radius-sm);background:var(--surface-2);color:inherit;font:inherit;appearance:none;text-align:left;cursor:pointer;border:0;align-items:center;gap:.65rem;width:100%;min-width:0;max-width:100%;padding:.6rem .7rem;font-size:.875rem;text-decoration:none;transition:background .15s;display:flex;overflow:hidden}.tile.incoming{cursor:default;pointer-events:none}.tile:hover{background:var(--accent-soft)}.tile .icon{color:var(--muted);flex:none}.tile:hover .tile-action{color:var(--accent)}.tile-text{flex-direction:column;flex:1;justify-content:center;min-width:0;max-width:100%;display:flex;overflow:hidden}.tile-name,.tile-meta{text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:100%;display:block;overflow:hidden}.tile-meta{color:var(--muted);font-size:.75rem}.tile-action{color:var(--muted);flex:none}[data-form]{gap:.75rem;min-width:0;max-width:100%;display:grid}.pick{border:1.5px dashed var(--line);border-radius:var(--radius-sm);text-align:center;cursor:pointer;width:100%;color:var(--muted);justify-items:center;gap:.35rem;padding:1.5rem 1rem;font-size:.8rem;transition:border-color .15s,background .15s,color .15s;display:grid;position:relative}.pick .icon{pointer-events:none;width:26px;height:26px}.pick>span{pointer-events:none}.pick:hover,.pick.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.pick input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;font-size:0;position:absolute;inset:0}.pick:has(input:focus-visible){border-color:var(--accent);outline:2px solid var(--accent);outline-offset:2px}.file-list{gap:.25rem;min-width:0;max-width:100%;margin:0;padding:0;font-size:.8rem;list-style:none;display:grid}.file-list:empty{display:none}.file-list li{background:var(--surface-2);color:var(--fg);border-radius:8px;align-items:center;gap:.5rem;min-width:0;padding:.4rem .55rem;display:flex;overflow:hidden}.file-list .icon{color:var(--muted);flex:none}.file-list .name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;max-width:100%;overflow:hidden}.file-list .size{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;flex:none;max-width:40%;overflow:hidden}.file-list .remove-btn{cursor:pointer;color:var(--muted);background:0 0;border:none;border-radius:4px;flex:none;justify-content:center;align-items:center;margin:0;padding:.15rem;display:flex}.file-list .remove-btn:hover,.file-list .remove-btn:focus-visible{color:var(--fg);background:var(--surface-3);outline:none}.progress{background:var(--surface-2);border-radius:999px;height:4px;overflow:hidden}.progress-bar{background:var(--accent);border-radius:999px;width:0;height:100%;transition:width .12s}.empty{color:var(--muted);align-items:center;gap:.4rem;margin:0;font-size:.8rem;display:flex}.notice{text-align:center;color:var(--muted);justify-items:center;gap:.75rem;font-size:.9rem;display:grid}.notice .icon{width:28px;height:28px;color:var(--danger)}.notice p{margin:0}.about-title{letter-spacing:-.02em;margin:0;font-size:1.25rem;font-weight:600}.about-subtitle{margin:.5rem 0 0;font-size:.95rem;font-weight:600}.about-lead{color:var(--muted);margin:0;font-size:.9rem}.about-steps{counter-reset:about-step;gap:.75rem;margin:0;padding:0;list-style:none;display:grid}.about-steps li{background:var(--surface-2);border-radius:var(--radius-sm);counter-increment:about-step;gap:.2rem;padding:.7rem .8rem .7rem 2.6rem;display:grid;position:relative}.about-steps li:before{content:counter(about-step);background:var(--accent-soft);width:1.35rem;height:1.35rem;color:var(--accent);border-radius:999px;place-items:center;font-size:.75rem;font-weight:600;display:grid;position:absolute;top:.75rem;left:.7rem}.about-steps strong{font-size:.9rem}.about-steps span{color:var(--muted);font-size:.82rem}.notice-line{border-radius:var(--radius-sm);background:var(--accent-soft);color:var(--accent);margin:0;padding:.6rem .9rem;font-size:.85rem}.adv{flex-direction:column;gap:.75rem;display:flex}.adv-title{letter-spacing:-.02em;align-items:center;gap:.45rem;margin:0;font-size:1.25rem;font-weight:600;display:flex}.adv-title .icon{width:20px;height:20px;color:var(--accent)}.adv-subtitle{margin:0;font-size:1rem;font-weight:600}.adv-lead{color:var(--muted);margin:0;font-size:.9rem}.adv-features{color:var(--muted);gap:.25rem;margin:0;padding-left:1.1rem;font-size:.85rem;display:grid}.adv-status{color:var(--muted);align-items:center;gap:.45rem;margin:0;font-size:.9rem;display:flex}.adv-status.on{color:var(--accent)}.adv-status .icon{width:18px;height:18px}.adv-row{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.adv-alias code{word-break:break-all;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem}.adv-profile{align-items:flex-end;gap:.75rem;display:flex}.field{color:var(--muted);flex-direction:column;gap:.3rem;font-size:.8rem;display:flex}.field.grow{flex:1;min-width:0}.field input{font:inherit;color:var(--fg);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm);min-width:0;padding:.55rem .7rem;font-size:.9rem}.field input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.hint{color:var(--muted);margin:0;font-size:.8rem}.hint.warn{color:var(--danger)}.hidden-input{clip:rect(0, 0, 0, 0);white-space:nowrap;opacity:0;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}label.btn:has(.hidden-input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}body:has(#avatar-input:focus-visible) label[for=avatar-input]{outline:2px solid var(--accent);outline-offset:2px}.avatar{object-fit:cover;background:var(--surface-2);border-radius:999px;flex:none;width:56px;height:56px}.avatar.sm{width:24px;height:24px}.avatar.ph{display:inline-block}.history{gap:.35rem;max-height:16rem;margin:0;padding:0;list-style:none;display:grid;overflow-y:auto}.history li{align-items:center;gap:.5rem;font-size:.8rem;display:flex}.history .icon{width:14px;height:14px;color:var(--muted)}.history .name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.history .size,.history .when{color:var(--muted);flex:none;font-size:.72rem}.peers-panel:empty{display:none}.peers-title{color:var(--muted);margin:0 0 .4rem;font-size:.78rem}.peers{flex-wrap:wrap;gap:.4rem;margin:0 0 .75rem;padding:0;list-style:none;display:flex}.peer{border:1px solid var(--line);cursor:default;border-radius:999px;align-items:center;gap:.4rem;padding:.3rem .6rem .3rem .35rem;font-size:.8rem;display:inline-flex}.peer:has(input){cursor:pointer}.peer.picked{background:var(--accent-soft);color:var(--accent);border-color:#0000}.peer-name{text-overflow:ellipsis;white-space:nowrap;max-width:12rem;overflow:hidden}.avatar.ph{color:var(--muted);-webkit-user-select:none;user-select:none;place-items:center;font-size:1.1rem;font-weight:600;display:grid}.avatar.sm.ph{font-size:.7rem}@media (prefers-reduced-motion:reduce){.btn{transition:none}.btn:active:not(:disabled){transform:none}}