*{margin:0;padding:0;box-sizing:border-box}:root{--primary-color: #6366f1;--primary-hover: #4f46e5;--primary-light: #eef2ff;--secondary-color: #8b5cf6;--accent-color: #ec4899;--success-color: #10b981;--text-primary: #1f2937;--text-secondary: #6b7280;--text-light: #9ca3af;--border-color: #e5e7eb;--bg-primary: #ffffff;--bg-secondary: #f9fafb;--bg-tertiary: #f3f4f6;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.5;font-weight:400;color:var(--text-primary);background-color:var(--bg-primary)}body{margin:0;min-width:320px;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#app{width:100%;min-height:100vh}.app-container{display:flex;flex-direction:column;height:100vh;background-color:var(--bg-primary)}.app-header{background:linear-gradient(135deg,var(--primary-color) 0%,var(--secondary-color) 100%);color:#fff;padding:.75rem 1.5rem;box-shadow:var(--shadow-md);z-index:10;flex-shrink:0}.header-content{max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between}.logo{display:flex;align-items:center;gap:.75rem}.logo-text{font-size:1.5rem;font-weight:700;letter-spacing:-.025em;background:linear-gradient(135deg,#fff,#f0f0f0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header-subtitle{font-size:.75rem;opacity:.9;font-weight:500}.app-footer{padding:.75rem 2rem;background-color:var(--bg-secondary);border-top:1px solid var(--border-color);text-align:center;flex-shrink:0}.app-footer p{margin:0;font-size:.875rem;color:var(--text-secondary)}.app-footer a{color:var(--primary-color);text-decoration:none;font-weight:600;transition:color .2s ease}.app-footer a:hover{color:var(--secondary-color);text-decoration:underline}.main-content{display:flex;flex:1;width:100%;overflow:hidden}.artwork-grid-container{width:50%;padding:1rem 1.25rem;display:flex;flex-direction:column;background-color:var(--bg-secondary);border-right:1px solid var(--border-color);overflow:hidden}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:2px solid var(--border-color);flex-shrink:0}.section-header h2{font-size:1.125rem;font-weight:600;color:var(--text-primary)}.artwork-count{font-size:.875rem;color:var(--text-secondary);background-color:var(--bg-primary);padding:.375rem .75rem;border-radius:9999px;font-weight:500}.artwork-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;overflow-y:auto;padding-right:.5rem;flex:1;min-height:0}.artwork-grid::-webkit-scrollbar{width:8px}.artwork-grid::-webkit-scrollbar-track{background:var(--bg-tertiary);border-radius:4px}.artwork-grid::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}.artwork-grid::-webkit-scrollbar-thumb:hover{background:var(--text-light)}.artwork-item{display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:all .2s ease}.artwork-item:hover{transform:translateY(-2px)}.artwork-icon{width:100%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;background-color:var(--bg-primary);border:2px solid var(--border-color);border-radius:12px;padding:.5rem;overflow:hidden;position:relative;transition:all .2s ease;box-shadow:var(--shadow-sm)}.artwork-item:hover .artwork-icon{border-color:var(--primary-color);box-shadow:var(--shadow-md)}.artwork-item.active .artwork-icon{border-color:var(--primary-color);border-width:3px;box-shadow:var(--shadow-lg);background-color:var(--primary-light)}.active-indicator{position:absolute;top:.5rem;right:.5rem;width:12px;height:12px;background-color:var(--primary-color);border-radius:50%;border:2px solid white;box-shadow:var(--shadow-md)}.artwork-icon img{width:100%;height:100%;object-fit:cover;display:block;border-radius:8px}.artwork-label{margin-top:.5rem;font-size:.75rem;color:var(--text-primary);text-align:center;word-wrap:break-word;max-width:100%;line-height:1.2;font-weight:500}.details-panel{width:50%;padding:1.25rem 1.5rem;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;background-color:var(--bg-primary);overflow-y:auto;min-height:0}.artwork-display{display:flex;flex-direction:column;align-items:center;margin-bottom:1.25rem;width:100%;flex-shrink:0}.artwork-icon-large{width:100%;max-width:280px;aspect-ratio:1;display:flex;align-items:center;justify-content:center;background:linear-gradient(45deg,#f0f0f0 25%,transparent 25%),linear-gradient(-45deg,#f0f0f0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f0f0f0 75%),linear-gradient(-45deg,transparent 75%,#f0f0f0 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px;border:2px solid var(--border-color);border-radius:12px;padding:1rem;margin-bottom:1rem;overflow:hidden;box-shadow:var(--shadow-lg)}.artwork-icon-large img{width:100%;height:100%;object-fit:contain;display:block;border-radius:8px;background:transparent}.artwork-title{font-size:1.125rem;color:var(--text-primary);font-weight:600;text-align:center;line-height:1.3}.artwork-info{width:100%;max-width:500px;margin-bottom:1rem;flex-shrink:0}.info-section{background-color:var(--bg-secondary);border-radius:12px;padding:1rem;border:1px solid var(--border-color)}.info-section h3{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:1rem;text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;color:var(--text-secondary)}.info-item{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;border-bottom:1px solid var(--border-color)}.info-item:last-child{border-bottom:none}.info-label{font-weight:500;color:var(--text-secondary);font-size:.8125rem}.info-value{color:var(--text-primary);font-weight:600;font-size:.8125rem;text-align:right;word-break:break-word;max-width:60%}.continue-button{margin-top:auto;width:100%;max-width:500px;padding:.75rem 1.5rem;font-size:.875rem;font-weight:600;color:#fff;background:linear-gradient(135deg,var(--primary-color) 0%,var(--secondary-color) 100%);border:none;border-radius:10px;cursor:pointer;transition:all .2s ease;font-family:inherit;display:flex;align-items:center;justify-content:center;gap:.5rem;box-shadow:var(--shadow-md);flex-shrink:0}.continue-button:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.continue-button:active{transform:translateY(0)}.continue-button svg{transition:transform .2s ease}.continue-button:hover svg{transform:translate(4px)}.preview-container{flex-direction:column;height:100vh;overflow:hidden}.preview-content{flex:1;display:flex;flex-direction:column;overflow:hidden;background-color:var(--bg-secondary)}.preview-header{display:flex;align-items:center;padding:.75rem 1.5rem;background-color:var(--bg-primary);border-bottom:1px solid var(--border-color);box-shadow:var(--shadow-sm);flex-shrink:0}.back-button{padding:.625rem 1rem;font-size:.875rem;font-weight:500;color:var(--text-primary);background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;cursor:pointer;transition:all .2s ease;font-family:inherit;margin-right:1rem;display:flex;align-items:center;gap:.5rem}.back-button:hover{background-color:var(--bg-tertiary);border-color:var(--primary-color);color:var(--primary-color)}.preview-header h1{font-size:1.25rem;font-weight:600;color:var(--text-primary)}.preview-main{display:flex;flex:1;overflow:hidden}.room-selector-sidebar{width:180px;padding:1rem;background-color:var(--bg-primary);border-right:1px solid var(--border-color);display:flex;flex-direction:column;overflow-y:auto;flex-shrink:0}.room-selector-sidebar h3{font-size:.6875rem;font-weight:600;color:var(--text-secondary);margin-bottom:1rem;text-transform:uppercase;letter-spacing:.1em}.preview-center{flex:1;display:flex;align-items:center;justify-content:center;padding:1rem;background-color:var(--bg-secondary);overflow:hidden;min-height:0}.wall-container{width:100%;height:100%;display:flex;align-items:center;justify-content:center;max-width:100%;max-height:100%}.wall-image{position:relative;width:100%;height:100%;max-width:100%;max-height:100%;background-size:contain;background-position:center;background-repeat:no-repeat;border:2px solid var(--border-color);border-radius:12px;box-shadow:var(--shadow-xl);overflow:hidden}.artwork-overlay{position:absolute;display:flex;align-items:center;justify-content:center;background-color:transparent;border:none;border-radius:0;box-shadow:none;cursor:grab;-webkit-user-select:none;user-select:none;transition:all .2s ease;overflow:visible}.artwork-overlay:hover{filter:brightness(1.05)}.artwork-overlay:active{cursor:grabbing;filter:brightness(.95)}.artwork-preview-image{width:100%;height:100%;object-fit:contain;display:block;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}.preview-info{width:320px;padding:1.25rem;background-color:var(--bg-primary);border-left:1px solid var(--border-color);overflow-y:auto;min-height:0}.preview-info h2{font-size:1.125rem;font-weight:600;color:var(--text-primary);margin-bottom:1rem;padding-bottom:.75rem;border-bottom:2px solid var(--border-color)}.preview-hint{margin-top:1.5rem;padding:1rem;background-color:var(--primary-light);border-left:4px solid var(--primary-color);border-radius:8px;color:var(--primary-color);font-size:.875rem;line-height:1.5;display:flex;align-items:flex-start;gap:.75rem;font-weight:500}.preview-hint svg{flex-shrink:0;margin-top:.125rem}.download-button{margin-top:1.5rem;width:100%;padding:.875rem 1.5rem;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:#fff;border:none;border-radius:8px;font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:.75rem;box-shadow:var(--shadow-md)}.download-button:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.download-button:active{transform:translateY(0)}.download-button svg{flex-shrink:0}.wall-selector{display:flex;flex-direction:column;gap:.75rem;overflow-y:auto;padding-right:.25rem;scrollbar-width:thin;scrollbar-color:var(--border-color) var(--bg-tertiary)}.wall-selector::-webkit-scrollbar{width:8px}.wall-selector::-webkit-scrollbar-track{background:var(--bg-tertiary);border-radius:4px}.wall-selector::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}.wall-selector::-webkit-scrollbar-thumb:hover{background:var(--text-light)}.wall-option{display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:all .2s ease;width:100%;flex-shrink:0}.wall-option:hover{transform:translateY(-2px)}.wall-option-icon{width:100%;aspect-ratio:1;max-width:150px;display:flex;align-items:center;justify-content:center;background-color:var(--bg-secondary);border:2px solid var(--border-color);border-radius:8px;padding:.25rem;overflow:hidden;position:relative;transition:all .2s ease;box-shadow:var(--shadow-sm)}.wall-option:hover .wall-option-icon{border-color:var(--primary-color);box-shadow:var(--shadow-md)}.wall-option.active .wall-option-icon{background-color:var(--primary-light);border-color:var(--primary-color);border-width:3px;box-shadow:var(--shadow-lg)}.wall-option-icon img{width:100%;height:100%;object-fit:cover;display:block;border-radius:6px}.active-badge{position:absolute;top:.25rem;right:.25rem;background:var(--primary-color);color:#fff;font-size:.5rem;font-weight:700;padding:.125rem .375rem;border-radius:9999px;box-shadow:var(--shadow-md);text-transform:uppercase;letter-spacing:.05em;z-index:10}.wall-option-label{margin-top:.5rem;font-size:.75rem;color:var(--text-primary);text-align:center;font-weight:500}@media(max-width:1024px){.artwork-grid-container,.details-panel{width:50%}}@media(max-width:768px){.app-header{padding:1rem 1.5rem}.logo-text{font-size:1.5rem}.header-subtitle{display:none}.main-content{flex-direction:column}.artwork-grid-container{width:100%;max-height:50vh;padding:1.5rem}.artwork-grid{gap:1rem}.details-panel{width:100%;padding:2rem 1.5rem}.artwork-icon-large{max-width:100%}.preview-main{flex-direction:column}.room-selector-sidebar{width:100%;max-height:150px;border-right:none;border-bottom:1px solid var(--border-color);flex-direction:row;padding:.75rem 1rem}.room-selector-sidebar h3{margin-right:1rem;margin-bottom:0;white-space:nowrap}.wall-selector{flex-direction:row;overflow-x:auto;overflow-y:hidden;gap:.5rem}.preview-center{min-height:300px;padding:.75rem}.preview-info{width:100%;border-left:none;border-top:1px solid var(--border-color);max-height:40vh}.wall-option{min-width:80px}.wall-option-icon{max-width:70px}.wall-option-label{font-size:.6875rem}}