*{box-sizing:border-box}html,body{margin:0;padding:0}:root{--bg-dark: #121212;--bg-card: #1e1e1e;--text-primary: #EDEDED;--text-secondary:#A1A1A1;--btn:#4F56F1;--btn-hover: #585FE0;--btn-active: #3B3FDB;--border: #2A2A2A;--success: #27AE60;--error: #E74C3C;--card-active: #3232FF;--transition: .2s ease-in-out;--font: "Poppins", sans-serif}body{background:var(--bg-dark);font-family:var(--font);line-height:1.5;-webkit-font-smoothing:antialiased;padding:0;margin:0}.app-container{min-height:100vh;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:120px}.brand-glow{position:fixed;top:-120px;left:50%;transform:translate(-50%);width:1500px;height:244px;background:radial-gradient(ellipse at center,#4f56f18c,#4f56f100 70%);filter:blur(200px);pointer-events:none;z-index:-1}.fade-in{opacity:0;transform:translateY(10px);animation:fadeInUp .8s ease-out forwards}.fade-in.delay-0{animation-delay:.2s}.fade-in.delay-1{animation-delay:.6s}.fade-in.delay-2{animation-delay:1s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.start-screen{text-align:center}.start-screen h1{color:var(--text-primary);font-size:2rem;font-weight:600;margin-bottom:15px}.start-screen p{color:var(--text-secondary);font-size:1rem;margin-bottom:60px}.start-screen button{position:relative;overflow:hidden;background-color:var(--btn);color:var(--text-primary);font-size:1rem;font-weight:500;padding:10px 50px;border:none;border-radius:16px;cursor:pointer;transition:background .2s ease-in-out,transform .12s ease-out;will-change:transform;transform:translateZ(0)}.start-screen button:hover:not(:disabled){background-color:var(--btn-hover);transform:scale(1.02)}.start-screen button:active:not(:disabled){transform:scale(.98)}.form-screen{display:flex;flex-direction:column;justify-content:center;align-items:center}.form-screen h2{font-size:1.5rem;font-weight:500;color:var(--text-primary);margin-bottom:16px}.form-screen button{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border);border-radius:16px;padding:8px 25px;margin-right:32px;cursor:pointer;transition:background .2s ease-in-out,transform .12s ease-out;will-change:transform;transform:translateZ(0);margin-bottom:32px}.form-screen button:hover:not(:disabled){background-color:var(--btn-hover)}.form-screen button:active:not(:disabled){transform:scale(.98)}.form-screen button[aria-checked=true]{background:var(--btn-active)}.form-screen h3{font-size:1.25rem;font-weight:500;color:var(--text-primary);margin-bottom:24px}.form-screen textarea{width:100%;min-height:24px;padding:12px 14px;background:var(--bg-card);color:var(--text-primary);border:none;border-radius:5px;margin-bottom:24px;resize:none;transition:height .15s ease}.form-screen textarea::placeholder{color:var(--text-secondary)}.form-screen textarea:focus{border-color:var(--text-primary);box-shadow:0 0 0 2px #4f56f140;outline:none}.generate-btn:disabled{position:relative;overflow:hidden;font-size:1rem;font-weight:500;padding:10px 50px;border:none;border-radius:16px;cursor:pointer}.generate-btn:not(:disabled){position:relative;overflow:hidden;background-color:var(--btn);color:var(--text-primary);font-size:1rem;font-weight:500;padding:10px 50px;border:none;border-radius:16px;cursor:pointer;transition:background .2s ease-in-out,transform .12s ease-out;will-change:transform;transform:translateZ(0);box-shadow:0 0 10px #4f56f12e}.generate-btn:hover:not(:disabled){background-color:var(--btn-hover);transform:scale(1.02)}.generate-btn:active:not(:disabled){transform:scale(.98)}.loading-screen{display:flex;flex-direction:column;justify-content:center;align-items:center}.loading-screen h2{font-size:1.25rem;font-weight:500;color:var(--text-primary);margin-bottom:32px}.loading-animation{width:120px;height:120px}.result-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-top:-64px}.result-screen h2{font-size:1.5rem;font-weight:500;color:var(--text-primary);margin-bottom:24px}.btn-container{display:flex;flex-direction:row}.btn-container button{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border);border-radius:16px;padding:8px 25px;margin-right:32px;margin-bottom:32px;transition:background .2s ease-in-out,transform .12s ease-out;will-change:transform;transform:translateZ(0);cursor:pointer}.btn-container button:hover{background:var(--btn-hover)}.btn-container button:active{transform:scale(.98)}.btn-container button:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.toast{position:fixed;right:20px;bottom:20px;z-index:9999;background:var(--bg-card);border:1px solid var(--btn-active);color:var(--text-primary);padding:16px 32px;border-radius:8px;font-size:14px;font-weight:400;box-shadow:0 4px 14px #00000073;opacity:1;transform:none}.result-item{display:grid;grid-template-columns:1fr 140px;gap:16px;padding:16px;margin-bottom:16px}.result-item .content{display:grid;gap:8px}.result-item{transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}.result-item:hover{transform:translateY(-2px);border-color:#3a3a3a;box-shadow:0 4px 12px #00000040}.caption{margin:0;color:var(--text-primary)}.hashtags{color:var(--text-secondary)}.hashtags{display:flex;flex-wrap:wrap;gap:6px}.hashtags span{background:#1b1b1b;border:1px solid #2a2a2a;padding:4px 8px;border-radius:999px;font-size:12px;color:#bbb}.actions{display:flex;flex-direction:column;gap:8px;align-items:stretch;align-self:start}.actions button{width:100%;min-height:36px;border-radius:16px;background:none;border:1px solid var(--border);color:var(--text-primary);transition:background .2s ease-in-out,transform .12s ease-out;will-change:transform;transform:translateZ(0);cursor:pointer}.actions button:hover{background:var(--btn-hover)}.actions .danger{background:#2a1c1c;border:1px solid #5a2c2c}.actions button{min-width:0}.actions button>span{display:inline-block;min-width:7.5ch}.toast{position:fixed;right:16px;bottom:16px;background:#1f1f1f;border:1px solid #2a2a2a;color:#e8e8e8;padding:10px 14px;border-radius:8px;box-shadow:0 6px 20px #00000059;opacity:0;transform:translateY(8px);transition:opacity .2s ease,transform .2s ease}.toast.show{opacity:1;transform:translateY(0)}@media(max-width:640px){.result-item{grid-template-columns:1fr}.actions{flex-direction:row}.actions button{flex:1}}@media(prefers-reduced-motion:reduce){button{transition:none}}@media(max-width:1200px){.app-container{padding:96px}.start-screen,.form-screen,.result-screen{max-width:900px;margin:0 auto;text-align:center}.result-screen{margin-top:32px}.btn-container{flex-direction:column;align-items:center;gap:10px}.btn-container button{width:auto;max-width:340px;min-width:220px;padding:10px 24px;font-size:.95rem}.result-item{grid-template-columns:1fr 148px}.start-screen h1{font-size:1.9rem}.start-screen p{font-size:.98rem}.form-screen h2,.result-screen h2{font-size:1.4rem}.loading-screen{text-align:center}}@media(max-width:992px){.app-container{padding:72px}.start-screen,.form-screen,.result-screen{max-width:760px}.result-item{grid-template-columns:1fr 144px;gap:14px;margin-left:auto;margin-right:auto}.btn-container button{max-width:300px;min-width:200px;font-size:.93rem;padding:10px 20px}.actions button{min-height:40px;font-size:.95rem}}@media(max-width:768px){.app-container{padding:48px}.start-screen,.form-screen,.result-screen{max-width:620px}.result-screen{margin-top:36px}.result-item{grid-template-columns:1fr;gap:12px}.actions{flex-direction:row;justify-content:center;gap:10px}.actions button{flex:0 0 auto;width:auto;min-width:108px;padding:8px 14px;font-size:.92rem}.btn-container{gap:10px}.btn-container button{max-width:280px;min-width:180px;font-size:.92rem;padding:9px 18px}.form-screen button{width:auto;max-width:280px;font-size:.92rem;padding:9px 18px}.form-screen textarea{width:100%;max-width:620px;margin-left:auto;margin-right:auto}.loading-animation{width:96px;height:96px}.loading-screen{text-align:center}}@media(max-width:600px){.app-container{padding:28px}.start-screen,.form-screen,.result-screen{max-width:520px}.start-screen h1{font-size:1.7rem}.start-screen p{font-size:.95rem}.form-screen h2,.result-screen h2{font-size:1.3rem}.btn-container button{max-width:240px;min-width:160px;font-size:.9rem;padding:8px 16px}.actions button{min-width:96px;padding:8px 12px;font-size:.9rem;min-height:38px}.result-item{padding:12px;gap:10px}.caption{word-break:break-word;overflow-wrap:anywhere}.toast{right:12px;bottom:12px;max-width:min(90vw,360px)}}@media(max-width:420px){.app-container{padding:20px}.start-screen,.form-screen,.result-screen{max-width:100%}.result-screen{margin-top:42px}.start-screen h1{font-size:1.55rem}.start-screen p{font-size:.9rem}.btn-container button{max-width:220px;min-width:150px;font-size:.88rem;padding:8px 14px}.actions{gap:8px}.actions button{min-width:92px;font-size:.88rem;padding:8px 10px;min-height:36px}.loading-animation{width:84px;height:84px}}@media(max-width:992px){.app-container{padding:64px}.btn-container{flex-direction:column;align-items:center;gap:8px}.btn-container button{width:auto;max-width:320px;min-width:200px;font-size:.95rem;padding:10px 22px}.result-screen{margin-top:40px;display:flex;flex-direction:column;align-items:center}.result-screen ul{width:100%;max-width:720px;margin:0 auto;padding:0}.result-item{grid-template-columns:1fr 140px;gap:14px;margin:0 auto 16px}.result-item .content{text-align:left}.actions button{font-size:.93rem;min-height:40px}.loading-screen{text-align:center}.loading-screen h2{font-size:1.25rem}}@media(max-width:600px){.app-container{padding:32px}.btn-container{flex-direction:column;align-items:center;gap:6px}.btn-container button{width:auto;max-width:260px;min-width:160px;font-size:.9rem;padding:8px 18px}.result-screen{margin-top:36px;align-items:center}.result-screen ul{max-width:540px;margin:0 auto}.result-item{grid-template-columns:1fr;gap:10px;padding:12px;margin-left:auto;margin-right:auto}.actions{flex-direction:row;justify-content:center;gap:8px}.actions button{flex:0 0 auto;width:auto;min-width:92px;font-size:.88rem;padding:8px 12px}.start-screen h1{font-size:1.6rem}.start-screen p{font-size:.95rem}.form-screen h2,.result-screen h2{font-size:1.3rem}.loading-screen{text-align:center}.loading-screen h2{font-size:1.1rem}}@media(max-width:420px){.app-container{padding:20px}.btn-container button{max-width:220px;min-width:140px;font-size:.86rem;padding:8px 14px}.result-screen ul{max-width:100%}.result-item{padding:10px;gap:8px;margin:0 auto 12px}.actions{gap:6px}.actions button{font-size:.85rem;padding:6px 10px;min-height:36px}.start-screen h1{font-size:1.45rem}.start-screen p{font-size:.9rem}.loading-animation{width:80px;height:80px}}