.upload-area{width:100%;padding:20px;display:flex;flex-direction:column;align-items:center;gap:10px}.upload-zone{width:100%;max-width:600px;min-height:100px;border:2px dashed #ccc;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;background-color:#fafafa}.upload-zone:hover{border-color:#999;background-color:#f5f5f5}.upload-zone.dragging{border-color:#000;background-color:#f0f0f0}.upload-zone.uploading{cursor:wait;opacity:.7}.upload-zone p{font-size:16px;color:#333;margin:5px 0}.upload-hint{font-size:12px;color:#666}.upload-message{padding:10px 20px;border-radius:4px;font-size:14px;font-weight:500}.upload-message.success{background-color:#d4edda;color:#155724;border:1px solid #c3e6cb}.upload-message.error{background-color:#f8d7da;color:#721c24;border:1px solid #f5c6cb}.image-card{width:100%;overflow:hidden;cursor:pointer;background-color:#f0f0f0;display:flex;align-items:center;justify-content:center}.image-card img{width:100%;height:auto;object-fit:contain;transition:opacity .3s ease;display:block}.image-card img.loading{opacity:0}.image-card img.loaded{opacity:1}.image-error{color:#999;font-size:12px;text-align:center;padding:20px}.modal-viewer{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000f2;z-index:1000;display:flex;align-items:center;justify-content:center;cursor:pointer}.modal-content{max-width:90vw;max-height:90vh;display:flex;align-items:center;justify-content:center}.modal-content img{max-width:100%;max-height:90vh;object-fit:contain;transition:opacity .3s ease}.modal-content img.loading{opacity:0}.modal-content img.loaded{opacity:1}.modal-close{position:absolute;top:20px;right:20px;background:none;border:none;color:#fff;font-size:48px;cursor:pointer;z-index:1001;width:50px;height:50px;display:flex;align-items:center;justify-content:center;line-height:1;transition:opacity .2s ease}.modal-close:hover{opacity:.7}.modal-nav{position:absolute;top:50%;transform:translateY(-50%);background:#ffffff1a;border:none;color:#fff;font-size:48px;cursor:pointer;z-index:1001;width:60px;height:60px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color .2s ease}.modal-nav:hover{background:#fff3}.modal-nav-prev{left:20px}.modal-nav-next{right:20px}@media (max-width: 768px){.modal-nav{width:50px;height:50px;font-size:36px}.modal-nav-prev{left:10px}.modal-nav-next{right:10px}.modal-close{top:10px;right:10px;font-size:36px;width:40px;height:40px}}.gallery{display:grid;grid-template-columns:repeat(7,1fr);gap:0;width:100%}@media (max-width: 768px){.gallery{grid-template-columns:repeat(3,1fr)}}.gallery-loading,.gallery-error,.gallery-empty{padding:40px 20px;text-align:center;color:#666;font-size:16px}.gallery-error{color:#d32f2f}.app{min-height:100vh;display:flex;flex-direction:column}.app-header{padding:20px;text-align:center;border-bottom:1px solid #eee}.app-header h1{font-size:24px;font-weight:700;color:#000;letter-spacing:.5px}@media (max-width: 768px){.app-header h1{font-size:18px}}.app-main{flex:1;width:100%}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#fff;color:#000}#root{min-height:100vh}