.app{text-align:center}.app-header{background-color:var(--neutral-900);min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:calc(10px + 2vmin);color:var(--neutral-100)}.app-logo{width:244px;height:244px;margin-bottom:2rem}h1{font-size:2rem;color:var(--neutral-100);margin:0}.tagline{color:var(--primary-600);font-size:1.2rem;margin-top:.5rem;font-weight:400;letter-spacing:.5px}:root{--primary-bg: #181C20;--secondary-bg: #121212;--border-color: #333333;--border-color-secondary: #2C2C2C;--primary-100: #E4FCFD;--primary-200: #C2F6F9;--primary-300: #9EF2F5;--primary-400: #78ECF0;--primary-500: #55EDF5;--primary-600: #37CED6;--primary-700: #22A3AB;--primary-800: #16747C;--primary-900: #0C4951;--primary-light: var(--primary-900);--primary-dark: var(--primary-500);--secondary-100: #F7F7F7;--secondary-200: #E4E4E4;--secondary-300: #D1D1D1;--secondary-400: #B8B8B8;--secondary-500: #999999;--secondary-600: #7A7A7A;--secondary-700: #5C5C5C;--secondary-800: #3A4553;--secondary-900: #1A1F2E;--neutral-100: #F3F4F5;--neutral-200: #E2E3E4;--neutral-300: #CBCDCF;--neutral-400: #ABAEB0;--neutral-500: #6B6F72;--neutral-600: #505357;--neutral-700: #3B3D40;--neutral-800: #2A2B2D;--neutral-900: #1C1D1E;--neutral-50: #FAFBFC;--success-300: #A3DFC6;--success-400: #68C6A4;--success-500: #42B883;--success-600: #2A8062;--success-700: #1E5C46;--error-300: #FCA5A5;--error-400: #F87171;--error-500: #EF4444;--error-600: #DC2626;--error-700: #B91C1C;--amber-300: #FCD34D;--amber-400: #FBBF24;--amber-500: #F59E0B;--amber-600: #D97706;--amber-700: #B45309}body{margin:0;background-color:var(--primary-bg);color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}#root{min-height:100vh}.color-swatch-container{margin-top:2rem;padding:1.5rem;background:var(--neutral-800);border-radius:12px;max-width:800px;margin-left:auto;margin-right:auto;box-shadow:0 2px 8px #00000014}.color-category{margin-bottom:2rem}.color-category h3{color:var(--neutral-100);font-size:1.1rem;margin-bottom:.5rem;font-weight:600;letter-spacing:.5px}.swatch-row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start}.swatch{width:110px;height:60px;border-radius:8px;box-sizing:border-box;box-shadow:0 1px 3px #00000012;margin-bottom:4px;border:1px solid var(--border-color-secondary)}.swatch-info{width:110px;display:flex;flex-direction:column;align-items:center;justify-content:center;margin-bottom:8px}.swatch-label{font-size:.75rem;color:var(--neutral-100);font-weight:500}.swatch-value{font-size:.7rem;color:var(--neutral-400);font-family:monospace}.swatch-row-label{min-width:70px;display:inline-flex;align-items:center;font-size:.9rem;font-weight:600;color:var(--neutral-100);margin-right:12px}.swatch-cell{display:flex;flex-direction:column;align-items:center}.ff-input-group{display:flex;flex-direction:column;gap:12px;width:100%}.ff-input-label{text-align:left;align-self:flex-start}.ff-input{width:100%;padding:12px 16px;background:var(--neutral-900);border:1.5px solid var(--neutral-700);border-radius:12px;color:var(--neutral-100);font-size:16px;font-family:inherit;outline:none;transition:border-color .2s,box-shadow .2s;box-sizing:border-box}.ff-input:focus{border-color:var(--primary-600);box-shadow:0 0 0 2px var(--primary-800)}.ff-input::placeholder{color:var(--neutral-500);opacity:1}
