:root{font-family: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}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}body{margin:0;font-family:Helvetica Neue,Arial,sans-serif;background:#fafafa;color:#333;min-height:100vh;display:flex;align-items:center;justify-content:center}.container{background:#fff;border-radius:12px;box-shadow:0 4px 20px #0000000d;padding:2rem;width:clamp(320px,80vw,1400px);text-align:center}@media (min-width: 1024px){.container{padding:3rem 4rem}}@media (min-width: 1600px){.container{width:clamp(320px,75vw,1600px)}}.header{margin-bottom:2rem}.header h1{margin:0;font-size:2.5rem;font-weight:700;color:#f8b500}.tagline{font-size:1.2rem;margin-top:.5rem;color:#666}.intro{margin-bottom:2rem}.upload-section{border:2px dashed #ddd;border-radius:10px;padding:2rem;background:#fff;transition:border-color .2s ease-in-out}.upload-section:hover{border-color:#f8b500}.upload-label{cursor:pointer;display:block;color:#555;border-style:dashed;border-color:#ddd;border-width:2px;height:5rem}.upload-label input{display:none}.file-name{margin-top:1rem;font-style:italic;color:#666}.cta-button{margin-top:1.5rem;background:#f8b500;color:#fff;border:none;padding:1rem 2rem;border-radius:50px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:background .2s ease-in-out}.cta-button:hover{background:#e6a800}.footer{margin-top:2rem;font-size:.9rem;color:#aaa}.image-preview{position:relative;width:400px;height:400px;margin:20px auto;overflow:hidden;display:flex;justify-content:center;align-items:center}.image-preview img{position:absolute;width:100%;height:100%;object-fit:cover;transition:opacity 3s ease;opacity:0}.image-preview img.visible{opacity:1}.cta-button{display:block;margin:20px auto;padding:12px 24px;font-size:16px;cursor:pointer}button.toggle-button{display:block;margin:10px auto;padding:8px 16px;font-size:14px;cursor:pointer}.fade-image{max-width:100%;border-radius:8px;opacity:1;transition:opacity 1.5s ease-in-out}.fade-in{opacity:0;animation:fadeInAnimation 1.5s forwards}@keyframes fadeInAnimation{0%{opacity:0}to{opacity:1}}.navbar{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background:#fff;border-bottom:1px solid #eee;box-shadow:0 2px 8px #0000000d;position:sticky;top:0;z-index:100;width:100%}.navbar-logo{font-size:1.5rem;font-weight:700;color:#f8b500;font-family:Helvetica Neue,Arial,sans-serif}.navbar-links{display:flex;gap:1.5rem}.navbar-links a{text-decoration:none;color:#333;font-weight:500;position:relative;transition:color .2s ease}.navbar-links a:hover{color:#f8b500}.navbar-links a:after{content:"";position:absolute;width:0%;height:2px;left:0;bottom:-4px;background:#f8b500;transition:width .3s ease}.navbar-links a:hover:after{width:100%}.step{margin-bottom:2rem;transition:all .3s ease}.step.collapsed h2{opacity:.5}.step.collapsed form,.step.collapsed button,.step.collapsed .upload-label,.step.collapsed .image-preview{display:none}.order-form{display:flex;flex-direction:column;gap:1rem;max-width:400px;margin:0 auto}.order-form input{color:#000;padding:12px 14px;border:1px solid #ddd;border-radius:8px;font-size:16px;background:#fafafa;transition:all .2s ease;outline:none}.order-form input:focus{border-color:#4a90e2;background:#fff;box-shadow:0 0 0 3px #4a90e233}.order-form input::placeholder{color:#aaa}.nav-buttons{display:flex;justify-content:space-between;margin-top:1.5rem}.nav-buttons button{padding:10px 18px;border-radius:8px;border:none;cursor:pointer;font-size:15px;transition:background .2s ease}.nav-buttons button:not(.cta-button){background:#f0f0f0}.nav-buttons button:not(.cta-button):hover{background:#e0e0e0}.timeline{--circle: 40px;--line: 4px;--color-accent: #f8b500;--color-muted: #eaeaea;position:relative;display:grid;grid-template-columns:repeat(5,1fr);column-gap:0;row-gap:.5rem;margin:1rem 0 2rem}.timeline__track,.timeline__progress{position:absolute;top:calc(var(--circle) / 2);left:calc(var(--circle) / 2);right:calc(var(--circle) / 2);height:var(--line);transform:translateY(-50%);border-radius:999px;pointer-events:none}.timeline__track{background:var(--color-muted);width:auto}.timeline__progress{background:var(--color-accent);width:0%}.timeline__item{display:grid;grid-template-rows:var(--circle) auto;place-items:center}.timeline__circle{width:var(--circle);z-index:1;aspect-ratio:1 / 1;height:auto;padding:0;box-sizing:border-box;border-radius:50%;border:3px solid var(--color-muted);background:#fff;color:#888;font-weight:700;display:inline-flex;align-items:center;justify-content:center;transition:transform .15s ease,background .2s ease,border-color .2s ease,color .2s ease;cursor:pointer;line-height:1;box-shadow:0 2px 6px #0000000f}.timeline__circle:hover{transform:translateY(-1px) scale(1.03)}.timeline__circle.is-active{border-color:var(--color-accent);color:var(--color-accent);background:#fff9e6}.timeline__circle.is-complete{border-color:var(--color-accent);background:var(--color-accent);color:#fff}.timeline__label{margin-top:.5rem;font-size:.9rem;color:#888;text-align:center}.timeline__label.is-active{color:#333;font-weight:700}.timeline__label.is-complete{color:#555}@media (max-width: 640px){.timeline{grid-template-columns:1fr;row-gap:.75rem}.timeline__track,.timeline__progress{display:none}.timeline__item{grid-template-rows:auto;grid-auto-flow:column;grid-auto-columns:max-content 1fr;justify-content:start;column-gap:.75rem}.timeline__label{margin-top:0;text-align:left}}.editor-grid{display:flex}.editor-tools{background:#fff;border:1px solid #eee;border-radius:14px;padding:1rem;box-shadow:0 6px 24px #0000000f;display:grid;gap:1rem;text-align:left}@media (min-width: 768px){.editor-tools{padding:1.25rem 1.5rem}}.editor-tools__grid{display:grid;gap:1rem}@media (min-width: 768px){.editor-tools__grid{grid-template-columns:1fr 1fr;gap:1rem 1.25rem}}.editor-tools__group{display:grid;gap:.5rem}.editor-tools__label{font-size:.9rem;color:#666;font-weight:600}.editor-tools__input{width:90%;padding:10px 12px;border-radius:10px;border:1px solid #e6e6e6;background:#fafafa;font-size:.95rem;transition:border-color .15s ease,box-shadow .15s ease background .15s ease;color:#333}.editor-tools__input:focus{outline:none;background:#fff;border-color:#f8b500;box-shadow:0 0 0 3px #f8b50026}.editor-tools__range{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:999px;background:#eee;outline:none}.editor-tools__range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#f8b500;border:2px solid #fff;box-shadow:0 2px 6px #00000040;cursor:pointer}.editor-tools__range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#f8b500;border:2px solid #fff;box-shadow:0 2px 6px #00000040;cursor:pointer}.editor-tools__color{-webkit-appearance:none;appearance:none;width:44px;height:44px;padding:0;border:1px solid #e6e6e6;border-radius:10px;overflow:hidden;background:#fff;cursor:pointer;box-shadow:0 2px 10px #0000000f inset}.editor-tools__color::-webkit-color-swatch-wrapper{padding:0}.editor-tools__color::-webkit-color-swatch{border:none;border-radius:10px}.editor-tools__sizes{display:flex;flex-wrap:wrap;gap:.5rem}.editor-tools__size-btn{border:1px solid #e6e6e6;background:#fafafa;padding:8px 12px;border-radius:999px;font-weight:600;font-size:.9rem;cursor:pointer;transition:all .15s ease;color:#333}.editor-tools__size-btn:hover{border-color:#f0d27a;background:#fff}.editor-tools__size-btn.is-active{background:#fff7e0;border-color:#f8b500;color:#b07a00;box-shadow:0 0 0 3px #f8b50026}.editor-tools__hint{font-size:.85rem;color:#999}