:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-user-select:none;user-select:none}body{margin:0;min-width:320px;min-height:100vh;background:#08080e;color:#e4e4e7}#root{width:100%;min-height:100vh}*{margin:0;padding:0;box-sizing:border-box}:root{--color-background: #08080e;--color-surface: #0f0f18;--color-surface-2: #161622;--color-primary: #e4e4e7;--color-secondary: #71717a;--color-border: #1e1e2e;--color-hover: rgba(255, 255, 255, .05);--color-active: #ffffff;--color-active-bg: rgba(255, 255, 255, .08);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .4);--shadow-md: 0 4px 12px rgba(0, 0, 0, .5);--shadow-lg: 0 8px 30px rgba(0, 0, 0, .6);--black: #000000;--black2: #0a0a12;--black2-40: rgba(10, 10, 18, .4);--black2-50: rgba(10, 10, 18, .5);--black2-60: rgba(10, 10, 18, .6);--black2-80: rgba(10, 10, 18, .8);--black2-90: rgba(10, 10, 18, .92);--white: #e4e4e7;--white-20: rgba(228, 228, 231, .12);--white-30: rgba(228, 228, 231, .18);--white-50: rgba(228, 228, 231, .4);--white-70: rgba(228, 228, 231, .6);--white-80: rgba(228, 228, 231, .75);--accent-red: #ef4444;--accent-purple: #a78bfa;--accent-blue: #60a5fa;--border-radius-sm: .5vh;--border-radius: .25vh;--border-radius-lg: .25vh;--transition-smooth: .3s cubic-bezier(.4, 0, .2, 1);--spacing-xs: .375rem;--spacing-sm: .75rem;--spacing-md: 1.25rem;--spacing-lg: 2rem;--spacing-xl: 3rem}.app{min-height:100vh;background:var(--color-background);display:flex;flex-direction:column;color:var(--color-primary)}.header{background:#0f0f18d9;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:100;box-shadow:0 1px 20px #0006}.header-container{width:100%;margin:0;padding:.875rem 2rem;display:flex;align-items:center;justify-content:space-between}.header-logo{display:flex;align-items:center;gap:1rem}.logo-icon{font-size:2rem;display:flex;align-items:center;justify-content:center}.logo-text h1{font-size:1.5rem;font-weight:700;color:var(--color-primary);letter-spacing:-.02em;margin:0;line-height:1;background:linear-gradient(135deg,#fff,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.logo-tagline{font-size:.75rem;color:var(--color-secondary);font-weight:400;display:block;margin-top:.25rem}.header-nav{display:flex;gap:.625rem}.nav-item{padding:.625rem 1.125rem;background:transparent;border:1px solid transparent;color:var(--color-secondary);font-size:.9rem;font-weight:500;cursor:pointer;border-radius:var(--border-radius);transition:all var(--transition-smooth);font-family:inherit;display:flex;align-items:center;gap:.5rem}.nav-item:hover{background:var(--color-hover);color:var(--color-primary);border-color:var(--color-border)}.main-content{display:flex;flex:1;width:100%;gap:0}.sidebar{width:280px;min-width:280px;background:var(--color-surface);border-right:1px solid var(--color-border);overflow-y:auto;position:sticky;top:60px;height:calc(100vh - 60px);align-self:flex-start;display:flex;flex-direction:column}.sidebar-header{padding:1.25rem 1.5rem .75rem}.category-nav{padding:1.25rem;display:flex;flex-direction:column;gap:.375rem}.categories-divider{height:1px;background:var(--color-border);margin:1rem 0}.category-item,.subcategory-item{width:100%;padding:.875rem 1rem;border:1px solid transparent;background:transparent;color:var(--color-primary);text-align:left;cursor:pointer;border-radius:var(--border-radius);font-size:.9rem;transition:all var(--transition-smooth);display:flex;align-items:center;gap:.875rem;font-family:inherit;position:relative}.category-item:hover,.subcategory-item:hover{background:var(--color-hover);border-color:var(--color-border)}.category-item.active{background:var(--color-active-bg);color:var(--color-active);font-weight:500;border-color:#a78bfa33}.category-item.all-items.active{background:linear-gradient(135deg,#a78bfa26,#60a5fa1a);color:#fff;border-color:#a78bfa4d}.category-item.all-items.active .category-count{color:#ffffffb3}.subcategory-item.active{background:var(--color-active-bg);color:var(--color-active);font-weight:500;border-color:#a78bfa26}.category-icon-main{font-size:1.25rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.category-text{flex:1;display:flex;align-items:center;justify-content:space-between;gap:.5rem;min-width:0}.category-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.category-count{font-size:.7rem;color:var(--color-secondary);font-weight:500;flex-shrink:0;background:#ffffff0f;padding:.2rem .6rem;border-radius:10px;border:1px solid var(--color-border)}.category-item.active .category-count{background:#a78bfa1f;color:var(--accent-purple);border-color:#a78bfa33}.expand-icon{font-size:.875rem;color:var(--color-secondary);font-weight:400;flex-shrink:0;width:16px;text-align:center}.category-group{display:flex;flex-direction:column;gap:.2rem}.subcategory-list{display:flex;flex-direction:column;gap:.2rem;margin-left:2.25rem;margin-top:.2rem;margin-bottom:.75rem}.subcategory-item{font-size:.875rem;padding:.75rem .875rem;gap:.625rem}.subcategory-icon{font-size:1rem}.subcategory-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gallery{flex:1;padding:2.5rem 3rem;background:var(--color-background);min-width:0}.gallery-header{margin-bottom:2.5rem}.gallery-header h2{font-size:1.75rem;color:var(--color-primary);margin-bottom:.5rem;font-weight:700;letter-spacing:-.02em;display:flex;align-items:center;gap:0}.gallery-title-parent{color:var(--color-secondary);font-weight:500}.gallery-title-sep{color:var(--color-border);margin:0 .625rem;font-weight:300}.gallery-header-meta{display:flex;align-items:center;gap:1rem}.image-count{color:var(--color-secondary);font-size:.875rem;font-weight:400}.search-result-hint{color:var(--accent-purple);font-size:.8rem;font-weight:500;background:#a78bfa14;padding:.25rem .75rem;border-radius:20px;border:1px solid rgba(167,139,250,.15)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}.gallery-item{position:relative;border-radius:var(--border-radius);overflow:hidden;cursor:pointer;background:var(--color-surface-2);transition:all .35s cubic-bezier(.4,0,.2,1);aspect-ratio:16/10;border:1px solid var(--color-border)}.gallery-item.loading img{opacity:0}.gallery-item.loaded img{opacity:1}.gallery-item-shimmer{position:absolute;inset:0;background:linear-gradient(110deg,var(--color-surface-2) 30%,rgba(255,255,255,.03) 50%,var(--color-surface-2) 70%);background-size:200% 100%;animation:shimmer 1.8s ease-in-out infinite;z-index:1;pointer-events:none}.gallery-item.loaded .gallery-item-shimmer{opacity:0;transition:opacity .4s ease}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.gallery-item:hover{transform:translateY(-3px);box-shadow:0 8px 24px #0006;border-color:#a78bfa26}.gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .3s ease;position:relative;z-index:2}.gallery-item-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(8,8,14,.92),rgba(8,8,14,.4) 55%,transparent);color:var(--color-primary);padding:3rem 1.25rem 1.25rem;transition:opacity .25s ease;z-index:3;opacity:0}.gallery-item:hover .gallery-item-overlay{opacity:1}.gallery-item-overlay h3{font-size:.925rem;margin-bottom:.25rem;font-weight:600;letter-spacing:-.01em;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.4)}.gallery-item-overlay p{font-size:.8rem;font-weight:400;color:#fff9}.empty-state{text-align:center;padding:6rem 2rem;color:var(--color-secondary);display:flex;flex-direction:column;align-items:center}.empty-state .empty-icon{font-size:3.5rem;margin-bottom:1.5rem;opacity:.35}.empty-state .empty-title{font-size:1.15rem;font-weight:600;color:var(--color-primary);margin-bottom:.5rem}.empty-state .empty-subtitle{font-size:.9rem;color:var(--color-secondary);font-weight:400}.lightbox{position:fixed;inset:0;background:#040408f7;display:flex;align-items:center;justify-content:center;z-index:1000;padding:0}.lightbox-content{position:relative;width:100%;height:100%;display:flex;flex-direction:column}.lightbox-toolbar{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;background:#0a0a12cc;border-bottom:1px solid rgba(255,255,255,.06);z-index:10;flex-shrink:0}.lightbox-counter{font-size:.8rem;color:var(--color-secondary);font-weight:500;letter-spacing:.05em;background:#ffffff0d;padding:.35rem .875rem;border-radius:20px;border:1px solid rgba(255,255,255,.06)}.lightbox-actions{display:flex;align-items:center;gap:.5rem}.lightbox-fav-btn{width:40px;height:40px;border:1px solid rgba(255,255,255,.1);background:#ffffff0a;color:var(--color-primary);font-size:1.1rem;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-smooth)}.lightbox-fav-btn:hover{background:#ffffff14;border-color:#fff3}.lightbox-fav-btn.is-fav{background:#ef444426;border-color:#ef44444d}.lightbox-close{width:40px;height:40px;border:1px solid rgba(255,255,255,.1);background:#ffffff0a;color:var(--color-primary);font-size:1.2rem;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.lightbox-close:hover{background:var(--accent-red);border-color:var(--accent-red)}.lightbox-image-area{flex:1;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;min-height:0}.lightbox-image-area img{max-width:90%;max-height:100%;object-fit:contain;display:block;border-radius:4px;pointer-events:none}.lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);width:50px;height:50px;border:1px solid rgba(255,255,255,.08);background:#0a0a12b3;color:var(--color-primary);font-size:1.75rem;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,border-color .2s;z-index:5;line-height:1;padding-bottom:2px}.lightbox-nav:hover{background:#ffffff1a;border-color:#fff3}.lightbox-prev{left:1.5rem}.lightbox-next{right:1.5rem}.lightbox-info{padding:1.25rem 2rem;background:#0a0a12cc;border-top:1px solid rgba(255,255,255,.06);flex-shrink:0}.lightbox-info h3{font-size:1.1rem;margin-bottom:.375rem;color:var(--color-primary);font-weight:600;letter-spacing:-.01em}.lightbox-info p{color:var(--color-secondary);font-size:.9rem;line-height:1.5}@media(max-width:1024px){.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.5rem}.header-container{padding:1.125rem 1.5rem}}@media(max-width:768px){.main-content{flex-direction:column}.sidebar{width:100%;min-width:100%;max-height:none;border-right:none;border-bottom:1px solid var(--color-border);position:relative;top:0;height:auto}.gallery{padding:1.5rem}.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.25rem}.header-container{padding:1rem}.header-nav{display:none}.logo-text h1{font-size:1.25rem}.logo-tagline{font-size:.7rem}.gallery-header h2{font-size:1.5rem}.lightbox-nav{width:40px;height:40px;font-size:1.4rem}.lightbox-prev{left:.75rem}.lightbox-next{right:.75rem}}@media(max-width:480px){.gallery-grid{grid-template-columns:1fr}.gallery{padding:1.25rem}.header-container{padding:.875rem}.logo-text h1{font-size:1.125rem}.logo-icon{font-size:1.5rem}.lightbox-content{max-width:95vw;border-radius:var(--border-radius)}.lightbox{padding:1rem}.gallery-item{border-radius:var(--border-radius)}}.sidebar::-webkit-scrollbar{width:5px}.sidebar::-webkit-scrollbar-track{background:transparent}.sidebar::-webkit-scrollbar-thumb{background:#ffffff14;border-radius:3px}.sidebar::-webkit-scrollbar-thumb:hover{background:#ffffff26}.loading-state,.error-banner{text-align:center;padding:4rem 2rem;color:var(--color-secondary)}.loading-state p{font-size:1rem;font-weight:500}.error-banner{background:#ef44441a;border-bottom:1px solid rgba(239,68,68,.2);color:#fca5a5;padding:1rem 2rem;text-align:center}.error-banner p{margin:0;font-size:.9rem;font-weight:500}.gallery-item .favorite-btn{position:absolute;top:.75rem;right:.75rem;width:38px;height:38px;border:1px solid rgba(255,255,255,.15);border-radius:50%;background:#0a0a12b3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;font-size:1.1rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-smooth);z-index:5;opacity:0;transform:translateY(-5px) scale(.9)}.gallery-item:hover .favorite-btn{opacity:1;transform:translateY(0) scale(1)}.gallery-item .favorite-btn:hover{background:#0a0a12e6;border-color:#ffffff4d}.gallery-item .favorite-btn.is-fav{opacity:1;background:var(--accent-red);border-color:var(--accent-red);transform:translateY(0) scale(1)}.gallery-item .favorite-btn.is-fav:hover{background:#dc2626;border-color:#dc2626}.sidebar-header{padding:1.25rem 1.5rem 1rem}.sidebar-header h2{font-size:.65rem;font-weight:600;color:var(--color-secondary);text-transform:uppercase;letter-spacing:.12em;margin:0}.sidebar-search{padding:1.25rem 1.25rem .75rem}.search-input-wrapper{position:relative;display:flex;align-items:center;border-radius:var(--border-radius);background:#ffffff06;border:1px solid var(--color-border);transition:all var(--transition-smooth);overflow:hidden}.search-input-wrapper:hover{border-color:#ffffff14;background:#ffffff09}.search-input-wrapper:focus-within{border-color:#a78bfa59;background:#a78bfa0a;box-shadow:0 0 0 3px #a78bfa0f,0 2px 12px #a78bfa0f}.search-input-wrapper.has-value{border-color:#a78bfa33;background:#a78bfa08}.search-icon-svg{position:absolute;left:.875rem;width:16px!important;height:16px!important;min-width:16px;max-width:16px;min-height:16px;max-height:16px;color:var(--color-secondary);pointer-events:none;transition:color var(--transition-smooth);flex-shrink:0}.search-input-wrapper:focus-within .search-icon-svg{color:var(--accent-purple)}.search-input-wrapper.has-value .search-icon-svg{color:var(--accent-purple)}.search-input{width:100%;padding:.65rem 2.25rem .65rem 2.625rem;background:transparent;border:none;color:var(--color-primary);font-size:.8rem;font-family:inherit;letter-spacing:.01em}.search-input::placeholder{color:#71717ab3;font-size:.8rem}.search-input:focus{outline:none}.search-clear{position:absolute;right:.5rem;width:22px;height:22px;border:none;background:#ffffff0f;color:var(--color-secondary);border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-smooth);padding:0}.search-clear svg{width:10px;height:10px}.search-clear:hover{background:#ef44441f;color:#fca5a5}.search-clear:active{opacity:.7}.category-nav{padding:1.25rem}.favorites-item{margin-bottom:.375rem}.favorites-item:hover{border-color:#ef444433!important;background:#ef44440f!important}.favorites-item.active{background:linear-gradient(135deg,#ef44441f,#ef44440f)!important;border-color:#ef444440!important}.favorites-item.active .category-icon-main{filter:drop-shadow(0 0 8px rgba(239,68,68,.5))}.fav-count{background:#ef444426!important;color:#fca5a5!important;border-color:#ef444433!important}.api-status-item:hover{border-color:#60a5fa33!important;background:#60a5fa0f!important}.api-status-item.active{background:linear-gradient(135deg,#60a5fa1f,#60a5fa0f)!important;border-color:#60a5fa40!important}.category-group{margin-bottom:.25rem}.subcategory-list{margin-top:.25rem;margin-left:1.125rem;padding-left:1.125rem;border-left:2px solid rgba(255,255,255,.06);display:flex;flex-direction:column;gap:.25rem}.subcategory-item{font-size:.875rem;padding:.75rem .875rem}.subcategory-icon{font-size:.875rem}.subcategory-item.active{background:var(--color-active-bg);border-color:#a78bfa26}.sidebar-footer{padding:1.25rem 1.75rem;margin-top:auto;background:#0a0a1266;border-top:1px solid var(--color-border)}.sidebar-footer p{margin:0;font-size:.75rem;color:var(--color-secondary);text-align:center}@media(max-width:768px){.sidebar-header{padding:1.25rem}.sidebar-logo h2{font-size:1.125rem}.sidebar-search,.category-nav,.sidebar-footer{padding:.875rem}}.api-status{flex:1;padding:2.5rem 3rem;min-width:0}.api-status-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}.api-status-header h2{font-size:1.75rem;font-weight:700;color:var(--color-primary);letter-spacing:-.02em}.api-status-actions{display:flex;align-items:center;gap:1rem}.auto-refresh-toggle{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--color-secondary);cursor:pointer}.auto-refresh-toggle input[type=checkbox]{accent-color:var(--accent-purple);width:14px;height:14px;cursor:pointer}.refresh-btn{padding:.5rem 1rem;background:#ffffff0a;border:1px solid var(--color-border);color:var(--color-primary);font-size:.8rem;font-family:inherit;border-radius:var(--border-radius);cursor:pointer;transition:background .2s,border-color .2s}.refresh-btn:hover{background:#ffffff14;border-color:#ffffff1f}.refresh-btn:disabled{opacity:.5;cursor:not-allowed}.status-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.25rem;margin-bottom:2rem}.status-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-lg);overflow:hidden}.status-card-header{display:flex;align-items:center;gap:.75rem;padding:1.25rem 1.5rem;border-bottom:1px solid var(--color-border)}.status-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.status-card-header h3{font-size:.95rem;font-weight:600;color:var(--color-primary);flex:1;font-family:SF Mono,Fira Code,monospace}.status-badge{font-size:.7rem;font-weight:600;padding:.2rem .625rem;border-radius:20px;text-transform:uppercase;letter-spacing:.05em}.status-card-body{padding:1.25rem 1.5rem;display:flex;flex-direction:column;gap:.875rem}.stat{display:flex;align-items:center;justify-content:space-between}.stat-label{font-size:.8rem;color:var(--color-secondary)}.stat-value{font-size:.85rem;font-weight:600;color:var(--color-primary);font-family:SF Mono,Fira Code,monospace}.ping-history{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-lg);padding:1.5rem;margin-bottom:2rem}.ping-history h3{font-size:.95rem;font-weight:600;color:var(--color-primary);margin-bottom:1.25rem}.ping-bars{display:flex;align-items:flex-end;gap:6px;height:120px;padding-bottom:.5rem;border-bottom:1px solid var(--color-border)}.ping-bar-group{flex:1;display:flex;align-items:flex-end;gap:2px;height:100%}.ping-bar{flex:1;border-radius:3px 3px 0 0;min-height:4px;transition:height .3s ease}.health-bar{background:#22c55e;opacity:.8}.gallery-bar{background:var(--accent-purple);opacity:.8}.ping-legend{display:flex;align-items:center;gap:1.25rem;margin-top:.875rem;font-size:.75rem;color:var(--color-secondary)}.legend-dot{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:.375rem}.legend-dot.health{background:#22c55e}.legend-dot.gallery-leg{background:var(--accent-purple)}.ping-avg{margin-left:auto;font-family:SF Mono,Fira Code,monospace;font-weight:500}.no-data{flex:1;display:flex;align-items:center;justify-content:center;color:var(--color-secondary);font-size:.8rem}.endpoint-list{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-lg);padding:1.5rem}.endpoint-list h3{font-size:.95rem;font-weight:600;color:var(--color-primary);margin-bottom:1rem}.endpoint-item{display:flex;align-items:center;justify-content:space-between;padding:.875rem 1rem;border-radius:var(--border-radius);background:#ffffff05;border:1px solid var(--color-border);margin-bottom:.5rem}.endpoint-item:last-child{margin-bottom:0}.endpoint-item code{font-size:.8rem;color:var(--accent-purple);font-family:SF Mono,Fira Code,monospace;font-weight:500}.endpoint-desc{font-size:.8rem;color:var(--color-secondary)}@media(max-width:768px){.api-status{padding:1.5rem}.api-status-header{flex-direction:column;align-items:flex-start;gap:1rem}.status-cards{grid-template-columns:1fr}.endpoint-item{flex-direction:column;align-items:flex-start;gap:.375rem}}.suggest-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.suggest-modal{background:var(--color-bg, #1a1a2e);border-radius:12px;width:100%;max-width:500px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px #0006;animation:slideUp .3s ease}.suggest-modal-large{max-width:700px}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.suggest-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--color-border, #2d2d44)}.suggest-header h2{margin:0;font-size:1.25rem;color:var(--color-text, #fff)}.suggest-close{background:none;border:none;color:var(--color-secondary, #a0a0b0);font-size:1.25rem;cursor:pointer;padding:8px;border-radius:4px;transition:all .2s}.suggest-close:hover{background:var(--color-hover, #2d2d44);color:var(--color-text, #fff)}.suggest-body{padding:24px;overflow-y:auto}.suggest-intro{color:var(--color-secondary, #a0a0b0);font-size:.9rem;margin:0 0 20px;line-height:1.5}.suggest-alert{padding:12px 16px;border-radius:8px;margin-bottom:20px;font-size:.9rem}.suggest-alert.success{background:#4caf5026;color:#4caf50;border:1px solid rgba(76,175,80,.3)}.suggest-alert.error{background:#f4433626;color:#f44336;border:1px solid rgba(244,67,54,.3)}.suggest-form{display:flex;flex-direction:column;gap:20px}.drop-zone{border:2px dashed var(--color-border, #2d2d44);border-radius:12px;padding:24px;text-align:center;cursor:pointer;transition:all .3s ease;background:var(--color-bg-secondary, #16162a);position:relative}.drop-zone:hover{border-color:#6c63ff;background:#6c63ff0d}.drop-zone.dragging{border-color:#6c63ff;background:#6c63ff1a;transform:scale(1.02)}.drop-zone.has-images{padding:16px}.drop-zone-content{display:flex;flex-direction:column;align-items:center;gap:8px}.drop-zone-icon{font-size:2.5rem;margin-bottom:4px}.drop-zone-text{color:var(--color-text, #fff);font-size:1rem;font-weight:500;margin:0}.drop-zone-subtext{color:var(--color-secondary, #a0a0b0);font-size:.85rem;margin:0}.drop-zone-count{position:absolute;bottom:8px;right:12px;font-size:.75rem;color:var(--color-secondary, #a0a0b0);background:var(--color-bg, #1a1a2e);padding:2px 8px;border-radius:4px}.dropped-images-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:12px}.dropped-image-item{position:relative;aspect-ratio:1;border-radius:8px;overflow:hidden;background:var(--color-bg, #1a1a2e);border:1px solid var(--color-border, #2d2d44)}.dropped-image-item img{width:100%;height:100%;object-fit:cover}.remove-image-btn{position:absolute;top:4px;right:4px;width:20px;height:20px;border-radius:50%;background:#000000b3;color:#fff;border:none;cursor:pointer;font-size:10px;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}.dropped-image-item:hover .remove-image-btn{opacity:1}.remove-image-btn:hover{background:#f44336}.image-name{position:absolute;bottom:0;left:0;right:0;font-size:.65rem;color:#fff;background:#000000b3;padding:2px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.add-more-images{aspect-ratio:1;border:2px dashed var(--color-border, #2d2d44);border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;color:var(--color-secondary, #a0a0b0);font-size:.8rem}.add-more-images:hover{border-color:#6c63ff;color:#6c63ff}.add-more-images span:first-child{font-size:1.5rem;font-weight:300}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:.9rem;font-weight:500;color:var(--color-text, #fff)}.form-group .required{color:#f44336}.form-group input,.form-group textarea{background:var(--color-bg-secondary, #16162a);border:1px solid var(--color-border, #2d2d44);border-radius:8px;padding:12px 14px;font-size:.95rem;color:var(--color-text, #fff);font-family:inherit;transition:border-color .2s,box-shadow .2s}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#6c63ff;box-shadow:0 0 0 3px #6c63ff26}.form-group input::placeholder,.form-group textarea::placeholder{color:var(--color-secondary, #a0a0b0);opacity:.7}.form-group input:disabled,.form-group textarea:disabled{opacity:.6;cursor:not-allowed}.form-group textarea{resize:vertical;min-height:80px}.form-hint{font-size:.8rem;color:var(--color-secondary, #a0a0b0)}.image-preview{border-radius:8px;overflow:hidden;border:1px solid var(--color-border, #2d2d44)}.image-preview img{width:100%;max-height:200px;object-fit:contain;display:block;background:var(--color-bg-secondary, #16162a)}.form-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:8px}.btn-cancel,.btn-submit{padding:10px 20px;border-radius:8px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s}.btn-cancel{background:transparent;border:1px solid var(--color-border, #2d2d44);color:var(--color-secondary, #a0a0b0)}.btn-cancel:hover:not(:disabled){background:var(--color-hover, #2d2d44);color:var(--color-text, #fff)}.btn-submit{background:linear-gradient(135deg,#6c63ff,#5a52d5);border:none;color:#fff}.btn-submit:hover:not(:disabled){background:linear-gradient(135deg,#7a74ff,#6c63ff);transform:translateY(-1px);box-shadow:0 4px 12px #6c63ff4d}.btn-cancel:disabled,.btn-submit:disabled{opacity:.6;cursor:not-allowed}@media(max-width:540px){.suggest-modal{max-width:100%;max-height:100%;border-radius:0}.suggest-modal-large{max-width:100%}.dropped-images-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}.form-actions{flex-direction:column-reverse}.btn-cancel,.btn-submit{width:100%}}