@import"https://fonts.googleapis.com/css2?family=Anton&family=Abril+Fatface&family=Alfa+Slab+One&family=Bangers&family=Bebas+Neue&family=Black+Ops+One&family=Bungee&family=Cinzel&family=Lilita+One&family=Montserrat+Alternates:wght@400;600&family=Orbitron:wght@400;600&family=Oswald:wght@400;600&family=Pacifico&family=Playfair+Display:wght@400;600&family=Poppins:wght@400;600&family=Press+Start+2P&family=Raleway:wght@400;600&family=Righteous&family=Rubik+Mono+One&family=Satisfy&family=Space+Grotesk:wght@400;500;600;700&family=Staatliches&family=Teko:wght@400;600&display=swap";.layer-panel{display:flex;flex-direction:column;height:100%;color:#1b1c15}.layer-panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.8rem;padding-bottom:.6rem;border-bottom:1px solid #e6e2dc}.layer-panel-header h3{margin:0;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#6e675f}.layer-stats{display:flex;gap:.75rem}.stat{font-size:.72rem;color:#1b1c15;background:#fff4ec;padding:.25rem .5rem;border-radius:999px;display:inline-flex;align-items:center;gap:.35rem}.stat img{width:14px;height:14px;display:block}.layer-list{flex:1;overflow-y:auto;margin-bottom:1rem}.layer-panel .layer-item{display:flex;align-items:center;justify-content:space-between;padding:.75rem;margin-bottom:.5rem;background:#fff;border:1px solid #e6e2dc;border-radius:14px;cursor:pointer;transition:all .2s ease;box-shadow:0 8px 18px #0000000f}.layer-panel .layer-item:hover{background:#fffaf6!important;border-color:#ee7218;box-shadow:0 12px 22px #ee71182e}.layer-panel .layer-item.selected{border-color:#ee7218;background:#fff6ef!important;box-shadow:0 12px 22px #ee711833}.layer-content{display:flex;align-items:center;flex:1;min-width:0}.layer-icon{font-size:1.2rem;margin-right:.75rem;flex-shrink:0}.layer-icon img{width:18px;height:18px;display:block}.layer-info{flex:1;min-width:0}.layer-panel .layer-name{font-weight:600;color:#1b1c15!important;margin-bottom:.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer-details{font-size:.78rem;color:#7a736a}.layer-actions{display:flex;gap:.25rem;opacity:1}.action-btn{background:none;border:none;padding:.25rem;border-radius:4px;cursor:pointer;font-size:.8rem;transition:background-color .2s ease;display:flex;align-items:center;justify-content:center;width:24px;height:24px}.action-btn img{width:14px;height:14px;display:block}.action-btn:hover:not(:disabled){background:#fff4ec}.action-btn:disabled{opacity:.3;cursor:not-allowed}.delete-btn:hover{background:#ffe8e8;color:#dc3545}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 1rem;text-align:center;color:#7f8c8d}.empty-icon{font-size:3rem;margin-bottom:1rem;opacity:.5}.empty-state p{margin:.5rem 0;font-weight:500}.empty-state small{font-size:.85rem;opacity:.7}.layer-properties{border-top:1px solid #e0e0e0;padding-top:1rem}.layer-properties h4{margin:0 0 1rem;font-size:1rem;color:#2c3e50}.property-group{display:flex;align-items:center;margin-bottom:.75rem}.property-group label{min-width:80px;font-size:.85rem;color:#5a6c7d;margin-right:.5rem}.property-group input{flex:1;padding:.375rem .5rem;border:1px solid #ddd;border-radius:4px;font-size:.85rem;background:#fff}.property-group input:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 2px #007bff40}.layer-list::-webkit-scrollbar{width:6px}.layer-list::-webkit-scrollbar-track{background:#0000000d;border-radius:3px}.layer-list::-webkit-scrollbar-thumb{background:#0003;border-radius:3px}.layer-list::-webkit-scrollbar-thumb:hover{background:#0000004d}@media(max-width:768px){.layer-panel-header{flex-direction:column;gap:.5rem;align-items:flex-start;border-bottom:0;padding-bottom:0;margin-bottom:.5rem}.layer-stats{align-self:flex-end}.layer-panel-header h3,.layer-panel-header .layer-stats{display:none}.layer-list{display:flex;gap:.6rem;overflow-x:auto;overflow-y:hidden;padding:0;height:var(--mobile-card-size);max-height:var(--mobile-card-size);min-height:var(--mobile-card-size);margin-bottom:0;scroll-snap-type:x proximity;align-items:center}.layer-list::-webkit-scrollbar{height:6px}.layer-list::-webkit-scrollbar-track{background:#0000000d}.layer-panel .layer-item{flex:0 0 var(--mobile-card-size);width:var(--mobile-card-size);min-width:var(--mobile-card-size);height:var(--mobile-card-size);margin-bottom:0;scroll-snap-align:start;padding:.35rem}.layer-panel .layer-item{flex-direction:column;align-items:stretch;gap:.45rem}.layer-panel .layer-content{flex-direction:column;align-items:center;width:100%}.layer-panel .layer-info{flex-direction:column;align-items:center;text-align:center}.layer-panel .layer-actions{width:100%;justify-content:center;gap:.45rem}.layer-panel .layer-name{display:none}.layer-panel .layer-icon.layer-thumb{width:100%;aspect-ratio:1 / 1;border-radius:8px;background:#f7f7f5;border:1px solid #1b1c15;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-right:0}.layer-panel .layer-icon.layer-thumb img{width:100%;height:100%;object-fit:cover}.empty-state{width:100%}.layer-panel .layer-content{gap:.4rem}.layer-panel .layer-info{display:flex;align-items:center;gap:.4rem}.layer-panel .layer-name{margin-bottom:0;font-size:.85rem}.layer-panel .layer-details{font-size:.75rem;white-space:nowrap}.layer-icon{font-size:1rem;margin-right:.5rem}.layer-name{font-size:.9rem}.action-btn{width:20px;height:20px;font-size:.7rem}}.app{position:relative;display:flex;flex-direction:column;height:var(--app-height, 100vh);background:radial-gradient(circle at 10% 10%,rgba(255,255,255,.7),transparent 45%),radial-gradient(circle at 85% 25%,rgba(255,212,184,.4),transparent 55%),linear-gradient(120deg,#f5f3ef,#ede8e2);font-family:Space Grotesk,Montserrat Alternates,sans-serif;color:#1b1c15}.intro-overlay{position:fixed;inset:0;z-index:2000;--intro-logo-top: 16px;--intro-logo-left: 16px;--intro-logo-size: 225px;background:radial-gradient(circle at 20% 10%,rgba(255,255,255,.5),transparent 55%),radial-gradient(circle at 80% 80%,rgba(0,0,0,.08),transparent 50%),linear-gradient(135deg,#f2f2f2,#dcdcdc);animation:intro-fade 2.2s ease forwards;pointer-events:all}.intro-logo{position:absolute;width:var(--intro-logo-size);height:auto;top:50%;left:50%;transform:translate(-50%,-50%) scale(1.05);animation:intro-logo-move 2s cubic-bezier(.2,.9,.2,1) forwards;filter:drop-shadow(0 18px 40px rgba(0,0,0,.35))}.intro-shine{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.2),transparent 60%);animation:intro-shine 1.6s ease-in-out infinite;mix-blend-mode:screen;pointer-events:none}.creation-feedback-overlay{position:fixed;inset:0;z-index:2600;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 20% 10%,rgba(239,114,24,.16),transparent 55%),radial-gradient(circle at 80% 80%,rgba(255,255,255,.08),transparent 55%),linear-gradient(135deg,#0a0a0af0,#1a1a1af5);animation:creation-feedback-fade 2s cubic-bezier(.22,1,.36,1) forwards;pointer-events:all}.creation-feedback-overlay.has-links{animation:none;background:radial-gradient(circle at 20% 10%,rgba(239,114,24,.18),transparent 55%),radial-gradient(circle at 80% 80%,rgba(255,255,255,.08),transparent 55%),linear-gradient(135deg,#0a0a0af2,#1a1a1af7)}.creation-feedback-card{width:min(92vw,560px);border:1px solid rgba(239,114,24,.6);border-radius:18px;background:#0000008c;box-shadow:0 22px 44px #00000059;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:1.2rem 1.3rem;display:flex;align-items:center;gap:1rem;animation:creation-feedback-card 2s cubic-bezier(.22,1,.36,1) forwards}.creation-feedback-card.is-result{width:min(94vw,760px);animation:creation-feedback-result-in .52s cubic-bezier(.22,1,.36,1) forwards}.creation-feedback-logo{width:128px;height:128px;object-fit:contain;filter:drop-shadow(0 8px 18px rgba(239,114,24,.35));animation:none}.creation-feedback-content{display:flex;flex:1;min-width:0;flex-direction:column;gap:.65rem}.creation-feedback-text{margin:0;color:#f9fafb;font-size:clamp(.95rem,1.9vw,1.1rem);font-weight:600;line-height:1.35}.creation-feedback-overlay.is-saved .creation-feedback-card{border-color:#ef7218b3}.creation-feedback-overlay.is-loaded .creation-feedback-card{border-color:#ffffffa6}.creation-feedback-links{display:flex;flex-direction:column;gap:.45rem;animation:creation-feedback-links-in .42s ease forwards}.creation-feedback-link-row{display:flex;align-items:center;justify-content:space-between;gap:.6rem;color:#fff;font-size:.85rem;font-weight:700}.creation-feedback-links input{width:100%;border:1px solid rgba(255,255,255,.35);background:#ffffff14;color:#fff;border-radius:8px;font-size:.78rem;padding:.45rem .55rem}.creation-feedback-copy,.creation-feedback-close-btn{border:1px solid rgba(239,114,24,.75);background:#ef721824;color:#fff;border-radius:8px;padding:.35rem .7rem;font-size:.78rem;font-weight:700;cursor:pointer}.creation-feedback-close-btn{margin-top:.35rem;align-self:flex-end}.creation-feedback-continue-btn{border:none;background:#ee7218;color:#fff;border-radius:8px;padding:.45rem .9rem;font-size:.82rem;font-weight:700;cursor:pointer;transition:background .15s ease}.creation-feedback-continue-btn:hover{background:#d4600f}.share-form-card{width:min(94vw,700px)}.share-form-label{color:#fff;font-size:.84rem;font-weight:700}.share-form-input{width:100%;border:1px solid rgba(255,255,255,.45);background:#ffffff1a;color:#fff;border-radius:9px;font-size:.9rem;padding:.52rem .62rem}.share-form-checkbox{display:flex;align-items:flex-start;gap:.55rem;color:#fff;font-size:.82rem;line-height:1.35}.share-form-checkbox input{margin-top:.16rem}.share-form-error{margin:0;color:#ffb4b4;font-size:.82rem;font-weight:700}.share-form-actions{display:flex;align-items:center;justify-content:flex-end;gap:.55rem}.share-form-actions .creation-feedback-close-btn{margin-top:0;align-self:auto}.share-form-overlay{background:radial-gradient(circle at 20% 10%,rgba(239,114,24,.18),transparent 55%),radial-gradient(circle at 80% 80%,rgba(255,255,255,.08),transparent 55%),linear-gradient(135deg,#0a0a0af2,#1a1a1af7)}.readonly-badge{position:absolute;top:16px;right:72px;z-index:20;border:1px solid rgba(239,114,24,.75);background:#000000b8;color:#fff;border-radius:999px;padding:.3rem .65rem;font-size:.78rem;font-weight:700}.right-panel.is-readonly{pointer-events:none;opacity:.72}.app-logo{position:absolute;top:16px;left:16px;width:225px;height:auto;z-index:10;pointer-events:none}.product-switcher{position:absolute;top:16px;right:16px;z-index:10;display:flex;flex-direction:column;align-items:flex-end;gap:.35rem}.product-switcher-btn{background:#fff;border-color:#1b1c15;font-weight:700;box-shadow:0 10px 20px #0000001f;padding:.35rem;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center}.product-switcher-btn img{width:24px;height:24px;display:block}.menu-switcher{position:absolute;top:16px;right:68px;z-index:10;display:flex;align-items:flex-start}.quick-menu{position:absolute;top:52px;right:0;background:#fff;border:1px solid #1b1c15;box-shadow:0 10px 24px #0000001f;border-radius:10px;display:flex;flex-direction:column;min-width:180px;overflow:hidden}.quick-menu-item{border:none;background:#fff;color:#1b1c15;text-align:left;padding:.65rem .85rem;font-size:.9rem;cursor:pointer}.quick-menu-settings{display:flex;align-items:center;justify-content:space-between;font-weight:700}.quick-menu-chevron{font-size:.95rem;color:#6b7280}.quick-menu-submenu{border-top:1px solid #e5e7eb;background:#fafafa}.quick-menu-subitem{padding-left:1.6rem;font-size:.86rem;background:transparent}.quick-menu-item+.quick-menu-item{border-top:1px solid #e5e7eb}.quick-menu-item:hover{background:#f7f7f5}.product-switcher-name{background:#ffffffe6;border:1px solid rgba(27,28,21,.2);border-radius:8px;padding:.2rem .55rem;font-size:.75rem;font-weight:600;color:#1b1c15;max-width:220px;text-align:right}.app-content{display:flex;flex:1;overflow:hidden}.canvas-container{flex:1;position:relative;background:linear-gradient(180deg,#ffffffd9,#fff9),radial-gradient(circle at 50% 0%,rgba(255,198,160,.35),transparent 55%),#f1efeb}.canvas-container.is-preview-background canvas{opacity:0;transition:opacity .12s ease}.right-panel{width:420px;display:flex;flex-direction:column;gap:0;background:#fbfaf7;border-left:1px solid rgba(27,28,21,.08);padding:0;overflow:hidden;min-height:0;color:#1b1c15;color-scheme:light;position:relative;box-shadow:-18px 0 28px #00000014}.right-panel.is-modal-open{overflow:hidden;touch-action:none;-webkit-backdrop-filter:none;backdrop-filter:none}.right-panel.is-modal-open .tab-content{overflow:hidden;touch-action:none}.right-panel *{color-scheme:light}.tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;flex-shrink:0;background:#fff;padding-bottom:0;border-bottom:1px solid rgba(27,28,21,.1);position:sticky;top:0;z-index:6}.tab-btn{border:none;background:transparent;color:#6f6a62;padding:.85rem .4rem;border-radius:0;cursor:pointer;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;border-bottom:2px solid transparent;transition:color .16s ease,border-color .16s ease,background .16s ease}.tab-btn.active{background:#fff6ef;color:#1b1c15;border-bottom-color:#ee7218}.tab-content{display:flex;flex-direction:column;gap:1rem;flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;animation:tab-in .22s ease;padding:1.1rem 1.2rem 1.4rem;background:#fbfaf7}.tab-content.no-scroll{overflow:hidden}.design-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}.design-zone{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;color:#1b1c15}.design-zone input{accent-color:#1b1c15}.design-card{border:1px solid #1b1c15;background:#fff;border-radius:10px;padding:.5rem;display:flex;flex-direction:column;align-items:center;gap:.4rem;cursor:pointer;position:relative}.design-card-active{border-color:#ee7218;box-shadow:0 0 0 2px #ee711840}.design-delete{border:1px solid #1b1c15;background:#fff;color:#1b1c15;border-radius:8px;padding:.3rem .5rem;font-size:.7rem;cursor:pointer}.design-card img{width:100%;height:90px;object-fit:contain;background:#f7f7f5;border-radius:6px;display:block}.design-empty{width:100%;height:90px;border-radius:6px;background:#f7f7f5;color:#1b1c15;display:flex;align-items:center;justify-content:center;font-size:.85rem;border:1px dashed #1b1c15}.design-card span{font-size:.8rem;color:#1b1c15;text-align:center}.design-preview{position:relative;width:100%;aspect-ratio:1 / 1;border-radius:8px;overflow:hidden;background:#f7f7f5;display:flex;align-items:center;justify-content:center}.design-preview img{display:block;max-width:100%;max-height:100%;object-fit:cover}.design-preview-img{width:100%;height:100%;object-fit:cover}.design-preview-loading{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.design-preview-loading .loading-spinner{width:36px;height:36px;border-width:2px;margin-bottom:0}.empty-tab{padding:1rem;background:#f7f7f5;border-radius:10px;color:#1b1c15}.color-panel{display:flex;flex-direction:column;gap:.6rem;flex:1;min-height:0;height:100%}.color-panel.is-picker-open{overflow:hidden}.simple-list{display:flex;flex-direction:column;animation:panel-in .22s ease}.simple-group{padding:.6rem 0;display:flex;flex-direction:column;gap:.4rem}.simple-row{display:flex;align-items:center;justify-content:flex-start;gap:.4rem}.simple-group>.simple-row .simple-row-divider{display:block;align-self:center;height:1px;background:repeating-linear-gradient(to right,rgba(27,28,21,.25) 0,rgba(27,28,21,.25) 4px,transparent 4px,transparent 8px);border:none}.simple-subrow .simple-row-divider{display:none}.simple-row.is-hidden .clamp-text,.simple-row.is-hidden .simple-row-title,.simple-row.is-hidden .color-group-swatch,.simple-row.is-hidden .color-element-swatch{filter:grayscale(1);opacity:.45}.simple-row.is-hidden .motif-visibility-btn,.simple-row.is-hidden .motif-visibility-btn img{filter:none;opacity:1}button.simple-row{border:none;background:transparent;padding:0;width:100%;text-align:left;cursor:pointer}.simple-row-title{font-size:1.02rem;font-weight:700;color:#1b1c15;flex:0 1 auto;min-width:0}.simple-row-title-btn{border:none;background:transparent;padding:0;text-align:left;cursor:pointer}.simple-subrow .simple-row-title{font-size:.9rem;font-weight:400}.simple-row-divider{height:1px;flex:1 1 auto;background:#e5e7eb;margin-left:.6rem;margin-right:0}.simple-row-divider-btn{border:none;padding:0;cursor:pointer;background:transparent}.simple-row-divider-btn:hover,.simple-row-divider-btn:focus-visible{background:#ee711814}.simple-row-detail{margin-left:.6rem;flex-shrink:0}.simple-row-actions{display:flex;align-items:center;gap:.7rem;flex-shrink:0}.simple-swatch-btn{display:flex;flex-direction:column;align-items:center;gap:.2rem;border:none;background:transparent;padding:0;cursor:pointer}.simple-swatch-btn .color-group-swatch{width:108px;height:26px}.simple-expand-btn{border:1px solid #1b1c15;background:#fff;color:#1b1c15;font-size:.82rem;font-weight:600;padding:.25rem .6rem;border-radius:999px;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}.simple-expand-btn:hover{transform:translateY(-1px);box-shadow:0 6px 12px #0000001f;background:#f8f8f8}.simple-sublist{margin-top:0;padding-left:.6rem;padding-bottom:.4rem;border-left:2px solid #ee7218;display:flex;flex-direction:column;gap:.4rem;max-height:0;opacity:0;overflow:hidden;transform:translateY(-4px);transition:max-height .36s ease,opacity .26s ease,transform .3s ease,margin-top .3s ease;pointer-events:none}.simple-sublist.is-open{max-height:800px;opacity:1;transform:translateY(0);margin-top:.35rem;pointer-events:auto}.simple-sublist.is-open .simple-subrow{animation:subrow-in .26s ease}.simple-subrow{padding:.15rem 0}.simple-subrow .color-element-swatch{width:108px;height:26px}.simple-subrow.is-hidden .simple-row-title{opacity:.55;text-decoration:line-through}.simple-subrow.is-hidden .color-element-swatch{opacity:.4}.simple-subrow.is-hidden .motif-visibility-btn{opacity:1}.color-group-list{display:flex;flex-direction:column;gap:.9rem;animation:panel-in .22s ease}.color-group-card{border:1px solid #e5e7eb;border-radius:12px;padding:.75rem;background:#fff;display:flex;flex-direction:column;gap:.6rem}.color-group-item{display:flex;flex-direction:column;align-items:center;gap:.35rem;border:none;padding:.15rem 0;background:transparent;text-align:center;cursor:pointer}.color-group-name{font-size:.9rem;font-weight:700;color:#1b1c15;text-align:center;min-height:2.4em;display:flex;align-items:center;justify-content:center}.color-group-swatch{width:100%;height:18px;border-radius:999px;border:1px solid #1b1c15;background:#fff}.color-group-swatch.is-light{border-color:#111}.color-group-swatch.is-compact{width:100%}.color-group-meta{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.02em;color:#6b7280;text-align:center}.color-panel-title{display:inline-flex;align-items:center;gap:.6rem}.color-group-actions-row{display:flex;align-items:center;justify-content:center;gap:.5rem}.color-group-trigger{display:inline-flex;flex-direction:column;align-items:center;gap:.25rem;border:none;background:transparent;padding:0;cursor:pointer;width:min(220px,100%)}.group-expand-btn{display:block;border:1px dashed #1b1c15;background:#fff;color:#1b1c15;border-radius:10px;padding:.7rem .8rem;font-size:.85rem;font-weight:700;cursor:pointer;align-self:center;width:min(90%,320px);margin:0 auto;animation:panel-in .22s ease}.group-expand-btn.group-expand-inline{width:min(90%,360px);padding:.55rem .8rem;font-size:.82rem}.color-element-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;animation:panel-in .22s ease}.color-element-item{display:flex;flex-direction:column;align-items:center;gap:.35rem;border:none;padding:.15rem 0;background:transparent;text-align:center;cursor:default}button.color-element-item{cursor:pointer}.color-element-item.is-hidden .color-element-name{opacity:.55;text-decoration:line-through}.color-element-item.is-hidden .color-element-swatch{opacity:.45}.color-element-item.is-hidden .motif-visibility-btn{opacity:1}.motif-element-actions{display:flex;align-items:center;gap:.4rem;width:100%;justify-content:center}.motif-element-actions .color-element-swatch{flex:1;width:auto;min-width:0}.color-element-name{font-size:.85rem;font-weight:600;color:#1b1c15;text-align:center;min-height:2.4em;display:flex;align-items:center;justify-content:center}.clamp-text{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;line-height:1.2}.color-element-swatch{width:100%;height:18px;border-radius:999px;border:1px solid #1b1c15;background:#fff;padding:0;display:block;cursor:pointer}.color-element-swatch.is-light{border-color:#111}.motif-visibility-btn{border:1px solid #1b1c15;background:transparent;border-radius:999px;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;padding:0;cursor:pointer}.motif-visibility-btn img{width:12px;height:12px;display:block}.material-group{display:flex;flex-direction:column;gap:.5rem;padding:.7rem;border:1px solid #000000;border-radius:12px;background:#fff}.material-group-list{display:flex;flex-direction:column;gap:.6rem}.material-group-button{width:100%;text-align:left;cursor:pointer;align-items:center;justify-content:space-between;flex-direction:row}.material-group-chevron{font-size:1.2rem;color:#f97316}.material-group-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding-bottom:.5rem;margin-bottom:.5rem;border-bottom:1px solid #f97316}.color-panel-header{display:flex;align-items:center;gap:.75rem;justify-content:space-between;position:sticky;top:0;z-index:2;background:#fff;padding:.2rem 0 .6rem;margin-bottom:.75rem;border-bottom:1px solid #e5e7eb}.color-picker-inline{display:flex;flex-direction:column;flex:1;height:100%;max-height:100%;min-height:0;border:none;border-radius:0;padding:0;background:#fff;overflow:hidden;-webkit-overflow-scrolling:touch;animation:panel-in .22s ease}.color-picker-inline .color-picker-body{flex:1;min-height:0;height:100%;max-height:100%;overflow-y:auto;padding:.6rem 0 0}.maring-left-right{margin-left:1rem;margin-right:1rem}.material-color-trigger{min-width:74px;justify-content:center;padding:.65rem .7rem}.material-color-trigger.is-disabled{display:inline-flex;align-items:center;justify-content:center;min-width:74px;padding:.65rem .7rem;border:1px dashed #cbd5f5;border-radius:999px;font-size:.75rem;font-weight:600;color:#64748b;background:#f8fafc}.material-group-title{font-size:.9rem;font-weight:700;color:#1b1c15}.material-elements{display:grid;grid-template-columns:1fr;gap:.45rem}.material-group-detail{animation:panel-in .22s ease}.motif-panel{display:flex;flex-direction:column;gap:.6rem}.motif-visibility-title{font-size:.8rem;font-weight:600;color:#1b1c15;margin-top:.2rem}.motif-design-color{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.2rem 0 .8rem;border-bottom:1px solid #e5e7eb;margin-bottom:.4rem}.motif-design-label{font-size:.9rem;font-weight:700;color:#1b1c15}.motif-design-trigger{display:inline-flex;flex-direction:column;align-items:center;gap:.25rem;border:none;background:transparent;padding:0;cursor:pointer;width:auto}.motif-design-trigger .color-group-swatch{width:72px;height:14px}.motif-group-actions{display:inline-flex;align-items:center;gap:.4rem;width:100%;justify-content:center}.motif-zone-subtitle{font-size:.8rem;font-weight:600;color:#6b7280;text-align:center}.motif-group{border:1px solid #e5e7eb;border-radius:12px;padding:.7rem;background:#fff;display:flex;flex-direction:column;gap:.6rem}.motif-materials{display:flex;flex-direction:column;gap:.6rem}.motif-material-group{display:flex;flex-direction:column;gap:.4rem;padding:.5rem;border:1px dashed #d1d5db;border-radius:10px;background:#fafafa}.motif-material-title{font-size:.85rem;font-weight:600;color:#1b1c15;display:flex;align-items:center;justify-content:space-between;gap:.6rem}.motif-material-title .material-color-trigger{min-width:64px;padding:.45rem .6rem}.motif-material-title .color-preview{width:32px;height:24px}.motif-material-items{display:flex;flex-wrap:wrap;gap:.5rem .75rem}.motif-material-items .design-zone{gap:.5rem}.motif-modal-overlay{position:absolute;inset:0;z-index:21;display:flex;align-items:center;justify-content:center;padding:1rem}.motif-modal-panel{position:relative;z-index:1;width:min(520px,100%);max-height:calc(100% - 2rem);display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid #1b1c15;border-radius:14px;padding:0;box-shadow:0 18px 40px #00000040}.motif-modal-panel .color-picker-header{margin-bottom:0;padding:1rem;border-bottom:1px solid #e5e7eb;border-radius:14px 14px 0 0;position:sticky;top:0;z-index:3;background:#fff}.motif-modal-body{padding:1rem;overflow:auto;flex:1}.material-element{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.45rem .6rem;border:1px dashed #d1d5db;border-radius:10px;background:#fafafa;flex-wrap:wrap}.color-picker-overlay{position:absolute;top:0;left:0;right:0;height:100%;z-index:23;display:flex;align-items:center;justify-content:center;padding:1rem;contain:paint}.model-modal-overlay{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:1rem}.model-modal-panel{position:relative;z-index:1;width:min(420px,100%);max-height:80vh;background:#fff;border:1px solid #1b1c15;border-radius:14px;padding:0;box-shadow:0 18px 40px #00000040;overflow:auto;animation:panel-in .22s ease}.model-modal-panel .color-picker-header{margin-bottom:0;padding:1rem;border-bottom:1px solid #e5e7eb;border-radius:14px 14px 0 0}.model-modal-body{padding:1rem}.model-list{display:flex;flex-direction:column;gap:.6rem}.model-group{display:flex;flex-direction:column;gap:.4rem}.model-group-toggle{display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.45rem 0;border:none;border-radius:0;background:transparent;font-weight:700;cursor:pointer;color:#1b1c15}.model-group-bar{border-bottom:1px solid rgba(27,28,21,.2)}.model-group-title{font-weight:700}.model-group-chevron{font-size:1.1rem;color:#ee7218}.model-group-list{display:flex;flex-direction:column;gap:.5rem;padding-left:.9rem;margin-left:.4rem;border-left:2px solid rgba(238,113,24,.35)}.model-item{border:none;background:transparent;border-radius:0;padding:.45rem 0;font-size:.82rem;font-weight:400;color:#1b1c15;cursor:pointer;text-align:left}.model-item-bar{border-bottom:1px solid rgba(27,28,21,.12)}.model-item.active{color:#ee7218}.color-picker-backdrop{position:absolute;inset:0;background:#00000059;border:none;padding:0;cursor:pointer;animation:fade-in .18s ease}.color-picker-panel{position:relative;z-index:1;width:min(520px,100%);max-height:calc(100% - 2rem);background:#fff;border:1px solid #1b1c15;border-radius:14px;padding:0;box-shadow:0 18px 40px #00000040;display:flex;flex-direction:column;overflow:hidden;contain:content;animation:panel-in .22s ease}.color-picker-panel .color-picker-header{margin-bottom:0;padding:1rem;border-bottom:1px solid #e5e7eb;border-radius:14px 14px 0 0;position:relative;z-index:2;background:#fff;width:100%;box-sizing:border-box}.color-picker-body{padding-bottom:1rem;overflow:auto;flex:1;min-height:0}.color-picker-panel *{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}.color-picker-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.color-picker-header.outside-panel,.gradient-mobile-subtabs{display:none}.color-picker-back-btn{border:1px solid #d1d5db;background:#fff;color:var(--text-main);font-weight:600;font-size:.85rem;display:inline-flex;align-items:center;gap:.35rem;cursor:pointer;padding:.35rem .6rem;border-radius:8px}.color-picker-back-btn img{width:16px;height:16px;display:block}.color-picker-panel .color-picker-header,.color-picker-inline .color-picker-header,.motif-modal-panel .color-picker-header,.text-edit-panel .color-picker-header{margin-bottom:0;padding:1rem;border-bottom:1px solid #e5e7eb;border-radius:14px 14px 0 0;position:sticky;top:0;z-index:3;background:#fff;width:100%;box-sizing:border-box}.color-picker-tabs{display:flex;width:100%;gap:0;margin:0 0 .75rem}.color-picker-tabs .tab-btn{font-size:.8rem;padding:.4rem .5rem;flex:1;border-radius:0}.color-picker-tabs .tab-btn:disabled{opacity:.4;cursor:not-allowed;border-color:#cbd5f5;color:#94a3b8}.gradient-note{font-size:.72rem;font-weight:600;color:#6b7280;text-align:center;margin:.1rem 0 .75rem}.gradient-controls{display:grid;gap:.75rem;margin-bottom:.8rem;font-family:inherit}.gradient-controls.desktop-only{display:grid}.gradient-controls.mobile-only{display:none}.gradient-header-row{display:flex;align-items:center;justify-content:space-between;gap:.8rem}.gradient-preview-card{width:66px;height:66px;border-radius:12px;border:2px solid #3b82f6;background:#fff;display:grid;place-items:center;box-shadow:0 8px 16px #0f172a14}.gradient-preview-box{width:52px;height:52px;border-radius:8px;border:1px solid #e5e7eb;background:#fff}.gradient-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid #e5e7eb;border-radius:10px;overflow:hidden;background:#f8fafc}.gradient-tab{border:none;background:transparent;padding:.55rem .6rem;font-size:.8rem;font-weight:600;color:#6b7280;cursor:pointer}.gradient-tab.is-active{background:#fff;color:#2563eb;box-shadow:inset 0 -2px #2563eb}.gradient-slider-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}.gradient-slider{display:grid;gap:.35rem;font-size:.75rem;font-weight:600;color:#1b1c15;border:1px solid #e5e7eb;border-radius:10px;padding:.45rem .6rem;background:#fff}.gradient-slider input[type=range]{width:100%;accent-color:#2563eb}.gradient-value{text-align:left;color:#6b7280;font-weight:600}.gradient-toggle{margin-bottom:.6rem}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;font-size:.78rem;font-weight:600;color:#1b1c15}.color-list-toggle{display:inline-flex;align-items:center;margin-left:auto;margin-right:.4rem}.color-list-toggle input{display:none}.color-list-toggle span{width:36px;height:20px;border-radius:999px;background:#e5e7eb;position:relative;transition:background .15s ease}.color-list-toggle span:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 2px 4px #0003;transition:transform .15s ease}.color-list-toggle input:checked+span{background:#ee7218}.color-list-toggle input:checked+span:after{transform:translate(16px)}.color-picker-title{font-weight:700;color:#1b1c15;font-size:.95rem}.color-picker-close{border:none;background:#1b1c15;color:#fff;width:28px;height:28px;border-radius:50%;cursor:pointer;font-size:1.1rem;line-height:1}.material-element-name{font-size:.85rem;color:#1b1c15}.material-group-color,.material-element-color{width:44px;height:34px}.color-row{display:flex;flex-direction:column;gap:.5rem;padding:.6rem;border:1px solid #e5e7eb;border-radius:12px;background:#fff}.color-trigger{display:flex;align-items:center;justify-content:space-between;gap:.8rem;border:1px solid #1b1c15;border-radius:10px;padding:.55rem .7rem;background:#fff;color:#1b1c15;font-weight:600;cursor:pointer}.color-preview{width:34px;height:24px;border-radius:6px;border:1px solid #1b1c15}.color-preview.is-light{border-color:#111}.material-color-trigger .color-preview{width:44px;height:32px}.color-preview-mixed{background:linear-gradient(135deg,#fff 0 47%,#1b1c15 48% 52%,#fff 53% 100%),repeating-linear-gradient(45deg,#0000001f 0 6px,#ffffff1f 6px 12px)}.color-trigger.is-mixed{border-style:dashed}.color-popover{border:1px solid #1b1c15;border-radius:12px;padding:.75rem;background:#fff}.two-col-container{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem}.column{display:flex;flex-direction:column;gap:.4rem}.colorrow{display:grid;grid-template-columns:repeat(5,1fr);gap:.35rem}.colorPicker-swatch{width:100%;aspect-ratio:1 / 1;border-radius:6px;border:1px solid rgba(27,28,21,.4);padding:0;cursor:pointer;position:relative}.colorPicker-swatch.currentColor{outline:2px solid #ee7218;outline-offset:1px}.colorPicker-swatch.otherSelected{outline:2px solid #2563eb;outline-offset:1px}.color-ok{position:absolute;inset:0;border-radius:6px;box-shadow:inset 0 0 0 1px #00000026}.color-custom{display:flex;flex-direction:column;align-items:stretch;gap:.75rem;margin-top:.75rem}.color-custom-preview{width:100%;height:46px;border-radius:12px;border:1px solid #1b1c15}.color-custom-controls{display:flex;align-items:center;gap:.75rem}.color-native-picker{display:flex;flex-direction:column;gap:.3rem;font-size:.75rem;font-weight:600;color:#1b1c15}.color-native-picker input[type=color]{width:56px;height:40px;padding:0;border-radius:10px;border:1px solid #cbd5f5;background:#fff;cursor:pointer}.color-hex-field{display:flex;flex-direction:column;gap:.3rem;font-size:.75rem;font-weight:600;color:#1b1c15}.color-hex-field input{width:120px;padding:.4rem .55rem;border-radius:8px;border:1px solid #cbd5f5;font-size:.85rem}.color-eye-btn{min-width:96px}@media(max-width:720px){.color-picker-overlay{align-items:center;justify-content:center;padding:.5rem}.color-picker-panel{width:min(420px,100%);max-height:calc(100% - 1rem);overflow:auto;border-radius:16px 16px 10px 10px}.color-picker-panel .color-picker-header{border-radius:16px 16px 0 0}.color-custom-controls{flex-wrap:wrap}}@media(pointer:coarse){.color-eye-btn{display:none}}.media-actions{display:flex;flex-direction:column;gap:.75rem}.config-section{background:#fff;border:1px solid #e6e2dc;border-radius:16px;padding:1rem;box-shadow:0 14px 26px #00000014;display:flex;flex-direction:column;gap:.8rem}.config-title{font-size:.95rem;font-weight:700;letter-spacing:.02em}.config-hint{font-size:.75rem;color:#7a736a}.config-actions{display:flex;gap:.6rem}.settings-actions{display:flex;flex-direction:column;gap:.6rem}.settings-card-icon{display:none}.config-form{display:flex;flex-direction:column;gap:.6rem}.config-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:#6e675f;font-weight:700}.config-input,.config-select{border:1px solid #d7d2cb;border-radius:10px;padding:.55rem .65rem;font-size:.9rem;background:#fff}.config-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.config-field{display:flex;flex-direction:column;gap:.35rem}.config-color{width:100%;height:40px;border:1px solid #d7d2cb;border-radius:10px;padding:0;background:#fff}.config-color-swatch{width:100%;height:40px;border:2px solid #d7d2cb;border-radius:10px;padding:0;cursor:pointer;box-shadow:inset 0 1px 3px #00000026;transition:border-color .15s ease,box-shadow .15s ease}.config-color-swatch:hover{border-color:#ee7218;box-shadow:0 0 0 3px #ee72182e}.config-range{width:100%;accent-color:#ee7218}.text-form{display:flex;flex-direction:column;gap:.5rem;padding:.75rem;border:1px solid #e5e7eb;border-radius:10px;background:#fff}.text-edit-overlay{position:absolute;top:0;left:0;right:0;height:100%;z-index:22;display:flex;align-items:center;justify-content:center;padding:1rem;contain:paint}.text-edit-panel{position:relative;z-index:1;width:min(420px,100%);max-height:80vh;background:#fff;border:1px solid #1b1c15;border-radius:14px;padding:0;box-shadow:0 18px 40px #00000040;display:flex;flex-direction:column;overflow:hidden;contain:content;animation:panel-in .22s ease}.text-edit-panel .color-picker-header{margin-bottom:0;padding:1rem;border-bottom:1px solid #e5e7eb;border-radius:14px 14px 0 0;position:sticky;top:0;z-index:3;background:#fff;width:100%;box-sizing:border-box}.motif-modal-panel .color-picker-header{position:sticky;top:0;z-index:3;background:#fff;width:100%;box-sizing:border-box}@media(max-width:768px){html,body,#root,.app{height:100%;overflow:hidden}.app-content{flex-direction:column;overflow:hidden}.canvas-container{order:1;flex:1;min-height:0}.color-picker-panel .color-picker-header,.color-picker-inline .color-picker-header,.motif-modal-panel .color-picker-header,.text-edit-panel .color-picker-header{padding:.6rem .75rem}.color-picker-title{font-size:.85rem}.color-picker-close{width:24px;height:24px;font-size:1rem}}.text-edit-body{padding:1rem;overflow:auto;flex:1;display:flex;flex-direction:column;gap:.5rem}.text-form-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;position:sticky;top:0;z-index:2;background:#fff;padding:.2rem 0 .6rem;margin-bottom:.4rem;border-bottom:1px solid #e5e7eb}.hidden-tab-hint{padding:.6rem .75rem;border:1px dashed #1b1c15;border-radius:8px;color:#1b1c15;font-size:.85rem}.edit-title{font-size:.85rem;font-weight:600;color:#1b1c15}.text-input{border:1px solid #ee7218;border-radius:8px;padding:.5rem .6rem;font-size:.9rem;color:#1b1c15;background:#fff}.text-options{display:grid;grid-template-columns:1fr auto;gap:.5rem;align-items:center}.font-picker-trigger{display:flex;align-items:center;justify-content:space-between;gap:.5rem;border:1px solid #1b1c15;border-radius:8px;padding:.45rem .6rem;background:#fff;color:#1b1c15;cursor:pointer;text-align:left}.font-picker-label{font-size:.75rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase}.font-picker-preview{flex:1;text-align:right;font-size:.85rem}.font-picker-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin-top:.5rem}.font-picker-option{border:1px solid #1b1c15;border-radius:10px;padding:.6rem;background:#fff;font-size:.95rem;color:#1b1c15;cursor:pointer;text-align:left;min-height:56px;display:flex;align-items:center}.font-picker-option.is-active{border-color:#ee7218;box-shadow:0 0 0 2px #ee711833}.font-picker-overlay{position:fixed;inset:0;z-index:2200;display:flex;align-items:center;justify-content:center;padding:1rem}.font-picker-modal{position:relative;width:min(640px,100%);max-height:80vh;background:#fff;border:1px solid #1b1c15;border-radius:14px;box-shadow:0 18px 40px #00000040;display:flex;flex-direction:column;overflow:hidden}.font-picker-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.85rem 1rem;border-bottom:1px solid #e5e7eb;background:#fff}.font-picker-title{font-size:.9rem;font-weight:600;color:#1b1c15}.font-picker-body{padding:.85rem 1rem 1rem;overflow:auto;display:flex;flex-direction:column;gap:.6rem}.font-picker-search{border:1px solid #1b1c15;border-radius:10px;padding:.5rem .6rem;font-size:.85rem}.font-picker-body .font-picker-panel{overflow:auto;max-height:50vh;padding-right:.25rem}@media(max-width:768px){.font-picker-modal{width:min(520px,100%);max-height:85vh}.font-picker-panel{grid-template-columns:1fr}}.font-select,.size-input,.color-input{border:1px solid #1b1c15;border-radius:8px;padding:.4rem .5rem;font-size:.85rem;background:#fff;color:#1b1c15}.color-input{padding:0;height:36px}.text-actions{display:flex;align-items:center;gap:.5rem;flex-wrap:nowrap}.text-actions .text-action-value{min-width:110px;text-align:center}.text-stroke-controls{display:grid;grid-template-columns:1fr auto;gap:.5rem;align-items:center}.text-stroke-size{display:grid;grid-template-columns:36px 1fr 36px;gap:.4rem;align-items:center}.text-action-btn{display:inline-flex;align-items:center;justify-content:center;height:36px;font-size:1rem;padding:0}.text-action-value{text-align:center;font-size:.85rem;color:#1b1c15;font-weight:600}.outline-btn{border:1px solid #1b1c15;background:#fff;color:#1b1c15;border-radius:8px;padding:.45rem .5rem;font-size:.85rem;cursor:pointer}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;line-height:1}.icon-btn img{width:20px;height:20px;display:block}.primary-btn,.secondary-btn,.export-btn{border:none;padding:.7rem .9rem;border-radius:999px;font-size:.85rem;font-weight:700;cursor:pointer;letter-spacing:.02em;text-transform:uppercase}.primary-btn{background:#1b1c15;color:#fff;border:1px solid #1b1c15;box-shadow:0 10px 18px #0003}.secondary-btn{background:#fff;color:#1b1c15;border:1px solid #1b1c15}.export-btn{background:#ee7218;color:#fff}.export-btn:disabled{opacity:.6;cursor:not-allowed}.canvas-container canvas{width:100%!important;height:100%!important;display:block}.loading-overlay,.error-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#f0f0f0eb;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#1b1c15;z-index:1000}.loading-spinner{width:72px;height:72px;border:4px solid rgba(238,113,24,.2);border-radius:50%;border-top-color:#ee7218;animation:spin 1s linear infinite;margin-bottom:1rem;position:relative}.loading-logo{width:60px;height:60px;object-fit:contain;animation:pulse-soft 1.6s ease-in-out infinite;position:absolute}@keyframes pulse-soft{0%,to{transform:scale(1);opacity:.85}50%{transform:scale(1.08);opacity:1}}@keyframes intro-logo-move{0%{top:50%;left:50%;transform:translate(-50%,-50%) scale(1.1)}65%{top:50%;left:50%;transform:translate(-50%,-50%) scale(1)}to{top:var(--intro-logo-top);left:var(--intro-logo-left);transform:translate(0) scale(1)}}@keyframes intro-fade{0%{opacity:1}80%{opacity:1}to{opacity:0}}@keyframes intro-shine{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.6;transform:scale(1.1)}}@keyframes creation-feedback-fade{0%{opacity:0}10%{opacity:1}88%{opacity:1}to{opacity:0}}@keyframes creation-feedback-card{0%{opacity:0;transform:translateY(24px) scale(.96);filter:blur(3px)}12%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}88%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}to{opacity:0;transform:translateY(-8px) scale(.99);filter:blur(1px)}}@keyframes creation-feedback-logo{0%,to{transform:translateY(0) rotate(0) scale(1)}50%{transform:translateY(-4px) rotate(-1.5deg) scale(1.045)}}@keyframes creation-feedback-result-in{0%{opacity:.1;transform:translate(58px) scale(.98)}to{opacity:1;transform:translate(0) scale(1)}}@keyframes creation-feedback-links-in{0%{opacity:0;transform:translate(18px)}to{opacity:1;transform:translate(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes panel-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes tab-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes subrow-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.material-group-detail,.tab-content,.color-picker-panel,.color-picker-inline,.color-picker-backdrop,.color-group-list,.group-expand-btn,.color-element-list,.creation-feedback-overlay,.creation-feedback-card,.creation-feedback-logo,.creation-feedback-links{animation:none}}.error-message{background:#fff;color:#dc3545;padding:2rem;border-radius:8px;text-align:center;box-shadow:0 10px 30px #0000004d}.error-message h3{margin:0 0 1rem;font-size:1.5rem}.error-message button{background:#dc3545;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:4px;cursor:pointer;font-size:1rem;transition:background-color .2s}.error-message button:hover{background:#c82333}@media(max-width:1200px){.right-panel{width:380px}}@media(max-width:768px){.motif-modal-overlay{padding:.5rem;align-items:stretch}.motif-modal-panel{width:100%;height:calc(100% - 1rem);max-height:calc(100% - 1rem)}.app-content{flex-direction:column}.right-panel{width:100%;height:250px;max-height:250px;min-height:250px;border:none;border-top:1px solid rgba(255,255,255,.2);order:2;margin-top:auto}.canvas-container{order:1;height:calc(var(--app-height, 100vh) - 250px)}.app-logo{width:160px}.product-switcher{top:12px;right:12px}.menu-switcher{top:auto;right:12px;bottom:12px}.quick-menu{top:auto;bottom:52px}.product-switcher-btn{font-size:.85rem;padding:.45rem .6rem}.product-switcher-name{display:none}.intro-overlay{--intro-logo-size: 160px}.media-actions .primary-btn,.media-actions .secondary-btn,.media-actions .outline-btn{padding:.6rem .7rem;font-size:.9rem}.media-actions{flex-direction:row}.media-actions .primary-btn,.media-actions .secondary-btn,.media-actions .outline-btn{flex:1}.color-group-list{gap:.7rem}.color-element-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}.simple-row-title{font-size:.98rem}.simple-subrow .simple-row-title{font-size:.84rem}.simple-expand-btn{font-size:.84rem;padding:.3rem .7rem}.simple-swatch-btn .color-group-swatch,.motif-design-trigger .color-group-swatch,.simple-subrow .color-element-swatch{width:92px;height:24px}.simple-row-divider{margin-left:.45rem;margin-right:0}.simple-row-detail{margin-left:.45rem}.design-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem}.design-card{flex-direction:column;align-items:center;gap:.35rem;padding:.35rem}.design-card img{width:100%;aspect-ratio:1 / 1;height:auto;object-fit:cover;border-radius:6px}.design-card span{font-size:.7rem;text-align:center;line-height:1.1;display:-webkit-box;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.tab-btn{font-size:.6rem;padding:.6rem .25rem;letter-spacing:.06em}.config-row{grid-template-columns:1fr}.color-group-name,.color-element-name,.material-group-title{font-size:.9rem;font-weight:700}}.tab-content::-webkit-scrollbar{width:6px}.tab-content::-webkit-scrollbar-track{background:#0000001a;border-radius:3px}.tab-content::-webkit-scrollbar-thumb{background:#0000004d;border-radius:3px}.tab-content::-webkit-scrollbar-thumb:hover{background:#00000080}:root{--accent: #1f6fff;--accent-soft: #e6efff;--panel-bg: #ffffff;--panel-muted: #f4f6f8;--text-main: #1f2937;--text-muted: #6b7280}.app{background:#f4f6f8;font-family:Space Grotesk,Montserrat Alternates,sans-serif;color:var(--text-main)}.mobile-topbar{display:none}.app-content{padding-bottom:0}.canvas-container{background:#f4f6f8}.right-panel{width:520px;background:transparent;border-left:none;box-shadow:none;height:100%}.config-shell{display:flex;height:100%;min-height:0;background:var(--panel-bg);border-left:1px solid #e5e7eb}.config-main{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}.config-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem .75rem;border-bottom:1px solid #e5e7eb;background:#f8fafc}.config-header-title{font-size:1.05rem;font-weight:700}.config-header-subtitle{font-size:.85rem;color:var(--text-muted)}.config-subtabs{display:flex;gap:.5rem;padding:.75rem 1.25rem .5rem;border-bottom:1px solid #e5e7eb;background:#fff;position:sticky;top:0;z-index:6}.config-subtab{border:none;background:transparent;padding:.4rem .75rem;font-size:.85rem;font-weight:600;color:var(--text-muted);border-bottom:2px solid transparent;cursor:pointer;transition:color .16s ease,background .16s ease,border-color .16s ease,transform .16s ease}.config-subtab.is-active{color:var(--accent);border-bottom-color:var(--accent);transform:translateY(-1px)}.action-subtabs{display:flex;align-items:center;justify-content:flex-start;gap:.5rem;flex-wrap:nowrap}.action-subtabs .action-subtab{flex:0 0 auto;border:1px solid var(--accent);background:var(--accent);color:#fff;border-radius:10px;font-size:.82rem;font-weight:700;padding:.45rem .75rem;line-height:1}.action-subtabs .color-picker-back-btn{margin-right:auto}.action-subtab-status{margin-left:auto;font-size:.8rem;font-weight:700;color:var(--text-main);white-space:nowrap}.config-content{flex:1;min-height:0;overflow-y:auto;padding:1rem 1.25rem;background:#fff;animation:panelFadeIn .24s ease}.config-content.is-design-tab{overflow-y:auto;overflow-x:hidden}.config-content.is-design-tab .design-grid{align-content:start}.config-content.is-design-tab .design-grid::-webkit-scrollbar{width:8px}.config-content.is-design-tab .design-grid::-webkit-scrollbar-track{background:#0f172a0f;border-radius:999px}.config-content.is-design-tab .design-grid::-webkit-scrollbar-thumb{background:#0f172a59;border-radius:999px}.config-content::-webkit-scrollbar{width:8px}.config-content::-webkit-scrollbar-track{background:#0f172a0f;border-radius:999px}.config-content::-webkit-scrollbar-thumb{background:#0f172a59;border-radius:999px}.config-content.no-scroll{overflow:hidden}.config-nav{width:115px;border-left:1px solid #e5e7eb;background:#fbfbfd;display:flex;flex-direction:column;align-items:stretch;padding:.6rem .4rem;gap:.25rem}.config-nav-btn{border:none;background:transparent;padding:.5rem .2rem;border-radius:14px;display:flex;flex-direction:column;align-items:center;gap:.35rem;font-size:.68rem;font-weight:600;color:var(--text-muted);cursor:pointer}.config-nav-btn.is-disabled{opacity:.45;cursor:not-allowed}.config-nav-btn.is-active{background:#fff2e6;color:#f97316}.config-nav-icon{width:34px;height:34px;border-radius:12px;background:#eef2f7;display:flex;align-items:center;justify-content:center}.config-nav-btn.is-active .config-nav-icon{background:#ffe6d5}.config-nav-icon img{width:18px;height:18px;display:block}.icon-mirror{transform:scaleX(-1)}.config-nav-label{text-align:center}.config-nav-divider{height:1px;background:#e5e7eb;margin:.35rem .5rem}.config-nav-btn.is-ghost{padding:.35rem .2rem}.config-nav-btn.is-ghost .config-nav-label{display:none}.config-nav-actions{display:flex;align-items:center;justify-content:center;gap:.35rem}.design-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}.design-card{border:1px solid #dbe0e6;border-radius:12px;padding:0;background:#fff;box-shadow:0 6px 16px #0f172a14;aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center}.design-card-active{border-color:var(--accent);box-shadow:0 0 0 2px #1f6fff33}.design-preview{background:#f1f5f9;width:100%;height:100%;border-radius:10px;overflow:hidden}.design-card .design-preview img,.design-card .design-preview-img{width:100%;height:100%;max-height:none;object-fit:cover}.design-card span{display:none}.gradient-banner{padding:.6rem .75rem;border-radius:10px;background:#eef6ff;color:#1d4ed8;font-size:.8rem;font-weight:600}.color-chooser-header{display:flex;flex-direction:column;gap:.2rem;margin-bottom:.6rem}.color-chooser-title{font-size:1rem;font-weight:700}.color-chooser-subtitle{font-size:.82rem;color:var(--text-muted)}.color-subtabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin-bottom:.75rem}.color-subtab{border:1px solid #e5e7eb;background:#fff;border-radius:10px;padding:.5rem .65rem;font-size:.85rem;font-weight:600;color:var(--text-muted);cursor:pointer}.color-subtab.is-active{border-color:var(--accent);color:var(--accent);background:#f0f6ff}.color-list{display:flex;flex-direction:column;gap:.5rem}.color-list-section{font-size:.75rem;font-weight:700;color:#94a3b8;text-transform:uppercase;letter-spacing:.08em;margin-top:.4rem}.color-list-divider{width:100%;height:1px;background:#e5e7eb;margin-bottom:.2rem}.color-list-row{border:1px solid #e5e7eb;background:#fff;border-radius:10px;padding:.6rem .85rem;display:flex;align-items:center;gap:.7rem;cursor:pointer;text-align:left}.color-list-dot{width:20px;height:20px;border-radius:50%;border:1px solid rgba(0,0,0,.08)}.color-list-dot.is-light{border-color:#111}.color-list-label{flex:1;font-size:.9rem;font-weight:600;color:var(--text-main)}.color-list-chevron{font-size:1.2rem;color:#94a3b8}.motif-panel-layout{display:flex;flex-direction:column;gap:1rem}.motif-targets{margin-bottom:.25rem}.motif-target-row.is-active{border-color:var(--accent);box-shadow:0 0 0 1px #2563eb26}.motif-target-row.is-disabled{opacity:.6;cursor:not-allowed}.config-section{border-radius:12px;border:1px solid #e5e7eb;box-shadow:0 6px 16px #0f172a0f}.layer-editor-panel{display:flex;flex-direction:column;gap:.7rem}.layer-editor-row{display:flex;align-items:center;justify-content:space-between;gap:.7rem}.layer-editor-label{font-size:.82rem;font-weight:700;color:var(--text-main)}.layer-editor-actions{display:flex;align-items:center;gap:.5rem}.layer-icon-btn{width:40px;height:40px;padding:0;display:inline-flex;align-items:center;justify-content:center}.layer-icon-btn img{width:18px;height:18px;display:block}.layer-icon-flip-vertical{transform:scaleX(-1)}.layer-delete-icon-btn{width:40px;height:40px;padding:0;display:inline-flex;align-items:center;justify-content:center}.layer-delete-icon-btn img{width:18px;height:18px;display:block}.layer-editor-metrics{font-size:.82rem;color:var(--text-muted);display:flex;flex-direction:column;gap:.2rem}.danger-btn{border-color:#ef4444;color:#ef4444}.desktop-only{display:block}.primary-btn{background:var(--accent);border-color:var(--accent);color:#fff}.secondary-btn{border-color:#d1d5db}.bottom-bar{position:fixed;left:0;right:0;bottom:0;height:64px;background:#fff;border-top:1px solid #e5e7eb;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0 1.5rem;z-index:100}.bottom-mobile{display:none}.bottom-left{display:flex;gap:.6rem;align-items:center}.bottom-btn{border:1px solid #ee7218;background:#ee7218;border-radius:8px;padding:.45rem .7rem;font-size:.8rem;font-weight:600;display:inline-flex;align-items:center;gap:.45rem;color:#fff;cursor:pointer}.bottom-btn:hover{background:#d4600f;border-color:#d4600f}.bottom-btn img{width:16px;height:16px}.bottom-right{display:flex;align-items:center;justify-content:flex-end;gap:.8rem}.bottom-cta{background:#0b6cff;color:#fff;border:none;border-radius:8px;padding:.7rem 1.1rem;font-weight:700;cursor:pointer}@media(max-width:1200px){.right-panel{width:440px}}@media(max-width:900px){.bottom-bar{flex-direction:column;height:auto;padding:.75rem 1rem}.bottom-left{flex-wrap:wrap;justify-content:center}.bottom-right{justify-content:center;flex-wrap:wrap}}@media(max-width:768px){.app{--mobile-card-size: 68px;--mobile-panel-height: 72;--mobile-subtabs-height: 44px;--mobile-content-height: 72px}.app-content{flex-direction:column}.canvas-container{order:1;flex:1;height:auto}.config-header,.color-chooser-header,.config-hint,.gradient-banner{display:none}.mobile-topbar{display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.6rem .8rem;background:#fff;border-bottom:1px solid #e5e7eb;position:sticky;top:0;z-index:40}.mobile-topbar-logo{height:32px;width:auto;display:block}.mobile-topbar-share{border:1px solid #d1d5db;background:#fff;border-radius:8px;padding:.4rem .6rem;font-size:.75rem;font-weight:600;display:inline-flex;align-items:center;gap:.4rem}.mobile-topbar-share img{width:16px;height:16px}.mobile-topbar-actions{display:none;align-items:center;gap:.4rem}.mobile-topbar-icon{width:32px;height:32px;border-radius:50%;border:1px solid #e5e7eb;background:#fff;display:inline-flex;align-items:center;justify-content:center;padding:0}.mobile-topbar-icon img{width:16px;height:16px}.right-panel{width:100%;flex:0 0 auto;height:auto;min-height:0;max-height:none;background:#fff;border-top:1px solid #e5e7eb;z-index:120;margin-bottom:calc(122px + env(safe-area-inset-bottom))}.canvas-container{flex:1;min-height:0}.config-shell{flex-direction:column;height:auto}.config-main{flex:0 0 auto;height:auto}.config-nav{width:100%;border-left:none;border-top:1px solid #e5e7eb;flex-direction:row;align-items:stretch;overflow:visible;padding:.3rem .5rem;gap:.2rem;height:70px;background:#fff;position:fixed;left:0;right:0;bottom:calc(52px + env(safe-area-inset-bottom));z-index:220}.config-nav-btn{flex:1;min-width:0;padding:.3rem .15rem;gap:.22rem;font-size:.6rem;border-radius:10px}.config-nav-icon{width:28px;height:28px;border-radius:8px}.config-nav-icon img{width:16px;height:16px}.config-nav-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;font-size:.6rem}.config-nav-actions,.config-nav-divider{display:none}.config-subtabs{position:static;top:auto;z-index:1;padding:0 .7rem;height:var(--mobile-subtabs-height);display:flex;align-items:center;overflow-x:auto;overflow-y:hidden}.config-subtabs.action-subtabs{display:flex;position:static;bottom:auto;z-index:1;padding:0 .7rem;background:#fff;border-bottom:1px solid #e5e7eb;height:var(--mobile-subtabs-height);align-items:center;justify-content:flex-start;flex-wrap:nowrap}.config-subtabs.action-subtabs .action-subtab{flex:0 0 auto;border:1px solid var(--accent);background:var(--accent);color:#fff;border-radius:10px;font-size:.82rem;font-weight:700;padding:.45rem .75rem;line-height:1}.config-subtabs.action-subtabs .action-subtab-status{margin-left:auto;font-size:.78rem}.config-subtabs.color-picker-header{position:static;padding:0 .8rem;background:#fff;border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;height:var(--mobile-subtabs-height)}.config-subtabs.color-picker-header .color-picker-title{position:absolute;left:50%;transform:translate(-50%);margin:0;text-align:center;width:60%;font-weight:700;pointer-events:none;z-index:1}.config-subtabs.color-picker-header .color-picker-back-btn{z-index:2}.gradient-toggle-inline{z-index:2;margin-left:auto;pointer-events:auto}.gradient-toggle-inline input{pointer-events:auto}.config-subtabs.color-picker-header.gradient-header{bottom:auto}.config-subtabs.gradient-mobile-subtabs{display:flex;position:static;bottom:auto;z-index:1;background:#fff;border-bottom:1px solid #e5e7eb;height:var(--mobile-subtabs-height);align-items:stretch}.config-subtabs.gradient-mobile-subtabs .config-subtab{flex:1;font-size:.7rem;padding:.35rem .4rem;height:100%;display:flex;align-items:center;justify-content:center}.color-picker-header.in-panel{display:none}.color-picker-header.outside-panel{display:flex}.gradient-controls.desktop-only{display:none}.gradient-controls.mobile-only{display:block}.gradient-controls.mobile-only .gradient-slider-row{gap:.35rem}.gradient-controls.mobile-only .gradient-slider{font-size:.7rem}.gradient-controls.mobile-only input[type=range]{height:22px}.gradient-controls.mobile-only .gradient-value{font-size:.65rem}.gradient-preview-card,.gradient-tabs{display:none}.gradient-toggle-inline{display:inline-flex;align-items:center;gap:.35rem;font-size:.75rem;font-weight:600;color:var(--text-main)}.gradient-toggle-inline input{width:36px;height:20px}.config-content{padding:0 .6rem;flex:0 0 var(--mobile-content-height);overflow-y:auto;overflow-x:hidden;height:var(--mobile-content-height);max-height:var(--mobile-content-height);-webkit-overflow-scrolling:touch;touch-action:pan-y}.config-content.is-design-tab{overflow:hidden}.bottom-bar{position:fixed;left:0;right:0;height:calc(52px + env(safe-area-inset-bottom));padding:0;align-items:stretch;flex-direction:row;z-index:200}.color-list{flex-direction:row;overflow-x:auto;overflow-y:hidden;gap:.4rem;padding:0;height:var(--mobile-card-size);-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;align-items:center}.color-list-row{flex:0 0 auto;width:var(--mobile-card-size);height:var(--mobile-card-size);flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:.35rem;gap:.35rem;scroll-snap-align:start}.color-list-divider{width:1px;height:calc(var(--mobile-card-size) - 20px);margin:0 .35rem;align-self:center}.design-grid{display:flex;flex-direction:row;overflow-x:auto;overflow-y:hidden;gap:.6rem;padding:0;-webkit-overflow-scrolling:touch;align-items:center;touch-action:pan-x;overscroll-behavior-x:contain;scroll-snap-type:x proximity}.config-content.is-design-tab .design-grid{flex:0 0 auto;min-height:auto;overflow-x:auto;overflow-y:hidden;padding-right:0}.design-card{flex:0 0 var(--mobile-card-size);height:var(--mobile-card-size)}.design-preview{height:100%}.two-col-container{display:flex;gap:.5rem;overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;align-items:center;height:100%}.column{display:flex;flex-direction:row;gap:.35rem;flex-wrap:nowrap}.colorrow{display:contents}.colorPicker-swatch{flex:0 0 30px}.bottom-left,.bottom-right{display:none}.bottom-mobile{display:grid;grid-template-columns:1fr 1fr;width:100%;height:100%}.bottom-mobile-btn,.bottom-mobile-cta{border:none;font-weight:700;font-size:.85rem;display:flex;align-items:center;justify-content:center}.bottom-mobile-btn{background:#fff;color:#111827;border-right:1px solid #e5e7eb}.bottom-mobile-cta{background:#111;color:#fff}.app-content{padding-bottom:0}.app-logo,.product-switcher,.menu-switcher{display:none}.color-subtabs{grid-template-columns:repeat(2,1fr);gap:0;border:1px solid #e5e7eb;border-radius:10px;overflow:hidden}.color-subtab{border:none;border-radius:0}.color-subtab.is-active{border-color:transparent}.color-list-label{font-size:.6rem}.color-list-dot{width:14px;height:14px}.color-list-chevron,.color-list-toggle,.color-list-section,.color-custom-preview,.color-native-picker,.color-hex-field{display:none}.config-section{padding:.75rem;border-radius:10px}.config-title{font-size:.95rem}.config-form{gap:.5rem}.config-input,.config-select{font-size:.85rem;padding:.5rem .6rem}.config-actions{flex-direction:column}.config-actions button,.config-form .primary-btn,.config-form .secondary-btn{width:100%}.settings-actions{display:flex;flex-direction:row;gap:.4rem}.settings-card-btn{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem;padding:.7rem .25rem;border-radius:12px;font-size:.62rem;font-weight:700;text-transform:none;letter-spacing:0;text-align:center;box-shadow:none}.settings-card-btn span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;line-height:1.2}.settings-card-icon{display:block;width:22px;height:22px;flex-shrink:0;opacity:.75}.primary-btn.settings-card-btn{background:#fff2e6;color:#c45c0a;border:1px solid #fcd9b6;box-shadow:none}.primary-btn.settings-card-btn .settings-card-icon{opacity:.9}.desktop-only{display:none}.layer-editor-row{width:100%}.layer-editor-label{display:none}.layer-editor-actions{width:100%;gap:.5rem;flex-wrap:nowrap}.layer-icon-btn{flex:1 1 0;width:auto;height:40px;justify-content:center}.layer-delete-icon-btn{width:100%}.layer-delete-icon-btn img{width:18px;height:18px}.logo-editor-panel{display:flex;flex-direction:row;flex-wrap:nowrap;gap:.5rem;align-items:center;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.logo-editor-panel .layer-editor-row{display:flex;width:auto;flex:0 0 auto;align-items:center}.logo-editor-panel .layer-editor-row+.layer-editor-row{margin-left:.4rem;padding-left:.6rem;border-left:1px solid #d1d5db}.logo-editor-panel .layer-editor-actions{display:flex;width:auto;flex-wrap:nowrap}.logo-editor-panel .layer-icon-btn,.logo-editor-panel .layer-delete-icon-btn{flex:0 0 40px;width:40px;min-width:40px;height:40px}.logo-editor-panel .layer-delete-icon-btn{margin-left:auto;background:#ef4444;border-color:#ef4444;color:#fff}.logo-editor-panel .layer-delete-icon-btn img{filter:brightness(0) invert(1)}}.right-panel.is-modal-open .config-content{overflow-y:auto}.right-panel.is-modal-open .config-content.no-scroll{overflow:hidden}@media(min-width:769px){.app-content{height:calc(var(--app-height, 100vh) - 64px);max-height:calc(var(--app-height, 100vh) - 64px)}}@keyframes panelFadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.tuto-overlay{position:fixed;inset:0;z-index:4000;pointer-events:none;background:transparent;opacity:0;transition:opacity .3s ease}.tuto-overlay--visible{opacity:1}.tuto-svg-mask{position:absolute;top:0;left:0;pointer-events:none}.tuto-card-skip{display:block;width:100%;margin-top:.6rem;background:none;border:none;color:#ffffff52;font-size:.74rem;font-weight:600;font-family:inherit;text-align:center;cursor:pointer;padding:.15rem 0;transition:color .15s}.tuto-card-skip:hover{color:#ffffffa6}.tuto-dots{position:fixed;bottom:80px;left:50%;transform:translate(-50%);z-index:4010;pointer-events:all;display:flex;gap:7px;align-items:center}.tuto-dot{width:8px;height:8px;border-radius:50%;border:none;background:#ffffff47;cursor:pointer;padding:0;transition:background .2s,transform .2s,width .2s}.tuto-dot--done{background:#ef721880}.tuto-dot--active{background:#ef7218;width:22px;border-radius:4px}.tuto-card{position:fixed;width:300px;pointer-events:all;z-index:4010;background:linear-gradient(150deg,#1d1d1d,#141414);border:1px solid rgba(239,114,24,.5);border-radius:14px;padding:1.2rem 1.3rem 1rem;box-shadow:0 0 0 1px #ffffff0a,0 20px 48px #0000008c,0 0 32px #ef72181a;animation:tuto-card-in .28s cubic-bezier(.22,1,.36,1) forwards}@keyframes tuto-card-in{0%{opacity:0;transform:scale(.93) translateY(6px)}to{opacity:1;transform:scale(1) translateY(0)}}.tuto-card--centered{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)!important;width:min(92vw,380px);text-align:center;animation:tuto-card-center-in .36s cubic-bezier(.22,1,.36,1) forwards}@keyframes tuto-card-center-in{0%{opacity:0;transform:translate(-50%,-46%) scale(.94)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.tuto-card--centered .tuto-card-actions{justify-content:center}.tuto-card-step{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#ef7218;margin-bottom:.5rem}.tuto-card-title{margin:0 0 .5rem;font-size:1rem;font-weight:800;color:#fff;line-height:1.25;letter-spacing:-.01em}.tuto-card-desc{margin:0 0 1rem;font-size:.82rem;color:#ffffff8c;line-height:1.55}.tuto-card-actions{display:flex;align-items:center;gap:.5rem}.tuto-btn{border-radius:8px;padding:.5rem .85rem;font-size:.82rem;font-weight:700;cursor:pointer;border:none;font-family:inherit;transition:filter .15s,transform .1s}.tuto-btn:active{transform:scale(.96)}.tuto-btn--primary{background:linear-gradient(135deg,#ef7218,#d45f0a);color:#fff;flex:1;box-shadow:0 3px 12px #ef721859}.tuto-btn--primary:hover{filter:brightness(1.1)}.tuto-btn--ghost{background:#ffffff14;color:#ffffff8c;border:1px solid rgba(255,255,255,.14)}.tuto-btn--ghost:hover{background:#ffffff24;color:#fff}@media(max-width:768px){.tuto-card{width:min(calc(100vw - 24px),300px);max-height:calc(100vh - 150px - env(safe-area-inset-bottom));overflow-y:auto}.tuto-dots{bottom:calc(250px + env(safe-area-inset-bottom))}}@media(max-width:520px){.tuto-card{width:calc(100vw - 24px);left:12px!important;right:12px!important;bottom:calc(250px + env(safe-area-inset-bottom))!important;top:auto!important}.tuto-card--centered{inset:50% auto auto 50%!important;transform:translate(-50%,-50%)!important;width:min(calc(100vw - 32px),380px)!important}.tuto-dots{bottom:calc(100px + env(safe-area-inset-bottom))}}.export-modal-overlay{position:fixed;inset:0;z-index:3000;display:flex;align-items:center;justify-content:center;padding:1rem;background:radial-gradient(circle at 20% 10%,rgba(239,114,24,.18),transparent 55%),radial-gradient(circle at 80% 80%,rgba(255,255,255,.06),transparent 55%),linear-gradient(135deg,#0a0a0af5,#161616fa);animation:export-modal-bg-in .28s ease forwards}@keyframes export-modal-bg-in{0%{opacity:0}to{opacity:1}}.export-modal-card{position:relative;width:min(96vw,760px);max-height:90vh;overflow-y:auto;background:linear-gradient(160deg,#1c1c1c,#141414);border:1px solid rgba(239,114,24,.45);border-radius:20px;box-shadow:0 0 0 1px #ffffff0a,0 32px 64px #0000008c,0 0 80px #ef721814;padding:1.6rem 1.8rem 2rem;animation:export-modal-card-in .38s cubic-bezier(.22,1,.36,1) forwards}@keyframes export-modal-card-in{0%{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.export-modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.4rem}.export-modal-logo{height:32px;width:auto;filter:brightness(0) invert(1);opacity:.85}.export-modal-close{width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:#ffffff0f;color:#ffffffb3;font-size:1.15rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}.export-modal-close:hover{background:#ffffff1f;color:#fff}.export-modal-hero{margin-bottom:1.5rem}.export-modal-hero-badge{display:inline-block;background:#ef72182e;color:#ef7218;border:1px solid rgba(239,114,24,.5);border-radius:999px;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:.25rem .7rem;margin-bottom:.7rem}.export-modal-hero-badge--contact{background:#ffffff14;color:#ffffffa6;border-color:#fff3}.export-modal-title{margin:0 0 .5rem;font-size:clamp(1.3rem,2.8vw,1.7rem);font-weight:800;color:#fff;line-height:1.2;letter-spacing:-.01em}.export-modal-subtitle{margin:0;color:#ffffff8c;font-size:.88rem;line-height:1.5;max-width:520px}.export-modal-captures{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin-bottom:1.8rem}.export-modal-capture{display:flex;flex-direction:column;align-items:center;gap:.35rem;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:10px;overflow:hidden;padding:.4rem .4rem .5rem;transition:border-color .15s}.export-modal-capture:hover{border-color:#ef721866}.export-modal-capture img{width:100%;aspect-ratio:1;object-fit:contain;border-radius:6px;background:#f8f8f6;display:block}.export-modal-capture-label{font-size:.7rem;font-weight:600;color:#ffffff73;letter-spacing:.05em;text-transform:uppercase}.export-modal-actions{display:flex;gap:.75rem;margin-bottom:.75rem}.export-modal-hint{margin:0;font-size:.76rem;color:#ffffff4d;text-align:center;line-height:1.45}.export-modal-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:10px;padding:.75rem 1rem;font-size:.88rem;font-weight:700;cursor:pointer;transition:filter .15s,transform .12s,box-shadow .15s;border:none;white-space:nowrap}.export-modal-btn:active{transform:scale(.97)}.export-modal-btn--primary{background:linear-gradient(135deg,#ef7218,#d45f0a);color:#fff;box-shadow:0 4px 18px #ef721859}.export-modal-btn--primary:hover{filter:brightness(1.08);box-shadow:0 6px 24px #ef721880}.export-modal-btn--secondary{background:#ffffff14;color:#fff;border:1px solid rgba(255,255,255,.22)}.export-modal-btn--secondary:hover{background:#ffffff24;border-color:#ffffff61}.export-modal-btn--ghost{background:transparent;color:#ffffff80;border:1px solid rgba(255,255,255,.12);flex:0 0 auto;padding-left:.8rem;padding-right:.8rem}.export-modal-btn--ghost:hover{color:#fffc;border-color:#ffffff47}.export-modal-btn-icon{display:flex;align-items:center;flex-shrink:0}.export-modal-btn-icon svg{width:17px;height:17px}.export-modal-form{display:flex;flex-direction:column;gap:.9rem}.export-modal-form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.export-modal-field{display:flex;flex-direction:column;gap:.3rem}.export-modal-label{font-size:.78rem;font-weight:600;color:#ffffffa6}.export-modal-optional{font-weight:400;color:#ffffff4d}.export-modal-input{background:#ffffff12;border:1px solid rgba(255,255,255,.16);border-radius:8px;color:#fff;font-size:.88rem;padding:.6rem .75rem;outline:none;font-family:inherit;transition:border-color .15s,background .15s;width:100%;box-sizing:border-box}.export-modal-input::placeholder{color:#ffffff38}.export-modal-input:focus{border-color:#ef7218b3;background:#ffffff1a}.export-modal-textarea{resize:vertical;min-height:80px}.export-modal-error{margin:0;font-size:.8rem;font-weight:600;color:#fca5a5}.export-modal-form-actions{display:flex;align-items:center;justify-content:flex-end;gap:.6rem;margin-top:.25rem}.export-modal-form-actions .export-modal-btn--primary{flex:0 0 auto}.export-modal-state{display:flex;flex-direction:column;align-items:center;text-align:center;padding:2rem 1rem 1.5rem;gap:.8rem}.export-modal-spinner{width:48px;height:48px;border:3px solid rgba(239,114,24,.2);border-top-color:#ef7218;border-radius:50%;animation:export-spinner .75s linear infinite}@keyframes export-spinner{to{transform:rotate(360deg)}}.export-modal-check svg,.export-modal-error-icon svg{width:52px;height:52px}.export-modal-state-title{margin:0;font-size:1.2rem;font-weight:800;color:#fff}.export-modal-state-sub{margin:0;font-size:.86rem;color:#ffffff80;max-width:360px;line-height:1.5}.export-modal-state-actions{display:flex;gap:.6rem;margin-top:.5rem;flex-wrap:wrap;justify-content:center}.export-modal-state-actions .export-modal-btn{flex:0 0 auto}@media(max-width:600px){.export-modal-card{padding:1.2rem 1rem 1.5rem}.export-modal-captures{grid-template-columns:repeat(2,1fr)}.export-modal-actions{flex-direction:column}.export-modal-btn{flex:none;width:100%}.export-modal-form-row{grid-template-columns:1fr}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;--app-height: 100vh;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}@supports (height: 100svh){:root{--app-height: 100svh}}*{box-sizing:border-box}body{margin:0;display:flex;min-width:320px;min-height:var(--app-height);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}#root{width:100%;height:var(--app-height)}.app{width:100%;height:var(--app-height);display:flex;flex-direction:column}.main-content{flex:1;display:flex;overflow:hidden}.viewer-container{flex:1;position:relative;background:#1a1a1a}.controls-panel{width:320px;background:#2a2a2a;border-left:1px solid #444;display:flex;flex-direction:column;overflow-y:auto}.layers-panel{flex:1;padding:16px}.layer-item{background:#333;border-radius:8px;padding:12px;margin-bottom:8px;cursor:pointer;border:2px solid transparent;transition:all .2s ease}.layer-item.active{border-color:#007acc;background:#3a3a3a}.layer-item:hover{background:#3a3a3a}.layer-name{color:#fff;font-size:14px;margin-bottom:4px}.layer-type{color:#ccc;font-size:12px;text-transform:uppercase}.controls-section{padding:16px;border-bottom:1px solid #444}.controls-section h3{color:#fff;margin:0 0 12px;font-size:16px}.control-group{margin-bottom:12px}.control-label{display:block;color:#ccc;font-size:12px;margin-bottom:4px;text-transform:uppercase}.control-input{width:100%;padding:8px;background:#333;border:1px solid #555;border-radius:4px;color:#fff;font-size:14px}.control-input:focus{outline:none;border-color:#007acc}.btn{padding:10px 16px;background:#007acc;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:background .2s ease}.btn:hover{background:#0056b3}.btn:disabled{background:#555;cursor:not-allowed}.btn-secondary{background:#666}.btn-secondary:hover{background:#777}.upload-area{border:2px dashed #555;border-radius:8px;padding:20px;text-align:center;margin-bottom:16px;transition:border-color .2s ease;cursor:pointer}.upload-area:hover{border-color:#007acc}.upload-area.dragover{border-color:#007acc;background:#007acc1a}.transform-controls{display:flex;gap:4px;margin-bottom:12px}.transform-btn{flex:1;padding:8px;background:#444;color:#fff;border:1px solid #555;border-radius:4px;cursor:pointer;font-size:12px;text-transform:uppercase;transition:all .2s ease}.transform-btn.active{background:#007acc;border-color:#007acc}.transform-btn:hover{background:#555}.export-section{padding:16px;border-top:1px solid #444}.export-section h3{color:#fff;margin:0 0 12px;font-size:16px}.loading{display:flex;align-items:center;justify-content:center;height:100%;color:#fff}.spinner{width:40px;height:40px;border:4px solid #444;border-top:4px solid #007acc;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error{color:#ff6b6b;background:#ff6b6b1a;padding:12px;border-radius:6px;margin:8px 0;border:1px solid #ff6b6b}.success{color:#51cf66;background:#51cf661a;padding:12px;border-radius:6px;margin:8px 0;border:1px solid #51cf66}
