@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&family=Fraunces:opsz,wght@9..144,600;9..144,700&display=swap";:root{font-family:Space Grotesk,sans-serif;color:#e8f0fe;background:radial-gradient(ellipse at 20% 0%,rgba(59,130,246,.22),transparent 40%),radial-gradient(ellipse at 80% 10%,rgba(34,211,238,.14),transparent 35%),radial-gradient(ellipse at 50% 80%,rgba(99,102,241,.12),transparent 40%),linear-gradient(160deg,#020817,#060f24,#030b1a);--surface: rgba(14, 25, 50, .65);--surface-strong: rgba(8, 16, 34, .88);--border: rgba(99, 155, 246, .18);--border-subtle: rgba(255, 255, 255, .07);--accent: #3b82f6;--accent-bright: #60a5fa;--accent-alt: #22d3ee;--muted: rgba(186, 210, 254, .7);--shadow: 0 32px 80px rgba(2, 8, 23, .6);--glow: 0 0 40px rgba(59, 130, 246, .25)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}#root{min-height:100vh}.shell{position:relative;min-height:100vh;overflow:hidden;isolation:isolate;display:flex;flex-direction:column}.grain{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='1'/%3E%3C/svg%3E");background-repeat:repeat;background-size:200px 200px}.ambient{position:absolute;width:52rem;height:52rem;border-radius:999px;filter:blur(90px);opacity:.38;animation:drift 20s ease-in-out infinite}.ambient-left{top:-18rem;left:-16rem;background:#3b82f68c}.ambient-right{right:-18rem;bottom:-18rem;animation-delay:-8s;background:#22d3ee66}.layout{position:relative;z-index:1;width:min(1040px,calc(100% - 3rem));margin:0 auto;padding:3.5rem 0 5rem;flex:1}.hero-card{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:linear-gradient(140deg,#3b82f61a,#0e19320d),#0a122680;border:1px solid var(--border);border-radius:32px;box-shadow:var(--shadow),var(--glow);padding:4rem 4.5rem;text-align:center}.brand{display:inline-flex;align-items:center;gap:.45rem;margin:0 0 2rem;font-family:Fraunces,serif;font-size:1.05rem;font-weight:700;letter-spacing:.01em;color:var(--accent-bright);text-decoration:none;opacity:.9}.brand:before{content:"";display:block;width:8px;height:8px;border-radius:50%;background:var(--accent-alt);box-shadow:0 0 8px var(--accent-alt)}.brand:hover{opacity:1}.eyebrow{margin:0 0 .6rem;text-transform:uppercase;letter-spacing:.22em;font-size:.72rem;color:var(--accent-alt)}h1,h2,h3{margin:0;font-family:Fraunces,serif;line-height:1.05}h1{font-size:clamp(2.4rem,5vw,3.8rem);line-height:1.06;max-width:22ch;margin:0 auto;background:linear-gradient(135deg,#fff 20%,#93c5fd,#67e8f9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}h2{font-size:1.9rem}.lead{max-width:58ch;margin:1.2rem auto 0;color:var(--muted);font-size:1.08rem;line-height:1.75}.chips{margin-top:1.6rem;display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem}.chips span{border-radius:999px;border:1px solid rgba(99,155,246,.22);background:#3b82f614;color:#bfdbfe;font-size:.8rem;letter-spacing:.04em;padding:.45rem .85rem}.generator-form{margin:2.5rem auto 0;display:grid;gap:1rem;max-width:560px}.generator-form label{display:grid;gap:.45rem;text-align:left}.generator-form span{font-size:.92rem;color:var(--muted)}input{width:100%;padding:1rem 1.1rem;border-radius:16px;border:1px solid rgba(99,155,246,.2);background:var(--surface-strong);color:#e8f0fe;transition:border-color .18s ease,box-shadow .18s ease}input::placeholder{color:#bad2fe59}input:focus{outline:none;border-color:#60a5fa8c;box-shadow:0 0 0 3px #3b82f626}.actions{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center}button{border:0;border-radius:999px;padding:.95rem 1.5rem;cursor:pointer;transition:transform .18s ease,opacity .18s ease,box-shadow .18s ease}button:hover{transform:translateY(-2px)}button:disabled{opacity:.45;cursor:not-allowed;transform:none}.actions button:first-child{background:linear-gradient(120deg,#2563eb,#3b82f6,#60a5fa);color:#fff;font-weight:700;box-shadow:0 8px 28px #2563eb73}.actions button:first-child:hover:not(:disabled){box-shadow:0 12px 36px #2563eb8c}.secondary{background:#3b82f61a;color:#93c5fd;border:1px solid rgba(99,155,246,.22)}.secondary:hover{background:#3b82f62e}.feedback{margin:1rem auto 0;border-radius:14px;padding:.9rem 1rem;max-width:560px;text-align:left}.error{background:#dc262626;border:1px solid rgba(220,38,38,.3);color:#fca5a5}.result-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;display:grid;place-items:center;padding:1rem}.modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;border:0;padding:0;margin:0;border-radius:0;background:#020817cc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;transform:none!important}.modal-backdrop:hover{transform:none!important}.modal-backdrop:disabled{cursor:default}.modal-panel{position:relative;z-index:1;width:min(780px,100%);max-height:calc(100vh - 2rem);overflow:auto;border-radius:28px;border:1px solid rgba(99,155,246,.2);background:linear-gradient(150deg,#3b82f61a,#0e19320a),#070d1ef7;box-shadow:var(--shadow),var(--glow);padding:1.6rem;animation:modal-rise .24s cubic-bezier(.22,1,.36,1)}.modal-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.4rem}.close-button{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:2.4rem;height:2.4rem;padding:0;border-radius:50%;border:1px solid rgba(99,155,246,.2);background:#3b82f614;color:#93c5fd}.close-button:hover{background:#3b82f62e}.close-button-disabled{opacity:.45;cursor:progress}.close-button-disabled:hover{background:#3b82f614;transform:none}.close-button-disabled span{width:.7rem;height:.7rem;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor}.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}.modal-metrics{margin-top:0}.metrics article{padding:1.05rem;border-radius:18px;border:1px solid rgba(99,155,246,.14);background:#3b82f60f}.metrics span{display:block;color:var(--muted);margin-bottom:.5rem;font-size:.88rem}.metrics strong{font-size:1.9rem;color:#e0eeff}.modal-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.1rem}.modal-actions button:first-child{background:linear-gradient(120deg,#2563eb,#3b82f6,#60a5fa);color:#fff;font-weight:700;box-shadow:0 8px 28px #2563eb66}.copy-note{margin:.9rem 0 0;border-radius:12px;padding:.75rem .9rem;background:#22d3ee1a;border:1px solid rgba(34,211,238,.28);color:#a5f3fc;font-size:.91rem}.modal-status{margin:-.25rem 0 1rem;color:#bfdbfe;font-size:.95rem;line-height:1.6;word-break:break-word}.progress-metrics{margin-top:0}.progress-note{margin:.9rem 0 0;color:var(--muted);font-size:.92rem;line-height:1.7}.error-copy{margin:.8rem 0 1rem;color:#fca5a5;line-height:1.6}.xml-preview{margin-top:1.1rem;border-radius:18px;border:1px solid rgba(99,155,246,.14);background:#040914a6;overflow:hidden}.xml-preview-head{display:flex;align-items:center;padding:.75rem .9rem;border-bottom:1px solid rgba(99,155,246,.1)}.xml-preview h3{font-family:Space Grotesk,sans-serif;font-size:.82rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);line-height:1.4}.xml-preview pre{margin:0;max-height:280px;overflow:auto;padding:.9rem;color:#bfdbfe;font-size:.83rem;line-height:1.55;white-space:pre-wrap;word-break:break-all}.success-note{margin:1.1rem 0 0;border-radius:14px;background:#22d3ee17;border:1px solid rgba(34,211,238,.28);color:#a5f3fc;padding:.85rem 1rem}.issues{margin-top:1rem;padding:1rem;border-radius:18px;background:#3b82f60d;border:1px solid rgba(99,155,246,.1)}.issues h3{font-family:Space Grotesk,sans-serif;font-size:.82rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);line-height:1.4}.issues ul{list-style:none;padding:0;margin:.9rem 0 0;display:grid;gap:.75rem}.issues li{display:grid;gap:.2rem}.issues span{color:#fca5a5}.issues a{color:#67e8f9;word-break:break-all}@keyframes modal-rise{0%{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes drift{0%,to{transform:translateZ(0) scale(1)}50%{transform:translate3d(0,28px,0) scale(1.06)}}.faq-section{margin-top:3.5rem;padding:3rem 0}.faq-section h2{text-align:center;margin-bottom:2rem;font-size:2rem;background:linear-gradient(135deg,#fff 20%,#93c5fd,#67e8f9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.faq-container{display:grid;gap:1rem;max-width:800px;margin:0 auto}.faq-item{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:linear-gradient(140deg,#3b82f614,#0e193208),#0a122666;border:1px solid var(--border);border-radius:16px;padding:1.25rem;cursor:pointer;transition:all .2s ease}.faq-item:hover{background:linear-gradient(140deg,#3b82f61f,#0e19320d),#0a122680;border-color:#639bf647}.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;font-size:1.05rem;font-weight:600;color:#e0eeff;list-style:none;-webkit-user-select:none;user-select:none}.faq-item summary:before{content:"";display:inline-block;width:1.5rem;height:1.5rem;border:2px solid currentColor;border-radius:4px;flex-shrink:0;transition:transform .2s ease;background:linear-gradient(135deg,transparent 48%,currentColor 48%,currentColor 52%,transparent 52%),linear-gradient(45deg,transparent 48%,currentColor 48%,currentColor 52%,transparent 52%);background-size:100% 2px,2px 100%;background-position:center;background-repeat:no-repeat}.faq-item[open] summary:before{transform:rotate(180deg)}.faq-item[open]{background:linear-gradient(140deg,#3b82f626,#0e19320f),#0a12268c;border-color:#639bf659}.faq-item p{margin:1rem 0 0;color:var(--muted);line-height:1.7;font-size:.95rem}.faq-item p strong{color:#e0eeff;font-weight:600}@media (max-width: 720px){.layout{width:calc(100% - 1.5rem);padding:2rem 0 3.5rem}.hero-card{padding:2rem 1.5rem;border-radius:24px}h1{font-size:2.1rem}.metrics{grid-template-columns:1fr}.actions,.modal-actions{flex-direction:column}.actions button,.modal-actions button{width:100%}.modal-header{align-items:center}.modal-panel{padding:1.2rem;border-radius:22px}.faq-section{margin-top:2.5rem;padding:2rem 0}.faq-section h2{font-size:1.5rem;margin-bottom:1.5rem}.faq-item{padding:1rem;border-radius:14px}.faq-item summary{font-size:.95rem}.faq-item p{font-size:.9rem}}
