:root{--primary-color:#2563eb;--primary-dark:#1e40af;--primary-light:#3b82f6;--secondary-color:#64748b;--accent-color:#0f766e;--accent-light:#14b8a6;--background:#f8fafc;--surface:#fff;--surface-light:#f1f5f9;--border-color:#e2e8f0;--text-primary:#1e293b;--text-secondary:#64748b;--text-light:#94a3b8;--success:#16a34a;--error:#dc2626;--warning:#f59e0b;--font-primary:-apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--font-mono:"SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, "Courier New", monospace;--spacing-xs:.25rem;--spacing-sm:.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-2xl:3rem;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-full:9999px;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;--shadow-xl:0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;--transition-fast:.15s ease-in-out;--transition-base:.2s ease-in-out;--transition-slow:.3s ease-in-out}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-primary);color:var(--text-primary);background:linear-gradient(135deg,#0f172a 0%,#1e1b4b 25%,#15133f 50%,#0f172a 75%,#1a1a2e 100%) fixed;min-height:100vh;margin:0;font-size:16px;line-height:1.6}h1,h2,h3,h4,h5,h6{color:var(--text-primary);margin-bottom:var(--spacing-md);font-weight:600;line-height:1.2}h1{font-size:2.25rem}h2{font-size:1.875rem}h3{font-size:1.5rem}h4{font-size:1.25rem}h5{font-size:1.125rem}h6{font-size:1rem}p{margin-bottom:var(--spacing-md);color:var(--text-secondary)}a{color:var(--primary-color);transition:color var(--transition-base);text-decoration:none}a:hover{color:var(--primary-dark);text-decoration:underline}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--surface-light)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--secondary-color)}.user-uploads{gap:var(--spacing-lg);padding:var(--spacing-lg);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));max-height:75vh;display:grid;overflow-y:auto}@media (width<=1400px){.user-uploads{grid-template-columns:repeat(3,1fr)}}@media (width<=1024px){.user-uploads{grid-template-columns:repeat(2,1fr)}}@media (width<=640px){.user-uploads{grid-template-columns:1fr}}.user-uploads .card,.card{height:100%;padding:var(--spacing-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--radius-lg);transition:all var(--transition-base);background:#ffffffe6;border:1px solid #ffffff4d;flex-direction:column;justify-content:space-between;display:flex;overflow:hidden;box-shadow:0 8px 32px #1f268733}.user-uploads .card:hover,.card:hover{background:#fffffff2;border-color:#667eea80;transform:translateY(-6px);box-shadow:0 16px 48px #667eea4d}body{font-family:var(--font-primary);margin:0}#root{background:linear-gradient(#0f172af2,#1e1b4bf2) fixed;flex-direction:column;min-height:100vh;display:flex}main{padding:var(--spacing-lg);flex:1}.loader-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:9998;pointer-events:all;background:#1e293b66;justify-content:center;align-items:center;width:100%;height:100%;animation:.2s ease-out fadeIn;display:flex;position:fixed;top:0;left:0}@keyframes fadeIn{0%{opacity:0;-webkit-backdrop-filter:blur();backdrop-filter:blur()}to{opacity:1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}.container{width:100%;min-height:calc(100vh - 80px);font-family:var(--font-primary);padding:var(--spacing-lg);background:linear-gradient(135deg,#667eea 0%,#764ba2 25%,#f093fb 50%,#4facfe 75%,#00f2fe 100%) fixed;flex-direction:column;justify-content:center;align-items:center;display:flex}.email-login{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:var(--spacing-2xl);border-radius:var(--radius-xl);width:100%;max-width:450px;margin-bottom:var(--spacing-xl);background:#fffffff2;border:1px solid #ffffff4d;flex-direction:column;justify-content:center;align-items:center;display:flex;box-shadow:0 25px 50px #0000004d,inset 0 1px #fff9}.email-box,.password-box{width:100%;margin-bottom:var(--spacing-lg);align-items:center;display:flex;position:relative}.input-field{width:100%;padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-lg);transition:all var(--transition-base);font-size:1rem;font-family:var(--font-primary);color:var(--text-primary);background-color:#ffffffe6;border:2px solid #667eea33}.input-field::placeholder{color:var(--text-light)}.input-field:focus{background:#fff;border-color:#667eea;outline:none;box-shadow:0 0 0 4px #667eea26}.password-field{padding-right:50px}.visibility-button{cursor:pointer;opacity:.6;width:30px;height:30px;transition:opacity var(--transition-base);background:0 0;border:none;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;right:15px;transform:translateY(-50%)}.visibility-button:hover{opacity:1}.visibility-button img{object-fit:contain;width:20px;height:20px}.sign-in-btn,.google-btn{width:100%;padding:var(--spacing-md);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);border:none;font-size:1.1rem;font-weight:600}.sign-in-btn{color:#fff;margin-top:var(--spacing-lg);background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);box-shadow:0 10px 30px #667eea4d}.sign-in-btn:hover{background:linear-gradient(135deg,#5568d3 0%,#6a3f8f 100%);transform:translateY(-3px);box-shadow:0 15px 40px #667eea66}.sign-in-btn:active{transform:translateY(0)}.google-btn{background:var(--surface);color:var(--text-primary);border:2px solid var(--border-color);justify-content:center;align-items:center;gap:var(--spacing-md);max-width:450px;margin:auto;margin-bottom:var(--spacing-xl);font-size:1rem;display:flex}.google-btn:hover{background:var(--surface-light);border-color:var(--primary-light);box-shadow:var(--shadow-md);transform:translateY(-2px)}.google-btn:active{transform:translateY(0)}.note-box{margin-top:var(--spacing-xl);color:var(--text-secondary);text-align:center;font-size:.95rem}.note-box a{color:var(--primary-color);transition:color var(--transition-base);margin-left:6px;font-weight:600;text-decoration:none}.note-box a:hover{color:var(--primary-dark);text-decoration:underline}.msg-box{color:var(--error);margin-top:var(--spacing-lg);text-align:center;min-height:24px;font-weight:600;animation:.4s ease-in-out shake}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@media (width<=640px){.container{padding:var(--spacing-md);min-height:100vh}.email-login{padding:var(--spacing-xl) var(--spacing-lg);max-width:100%}.input-field{font-size:16px}}.header{z-index:100;border-bottom:1px solid #fff3;position:sticky;top:0;box-shadow:0 8px 32px #1f26871a;-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important;padding:var(--spacing-md) var(--spacing-lg)!important;background:#ffffffd9!important;justify-content:space-between!important;align-items:center!important;height:auto!important;display:flex!important}.menu-bar{padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-md);transition:all var(--transition-base);font-size:1rem;color:var(--text-primary)!important;cursor:pointer!important;margin-right:var(--spacing-md)!important;background:0 0!important;border:none!important;font-weight:600!important}.menu-bar:hover{background-color:var(--surface-light);color:var(--primary-color)}.other{justify-content:center;gap:var(--spacing-xl)!important;flex-grow:1!important;display:flex!important}.other>div{padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);transition:all var(--transition-base);font-weight:500;cursor:pointer!important;color:var(--primary-color)!important}.other>div:hover{color:var(--primary-dark);background-color:#2563eb1a}.profile-img{padding:var(--spacing-md);border-radius:var(--radius-md);transition:all var(--transition-base);align-items:center!important;gap:var(--spacing-md)!important;cursor:pointer!important;margin-left:auto!important;display:flex!important;position:relative!important}.profile-img:hover{background-color:var(--surface-light)}.profile-img p{color:var(--text-primary);font-size:.95rem;font-weight:600;margin:0!important}.profile-img img{border:2px solid var(--primary-light);box-shadow:var(--shadow-sm);transition:all var(--transition-base);object-fit:cover!important;border-radius:50%!important;width:40px!important;height:40px!important}.profile-img img:hover{border-color:var(--primary-color);box-shadow:var(--shadow-md)}.dropdown-menu{animation:.15s ease-out slideDown;top:calc(100% + var(--spacing-sm))!important;background:var(--surface)!important;border:1px solid var(--border-color)!important;border-radius:var(--radius-lg)!important;padding:var(--spacing-sm) 0!important;z-index:1000!important;min-width:180px!important;box-shadow:var(--shadow-lg)!important;position:absolute!important;right:0!important}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.menu-item{white-space:nowrap;font-weight:500;padding:var(--spacing-md) var(--spacing-lg)!important;cursor:pointer!important;transition:all var(--transition-base)!important;color:var(--text-primary)!important}.menu-item:hover{background-color:var(--surface-light);color:var(--primary-color);padding-left:calc(var(--spacing-lg) + 4px)}.menu-item:last-child:hover{color:var(--error)}.dropdown-menu hr{border:none;border-top:1px solid var(--border-color);margin:var(--spacing-sm) 0!important}@media (width<=768px){.header{flex-wrap:wrap;padding:var(--spacing-md)!important}.other{gap:var(--spacing-md)!important}.other>div{font-size:.9rem}.profile-img p{display:none}.dropdown-menu{min-width:150px}}.topic-container{align-items:center;gap:var(--spacing-md);background:linear-gradient(135deg, var(--accent-color) 0%, var(--accent-light) 100%);color:#fff;border-radius:var(--radius-full);min-width:150px;min-height:auto;padding:var(--spacing-md) var(--spacing-lg);box-shadow:var(--shadow-md);transition:all var(--transition-base);white-space:nowrap;flex-wrap:nowrap;display:flex}.topic-container:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.topics-name{text-overflow:ellipsis;flex:1;font-size:.95rem;font-weight:500;overflow:hidden}.remove-topic{cursor:pointer;color:#fff;width:24px;height:24px;transition:all var(--transition-base);background:0 0;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;padding:0;font-size:1.2rem;display:flex}.remove-topic:hover{background:#ffffff4d;transform:scale(1.1)}.remove-topic:active{transform:scale(.95)}.image-container .back-button{left:var(--spacing-lg);top:var(--spacing-lg);cursor:pointer;transition:transform var(--transition-base);position:absolute}.image-container img{cursor:pointer;object-fit:cover;width:200px;height:200px;transition:all var(--transition-base);background-color:#fff;border:6px solid #fff;border-radius:50%;margin:auto;display:block;box-shadow:0 8px 24px #00000026}.image-container img:hover{transform:scale(1.05);box-shadow:0 12px 32px #0003}.user-id-label,.user-name-label{width:100%;margin-bottom:var(--spacing-lg)}.user-id-label label,.user-name-label label{color:var(--text-primary);margin-bottom:var(--spacing-sm);font-size:1rem;font-weight:600;display:block}.user-id-label input,.user-name-label input{width:100%;padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-md);transition:all var(--transition-base);font-size:1rem;font-family:var(--font-primary);color:var(--text-primary);background:#ffffffe6;border:2px solid #667eea33}.user-id-label input:focus,.user-name-label input:focus{background:#fff;border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea26}.user-id-label input:disabled{background:var(--surface-light);cursor:not-allowed;opacity:.6}.user-id-label input:hover:disabled{cursor:not-allowed}.topics-section{width:100%;margin-bottom:var(--spacing-xl)}.topics-section h3{margin-bottom:var(--spacing-md)}.choose{gap:var(--spacing-md);margin-bottom:var(--spacing-lg);flex-wrap:wrap;align-items:center;display:flex}select{min-width:200px;padding:var(--spacing-md);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);font-size:1rem;font-family:var(--font-primary);color:var(--text-primary);background:#ffffffe6;border:2px solid #667eea33;flex:1}.topics{gap:var(--spacing-md);width:100%;padding:var(--spacing-md) 0;flex-wrap:wrap;min-height:auto;display:flex;overflow:visible}.topic{flex-shrink:0;min-width:auto}.submit-button{width:100%;margin-top:var(--spacing-xl);color:#fff;padding:var(--spacing-md) var(--spacing-xl);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;font-size:1rem;font-weight:600;box-shadow:0 10px 30px #667eea4d}.submit-button:hover:enabled{background:linear-gradient(135deg,#5568d3 0%,#6a3f8f 100%);transform:translateY(-3px);box-shadow:0 15px 40px #667eea66}.submit-button:active:enabled{transform:translateY(0)}.submit-button:disabled{background-color:var(--text-light);color:var(--surface);cursor:not-allowed;opacity:.6;transform:none}@media (width<=768px){.edit-profile-container{width:95%;padding:var(--spacing-lg)}.image-container img{width:150px;height:150px}.choose{flex-direction:column}select{width:100%;min-width:auto}.choose-btn{width:100%}}.edit-profile-container{width:95%;max-width:1200px;margin:var(--spacing-xl) auto;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:var(--spacing-xl);border-radius:var(--radius-xl);background:#fffffff2;border:1px solid #fff3;flex-direction:column;align-items:center;display:flex;box-shadow:0 20px 60px #0000004d}.image-container{width:100%;padding:var(--spacing-2xl) 0;border-radius:var(--radius-lg);margin-bottom:var(--spacing-xl);background:linear-gradient(135deg,#667eea 0%,#764ba2 50%,#f093fb 100%);justify-content:center;align-items:center;display:flex;position:relative;box-shadow:0 10px 40px #667eea66}.image-container .back-button{top:var(--spacing-lg);left:var(--spacing-lg);cursor:pointer;transition:transform var(--transition-base);position:absolute}.image-container .back-button:hover{transform:scale(1.1)rotate(-5deg)}.image-container .back-button img{width:45px;height:45px;box-shadow:var(--shadow-md);object-fit:contain;transition:all var(--transition-base);background-color:#fff;border-radius:50%;padding:8px}.image-container .back-button:hover img{box-shadow:var(--shadow-lg)}.image-container img{object-fit:cover;width:180px;height:180px;transition:transform var(--transition-base);background-color:#fff;border:6px solid #fff;border-radius:50%;margin:auto;display:block;box-shadow:0 8px 24px #00000026}.image-container img:hover{transform:scale(1.05)}.user-name-label{color:var(--text-primary);margin-top:var(--spacing-lg);text-align:center;font-size:2.25rem;font-weight:700}.user-id-label{color:var(--text-secondary);margin-bottom:var(--spacing-lg);text-align:center;font-size:1rem}.uploads-count-div{color:var(--primary-color);margin-bottom:var(--spacing-xl);padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-full);transition:all var(--transition-base);background:#2563eb1a;border:1px solid #2563eb33;font-size:1rem;font-weight:600}.uploads-count-div:hover{background:#2563eb26}.interests-section{margin-bottom:var(--spacing-xl);gap:var(--spacing-md);flex-wrap:wrap;justify-content:center;width:100%;display:flex}.interests-section strong{color:var(--text-primary);white-space:nowrap;font-weight:600}.user-uploads{gap:var(--spacing-lg);width:100%;margin-top:var(--spacing-xl);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.card{padding:var(--spacing-lg);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all var(--transition-base);background-color:#ffffffe6;border:1px solid #ffffff4d;flex-direction:column;justify-content:space-between;display:flex;position:relative;overflow:hidden;box-shadow:0 8px 32px #1f268733}.card:hover{background-color:#fffffff2;border-color:#667eea80;transform:translateY(-6px);box-shadow:0 16px 48px #667eea4d}.card .title{margin-bottom:var(--spacing-md);color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:1.25rem;font-weight:700;overflow:hidden}.card .categories{padding-bottom:var(--spacing-sm);gap:var(--spacing-sm);margin-bottom:var(--spacing-md);flex-direction:row;display:flex;overflow:auto hidden}.card .categories::-webkit-scrollbar{height:4px}.card .categories::-webkit-scrollbar-thumb{background:var(--border-color)}.card .category{background-color:var(--surface-light);color:var(--text-secondary);border-radius:var(--radius-full);padding:var(--spacing-sm) var(--spacing-md);white-space:nowrap;border:1px solid var(--border-color);transition:all var(--transition-base);font-size:.8rem;font-weight:600}.card .category:hover{background:var(--primary-light);color:#fff;border-color:var(--primary-color)}.card .open-btn{padding:var(--spacing-sm) var(--spacing-lg);margin-top:var(--spacing-md);border-radius:var(--radius-md);color:#fff;cursor:pointer;transition:all var(--transition-base);background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;align-self:flex-start;font-size:.95rem;font-weight:600;box-shadow:0 8px 20px #667eea4d}.card .open-btn:hover{background:linear-gradient(135deg,#5568d3 0%,#6a3f8f 100%);transform:translateY(-2px);box-shadow:0 12px 28px #667eea66}.card .open-btn:active{transform:translateY(0)}.card .rating{align-items:center;gap:var(--spacing-md);padding-top:var(--spacing-md);border-top:1px solid var(--border-color);margin-top:auto;display:flex}.card .reviews{color:var(--text-secondary);font-size:.9rem;font-weight:500}.owner-actions{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--radius-md);padding:var(--spacing-md);z-index:20;background:#fffffff2;border:1px solid #667eea33;animation:.15s ease-out slideDown;display:none;position:absolute;top:10px;right:10px;box-shadow:0 12px 40px #667eea4d}.owner-actions>div{cursor:pointer;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm);margin-bottom:var(--spacing-sm);transition:all var(--transition-base);font-size:.95rem;font-weight:600}.owner-actions>div:last-child{margin-bottom:0}.owner-actions>div:first-child{color:var(--primary-color)}.owner-actions>div:first-child:hover{background:#2563eb1a}.owner-actions>div:nth-child(2){color:var(--error)}.owner-actions>div:nth-child(2):hover{background:#dc26261a}.loader-overlay{z-index:9999;background:#0000001a;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}@media (width<=1024px){.user-uploads{grid-template-columns:repeat(2,1fr)}}@media (width<=768px){.edit-profile-container{width:100%;padding:var(--spacing-lg)}.user-name-label{font-size:1.75rem}.image-container img{width:150px;height:150px}.user-uploads{grid-template-columns:1fr}.interests-section{justify-content:center}}.link-box{gap:var(--spacing-md);padding:var(--spacing-lg);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:var(--radius-md);transition:all var(--transition-base);background:#ffffffd9;border:1px solid #667eea33;flex-wrap:wrap;align-items:flex-start;display:flex}.link-box:hover{background:#fff;border-color:#667eea66;box-shadow:0 8px 24px #667eea26}.link-input,.link-description-input{padding:var(--spacing-md);border-radius:var(--radius-sm);font-size:1rem;font-family:var(--font-primary);color:var(--text-primary);transition:all var(--transition-base);background:#ffffffe6;border:1px solid #667eea33}.link-input::placeholder,.link-description-input::placeholder{color:var(--text-light)}.link-input:focus,.link-description-input:focus{border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea26}.remove-link-btn{color:#fff;padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-base);background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);border:none;font-weight:600;box-shadow:0 6px 20px #ef44444d}.remove-link-btn:hover{background:linear-gradient(135deg,#dc2626 0%,#b91c1c 100%);transform:translateY(-2px);box-shadow:0 10px 28px #ef444466}.remove-link-btn:active{transform:translateY(0)}.hyperlinks-container{gap:var(--spacing-md);flex-direction:column;width:100%;display:flex}.hyperlinks-header{color:var(--text-primary);margin-bottom:var(--spacing-md);font-size:1.1rem;font-weight:600}.add-link-btn{padding:var(--spacing-md) var(--spacing-lg);background:var(--success);color:#fff;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);box-shadow:var(--shadow-md);border:none;align-self:flex-start;font-weight:600}.add-link-btn:hover{box-shadow:var(--shadow-lg);background:#0d9488;transform:translateY(-2px)}.add-link-btn:active{transform:translateY(0)}.links-empty-state{text-align:center;padding:var(--spacing-xl);color:var(--text-light);background:var(--surface-light);border:2px dashed var(--border-color);border-radius:var(--radius-md)}.preview{align-items:center;gap:var(--spacing-md);width:100%;margin-top:var(--spacing-lg);padding:var(--spacing-md);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:var(--radius-md);transition:all var(--transition-base);background:#ffffff80;border:2px dashed #667eea4d;display:flex;overflow-x:auto}.preview:hover{background:#667eea14;border-color:#667eea99}.preview::-webkit-scrollbar{height:6px}.preview::-webkit-scrollbar-track{background:0 0}.preview::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:var(--radius-full)}.img-vid{object-fit:cover;border-radius:var(--radius-md);width:200px;height:180px;box-shadow:var(--shadow-md);transition:transform var(--transition-base);flex-shrink:0}.img-vid:hover{transform:scale(1.05)}.multi-upload{align-items:center;gap:var(--spacing-lg);width:100%;margin-top:var(--spacing-lg);flex-direction:column;display:flex}.multi-upload form{gap:var(--spacing-md);flex-direction:column;width:100%;display:flex}.multi-upload input[type=file]{display:none}.other-files{margin:var(--spacing-lg) 0;border-radius:var(--radius-md);color:#fff;width:200px;height:180px;transition:all var(--transition-base);cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 50%,#f093fb 100%);border:2px dashed #ffffff80;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;font-weight:600;display:flex;box-shadow:0 10px 40px #667eea66}.other-files:hover{box-shadow:var(--shadow-lg);transform:scale(1.05)}.preview-item{display:inline-block;position:relative}.preview-btn{background:var(--error);color:#fff;cursor:pointer;width:28px;height:28px;transition:all var(--transition-base);box-shadow:var(--shadow-md);border:none;border-radius:50%;justify-content:center;align-items:center;font-size:16px;font-weight:700;display:flex;position:absolute;top:8px;right:8px}.preview-btn:hover{box-shadow:var(--shadow-lg);background:#c41f1f;transform:scale(1.1)}.preview-btn:active{transform:scale(.95)}.multi-upload button{padding:var(--spacing-md) var(--spacing-xl);background:var(--primary-color);color:#fff;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);box-shadow:var(--shadow-md);border:none;font-size:1rem;font-weight:600}.multi-upload button:hover{background:var(--primary-dark);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.multi-upload button:active{transform:translateY(0)}.multi-upload button:disabled{background:var(--text-light);cursor:not-allowed;opacity:.6;transform:none}@media (width<=768px){.preview{max-height:220px}.img-vid,.other-files{width:160px;height:140px}.multi-upload{gap:var(--spacing-md)}}.title,.desc,input[type=text]{width:100%;padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-md);transition:all var(--transition-base);font-size:1rem;font-family:var(--font-primary);color:var(--text-primary);background-color:#ffffffe6;border:2px solid #667eea33}.title:focus,.desc:focus,input[type=text]:focus{background:#fff;border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea26}select{padding:var(--spacing-md);border-radius:var(--radius-md);cursor:pointer;min-width:200px;color:var(--text-primary);transition:all var(--transition-base);font-size:1rem;font-family:var(--font-primary);background:#ffffffe6;border:2px solid #667eea33;flex:1}@media (width<=768px){.container{width:95%;margin:var(--spacing-lg) auto;padding:var(--spacing-lg)}.choose{flex-direction:column}select{width:100%;min-width:auto}.choose-btn{width:100%}.topics{max-height:auto;flex-wrap:wrap;overflow-x:visible}.topic{flex:auto;min-width:auto}}.container{width:90%;max-width:900px;margin:var(--spacing-xl) auto;padding:var(--spacing-2xl);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--radius-xl);gap:var(--spacing-lg);background:#fffffff2;border:1px solid #fff3;flex-direction:column;display:flex;box-shadow:0 20px 60px #0000004d}.label{color:var(--text-primary);margin-top:var(--spacing-md);margin-bottom:var(--spacing-sm);font-size:1.1rem;font-weight:600;display:block}.title,.desc,input[type=text]{width:100%;padding:var(--spacing-md) var(--spacing-lg);border:2px solid var(--border-color);border-radius:var(--radius-md);transition:all var(--transition-base);font-size:1rem;font-family:var(--font-primary);background-color:var(--surface-light);color:var(--text-primary)}.title::placeholder,.desc::placeholder,input[type=text]::placeholder{color:var(--text-light)}.title:focus,.desc:focus,input[type=text]:focus{border-color:var(--primary-color);background:var(--surface);outline:none;box-shadow:0 0 0 3px #2563eb1a}.choose{gap:var(--spacing-md);flex-wrap:wrap;align-items:center;display:flex}select{padding:var(--spacing-md);border:2px solid var(--border-color);border-radius:var(--radius-md);background:var(--surface-light);cursor:pointer;min-width:200px;color:var(--text-primary);transition:all var(--transition-base);font-size:1rem;font-family:var(--font-primary);flex:1}select:focus{border-color:var(--primary-color);outline:none;box-shadow:0 0 0 3px #2563eb1a}select option{color:var(--text-primary);background:var(--surface)}.choose-btn{padding:var(--spacing-md) var(--spacing-lg);color:#fff;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);background:linear-gradient(135deg,#10b981 0%,#059669 100%);border:none;justify-content:center;align-items:center;min-width:50px;height:48px;font-size:1.1rem;font-weight:600;display:flex}.choose-btn:hover{background:linear-gradient(135deg,#059669 0%,#047857 100%);transform:translateY(-3px);box-shadow:0 10px 30px #10b9814d}.choose-btn:active{transform:translateY(0)}.topics{gap:var(--spacing-md);width:100%;min-height:auto;max-height:120px;padding:var(--spacing-md) 0;flex-wrap:wrap;align-content:flex-start;display:flex;overflow-x:auto}.topics::-webkit-scrollbar{height:6px}.topics::-webkit-scrollbar-track{background:0 0}.topics::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:var(--radius-full)}.topic{background:var(--accent-color);color:#fff;min-width:150px;padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);transition:all var(--transition-base);justify-content:space-between;align-items:center;font-weight:500;display:flex}.topic:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}button{padding:var(--spacing-md) var(--spacing-xl);color:#fff;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;font-size:1rem;font-weight:600;box-shadow:0 10px 30px #667eea4d}button:hover{background:linear-gradient(135deg,#5568d3 0%,#6a3f8f 100%);transform:translateY(-3px);box-shadow:0 15px 40px #667eea66}button:active{transform:translateY(0)}button:disabled{background:var(--text-light);cursor:not-allowed;opacity:.6;transform:none}.color-ring-wrapper{z-index:9999;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}@media (width<=768px){.container{width:95%;margin:var(--spacing-lg) auto;padding:var(--spacing-lg)}.choose{flex-direction:column}select{width:100%;min-width:auto}.choose-btn{width:100%}.topics{max-height:auto;flex-wrap:wrap;overflow-x:visible}.topic{flex:auto;min-width:auto}}.view-upload-container{max-width:1200px;padding:var(--spacing-xl);gap:var(--spacing-xl);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--radius-lg);background:#fffffff2;margin:0 auto;display:flex;box-shadow:0 20px 60px #00000026}.left-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:var(--spacing-lg);border-radius:var(--radius-lg);background:#ffffffe6;border:1px solid #ffffff4d;flex:2}.right-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:var(--spacing-lg);border-radius:var(--radius-lg);background:#ffffffd9;border:1px solid #ffffff4d;flex:1;max-height:max-content;position:sticky;top:80px}.upload-title{color:var(--text-primary);margin-bottom:var(--spacing-lg);font-size:1.75rem;font-weight:700;line-height:1.3}.upload-desc{color:var(--text-secondary);margin:var(--spacing-lg) 0;background:var(--surface-light);padding:var(--spacing-lg);border-radius:var(--radius-md);border-left:4px solid var(--primary-color);font-size:1rem;line-height:1.6}.upload-meta{gap:var(--spacing-lg);margin:var(--spacing-xl) 0;padding:var(--spacing-lg);background:var(--surface-light);border-radius:var(--radius-md);flex-wrap:wrap;display:flex}.meta-item{gap:var(--spacing-sm);flex-direction:column;display:flex}.meta-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;font-size:.85rem;font-weight:600}.meta-value{color:var(--text-primary);font-weight:600}.category-badges{gap:var(--spacing-sm);margin-top:var(--spacing-lg);flex-wrap:wrap;display:flex}.category-badge{background:linear-gradient(135deg, var(--primary-light) 0%, var(--primary-color) 100%);color:#fff;padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);transition:all var(--transition-base);font-size:.9rem;font-weight:600}.category-badge:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.content-links{margin-top:var(--spacing-xl);background:var(--surface);padding:var(--spacing-lg);border:1px solid var(--border-color);border-radius:var(--radius-lg)}.content-links h3{margin-top:0;margin-bottom:var(--spacing-lg);color:var(--text-primary);font-size:1.25rem}.link-item{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-md);margin-bottom:var(--spacing-md);transition:all var(--transition-base);background:#ffffffb3;border:1px solid #667eea1a}.link-item:hover{border-color:#667eea4d;box-shadow:0 8px 24px #667eea26}.link-item:last-child{margin-bottom:0}.link-description{color:var(--text-primary);margin-bottom:var(--spacing-sm);font-weight:600}.link-url{color:var(--primary-color);word-break:break-all;transition:color var(--transition-base);font-size:.95rem}.link-url:hover{color:var(--primary-dark)}.comment-section{margin-top:var(--spacing-2xl);border-top:2px solid var(--border-color);padding-top:var(--spacing-xl)}.comment-section h3{margin-bottom:var(--spacing-lg);color:var(--text-primary)}.new-comment{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:var(--spacing-lg);border-radius:var(--radius-lg);margin-bottom:var(--spacing-xl);background:#ffffffd9;border:1px solid #667eea33}.new-comment textarea{width:100%;min-height:100px;padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-md);font-family:var(--font-primary);resize:vertical;transition:all var(--transition-base);color:var(--text-primary);background:#ffffffe6;border:2px solid #667eea33;font-size:1rem}.new-comment textarea:focus{background:#fff;border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea26}.new-comment button{margin-top:var(--spacing-md);padding:var(--spacing-md) var(--spacing-xl);color:#fff;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;font-weight:600;box-shadow:0 10px 30px #667eea4d}.new-comment button:hover{background:linear-gradient(135deg,#5568d3 0%,#6a3f8f 100%);transform:translateY(-3px);box-shadow:0 15px 40px #667eea66}.comment-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:var(--spacing-lg);border-radius:var(--radius-lg);margin-bottom:var(--spacing-lg);transition:all var(--transition-base);background:#ffffffd9;border:1px solid #667eea1a}.comment-card:hover{border-color:#667eea4d;box-shadow:0 8px 24px #667eea26}.comment-card:last-child{margin-bottom:0}.comment-header{margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-md);border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;display:flex}.comment-author{color:var(--text-primary);font-weight:700}.comment-time{color:var(--text-light);font-size:.9rem}.comment-rating{align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-md);display:flex}.comment-text{color:var(--text-secondary);line-height:1.6}@media (width<=1024px){.view-upload-container{flex-direction:column}.right-section{max-height:none;position:static}}@media (width<=768px){.view-upload-container{padding:var(--spacing-lg);gap:var(--spacing-lg)}.upload-title{font-size:1.5rem}.upload-meta{flex-direction:column}.category-badges{gap:var(--spacing-md)}}