:root{--primary:#10b981;--primary-dark:#059669;--primary-light:#34d399;--accent:#f59e0b;--accent-dark:#d97706;--accent-light:#fbbf24;--bg:#fff;--bg-secondary:#f9fafb;--text:#111827;--text-secondary:#6b7280;--border:#e5e7eb;--error:#ef4444;--shadow:#0000001a}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--text);background:var(--bg-secondary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.6}#root{flex-direction:column;min-height:100vh;display:flex}.app-header{background:var(--primary);color:#fff;box-shadow:0 2px 4px var(--shadow);z-index:100;padding:1rem;position:sticky;top:0}.header-content{align-items:center;gap:1rem;max-width:1200px;margin:0 auto;display:flex}.back-button{color:#fff;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:.25rem;font-size:1.5rem;transition:opacity .2s;display:flex}.back-button:hover{opacity:.8}.header-title{font-size:1.5rem;font-weight:600}.app-content{flex:1;width:100%;max-width:1200px;margin:0 auto;padding:2rem 1rem}.button{cursor:pointer;border:none;border-radius:.5rem;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-size:1rem;font-weight:500;text-decoration:none;transition:all .2s;display:inline-flex}.button-primary{background:var(--primary);color:#fff}.button-primary:hover{background:var(--primary-dark);box-shadow:0 4px 6px var(--shadow);transform:translateY(-1px)}.button-accent{background:var(--accent);color:#fff}.button-accent:hover{background:var(--accent-dark);box-shadow:0 4px 6px var(--shadow);transform:translateY(-1px)}.button-secondary{background:var(--bg);color:var(--text);border:1px solid var(--border)}.button-secondary:hover{background:var(--bg-secondary)}.button-danger{background:var(--error);color:#fff}.button-danger:hover{background:#dc2626}.input,.textarea,.select{border:1px solid var(--border);border-radius:.5rem;width:100%;padding:.75rem;font-family:inherit;font-size:1rem;transition:border-color .2s}.input:focus,.textarea:focus,.select:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 3px #10b9811a}.textarea{resize:vertical;min-height:100px}.search-bar{margin-bottom:2rem;position:relative}.search-input{padding-left:2.5rem}.search-icon{color:var(--text-secondary);pointer-events:none;position:absolute;top:50%;left:.75rem;transform:translateY(-50%)}.recipe-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem;margin-top:2rem;display:grid}.recipe-card{background:var(--bg);border:1px solid var(--border);cursor:pointer;box-shadow:0 1px 3px var(--shadow);border-radius:.75rem;padding:1.5rem;transition:all .2s}.recipe-card:hover{box-shadow:0 4px 12px var(--shadow);border-color:var(--primary);transform:translateY(-2px)}.recipe-card-title{color:var(--text);margin-bottom:.5rem;font-size:1.25rem;font-weight:600}.recipe-card-description{color:var(--text-secondary);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:1rem;display:-webkit-box;overflow:hidden}.recipe-card-meta{color:var(--text-secondary);gap:1rem;margin-bottom:1rem;font-size:.875rem;display:flex}.recipe-card-tags{flex-wrap:wrap;gap:.5rem;display:flex}.tag{background:var(--primary-light);color:var(--primary-dark);border-radius:1rem;padding:.25rem .75rem;font-size:.875rem;font-weight:500}.empty-state{text-align:center;padding:4rem 2rem}.empty-state-icon{margin-bottom:1rem;font-size:4rem}.empty-state-title{margin-bottom:.5rem;font-size:1.5rem;font-weight:600}.empty-state-text{color:var(--text-secondary);margin-bottom:2rem}.form-group{margin-bottom:1.5rem}.form-label{margin-bottom:.5rem;font-weight:500;display:block}.form-hint{color:var(--text-secondary);margin-top:.25rem;font-size:.875rem}.list-input-group{margin-bottom:1.5rem}.list-items{flex-direction:column;gap:.5rem;margin-bottom:.75rem;display:flex}.list-item{align-items:center;gap:.5rem;display:flex}.list-item-input{flex:1}.icon-button{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:.25rem;justify-content:center;align-items:center;padding:.5rem;font-size:1.25rem;transition:all .2s;display:flex}.icon-button:hover{background:var(--bg-secondary);color:var(--text)}.icon-button-danger:hover{color:var(--error);background:#ef44441a}.recipe-detail{background:var(--bg);box-shadow:0 1px 3px var(--shadow);border-radius:.75rem;padding:2rem}.recipe-header{border-bottom:1px solid var(--border);margin-bottom:2rem;padding-bottom:1.5rem}.recipe-title{margin-bottom:.5rem;font-size:2rem;font-weight:700}.recipe-description{color:var(--text-secondary);margin-bottom:1rem;font-size:1.125rem}.recipe-meta{gap:2rem;margin-bottom:1rem;display:flex}.recipe-meta-item{align-items:center;gap:.5rem;font-size:.875rem;display:flex}.recipe-meta-label{font-weight:600}.recipe-tags{flex-wrap:wrap;gap:.5rem;display:flex}.recipe-section{margin-bottom:2rem}.recipe-section-title{color:var(--primary);margin-bottom:1rem;font-size:1.5rem;font-weight:600}.ingredients-list,.steps-list{padding:0;list-style:none}.ingredient-item,.step-item{background:var(--bg-secondary);border-radius:.5rem;align-items:flex-start;gap:.75rem;margin-bottom:.5rem;padding:.75rem;display:flex}.ingredient-bullet,.step-number{background:var(--primary);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:1.5rem;height:1.5rem;font-size:.875rem;font-weight:600;display:flex}.action-buttons{border-top:1px solid var(--border);flex-wrap:wrap;gap:1rem;padding-top:1.5rem;display:flex}.form-actions{border-top:1px solid var(--border);justify-content:flex-end;gap:1rem;padding-top:1.5rem;display:flex}@media (width<=768px){.recipe-grid{grid-template-columns:1fr}.recipe-meta{flex-direction:column;gap:.5rem}.action-buttons,.form-actions{flex-direction:column}.button{justify-content:center;width:100%}}