:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:#1f1f1f;color:#e0e0e0;margin:0;line-height:1.6;display:flex;justify-content:center;align-items:flex-start;min-height:calc(100dvh - 40px);padding:20px}body.is-pwa{background-color:#131313}.app-container{background-color:#131313;border-radius:16px;padding:40px;max-width:900px;width:100%;margin-top:20px;box-sizing:border-box}.app-header{text-align:center;margin-bottom:10px}.app-title{color:#d2d2d2;font-size:2.5em;font-weight:700;letter-spacing:1.5px;margin:0}.app-link{color:#909090;font-size:1em;margin:0 0 5px;text-decoration:none;transition:color .3s;font-weight:400}.app-subtitle{color:#909090;font-size:1.2em;margin-top:0}.card{background-color:#191919;padding:25px;border-radius:12px;margin-bottom:25px}.card h2{color:#d2d2d2;font-size:1.5em;border-bottom:1px solid #4a4a4a;padding-bottom:7px;margin-top:0;margin-bottom:15px}.setting-label{font-size:1.1em;color:#d2d2d2;font-weight:600}.text-input{flex-grow:1;padding:12px 18px;border:none;border-radius:8px;background-color:#393939;color:#d2d2d2;font-size:1em;transition:background-color .3s}.text-input::placeholder{color:#888e9a}.text-input:focus{outline:none}.id-display{display:flex;align-items:center;gap:10px;background-color:#191919;padding:12px 18px;border-radius:8px;font-family:Consolas,monospace}.id-text{flex-grow:1;color:#d2d2d2;font-size:.95em;word-break:break-all}.primary-button{padding:12px 25px;border:none;border-radius:8px;background-color:#6cbe45;color:#000;font-size:1em;font-weight:600;cursor:pointer;transition:background-color .3s,transform .2s,box-shadow .3s}.primary-button:hover:not(:disabled){background-color:#77d34c;transform:translateY(-2px)}.primary-button:active:not(:disabled){transform:translateY(0)}.primary-button:disabled{background-color:#5a5e67;color:#a0a8b5;cursor:not-allowed;opacity:.7}.secondary-button{padding:10px 20px;border:1px solid #77d34c;border-radius:8px;background-color:transparent;color:#77d34c;font-size:.95em;display:flex;align-items:center;justify-content:center;font-weight:500;cursor:pointer;transition:background-color .3s,color .3s,transform .2s,box-shadow .3s}.secondary-button:hover:not(:disabled){background-color:#77d34c;border:1px solid #77d34c;color:#191919}.secondary-button:active:not(:disabled){transform:translateY(0)}.secondary-button:disabled{background-color:#5a5e67;color:#a0a8b5;border:1px solid #5a5e67;cursor:not-allowed;opacity:.7}.icon-button{background:none;border:none;color:#77d34c;cursor:pointer;padding:8px;border-radius:6px;transition:background-color .3s,color .3s;display:flex;align-items:center;justify-content:center}.icon-button svg{stroke:#77d34c;transition:stroke .3s}.icon-button:hover{background-color:#77d34c}.icon-button:hover svg{stroke:#77d34c}.icon-button-text{display:flex;align-items:center;gap:8px}.icon-button-text svg{stroke:#77d34c;transition:stroke .3s}.icon-button-text:hover svg{stroke:#191919}.primary-button.success{background-color:#77d34c;font-weight:600}.primary-button.success:hover:not(:disabled){background-color:#77d34c}.primary-button.danger{background-color:#dc3545;font-weight:600}.primary-button.danger:hover:not(:disabled){background-color:#c82333}.button-group{display:flex;gap:15px;margin:0 0 5px;justify-content:center}.connection-request-section{text-align:center;border:1px solid #77d34c}.request-message{font-size:1.1em;color:#e0e0e0;margin:0 0 5px}.peers-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}.peer-card{background-color:#272727;padding:20px;border-radius:10px;display:flex;flex-direction:column;gap:15px}.peer-header{display:flex;align-items:center;gap:15px}.peer-avatar{font-size:2.5em;color:#77d34c;line-height:1}.peer-info{display:flex;flex-direction:column;flex-grow:1}.peer-name{font-size:1em;font-weight:600;color:#e0e0e0;word-break:break-all}.peer-id-short{font-size:.8em;color:#a0a8b5;font-family:Consolas,monospace}.connection-status-dot{width:12px;height:12px;border-radius:50%;background-color:#ccc;margin-left:auto}.connection-status-dot.connected{background-color:#77d34c}.connection-status-dot.disconnected{background-color:#dc3545}.transfer-info{font-size:.7em}.transfer-info .transfer-text{color:#666;font-family:Consolas,monospace;word-break:break-all}.peer-actions{display:flex;gap:10px;flex-wrap:wrap}.file-input-label{cursor:pointer;display:inline-block;flex-grow:1}.file-input-label .secondary-button{width:100%;justify-content:center}.transfer-progress{display:flex;align-items:center;gap:10px;margin-top:10px}progress{flex-grow:1;height:12px;border-radius:6px;background-color:#5a5e67;border:none}progress::-webkit-progress-bar{background-color:#5a5e67;border-radius:6px}progress::-webkit-progress-value{background-color:#77d34c;border-radius:6px;transition:width .3s ease-in-out}progress::-moz-progress-bar{background-color:#77d34c;border-radius:6px}.progress-text{font-size:.9em;color:#a0a8b5;white-space:nowrap}.empty-state-message{text-align:center;color:#888e9a;font-style:italic;padding:15px}.download-list{list-style:none;padding:0;margin:0}.download-item{display:flex;align-items:center;justify-content:space-between;background-color:#272727;padding:15px 20px;border-radius:10px;margin-bottom:10px}.download-link{color:#77d34c;text-decoration:none;display:flex;align-items:center;gap:10px;font-size:1em;transition:color .3s;flex-grow:1}.download-link:hover{color:#88f257}.download-icon{font-size:1.4em;line-height:1}.download-source{font-size:.9em;color:#888e9a}.delete-button{color:#dc3545;padding:5px;margin-left:5px}.delete-button svg{stroke:#dc3545}.delete-button:hover{background-color:#dc35451a}.delete-button:hover svg{stroke:#c82333}.about_info{font-size:.9em;color:#4c4c4c;margin:10px 0 0;text-align:center}.ip-section .ip-address{text-align:center;font-size:1.3em;font-weight:700;color:#5e5e5e;background-color:#272727;padding:15px;border-radius:8px;word-break:break-all}.logs-section{text-align:center}.logs-section h2{border-bottom:none}.toggle-logs-button{width:100%;padding:12px;background-color:#272727;color:#7a7a7a;border:none;border-radius:8px;font-size:1.1em;cursor:pointer;margin-bottom:15px;transition:background-color .3s,transform .2s,box-shadow .3s;display:flex;justify-content:space-between;align-items:center}.toggle-logs-button:hover{background-color:#2c2c2c}.toggle-logs-button:active{transform:translateY(0)}.log-toggle-info{font-size:.9em;color:#ffffff20;max-width:60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right;padding-left:10px}.toggle-icon{transition:transform .3s ease-in-out;stroke:#e0e0e0}.toggle-icon.rotated{transform:rotate(180deg)}.logs-container{max-height:280px;overflow-y:auto;background:#272727;padding:15px;border-radius:10px;border:1px solid #444;font-family:Fira Code,Consolas,Monaco,monospace;font-size:.9em;color:#b4b3b3;text-align:left}.log-entry{padding:6px 0;border-bottom:1px dashed #3a3e47;word-break:break-all}.log-entry:last-child{border-bottom:none}.logs-container::-webkit-scrollbar{width:8px}.logs-container::-webkit-scrollbar-track{background:#3a3e47;border-radius:10px}.logs-container::-webkit-scrollbar-thumb{background:#6a6e77;border-radius:10px}.logs-container::-webkit-scrollbar-thumb:hover{background:#7a7e87}@media (max-width: 768px){.app-container{padding:25px}.app-title{font-size:2em}.app-subtitle{font-size:1.1em}.card{padding:20px}.peers-grid{grid-template-columns:1fr}.peer-card{padding:18px}.button-group{flex-direction:column;gap:10px}}@media (max-width: 480px){.app-container{padding:15px}.app-title{font-size:1.6em}h2{font-size:1.5em}.input-with-button{flex-direction:column;gap:8px}.primary-button,.secondary-button{width:100%;text-align:center}}.my-settings-section{display:flex;flex-direction:column;gap:20px}.setting-item{display:flex;flex-direction:column;gap:8px}.setting-label{font-size:1.1em;color:#a0a0a0;font-weight:600}.input-with-button{display:flex;gap:10px}.text-input{flex-grow:1;padding:12px 18px;border:none;border-radius:8px;background-color:#272727;color:#e0e0e0;font-size:1em;transition:box-shadow .3s,background-color .3s}.text-input::placeholder{color:#4f4f4f}.text-input:focus{outline:none;background-color:#272727}.small-id-text{font-size:.85em;color:#707070;font-family:Consolas,monospace;padding:8px 12px;background-color:#272727;border-radius:6px;display:inline-block;max-width:100%;word-break:break-all}.peer-actions{display:flex;flex-wrap:wrap;gap:10px}.file-input-wrapper{flex-grow:1}.file-select-button{justify-content:center;margin:0}.hidden-file-input{display:none}footer{display:flex;flex-direction:column;flex-wrap:wrap;gap:5px;justify-content:center;align-items:center}footer p{margin:0}.install-button{display:flex;flex-wrap:wrap;flex-direction:column;color:#131313}.install-button span{font-weight:700;font-size:1.4em;color:#131313}.install-button small{font-weight:500;font-size:.8em;color:#131313}@media (min-width: 1601px){.app-container{max-width:1500px;margin:35px auto;display:flex;flex-direction:row;align-items:flex-start;justify-content:center;flex-wrap:wrap;gap:20px;box-sizing:border-box}header{flex-basis:100%;text-align:center}.card{box-sizing:border-box;flex-basis:calc(50% - 80px);align-self:stretch}.downloads-section{flex-basis:60%;width:60%;text-align:center}.logs-section{flex-basis:28%;width:28%;text-align:center}footer{flex-basis:100%;text-align:center}}@media (max-width: 1600px){.app-container{max-width:1500px;margin:35px auto;display:flex;flex-direction:row;align-items:flex-start;justify-content:center;flex-wrap:wrap;gap:20px;box-sizing:border-box}header{flex-basis:100%;text-align:center}.card{box-sizing:border-box;flex-basis:calc(50% - 80px);align-self:stretch}.downloads-section{flex-basis:60%;width:60%;text-align:center}.logs-section{flex-basis:28%;width:28%;text-align:center}footer{flex-basis:100%;text-align:center}}@media (max-width: 1400px){.downloads-section,.logs-section{flex-basis:calc(100% - 140px);text-align:center}}@media (max-width: 950px){.app-container{max-width:100%;margin:0 auto;display:flex;flex-direction:row;align-items:flex-start;justify-content:center;flex-wrap:wrap;gap:10px}header{flex-basis:100%;text-align:center}.card{flex-basis:calc(50% - 90px);flex-grow:1}.download-link{flex-wrap:wrap;overflow-wrap:break-word;word-break:break-all}.download-link .download-source{font-size:.7em}.downloads-section,.logs-section{flex-basis:calc(100% - 100px);flex-grow:1;text-align:center}}@media (max-width: 780px){body{padding:0}#root{width:100%;padding:0}.app-container{width:100%;padding:15px;margin:0;border-radius:0;max-width:calc(100% - 20px)}.card{flex-grow:1;flex-basis:100%}.download-link{margin-bottom:10px}.download-item{flex-wrap:wrap;gap:10px}.download-item button{flex-basis:40%;flex-grow:1}.download-item button.delete-button{flex-basis:auto;border:1px solid #191919;margin:0}}@media (max-width: 480px){body{font-size:12px}.peers-grid{display:grid;grid-template-columns:repeat(auto-fit,1fr)}.app-title{font-size:1.1em}.app-subtitle{font-size:.9em}.app-container{max-width:100%}.app-header{margin-bottom:10px}.input-with-button{flex-direction:column;gap:8px}.card{flex-basis:60%;flex-grow:1;padding:10px;gap:5px;margin-bottom:5px}.card .setting-item{gap:5px}.card .setting-label{font-size:.9em}.card .input-with-button{gap:5px}.card .text-input{padding:10px;font-size:1em}.card .primary-button,.card .secondary-button{width:100%;padding:8px;font-size:1em}.card h2{font-size:1.4em;margin-bottom:5px;padding-bottom:5px}.card .peer-card{padding:15px;gap:10px}.card .peer-card .peer-header{gap:0}.card .peer-card .peer-avatar{font-size:2em}.card .peer-card .peer-info .peer-name{font-size:1em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}.primary-button,.secondary-button,.text-input,.file-input-wrapper{flex-shrink:0}.file-input-wrapper{flex-grow:1;display:flex;flex-direction:column;align-items:stretch;justify-content:stretch}.file-input-wrapper .secondary-button{width:inherit}.download-item{flex-wrap:wrap;gap:2px}.download-item .download-link{flex-wrap:wrap}.download-item .download-source{flex-basis:100%;text-align:center}}.tabs-bar{display:flex;gap:8px;border-bottom:1px solid var(--divider-color, rgba(255,255,255,.08));margin:16px 0 20px}.tab-button{cursor:pointer;border:1px solid var(--card-border, rgba(255,255,255,.08));background:var(--card-bg, #0f172a);color:var(--text-color, #e5e7eb);padding:8px 14px;border-radius:8px 8px 0 0;font-weight:600}.tab-button.active{background:var(--panel-bg, #111827);border-color:var(--card-border, rgba(255,255,255,.16))}.preview-overlay{position:fixed;inset:0;background:#00000050;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.preview-modal{background:#191919;color:var(--text-color, #e5e7eb);border:1px solid var(--card-border, rgba(255,255,255,.08));border-radius:12px;width:min(960px,96vw);max-height:90vh;display:flex;flex-direction:column;box-shadow:0 10px 30px #00000059}.preview-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--divider-color, rgba(255,255,255,.08))}.preview-title{display:flex;align-items:center;gap:8px;font-weight:600}.preview-content{padding:12px;overflow:auto;background:var(--panel-bg, transparent)}.preview-media{max-width:100%;max-height:70vh;display:block;margin:0 auto;border-radius:8px;background:var(--media-bg, #0b1220)}.preview-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px 16px;border-top:1px solid var(--divider-color, rgba(255,255,255,.08));background:#191919}.close-button{background:transparent;color:inherit}.preview-button{margin-right:8px}@media (max-width: 600px){.preview-actions .primary-button{width:100%!important;flex-shrink:1!important}}.lang-switch{margin-left:auto;display:inline-flex;align-items:center;gap:8px;padding-bottom:15px}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.lang-btn{width:40px;height:28px;display:inline-flex;align-items:center;justify-content:center;background:#272727;color:inherit;border:1px solid #3c3c3c;border-radius:6px;cursor:pointer;padding:0;transition:background-color .2s,border-color .2s,transform .1s,box-shadow .2s}.lang-btn:hover{background-color:#2f2f2f;border-color:#4a4a4a}.lang-btn:active{transform:scale(.98)}.lang-btn.active{border-color:#77d34c;box-shadow:0 0 0 2px #77d34c26 inset}.lang-btn svg{display:block}
