.nfaf-app{margin:1.5rem 0;padding:1.25rem;border:1px solid #e5e7eb;border-radius:18px;background:#fff;box-shadow:0 10px 30px rgba(15,23,42,.06)}
.nfaf-tool-controls{display:grid;gap:1rem;margin:1rem 0}.nfaf-control{display:grid;gap:.45rem;color:#334155;font-weight:650}.nfaf-control input,.nfaf-control textarea,.nfaf-control select{width:100%;box-sizing:border-box;border:1px solid #cbd5e1;border-radius:10px;padding:.75rem;background:#fff;color:#0f172a;font:inherit}.nfaf-control textarea{min-height:150px;resize:vertical}.nfaf-control input[type=color]{height:3rem;padding:.25rem}.nfaf-control-row{display:flex;gap:.75rem;flex-wrap:wrap;align-items:center}.nfaf-app .button{border:0;border-radius:10px;padding:.7rem 1rem;background:#4f46e5;color:#fff;font-weight:750;cursor:pointer}.nfaf-app .button.secondary{background:#e2e8f0;color:#1e293b}.nfaf-app .button:hover{filter:brightness(.95)}.nfaf-result{min-height:3rem;margin-top:1rem;padding:1rem;border-left:4px solid #4f46e5;border-radius:10px;background:#f8fafc;white-space:pre-wrap;overflow:auto;color:#0f172a}.nfaf-result.is-error{border-left-color:#dc2626;background:#fff1f2;color:#991b1b}.nfaf-preview{padding:1rem;border:1px solid #e2e8f0;border-radius:12px;background:#f8fafc}.nfaf-live-count{padding:.75rem;border-radius:10px;background:#eef2ff;color:#3730a3;font-weight:700}.nfaf-generated-content{margin-top:2rem}.nfaf-visual-card{display:flex;gap:1rem;align-items:center;margin:0 0 1.5rem;padding:1rem 1.15rem;border:1px solid color-mix(in srgb,var(--nfaf-accent) 25%,#e2e8f0);border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--nfaf-accent) 10%,#fff),#fff)}.nfaf-visual-icon{width:3rem;height:3rem;flex:0 0 3rem;color:var(--nfaf-accent)}.nfaf-visual-icon svg{width:100%;height:100%}.nfaf-visual-card strong,.nfaf-visual-card span{display:block}.nfaf-visual-card span{margin-top:.25rem;color:#64748b;font-size:.92rem}.nfaf-related-tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.75rem;padding:0;list-style:none}.nfaf-related-tools li{padding:1rem;border:1px solid #e2e8f0;border-radius:12px;background:#f8fafc}.nfaf-related-tools a{display:block;font-weight:750}.nfaf-related-tools span{display:block;margin-top:.35rem;color:#64748b;font-size:.9rem}.nfaf-result-card{display:grid;gap:.5rem}.nfaf-secret{padding:1rem;border-radius:10px;background:#0f172a;color:#e0e7ff;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;word-break:break-all}.nfaf-contrast-card{display:grid;gap:.75rem}.nfaf-contrast-swatch{padding:2rem;border-radius:12px;text-align:center;font-size:1.25rem;font-weight:800}.nfaf-generated-content .nfaf-disclosure{padding:1rem;border-left:3px solid #94a3b8;background:#f8fafc;color:#475569;font-size:.92rem}.nfaf-diff-output{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9rem;line-height:1.55}.nfaf-diff-output>div{padding:.18rem .45rem;white-space:pre-wrap}.nfaf-diff-same{color:#475569}.nfaf-diff-added{background:#ecfdf5;color:#166534}.nfaf-diff-removed{background:#fff1f2;color:#991b1b}.nfaf-palette-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.75rem}.nfaf-palette-card{display:grid;gap:.35rem;padding:.55rem;border:1px solid #e2e8f0;border-radius:10px;background:#fff}.nfaf-palette-card>span{display:block;min-height:3.5rem;border-radius:7px;border:1px solid rgba(15,23,42,.12)}.nfaf-palette-card strong{font-size:.85rem}.nfaf-palette-card code{font-size:.8rem}.nfaf-placeholder-output{display:grid;gap:.85rem}.nfaf-placeholder-output p{margin:0}.nfaf-gradient-preview{min-height:150px;margin-bottom:1rem;border-radius:12px;border:1px solid rgba(15,23,42,.12)}.nfaf-result pre{margin:0;padding:.9rem;border-radius:9px;background:#0f172a;color:#e2e8f0;white-space:pre-wrap;overflow:auto}.nfaf-result .button{display:inline-flex;text-decoration:none}.nfaf-result .button:hover{color:#fff}.nfaf-xml-output,.nfaf-sql-output{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.nfaf-control-file{display:grid;gap:.45rem;color:#334155;font-weight:650}.nfaf-control-file input{padding:.55rem;border:1px solid #cbd5e1;border-radius:10px;background:#fff;font:inherit}@media(max-width:640px){.nfaf-app{padding:1rem}.nfaf-control-row{display:grid}.nfaf-control-row .button{width:100%}.nfaf-visual-card{align-items:flex-start}.nfaf-related-tools{grid-template-columns:1fr}}
