@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600&display=swap";:root{--purple:#a855f7;--purple-dark:#7c3aed;--purple-dim:#a855f726;--cyan:#22d3ee;--cyan-dim:#22d3ee26;--green:#4ade80;--red:#ef4444;--amber:#f59e0b;--bg:#030712;--bg-2:#0d1117;--surface:#ffffff08;--surface-hover:#ffffff0f;--border:#a855f72e;--border-subtle:#ffffff0f;--text:#f1f5f9;--text-muted:#94a3b8;--text-dim:#475569;--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--glow-purple:0 0 30px #a855f766;--glow-cyan:0 0 30px #22d3ee59;--shadow-card:0 8px 48px #0009, 0 1px 0 #ffffff0d inset}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;min-height:100vh;font-family:Inter,sans-serif;overflow-x:hidden}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#2d2d3a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--purple)}.page{flex-direction:column;align-items:center;min-height:100vh;padding:60px 20px 80px;display:flex;position:relative;overflow:hidden}.bg-mesh{z-index:0;background-color:var(--bg);background-image:linear-gradient(#a855f709 1px,#0000 1px),linear-gradient(90deg,#a855f709 1px,#0000 1px);background-size:44px 44px;animation:30s linear infinite meshDrift;position:fixed;inset:0}@keyframes meshDrift{0%{background-position:0 0}to{background-position:44px 44px}}.orb{filter:blur(130px);pointer-events:none;z-index:0;border-radius:50%;animation:10s ease-in-out infinite orbFloat;position:fixed}.orb-1{background:radial-gradient(circle,#7c3aed59,#0000 65%);width:560px;height:560px;top:-140px;left:-140px}.orb-2{background:radial-gradient(circle,#0e749047,#0000 65%);width:440px;height:440px;animation-delay:-5s;bottom:-100px;right:-100px}.orb-3{background:radial-gradient(circle,#a855f726,#0000 65%);width:300px;height:300px;animation-delay:-2.5s;top:50%;left:60%}@keyframes orbFloat{0%,to{transform:translateY(0)scale(1)}50%{transform:translateY(-40px)scale(1.06)}}.content{z-index:1;flex-direction:column;gap:32px;width:100%;max-width:740px;margin:0 auto;display:flex;position:relative}.header{text-align:center;flex-direction:column;align-items:center;gap:20px;display:flex}.badge{letter-spacing:.12em;text-transform:uppercase;color:var(--purple);background:var(--purple-dim);border:1px solid #a855f74d;border-radius:100px;align-items:center;gap:8px;padding:6px 16px;font-size:.7rem;font-weight:700;animation:3s ease-in-out infinite badgePulse;display:inline-flex}.badge-dot{background:var(--purple);border-radius:50%;width:6px;height:6px;animation:1.5s ease-in-out infinite ping}@keyframes ping{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.6)}}@keyframes badgePulse{0%,to{box-shadow:0 0 #a855f700}50%{box-shadow:0 0 12px #a855f740}}.title{letter-spacing:-.03em;background:linear-gradient(135deg,#c084fc 0%,#a855f7 30%,#22d3ee 70%,#67e8f9 100%) 0 0/200% 200%;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:clamp(2.6rem,6vw,4rem);font-weight:900;line-height:1.1;animation:5s infinite titleGradient}@keyframes titleGradient{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.subtitle{color:var(--text-muted);max-width:480px;font-size:1.05rem;font-weight:400;line-height:1.65}.stats-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:24px;display:flex}.stat-item{color:var(--text-dim);align-items:center;gap:6px;font-size:.8rem;display:flex}.stat-icon{font-size:1rem}.stat-dot{background:var(--text-dim);border-radius:50%;width:3px;height:3px}.card{background:var(--surface);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);padding:28px;transition:border-color .3s,box-shadow .3s}.card:hover{box-shadow:var(--shadow-card), 0 0 40px #a855f70f;border-color:#a855f74d}.terminal-bar{border-bottom:1px solid var(--border-subtle);align-items:center;gap:6px;margin-bottom:8px;padding-bottom:20px;display:flex}.dot-red{background:#ff5f57;border-radius:50%;width:12px;height:12px}.dot-yellow{background:#febc2e;border-radius:50%;width:12px;height:12px}.dot-green{background:#28c840;border-radius:50%;width:12px;height:12px}.terminal-label{color:var(--text-dim);letter-spacing:.02em;margin-left:10px;font-family:JetBrains Mono,monospace;font-size:.72rem}.form{flex-direction:column;gap:18px;display:flex}.field{flex-direction:column;gap:8px;display:flex}.label{color:var(--text-muted);letter-spacing:.04em;text-transform:uppercase;font-size:.82rem;font-weight:600}.textarea{border-radius:var(--radius-md);width:100%;color:var(--text);resize:none;background:#00000073;border:1px solid #a855f740;min-height:110px;padding:14px 18px;font-family:Inter,sans-serif;font-size:1rem;line-height:1.6;transition:border-color .25s,box-shadow .25s}.textarea::placeholder{color:var(--text-dim)}.textarea:focus{border-color:var(--purple);box-shadow:var(--glow-purple);outline:none}.textarea:disabled{opacity:.5;cursor:not-allowed}.field-footer{justify-content:space-between;align-items:center;font-size:.75rem;display:flex}.hint{color:var(--text-dim)}.char-count{color:var(--text-dim);font-variant-numeric:tabular-nums}.char-count.warn{color:var(--amber)}.char-count.danger{color:var(--red)}.btn-row{align-items:stretch;gap:12px;display:flex}.btn-generate{border-radius:var(--radius-md);letter-spacing:.03em;color:#fff;cursor:pointer;background:linear-gradient(135deg,#7c3aed 0%,#a855f7 50%,#22d3ee 100%) 0 0/200% 200%;border:none;flex:1;justify-content:center;align-items:center;gap:10px;padding:15px 28px;font-family:Inter,sans-serif;font-size:1rem;font-weight:700;transition:transform .2s,box-shadow .2s;animation:3s infinite btnGradient;display:flex;position:relative;overflow:hidden}@keyframes btnGradient{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.btn-generate:after{content:"";background:#fff0;transition:background .2s;position:absolute;inset:0}.btn-generate:hover:not(:disabled):after{background:#ffffff1a}.btn-generate:active:not(:disabled):after{background:#ffffff2e}.btn-generate:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 30px #a855f773}.btn-generate:active:not(:disabled){transform:translateY(0)}.btn-generate:disabled{opacity:.45;cursor:not-allowed;background:linear-gradient(135deg,#3b1f6e,#4c2a8a);background-size:unset;animation:none}.btn-clear{border-radius:var(--radius-md);border:1px solid var(--border-subtle);color:var(--text-dim);cursor:pointer;background:#ffffff08;padding:15px 20px;font-family:Inter,sans-serif;font-size:.9rem;font-weight:500;transition:all .2s}.btn-clear:hover{color:var(--text-muted);background:#ffffff0f;border-color:#ffffff1f}.spinner{border:2px solid #ffffff40;border-top-color:#fff;border-radius:50%;flex-shrink:0;width:18px;height:18px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.skeleton-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);flex-direction:column;gap:14px;padding:28px;animation:.4s fadeSlideIn;display:flex}.skeleton-header{align-items:center;gap:10px;margin-bottom:6px;display:flex}.skeleton-pulse{background:var(--purple);border-radius:50%;width:10px;height:10px;animation:1.2s ease-in-out infinite ping}.skeleton-label{color:var(--purple);text-transform:uppercase;letter-spacing:.1em;font-size:.8rem;font-weight:600}.skeleton-line{background:linear-gradient(90deg,#a855f712 25%,#a855f733 50%,#a855f712 75%) 0 0/200% 100%;border-radius:6px;height:14px;animation:1.6s ease-in-out infinite shimmer}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.output-card{background:var(--surface);border-radius:var(--radius-xl);box-shadow:var(--shadow-card), 0 0 40px #22d3ee0d;border:1px solid #22d3ee33;flex-direction:column;gap:16px;padding:28px;animation:.45s cubic-bezier(.22,1,.36,1) fadeSlideIn;display:flex}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.output-header{justify-content:space-between;align-items:center;display:flex}.output-label{align-items:center;gap:8px;display:flex}.output-tag{text-transform:uppercase;letter-spacing:.12em;color:var(--cyan);font-size:.72rem;font-weight:700}.output-word-count{color:var(--text-dim);font-size:.75rem}.btn-copy{border-radius:var(--radius-sm);color:var(--cyan);letter-spacing:.04em;cursor:pointer;background:#22d3ee14;border:1px solid #22d3ee4d;align-items:center;gap:6px;padding:7px 16px;font-family:Inter,sans-serif;font-size:.78rem;font-weight:600;transition:all .2s;display:flex}.btn-copy:hover{box-shadow:var(--glow-cyan);background:#22d3ee2e}.btn-copy.copied{color:var(--green);background:#4ade801a;border-color:#4ade8066}.output-text{color:#dde8f8;border-radius:var(--radius-md);word-break:break-word;background:#0000008c;border:1px solid #22d3ee1f;padding:20px 22px;font-family:JetBrains Mono,monospace;font-size:.9rem;line-height:1.8}.output-hint{color:var(--text-dim);text-align:right;font-size:.75rem}.error-banner{border-radius:var(--radius-md);color:#fca5a5;background:#ef444417;border:1px solid #ef444447;align-items:flex-start;gap:12px;padding:14px 18px;font-size:.88rem;animation:.3s fadeSlideIn;display:flex}.error-icon{flex-shrink:0;margin-top:1px;font-size:1.1rem}.features-row{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.feature-pill{border:1px solid var(--border-subtle);background:var(--surface);color:var(--text-muted);cursor:default;border-radius:100px;align-items:center;gap:7px;padding:8px 16px;font-size:.8rem;font-weight:500;transition:all .2s;display:flex}.feature-pill:hover{border-color:var(--border);background:var(--surface-hover);color:var(--text)}.pill-icon{font-size:1rem}.footer{text-align:center;color:var(--text-dim);flex-direction:column;gap:6px;font-size:.78rem;display:flex}.footer-logo{background:linear-gradient(135deg, var(--purple), var(--cyan));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:.85rem;font-weight:700}.footer-stack{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.stack-tag{border:1px solid var(--border-subtle);background:var(--surface);color:var(--text-dim);border-radius:100px;padding:3px 10px;font-size:.72rem;font-weight:500}@media (width<=600px){.page{padding:40px 16px 60px}.card,.output-card,.skeleton-card{padding:20px}.title{font-size:2.2rem}.stats-row{gap:14px}.btn-generate{padding:14px 20px;font-size:.95rem}}