@layer properties,theme,base,components,utilities,site-patterns,site-components;@layer site-components{.ft-hero{position:relative;overflow:hidden;padding:calc(var(--nav-height) + var(--space-20)) 0 var(--space-12);text-align:center}.ft-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% -20%,color-mix(in srgb,var(--color-accent-brand) 22%,transparent),transparent 62%);pointer-events:none}.ft-hero>.container{position:relative}.ft-eyebrow{display:inline-flex;align-items:center;gap:var(--space-2);margin:0;padding:var(--space-1) var(--space-3);border-radius:var(--radius-sm);background:var(--color-surface-overlay-subtle);font-size:13px;color:var(--color-text-tertiary)}.ft-eyebrow-dot{width:8px;height:8px;border-radius:var(--radius-full);background:var(--color-accent-success)}.ft-hero h1{margin:var(--space-6) 0 var(--space-5);font-size:var(--text-h1);font-weight:500;letter-spacing:-.02em;line-height:1.05;color:var(--color-text-primary);text-wrap:balance}.ft-lede{max-width:620px;margin:0 auto;font-size:var(--text-body);line-height:1.6;color:var(--color-text-secondary);text-wrap:pretty}@media(max-width:520px){.ft-hero{padding:calc(var(--nav-height) + var(--space-12)) 0 var(--space-8)}.ft-hero h1{font-size:var(--text-h2)}}}@layer properties,theme,base,components,utilities,site-patterns,site-components;@layer site-components{.ft-tools-section{padding:var(--space-8) 0 var(--space-20)}.ft-toolbar{position:sticky;top:calc(var(--nav-height) + var(--space-3));z-index:var(--z-raised);display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-6);max-width:880px;margin:0 auto var(--space-8);padding:var(--space-4) var(--space-6);border:1px solid var(--color-border-muted);border-radius:var(--radius-md);background:var(--glass-bg);backdrop-filter:var(--glass-blur-sm);-webkit-backdrop-filter:var(--glass-blur-sm)}.ft-marketplace{display:flex;flex:0 0 280px;flex-direction:column;gap:var(--space-1)}.ft-marketplace label{font-size:13px;font-weight:500;color:var(--color-text-secondary)}.ft-select{position:relative}.ft-select select{appearance:none;width:100%;min-height:44px;padding:var(--space-2) var(--space-8) var(--space-2) 0;background:transparent;border:0;border-bottom:1px solid var(--color-border-strong);border-radius:0;font:inherit;font-size:17px;color:var(--color-text-primary);cursor:pointer;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.ft-select select:hover{border-bottom-color:var(--color-text-tertiary)}.ft-select select:focus-visible{outline:none;border-bottom-color:var(--color-accent-brand);box-shadow:0 1px 0 0 var(--color-accent-brand)}.ft-select-chevron{position:absolute;top:50%;right:0;width:16px;height:16px;transform:translateY(-50%);color:var(--color-text-secondary);pointer-events:none}.ft-toolbar-hint{max-width:42ch;margin:0;font-size:13px;color:var(--color-text-tertiary);text-align:right}.ft-tools{display:grid;gap:var(--space-6);max-width:880px;margin:0 auto}.ft-tool{background:var(--color-surface-overlay-muted);border:1px solid var(--color-border-muted);border-radius:var(--radius-md);padding:var(--space-8);scroll-margin-top:calc(var(--nav-height) + var(--space-6));text-align:left}.ft-tool-head{display:flex;align-items:baseline;gap:var(--space-3);margin:0 0 var(--space-2)}.ft-tool-num{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;letter-spacing:.04em;color:var(--color-text-tertiary)}.ft-tool-title{margin:0;font-size:var(--text-h3);font-weight:500;letter-spacing:-.02em;line-height:1.2;color:var(--color-text-primary)}.ft-tool-desc{margin:0 0 var(--space-3);max-width:62ch;font-size:15px;line-height:1.6;color:var(--color-text-secondary);text-wrap:pretty}.ft-tool-example{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--space-2);margin:0 0 var(--space-6);font-size:13px;color:var(--color-text-tertiary)}.ft-tool-example code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:var(--color-text-secondary);overflow-wrap:anywhere}.ft-notice,.ft-hint-lead{margin:calc(-1 * var(--space-3)) 0 var(--space-6);font-size:13px;color:var(--color-text-tertiary)}.ft-hint-lead{line-height:1.5}.ft-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5) var(--space-6)}.ft-field{display:flex;flex-direction:column}.ft-field-wide,.ft-form .ft-generate{grid-column:1 / -1}.ft-field label{margin-bottom:var(--space-1);font-size:13px;font-weight:500;color:var(--color-text-secondary)}.ft-optional{font-weight:400;color:var(--color-text-tertiary)}.ft-field input,.ft-field textarea,.ft-output-field{width:100%;min-height:44px;padding:var(--space-2) 0;background:transparent;border:0;border-bottom:1px solid var(--color-border-strong);border-radius:0;font-family:var(--font-sans);font-size:17px;line-height:normal;color:var(--color-text-primary);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.ft-field textarea{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:15px;line-height:1.5;resize:vertical}.ft-field input:hover,.ft-field textarea:hover{border-bottom-color:var(--color-text-tertiary)}.ft-field input:focus-visible,.ft-field textarea:focus-visible,.ft-output-field:focus-visible{outline:none;border-bottom-color:var(--color-accent-brand);box-shadow:0 1px 0 0 var(--color-accent-brand)}.ft-field.is-invalid input,.ft-field.is-invalid textarea{border-bottom-color:var(--color-accent-danger)}.ft-hint{margin:var(--space-1) 0 0;font-size:13px;line-height:1.5;color:var(--color-text-tertiary)}.ft-error{margin:var(--space-1) 0 0;font-size:13px;color:var(--color-text-danger)}.ft-generate{justify-self:start;display:inline-flex;align-items:center;min-height:44px;margin-top:var(--space-2)}.ft-generate,.ft-output-actions .btn-primary{line-height:normal}.ft-output{margin-top:var(--space-6);padding-top:var(--space-6);border-top:1px solid var(--color-border-subtle)}.ft-output label{display:block;margin-bottom:var(--space-1);font-size:13px;font-weight:500;color:var(--color-text-secondary)}.ft-output-field{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px}.ft-output-actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-4)}.ft-output-actions .btn-primary,.ft-output-actions .btn-outline{display:inline-flex;align-items:center;min-height:44px}@media(max-width:760px){.ft-toolbar{flex-direction:column;align-items:stretch}.ft-marketplace{flex-basis:auto}.ft-toolbar-hint{max-width:none;text-align:left}}@media(max-width:520px){.ft-tools-section{padding:var(--space-4) 0 var(--space-12)}.ft-tool{padding:var(--space-5)}.ft-form{grid-template-columns:minmax(0,1fr)}.ft-output-actions{flex-direction:column;align-items:stretch}.ft-output-actions .btn-primary,.ft-output-actions .btn-outline{justify-content:center}}}@layer properties,theme,base,components,utilities,site-patterns,site-components;@layer site-components{.ft-guide,.ft-faq{padding:var(--space-20) 0;border-top:1px solid var(--color-border-subtle)}.ft-section-header{margin-bottom:var(--space-12)}.ft-guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-10) var(--space-12);max-width:960px;margin:0 auto}.ft-guide-item h3{margin:0 0 var(--space-2);font-size:var(--text-h4);font-weight:500;color:var(--color-text-primary)}.ft-guide-item h3 a{color:inherit;text-decoration:none}.ft-guide-item h3 a:hover,.ft-guide-item h3 a:focus-visible{text-decoration:underline}.ft-guide-item p{margin:0 0 var(--space-3);font-size:15px;line-height:1.7;color:var(--color-text-secondary);text-wrap:pretty}@media(max-width:760px){.ft-guide-grid{grid-template-columns:minmax(0,1fr)}}@media(max-width:520px){.ft-guide,.ft-faq{padding:var(--space-12) 0}}}@layer properties,theme,base,components,utilities,site-patterns,site-components;@layer site-components{.ft-faq-list{max-width:760px;margin:0 auto;border-top:1px solid var(--color-border-muted)}.ft-faq-item{border-bottom:1px solid var(--color-border-muted)}.ft-faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);min-height:44px;padding:var(--space-4) 0;cursor:pointer;list-style:none}.ft-faq-item summary::-webkit-details-marker{display:none}.ft-faq-item summary:focus-visible{outline:2px solid var(--color-accent-brand);outline-offset:2px}.ft-faq-item h3{margin:0;font-size:16px;font-weight:500;color:var(--color-text-primary)}.ft-faq-icon{color:var(--color-text-tertiary);transition:transform var(--transition-fast)}.ft-faq-item[open] .ft-faq-icon{transform:rotate(45deg)}.ft-faq-item p{margin:0 0 var(--space-4);font-size:15px;line-height:1.7;color:var(--color-text-secondary)}}
