:root{--color-primary:#f24e1e;--color-secondary:#ce5032;--color-white:#fff;--color-bg-secondary:#f7f7f7;--color-text-muted:#717171;--color-text-main:#333;--color-success:#25d366;--font-sans:"Inter", system-ui, -apple-system, sans-serif;--transition-smooth:all .2s ease-in-out}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;font-family:var(--font-sans);color:var(--color-text-main);background-color:var(--color-white);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{flex-direction:column;display:flex}a{color:var(--color-primary);transition:var(--transition-smooth);text-decoration:none}a:hover{color:var(--color-secondary)}h1,h2,h3,h4,h5,h6{color:var(--color-text-main);font-weight:800}.typo-label-large{text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted);font-size:.875rem;font-weight:600}.typo-body-small{color:var(--color-text-muted);font-size:.8125rem}.btn{text-transform:uppercase;letter-spacing:.03em;cursor:pointer;transition:var(--transition-smooth);box-shadow:none;border:none;border-radius:9999px;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-size:.9375rem;font-weight:600;text-decoration:none;display:inline-flex}.btn-primary{background-color:var(--color-primary);color:var(--color-white)}.btn-primary:hover{background-color:var(--color-secondary);color:var(--color-white)}.btn-secondary{background-color:var(--color-white);color:var(--color-primary);border:2px solid var(--color-primary)}.btn-secondary:hover{background-color:var(--color-primary);color:var(--color-white)}.btn-danger{color:var(--color-white);background-color:#e11d48}.btn-danger:hover{background-color:#be123c}.btn-ghost{color:var(--color-text-muted);background-color:#0000;border:none}.btn-ghost:hover{background-color:var(--color-bg-secondary);color:var(--color-text-main)}.form-group{flex-direction:column;gap:6px;margin-bottom:20px;display:flex}.form-label{color:var(--color-text-main);font-size:.875rem;font-weight:600}.form-input{background-color:var(--color-bg-secondary);color:var(--color-text-main);transition:var(--transition-smooth);border:1px solid #e5e7eb;border-radius:12px;outline:none;padding:12px 16px;font-size:.9375rem}.form-input:focus{border-color:var(--color-primary);background-color:var(--color-white);box-shadow:0 0 0 2px #f24e1e1a}.form-input::placeholder{color:#a3a3a3}.card-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;display:grid}.recipe-card{background-color:var(--color-white);transition:var(--transition-smooth);border:1px solid #eaeaea;border-radius:16px;flex-direction:column;display:flex;overflow:hidden;box-shadow:0 2px 8px #0000000a}.recipe-card:hover{transform:translateY(-4px);box-shadow:0 10px 20px #00000014}.recipe-card-img{object-cover:cover;object-fit:cover;width:100%;height:180px}.recipe-card-content{flex-direction:column;flex-grow:1;gap:8px;padding:20px;display:flex}.recipe-card-title{color:var(--color-text-main);font-size:1.125rem;font-weight:700}.recipe-card-desc{color:var(--color-text-muted);flex-grow:1;font-size:.875rem;line-height:1.4}.recipe-card-meta{color:var(--color-text-muted);border-top:1px solid #eaeaea;justify-content:space-between;align-items:center;margin-top:8px;padding-top:12px;font-size:.8125rem;display:flex}.app-container{min-height:100vh;display:flex}.main-content{background-color:var(--color-bg-secondary);flex-direction:column;flex-grow:1;min-height:100vh;margin-left:280px;display:flex}.content-padding{flex-grow:1;padding:40px}@media (max-width:768px){.app-container{flex-direction:column}.main-content{margin-left:0}.content-padding{padding:20px}}.modal-overlay{z-index:1000;background-color:#00000080;justify-content:center;align-items:center;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.modal-content{background-color:var(--color-white);border-radius:16px;flex-direction:column;gap:20px;width:100%;max-width:500px;padding:30px;animation:.2s ease-out slideUp;display:flex;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}