@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Syne:wght@400;500;600;700;800&display=swap";.app-container{display:flex;flex-direction:column;height:100vh;overflow:hidden;background-color:var(--bg-dark)}@media(max-width:768px){.app-container{height:auto;min-height:100vh;overflow-y:auto}.main-workspace{flex-direction:column-reverse;overflow:visible!important}.sidebar{width:100%!important;border-right:none!important;border-top:1px solid var(--border);overflow:visible!important}.preview-area{min-height:50vh;padding:32px 16px 16px!important;align-items:flex-start!important}.top-nav{padding:0 16px!important}.nav-right .pricing-badge,.nav-right .limits span:not(.text-red):not(.text-white){display:none}}.top-nav{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid var(--border);z-index:10;flex-shrink:0;background:var(--bg-panel)}.nav-left{display:flex;align-items:center;gap:12px}.logo-box{width:32px;height:32px;border-radius:4px;background-color:var(--accent);color:#000;display:flex;align-items:center;justify-content:center}.brand-text{font-family:var(--font-display);font-weight:700;font-size:20px;letter-spacing:-.5px}.nav-right{display:flex;align-items:center;gap:24px;font-size:14px}.limits{display:flex;align-items:center;gap:16px;color:var(--text-muted);font-weight:500}.limit-item{display:flex;align-items:center;gap:8px}.text-white{color:#fff}.text-red{color:#ff4b4b}.pricing-badge{background:#ffffff0d;padding:4px 12px;border-radius:20px;border:1px solid rgba(255,255,255,.1);margin-left:8px}.avatar{width:32px;height:32px;border-radius:50%;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center}.main-workspace{display:flex;flex:1;overflow:hidden}.sidebar{width:420px;border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:10;overflow-y:auto;position:relative;background:var(--bg-panel)}.sidebar-header{padding:24px 24px 0}.sidebar-title{font-family:var(--font-display);font-size:30px;margin-bottom:24px;line-height:1}.tabs{display:flex;padding:4px;background:#ffffff0d;border-radius:12px;border:1px solid rgba(255,255,255,.05);margin-bottom:32px}.tab-btn{flex:1;padding:10px 0;border-radius:8px;font-size:14px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px;background:transparent;color:#fff9;border:none;cursor:pointer;transition:all .2s ease}.tab-btn:hover{color:#fff}.tab-btn.active{background:var(--accent);color:#000;box-shadow:0 0 15px #e5ff004d}.sidebar-content{padding:0 24px 32px;display:flex;flex-direction:column;gap:32px}.section-header{display:flex;align-items:baseline;justify-content:space-between;opacity:.8;margin-bottom:12px}.section-label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.15em;color:var(--accent)}.sub-text{font-size:12px;color:#ffffff80;margin-bottom:8px}.upload-box{border:1px dashed rgba(255,255,255,.2);border-radius:12px;padding:24px;background:#ffffff05;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;cursor:pointer;transition:all .2s ease}.upload-box:hover{border-color:#e5ff0080;background:#ffffff0a}.upload-icon{width:40px;height:40px;border-radius:50%;background:#ffffff0d;display:flex;align-items:center;justify-content:center;color:#fff9;transition:transform .2s}.upload-box:hover .upload-icon{transform:scale(1.1);color:var(--accent)}.upload-text p{font-size:14px;font-weight:500;margin-bottom:4px}.upload-text span{font-size:12px;color:#fff6}.influencer-carousel{display:flex;gap:16px;max-width:100%;overflow-x:auto;padding-bottom:16px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.influencer-carousel::-webkit-scrollbar{display:none}.influencer-carousel .influencer-radio{flex:0 0 160px;scroll-snap-align:start}.inf-card{position:relative;border-radius:12px;overflow:hidden;background:#ffffff0d;border:2px solid transparent;transition:all .2s ease}.influencer-radio input:checked+.inf-card{border-color:var(--accent);box-shadow:0 0 10px #e5ff0033;transform:scale(.98)}.inf-img-wrap{aspect-ratio:3/4;position:relative;overflow:hidden}.inf-img-wrap img{width:100%;height:100%;object-fit:cover;transition:transform .7s}.inf-card:hover img{transform:scale(1.05)}.inf-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.8),transparent,transparent)}.inf-info{position:absolute;bottom:8px;left:12px;right:12px}.inf-name{font-family:var(--font-display);font-weight:700;font-size:14px;color:#ffffffe6;text-shadow:0 2px 4px rgba(0,0,0,.5)}.inf-desc{font-size:10px;color:#ffffffb3}.inf-accent{font-size:9px;color:var(--accent);margin-top:4px;font-weight:600;line-height:1.2}.inf-vibe{padding:8px;background:#111;border-top:1px solid rgba(255,255,255,.05);font-size:10px;color:#ffffff80;display:flex;align-items:center;gap:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ratio-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.form-group{display:flex;flex-direction:column;gap:12px}.form-input,.form-textarea{width:100%;padding:12px;font-size:14px;background:#ffffff08;border:1px solid var(--border);color:var(--text-main);border-radius:8px;outline:none;transition:all .2s}.form-input:focus,.form-textarea:focus{border-color:var(--border-focus)}.form-textarea{height:96px;resize:none}.textarea-wrap{position:relative}.char-count{position:absolute;bottom:12px;right:12px;font-size:10px;color:#fff6}.sidebar-footer{padding:24px;border-top:1px solid var(--border);background:var(--bg-panel-solid);position:sticky;bottom:0;margin-top:auto}.btn-generate{width:100%;padding:16px;font-size:16px;display:flex;align-items:center;justify-content:center;gap:8px;position:relative;overflow:hidden}.btn-generate .shimmer{position:absolute;inset:0;transform:translate(-100%);background:linear-gradient(to right,transparent,rgba(255,255,255,.2),transparent)}.btn-generate:hover .shimmer{animation:shimmer 1.5s infinite}@keyframes shimmer{to{transform:translate(100%)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.5}}.animate-spin-slow{animation:spin 3s linear infinite}.animate-pulse-fast{animation:pulse 1s ease-in-out infinite}.preview-area{flex:1;position:relative;background-color:#0a0a0a;display:flex;align-items:center;justify-content:center;padding:32px;overflow:hidden}.grid-bg{position:absolute;inset:0;pointer-events:none;opacity:.03;background-image:radial-gradient(#ffffff 1px,transparent 1px);background-size:40px 40px}.empty-state{text-align:center;max-width:320px;display:flex;flex-direction:column;align-items:center;gap:24px;color:#ffffff4d}.empty-icon{width:96px;height:96px;border-radius:50%;border:1px dashed rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.empty-title{font-family:var(--font-display);font-size:20px;color:#ffffff80;margin-bottom:8px}.empty-desc{font-size:14px;line-height:1.5}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10}.spinner-wrap{position:relative;width:128px;height:128px;margin-bottom:32px;display:flex;align-items:center;justify-content:center}.spinner-ring{position:absolute;inset:0;border:4px solid rgba(229,255,0,.1);border-radius:50%}.spinner-dash{position:absolute;inset:0;border:4px solid var(--accent);border-top-color:transparent;border-radius:50%}.loading-title{font-family:var(--font-display);font-size:24px;color:#fff;margin-bottom:8px}.loading-desc{color:#ffffff80;font-family:monospace;font-size:12px;text-transform:uppercase;letter-spacing:.15em}.result-state{position:relative;z-index:10;width:100%;max-width:400px;display:flex;flex-direction:column;align-items:center}.result-card{width:100%;box-shadow:0 20px 60px -15px #000c;border-radius:32px;padding:12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);position:relative}.result-img-wrap{position:relative;background:#000;border-radius:24px;overflow:hidden;width:100%}.result-img-wrap img{width:100%;height:100%;object-fit:cover}.inner-shadow{position:absolute;inset:0;box-shadow:inset 0 0 50px #0003;pointer-events:none}.video-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0003;transition:background .2s}.result-img-wrap:hover .video-overlay{background:#0006}.play-btn{width:64px;height:64px;border-radius:50%;background:#fff3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;color:#fff;padding-left:4px;cursor:pointer;transition:all .2s}.play-btn:hover{background:var(--accent);color:#000}.quick-actions{position:absolute;right:-24px;top:50%;transform:translateY(-50%) translate(16px);display:flex;flex-direction:column;gap:12px;opacity:0;transition:all .3s}.result-card:hover .quick-actions{opacity:1;transform:translateY(-50%) translate(0)}.action-btn{width:40px;height:40px;background:#ffffff1a;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;transition:all .2s}.action-btn:hover{background:var(--accent);color:#000;border-color:transparent}.post-actions{margin-top:32px;display:flex;gap:16px;width:100%}.flex-1{flex:1}.py-3{padding:12px 0}:root{--bg-dark: #050505;--bg-panel: rgba(20, 20, 20, .7);--bg-panel-solid: #141414;--border: rgba(255, 255, 255, .08);--border-focus: rgba(229, 255, 0, .4);--accent: #E5FF00;--text-main: #FFFFFF;--text-muted: #888888;--font-display: "Syne", sans-serif;--font-body: "Outfit", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background-color:var(--bg-dark);color:var(--text-main);overflow-x:hidden;-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 10% 5%,rgba(229,255,0,.06) 0%,transparent 60%);min-height:100vh}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:700;letter-spacing:-.02em}input,textarea,select,button{font-family:inherit}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.glass{background:var(--bg-panel);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border)}.no-scrollbar::-webkit-scrollbar{display:none}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}input[type=text],input[type=number],textarea,select{background:#ffffff08;border:1px solid var(--border);color:var(--text-main);border-radius:8px;outline:none;transition:all .2s ease}input[type=text]:focus,input[type=number]:focus,textarea:focus,select:focus{border-color:var(--border-focus);background:#ffffff0d}input::placeholder,textarea::placeholder{color:var(--text-muted)}.btn-primary{background:var(--accent);color:#000;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:transform .1s ease,filter .2s ease}.btn-primary:hover{filter:brightness(1.1);transform:scale(.98)}.btn-primary:active{transform:scale(.95)}.btn-secondary{background:transparent;color:var(--text-main);border:1px solid var(--border);border-radius:8px;cursor:pointer;transition:all .2s ease}.btn-secondary:hover{background:#ffffff0d;border-color:#ffffff26}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade{animation:fadeIn .4s ease forwards}.animate-delay-1{animation-delay:.1s}.animate-delay-2{animation-delay:.2s}.animate-delay-3{animation-delay:.3s}.ratio-radio input{display:none}.ratio-radio label{display:flex;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:8px;padding:8px 12px;cursor:pointer;transition:all .2s ease;color:var(--text-muted);font-weight:500;background:#ffffff05}.ratio-radio input:checked+label{border-color:var(--accent);color:var(--accent);background:#e5ff000d}.influencer-radio input{display:none}.influencer-radio label{border:2px solid transparent;cursor:pointer;transition:all .2s ease;overflow:hidden;display:block}.influencer-radio input:checked+label{border-color:var(--accent);transform:scale(.98)}
