.app-container{display:grid;grid-template-columns:460px 1fr;min-height:calc(100vh - 70px);grid-gap:0;gap:0;position:relative}@media (max-width:1024px){.app-container{grid-template-columns:1fr}}.app-header{grid-column:1/-1;justify-content:space-between;padding:14px 40px;border-bottom:1px solid rgba(255,255,255,.05);background:rgba(6,4,13,.7);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);z-index:50;position:-webkit-sticky;position:sticky;top:0}.app-header,.logo-group{display:flex;align-items:center}.logo-group{gap:12px}.logo-icon{width:34px;height:34px;background:linear-gradient(135deg,var(--accent-pink),var(--accent-purple));border-radius:10px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 20px rgba(234,76,137,.4)}.logo-text{font-family:var(--font-sans);font-weight:800;font-size:1.3rem;letter-spacing:-.02em;background:linear-gradient(135deg,#ffffff 40%,var(--accent-pink) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.sidebar-control{padding:32px 24px;gap:28px;border-right:1px solid rgba(255,255,255,.05);position:-webkit-sticky;position:sticky;top:80px;background:rgba(10,8,22,.35);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);z-index:10}.main-preview,.sidebar-control{display:flex;flex-direction:column;overflow-y:auto;max-height:calc(100vh - 80px)}.main-preview{padding:40px 32px;gap:32px;align-items:center;justify-content:flex-start;width:100%}.form-group{display:flex;flex-direction:column;gap:10px}.form-label{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary);display:flex;align-items:center;gap:8px}.input-text,.select-box,.textarea-box{background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06);border-radius:12px;color:var(--text-primary);padding:14px 18px;font-family:var(--font-sans);font-size:.95rem;transition:var(--transition-smooth)}.input-text:focus,.select-box:focus,.textarea-box:focus{outline:none;border-color:var(--accent-pink);box-shadow:0 0 16px rgba(234,76,137,.25);background:rgba(255,255,255,.04)}.option-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:12px;gap:12px}.option-card{padding:16px 12px;border-radius:14px;cursor:pointer;text-align:center;border:1px solid rgba(255,255,255,.04);background:rgba(255,255,255,.01);transition:var(--transition-bounce);display:flex;flex-direction:column;justify-content:center;align-items:center}.option-card:hover{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.12);transform:translateY(-2px)}.option-card.active{background:linear-gradient(135deg,rgba(234,76,137,.15),rgba(146,84,222,.08));border-color:var(--accent-pink);box-shadow:0 8px 24px rgba(234,76,137,.2)}.option-title{font-size:.92rem;font-weight:700;color:var(--text-primary)}.option-subtitle{font-size:.72rem;color:var(--text-secondary);margin-top:4px;line-height:1.3}.uploader-box{border:2px dashed rgba(255,255,255,.08);border-radius:16px;padding:36px 20px;text-align:center;cursor:pointer;background:rgba(255,255,255,.005);transition:var(--transition-bounce);position:relative;overflow:hidden}.uploader-box:hover{border-color:var(--accent-pink);background:rgba(234,76,137,.015);box-shadow:inset 0 0 20px rgba(234,76,137,.05)}.uploader-icon{margin:0 auto 14px;color:var(--text-secondary);transition:var(--transition-bounce)}.uploader-box.drag-active .uploader-icon,.uploader-box:hover .uploader-icon{transform:translateY(-6px) scale(1.15);color:var(--accent-pink)}.uploader-box.drag-active{border-color:var(--accent-pink);background:rgba(234,76,137,.06);box-shadow:inset 0 0 20px rgba(234,76,137,.15)}.preview-thumbnail{width:100%;max-height:160px;object-fit:contain;border-radius:10px;border:1px solid rgba(255,255,255,.05);background:rgba(0,0,0,.2)}.remove-btn{position:absolute;top:10px;right:10px;background:rgba(0,0,0,.7);border:1px solid rgba(255,255,255,.1);color:#fff;border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:var(--transition-smooth)}.remove-btn:hover{background:var(--accent-pink);transform:scale(1.1)}.preview-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:32px;gap:32px;width:100%;max-width:1100px}@media (max-width:900px){.preview-board{grid-template-columns:1fr}}.preview-panel{display:flex;flex-direction:column;gap:18px;min-width:0}.panel-title-bar{display:flex;justify-content:space-between;align-items:center}.preview-container{width:100%;aspect-ratio:1;border-radius:20px;overflow:hidden;position:relative;background:#040209;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-lg);border:1px solid rgba(255,255,255,.04)}.preview-img{width:100%;height:100%;object-fit:contain;transition:var(--transition-smooth)}.preview-empty-state{flex-direction:column;gap:20px;color:var(--text-secondary);text-align:center;padding:40px}.preview-empty-state,.product-design-card{display:flex;align-items:center;justify-content:center}.product-design-card{width:100%;height:100%;position:relative;background:#0d0b1a;overflow:hidden}.bg-pattern{position:absolute;inset:0;opacity:.15}.neon-orbs{background:var(--accent-pink);opacity:.4;top:-50px;left:-50px;animation:pulseGlow 8s ease-in-out infinite}.neon-orbs,.neon-orbs-secondary{position:absolute;width:300px;height:300px;border-radius:50%;filter:blur(80px)}.neon-orbs-secondary{background:var(--accent-purple);opacity:.3;bottom:-50px;right:-50px;animation:pulseGlow 10s ease-in-out infinite}.product-art{width:60%;height:60%;z-index:10;object-fit:contain;filter:drop-shadow(0 15px 30px rgba(0,0,0,.6))}.watermark-brand{position:absolute;display:flex;align-items:center;gap:6px;z-index:25}.watermark-logo{width:16px;height:16px;background:var(--accent-pink);border-radius:4px}.watermark-name{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:#fff}.badge-overlay{position:absolute;z-index:25}.copy-overlay{position:absolute;bottom:24px;left:24px;right:24px;z-index:20;display:flex;flex-direction:column;gap:4px;text-align:left}.overlay-title{font-size:1.5rem;font-weight:800;color:#fff;letter-spacing:-.01em;line-height:1.2}.overlay-desc{font-size:.85rem;color:rgba(255,255,255,.7)}.product-art-hybrid{max-width:100%;max-height:100%;object-fit:contain;animation:floatMotion 6s ease-in-out infinite}.copy-overlay-static{width:100%;z-index:20;transition:var(--transition-smooth)}@keyframes floatMotion{0%,to{transform:translateY(0) rotate(-10deg) scale(1.15)}50%{transform:translateY(-8px) rotate(-8deg) scale(1.17)}}.prompt-box{width:100%;max-width:1100px;display:flex;flex-direction:column;gap:12px}.prompt-content{background:rgba(20,16,38,.5);border:1px solid rgba(255,255,255,.05);border-radius:12px;padding:16px;position:relative;text-align:left}.prompt-text{font-family:var(--font-mono);font-size:.85rem;color:var(--accent-pink);line-height:1.6;white-space:pre-wrap}.copy-icon-btn{position:absolute;top:12px;right:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:6px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);cursor:pointer;transition:var(--transition-smooth)}.copy-icon-btn:hover{background:rgba(255,255,255,.12);color:#fff}.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.75);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeIn .25s ease-out}.modal-content{width:500px;max-width:90%;padding:32px;display:flex;flex-direction:column;gap:24px;border-radius:20px;animation:slideUp .3s cubic-bezier(.16,1,.3,1)}.modal-header{display:flex;justify-content:space-between;align-items:center}.close-modal-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;transition:var(--transition-smooth)}.close-modal-btn:hover{color:#fff}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.progress-container{display:flex;flex-direction:column;gap:8px;width:100%}.progress-bar-bg{width:100%;height:6px;background:rgba(255,255,255,.05);border-radius:99px;overflow:hidden}.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--accent-pink),var(--accent-purple));border-radius:99px;width:0;transition:width .4s ease-out}.phase-text{font-size:.85rem;font-weight:600;color:var(--accent-pink);text-transform:uppercase;letter-spacing:.05em;text-align:center}