:root{--primary-color: #7B2CBF;--primary-glow: #9D4EDD;--accent-cyan: #4CC9F0;--surface-bg: rgba(16, 15, 28, .7);--surface-border: rgba(157, 78, 221, .2);--input-bg: rgba(8, 7, 16, .6);--text-primary: #ffffff;--text-secondary: #94a3b8;--button-text: #ffffff}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,sans-serif;color:var(--text-primary);display:flex;justify-content:center;align-items:flex-start;min-height:100vh;padding:2rem;background-color:#000;overflow-x:hidden}.splash-screen{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10000;opacity:1;transition:opacity .8s ease-in-out;background:#000;display:flex;justify-content:center;align-items:center}.splash-screen.hidden{opacity:0;pointer-events:none}.shader-canvas{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.splash-title{position:absolute;z-index:2;font-size:3rem;font-weight:900;letter-spacing:12px;color:#fff;text-shadow:0 0 40px rgba(157,78,221,.8),0 0 20px var(--accent-cyan);animation:splashPulse 2s infinite alternate}@keyframes splashPulse{0%{opacity:.8;transform:scale(1);filter:blur(0px)}to{opacity:1;transform:scale(1.05);filter:blur(1px)}}.tech-grid{position:fixed;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(rgba(255,255,255,.15) 1px,transparent 1px);background-size:40px 40px;z-index:-1;opacity:.3;pointer-events:none}.background-blobs{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-2;overflow:hidden;pointer-events:none}.blob{position:absolute;filter:blur(80px);opacity:.6;border-radius:50%;will-change:transform,border-radius}.blob-1{top:-20%;left:-20%;width:60vw;height:60vw;background:var(--primary-color);animation:float1 20s ease-in-out infinite alternate}.blob-2{bottom:-20%;right:-20%;width:70vw;height:70vw;background:#560bad;animation:float2 25s ease-in-out infinite alternate}.blob-3{top:30%;left:30%;width:40vw;height:40vw;background:var(--accent-cyan);opacity:.2;animation:float3 18s ease-in-out infinite alternate}@keyframes float1{0%{transform:translate(0) rotate(0);border-radius:60% 40% 30% 70%/60% 30% 70% 40%}50%{transform:translate(40vw,20vh) rotate(20deg);border-radius:30% 60% 70% 40%/50% 60% 30%}to{transform:translate(10vw,40vh) rotate(-10deg);border-radius:70% 30% 50% 50%/30% 60% 40% 70%}}@keyframes float2{0%{transform:translate(0) rotate(0);border-radius:50%}50%{transform:translate(-30vw,-20vh) rotate(-15deg);border-radius:40% 70% 30% 60%/50% 40% 60% 50%}to{transform:translate(-10vw,-40vh) rotate(10deg);border-radius:60% 40% 50% 50%/40% 60% 50% 50%}}@keyframes float3{0%{transform:translate(0) scale(1);border-radius:40% 60% 60% 40%/60% 30% 70% 40%}50%{transform:translate(20vw,-20vh) scale(1.2);border-radius:60% 40% 30% 70%/40% 60% 60% 40%}to{transform:translate(-20vw,10vh) scale(.9);border-radius:30% 70% 70% 30%/70% 30% 30% 70%}}#root{width:100%;max-width:720px;position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;padding-bottom:2rem}.main-header{text-align:center;margin-bottom:2.5rem;position:relative;z-index:2}.logo-title{display:flex;flex-direction:column;align-items:center}.logo-title-top{font-size:4rem;font-weight:900;letter-spacing:-2px;background:linear-gradient(180deg,#fff,#a0a0a0);-webkit-background-clip:text;color:transparent;line-height:.9}.logo-title-bottom{font-size:3rem;font-weight:800;letter-spacing:.4em;margin-right:-.4em;color:var(--primary-color);text-shadow:0 0 20px rgba(157,78,221,.6)}.tagline{font-size:.8rem;letter-spacing:3px;color:var(--accent-cyan);text-transform:uppercase;margin-top:1rem;opacity:.8}.container{display:flex;flex-direction:column;background:var(--surface-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);padding:2.5rem;border-radius:24px;border:1px solid var(--surface-border);box-shadow:0 20px 50px #0009,inset 0 0 0 1px #ffffff0d;width:100%;position:relative;overflow:visible}.loading-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#05050ae6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:50;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:24px}.orbital-loader{position:relative;width:100px;height:100px;margin-bottom:2rem}.orbit{position:absolute;top:50%;left:50%;border-radius:50%;border:1px solid transparent;border-top-color:var(--accent-cyan);border-bottom-color:var(--primary-glow);transform:translate(-50%,-50%)}.orbit-1{width:100%;height:100%;animation:spin 2s linear infinite}.orbit-2{width:70%;height:70%;animation:spin 3s linear infinite reverse;border-left-color:#fff}.orbit-3{width:40%;height:40%;animation:spin 1.5s linear infinite;border-color:var(--primary-color)}.center-core{position:absolute;top:50%;left:50%;width:10px;height:10px;background:#fff;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 20px 5px var(--accent-cyan);animation:pulse 1s ease-in-out infinite alternate}@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes pulse{to{opacity:.5;box-shadow:0 0 30px 10px var(--primary-glow)}}.loading-text-container{text-align:center}.loading-glitch{font-family:monospace;font-size:1.2rem;letter-spacing:2px;color:var(--accent-cyan);font-weight:700}.loading-subtext{font-size:.7rem;letter-spacing:4px;color:var(--text-secondary);margin-top:.5rem;opacity:.7}.hero-input{width:100%;background:var(--input-bg);border:1px solid rgba(255,255,255,.1);padding:1.2rem;border-radius:12px;color:#fff;font-size:1rem;font-family:Inter,sans-serif;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:inset 0 2px 4px #0000004d}.hero-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 4px #7b2cbf33,inset 0 2px 4px #00000080;background:#0c0b14e6}.hero-label{font-size:.75rem;letter-spacing:1.5px;color:var(--accent-cyan);margin-bottom:.5rem;font-weight:700}.modern-select{width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#ffffff08;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 1rem center;background-size:1em;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:.8rem 2.5rem .8rem 1rem;color:var(--text-secondary);cursor:pointer;font-size:.9rem;transition:all .2s}.modern-select:hover{background-color:#ffffff14;color:#fff;border-color:#fff3;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e")}.modern-select:focus{outline:none;border-color:var(--primary-color);color:#fff}.modern-select option{background-color:#050508;color:#fff;padding:10px}.generate-button{width:100%;padding:1.2rem;font-size:1rem;font-weight:800;letter-spacing:2px;border:none;border-radius:12px;cursor:pointer;background:linear-gradient(90deg,#5a189a,#9d4edd);color:#fff;position:relative;overflow:hidden;transition:all .3s;margin-top:1rem;box-shadow:0 10px 20px #5a189a4d}.generate-button:hover{transform:translateY(-2px);box-shadow:0 15px 30px #5a189a80;filter:brightness(1.1)}.generate-button:active{transform:translateY(1px)}.generate-button:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none;filter:grayscale(.5)}.nav-tabs{display:flex;background:#0006;padding:4px;border-radius:14px;margin-bottom:2rem;border:1px solid rgba(255,255,255,.05);position:relative;align-items:center}.nav-tab{flex:1;background:transparent;border:none;padding:1rem;color:var(--text-secondary);font-weight:600;cursor:pointer;border-radius:10px;transition:all .3s;letter-spacing:1px}.nav-tab.active{background:var(--primary-color);color:#fff;box-shadow:0 4px 15px #7b2cbf66}.sub-nav-tabs{display:flex;justify-content:center;gap:1rem;margin-bottom:2rem;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:1rem}.sub-nav-tab{background:transparent;border:1px solid transparent;color:var(--text-secondary);padding:.5rem 1.5rem;border-radius:20px;font-size:.75rem;letter-spacing:1px;font-weight:700;cursor:pointer;transition:all .2s}.sub-nav-tab.active{background:#4cc9f01a;color:var(--accent-cyan);border-color:var(--accent-cyan)}.uploader-label{border:2px dashed rgba(255,255,255,.1);background:#0003;padding:2rem;border-radius:12px;text-align:center;color:var(--text-secondary);cursor:pointer;transition:all .3s;font-weight:600;letter-spacing:1px;display:block}.uploader-label:hover{border-color:var(--accent-cyan);color:var(--accent-cyan);background:#4cc9f00d}.mini-uploader{display:flex;align-items:center}.mini-uploader input[type=file]{display:none}.mini-uploader label{cursor:pointer;padding:.8rem 1.5rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:var(--text-secondary);font-size:.8rem;transition:all .2s;width:100%;text-align:center}.mini-uploader label:hover{background:#ffffff1a;color:#fff}.image-preview{width:100%;max-height:300px;object-fit:contain;margin-top:1rem;border-radius:12px;border:1px solid var(--surface-border)}.grid-2-col{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.input-group{margin-bottom:1.5rem}.input-group label{font-size:.7rem;font-weight:700;letter-spacing:1px;color:var(--text-secondary);margin-bottom:.5rem;display:block;text-transform:uppercase}.advanced-toggle{margin-top:1rem;padding:1rem;background:#ffffff08;border-radius:8px;border:1px solid rgba(255,255,255,.05);color:var(--text-secondary);cursor:pointer;font-size:.8rem;letter-spacing:1px;transition:all .2s}.advanced-toggle:hover{background:#ffffff0f;color:#fff}.settings-grid-container{padding:1.5rem;background:#0003;border-radius:0 0 12px 12px;margin-top:-5px;border:1px solid rgba(255,255,255,.05)}.prompt-output{background:#0a0a0f;border:1px solid var(--primary-color);padding:2rem;border-radius:12px;font-size:1rem;line-height:1.8;color:#e2e8f0;margin-top:2rem;box-shadow:0 0 30px #7b2cbf26;white-space:pre-wrap}.copy-button{background:transparent;border:1px solid var(--accent-cyan);color:var(--accent-cyan);padding:.5rem 1.5rem;border-radius:6px;cursor:pointer;font-weight:700;letter-spacing:1px;margin-top:1rem;transition:all .2s;float:right}.copy-button:hover{background:var(--accent-cyan);color:#000}.history-container{margin-top:0;border-top:none;padding-top:0;width:100%;display:flex;flex-direction:column}.history-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.history-header h2{font-size:1rem;letter-spacing:2px;color:var(--text-secondary);margin:0}.clear-button{background:transparent;border:none;color:#ff4d4d;font-size:.7rem;cursor:pointer;letter-spacing:1px}.history-list{list-style:none;display:flex;flex-direction:column;gap:1rem}.history-item{background:linear-gradient(90deg,rgba(0,0,0,.3) 0%,transparent 100%);border-left:3px solid var(--primary-color);border:1px solid rgba(255,255,255,.05);border-left-width:3px;border-radius:0 8px 8px 0;padding:1.5rem;cursor:pointer;transition:all .2s;display:flex;flex-direction:column}.history-item:hover{background:#ffffff14;transform:translate(5px)}.history-header-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:.8rem}.history-time{font-size:.65rem;color:var(--text-secondary);letter-spacing:1px}.history-content-row{display:flex;gap:1rem;align-items:flex-start}.history-badge-container{display:flex;align-items:center;gap:1rem;margin-bottom:.8rem}.history-prompt-text{font-family:monospace;opacity:1;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;color:#fff;line-height:1.5}.history-badge{font-family:Inter,sans-serif;letter-spacing:1px;font-weight:800;font-size:.6rem;padding:.2rem .5rem;border-radius:4px;background:#ffffff1a}.badge-img2prompt{color:var(--accent-cyan);background:#4cc9f026}.badge-text2prompt{color:var(--primary-glow);background:#9d4edd26}.badge-video{color:#f72585;background:#f7258526}.history-thumb{width:50px;height:50px;border-radius:6px;object-fit:cover;flex-shrink:0}.history-copy-btn{background:transparent;border:1px solid rgba(255,255,255,.1);color:var(--text-secondary);cursor:pointer;padding:.3rem .6rem;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s;margin-left:auto;margin-right:.5rem}.history-copy-btn:hover{border-color:var(--accent-cyan);color:#fff;background:#4cc9f01a}.empty-history{text-align:center;padding:4rem 2rem;color:var(--text-secondary);border:2px dashed rgba(255,255,255,.05);border-radius:12px}.empty-history p{font-size:1rem;font-weight:700;margin-bottom:.5rem;color:#fff}.empty-history span{font-size:.8rem}.aspect-ratio-selector{display:flex;gap:.5rem;flex-wrap:wrap}.ratio-btn{background:#ffffff0d;border:1px solid transparent;color:var(--text-secondary);padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-size:.8rem}.ratio-btn.active{background:var(--primary-color);color:#fff;border-color:var(--primary-glow)}.top-controls{position:fixed;top:2rem;right:2rem;z-index:100;display:flex;align-items:center;gap:.8rem;transform:none}.key-status-pill{display:flex;align-items:center;background:#00000080;border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:.3rem .8rem;cursor:pointer;transition:all .2s;font-family:Inter,sans-serif}.key-status-pill:hover{background:#ffffff14;border-color:#fff3}.key-info{display:flex;align-items:center;gap:.4rem}.status-dot{width:6px;height:6px;border-radius:50%;display:block}.active-free{background-color:#4cc9f0;box-shadow:0 0 6px #4cc9f0}.active-custom{background-color:#f72585;box-shadow:0 0 6px #f72585}.status-label{font-size:.6rem;font-weight:800;letter-spacing:.5px;color:#fff}.usage-divider{width:1px;height:12px;background:#fff3;margin:0 .5rem}.usage-info{display:flex;align-items:baseline;gap:.2rem}.usage-count{font-size:.7rem;font-weight:700;color:#fff}.usage-label{font-size:.5rem;color:var(--text-secondary);letter-spacing:.5px}.settings-button{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;opacity:.5;transition:opacity .2s;display:flex;align-items:center}.settings-button:hover{opacity:1;color:#fff}.checkbox-wrapper{display:flex;align-items:center;gap:.8rem;cursor:pointer}.checkbox-wrapper input[type=checkbox]{accent-color:var(--primary-color);width:1.2rem;height:1.2rem;cursor:pointer}.checkbox-wrapper label{cursor:pointer;margin-bottom:0}.version-footer{position:fixed;bottom:10px;right:15px;font-size:.6rem;color:var(--text-secondary);opacity:.5;letter-spacing:1px;z-index:10}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000d9;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);z-index:9999;display:flex;justify-content:center;align-items:center;opacity:0;animation:fadeIn .5s forwards}.modal-content{background:#100f1ce6;border:1px solid var(--surface-border);box-shadow:0 0 50px #7b2cbf4d,inset 0 0 0 1px #ffffff1a;padding:2.5rem;border-radius:24px;width:90%;max-width:480px;position:relative;transform:scale(.95);animation:scaleUp .3s cubic-bezier(.16,1,.3,1) forwards}@keyframes scaleUp{to{transform:scale(1);opacity:1}}@keyframes fadeIn{to{opacity:1}}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:1rem}.center-header{justify-content:center;border:none}.modal-header h3{font-size:1.2rem;letter-spacing:3px;color:#fff;font-weight:800;text-transform:uppercase;text-shadow:0 0 10px var(--primary-color)}.close-button{background:transparent;border:none;color:var(--text-secondary);font-size:1.5rem;cursor:pointer;transition:all .2s}.close-button:hover{color:#fff;text-shadow:0 0 10px white}.modal-body{display:flex;flex-direction:column;gap:1rem}.license-instruction{text-align:center;color:var(--accent-cyan);font-size:.8rem;letter-spacing:2px;margin-bottom:1rem;font-weight:700}.license-error{color:#ff4d4d;font-size:.8rem;text-align:center;margin-top:.5rem;letter-spacing:1px;font-weight:600;text-shadow:0 0 10px rgba(255,77,77,.5)}.api-key-link,.license-link{font-size:.75rem;color:var(--accent-cyan);text-decoration:none;margin-top:.5rem;display:inline-block;letter-spacing:1px;border-bottom:1px solid transparent;transition:all .2s}.api-key-link:hover,.license-link:hover{border-bottom-color:var(--accent-cyan);text-shadow:0 0 8px var(--accent-cyan)}.license-sub-footer{margin-top:2rem;text-align:center;font-size:.75rem;color:var(--text-secondary)}.modal-footer{margin-top:2rem}.center-footer{text-align:center}
