@media (max-width: 768px){.design-layout{grid-template-columns:1fr;gap:var(--spacing-lg)}}:root{--primary-color: #3498db;--primary-color-dark: #2980b9;--secondary-color: #2ecc71;--background-color: #ffffff;--surface-color: #f8f9fa;--text-color: #333333;--text-color-light: #666666;--border-color: #dee2e6;--error-color: #e74c3c;--success-color: #2ecc71;--info-color: #3498db;--accent-color: #f39c12;--font-body: "Inter", sans-serif;--font-heading: "Montserrat", sans-serif;--border-radius: 6px;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--box-shadow: 0 4px 6px rgba(0, 0, 0, .1)}*{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font-body);margin:0;padding:0;background-color:var(--surface-color);color:var(--text-color);line-height:1.6}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-md)}main{padding-bottom:50px}section{margin-bottom:40px;background-color:#fff;padding:30px;border-radius:8px;box-shadow:0 2px 10px #0000000d}section h2{margin-top:0;margin-bottom:25px;border-bottom:2px solid #eee;padding-bottom:10px;color:#3498db}h1,h2,h3,h4,h5,h6{margin-bottom:var(--spacing-md);font-family:var(--font-heading);font-weight:700;line-height:1.3;color:var(--text-color);letter-spacing:.5px}h1{font-size:2.5rem}h2{font-size:2rem;margin-top:var(--spacing-lg);position:relative;padding-bottom:.5rem}h2:after{content:"";position:absolute;bottom:0;left:0;width:60px;height:3px;background-color:var(--primary-color)}h3{font-size:1.5rem;margin-top:var(--spacing-lg)}h4{font-size:1.2rem}p{margin-bottom:var(--spacing-md)}a{color:var(--primary-color);text-decoration:none;transition:color .2s ease}a:hover{color:var(--primary-color-dark);text-decoration:underline}header#site-header{position:sticky;top:0;width:100%;background-color:var(--background-color);z-index:1000;transition:box-shadow .2s ease}header#site-header.scrolled{box-shadow:0 2px 5px #0000001a}.header-content.container{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-sm) var(--spacing-md)}.logo{display:flex;align-items:center;gap:var(--spacing-sm)}.logo-image{height:40px;width:auto}.logo-text{font-size:1.25rem;margin:0}.primary-nav{display:flex;gap:var(--spacing-md)}.nav-button{background:none;border:none;color:var(--text-color-light);font-weight:500;font-size:1rem;padding:var(--spacing-sm) var(--spacing-md);cursor:pointer;border-radius:var(--border-radius);transition:color .2s ease,background-color .2s ease}.nav-button.active,.nav-button:hover{color:var(--primary-color);background-color:var(--surface-color)}.nav-toggle{display:none;flex-direction:column;gap:4px;background:none;border:none;cursor:pointer;padding:var(--spacing-sm)}.nav-toggle span{display:block;width:24px;height:2px;background-color:var(--text-color);border-radius:1px}@media (max-width: 768px){.primary-nav{display:none;position:absolute;top:100%;right:var(--spacing-md);flex-direction:column;background:var(--background-color);padding:var(--spacing-md);box-shadow:var(--box-shadow)}.primary-nav.open,.nav-toggle{display:flex}}.header-content{display:flex;justify-content:space-between;align-items:center}.logo{display:flex;align-items:center}.logo img{height:40px;margin-right:10px}.logo h1{font-size:1.5em;margin:0;font-weight:700}nav{display:flex;align-items:center;gap:15px}nav .button{padding:8px 15px}#token-balance-display{font-weight:500;background-color:#eef;padding:5px 10px;border-radius:4px}.container{max-width:1200px;margin:0 auto;padding:0 20px}.card{background-color:#fdfdfd;border:1px solid #eee;padding:25px;border-radius:6px;margin-bottom:20px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:5px;font-weight:500}.form-group input[type=text],.form-group input[type=email],.form-group input[type=number],.form-group input[type=file],.form-group textarea,.form-group select{width:100%;padding:10px;border:1px solid #ccc;border-radius:4px;box-sizing:border-box;font-size:1em}.form-group textarea{resize:vertical}.form-row{display:flex;gap:20px}.form-row .form-group{flex:1}.button{display:inline-block;padding:10px 20px;border:none;border-radius:5px;background-color:#eee;color:#333;cursor:pointer;font-size:1em;text-align:center;transition:background-color .2s ease,box-shadow .2s ease}.button:hover{background-color:#ddd}.button.active{background-color:#e0e0e0;font-weight:500}.button-primary{background-color:#3498db;color:#fff}.button-primary:hover{background-color:#2980b9;box-shadow:0 2px 5px #0000001a}.button:disabled{background-color:#ccc;color:#888;cursor:not-allowed}.button.loading{position:relative;color:transparent!important}.button.loading:after{content:"";position:absolute;width:16px;height:16px;top:50%;left:50%;margin-top:-8px;margin-left:-8px;border:2px solid #fff;border-top-color:transparent;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.status-message{padding:10px;margin:15px 0;border-radius:4px;display:none;font-weight:500}.status-message.info{background-color:#e7f3fe;color:#31708f;border:1px solid #bce8f1;display:block}.status-message.success{background-color:#dff0d8;color:#3c763d;border:1px solid #d6e9c6;display:block}.status-message.error{background-color:#f2dede;color:#a94442;border:1px solid #ebccd1;display:block}.design-layout{display:grid;grid-template-columns:400px 1fr;gap:30px;align-items:flex-start}.design-controls{display:flex;flex-direction:column;gap:25px;background-color:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 8px #0000000d;border:1px solid #eee}.design-step{border-bottom:1px dashed #eee;padding-bottom:25px}.design-step:last-child{border-bottom:none;padding-bottom:0}.design-step h3{margin-top:0;margin-bottom:15px;font-size:1.1em;color:#555}.design-preview{background-color:var(--background-color);padding:20px;border:1px solid var(--border-color);border-radius:8px;box-shadow:0 2px 8px #0000000d;position:relative;display:flex;justify-content:center;align-items:center;min-height:400px;overflow:hidden}.design-actions{margin-top:20px;text-align:center}.product-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--spacing-md)}.selection-list{max-height:200px;overflow-y:auto;border:1px solid var(--border-color);border-radius:4px;padding:10px}.product-item{position:relative;overflow:hidden;border:1px solid var(--border-color);border-radius:8px;background-color:var(--background-color);box-shadow:0 1px 3px #0000001a;transition:transform .2s ease,box-shadow .2s ease;cursor:pointer;display:block}.product-item:hover{transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.product-image-wrapper{position:relative;width:100%;display:block}.product-image{display:block;width:100%;height:auto;object-fit:cover}.product-name-overlay{position:absolute;bottom:0;left:0;width:100%;background:#0009;color:#fff;padding:var(--spacing-sm);text-align:center;opacity:0;transition:opacity .2s ease;font-family:var(--font-body)}.product-item:hover .product-name-overlay{opacity:1}.product-item.selected{border:3px solid var(--primary-color)}.product-item.selected:after{content:"✔";position:absolute;top:var(--spacing-sm);right:var(--spacing-sm);background-color:var(--primary-color);color:#fff;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem}.shipping-option:last-child{border-bottom:none}.product-item:hover,.shipping-option:hover{background-color:#f9f9f9}.product-item.selected,.shipping-option.selected{background-color:#e7f3fe;font-weight:500}.swatch-container{display:flex;flex-wrap:wrap;gap:8px}.color-swatch{width:30px;height:30px;border-radius:50%;border:2px solid #eee;cursor:pointer;transition:transform .2s ease,border-color .2s ease}.color-swatch:hover{transform:scale(1.1)}.color-swatch.selected{border-color:#3498db;box-shadow:0 0 5px #3498db80}.size-selector{display:flex;flex-wrap:wrap;gap:10px}.size-button{padding:8px 12px;border:1px solid #ccc;background-color:#fff}.size-button.selected{background-color:#3498db;color:#fff;border-color:#3498db}.tab-container{margin-top:10px}.tab-buttons{display:flex;margin-bottom:15px;border-bottom:1px solid #eee}.tab-buttons .tab-button{background-color:transparent;border:none;border-bottom:3px solid transparent;padding:10px 15px;margin-right:5px;margin-bottom:-1px;border-radius:0}.tab-buttons .tab-button.active{border-bottom-color:#3498db;font-weight:500;color:#3498db}.tab-contents .tab-content{display:none}.tab-contents .tab-content.active{display:block}.image-preview{margin-top:15px;max-width:200px;max-height:150px;border:1px solid #eee;padding:5px;display:flex;justify-content:center;align-items:center}.image-preview img{max-width:100%;max-height:100%;object-fit:contain}.results-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:10px;margin-top:15px}.results-grid img{width:100%;height:auto;border:2px solid transparent;cursor:pointer;transition:border-color .2s ease;border-radius:4px}.results-grid img:hover{border-color:#aaa}.results-grid img.selected{border-color:#3498db;box-shadow:0 0 8px #3498db80}.mockup-container{position:relative;display:flex;flex-direction:column;align-items:center;padding:20px;background-color:#f0f0f0;border-radius:8px}.mockup-area{position:relative;width:400px;height:450px;margin-bottom:20px;overflow:hidden;border:1px solid #ccc;background-color:#fff}.mockup-base-image{display:block;width:100%;height:100%;object-fit:contain}.mockup-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.design-image-container{position:absolute;cursor:grab;border:1px dashed #aaa;background-color:#ffffff4d;pointer-events:auto;display:none}.design-image-container img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.resize-handle{position:absolute;bottom:0;right:0;width:15px;height:15px;background-color:#3498db;border:1px solid #fff;border-radius:50%;cursor:nwse-resize;pointer-events:auto;transform:translate(50%,50%)}.print-area-guide{position:absolute;border:2px dashed rgba(255,0,0,.6);pointer-events:none;display:block;box-sizing:border-box}.stripe-container{margin-top:20px;padding:20px;border:1px solid #eee;border-radius:4px}#payment-element-container,#tshirt-payment-element-container{margin-bottom:20px}.token-purchase-box{max-width:400px;margin:20px auto;text-align:center}.grant-id-box{margin-top:20px;padding:15px;background-color:#fffbea;border:1px solid #fadf98;border-radius:4px;text-align:left;display:none}.grant-id-box h4{margin-top:0;color:#8a6d3b}.grant-id-box .warning{color:#c09853;font-weight:700}.checkout-layout{display:grid;grid-template-columns:1fr 1.5fr;gap:30px}.recovery-box{max-width:500px;margin:20px auto}footer{margin-top:50px;background-color:#333;color:#eee;padding:20px 0;font-size:.9em}.footer-content{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:15px}.legal-links a{color:#eee;text-decoration:none;margin:0 10px}.legal-links a:hover{text-decoration:underline}.analytics-opt-out{display:flex;align-items:center}.analytics-opt-out label{margin-left:8px;cursor:pointer}@media (max-width: 992px){.design-layout{grid-template-columns:1fr}.mockup-container{order:-1;margin-bottom:30px}.checkout-layout{grid-template-columns:1fr}}@media (max-width: 768px){.header-content{flex-direction:column;gap:15px}nav{flex-wrap:wrap;justify-content:center}.form-row{flex-direction:column;gap:0}}@media (max-width: 480px){.logo h1{font-size:1.3em}nav .button{font-size:.9em}section{padding:20px}}