.builder-content{display:flex;height:calc(100vh - 80px)}.builder-sidebar{width:250px;background:white;border-right:1px solid #e5e7eb;padding:1.5rem}.builder-sidebar,.builder-steps{display:flex;flex-direction:column}.builder-steps{gap:.5rem;flex:1 1}.builder-steps button{padding:.75rem 1rem;text-align:left;border:none;background:transparent;cursor:pointer;border-radius:6px;transition:background .2s}.builder-steps button:hover:not(:disabled){background:#f3f4f6}.builder-steps button.active{background:#3b82f6;color:white}.builder-steps button:disabled{opacity:.5;cursor:not-allowed}.builder-main{flex:1 1;overflow-y:auto;padding:2rem;display:flex;flex-direction:column;min-height:0}.builder-actions{margin-top:auto;padding-top:1.5rem}.order-button{width:100%;padding:.75rem;background:#10b981;color:white;border:none;border-radius:6px;font-weight:600;cursor:pointer;transition:background .2s}.order-button:hover:not(:disabled){background:#059669}.order-button:disabled{opacity:.5;cursor:not-allowed}.error-message{background:var(--color-primary-light);border:2px solid var(--color-primary);color:var(--color-primary-dark);padding:var(--spacing-md);margin:var(--spacing-md) var(--spacing-xl);border-radius:var(--border-radius-md);font-size:14px;line-height:1.5;position:relative;z-index:10}.qr-login-container{padding:1rem;text-align:center}.qr-code-wrapper{margin:1rem 0;display:flex;justify-content:center}.qr-expires{font-size:.875rem;color:var(--color-text-secondary);margin-top:var(--spacing-sm)}.photo-uploader-container{max-width:800px;margin:0 auto}.upload-area{border:2px dashed var(--color-border);border-radius:var(--border-radius-md);padding:var(--spacing-3xl);text-align:center;cursor:pointer;transition:all var(--animation-normal) var(--easing-smooth);background:var(--color-surface)}.upload-area.dragging,.upload-area:hover{border-color:var(--color-primary);background:var(--color-primary-subtle)}.upload-content svg{color:#9ca3af;margin-bottom:1rem}.upload-hint{font-size:.875rem;color:#6b7280;margin-top:.5rem}.uploaded-photos{margin-top:2rem}.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));grid-gap:1rem;gap:1rem;margin-top:1rem}.photo-thumbnail{aspect-ratio:1;overflow:hidden;border-radius:8px;border:1px solid #e5e7eb}.photo-thumbnail img{width:100%;height:100%;object-fit:cover}.theme-selector-container{max-width:1200px;margin:0 auto}.category-filter{display:flex;gap:.5rem;margin-bottom:2rem;flex-wrap:wrap}.category-filter button{padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);background:var(--color-surface);border-radius:var(--border-radius-sm);cursor:pointer;transition:all var(--animation-normal) var(--easing-smooth);color:var(--color-text-primary)}.category-filter button:hover{border-color:var(--color-primary);background:var(--color-primary-subtle)}.category-filter button.active{background:var(--color-primary);color:white;border-color:var(--color-primary)}.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));grid-gap:var(--spacing-lg);gap:var(--spacing-lg)}.theme-card{border:2px solid var(--color-border);border-radius:var(--border-radius-md);padding:var(--spacing-md);cursor:pointer;transition:all var(--animation-normal) var(--easing-smooth);background:var(--color-surface);box-shadow:var(--shadow-xs)}.theme-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md);transform:translateY(-2px)}.theme-card.selected{border-color:var(--color-primary);background:var(--color-primary-subtle);box-shadow:var(--shadow-sm)}.theme-card img{width:100%;height:200px;object-fit:cover;border-radius:4px;margin-bottom:.5rem}.layout-builder-container{width:100%;height:100%;display:flex;flex-direction:column;padding:0 1rem;overflow-y:auto}.layout-builder-new-container{display:flex;width:100%;height:100%;min-height:0;gap:var(--spacing-lg);overflow:hidden;background:rgb(243,244,246)}.sidebar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md)}.sidebar-header h3{margin:0;font-size:1.125rem;font-weight:600;color:var(--color-text-primary)}.sidebar-photo-count{background:var(--color-primary);color:white;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--border-radius-full);font-size:.75rem;font-weight:600;min-width:24px;text-align:center}.sidebar-actions{display:flex;gap:var(--spacing-xs);margin-bottom:var(--spacing-md);flex-wrap:wrap}.deselect-button-small,.select-all-button-small{padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-background-secondary);color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:var(--border-radius-sm);font-size:.75rem;font-weight:500;cursor:pointer;transition:all var(--animation-normal) var(--easing-smooth)}.deselect-button-small:hover,.select-all-button-small:hover{background:var(--color-background-tertiary);border-color:var(--color-primary)}.sidebar-photos-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:var(--spacing-sm);gap:var(--spacing-sm);flex:1 1}.sidebar-layouts-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:var(--spacing-md);gap:var(--spacing-md);flex:1 1}.sidebar-layout-card{display:flex;flex-direction:column;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-md);padding:0;cursor:pointer;transition:all var(--animation-normal) var(--easing-smooth);overflow:hidden;text-align:left}.sidebar-layout-card:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.sidebar-layout-preview{width:100%;aspect-ratio:1;position:relative;overflow:hidden;background:var(--color-background-secondary);border:none}.sidebar-layout-label{padding:var(--spacing-xs) var(--spacing-sm);font-size:.75rem;font-weight:500;color:var(--color-text-primary);text-align:center;background:var(--color-surface);border-top:1px solid var(--color-border-light)}.sidebar-photo{position:relative;aspect-ratio:1;border-radius:var(--border-radius-sm);overflow:hidden;border:2px solid var(--color-border);cursor:-webkit-grab;cursor:grab;transition:all var(--animation-normal) var(--easing-smooth);background:var(--color-surface)}.sidebar-photo:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.sidebar-photo:active{cursor:-webkit-grabbing;cursor:grabbing}.sidebar-photo.selected{border-color:var(--color-primary);border-width:3px;box-shadow:0 0 0 3px var(--color-primary-subtle),var(--shadow-md)}.sidebar-photo img{width:100%;height:100%;object-fit:cover}.sidebar-empty-state{grid-column:1/-1;text-align:center;padding:var(--spacing-xl);color:var(--color-text-tertiary);font-size:.875rem}.layout-builder-main{width:100%;height:100%;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;padding:var(--spacing-lg);min-width:0;gap:0;background:linear-gradient(180deg,#f8f9fb,#f1f3f5)}.preview-message-section{text-align:center;padding:var(--spacing-xl);background:var(--color-background-secondary);border-radius:var(--border-radius-md);border:2px dashed var(--color-border);flex-shrink:0}.preview-message-title{margin:0 0 var(--spacing-sm) 0;color:var(--color-text-secondary);font-size:.875rem;font-weight:500}.preview-message-subtitle{margin:0;font-size:.75rem;color:var(--color-text-tertiary)}.layout-photos-section{flex-shrink:0;width:100%;margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-lg);border-bottom:1px solid rgba(0,0,0,.06)}.layout-photos-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md)}.layout-photos-header h2{margin:0;font-size:.875rem;font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em}.layout-photos-actions{display:flex;gap:var(--spacing-xs)}.layout-photos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));grid-gap:8px;gap:8px}.layout-photo-item{position:relative;aspect-ratio:1;border-radius:8px;overflow:hidden;cursor:pointer;border:2px solid transparent;transition:all var(--animation-fast) var(--easing-smooth);background:var(--color-background-secondary)}.layout-photo-item:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.12)}.layout-photo-item.selected{border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary-subtle)}.layout-photo-item img{width:100%;height:100%;object-fit:cover}.layout-photos-empty{text-align:center;padding:var(--spacing-lg);color:var(--color-text-tertiary);font-size:.875rem}.layout-selector-section{flex-shrink:0;width:100%;margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-lg);border-bottom:1px solid rgba(0,0,0,.06)}.layout-options-row{display:flex;flex-wrap:wrap;gap:12px;width:100%}.layout-options-row::-webkit-scrollbar{height:6px}.layout-options-row::-webkit-scrollbar-track{background:var(--color-background-secondary);border-radius:var(--border-radius-sm)}.layout-options-row::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--border-radius-sm)}.layout-options-row::-webkit-scrollbar-thumb:hover{background:var(--color-text-tertiary)}.layout-option-card{background:var(--color-surface);border:none;border-radius:8px;padding:0;cursor:pointer;transition:all var(--animation-normal) var(--easing-smooth);display:flex;flex-direction:column;gap:0;text-align:left;box-shadow:0 2px 8px rgba(0,0,0,.06);width:100px;aspect-ratio:1;flex-shrink:0;overflow:hidden}.layout-option-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.12);transform:translateY(-2px)}.layout-option-card:active{transform:translateY(0)}.layout-option-preview{width:100%;aspect-ratio:1;border-radius:8px;overflow:hidden;background:#f8f9fa;border:none;position:relative;flex:1 1;min-height:0;margin:0}.layout-option-preview>*{width:100%;height:100%}.layout-option-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--color-background-secondary);border-radius:var(--border-radius-sm)}.layout-icon-large{font-size:4rem;line-height:1;display:block;color:var(--color-text-secondary)}.layout-pages-section{flex:1 1;display:flex;flex-direction:column;min-height:0;overflow:visible}.layout-pages-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md)}.layout-pages-section h2{margin:0;font-size:.875rem;font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em}.zoom-controls{display:flex;align-items:center;gap:4px;background:var(--color-surface);padding:4px;border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,.06)}.zoom-controls button{width:28px;height:28px;border:none;background:transparent;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;font-weight:500;color:var(--color-text-secondary);transition:all var(--animation-fast) var(--easing-smooth)}.zoom-controls button:hover:not(:disabled){background:var(--color-primary-subtle);color:var(--color-primary)}.zoom-controls button:disabled{opacity:.3;cursor:not-allowed}.zoom-controls span{font-size:.75rem;font-weight:500;color:var(--color-text-secondary);min-width:36px;text-align:center}.empty-pages-state{text-align:center;padding:var(--spacing-3xl);color:var(--color-text-tertiary);background:var(--color-background-secondary);border-radius:var(--border-radius-md);border:2px dashed var(--color-border)}.empty-pages-state p{margin:0;font-size:1rem}.pages-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--page-card-size,180px),1fr));grid-gap:var(--spacing-xl);gap:var(--spacing-xl);align-items:start;grid-auto-rows:min-content;align-content:start;grid-row-gap:var(--spacing-xl);row-gap:var(--spacing-xl);padding:var(--spacing-md)}.page-wrapper{display:flex;flex-direction:column;gap:12px;width:100%;align-items:stretch;min-height:0;transition:all var(--animation-normal) var(--easing-smooth);cursor:default;padding:var(--spacing-sm);border-radius:var(--border-radius-md);background:transparent}.page-wrapper[draggable=true]{cursor:-webkit-grab;cursor:grab;position:relative}.page-wrapper[draggable=true]:hover{background:var(--color-background-secondary);box-shadow:0 2px 8px rgba(0,0,0,.08)}.page-wrapper[draggable=true]:hover:after{content:"⋮⋮";position:absolute;top:8px;right:8px;color:var(--color-text-tertiary);font-size:14px;line-height:1;letter-spacing:-2px;opacity:.6;pointer-events:none}.page-wrapper[draggable=true]:active{cursor:-webkit-grabbing;cursor:grabbing}.page-wrapper.page-dragging{opacity:.5;transform:scale(.95);box-shadow:0 4px 16px rgba(0,0,0,.2)}.page-wrapper.page-drag-over{transform:translateY(-4px);border-top:3px solid var(--color-primary);padding-top:calc(var(--spacing-sm) + 4px)}.page-wrapper.page-drag-over:before{content:"";position:absolute;top:-12px;left:0;right:0;height:3px;background:var(--color-primary);border-radius:2px;z-index:10;box-shadow:0 0 8px rgba(var(--color-primary-rgb,59,130,246),.5)}.page-number-label{display:flex;justify-content:space-between;align-items:center;font-size:.8125rem;font-weight:600;color:var(--color-text-primary);background:transparent;padding:var(--spacing-xs) var(--spacing-sm);margin-bottom:4px}.page-drag-hint{color:var(--color-text-tertiary);font-size:.75rem;letter-spacing:-2px;opacity:.5;margin-left:4px;display:inline-block;vertical-align:middle}.layout-page-card{background:var(--color-surface);border:none;border-radius:8px;margin:0;transition:all var(--animation-normal) var(--easing-smooth);box-shadow:0 2px 8px rgba(0,0,0,.08);width:100%;overflow:hidden;display:block;position:relative;height:0;padding:0 0 100%;box-sizing:border-box}.layout-page-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.12);transform:translateY(-2px)}.layout-page-card.drag-over{border-color:var(--color-primary);border-style:dashed;background:var(--color-primary-subtle);transform:scale(1.02)}.page-photos-thumbnails{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px;padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-background-secondary);border-radius:var(--border-radius-sm);min-height:56px;align-items:flex-start;align-content:flex-start}.page-photo-thumbnail{position:relative;width:56px;height:56px;border-radius:8px;overflow:visible;background:var(--color-background-secondary);border:2px solid var(--color-border);flex-shrink:0;cursor:-webkit-grab;cursor:grab;transition:all var(--animation-fast) var(--easing-smooth);box-shadow:0 1px 3px rgba(0,0,0,.1)}.page-photo-thumbnail:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,.15)}.page-photo-thumbnail:hover:after{content:"⋮⋮";position:absolute;top:-8px;left:50%;transform:translateX(-50%);color:var(--color-primary);font-size:12px;line-height:1;letter-spacing:-1px;background:white;padding:2px 4px;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.2);pointer-events:none;font-weight:600}.page-photo-thumbnail:active{cursor:-webkit-grabbing;cursor:grabbing}.page-photo-thumbnail.photo-thumbnail-dragging{opacity:.5;transform:scale(.9) rotate(5deg);box-shadow:0 8px 16px rgba(0,0,0,.3);z-index:100}.page-photo-thumbnail.photo-thumbnail-drag-over{transform:translateX(-8px);border-color:var(--color-primary);border-width:3px;box-shadow:0 0 0 2px var(--color-primary-subtle)}.page-photo-thumbnail.photo-thumbnail-drag-over:before{content:"";position:absolute;left:-12px;top:50%;transform:translateY(-50%);width:4px;height:4px;border-radius:50%;background:var(--color-primary);z-index:10;box-shadow:0 0 8px rgba(var(--color-primary-rgb,59,130,246),.8)}.page-photo-thumbnail img{width:100%;height:100%;object-fit:cover;display:block}.page-photo-remove{position:absolute;top:-4px;right:-4px;width:18px;height:18px;border-radius:50%;background:var(--color-error,#ef4444);color:white;border:1.5px solid white;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:12px;font-weight:600;line-height:1;padding:0;transition:all var(--animation-fast) var(--easing-smooth);box-shadow:0 1px 3px rgba(0,0,0,.2)}.page-photo-remove:hover{background:var(--color-error-dark,#dc2626);transform:scale(1.1);box-shadow:0 2px 4px rgba(0,0,0,.3)}.page-photo-remove:active{transform:scale(.95)}.page-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-sm)}.page-card-title{display:flex;flex-direction:column;gap:var(--spacing-xs)}.page-number{font-size:.875rem}.page-layout-badge{font-size:.75rem;color:var(--color-text-secondary);display:flex;align-items:center;gap:var(--spacing-xs)}.page-delete-button-small{width:20px;height:20px;padding:0;background:transparent;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--color-text-tertiary);transition:all var(--animation-fast) var(--easing-smooth);line-height:1;opacity:0}.page-wrapper:hover .page-delete-button-small{opacity:1}.page-delete-button-small:hover{color:#ef4444;background:rgba(239,68,68,.1)}.page-card-preview{width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden;margin:0;padding:0;border-radius:8px;box-sizing:border-box}.page-photos-grid{display:grid;grid-gap:var(--spacing-sm);gap:var(--spacing-sm)}.page-photos-grid.layout-grid{grid-template-columns:repeat(2,1fr)}.page-photos-grid.layout-comments-focused,.page-photos-grid.layout-comments_focused,.page-photos-grid.layout-cover,.page-photos-grid.layout-hero{grid-template-columns:1fr}.page-photos-grid.layout-two-up{grid-template-columns:repeat(2,1fr)}.page-photo-item{position:relative;aspect-ratio:1;border-radius:var(--border-radius-sm);overflow:hidden;border:2px solid var(--color-border);background:var(--color-surface);cursor:-webkit-grab;cursor:grab;transition:all var(--animation-normal) var(--easing-smooth)}.page-photo-item:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.page-photo-item:active{cursor:-webkit-grabbing;cursor:grabbing}.page-photo-item.dragging{opacity:.5;transform:scale(.95)}.page-photo-item img{width:100%;height:100%;object-fit:cover}.remove-photo-button-small{position:absolute;top:var(--spacing-xs);right:var(--spacing-xs);width:20px;height:20px;border-radius:50%;background:rgba(239,68,68,.9);color:white;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.875rem;line-height:1;transition:transform var(--animation-fast) var(--easing-smooth);opacity:0}.page-photo-item:hover .remove-photo-button-small{opacity:1}.remove-photo-button-small:hover{transform:scale(1.1);background:rgba(239,68,68,1)}.page-placeholders{display:grid;grid-gap:var(--spacing-sm);gap:var(--spacing-sm);min-height:200px}.page-placeholders.layout-grid{grid-template-columns:repeat(2,1fr)}.page-placeholders.layout-comments-focused,.page-placeholders.layout-comments_focused,.page-placeholders.layout-cover,.page-placeholders.layout-hero{grid-template-columns:1fr}.page-placeholders.layout-two-up{grid-template-columns:repeat(2,1fr)}.page-placeholder{aspect-ratio:1;border:2px dashed var(--color-border);border-radius:var(--border-radius-sm);background:var(--color-background-secondary);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-xs);transition:all var(--animation-normal) var(--easing-smooth)}.layout-page-card.drag-over .page-placeholder{border-color:var(--color-primary);background:var(--color-primary-subtle)}.placeholder-icon{font-size:2rem;opacity:.5}.placeholder-text{font-size:.75rem;color:var(--color-text-tertiary);font-weight:500}.photo-drop-indicator{height:4px;background:var(--color-primary);border-radius:var(--border-radius-xs);margin:var(--spacing-xs) 0;animation:pulse 1s ease-in-out infinite;box-shadow:0 0 8px var(--color-primary)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.layout-builder-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.5rem;gap:1rem;flex-shrink:0}.header-actions{display:flex;gap:var(--spacing-sm);align-items:center}.selection-count-badge{color:var(--color-primary);font-weight:600;margin-left:var(--spacing-xs)}.deselect-button,.deselect-button-small{padding:var(--spacing-sm) var(--spacing-md);background:var(--color-background-secondary);color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:var(--border-radius-sm);font-size:.875rem;font-weight:500;cursor:pointer;transition:all var(--animation-normal) var(--easing-smooth)}.deselect-button-small{padding:var(--spacing-xs) var(--spacing-sm);font-size:.75rem}.deselect-button-small:hover,.deselect-button:hover{background:var(--color-background-tertiary);border-color:var(--color-primary)}.shortcuts-help-button{width:36px;height:36px;padding:var(--spacing-sm);background:var(--color-background-secondary);border:1px solid var(--color-border);border-radius:var(--border-radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.125rem;transition:all var(--animation-normal) var(--easing-smooth)}.shortcuts-help-button:hover{background:var(--color-primary-subtle);border-color:var(--color-primary)}.layout-builder-header h2{margin:0 0 .5rem;font-size:1.75rem;font-weight:600}.layout-builder-subtitle{margin:0;color:var(--color-text-secondary);font-size:.875rem}.add-page-button-primary{padding:var(--spacing-sm) var(--spacing-lg);background:var(--color-primary);color:white;border:none;border-radius:var(--border-radius-md);font-weight:600;cursor:pointer;transition:all var(--animation-normal) var(--easing-smooth);white-space:nowrap;box-shadow:var(--shadow-sm)}.add-page-button-primary:hover{background:var(--color-primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-md)}.unassigned-photos-section{margin-bottom:var(--spacing-lg);padding:var(--spacing-lg);background:var(--color-surface);border-radius:var(--border-radius-md);border:2px dashed var(--color-border);flex-shrink:0;box-shadow:var(--shadow-xs);transition:all var(--animation-normal) var(--easing-smooth)}.unassigned-photos-section:hover{border-color:var(--color-primary);box-shadow:var(--shadow-sm)}.unassigned-photos-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md);flex-wrap:wrap;gap:var(--spacing-sm)}.unassigned-photos-section h3{margin:0;font-size:1rem;font-weight:600;color:var(--color-text-primary)}.unassigned-photos-actions{display:flex;gap:var(--spacing-sm);align-items:center}.select-all-button{padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-primary);color:white;border:none;border-radius:var(--border-radius-sm);font-size:.75rem;font-weight:600;cursor:pointer;transition:all var(--animation-normal) var(--easing-smooth)}.select-all-button:hover{background:var(--color-primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.unassigned-photos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));grid-gap:1rem;gap:1rem}.unassigned-photo{position:relative;aspect-ratio:1;border-radius:var(--border-radius-sm);overflow:hidden;border:2px solid var(--color-border);cursor:-webkit-grab;cursor:grab;transition:all var(--animation-normal) var(--easing-smooth);background:var(--color-surface)}.unassigned-photo:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.unassigned-photo:active{cursor:-webkit-grabbing;cursor:grabbing}.unassigned-photo.selected{border-color:var(--color-primary);border-width:3px;box-shadow:0 0 0 3px var(--color-primary-subtle),var(--shadow-md)}.unassigned-photo img{width:100%;height:100%;object-fit:cover}.photo-selection-indicator{position:absolute;top:var(--spacing-xs);right:var(--spacing-xs);z-index:10;animation:scaleIn var(--animation-fast) var(--easing-smooth)}@keyframes scaleIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.photo-drag-hint{position:absolute;bottom:0;left:0;right:0;background:rgba(255,107,107,.9);color:white;font-size:.75rem;padding:var(--spacing-xs);text-align:center;opacity:0;transition:opacity var(--animation-normal) var(--easing-smooth)}.unassigned-photo:hover .photo-drag-hint{opacity:1}.layout-pages{display:flex;flex-direction:column;gap:1.5rem;margin-bottom:2rem;flex:1 1;min-height:0;overflow-y:auto}.layout-page{border:2px solid var(--color-border);border-radius:var(--border-radius-md);background:var(--color-surface);transition:all var(--animation-normal) var(--easing-smooth);position:relative;display:flex;gap:1rem;padding:1rem;outline:none}.layout-page:hover{border-color:var(--color-primary);box-shadow:var(--shadow-sm)}.layout-page.focused{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-subtle),var(--shadow-md)}.layout-page.dragging{opacity:.5;transform:rotate(2deg) scale(.95);box-shadow:var(--shadow-lg)}.layout-page.drag-over{border-color:var(--color-primary);border-style:dashed;background:var(--color-primary-subtle);transform:scale(1.02)}.page-drag-handle{display:flex;align-items:center;padding:.5rem;cursor:-webkit-grab;cursor:grab;color:#9ca3af;transition:color .2s}.page-drag-handle:hover{color:#3b82f6}.page-drag-handle:active{cursor:-webkit-grabbing;cursor:grabbing}.page-content{flex:1 1;min-width:0}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;gap:1rem;flex-wrap:wrap}.page-number{font-weight:600;color:var(--color-text-primary);font-size:1rem}.page-photo-count{color:var(--color-text-secondary);font-size:.875rem}.page-actions{display:flex;gap:.5rem;align-items:center;margin-left:auto}.layout-select-wrapper{position:relative;display:flex;align-items:center;gap:var(--spacing-xs)}.layout-icon{font-size:1rem;line-height:1}.layout-select{padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--border-radius-sm);background:var(--color-surface);font-size:.875rem;cursor:pointer;transition:all var(--animation-normal) var(--easing-smooth);color:var(--color-text-primary);min-width:140px}.layout-select:hover{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-subtle)}.layout-preview-thumbnail{position:absolute;top:100%;left:0;margin-top:var(--spacing-xs);width:120px;height:80px;z-index:100;opacity:0;pointer-events:none;transition:opacity var(--animation-normal) var(--easing-smooth)}.layout-select-wrapper:hover .layout-preview-thumbnail{opacity:1}.page-delete-button,.page-expand-button{width:32px;height:32px;border:1px solid var(--color-border);border-radius:var(--border-radius-sm);background:var(--color-surface);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.25rem;color:var(--color-text-secondary);transition:all var(--animation-normal) var(--easing-smooth)}.page-expand-button:hover{border-color:var(--color-primary);color:var(--color-primary);background:var(--color-primary-subtle)}.page-delete-button:hover{border-color:#ef4444;color:#ef4444;background:#fee2e2}.page-preview{min-height:120px;border:2px dashed #d1d5db;border-radius:8px;padding:1rem;transition:all .2s}.page-preview.expanded{min-height:300px;border-color:#3b82f6;background:#f9fafb}.layout-preview{display:grid;grid-gap:.75rem;gap:.75rem}.layout-preview.layout-grid{grid-template-columns:repeat(2,1fr)}.layout-preview.layout-hero{grid-template-columns:1fr}.layout-preview.layout-two-up{grid-template-columns:repeat(2,1fr)}.layout-photo-wrapper{position:relative;aspect-ratio:1;border-radius:var(--border-radius-sm);overflow:hidden;border:2px solid var(--color-border);background:var(--color-surface)}.layout-photo-preview{width:100%;height:100%;object-fit:cover}.remove-photo-button{position:absolute;top:.25rem;right:.25rem;width:24px;height:24px;border-radius:50%;background:rgba(239,68,68,.9);color:white;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;line-height:1;transition:transform .2s}.remove-photo-button:hover{transform:scale(1.1)}.more-photos-indicator{grid-column:1/-1;text-align:center;padding:var(--spacing-md);color:var(--color-text-secondary);font-size:.875rem;background:var(--color-background-secondary);border-radius:var(--border-radius-sm)}.empty-page-dropzone{text-align:center;padding:var(--spacing-xl);color:var(--color-text-tertiary);min-height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty-page-dropzone p{margin:0 0 var(--spacing-md) 0;color:var(--color-text-secondary)}.available-photos-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));grid-gap:.75rem;gap:.75rem;width:100%;max-height:200px;overflow-y:auto;padding:.5rem}.available-photo-item{aspect-ratio:1;border-radius:var(--border-radius-sm);overflow:hidden;border:2px solid var(--color-border);cursor:pointer;transition:all var(--animation-normal) var(--easing-smooth);background:var(--color-surface)}.available-photo-item:hover{border-color:var(--color-primary);transform:scale(1.05);box-shadow:var(--shadow-md)}.available-photo-item img{width:100%;height:100%;object-fit:cover}.no-photos-message{grid-column:1/-1;text-align:center;color:var(--color-text-tertiary);font-size:.875rem;padding:var(--spacing-md)}.add-page-button{width:100%;padding:var(--spacing-md);background:var(--color-background-secondary);border:2px dashed var(--color-border);border-radius:var(--border-radius-md);cursor:pointer;font-weight:600;color:var(--color-text-primary);transition:all var(--animation-normal) var(--easing-smooth);font-size:1rem;flex-shrink:0;margin-top:auto;box-shadow:var(--shadow-xs)}.add-page-button:hover{background:var(--color-primary-subtle);border-color:var(--color-primary);color:var(--color-primary);box-shadow:var(--shadow-sm)}.shortcuts-help-panel{margin-bottom:var(--spacing-lg);padding:var(--spacing-lg);background:var(--color-surface);border:2px solid var(--color-primary);border-radius:var(--border-radius-md);box-shadow:var(--shadow-md);animation:slideDown var(--animation-normal) var(--easing-smooth)}.shortcuts-help-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md)}.shortcuts-help-header h3{margin:0;font-size:1.125rem;font-weight:600;color:var(--color-text-primary)}.shortcuts-close-button{width:28px;height:28px;padding:0;background:transparent;border:none;border-radius:var(--border-radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:var(--color-text-secondary);transition:all var(--animation-fast) var(--easing-smooth);line-height:1}.shortcuts-close-button:hover{background:var(--color-background-secondary);color:var(--color-text-primary)}.shortcuts-list{display:flex;flex-direction:column;gap:var(--spacing-sm)}.shortcut-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-sm);background:var(--color-background-secondary);border-radius:var(--border-radius-sm)}.shortcut-item kbd{display:inline-block;padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-xs);font-family:Monaco,Menlo,Courier New,monospace;font-size:.75rem;font-weight:600;color:var(--color-text-primary);box-shadow:var(--shadow-xs);min-width:24px;text-align:center}.shortcut-item span{color:var(--color-text-secondary);font-size:.875rem;flex:1 1}.text-editor-container{max-width:800px;margin:0 auto}.text-editor-section{margin-bottom:2rem}.album-name-input{width:100%;padding:.75rem;border:1px solid #e5e7eb;border-radius:6px;font-size:1.125rem}.captions-list{display:flex;flex-direction:column;gap:1rem}.caption-item{display:flex;gap:1rem;align-items:center}.caption-photo-thumbnail{width:80px;height:80px;object-fit:cover;border-radius:4px}.caption-input{flex:1 1;padding:.75rem;border:1px solid #e5e7eb;border-radius:6px}.preview-pane-container{width:100%;height:100%;display:flex;flex-direction:column;background:var(--color-background-primary,#ffffff);padding:var(--spacing-md) var(--spacing-xl);box-sizing:border-box;max-width:100%}.preview-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md);flex-shrink:0;padding:var(--spacing-sm) 0;border-bottom:1px solid var(--color-border-light,#f3f4f6);width:100%}.preview-header-left{display:flex;align-items:baseline;gap:var(--spacing-md)}.preview-title{font-size:1.5rem;font-weight:700;color:var(--color-text-primary,#111827);margin:0;letter-spacing:-.02em}.preview-page-count{font-size:.875rem;color:var(--color-text-secondary,#6b7280);font-weight:500}.preview-content{border:1px solid var(--color-border,#e5e7eb);border-radius:var(--border-radius-lg,12px);overflow:hidden;flex:1 1;min-height:0;display:flex;flex-direction:column;background:var(--color-surface,#ffffff);box-shadow:0 1px 3px rgba(0,0,0,.05);transition:box-shadow var(--animation-normal,.2s);max-width:100%;width:100%}.preview-content:hover{box-shadow:0 4px 12px rgba(0,0,0,.08)}.preview-page-navigation{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md) var(--spacing-lg);background:linear-gradient(to bottom,var(--color-surface,#ffffff),var(--color-background-secondary,#f9fafb));border-bottom:1px solid var(--color-border-light,#f3f4f6);gap:var(--spacing-md)}.page-nav-btn{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-lg);border:1px solid var(--color-border,#e5e7eb);border-radius:var(--border-radius-md,8px);background:var(--color-surface,#ffffff);color:var(--color-text-primary,#111827);font-size:.875rem;font-weight:500;cursor:pointer;transition:all var(--animation-fast,.15s) var(--easing-smooth,ease-in-out);box-shadow:0 1px 2px rgba(0,0,0,.05)}.page-nav-btn:hover:not(:disabled){background:var(--color-primary,#3b82f6);color:white;border-color:var(--color-primary,#3b82f6);transform:translateY(-1px);box-shadow:0 4px 8px rgba(59,130,246,.3)}.page-nav-btn:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px rgba(59,130,246,.2)}.page-nav-btn:disabled{opacity:.4;cursor:not-allowed;background:var(--color-background-secondary,#f9fafb)}.page-nav-btn svg{transition:transform var(--animation-fast,.15s)}.page-nav-btn.prev:hover:not(:disabled) svg{transform:translateX(-2px)}.page-nav-btn.next:hover:not(:disabled) svg{transform:translateX(2px)}.page-indicator{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-lg);background:var(--color-background-secondary,#f9fafb);border-radius:var(--border-radius-md,8px);font-size:.875rem;font-weight:500;color:var(--color-text-primary,#111827);min-width:120px;justify-content:center}.page-number{font-size:1.125rem;font-weight:700;color:var(--color-primary,#3b82f6)}.page-separator{color:var(--color-text-tertiary,#9ca3af);font-weight:400}.page-total{color:var(--color-text-secondary,#6b7280);font-weight:500}.preview-iframe-container{flex:1 1;overflow:hidden;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f5f7fa,#e9ecef);min-height:0;transition:background var(--animation-normal,.3s);padding:var(--spacing-sm);box-sizing:border-box}.preview-iframe{width:100%;height:100%;border:none;animation:fadeIn .3s ease-in-out;will-change:opacity,transform}.preview-iframe-container{position:relative}.preview-iframe-container:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#f5f7fa,#e9ecef);z-index:-1;border-radius:inherit}@keyframes fadeIn{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.preview-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-3xl);gap:var(--spacing-lg);color:var(--color-text-secondary,#6b7280)}.preview-loading p{font-size:.875rem;font-weight:500;margin:0}.preview-error{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-3xl);gap:var(--spacing-md);color:var(--color-error,#ef4444);text-align:center}.preview-error svg{opacity:.8}.preview-error h3{font-size:1.125rem;font-weight:600;margin:0;color:var(--color-text-primary,#111827)}.preview-error p{font-size:.875rem;margin:0}.preview-empty,.preview-error p{color:var(--color-text-secondary,#6b7280)}.preview-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-3xl);gap:var(--spacing-lg);text-align:center}.preview-empty svg{opacity:.4;color:var(--color-text-tertiary,#9ca3af)}.preview-empty h3{font-size:1.125rem;font-weight:600;margin:0;color:var(--color-text-primary,#111827)}.preview-empty p{font-size:.875rem;margin:0;max-width:400px}.order-step-content{max-width:1280px;margin:0 auto;padding:var(--spacing-xl,32px) var(--spacing-lg);width:100%}.step-header{text-align:left;margin-bottom:var(--spacing-lg,24px);max-width:700px;margin-left:auto;margin-right:auto}.step-header h2{font-size:1.5rem;margin:0 0 var(--spacing-sm,8px) 0;line-height:1.3}.step-description{font-size:.9375rem;color:var(--color-text-secondary,#6b7280);margin:0;line-height:1.6;font-weight:400}.step-header h2{font-size:1.125rem;font-weight:700;color:var(--color-text-primary,#111827);margin:0 0 var(--spacing-xs,4px) 0;letter-spacing:-.02em}.order-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-3xl);gap:var(--spacing-lg)}.loading-spinner{width:48px;height:48px;border:4px solid var(--color-border-light,#f3f4f6);border-top-color:var(--color-primary,#3b82f6);border-radius:50%;animation:spin .8s linear infinite}.loading-spinner-small{width:16px;height:16px;border:2px solid var(--color-border-light,#f3f4f6);border-top-color:var(--color-primary,#ff6b6b);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.size-selection-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:var(--spacing-sm,12px);gap:var(--spacing-sm,12px);margin-bottom:var(--spacing-md,16px);width:100%}.size-selection-card{background:var(--color-surface,#ffffff);border:2px solid var(--color-border,#e5e7eb);border-radius:var(--border-radius-md,8px);padding:var(--spacing-sm,8px);cursor:pointer;transition:all var(--animation-normal,.2s) var(--easing-smooth,ease-in-out);position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;min-height:85px;width:100%}.size-selection-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--color-primary,#3b82f6);transform:scaleX(0);transition:transform var(--animation-normal,.2s)}.size-selection-card:hover:not(.selected){border-color:var(--color-primary,#3b82f6);transform:translateY(-1px);box-shadow:0 4px 12px rgba(59,130,246,.12)}.size-selection-card.selected{border-color:var(--color-primary,#3b82f6);background:linear-gradient(135deg,rgba(59,130,246,.08),rgba(59,130,246,.03));box-shadow:0 4px 16px rgba(59,130,246,.25),0 0 0 1px rgba(59,130,246,.1);transform:translateY(-2px)}.size-selection-card.selected:before{transform:scaleX(1)}.size-card-content{display:flex;flex-direction:column;gap:var(--spacing-sm);height:100%}.size-card-header{display:flex;justify-content:space-between;align-items:flex-start}.size-name{font-size:1.125rem;font-weight:600;color:var(--color-text-primary,#111827);margin:0}.size-selected-badge{color:var(--color-primary,#3b82f6);flex-shrink:0}.size-price-display{display:flex;flex-direction:column;gap:var(--spacing-xs)}.size-price-amount{font-size:1.125rem;font-weight:700;color:var(--color-text-primary,#111827)}.size-price-label{font-size:.75rem;color:var(--color-text-secondary,#6b7280)}.quantity-selection-card{background:var(--color-surface,#ffffff);border:2px solid var(--color-border-light,#f3f4f6);border-radius:var(--border-radius-md,8px);padding:var(--spacing-md,16px);margin-bottom:var(--spacing-md,16px);display:flex;flex-direction:column;gap:var(--spacing-sm,12px)}.quantity-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:0}.quantity-header h3{font-size:.75rem;font-weight:600;color:var(--color-text-secondary,#6b7280);margin:0;text-transform:uppercase;letter-spacing:.05em}.quantity-total-wrapper{display:flex;flex-direction:column;align-items:flex-end;gap:var(--spacing-xs)}.quantity-total-label{font-size:.75rem;font-weight:600;color:var(--color-text-secondary,#6b7280);text-transform:uppercase;letter-spacing:.05em;margin:0}.quantity-total{font-size:1.25rem;font-weight:700;color:var(--color-primary,#3b82f6);margin:0;line-height:1.2}.quantity-controls-modern{display:flex;align-items:center;justify-content:flex-start;gap:var(--spacing-lg);padding:var(--spacing-sm) 0;border-top:1px solid var(--color-border-light,#f3f4f6);padding-top:var(--spacing-md);margin-top:var(--spacing-xs)}.quantity-controls-left{display:flex;align-items:center;gap:var(--spacing-md)}.quantity-btn-modern{width:32px;height:32px;border:2px solid var(--color-border,#e5e7eb);background:var(--color-surface,#ffffff);border-radius:var(--border-radius-md,8px);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--animation-fast,.15s);color:var(--color-text-primary,#111827);flex-shrink:0}.quantity-btn-modern:hover:not(:disabled){border-color:var(--color-primary,#3b82f6);background:var(--color-primary-subtle,rgba(59,130,246,.05));color:var(--color-primary,#3b82f6);transform:scale(1.05)}.quantity-btn-modern:disabled{opacity:.4;cursor:not-allowed}.quantity-value-modern{font-size:1.125rem;font-weight:700;color:var(--color-text-primary,#111827);min-width:40px;text-align:center}.shipping-form-modern{background:transparent;border:none;border-radius:0;padding:0;margin-bottom:var(--spacing-lg,24px);max-width:700px;margin-left:auto;margin-right:auto;box-shadow:none;display:flex;flex-direction:column;gap:var(--spacing-lg,24px)}.form-section{background:var(--color-surface,#ffffff);border:1px solid var(--color-border-light,#e5e7eb);border-radius:var(--border-radius-lg,12px);padding:var(--spacing-lg,24px);box-shadow:0 1px 3px rgba(0,0,0,.05);transition:all .3s cubic-bezier(.4,0,.2,1)}.form-section:hover{box-shadow:0 4px 12px rgba(0,0,0,.08);border-color:var(--color-border,#d1d5db)}.form-section-header{display:flex;align-items:center;gap:var(--spacing-sm,8px);margin-bottom:var(--spacing-lg,24px);padding-bottom:var(--spacing-sm,12px);border-bottom:2px solid var(--color-border-light,#f3f4f6)}.form-section-icon{width:40px;height:40px;border-radius:var(--border-radius-md,8px);background:linear-gradient(135deg,rgba(255,107,107,.1),rgba(255,107,107,.05));display:flex;align-items:center;justify-content:center;color:var(--color-primary,#FF6B6B);flex-shrink:0}.form-section-title{font-size:1.125rem;font-weight:700;color:var(--color-text-primary,#111827);margin:0;letter-spacing:-.01em}.form-group-modern{margin-bottom:var(--spacing-md,16px)}.form-group-modern:last-child{margin-bottom:0}.form-label-modern{display:flex;align-items:center;justify-content:space-between;font-size:.8125rem;font-weight:600;color:var(--color-text-primary,#111827);margin-bottom:var(--spacing-xs,4px);letter-spacing:.01em;text-transform:uppercase}.field-check{color:var(--color-primary,#FF6B6B);font-size:.875rem;font-weight:700;margin-left:var(--spacing-xs,4px);animation:checkmarkPop .3s cubic-bezier(.34,1.56,.64,1)}@keyframes checkmarkPop{0%{transform:scale(0);opacity:0}50%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}.form-input-wrapper{position:relative;display:flex;align-items:center}.form-input-icon{position:absolute;left:14px;display:flex;align-items:center;justify-content:center;color:var(--color-text-tertiary,#9ca3af);z-index:1;pointer-events:none;transition:color .2s ease}.form-input-wrapper:focus-within .form-input-icon{color:var(--color-primary,#FF6B6B)}.form-input-wrapper .form-input-modern{padding-left:44px}.address-input-container .form-input-icon{left:14px}.address-input-container .form-input-modern{padding-left:44px}.form-input-modern{width:100%;padding:14px 16px;border:2px solid var(--color-border-light,#e5e7eb);border-radius:var(--border-radius-md,8px);font-size:.9375rem;font-family:inherit;transition:all .2s cubic-bezier(.4,0,.2,1);background:var(--color-surface,#ffffff);color:var(--color-text-primary,#111827);box-shadow:0 1px 2px rgba(0,0,0,.04);-webkit-appearance:none;-moz-appearance:none;appearance:none}.form-input-modern:hover:not(:disabled){border-color:var(--color-border,#d1d5db);box-shadow:0 2px 6px rgba(0,0,0,.06)}.form-input-modern:focus{outline:none;border-color:var(--color-primary,#FF6B6B);box-shadow:0 0 0 4px rgba(255,107,107,.12),0 4px 8px rgba(0,0,0,.08);transform:translateY(-1px);background:var(--color-surface,#ffffff)}.form-input-modern.filled{border-color:rgba(255,107,107,.3);background:rgba(255,107,107,.02)}.form-input-modern.filled:focus{border-color:var(--color-primary,#FF6B6B);background:var(--color-surface,#ffffff)}.form-input-modern::placeholder{color:var(--color-text-tertiary,#9ca3af);font-weight:400}.form-input-modern:disabled{background:var(--color-background-secondary,#f9fafb);cursor:not-allowed;opacity:.7}.form-hint-modern{font-size:.75rem;color:var(--color-text-secondary,#6b7280);margin-top:var(--spacing-xs,4px);margin-bottom:0;font-weight:400;line-height:1.4}.form-row-modern{display:grid;grid-template-columns:2fr 1fr 1fr;grid-gap:var(--spacing-md,16px);gap:var(--spacing-md,16px)}.form-row-modern .form-group-modern{margin-bottom:0}.form-row-modern .form-input-wrapper{width:100%}.form-input-modern[type=select],select.form-input-modern{background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:40px;cursor:pointer}select.form-input-modern{padding-right:40px}.address-autocomplete-wrapper{position:relative}.address-input-container{position:relative;display:flex;align-items:center}.address-input-container .form-input-modern{padding-right:40px}.address-clear-btn,.address-loading{position:absolute;right:12px;display:flex;align-items:center;z-index:10}.address-clear-btn{width:20px;height:20px;border:none;background:transparent;border-radius:50%;justify-content:center;cursor:pointer;font-size:18px;line-height:1;color:var(--color-text-tertiary,#9ca3af);transition:all .2s cubic-bezier(.4,0,.2,1)}.address-clear-btn:hover{background:var(--color-background-secondary,#f9fafb);color:var(--color-text-primary,#111827);transform:scale(1.1)}.address-suggestions-modern{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--color-surface,#ffffff);border:1.5px solid var(--color-border-light,#e5e7eb);border-radius:var(--border-radius-md,8px);box-shadow:0 8px 24px rgba(0,0,0,.12),0 2px 8px rgba(0,0,0,.08);margin-top:var(--spacing-xs,4px);max-height:320px;overflow-y:auto;z-index:100;animation:slideDown .2s cubic-bezier(.4,0,.2,1)}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.address-suggestion-modern{width:100%;padding:12px 16px;border:none;background:transparent;text-align:left;cursor:pointer;display:flex;align-items:flex-start;gap:var(--spacing-sm,8px);transition:all .15s cubic-bezier(.4,0,.2,1);border-bottom:1px solid var(--color-border-light,#f3f4f6)}.address-suggestion-modern:last-child{border-bottom:none;border-radius:0 0 var(--border-radius-md,8px) var(--border-radius-md,8px)}.address-suggestion-modern:first-child{border-radius:var(--border-radius-md,8px) var(--border-radius-md,8px) 0 0}.address-suggestion-modern:hover{background:rgba(255,107,107,.05);border-color:transparent}.address-suggestion-modern svg{color:var(--color-primary,#FF6B6B);flex-shrink:0;margin-top:2px;opacity:.7}.address-suggestion-modern:hover svg{opacity:1}.suggestion-content{flex:1 1;display:flex;flex-direction:column;gap:var(--spacing-xs)}.suggestion-primary{font-weight:600;color:var(--color-text-primary,#111827);font-size:.9375rem;line-height:1.4}.suggestion-secondary{font-size:.8125rem;color:var(--color-text-secondary,#6b7280);line-height:1.4;margin-top:2px}.confirmation-success{text-align:center;padding:var(--spacing-3xl);max-width:600px;margin:0 auto}.confirmation-icon-wrapper{margin-bottom:var(--spacing-xl);display:flex;justify-content:center}.confirmation-title{font-size:2rem;font-weight:700;color:var(--color-text-primary,#111827);margin:0 0 var(--spacing-lg) 0}.confirmation-details{margin-bottom:var(--spacing-2xl)}.confirmation-order-id{font-size:1.125rem;color:var(--color-text-secondary,#6b7280);margin:0 0 var(--spacing-sm) 0}.confirmation-email{font-size:.9375rem;color:var(--color-text-secondary,#6b7280);margin:0}.confirmation-email strong{color:var(--color-text-primary,#111827);font-weight:600}.confirmation-actions{display:flex;justify-content:center;gap:var(--spacing-md)}.payment-step-content{max-width:1280px;padding:var(--spacing-xl,32px) var(--spacing-lg);padding-bottom:calc(var(--spacing-xl, 32px) + 80px)}.payment-layout{display:grid;grid-template-columns:380px 1fr;grid-gap:var(--spacing-2xl,48px);gap:var(--spacing-2xl,48px);align-items:start;max-width:1280px;margin:0 auto;width:100%;box-sizing:border-box}.payment-details-column{gap:var(--spacing-sm,12px);position:-webkit-sticky;position:sticky;top:var(--spacing-xl,32px);align-self:start;box-sizing:border-box;overflow:visible;max-height:calc(100vh - 120px);min-height:0}.payment-checkout-column,.payment-details-column{display:flex;flex-direction:column;align-items:stretch;width:100%}.payment-checkout-column{gap:0;min-width:0}.payment-checkout-column .payment-element-container,.payment-checkout-column [class*=Link],.payment-checkout-column form,.payment-checkout-column>*,.payment-section{width:100%;box-sizing:border-box}.payment-section{background:var(--color-surface,#ffffff);border:1px solid var(--color-border-light,#e5e7eb);border-radius:var(--border-radius-md,10px);padding:var(--spacing-lg,24px);padding-bottom:var(--spacing-lg,24px);box-shadow:0 1px 2px rgba(0,0,0,.08);transition:all var(--animation-normal,.3s) cubic-bezier(.4,0,.2,1);position:relative;min-width:0;flex:1 1;display:flex;flex-direction:column}.payment-section>*{position:relative;z-index:1}.payment-section:hover{box-shadow:0 2px 8px rgba(0,0,0,.12)}.section-header{margin-bottom:var(--spacing-md,16px)}.section-title{font-size:1.5rem;font-weight:700;color:var(--color-text-primary,#111827);margin:0 0 var(--spacing-xs) 0}.section-subtitle{font-size:.9375rem;color:var(--color-text-secondary,#6b7280);margin:0}.cover-preview-wrapper{margin-bottom:0;width:100%;display:flex;justify-content:stretch;align-items:flex-start;padding-bottom:var(--spacing-sm,12px);box-sizing:border-box;overflow:hidden;flex-shrink:0}.cover-preview-background{background:transparent;border-radius:var(--border-radius-lg,16px);padding:0;border:none;width:100%;box-sizing:border-box}.cover-preview-container{aspect-ratio:1/1;width:100%;max-width:100%;max-height:none;min-height:0;background:linear-gradient(135deg,#f9fafb,#f3f4f6);border-radius:var(--border-radius-md,10px);overflow:hidden;position:relative;box-sizing:border-box;margin:0;padding:var(--spacing-xs,8px);box-shadow:inset 0 1px 4px rgba(0,0,0,.06);flex-shrink:0}.cover-preview-container,.cover-preview-loading{display:flex;align-items:center;justify-content:center}.cover-preview-loading{flex-direction:column;height:100%;gap:var(--spacing-md);color:var(--color-text-secondary,#6b7280)}.cover-preview-iframe{width:100%;height:100%;border:none;display:block;background:var(--color-surface,#ffffff);min-height:100%;border-radius:var(--border-radius-sm,8px);box-shadow:0 4px 16px rgba(0,0,0,.1)}.cover-preview-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:var(--spacing-md);color:var(--color-text-secondary,#6b7280)}.cover-icon{font-size:3rem}.cover-preview-caption{text-align:center;margin-top:var(--spacing-md)}.cover-caption-title{font-size:1.25rem;font-weight:600;color:var(--color-text-primary,#111827);margin:0 0 var(--spacing-xs) 0}.cover-caption-subtitle{font-size:.9375rem;color:var(--color-text-secondary,#6b7280);margin:0}.payment-summary-content{margin:0;padding:0;width:100%;display:flex;flex-direction:column;box-sizing:border-box;min-width:0;overflow:visible;gap:0;flex:1 1}.payment-summary-card{background:transparent;border:none;border-radius:0;padding:0;margin:0}.summary-section{margin:0;padding:var(--spacing-md,16px) 0;width:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:var(--spacing-sm,12px);position:relative}.summary-section:first-child{padding-top:0}.summary-section+.summary-section{border-top:1px solid var(--color-border-light,#e5e7eb);padding-top:var(--spacing-md,16px);margin-top:0}.summary-section:last-child,.summary-section:last-of-type{padding-bottom:0}.summary-item{display:flex;justify-content:space-between;align-items:center;padding:0;min-height:24px;width:100%;gap:var(--spacing-md,16px);box-sizing:border-box}.summary-item>.summary-item-left{overflow:hidden}.summary-item-left,.summary-item>.summary-item-left{flex:1 1;min-width:0;display:flex;align-items:center;gap:var(--spacing-sm,10px)}.summary-item-left .summary-label{margin:0}.summary-icon-container{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:var(--color-background-secondary,#f9fafb);border-radius:var(--border-radius-sm,6px);flex-shrink:0}.summary-icon{font-size:.875rem;opacity:.7}.summary-label{color:var(--color-text-primary,#111827);overflow:hidden;text-overflow:ellipsis;min-width:0}.summary-label,.summary-value{font-size:.875rem;font-weight:500;white-space:nowrap}.summary-value{color:var(--color-text-secondary,#6b7280);text-align:right;flex-shrink:0;min-width:-moz-fit-content;min-width:fit-content}.summary-divider,.summary-divider-bold{display:none}.address-summary{margin:0;padding:var(--spacing-sm,12px);padding-left:var(--spacing-md,16px);padding-right:var(--spacing-md,16px);width:100%;box-sizing:border-box;background:var(--color-background-secondary,#f9fafb);border-radius:var(--border-radius-sm,6px);border:1px solid var(--color-border-light,#e5e7eb)}.address-summary,.address-summary-name{font-size:.875rem;word-wrap:break-word;overflow-wrap:break-word}.address-summary-name{font-weight:600;color:var(--color-text-primary,#111827);margin-bottom:var(--spacing-xs,4px);margin-top:0}.address-summary-text{font-size:.875rem;color:var(--color-text-secondary,#6b7280);line-height:1.5;white-space:pre-line;word-wrap:break-word;overflow-wrap:break-word;margin-top:var(--spacing-xs,4px)}.address-summary-text:first-of-type{margin-top:0}.summary-total-section{margin:0;padding:var(--spacing-md,16px) 0 0 0;display:flex;flex-direction:column;gap:var(--spacing-sm,12px);width:100%;box-sizing:border-box;border-top:2px solid var(--color-border,#d1d5db);position:relative}.summary-total-container{display:flex;justify-content:space-between;align-items:center;padding:0;width:100%;box-sizing:border-box;gap:var(--spacing-md,16px)}.summary-total-label{font-size:1rem;font-weight:700;color:var(--color-text-primary,#111827);flex-shrink:0}.summary-total-value{font-size:1.25rem;font-weight:700;color:var(--color-primary,#FF6B6B);flex-shrink:0;white-space:nowrap;min-width:-moz-fit-content;min-width:fit-content}.delivery-expectation{display:flex;align-items:center;justify-content:center;gap:var(--spacing-xs,6px);margin:var(--spacing-md,16px) 0 0 0;padding:var(--spacing-sm,12px);background:var(--color-background-secondary,#f9fafb);border-radius:var(--border-radius-sm,6px);border:1px solid var(--color-border-light,#e5e7eb);font-size:.8125rem;width:100%;box-sizing:border-box}.delivery-icon{font-size:1rem;flex-shrink:0}.delivery-text{font-size:.8125rem;color:var(--color-text-secondary,#6b7280);font-weight:500}.payment-logo-container{display:flex;justify-content:center;margin:var(--spacing-md,16px) 0;padding:var(--spacing-md,16px);background:var(--color-background-secondary,#f9fafb);border-radius:var(--border-radius-md,8px)}.payment-form{width:100%;display:flex;flex-direction:column;gap:var(--spacing-lg,24px)}.payment-element-container{background:var(--color-surface,#ffffff);padding:var(--spacing-lg,24px);border-radius:var(--border-radius-md,10px);border:1px solid var(--color-border-light,#e5e7eb);box-shadow:0 1px 2px rgba(0,0,0,.08);width:100%;box-sizing:border-box}.payment-message{padding:var(--spacing-md,16px);border-radius:var(--border-radius-md,8px);font-weight:500;font-size:.9375rem}.payment-message.success{background:rgba(16,185,129,.1);color:#059669;border:1px solid rgba(16,185,129,.3)}.payment-message.error{background:rgba(255,107,107,.1);color:#d32f2f;border:1px solid rgba(255,107,107,.3)}.payment-button-container{width:100%;display:flex;flex-direction:column;gap:var(--spacing-md,16px);position:relative}.payment-back-button{align-self:flex-start;min-height:40px;padding:var(--spacing-sm,8px) var(--spacing-lg,24px);background:var(--color-surface,#ffffff);color:var(--color-text-primary,#111827);border:2px solid var(--color-border-light,#e5e7eb);border-radius:var(--border-radius-md,8px);font-size:15px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;letter-spacing:.01em;white-space:nowrap;margin-bottom:var(--spacing-sm,8px)}.payment-back-button:hover{background:rgba(255,107,107,.05);border-color:var(--color-primary,#FF6B6B);color:var(--color-primary,#FF6B6B);transform:translateY(-1px);box-shadow:0 2px 8px rgba(255,107,107,.15)}.payment-back-button:active{transform:translateY(0);box-shadow:0 1px 4px rgba(0,0,0,.05)}.pay-button{width:100%;display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm,8px);background:linear-gradient(135deg,var(--color-primary,#FF6B6B) 0,#E85D5D 100%);color:white;border:none;border-radius:var(--border-radius-md,10px);padding:var(--spacing-md,16px) var(--spacing-lg,24px);font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px rgba(255,107,107,.3);min-height:56px;box-sizing:border-box}.pay-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px rgba(255,107,107,.4);background:linear-gradient(135deg,#E85D5D,#D94D4D)}.pay-button:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px rgba(255,107,107,.2)}.pay-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.pay-button-text{font-size:1rem;font-weight:700}.pay-button-loading{display:flex;align-items:center;gap:var(--spacing-sm,8px)}.trust-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--spacing-md,16px);margin-top:var(--spacing-sm,12px);padding-top:var(--spacing-md,16px);border-top:1px solid var(--color-border-light,#e5e7eb)}.trust-badge{display:flex;align-items:center;gap:var(--spacing-xs,4px);font-size:.8125rem;color:var(--color-text-secondary,#6b7280)}.trust-badge-icon{color:var(--color-primary,#FF6B6B);font-weight:700}.order-error{background:#fef2f2;border:1px solid #fecaca;border-radius:var(--border-radius-md,8px);padding:var(--spacing-md) var(--spacing-lg);margin-bottom:var(--spacing-xl);display:flex;justify-content:space-between;align-items:center;max-width:1280px;margin-left:auto;margin-right:auto}.order-error p{color:#dc2626;font-weight:500;margin:0}.order-error button{background:transparent;border:none;color:#dc2626;cursor:pointer;font-weight:600;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--border-radius-sm,4px);transition:background var(--animation-fast,.15s)}.order-error button:hover{background:rgba(220,38,38,.1)}.order-size-step{max-width:1280px;margin:0 auto;padding:var(--spacing-lg,24px) var(--spacing-lg)}.order-size-step.order-step-content{padding:var(--spacing-xl,32px) var(--spacing-lg)!important;max-width:1280px!important}.viewer-container .viewer-main{padding:var(--spacing-md,16px);padding-bottom:100px}.order-progress-container{display:flex;justify-content:center;align-items:center;gap:var(--spacing-lg,24px);padding:var(--spacing-sm,12px) var(--spacing-md,16px);border-bottom:1px solid var(--color-border-light,#e5e7eb);background:transparent;flex-shrink:0;position:relative}.payment-progress-container{max-width:1200px}.payment-progress-container,.size-progress-container{margin:0 auto;width:100%;padding-left:0;padding-right:0;border-bottom:none;margin-bottom:var(--spacing-lg,24px)}.size-progress-container{max-width:1280px}.shipping-progress-container{max-width:800px;margin:0 auto;width:100%;padding-left:0;padding-right:0;border-bottom:none;margin-bottom:var(--spacing-lg,24px)}.progress-back-button{position:absolute;left:var(--spacing-lg,24px);min-height:40px;padding:var(--spacing-sm,8px) var(--spacing-lg,24px);background:var(--color-surface,#ffffff);color:var(--color-text-primary,#111827);border:2px solid var(--color-border-light,#e5e7eb);border-radius:var(--border-radius-md,8px);font-size:15px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;letter-spacing:.01em;white-space:nowrap}.progress-back-button:hover{background:rgba(255,107,107,.05);border-color:var(--color-primary,#FF6B6B);color:var(--color-primary,#FF6B6B);transform:translateY(-1px);box-shadow:0 2px 8px rgba(255,107,107,.15)}.progress-back-button:active{transform:translateY(0);box-shadow:0 1px 4px rgba(0,0,0,.05)}.order-progress-container .order-step{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs,4px);position:relative;flex:1 1;max-width:120px;transition:all .3s cubic-bezier(.34,1.56,.64,1)}.order-progress-container .order-step:after{content:"";position:absolute;top:20px;left:calc(50% + 20px);width:calc(100% - 40px);height:2px;background:var(--color-border-light,#e5e7eb);z-index:0;transition:all .4s ease-out}.order-progress-container .order-step:last-child:after{display:none}.order-progress-container .order-step.completed:after{background:var(--color-primary,#FF6B6B);box-shadow:0 0 4px rgba(255,107,107,.2)}.order-progress-container .step-number{width:32px;height:32px;border-radius:50%;background:transparent;border:2px solid var(--color-border-light,#e5e7eb);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:var(--color-text-tertiary,#95A5A6);position:relative;z-index:1;transition:all .4s cubic-bezier(.34,1.56,.64,1)}.order-progress-container .order-step.active .step-number{transform:scale(1.1);box-shadow:0 2px 8px rgba(255,107,107,.3)}.order-progress-container .order-step.active .step-number,.order-progress-container .order-step.completed .step-number{background:linear-gradient(135deg,var(--color-primary,#FF6B6B) 0,var(--color-primary-dark,#E85D5D) 100%);border-color:var(--color-primary,#FF6B6B);color:white}.order-progress-container .order-step.completed .step-number{box-shadow:0 1px 4px rgba(255,107,107,.2)}.order-progress-container .step-label{font-size:11px;font-weight:500;color:var(--color-text-tertiary,#95A5A6);transition:all .3s ease-out;text-align:center;line-height:1.2}.order-progress-container .order-step.active .step-label{color:var(--color-primary,#FF6B6B);font-weight:700;transform:translateY(-1px)}.order-progress-container .order-step.completed .step-label{color:var(--color-text-secondary,#636E72);font-weight:600}.order-floating-actions{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);padding:4px;background:rgba(255,255,255,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:var(--border-radius-md,8px);box-shadow:var(--shadow-md,0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06));display:flex;gap:4px;z-index:1000;max-width:500px;width:calc(100vw - 32px);box-sizing:border-box}.order-actions-container{display:flex;justify-content:space-between;gap:var(--spacing-sm,8px);align-items:center;width:100%}.order-floating-actions .secondary-button{flex:1 1;max-width:300px;min-height:48px;padding:var(--spacing-sm,8px) var(--spacing-lg,24px);background:var(--color-surface,#ffffff);color:var(--color-text-primary,#111827);border:2px solid var(--color-border-light,#e5e7eb);border-radius:var(--border-radius-md,8px);font-size:15px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;letter-spacing:.01em}.order-floating-actions .secondary-button:hover{background:var(--color-background-secondary,#f9fafb);border-color:var(--color-border,#d1d5db);transform:translateY(-1px);box-shadow:0 2px 8px rgba(0,0,0,.08)}.order-floating-actions .secondary-button:active{transform:translateY(0);box-shadow:0 1px 4px rgba(0,0,0,.05)}.order-floating-actions .secondary-button:hover{background:rgba(255,107,107,.05);border-color:var(--color-primary,#FF6B6B);color:var(--color-primary,#FF6B6B);transform:translateY(-2px) scale(1.02);box-shadow:0 4px 12px rgba(255,107,107,.15)}.order-floating-actions .primary-button{flex:1 1;max-width:300px;min-height:48px;padding:var(--spacing-sm,8px) var(--spacing-lg,24px);background:linear-gradient(135deg,var(--color-primary,#FF6B6B) 0,#E85D5D 100%);color:white;border:none;border-radius:var(--border-radius-md,8px);font-size:15px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;position:relative;overflow:hidden;box-shadow:0 4px 12px rgba(255,107,107,.3);letter-spacing:.01em}.order-floating-actions .primary-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.order-floating-actions .primary-button:hover:not(:disabled):before{left:100%}.order-floating-actions .primary-button:hover:not(:disabled){background:linear-gradient(135deg,#E85D5D,#D94D4D);transform:translateY(-2px);box-shadow:0 6px 16px rgba(255,107,107,.4)}.order-floating-actions .primary-button:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px rgba(255,107,107,.2)}.order-floating-actions .primary-button:disabled{opacity:.4;cursor:not-allowed;transform:none;background:var(--color-border-light,#d1d5db);color:var(--color-text-secondary,#6b7280);box-shadow:0 2px 4px rgba(0,0,0,.05);font-weight:500}.order-floating-actions .primary-button:disabled:before{display:none}.order-top-actions{display:flex;gap:var(--spacing-sm,8px);align-items:center;flex-shrink:0}.order-top-actions .secondary-button{min-height:40px;padding:var(--spacing-sm,8px) var(--spacing-lg,24px);background:var(--color-surface,#ffffff);color:var(--color-text-primary,#111827);border:2px solid var(--color-border-light,#e5e7eb);border-radius:var(--border-radius-md,8px);font-size:15px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;letter-spacing:.01em;white-space:nowrap}.order-top-actions .secondary-button:hover{background:rgba(255,107,107,.05);border-color:var(--color-primary,#FF6B6B);color:var(--color-primary,#FF6B6B);transform:translateY(-1px);box-shadow:0 2px 8px rgba(255,107,107,.15)}.order-top-actions .secondary-button:active{transform:translateY(0);box-shadow:0 1px 4px rgba(0,0,0,.05)}.order-top-actions .primary-button{min-height:40px;padding:var(--spacing-sm,8px) var(--spacing-lg,24px);background:linear-gradient(135deg,var(--color-primary,#FF6B6B) 0,#E85D5D 100%);color:white;border:none;border-radius:var(--border-radius-md,8px);font-size:15px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;position:relative;overflow:hidden;box-shadow:0 4px 12px rgba(255,107,107,.3);letter-spacing:.01em;white-space:nowrap}.order-top-actions .primary-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.order-top-actions .primary-button:hover:not(:disabled):before{left:100%}.order-top-actions .primary-button:hover:not(:disabled){background:linear-gradient(135deg,#E85D5D,#D94D4D);transform:translateY(-1px);box-shadow:0 6px 16px rgba(255,107,107,.4)}.order-top-actions .primary-button:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px rgba(255,107,107,.2)}.order-top-actions .primary-button:disabled{opacity:.4;cursor:not-allowed;transform:none;background:var(--color-border-light,#d1d5db);color:var(--color-text-secondary,#6b7280);box-shadow:0 2px 4px rgba(0,0,0,.05);font-weight:500}.order-top-actions .primary-button:disabled:before{display:none}.order-page-actions{display:flex;justify-content:center;align-items:center;gap:var(--spacing-md,16px);margin-top:var(--spacing-2xl,48px);padding-top:var(--spacing-xl,32px);border-top:1px solid var(--color-border-light,#e5e7eb)}.order-page-actions .secondary-button{min-height:48px;padding:var(--spacing-sm,8px) var(--spacing-xl,32px);background:var(--color-surface,#ffffff);color:var(--color-text-primary,#111827);border:2px solid var(--color-border-light,#e5e7eb);border-radius:var(--border-radius-md,8px);font-size:15px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;letter-spacing:.01em;white-space:nowrap}.order-page-actions .secondary-button:hover{background:rgba(255,107,107,.05);border-color:var(--color-primary,#FF6B6B);color:var(--color-primary,#FF6B6B);transform:translateY(-1px);box-shadow:0 2px 8px rgba(255,107,107,.15)}.order-page-actions .secondary-button:active{transform:translateY(0);box-shadow:0 1px 4px rgba(0,0,0,.05)}.order-page-actions .primary-button{min-height:48px;padding:var(--spacing-sm,8px) var(--spacing-xl,32px);background:linear-gradient(135deg,var(--color-primary,#FF6B6B) 0,#E85D5D 100%);color:white;border:none;border-radius:var(--border-radius-md,8px);font-size:15px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;position:relative;overflow:hidden;box-shadow:0 4px 12px rgba(255,107,107,.3);letter-spacing:.01em;white-space:nowrap}.order-page-actions .primary-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.order-page-actions .primary-button:hover:not(:disabled):before{left:100%}.order-page-actions .primary-button:hover:not(:disabled){background:linear-gradient(135deg,#E85D5D,#D94D4D);transform:translateY(-1px);box-shadow:0 6px 16px rgba(255,107,107,.4)}.order-page-actions .primary-button:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px rgba(255,107,107,.2)}.order-page-actions .primary-button:disabled{opacity:.4;cursor:not-allowed;transform:none;background:var(--color-border-light,#d1d5db);color:var(--color-text-secondary,#6b7280);box-shadow:0 2px 4px rgba(0,0,0,.05);font-weight:500}.order-page-actions .primary-button:disabled:before{display:none}.payment-page-back-button{margin-bottom:var(--spacing-lg,24px);width:100%}.payment-page-back-button .secondary-button{min-height:40px;padding:var(--spacing-sm,8px) var(--spacing-lg,24px);background:var(--color-surface,#ffffff);color:var(--color-text-primary,#111827);border:2px solid var(--color-border-light,#e5e7eb);border-radius:var(--border-radius-md,8px);font-size:15px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;letter-spacing:.01em;white-space:nowrap}.payment-page-back-button .secondary-button:hover{background:rgba(255,107,107,.05);border-color:var(--color-primary,#FF6B6B);color:var(--color-primary,#FF6B6B);transform:translateY(-1px);box-shadow:0 2px 8px rgba(255,107,107,.15)}.payment-page-back-button .secondary-button:active{transform:translateY(0);box-shadow:0 1px 4px rgba(0,0,0,.05)}.order-nav-actions-container{display:flex;justify-content:center;align-items:center;gap:var(--spacing-md,16px);max-width:1280px;margin:0 auto;width:100%}.order-nav-actions-container.payment-step-actions{justify-content:space-between}.order-nav-actions-container .secondary-button{min-height:40px;padding:var(--spacing-sm,8px) var(--spacing-lg,24px);background:var(--color-surface,#ffffff);color:var(--color-text-primary,#111827);border:2px solid var(--color-border-light,#e5e7eb);border-radius:var(--border-radius-md,8px);font-size:15px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;letter-spacing:.01em;white-space:nowrap}.order-nav-actions-container .secondary-button:hover{background:rgba(255,107,107,.05);border-color:var(--color-primary,#FF6B6B);color:var(--color-primary,#FF6B6B);transform:translateY(-1px);box-shadow:0 2px 8px rgba(255,107,107,.15)}.order-nav-actions-container .secondary-button:active{transform:translateY(0);box-shadow:0 1px 4px rgba(0,0,0,.05)}.order-nav-actions-container .primary-button{min-height:40px;padding:var(--spacing-sm,8px) var(--spacing-lg,24px);background:linear-gradient(135deg,var(--color-primary,#FF6B6B) 0,#E85D5D 100%);color:white;border:none;border-radius:var(--border-radius-md,8px);font-size:15px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;position:relative;overflow:hidden;box-shadow:0 4px 12px rgba(255,107,107,.3);letter-spacing:.01em;white-space:nowrap}.order-nav-actions-container .primary-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.order-nav-actions-container .primary-button:hover:not(:disabled):before{left:100%}.order-nav-actions-container .primary-button:hover:not(:disabled){background:linear-gradient(135deg,#E85D5D,#D94D4D);transform:translateY(-1px);box-shadow:0 6px 16px rgba(255,107,107,.4)}.order-nav-actions-container .primary-button:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px rgba(255,107,107,.2)}.order-nav-actions-container .primary-button:disabled{opacity:.4;cursor:not-allowed;transform:none;background:var(--color-border-light,#d1d5db);color:var(--color-text-secondary,#6b7280);box-shadow:0 2px 4px rgba(0,0,0,.05);font-weight:500}.order-nav-actions-container .primary-button:disabled:before{display:none}.order-size-layout{display:grid;grid-template-columns:500px 1fr;grid-gap:var(--spacing-2xl,48px);gap:var(--spacing-2xl,48px);align-items:start;width:100%;max-width:1280px;margin:0 auto}.order-preview-column{position:-webkit-sticky;position:sticky;top:var(--spacing-xl,32px);width:500px;flex-shrink:0}.order-preview-card{background:var(--color-surface,#ffffff);border:1px solid var(--color-border-light,#f3f4f6);border-radius:var(--border-radius-lg,16px);padding:var(--spacing-lg,24px);box-shadow:0 8px 32px rgba(0,0,0,.08),0 2px 8px rgba(0,0,0,.04);transition:all var(--animation-normal,.3s) cubic-bezier(.4,0,.2,1);overflow:visible;position:relative}.order-preview-card:before{content:"";position:absolute;inset:-2px;border-radius:var(--border-radius-lg,16px);background:linear-gradient(135deg,rgba(255,107,107,.1),rgba(255,107,107,.05));opacity:0;transition:opacity var(--animation-normal,.3s);z-index:-1}.order-preview-card:hover{box-shadow:0 12px 48px rgba(0,0,0,.12),0 4px 16px rgba(0,0,0,.08);transform:translateY(-2px);border-color:var(--color-primary,#FF6B6B)}.order-preview-card:hover:before{opacity:1}.order-preview-container{width:100%;aspect-ratio:1/1;max-height:500px;min-height:400px;background:linear-gradient(135deg,#f9fafb,#f3f4f6);border-radius:var(--border-radius-md,12px);overflow:hidden;position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;margin:0;padding:0;box-shadow:inset 0 2px 8px rgba(0,0,0,.04)}.payment-details-column .order-preview-container{aspect-ratio:1/1;max-height:none;min-height:0;height:auto}.order-preview-loading,.order-preview-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:var(--spacing-md);color:var(--color-text-secondary,#6b7280)}.order-preview-iframe{width:100%;height:100%;border:none;display:block;background:transparent;position:absolute;top:0;left:0;right:0;bottom:0}.order-selection-column{display:flex;flex-direction:column;gap:var(--spacing-md,16px);min-width:0;flex:1 1;width:100%;padding-left:var(--spacing-lg,24px)}@media (max-width:1200px){.order-size-layout{grid-template-columns:400px 1fr;gap:var(--spacing-xl,32px)}.order-preview-column{width:400px}}@media (max-width:1024px){.order-size-layout{grid-template-columns:1fr;gap:var(--spacing-xl,32px)}.order-preview-column{position:static;width:100%;max-width:500px;margin:0 auto var(--spacing-xl,32px)}.order-selection-column{padding-left:0}.size-selection-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:640px){.payment-layout{grid-template-columns:1fr;gap:var(--spacing-lg,24px)}.payment-details-column{position:static;overflow:visible}.payment-checkout-column{position:static}.form-row-modern,.size-selection-grid{grid-template-columns:1fr}.payment-step-content{padding-bottom:calc(var(--spacing-xl, 32px) + 100px)}}.albums-page-container{min-height:100vh;background:#f5f5f5;padding:2rem}.albums-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.albums-header h1{margin:0;font-size:2rem;font-weight:600}.create-album-button{padding:.75rem 1.5rem;background:#3b82f6;color:white;text-decoration:none;border-radius:6px;font-weight:600;transition:background .2s}.create-album-button:hover{background:#2563eb}.empty-state{text-align:center;padding:4rem 2rem;background:white;border-radius:8px;max-width:600px;margin:0 auto}.empty-state h2{margin-bottom:1rem;color:#1f2937}.empty-state p{color:#6b7280;margin-bottom:2rem}.albums-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-gap:1.5rem;gap:1.5rem}.album-card{background:white;border:1px solid #e5e7eb;border-radius:8px;padding:1.5rem;text-decoration:none;color:inherit;transition:all .2s}.album-card:hover{border-color:#3b82f6;box-shadow:0 4px 6px rgba(0,0,0,.1)}.album-card h3{margin:0 0 .5rem;color:#1f2937}.album-status{color:#6b7280;font-size:.875rem;margin:.25rem 0}.album-date{color:#9ca3af;font-size:.875rem;margin:.25rem 0 0}.loading-message{text-align:center;padding:4rem;color:#6b7280}.album-edit-badge{transition:opacity .3s cubic-bezier(.4,0,.2,1)}button:hover .album-edit-badge{opacity:1!important}