*{box-sizing:border-box}.upload-wrapper{box-sizing:border-box;background:#fff;justify-content:center;align-items:flex-start;width:100%;min-height:100dvh;padding:clamp(20px,4vw,40px);font-family:Inter,Poppins,system-ui,-apple-system,sans-serif;display:flex}.upload-container{background:#fff;border:3px solid #e2e8f0;border-radius:0;width:min(98%,1600px);padding:clamp(20px,3vw,32px);position:relative;overflow:visible;box-shadow:0 4px 20px #0f172a14}.upload-header{text-align:center;border-bottom:3px solid #e2e8f0;margin-bottom:clamp(1.5rem,3vw,2rem);padding-bottom:1rem}.upload-header h1{color:#0f172a;letter-spacing:-.5px;margin:0;font-size:clamp(1.5rem,4vw,2rem);font-weight:700}.upload-header p{color:#475569;margin-top:8px;font-size:clamp(.9rem,2vw,1rem);line-height:1.6}.upload-dropzone{cursor:pointer;text-align:center;background:#f8fafc;border:3px dashed #cbd5e1;border-radius:0;padding:clamp(1.5rem,3vw,2.5rem);transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.upload-dropzone:before{content:"";opacity:0;background:linear-gradient(90deg,#3b82f6,#60a5fa,#3b82f6);height:3px;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.upload-dropzone:hover:before,.upload-dropzone.drag-active:before{opacity:1}.upload-dropzone.drag-active{background:#eff6ff;border-color:#3b82f6;transform:translateY(-2px);box-shadow:0 8px 24px #3b82f61f}.upload-dropzone:hover{background:#f0f9ff;border-color:#3b82f6}.upload-icon{color:#3b82f6;margin-bottom:.75rem;font-size:clamp(2rem,5vw,3rem);display:block}.upload-prompt h2{color:#0f172a;margin:0;font-size:clamp(1rem,2.5vw,1.25rem);font-weight:700}.upload-prompt p{color:#64748b;margin:8px 0 0;font-size:clamp(.9rem,2vw,1rem);line-height:1.5}.upload-prompt .muted{color:#94a3b8;margin-top:.75rem;font-size:clamp(.8rem,1.5vw,.875rem);display:block}.file-list{background:#f8fafc;border:2px solid #e2e8f0;border-radius:0;margin-top:clamp(1.25rem,2vw,1.75rem);padding:clamp(.9rem,2vw,1.25rem)}.file-list h3{color:#0f172a;border-left:4px solid #3b82f6;margin:0 0 .75rem;padding-left:8px;font-size:clamp(1rem,2vw,1.1rem);font-weight:700}.file-scroll{max-height:14rem;padding-right:8px;overflow-y:auto}.file-scroll::-webkit-scrollbar{width:8px}.file-scroll::-webkit-scrollbar-track{background:#e2e8f0;border-radius:0}.file-scroll::-webkit-scrollbar-thumb{background:#3b82f6;border-radius:0}.file-scroll::-webkit-scrollbar-thumb:hover{background:#2563eb}.file-item{background:#fff;border:2px solid #e2e8f0;border-radius:0;justify-content:space-between;align-items:center;margin-bottom:.5rem;padding:clamp(.6rem,1.5vw,.9rem) clamp(.8rem,2vw,1rem);transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.file-item:hover{border-color:#3b82f6;transform:translateY(-2px);box-shadow:0 6px 20px #3b82f61a}.file-details{flex:1;align-items:center;gap:.75rem;min-width:0;display:flex}.file-name{color:#0f172a;word-break:break-all;font-size:clamp(.9rem,2vw,.95rem);font-weight:500}.file-size{color:#64748b;white-space:nowrap;font-size:clamp(.8rem,1.5vw,.85rem)}.file-remove{color:#b91c1c;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;background:#fee2e2;border:2px solid #fecaca;border-radius:0;padding:.35rem .8rem;font-size:.75rem;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1)}.file-remove:hover{background:#fecaca;border-color:#b91c1c;transform:translateY(-1px);box-shadow:0 2px 8px #b91c1c33}.file-remove:active{transform:translateY(0)}.upload-btn-wrapper{justify-content:center;gap:1rem;margin-top:clamp(1rem,2vw,1.5rem);display:flex}.upload-btn{color:#fff;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:#0f172a;border:2px solid #0f172a;border-radius:0;padding:clamp(.75rem,2vw,1rem) clamp(1.5rem,3vw,2rem);font-size:clamp(.9rem,2vw,1rem);font-weight:700;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;box-shadow:0 4px 16px #0f172a26}.upload-btn:before{content:"";z-index:-1;background:linear-gradient(90deg,#3b82f6,#2563eb);width:100%;height:100%;transition:left .3s;position:absolute;top:0;left:-100%}.upload-btn:hover:before{left:0}.upload-btn:hover{border-color:#3b82f6;transform:translateY(-2px);box-shadow:0 6px 20px #3b82f64d}.upload-btn:active{transform:translateY(0);box-shadow:0 2px 8px #3b82f633}.upload-btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;background:#94a3b8;border-color:#cbd5e1;transform:none}.upload-btn:disabled:before{display:none}.upload-btn:disabled:hover{border-color:#cbd5e1;transform:none}.error{color:#ef4444;text-align:center;background:#fee2e2;border:2px solid #fecaca;border-radius:0;margin-top:1rem;padding:.75rem;font-size:clamp(.85rem,2vw,.95rem);font-weight:600}.bug-section-wrapper{margin-top:clamp(1.5rem,3vw,2rem)}.visualizer-wrapper{background:#fff;border:3px solid #e2e8f0;border-radius:0;justify-content:stretch;align-items:stretch;width:100%;height:clamp(500px,70vh,900px);margin-top:clamp(2rem,4vw,3rem);transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden;box-shadow:0 8px 32px #0f172a1a}.visualizer-wrapper:before{content:"";z-index:1;background:linear-gradient(90deg,#3b82f6,#60a5fa,#3b82f6);height:3px;animation:3s infinite shimmer;position:absolute;top:0;left:0;right:0}@keyframes shimmer{0%,to{opacity:.5}50%{opacity:1}}.visualizer-placeholder{text-align:center;color:#64748b;padding:clamp(2rem,4vw,3rem);font-size:clamp(1rem,2vw,1.2rem);font-weight:600}@media (max-width:1024px){.upload-wrapper{padding:clamp(16px,3vw,24px)}.visualizer-wrapper{height:clamp(450px,65vh,800px)}}@media (max-width:768px){.upload-wrapper{padding:16px}.upload-container{border-width:2px;width:100%;padding:16px}.upload-header{margin-bottom:1.25rem}.visualizer-wrapper{height:clamp(400px,60vh,700px);margin-top:1.5rem}.file-item{flex-direction:column;align-items:flex-start;gap:.5rem}.file-size{font-size:.8rem}.upload-btn-wrapper{flex-direction:column}.upload-btn{width:100%}}@media (max-width:480px){.upload-wrapper,.upload-container{padding:12px}.upload-dropzone{padding:1.25rem}.visualizer-wrapper{height:clamp(300px,55vh,600px)}.file-list{padding:.75rem}.file-scroll{max-height:10rem}}@media (min-width:1920px){.upload-container{max-width:1800px}.visualizer-wrapper{height:clamp(700px,75vh,1000px)}}
