.breadcrumbs{margin:1rem 0;padding:.75rem 0}.breadcrumbs-list{display:flex;flex-wrap:wrap;align-items:center;list-style:none;padding:0;margin:0;font-size:.9rem;color:#64748b}.breadcrumb-item{display:inline-flex;align-items:center}.breadcrumb-link{color:#6366f1;text-decoration:none;transition:all .2s ease;padding:.25rem .5rem;border-radius:4px}.breadcrumb-link:hover{color:#4f46e5;background-color:#6366f11a;text-decoration:underline}.breadcrumb-separator{margin:0 .25rem;color:#94a3b8;-webkit-user-select:none;user-select:none}.breadcrumb-current{color:#334155;font-weight:500;padding:.25rem .5rem}@media (max-width: 768px){.breadcrumbs-list{font-size:.85rem}.breadcrumb-link,.breadcrumb-current{padding:.2rem .4rem}}*{box-sizing:border-box;margin:0;padding:0}:root{--bg-primary: #0a0a0a;--bg-secondary: #111111;--bg-card: #171717;--bg-card-hover: #1f1f1f;--border-color: #262626;--border-color-hover: #404040;--text-primary: #fafafa;--text-secondary: #a1a1aa;--text-muted: #71717a;--accent-green: #22c55e;--accent-green-hover: #16a34a;--accent-green-bg: rgba(34, 197, 94, .1)}body{background:var(--bg-primary);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;line-height:1.6}.app.dark-theme{min-height:100vh;display:flex;flex-direction:column;background:var(--bg-primary)}.header{border-bottom:1px solid var(--border-color);padding:1.5rem 2rem;background:var(--bg-secondary)}.header-content{max-width:1200px;margin:0 auto;text-align:center}.header-title{display:flex;align-items:center;justify-content:center;gap:.5rem;font-size:1.75rem;font-weight:600;color:var(--text-primary);cursor:pointer;transition:opacity .2s;margin-bottom:.25rem}.header-logo{width:32px;height:32px;flex-shrink:0}.header-title:hover{opacity:.8}.header-subtitle{font-size:.95rem;color:var(--text-secondary)}.main{flex:1;max-width:1000px;width:100%;margin:0 auto;padding:2rem}.card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:1.5rem;margin-bottom:1.5rem}.card h2{font-size:1.25rem;font-weight:600;color:var(--text-primary);margin-bottom:1rem}.or-divider{display:flex;align-items:center;text-align:center;margin-bottom:1.5rem;color:var(--text-muted);font-size:.85rem;font-weight:500;letter-spacing:.05em;text-transform:uppercase}.or-divider:before,.or-divider:after{content:"";flex:1;border-top:1px solid var(--border-color)}.or-divider span{padding:0 .75rem}.card-description{color:var(--text-muted);font-size:.9rem;margin-bottom:1rem;margin-top:-.5rem}.load-type-toggle{display:flex;gap:0;margin-bottom:1rem;background:var(--bg-secondary);border-radius:8px;padding:4px}.load-type-toggle .toggle-btn{flex:1;padding:.6rem 1rem;border:none;background:transparent;color:var(--text-muted);font-size:.9rem;cursor:pointer;border-radius:6px;transition:all .2s}.load-type-toggle .toggle-btn.active{background:var(--accent-green);color:#000;font-weight:500}.load-type-toggle .toggle-btn:hover:not(.active){color:var(--text-primary)}.listing-total{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--bg-secondary);border-radius:8px;margin-top:1rem;border:1px solid var(--border-color)}.listing-total .total-label{font-size:1rem;color:var(--text-secondary)}.listing-total .total-price{font-size:1.5rem;font-weight:700;color:var(--accent-green)}.card h3{font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-bottom:1rem}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.625rem 1.25rem;border-radius:8px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .15s ease;border:none;text-decoration:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent-green);color:#000}.btn-primary:hover:not(:disabled){background:var(--accent-green-hover)}.btn-outline{background:transparent;color:var(--text-primary);border:1px solid var(--border-color)}.btn-outline:hover:not(:disabled){border-color:var(--border-color-hover);background:var(--bg-card-hover)}.btn-text{background:transparent;color:var(--text-secondary);padding:.5rem}.btn-text:hover:not(:disabled){color:var(--text-primary)}.btn-large{padding:.875rem 2rem;font-size:1rem}.input,.select{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;padding:.75rem 1rem;font-size:.95rem;color:var(--text-primary);width:100%;transition:border-color .15s}.input::placeholder{color:var(--text-muted)}.input:focus,.select:focus{outline:none;border-color:var(--accent-green)}.input:disabled{opacity:.6;cursor:not-allowed}.select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23a1a1aa' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.5rem}.input-row{display:flex;gap:.75rem;margin-top:1rem}.input-row .input{flex:1}.setting-item label{display:block;font-size:.85rem;color:var(--text-secondary);margin-bottom:.5rem}.albums-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.albums-header-actions{display:flex;gap:.5rem;align-items:center}.load-more-container{display:flex;justify-content:center;padding:1rem 0 .5rem}.albums-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:1rem;max-height:500px;overflow-y:auto;padding:.5rem}.album-card{position:relative;border-radius:8px;overflow:hidden;cursor:pointer;transition:transform .15s,box-shadow .15s;background:var(--bg-secondary);border:2px solid transparent}.album-card:hover{transform:scale(1.03)}.album-card.selected{border-color:var(--accent-green);box-shadow:0 0 0 2px var(--accent-green-bg)}.album-card img{width:100%;aspect-ratio:1;object-fit:cover;display:block}.album-card .album-info{padding:.5rem}.album-card .album-title{font-size:.75rem;font-weight:500;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.album-card .album-artist{font-size:.7rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.album-card .album-price{font-size:.75rem;color:var(--accent-green);font-weight:600;margin-top:2px}.album-check{position:absolute;top:.5rem;right:.5rem;width:24px;height:24px;background:var(--accent-green);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#000;font-size:.875rem;font-weight:600}.pagination{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--border-color)}.btn-pagination{padding:.5rem .75rem;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:6px;color:var(--text-primary);font-size:1rem;cursor:pointer;transition:all .15s}.btn-pagination:hover:not(:disabled){background:var(--bg-card);border-color:var(--accent-green)}.btn-pagination:disabled{opacity:.4;cursor:not-allowed}.pagination-info{padding:0 1rem;color:var(--text-secondary);font-size:.9rem}.generate-section{text-align:center;padding:1.5rem 0}.listing-mode-card{margin-bottom:1rem}.listing-mode-header{margin-bottom:.75rem}.toggle-label{display:inline-flex;align-items:center;gap:.75rem;cursor:pointer}.toggle-label input[type=checkbox]{display:none}.toggle-switch{position:relative;width:44px;height:24px;background:var(--bg-secondary);border-radius:12px;transition:background .2s;border:1px solid var(--border-color)}.toggle-switch:after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;background:var(--text-secondary);border-radius:50%;transition:transform .2s,background .2s}.toggle-label input:checked+.toggle-switch{background:var(--accent-green-bg);border-color:var(--accent-green)}.toggle-label input:checked+.toggle-switch:after{transform:translate(20px);background:var(--accent-green)}.toggle-text{font-size:1rem;font-weight:500;color:var(--text-primary)}.listing-mode-description{color:var(--text-secondary);font-size:.9rem;line-height:1.5;margin:0}.listing-mode-hint{color:var(--text-muted);font-size:.85rem;margin:.5rem 0 0;font-style:italic}.result-section{max-width:1100px;margin:0 auto}.result-header{margin-bottom:1.5rem;text-align:center}.result-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--accent-green-bg);color:var(--accent-green);border-radius:6px;font-size:.9rem;font-weight:500}.result-badge:before{content:"✓"}.result-layout{display:grid;grid-template-columns:1fr 1fr;gap:2rem;background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:1.5rem;margin-bottom:1.5rem}.result-layout.no-listing{grid-template-columns:1fr;max-width:600px;margin-left:auto;margin-right:auto}@media (max-width: 900px){.result-layout{grid-template-columns:1fr}}.result-preview{position:relative}.mosaic-preview{border-radius:8px;overflow:hidden;border:1px solid var(--border-color);position:relative;min-height:300px;background:var(--bg-secondary)}.mosaic-preview img{width:100%;height:auto;display:block}.mosaic-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;background:var(--bg-secondary);min-height:300px}.mosaic-loading span{color:var(--text-muted);font-size:.9rem}.mosaic-spinner{width:48px;height:48px;border:4px solid var(--border-color);border-top-color:var(--accent-green);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.listing-info{display:flex;flex-direction:column;gap:1.25rem}.listing-field{display:flex;flex-direction:column;gap:.5rem}.listing-field-header{display:flex;align-items:center;justify-content:space-between}.listing-field label{font-size:.85rem;color:var(--text-secondary);font-weight:500}.btn-copy{font-size:.75rem;padding:.2rem .6rem;color:var(--text-muted);background:transparent;border:1px solid var(--border-color);border-radius:6px;cursor:pointer;transition:color .15s,border-color .15s}.btn-copy:hover{color:var(--accent);border-color:var(--accent)}.btn-copy.copied{color:#0c4;border-color:#0c4;transition:color .15s,border-color .15s}.textarea{resize:vertical;min-height:120px;font-family:monospace;font-size:.85rem;line-height:1.5}.result-bottom-actions{margin-bottom:1rem}.action-buttons{display:flex;gap:1rem;justify-content:center}@media (max-width: 640px){.action-buttons{flex-direction:column}}.action-buttons .btn{min-width:200px}.back-btn-container{text-align:center;margin-top:1rem}.no-mosaic{padding:3rem;text-align:center}.no-mosaic p{color:var(--text-secondary);margin-bottom:1.5rem}.checkout-section h2{font-size:1.75rem;margin-bottom:2rem;text-align:center}.checkout-layout{display:grid;grid-template-columns:1fr 1.5fr;gap:2rem;margin-bottom:2rem}@media (max-width: 768px){.checkout-layout{grid-template-columns:1fr}}.order-summary{height:fit-content}.mockup-gallery-full{margin-bottom:1.5rem}.mockup-main{margin-bottom:1rem}.mockup-wall-large{display:flex;justify-content:center;align-items:center}.mockup-poster-large{border-radius:8px;overflow:hidden}.mockup-poster-large img{width:100%;max-width:280px;height:auto;display:block;border-radius:8px}.mockup-thumbnails{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem}.mockup-thumb{text-align:center;cursor:pointer;transition:transform .15s}.mockup-thumb:hover{transform:scale(1.05)}.mockup-thumb span{display:block;margin-top:.5rem;font-size:.75rem;color:var(--text-secondary)}.thumb-poster{background:#1a1a1a;padding:4px;border-radius:4px;display:inline-block}.thumb-poster img{width:60px;height:60px;object-fit:cover;display:block}.thumb-wall{background:linear-gradient(180deg,#3a3a3a,#1a1a1a);padding:10px 8px 15px;border-radius:4px;display:flex;justify-content:center}.thumb-poster-small{background:#1a1a1a;padding:2px;box-shadow:0 4px 10px #00000080}.thumb-poster-small img{width:40px;height:40px;object-fit:cover;display:block}.thumb-close{border-radius:4px;overflow:hidden;border:2px solid var(--border-color)}.thumb-close img{width:64px;height:64px;object-fit:cover;display:block;transform:scale(1.5)}.thumb-room{background:linear-gradient(180deg,#4a4a4a,#2a2a2a 60%,#3a3a3a);padding:8px 6px 20px;border-radius:4px;display:flex;justify-content:center;position:relative}.thumb-room:after{content:"";position:absolute;bottom:0;left:0;right:0;height:12px;background:#2a2a2a;border-radius:0 0 4px 4px}.thumb-poster-room{background:#1a1a1a;padding:2px;box-shadow:0 3px 8px #00000080;transform:perspective(100px) rotateY(-3deg);position:relative;z-index:1}.thumb-poster-room img{width:35px;height:35px;object-fit:cover;display:block}@media (max-width: 500px){.mockup-thumbnails{grid-template-columns:repeat(2,1fr)}}.order-details{border-top:1px solid var(--border-color);padding-top:1rem}.order-item{display:flex;justify-content:space-between;color:var(--text-secondary);font-size:.9rem;margin-bottom:.75rem}.order-total{display:flex;justify-content:space-between;font-weight:600;font-size:1.1rem;color:var(--text-primary);padding-top:.75rem;border-top:1px solid var(--border-color)}.shipping-form .input{margin-bottom:1rem}.form-row-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.form-row-2 .input{margin-bottom:1rem}.form-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem}.form-row-3 .input{margin-bottom:1rem}@media (max-width: 640px){.form-row-2,.form-row-3{grid-template-columns:1fr}}.checkout-btn{width:100%;margin-top:.5rem}.secure-note{text-align:center;color:var(--text-muted);font-size:.8rem;margin-top:1rem}.thankyou-section{display:flex;align-items:center;justify-content:center;min-height:60vh}.thankyou-card{text-align:center;max-width:500px;padding:3rem}.success-icon{width:80px;height:80px;background:var(--accent-green);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;font-size:2.5rem;color:#000}.thankyou-card h2{font-size:1.75rem;margin-bottom:1rem}.thankyou-card p{color:var(--text-secondary);margin-bottom:.75rem}.thankyou-card .btn{margin-top:2rem}.footer{border-top:1px solid var(--border-color);padding:2rem;background:var(--bg-secondary);margin-top:auto}.footer-content{max-width:1200px;margin:0 auto;text-align:center}.footer-links{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}.footer-links a{color:var(--text-secondary);text-decoration:none;font-size:.9rem;transition:color .15s}.footer-links a:hover{color:var(--text-primary)}.footer-links .separator{color:var(--text-muted)}.footer-copyright{color:var(--text-muted);font-size:.85rem}.loading-overlay{position:fixed;inset:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:9999}.loading-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:16px;padding:2.5rem 3rem;text-align:center;max-width:400px}.loading-card h3{color:var(--text-primary);margin:1.5rem 0 1rem;font-size:1.1rem}.spinner{width:48px;height:48px;border:3px solid var(--border-color);border-top-color:var(--accent-green);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto}.progress-bar-container{height:6px;background:var(--bg-secondary);border-radius:3px;overflow:hidden;margin-top:1rem}.progress-bar{height:100%;background:var(--accent-green);transition:width .3s ease}.progress-text{color:var(--text-muted);font-size:.85rem;margin-top:.5rem}.progress-phase{color:var(--text-muted);font-size:.8rem;margin-top:.25rem;font-family:monospace;letter-spacing:.02em}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--border-color-hover)}.generator-section{padding-bottom:2rem}.filters-bar{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.5rem}@media (max-width: 640px){.filters-bar{grid-template-columns:1fr}}.filter-item{display:flex;flex-direction:column;gap:.4rem}.filter-item label{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.filter-item .select{background:var(--bg-card);border:1px solid var(--border-color)}.filter-item .select:disabled{opacity:.5;cursor:not-allowed}.info-page{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:2rem}.info-page h1{font-size:2rem;font-weight:700;color:var(--text-primary);margin-bottom:2rem;padding-bottom:1rem;border-bottom:1px solid var(--border-color)}.info-page h2{font-size:1.5rem;font-weight:600;color:var(--text-primary);margin:2rem 0 1rem}.info-page h3{font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-bottom:.5rem}.info-page p{color:var(--text-secondary);margin-bottom:1rem;line-height:1.7}.info-page ul,.info-page ol{color:var(--text-secondary);margin:.5rem 0 1rem 1.5rem;line-height:1.7}.info-page li{margin-bottom:.5rem}.info-page a{color:var(--accent-green);text-decoration:none}.info-page a:hover{text-decoration:underline}.info-page strong{color:var(--text-primary);font-weight:600}.faq-section{margin-bottom:2rem}.faq-item{padding:1rem 0;border-bottom:1px solid var(--border-color)}.faq-item:last-child{border-bottom:none}.faq-item h3{color:var(--accent-green);margin-bottom:.75rem}.page-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--border-color)}.page-actions .button{display:inline-flex;align-items:center;padding:.75rem 1.5rem;border-radius:8px;font-weight:500;text-decoration:none;cursor:pointer;transition:all .15s}.page-actions .button-primary{background:var(--accent-green);color:#000;border:1px solid var(--accent-green)}.page-actions .button-primary:hover{background:var(--accent-green-hover);border-color:var(--accent-green-hover)}.page-actions .button-secondary{background:transparent;color:var(--text-primary);border:1px solid var(--border-color)}.page-actions .button-secondary:hover{border-color:var(--accent-green);color:var(--accent-green)}.recent-mosaics-section{margin:2rem 0}.recent-mosaics-title{font-size:1.25rem;font-weight:600;color:var(--text-primary);margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.recent-mosaics-title:before{content:"";display:inline-block;width:4px;height:1.25rem;background:var(--accent-green);border-radius:2px}.recent-mosaics-loading{color:var(--text-muted);text-align:center;padding:2rem}.recent-mosaics-list{display:flex;flex-direction:column;gap:.5rem;background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;overflow:hidden}.mosaic-list-item{display:flex;align-items:center;gap:1rem;padding:.75rem 1rem;border-bottom:1px solid var(--border-color)}.mosaic-list-item:last-child{border-bottom:none}.mosaic-thumbnail{width:60px;height:60px;flex-shrink:0;border-radius:8px;overflow:hidden;background:var(--bg-secondary)}.mosaic-thumbnail img{width:100%;height:100%;object-fit:cover}.mosaic-thumbnail-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--bg-secondary) 0%,var(--bg-card) 100%);color:var(--text-muted);font-size:.9rem;font-weight:600}.mosaic-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:.25rem}.mosaic-meta{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.mosaic-source{font-size:.7rem;font-weight:600;text-transform:uppercase;padding:.15rem .5rem;border-radius:4px;letter-spacing:.5px}.mosaic-source.source-inventory{background:#8b5cf633;color:#a78bfa}.mosaic-source.source-collection{background:#22c55e33;color:var(--accent-green)}.mosaic-source.source-search{background:#3b82f633;color:#60a5fa}.mosaic-albums{font-size:.8rem;color:var(--text-secondary)}.mosaic-grid{font-size:.75rem;color:var(--text-muted);background:var(--bg-secondary);padding:.1rem .4rem;border-radius:4px}.mosaic-user{display:flex;align-items:center;gap:.5rem}.discogs-badge{font-size:.7rem;font-weight:600;text-transform:uppercase;padding:.1rem .4rem;border-radius:4px;background:#ff880026;color:#f80;letter-spacing:.3px}.mosaic-username,.mosaic-username-link{font-size:.85rem;color:var(--text-primary);font-weight:500}.mosaic-username-link{color:var(--accent-green);text-decoration:none;transition:color .15s}.mosaic-username-link:hover{color:var(--accent-green-hover);text-decoration:underline}.mosaic-username.anonymous{color:var(--text-muted);font-style:italic;font-weight:400}.mosaic-date{font-size:.75rem;color:var(--text-muted)}@media (max-width: 640px){.mosaic-list-item{padding:.75rem}.mosaic-thumbnail{width:50px;height:50px}.mosaic-meta{gap:.35rem}.mosaic-source{font-size:.65rem;padding:.1rem .4rem}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;min-width:320px;min-height:100vh}#app{width:100%}
