@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,sans-serif}:root{--color-primary: #5c56e1;--color-primary-dark: #5b21b6;--color-accent: #8b5cf6;--color-card: #ffffff;--color-input: #f1f1ff;--color-text: #09090e;--color-placeholder: #5c5a87;--color-border: #d4d4ed;--color-gradient: linear-gradient(135deg, #5c56e1, #8b5cf6);--color-input-shadow: rgba(139, 92, 246, .15);--color-input-shadow-soft: rgba(139, 92, 246, .1);--color-btn-shadow: rgba(109, 40, 217, .3)}body{padding:15px;display:flex;align-items:center;justify-content:center;color:var(--color-text);min-height:100vh;background:linear-gradient(#e9e9ff,#c8c7ff)}body.dark-theme{--color-card: #1e293b;--color-input: #141b2d;--color-text: #f3f4f6;--color-placeholder: #a3b6dc;--color-border: #334155;background:var(--color-card);background-image:radial-gradient(circle at 15% 50%,rgba(99,102,241,.15) 0%,transparent 35%),radial-gradient(circle at 85% 30%,rgba(139,92,246,.15) 0%,transparent 35%),radial-gradient(circle at 50% 80%,rgba(99,102,241,.1) 0%,transparent 40%)}.container{width:900px;position:relative;overflow:hidden;background-color:var(--color-card);padding:32px;border-radius:24px;box-shadow:0 10px 20px #0000001a}body.dark-theme .container{border:1px solid var(--color-border)}.container:before{content:"";position:absolute;top:0;left:0;width:100%;height:5px;background:var(--color-gradient)}.header{display:flex;align-items:center;justify-content:space-between}.header .logo-wrapper{display:flex;align-items:center;gap:18px}.header .logo-wrapper .logo{width:55px;height:56px;font-size:1.35rem;color:#fff;background:var(--color-gradient);display:flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:15px}.header .logo-wrapper h1{font-size:1.9rem;font-weight:700;background:var(--color-gradient);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;-moz-text-fill-color:transparent}.header .theme-toggle{width:43px;height:43px;font-size:1.05rem;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--color-placeholder);background:var(--color-input);border:1px solid var(--color-border);transition:all .3s ease}.header .theme-toggle:hover{color:var(--color-primary);transform:translateY(-2px);box-shadow:0 4px 10px var(--color-input-shadow)}.main-content{margin:32px 0 5px}.main-content .prompt-container{width:100%;position:relative;margin-bottom:20px}.prompt-container .prompt-input{width:100%;background:var(--color-input);border-radius:15px;border:1px solid var(--color-border);color:var(--color-text);padding:16px 20px;min-height:120px;resize:vertical;font-size:1.05rem;line-height:1.6;transition:all .3s ease}.prompt-container .prompt-input:focus{border-color:var(--color-accent);outline:none;box-shadow:0 0 0 2px var(--color-input-shadow)}.prompt-container .prompt-input::placeholder{color:var(--color-placeholder)}.prompt-container .prompt-btn{position:absolute;right:15px;bottom:15px;width:35px;height:35px;border:none;border-radius:50%;font-size:.75rem;color:#fff;opacity:.8;background:var(--color-gradient);transition:all .3s ease;cursor:pointer}.prompt-container .prompt-btn:hover{opacity:1;transform:translateY(-2px);box-shadow:0 2px 4px -1px var(--color-btn-shadow)}.main-content .prompt-actions{display:grid;gap:14px;grid-template-columns:1.2fr 1fr 1.1fr 1fr}.prompt-actions .select-wrapper{position:relative}.prompt-actions .select-wrapper:after{content:"";font-family:"Font Awesome 6 Free";position:absolute;font-size:.9rem;font-weight:900;right:20px;top:50%;transform:translateY(-50%);color:var(--color-placeholder);background:var(--color-input);padding-left:7px;pointer-events:none}.prompt-actions :where(.custom-select,.generate-btn){background:var(--color-input);border:1px solid var(--color-border);padding:12px 20px;border-radius:10px;font-size:1rem;color:var(--color-text);cursor:pointer}.prompt-actions .custom-select{appearance:none;outline:none;width:100%;height:100%}.prompt-actions .custom-select:is(:focus,:hover){border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-input-shadow-soft)}.prompt-actions .generate-btn{margin-left:auto;background:var(--color-gradient);color:#fff;font-weight:500;display:flex;align-items:center;border:none;justify-content:center;gap:12px;padding:12px 25px;transition:all .3s ease}.prompt-actions .generate-btn:disabled{opacity:.6;pointer-events:none}.prompt-actions .generate-btn:hover{transform:translateY(-2px);box-shadow:0 4px 10px var(--color-btn-shadow)}.main-content .gallery-grid{display:grid;gap:15px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.main-content .gallery-grid:has(.img-card){margin-top:30px}.gallery-grid .img-card{position:relative;overflow:hidden;opacity:0;transform:translateY(20px);display:flex;flex-direction:column;align-items:center;justify-content:center;aspect-ratio:1;border-radius:15px;background:var(--color-input);border:1px solid var(--color-border);transition:opacity .3s ease-out,transform .5s ease-out,all .5s ease}.gallery-grid .img-card.animate-in{opacity:1;transform:translateY(0)}.gallery-grid .img-card:is(.loading,.error) :is(.result-img,.img-overlay){display:none}.gallery-grid .img-card:not(.loading,.error):hover{transform:translateY(-5px);box-shadow:0 10px 15px -3 #0000001a}.gallery-grid .img-card .result-img{width:100%;height:100%;object-fit:cover}.gallery-grid .img-card .img-overlay{position:absolute;bottom:0;left:0;right:0;opacity:0;pointer-events:none;padding:20px;display:flex;justify-content:flex-end;background:linear-gradient(transparent,#000c);transition:all .3s ease}.gallery-grid .img-card:hover .img-overlay{opacity:1;pointer-events:auto}.img-card .img-overlay .img-download-btn{height:45px;width:45px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;border:none;cursor:pointer;color:#fff;border-radius:50%;background:#ffffff40;transition:all .3s linear}.gallery-grid .img-card .img-download-btn:hover{transform:scale(1.05);background:#fff6}.gallery-grid .img-card .status-container{display:none}.gallery-grid .img-card:where(.loading,.error) .status-container{padding:15px;display:flex;gap:13px;flex-direction:column;align-items:center}.gallery-grid .img-card.loading .spinner{width:35px;height:35px;border-radius:50%;border:3px solid var(--color-border);border-top-color:var(--color-primary);animation:spin 1s linear infinite}.img-card .status-container i{font-size:1.7rem;color:#ef4444}.gallery-grid .img-card.loading .status-container i,.gallery-grid .img-card.error .spinner{display:none}@keyframes spin{to{transform:rotate(360deg)}}.gallery-grid .img-card .status-container .status-text{color:var(--color-placeholder);font-size:.8rem;text-align:center}@media (max-width: 768px){.container{padding:18px}.header .logo-wrapper .logo{height:50px;width:51px;font-size:1.25rem}.header .logo-wrapper h1{font-size:1.7rem}.main-content .prompt-actions{grid-template-columns:1fr;margin-top:-10px}.prompt-actions .generate-btn{margin:10px 0 0}.gallery-grid .img-card .img-overlay{opacity:1}}