:root{--font-sans-en:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-sans-ar:"Cairo", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;--bg-main:#05070c;--bg-card:#0a0f1ea6;--bg-card-hover:#0f172ad9;--border-glow:#a855f726;--primary:#c084fc;--primary-glow:#a855f780;--secondary:#22d3ee;--secondary-glow:#22d3ee66;--accent:#f43f5e;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--transition-smooth:all .3s cubic-bezier(.4, 0, .2, 1);--transition-bounce:all .5s cubic-bezier(.175, .885, .32, 1.275)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans-en);background-color:var(--bg-main);color:var(--text-primary);min-height:100vh;line-height:1.6;position:relative;overflow-x:hidden}body:before{content:"";z-index:-1;filter:blur(80px);pointer-events:none;background:radial-gradient(circle at 10% 20%,#a855f714 0%,#0000 40%),radial-gradient(circle at 90% 80%,#22d3ee14 0%,#0000 40%),radial-gradient(circle,#f43f5e08 0%,#0000 60%);animation:20s ease-in-out infinite alternate ambientShift;position:absolute;inset:0}@keyframes ambientShift{0%{background-position:0 0}to{background-position:100% 100%}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#0a0f1e4d}::-webkit-scrollbar-thumb{background:#a855f733;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#a855f766}.ar-text{font-family:var(--font-sans-ar);letter-spacing:0;direction:rtl}.en-text{font-family:var(--font-sans-en);direction:ltr}.app-container{flex-direction:column;max-width:850px;min-height:100vh;margin:0 auto;padding:3rem 1.5rem;display:flex}.glass-panel{background:var(--bg-card);-webkit-backdrop-filter:blur(16px);transition:var(--transition-smooth);border:1px solid #ffffff0f;border-radius:20px;box-shadow:0 8px 32px #0000005e}.glass-panel:hover{border-color:#ffffff1f;box-shadow:0 12px 40px #00000080}.app-header{text-align:center;margin-bottom:3rem}.logo-container{align-items:center;gap:.75rem;margin-bottom:.5rem;display:inline-flex}.logo-text{letter-spacing:-1.5px;background:linear-gradient(135deg,#c084fc 0%,#22d3ee 50%,#f43f5e 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:2.75rem;font-weight:800;display:inline-block}.logo-emoji{font-size:2.5rem;animation:3s ease-in-out infinite floatEmoji}.app-subtitle{color:var(--text-secondary);opacity:.85;max-width:480px;margin:0 auto;font-size:1.1rem;font-weight:400}@keyframes floatEmoji{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-8px)rotate(5deg)}}.search-form{gap:.75rem;width:100%;margin-bottom:1.5rem;display:flex;position:relative}.input-wrapper{flex:1;position:relative}.search-input{width:100%;color:var(--text-primary);transition:var(--transition-bounce);background:#0a0f1ed9;border:2px solid #ffffff14;border-radius:16px;padding:1.1rem 3.5rem 1.1rem 1.5rem;font-family:inherit;font-size:1.15rem}.search-input:focus{border-color:var(--primary);box-shadow:0 0 20px var(--border-glow);outline:none}.search-icon-inside{color:var(--text-muted);pointer-events:none;transition:var(--transition-smooth);position:absolute;top:50%;right:1.25rem;transform:translateY(-50%)}.search-input:focus+.search-icon-inside{color:var(--primary);transform:translateY(-50%)scale(1.1)}.search-input.rtl-input{text-align:right;font-family:var(--font-sans-ar);padding-left:3.5rem;padding-right:1.5rem}.search-input.rtl-input+.search-icon-inside{left:1.25rem;right:auto}.btn-primary{background:linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);color:#05070c;cursor:pointer;transition:var(--transition-bounce);border:none;border-radius:16px;justify-content:center;align-items:center;gap:.5rem;padding:0 2rem;font-size:1.1rem;font-weight:700;display:flex;box-shadow:0 4px 15px #a855f74d}.btn-primary:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-2px)scale(1.02);box-shadow:0 6px 20px #a855f780}.btn-primary:active:not(:disabled){transform:translateY(1px)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.tags-container{flex-wrap:wrap;justify-content:center;gap:.6rem;margin-bottom:2.5rem;display:flex}.tag-btn{color:var(--text-secondary);cursor:pointer;transition:var(--transition-bounce);background:#ffffff0a;border:1px solid #ffffff14;border-radius:30px;align-items:center;gap:.35rem;padding:.5rem 1rem;font-size:.9rem;display:flex}.tag-btn:hover{color:var(--primary);background:#a855f71a;border-color:#a855f74d;transform:translateY(-2px)}.tag-btn:active{transform:scale(.95)}.stage-section{flex-direction:column;min-height:250px;margin-bottom:3rem;display:flex}.joke-card{flex-direction:column;flex:1;justify-content:space-between;padding:2.5rem;display:flex;position:relative;overflow:visible}.joke-card:after{content:"";-webkit-mask-composite:xor;pointer-events:none;background:linear-gradient(135deg,#a855f74d,#22d3ee1a,#f43f5e4d);border-radius:20px;padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.joke-card-header{justify-content:space-between;align-items:center;width:100%;margin-bottom:1.5rem;display:flex}.model-badge{color:var(--text-secondary);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:30px;padding:.3rem .75rem;font-family:monospace;font-size:.8rem}.lang-indicator{color:var(--secondary);align-items:center;gap:.4rem;font-size:.85rem;display:flex}.joke-content-wrapper{flex:1;justify-content:center;align-items:center;padding:1.5rem 0;display:flex}.joke-text{text-align:center;color:var(--text-primary);font-size:1.6rem;font-weight:500;line-height:1.6;animation:.6s cubic-bezier(.16,1,.3,1) fadeIn}.joke-text.ar-text{font-size:1.9rem;font-weight:700;line-height:1.7}@keyframes fadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.joke-actions{border-top:1px solid #ffffff0d;justify-content:center;gap:.75rem;margin-top:1.5rem;padding-top:1.5rem;display:flex}.action-btn{color:var(--text-secondary);cursor:pointer;transition:var(--transition-bounce);background:#ffffff08;border:1px solid #ffffff0f;border-radius:12px;align-items:center;gap:.5rem;padding:.65rem 1.25rem;font-size:.9rem;display:inline-flex}.action-btn:hover{color:var(--text-primary);background:#ffffff14;border-color:#ffffff26;transform:translateY(-2px)}.action-btn:active{transform:scale(.97)}.action-btn.active-speak{color:var(--secondary);background:#22d3ee1a;border-color:#22d3ee4d;box-shadow:0 0 15px #22d3ee33}.empty-joke-state{text-align:center;color:var(--text-muted);flex-direction:column;align-items:center;gap:1rem;padding:3rem 1.5rem;display:flex}.empty-joke-icon{opacity:.4;font-size:3rem;animation:2.5s ease-in-out infinite pulseIcon}@keyframes pulseIcon{0%,to{opacity:.4;transform:scale(1)}50%{opacity:.6;transform:scale(1.08)}}.loader-wrapper{flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;padding:3rem 0;display:flex}.funny-loader{font-size:3.5rem;animation:1.2s cubic-bezier(.77,0,.175,1) infinite rollEmoji}@keyframes rollEmoji{0%{transform:rotate(0)scale(1)}50%{transform:rotate(180deg)scale(1.25)}to{transform:rotate(360deg)scale(1)}}.loading-bar-container{background:#ffffff0d;border-radius:10px;width:180px;height:4px;position:relative;overflow:hidden}.loading-bar-fill{background:linear-gradient(90deg, var(--primary), var(--secondary));border-radius:10px;width:70%;height:100%;animation:1.5s ease-in-out infinite slideLoading;position:absolute}@keyframes slideLoading{0%{width:30%;left:-100%}50%{width:60%}to{width:30%;left:100%}}.error-card{color:#fda4af;background:#f43f5e14;border:1px solid #f43f5e33;border-radius:16px;align-items:flex-start;gap:1rem;margin-bottom:2rem;padding:1.5rem 2rem;animation:.5s ease-in-out shake;display:flex}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.history-section{margin-top:1.5rem}.history-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.history-title{color:var(--text-primary);align-items:center;gap:.5rem;font-size:1.25rem;font-weight:600;display:flex}.clear-history-btn{color:var(--text-muted);cursor:pointer;transition:var(--transition-smooth);background:0 0;border:none;font-size:.85rem}.clear-history-btn:hover{color:var(--accent)}.history-list{flex-direction:column;gap:1rem;max-height:400px;padding-right:.5rem;display:flex;overflow-y:auto}.history-card{transition:var(--transition-smooth);background:#ffffff05;border:1px solid #ffffff0a;border-radius:14px;flex-direction:column;gap:.75rem;padding:1.25rem 1.5rem;display:flex}.history-card:hover{background:#ffffff0a;border-color:#ffffff14;transform:translate(2px)}.history-card-meta{color:var(--text-muted);justify-content:space-between;align-items:center;font-size:.75rem;display:flex}.history-card-tag{color:var(--primary);background:#a855f71a;border-radius:6px;padding:.15rem .5rem;font-weight:600}.history-card-text{color:var(--text-primary);font-size:1.15rem}.history-card-text.ar-text{font-size:1.35rem;font-weight:600}.app-footer{text-align:center;color:var(--text-muted);flex-direction:column;gap:.5rem;margin-top:auto;padding-top:4rem;font-size:.9rem;display:flex}.footer-link{color:var(--primary);transition:var(--transition-smooth);text-decoration:none}.footer-link:hover{color:var(--secondary);text-decoration:underline}@media (width<=640px){.logo-text{font-size:2.2rem}.logo-emoji{font-size:2rem}.search-form{flex-direction:column;gap:.5rem}.btn-primary{padding:1rem}.joke-card{padding:1.5rem}.joke-text{font-size:1.3rem}.joke-text.ar-text{font-size:1.6rem}}
