*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-tap-highlight-color:transparent}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:linear-gradient(135deg,#ffecd2,#fcb69f);background-attachment:fixed;color:#333;min-height:100vh;padding-bottom:100px;overflow-x:hidden}button{font-family:inherit;cursor:pointer;border:none;background:none}input,textarea,select{font-family:inherit;font-size:1rem}[x-cloak]{display:none!important}.app-header{background:#fff;border-radius:0 0 16px 16px;box-shadow:0 2px 10px #0000001a;text-align:center;padding:16px 20px;position:sticky;top:0;z-index:100}.app-header__title{font-size:22px;font-weight:700}.app-header__subtitle{font-size:13px;color:#999;margin-top:2px}.app-header__logout{position:absolute;top:50%;right:12px;transform:translateY(-50%);font-size:18px;color:#999;padding:8px;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer}.app-header__logout:hover{color:#333}.card{background:#fff;border-radius:16px;box-shadow:0 2px 10px #0000001a;padding:20px}.login{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px}.login__card{background:#fff;border-radius:16px;box-shadow:0 2px 10px #0000001a;padding:32px 24px;width:100%;max-width:360px;text-align:center}.login__icon{font-size:48px;margin-bottom:8px}.login__title{font-size:22px;font-weight:700;margin-bottom:4px}.login__subtitle{font-size:14px;color:#999;margin-bottom:24px}.login__input{width:100%;padding:12px 16px;border:1px solid #ddd;border-radius:12px;font-size:16px;margin-bottom:12px}.login__input:focus{outline:none;border-color:#667eea}.login__btn{width:100%;padding:14px;border-radius:12px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:16px;font-weight:600;min-height:44px;margin-top:4px}.login__btn:active{opacity:.9}.login__btn:disabled{opacity:.6;cursor:not-allowed}.login__error{color:#e74c3c;font-size:14px;margin-top:12px}.list-selector{max-width:600px;margin:20px auto;padding:0 16px}.list-selector__create{display:flex;gap:8px;margin-bottom:16px}.list-selector__input{flex:1;padding:12px 16px;border:1px solid #ddd;border-radius:12px;font-size:16px}.list-selector__input:focus{outline:none;border-color:#667eea}.list-selector__add-btn{padding:12px 20px;border-radius:12px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:16px;font-weight:600;min-height:44px;white-space:nowrap}.list-selector__add-btn:active{opacity:.9}.list-selector__list{display:flex;flex-direction:column;gap:8px}.list-selector__item{display:flex;align-items:center;gap:10px;background:#fff;border-radius:16px;box-shadow:0 2px 10px #0000001a;padding:16px;min-height:44px;cursor:pointer}.list-selector__item:active{background:#fafafa}.list-selector__item-name{flex:1;font-size:16px;font-weight:600}.list-selector__item-date{font-size:12px;color:#999}.list-selector__item-actions{display:flex;gap:4px}.list-selector__item-btn{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;font-size:18px;color:#999;border-radius:8px}.list-selector__item-btn:active{background:#0000000d}.list-selector__item-btn--danger:active{color:#e74c3c}.list-selector__edit-row{display:flex;gap:8px;flex:1}.list-selector__edit-input{flex:1;padding:8px 12px;border:1px solid #667eea;border-radius:8px;font-size:14px}.list-selector__edit-input:focus{outline:none}.list-selector__empty{text-align:center;padding:40px 20px;color:#999;font-size:15px}.accordion-grid{display:grid;grid-template-columns:1fr;gap:12px;max-width:600px;margin:16px auto;padding:0 16px;min-width:0}@media(min-width:768px){.accordion-grid{grid-template-columns:repeat(2,1fr);max-width:1200px}}.accordion-item{background:#fff;border-radius:16px;box-shadow:0 2px 10px #0000001a;overflow:hidden;min-width:0}.accordion-item__header{display:flex;align-items:center;gap:10px;padding:14px 16px;min-height:44px;width:100%;text-align:left;font-size:1rem;color:inherit}.accordion-item__header:active{background:#00000008}.accordion-item__emoji{font-size:28px;flex-shrink:0}.accordion-item__label{font-size:18px;font-weight:700;flex:1}.accordion-item__count{font-size:13px;color:#999}.accordion-item__arrow{font-size:18px;transition:transform .3s ease-out;flex-shrink:0}.accordion-item--open .accordion-item__arrow{transform:rotate(180deg)}.accordion-item__content{max-height:0;overflow:hidden;transition:max-height .3s ease-out,padding .3s ease-out;padding:0 16px}.accordion-item--dragover{outline:2px dashed #667eea;outline-offset:-2px;background:#667eea0d}.accordion-item--open .accordion-item__content{max-height:9999px;padding:0 16px 16px}.recipe-section{grid-column:1/-1;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;box-shadow:0 2px 10px #0000001a;padding:20px;color:#fff;min-width:0}.recipe-section__title{font-size:18px;font-weight:700;margin-bottom:12px}.recipe-section__textarea{width:100%;min-height:100px;border:none;border-radius:12px;padding:12px;font-size:14px;resize:vertical;background:#fff3;color:#fff}.recipe-section__textarea::placeholder{color:#ffffffb3}.recipe-section__textarea:focus{outline:none;background:#ffffff4d}.recipe-section__previews{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.recipe-section__preview{position:relative;width:80px;height:80px}.recipe-section__preview img{width:100%;height:100%;object-fit:cover;border-radius:12px}.recipe-section__preview-remove{position:absolute;top:-6px;right:-6px;width:22px;height:22px;border-radius:50%;background:#0009;color:#fff;font-size:14px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}.recipe-section__preview-remove:hover{background:#000c}.recipe-section__url-input{width:100%;margin-top:8px;border:none;border-radius:12px;padding:10px 12px;font-size:14px;background:#fff3;color:#fff}.recipe-section__url-input::placeholder{color:#ffffffb3}.recipe-section__url-input:focus{outline:none;background:#ffffff4d}.recipe-section__btn{display:block;width:100%;margin-top:12px;padding:12px;border-radius:12px;background:#ffffff40;color:#fff;font-size:16px;font-weight:600;min-height:44px}.recipe-section__btn:active{background:#ffffff59}.recipe-section__btn:disabled{opacity:.6;cursor:not-allowed}.recipe-list{grid-column:1/-1;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;box-shadow:0 2px 10px #0000001a;padding:20px;color:#fff;min-width:0}.recipe-list__title{font-size:18px;font-weight:700;margin-bottom:12px}.recipe-list__items{display:flex;flex-direction:column;gap:8px}.recipe-list__item{display:flex;align-items:center;gap:8px;background:#ffffff26;border-radius:12px;padding:10px 12px;font-size:14px;cursor:pointer}.recipe-list__item button{color:#fffc;font-size:18px;padding:4px 8px;min-width:44px;min-height:44px;flex-shrink:0;display:flex;align-items:center;justify-content:center}.recipe-list__item button:active{color:#fff}.recipe-list__text{flex:1;min-width:0;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.recipe-list__item--expanded .recipe-list__text{white-space:pre-wrap;overflow:visible}.recipe-list__edit-input{flex:1;min-width:0;border:none;border-radius:12px;padding:4px 8px;font-size:14px;background:#ffffff4d;color:#fff}.recipe-list__edit-input:focus{outline:none;background:#fff6}.recipe-list__link{flex-shrink:0;font-size:16px;text-decoration:none;padding:4px;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}.recipe-list__link:hover{opacity:.8}.ingredient-list{display:flex;flex-direction:column;gap:8px}.ingredient-item{display:flex;align-items:center;gap:10px;background:#f8f9fa;border-radius:12px;padding:10px 12px;min-height:44px}.ingredient-item:active{background:#eff0f1}.ingredient-item__checkbox{width:22px;height:22px;flex-shrink:0;accent-color:#667eea;cursor:pointer}.ingredient-item__text{flex:1;font-size:15px;line-height:1.3}.ingredient-item__amount{font-size:13px;color:#999;white-space:nowrap}.ingredient-item--dragging{opacity:.4}.ingredient-item--checked .ingredient-item__text{text-decoration:line-through;opacity:.5}.ingredient-item__edit-input{flex:1;font-size:15px;line-height:1.3;font-family:inherit;border:1px solid #667eea;border-radius:4px;padding:2px 6px;outline:none;background:#fff}.ingredient-item__edit-input--amount{flex:0 0 auto;width:80px;font-size:13px;text-align:right}.ingredient-item__delete{color:#999;font-size:18px;padding:4px;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}.ingredient-item__delete:active{color:#e74c3c}.ingredient-add-row{display:flex;align-items:center;gap:10px;background:#f8f9fa;border-radius:12px;padding:10px 12px;min-height:44px}.ingredient-add-row__input{font-family:inherit;font-size:15px;line-height:1.3;border:none;border-bottom:1px solid #ddd;border-radius:0;padding:4px 0;outline:none;background:transparent}.ingredient-add-row__input:focus{border-bottom-color:#667eea}.ingredient-add-row__input--name{flex:1;min-width:0}.ingredient-add-row__input--amount,.ingredient-add-row__input--unit{width:60px;flex-shrink:0}.ingredient-add-row__btn{color:#667eea;font-size:22px;font-weight:700;padding:4px;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}.ingredient-add-row__btn:active{opacity:.6}.action-bar{position:fixed;bottom:20px;left:50%;transform:translate(-50%);display:flex;gap:16px;align-items:center;background:#fff;border-radius:30px;padding:10px 20px;box-shadow:0 4px 20px #00000026;z-index:200}.action-bar__btn{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;background:#f8f9fa;color:#333}.action-bar__btn:active{background:#e8e9ea}.action-bar__btn--primary{width:60px;height:60px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:28px;box-shadow:0 2px 10px #667eea66}.action-bar__btn--primary:active{opacity:.9}.add-form{position:fixed;bottom:100px;left:50%;transform:translate(-50%);width:calc(100% - 32px);max-width:600px;background:#fff;border-radius:16px;box-shadow:0 4px 20px #0003;padding:20px;z-index:199}.add-form__title{font-size:16px;font-weight:700;margin-bottom:12px}.add-form__row{display:flex;gap:8px;margin-bottom:8px}.add-form__input{flex:1;padding:10px 12px;border:1px solid #ddd;border-radius:12px;font-size:14px}.add-form__input:focus{outline:none;border-color:#667eea}.add-form__select{padding:10px 12px;border:1px solid #ddd;border-radius:12px;font-size:14px;width:100%;margin-bottom:8px}.add-form__select:focus{outline:none;border-color:#667eea}.add-form__submit{width:100%;padding:12px;border-radius:12px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:16px;font-weight:600;min-height:44px}.add-form__submit:active{opacity:.9}.add-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000004d;z-index:198}
