\u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440<\/title>\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n }\n \n body {\n background: linear-gradient(135deg, #ff9a9e 0%, #fad0c4 100%);\n color: #333;\n line-height: 1.6;\n min-height: 100vh;\n padding: 20px;\n }\n \n .container {\n max-width: 1400px;\n margin: 0 auto;\n padding: 0 15px;\n }\n \n .header {\n text-align: center;\n margin-bottom: 40px;\n color: #5d4037;\n text-shadow: 0 2px 5px rgba(0,0,0,0.1);\n }\n \n .header h1 {\n font-size: 2.8rem;\n margin-bottom: 15px;\n }\n \n .header p {\n font-size: 1.2rem;\n opacity: 0.9;\n max-width: 800px;\n margin: 0 auto;\n color: #795548;\n }\n \n .main-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 30px;\n margin-bottom: 40px;\n }\n \n @media (max-width: 1100px) {\n .main-grid {\n grid-template-columns: 1fr;\n }\n }\n \n .calculator-card {\n background: white;\n border-radius: 25px;\n padding: 35px;\n box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1);\n transition: transform 0.3s ease;\n }\n \n .calculator-card:hover {\n transform: translateY(-5px);\n }\n \n .converter-section {\n background: rgba(255, 255, 255, 0.98);\n }\n \n .info-section {\n background: rgba(255, 255, 255, 0.98);\n }\n \n .section-title {\n color: #5d4037;\n margin-bottom: 25px;\n display: flex;\n align-items: center;\n gap: 15px;\n font-size: 1.8rem;\n }\n \n .section-title i {\n color: #ff7043;\n }\n \n .converter-tabs {\n display: flex;\n gap: 10px;\n margin-bottom: 25px;\n flex-wrap: wrap;\n }\n \n .tab-btn {\n padding: 12px 24px;\n background: #f5f5f5;\n border: 2px solid #e0e0e0;\n border-radius: 12px;\n font-weight: 600;\n cursor: pointer;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n gap: 8px;\n color: #5d4037;\n }\n \n .tab-btn.active {\n background: #ff7043;\n color: white;\n border-color: #ff7043;\n }\n \n .tab-btn:hover {\n transform: translateY(-2px);\n box-shadow: 0 5px 15px rgba(255, 112, 67, 0.2);\n }\n \n .tab-content {\n display: none;\n }\n \n .tab-content.active {\n display: block;\n animation: fadeIn 0.5s ease;\n }\n \n @keyframes fadeIn {\n from { opacity: 0; transform: translateY(10px); }\n to { opacity: 1; transform: translateY(0); }\n }\n \n .converter-form {\n display: flex;\n flex-direction: column;\n gap: 25px;\n }\n \n .input-group {\n position: relative;\n }\n \n .input-group label {\n display: block;\n margin-bottom: 10px;\n font-weight: 600;\n color: #5d4037;\n font-size: 1.1rem;\n }\n \n .input-with-icon {\n position: relative;\n }\n \n .input-with-icon input,\n .input-with-icon select {\n width: 100%;\n padding: 18px 20px;\n border: 3px solid #e0e0e0;\n border-radius: 15px;\n font-size: 1.2rem;\n font-weight: 600;\n transition: all 0.3s;\n background: #f8f9fa;\n color: #5d4037;\n }\n \n .input-with-icon input:focus,\n .input-with-icon select:focus {\n border-color: #ff7043;\n background: white;\n box-shadow: 0 5px 20px rgba(255, 112, 67, 0.1);\n outline: none;\n }\n \n .input-icon {\n position: absolute;\n right: 20px;\n top: 50%;\n transform: translateY(-50%);\n color: #ff7043;\n font-size: 1.3rem;\n }\n \n .product-selector {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));\n gap: 12px;\n margin-top: 15px;\n }\n \n .product-btn {\n padding: 15px;\n background: white;\n border: 2px solid #e0e0e0;\n border-radius: 12px;\n text-align: center;\n cursor: pointer;\n transition: all 0.3s;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n color: #5d4037;\n }\n \n .product-btn:hover {\n border-color: #ff7043;\n transform: translateY(-3px);\n box-shadow: 0 5px 15px rgba(255, 112, 67, 0.1);\n }\n \n .product-btn.active {\n background: #ffebee;\n border-color: #ff7043;\n color: #ff7043;\n }\n \n .product-icon {\n font-size: 1.5rem;\n color: #ff7043;\n }\n \n .custom-product-selector {\n position: relative;\n margin-top: 15px;\n }\n \n .custom-product-input {\n width: 100%;\n padding: 15px 20px;\n border: 3px solid #e0e0e0;\n border-radius: 15px;\n font-size: 1.1rem;\n font-weight: 600;\n background: #f8f9fa;\n color: #5d4037;\n cursor: pointer;\n position: relative;\n }\n \n .custom-product-input:after {\n content: '\u25bc';\n position: absolute;\n right: 20px;\n top: 50%;\n transform: translateY(-50%);\n color: #ff7043;\n }\n \n .custom-product-dropdown {\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n background: white;\n border: 3px solid #ff7043;\n border-radius: 15px;\n margin-top: 5px;\n max-height: 300px;\n overflow-y: auto;\n z-index: 100;\n display: none;\n box-shadow: 0 10px 30px rgba(0,0,0,0.1);\n }\n \n .custom-product-dropdown.active {\n display: block;\n }\n \n .dropdown-item {\n padding: 15px 20px;\n border-bottom: 1px solid #eee;\n cursor: pointer;\n transition: all 0.2s;\n color: #5d4037;\n }\n \n .dropdown-item:hover {\n background: #ffebee;\n color: #ff7043;\n }\n \n .dropdown-item:last-child {\n border-bottom: none;\n }\n \n .unit-selector-with-hints {\n display: flex;\n align-items: center;\n gap: 15px;\n margin-top: 15px;\n }\n \n .unit-select-container {\n flex: 1;\n position: relative;\n }\n \n .unit-hint {\n position: absolute;\n font-size: 0.7rem;\n font-weight: 600;\n color: white;\n padding: 3px 10px;\n border-radius: 12px;\n z-index: 3;\n }\n \n .unit-hint-from {\n top: -10px;\n left: 10px;\n background: linear-gradient(135deg, #ff7043 0%, #ffab40 100%);\n }\n \n .unit-hint-to {\n bottom: -10px;\n right: 10px;\n background: linear-gradient(135deg, #4caf50 0%, #8bc34a 100%);\n }\n \n .swap-button {\n width: 50px;\n height: 50px;\n border-radius: 50%;\n background: linear-gradient(135deg, #ff7043 0%, #ffab40 100%);\n color: white;\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.3s;\n font-size: 1.2rem;\n flex-shrink: 0;\n }\n \n .swap-button:hover {\n transform: rotate(180deg) scale(1.1);\n box-shadow: 0 5px 15px rgba(255, 112, 67, 0.4);\n }\n \n .result-display {\n background: linear-gradient(135deg, #4caf50 0%, #8bc34a 100%);\n color: white;\n padding: 30px;\n border-radius: 20px;\n text-align: center;\n margin-top: 20px;\n box-shadow: 0 10px 30px rgba(76, 175, 80, 0.2);\n }\n \n .result-value {\n font-size: 3.5rem;\n font-weight: 800;\n margin: 15px 0;\n text-shadow: 2px 2px 4px rgba(0,0,0,0.1);\n }\n \n .result-unit {\n font-size: 1.3rem;\n opacity: 0.9;\n font-weight: 600;\n }\n \n .quick-conversions {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n gap: 15px;\n margin-top: 30px;\n }\n \n .quick-conversion-item {\n background: white;\n padding: 20px;\n border-radius: 15px;\n text-align: center;\n border: 2px solid #e0e0e0;\n transition: all 0.3s;\n cursor: pointer;\n color: #5d4037;\n }\n \n .quick-conversion-item:hover {\n border-color: #ff7043;\n transform: translateY(-5px);\n box-shadow: 0 10px 20px rgba(255, 112, 67, 0.1);\n }\n \n .quick-value {\n font-size: 1.5rem;\n font-weight: 700;\n margin: 10px 0 5px;\n }\n \n .quick-unit {\n font-size: 0.9rem;\n color: #666;\n }\n \n .temperature-converter {\n background: white;\n padding: 25px;\n border-radius: 20px;\n border: 2px solid #e0e0e0;\n margin-top: 30px;\n }\n \n .oven-temperatures {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 15px;\n margin-top: 20px;\n }\n \n .oven-item {\n text-align: center;\n padding: 20px;\n background: #f8f9fa;\n border-radius: 15px;\n transition: all 0.3s;\n color: #5d4037;\n }\n \n .oven-item:hover {\n background: #ffebee;\n transform: scale(1.05);\n }\n \n .oven-value {\n font-size: 1.5rem;\n font-weight: 700;\n margin: 10px 0 5px;\n }\n \n .oven-label {\n font-size: 0.9rem;\n color: #666;\n }\n \n .equivalents-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));\n gap: 15px;\n margin-top: 25px;\n }\n \n .equivalent-card {\n background: white;\n padding: 20px;\n border-radius: 15px;\n text-align: center;\n border: 2px solid #e0e0e0;\n transition: all 0.3s;\n color: #5d4037;\n }\n \n .equivalent-card:hover {\n border-color: #4caf50;\n transform: translateY(-5px);\n box-shadow: 0 10px 20px rgba(76, 175, 80, 0.1);\n }\n \n .equivalent-title {\n font-weight: 600;\n margin-bottom: 10px;\n }\n \n .equivalent-value {\n font-size: 1.2rem;\n color: #4caf50;\n font-weight: 700;\n }\n \n .action-buttons {\n display: flex;\n gap: 15px;\n margin-top: 30px;\n flex-wrap: wrap;\n }\n \n .action-btn {\n flex: 1;\n min-width: 150px;\n padding: 18px 25px;\n border: none;\n border-radius: 15px;\n font-size: 1rem;\n font-weight: 600;\n cursor: pointer;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 10px;\n }\n \n .btn-primary {\n background: linear-gradient(135deg, #ff7043 0%, #ffab40 100%);\n color: white;\n }\n \n .btn-secondary {\n background: #f8f9fa;\n color: #5d4037;\n border: 2px solid #e0e0e0;\n }\n \n .action-btn:hover {\n transform: translateY(-3px);\n box-shadow: 0 10px 20px rgba(0,0,0,0.1);\n }\n \n .info-box {\n background: #e8f5e9;\n border-left: 4px solid #4caf50;\n padding: 20px;\n border-radius: 10px;\n margin: 20px 0;\n font-size: 0.95rem;\n color: #5d4037;\n }\n \n .tips-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 20px;\n margin-top: 25px;\n }\n \n .tip-card {\n background: white;\n padding: 25px;\n border-radius: 15px;\n border: 2px solid #e0e0e0;\n color: #5d4037;\n }\n \n .tip-icon {\n font-size: 2rem;\n color: #ff7043;\n margin-bottom: 15px;\n }\n \n .tip-title {\n font-weight: 600;\n margin-bottom: 10px;\n font-size: 1.1rem;\n }\n \n .history-timeline {\n position: relative;\n padding-left: 30px;\n margin: 30px 0;\n }\n \n .history-timeline::before {\n content: '';\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n width: 3px;\n background: linear-gradient(to bottom, #ff7043, #ffab40);\n }\n \n .history-item {\n position: relative;\n margin-bottom: 30px;\n padding: 25px;\n background: white;\n border-radius: 15px;\n border-left: 5px solid #ff7043;\n box-shadow: 0 5px 15px rgba(0,0,0,0.05);\n color: #5d4037;\n }\n \n .history-item::before {\n content: '';\n position: absolute;\n left: -38px;\n top: 30px;\n width: 20px;\n height: 20px;\n border-radius: 50%;\n background: #ff7043;\n border: 3px solid white;\n box-shadow: 0 0 0 3px #ff7043;\n }\n \n .history-period {\n font-weight: 700;\n color: #ff7043;\n margin-bottom: 8px;\n font-size: 1.1rem;\n }\n \n .history-description {\n color: #666;\n line-height: 1.5;\n }\n \n .footer {\n text-align: center;\n margin-top: 50px;\n color: #5d4037;\n opacity: 0.8;\n font-size: 0.9rem;\n }\n \n @media (max-width: 768px) {\n .header h1 { font-size: 2rem; }\n .header p { font-size: 1rem; }\n .calculator-card { padding: 20px; }\n .section-title { font-size: 1.5rem; }\n .result-value { font-size: 2.5rem; }\n .converter-tabs { flex-direction: column; }\n .tab-btn { width: 100%; justify-content: center; }\n .unit-selector-with-hints { flex-direction: column; }\n .quick-conversions { grid-template-columns: repeat(2, 1fr); }\n .tips-grid { grid-template-columns: 1fr; }\n .action-buttons { flex-direction: column; }\n .action-btn { min-width: 100%; }\n }\n \n @media (max-width: 480px) {\n .header h1 { font-size: 1.8rem; }\n .quick-conversions { grid-template-columns: 1fr; }\n .product-selector { grid-template-columns: repeat(2, 1fr); }\n }\n \n .pulse {\n animation: pulse 0.5s ease;\n }\n \n @keyframes pulse {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.05); }\n 100% { transform: scale(1); }\n }\n \n .toast {\n position: fixed;\n bottom: 20px;\n right: 20px;\n background: #ff7043;\n color: white;\n padding: 15px 25px;\n border-radius: 10px;\n z-index: 1000;\n box-shadow: 0 4px 12px rgba(0,0,0,0.2);\n animation: slideIn 0.3s ease;\n }\n \n @keyframes slideIn {\n from { transform: translateX(100%); opacity: 0; }\n to { transform: translateX(0); opacity: 1; }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <div class=\"header\">\n <h1><i class=\"fas fa-utensils\"><\/i> \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440<\/h1>\n <p>\u041f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u0443\u0439\u0442\u0435 \u043c\u0435\u0440\u044b, \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0443 \u0438 \u0437\u0430\u043c\u0435\u043d\u0438\u0442\u0435 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u044b \u0432 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0445 \u0440\u0435\u0446\u0435\u043f\u0442\u0430\u0445<\/p>\n <\/div>\n \n <div class=\"main-grid\">\n <div class=\"calculator-card converter-section\">\n <h2 class=\"section-title\">\n <i class=\"fas fa-exchange-alt\"><\/i> \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u043c\u0435\u0440\n <\/h2>\n \n <div class=\"converter-tabs\">\n <button class=\"tab-btn active\" data-tab=\"volume\">\n <i class=\"fas fa-wine-bottle\"><\/i> \u041e\u0431\u044a\u0435\u043c\/\u0412\u0435\u0441\n <\/button>\n <button class=\"tab-btn\" data-tab=\"temperature\">\n <i class=\"fas fa-thermometer-half\"><\/i> \u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0430\n <\/button>\n <button class=\"tab-btn\" data-tab=\"equivalents\">\n <i class=\"fas fa-exchange-alt\"><\/i> \u0417\u0430\u043c\u0435\u043d\u0430 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432\n <\/button>\n <\/div>\n \n \n <div class=\"tab-content active\" id=\"tab-volume\">\n <div class=\"converter-form\">\n <div class=\"input-group\">\n <label><i class=\"fas fa-apple-alt\"><\/i> \u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442:<\/label>\n <div class=\"product-selector\">\n <button class=\"product-btn active\" data-product=\"\u043c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f\">\n <i class=\"fas fa-bread-slice product-icon\"><\/i>\n <span>\u041c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u0441\u0430\u0445\u0430\u0440\">\n <i class=\"fas fa-candy-cane product-icon\"><\/i>\n <span>\u0421\u0430\u0445\u0430\u0440<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u0441\u0430\u0445\u0430\u0440\u043d\u0430\u044f \u043f\u0443\u0434\u0440\u0430\">\n <i class=\"fas fa-candy-cane product-icon\"><\/i>\n <span>\u0421\u0430\u0445\u0430\u0440\u043d\u0430\u044f \u043f\u0443\u0434\u0440\u0430<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u043c\u0430\u0441\u043b\u043e \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0435\">\n <i class=\"fas fa-blender product-icon\"><\/i>\n <span>\u041c\u0430\u0441\u043b\u043e \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0435<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043c\u0430\u0441\u043b\u043e\">\n <i class=\"fas fa-oil-can product-icon\"><\/i>\n <span>\u041c\u0430\u0441\u043b\u043e \u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u043c\u043e\u043b\u043e\u043a\u043e\">\n <i class=\"fas fa-glass-whiskey product-icon\"><\/i>\n <span>\u041c\u043e\u043b\u043e\u043a\u043e<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u0432\u043e\u0434\u0430\">\n <i class=\"fas fa-tint product-icon\"><\/i>\n <span>\u0412\u043e\u0434\u0430<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u0440\u0438\u0441\">\n <i class=\"fas fa-seedling product-icon\"><\/i>\n <span>\u0420\u0438\u0441<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u0433\u0440\u0435\u0447\u043a\u0430\">\n <i class=\"fas fa-seedling product-icon\"><\/i>\n <span>\u0413\u0440\u0435\u0447\u043a\u0430<\/span>\n <\/button>\n <\/div>\n \n <div class=\"custom-product-selector\">\n <label style=\"margin-top: 20px; display: block;\">\u0414\u0440\u0443\u0433\u0438\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b:<\/label>\n <div class=\"custom-product-input\" id=\"customProductInput\">\n \u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u0438\u0437 \u0441\u043f\u0438\u0441\u043a\u0430…\n <\/div>\n <div class=\"custom-product-dropdown\" id=\"customProductDropdown\">\n \n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"inputValue\"><i class=\"fas fa-arrow-right\"><\/i> \u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435:<\/label>\n <div class=\"input-with-icon\">\n <input type=\"number\" id=\"inputValue\" value=\"100\" step=\"0.01\" min=\"0\">\n <span class=\"input-icon\"><i class=\"fas fa-balance-scale\"><\/i><\/span>\n <\/div>\n <\/div>\n \n <div class=\"unit-selector-with-hints\">\n <div class=\"unit-select-container\">\n <div class=\"unit-hint unit-hint-from\">\u0418\u0417<\/div>\n <select id=\"fromUnit\">\n <option value=\"\u0433\u0440\u0430\u043c\u043c\">\u0413\u0440\u0430\u043c\u043c\u044b (\u0433)<\/option>\n <option value=\"\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (\u043a\u0433)<\/option>\n <option value=\"\u0441\u0442\u0430\u043a\u0430\u043d_200\">\u0421\u0442\u0430\u043a\u0430\u043d (200 \u043c\u043b)<\/option>\n <option value=\"\u0441\u0442\u0430\u043a\u0430\u043d_250\">\u0421\u0442\u0430\u043a\u0430\u043d (250 \u043c\u043b)<\/option>\n <option value=\"\u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f\">\u0421\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430<\/option>\n <option value=\"\u0447\u0430\u0439\u043d\u0430\u044f\">\u0427\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430<\/option>\n <option value=\"\u0447\u0430\u0448\u043a\u0430_us\">\u0427\u0430\u0448\u043a\u0430 (US, 240 \u043c\u043b)<\/option>\n <option value=\"\u0443\u043d\u0446\u0438\u044f\">\u0423\u043d\u0446\u0438\u044f (oz)<\/option>\n <option value=\"\u0444\u0443\u043d\u0442\">\u0424\u0443\u043d\u0442 (lb)<\/option>\n <option value=\"\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440\">\u041c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440\u044b (\u043c\u043b)<\/option>\n <option value=\"\u043b\u0438\u0442\u0440\">\u041b\u0438\u0442\u0440 (\u043b)<\/option>\n <\/select>\n <\/div>\n \n <button class=\"swap-button\" id=\"swapUnits\">\n <i class=\"fas fa-sync-alt\"><\/i>\n <\/button>\n \n <div class=\"unit-select-container\">\n <div class=\"unit-hint unit-hint-to\">\u0412<\/div>\n <select id=\"toUnit\">\n <option value=\"\u0433\u0440\u0430\u043c\u043c\">\u0413\u0440\u0430\u043c\u043c\u044b (\u0433)<\/option>\n <option value=\"\u0441\u0442\u0430\u043a\u0430\u043d_200\">\u0421\u0442\u0430\u043a\u0430\u043d (200 \u043c\u043b)<\/option>\n <option value=\"\u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f\">\u0421\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430<\/option>\n <option value=\"\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (\u043a\u0433)<\/option>\n <option value=\"\u0441\u0442\u0430\u043a\u0430\u043d_250\">\u0421\u0442\u0430\u043a\u0430\u043d (250 \u043c\u043b)<\/option>\n <option value=\"\u0447\u0430\u0439\u043d\u0430\u044f\">\u0427\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430<\/option>\n <option value=\"\u0447\u0430\u0448\u043a\u0430_us\">\u0427\u0430\u0448\u043a\u0430 (US, 240 \u043c\u043b)<\/option>\n <option value=\"\u0443\u043d\u0446\u0438\u044f\">\u0423\u043d\u0446\u0438\u044f (oz)<\/option>\n <option value=\"\u0444\u0443\u043d\u0442\">\u0424\u0443\u043d\u0442 (lb)<\/option>\n <option value=\"\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440\">\u041c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440\u044b (\u043c\u043b)<\/option>\n <option value=\"\u043b\u0438\u0442\u0440\">\u041b\u0438\u0442\u0440 (\u043b)<\/option>\n <\/select>\n <\/div>\n <\/div>\n \n <div class=\"result-display\">\n <div id=\"resultValue\" class=\"result-value\">130<\/div>\n <div id=\"resultUnit\" class=\"result-unit\">\u0433\u0440\u0430\u043c\u043c \u043c\u0443\u043a\u0438 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u043e\u0439<\/div>\n <\/div>\n \n <div class=\"quick-conversions\">\n <div class=\"quick-conversion-item\" data-unit=\"\u0433\u0440\u0430\u043c\u043c\">\n <div class=\"quick-value\" id=\"quickGram\">130<\/div>\n <div class=\"quick-unit\">\u0413\u0440\u0430\u043c\u043c\u044b<\/div>\n <\/div>\n <div class=\"quick-conversion-item\" data-unit=\"\u0441\u0442\u0430\u043a\u0430\u043d_200\">\n <div class=\"quick-value\" id=\"quickGlass200\">1.0<\/div>\n <div class=\"quick-unit\">\u0421\u0442\u0430\u043a\u0430\u043d 200\u043c\u043b<\/div>\n <\/div>\n <div class=\"quick-conversion-item\" data-unit=\"\u0441\u0442\u0430\u043a\u0430\u043d_250\">\n <div class=\"quick-value\" id=\"quickGlass250\">0.8<\/div>\n <div class=\"quick-unit\">\u0421\u0442\u0430\u043a\u0430\u043d 250\u043c\u043b<\/div>\n <\/div>\n <div class=\"quick-conversion-item\" data-unit=\"\u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f\">\n <div class=\"quick-value\" id=\"quickSpoon\">8.7<\/div>\n <div class=\"quick-unit\">\u0421\u0442. \u043b\u043e\u0436\u043a\u0438<\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"tab-content\" id=\"tab-temperature\">\n <div class=\"temperature-converter\">\n <h3 style=\"color: #5d4037; margin-bottom: 20px;\">\n <i class=\"fas fa-fire\"><\/i> \u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0430 \u0434\u0443\u0445\u043e\u0432\u043a\u0438\n <\/h3>\n \n <div class=\"converter-form\">\n <div class=\"input-group\">\n <label><i class=\"fas fa-thermometer\"><\/i> \u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0443:<\/label>\n <div class=\"input-with-icon\">\n <input type=\"number\" id=\"tempInput\" value=\"180\" step=\"1\">\n <span class=\"input-icon\">\u00b0C<\/span>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"oven-temperatures\">\n <div class=\"oven-item\">\n <div class=\"oven-value\" id=\"tempCelsius\">180<\/div>\n <div class=\"oven-label\">\u0413\u0440\u0430\u0434\u0443\u0441\u044b \u0426\u0435\u043b\u044c\u0441\u0438\u044f<\/div>\n <\/div>\n <div class=\"oven-item\">\n <div class=\"oven-value\" id=\"tempFahrenheit\">356<\/div>\n <div class=\"oven-label\">\u0413\u0440\u0430\u0434\u0443\u0441\u044b \u0424\u0430\u0440\u0435\u043d\u0433\u0435\u0439\u0442\u0430<\/div>\n <\/div>\n <div class=\"oven-item\">\n <div class=\"oven-value\" id=\"tempGasMark\">4<\/div>\n <div class=\"oven-label\">\u0413\u0430\u0437\u043e\u0432\u0430\u044f \u043c\u0430\u0440\u043a\u0438\u0440\u043e\u0432\u043a\u0430<\/div>\n <\/div>\n <div class=\"oven-item\">\n <div class=\"oven-value\" id=\"tempDescription\">\u0421\u0440\u0435\u0434\u043d\u0438\u0439 \u0436\u0430\u0440<\/div>\n <div class=\"oven-label\">\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435<\/div>\n <\/div>\n <\/div>\n \n <div class=\"info-box\" style=\"margin-top: 20px;\">\n <p><strong>\u041f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0430:<\/strong> \u0414\u043b\u044f \u0442\u043e\u0447\u043d\u043e\u0439 \u0432\u044b\u043f\u0435\u0447\u043a\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0439 \u0442\u0435\u0440\u043c\u043e\u043c\u0435\u0442\u0440. \u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0430 \u043c\u043e\u0436\u0435\u0442 \u043e\u0442\u043b\u0438\u0447\u0430\u0442\u044c\u0441\u044f \u043d\u0430 10-20\u00b0C \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u0434\u0443\u0445\u043e\u0432\u043a\u0430\u0445.<\/p>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"tab-content\" id=\"tab-equivalents\">\n <div class=\"equivalents-grid\">\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u0421\u0430\u0445\u0430\u0440 \u2192 \u041c\u0451\u0434<\/div>\n <div class=\"equivalent-value\">1 \u0441\u0442. \u0441\u0430\u0445\u0430\u0440\u0430 = \u00be \u0441\u0442. \u043c\u0451\u0434\u0430<\/div>\n <div class=\"quick-unit\">\u0423\u043c\u0435\u043d\u044c\u0448\u0438\u0442\u0435 \u0436\u0438\u0434\u043a\u043e\u0441\u0442\u044c \u043d\u0430 \u00bc<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u0421\u043c\u0435\u0442\u0430\u043d\u0430 \u2192 \u0419\u043e\u0433\u0443\u0440\u0442<\/div>\n <div class=\"equivalent-value\">1:1 \u0437\u0430\u043c\u0435\u043d\u0430<\/div>\n <div class=\"quick-unit\">+ 1 \u0447.\u043b. \u0441\u043e\u0434\u044b \u043d\u0430 \u0441\u0442\u0430\u043a\u0430\u043d<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u041f\u0430\u0445\u0442\u0430<\/div>\n <div class=\"equivalent-value\">1 \u0441\u0442. \u043c\u043e\u043b\u043e\u043a\u0430<\/div>\n <div class=\"quick-unit\">+ 1 \u0441\u0442.\u043b. \u043b\u0438\u043c\u043e\u043d\u043d\u043e\u0433\u043e \u0441\u043e\u043a\u0430<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u0420\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c \u2192 \u0421\u043e\u0434\u0430<\/div>\n <div class=\"equivalent-value\">1 \u0447.\u043b. = \u00bc \u0447.\u043b. \u0441\u043e\u0434\u044b<\/div>\n <div class=\"quick-unit\">+ \u043a\u0438\u0441\u043b\u043e\u0442\u0430 (\u0443\u043a\u0441\u0443\u0441, \u043b\u0438\u043c\u043e\u043d)<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u041c\u0430\u0441\u043b\u043e \u2192 \u041c\u0430\u0440\u0433\u0430\u0440\u0438\u043d<\/div>\n <div class=\"equivalent-value\">1:1 \u0437\u0430\u043c\u0435\u043d\u0430<\/div>\n <div class=\"quick-unit\">\u0414\u043b\u044f \u0432\u044b\u043f\u0435\u0447\u043a\u0438<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u042f\u0439\u0446\u043e \u043a\u0443\u0440\u0438\u043d\u043e\u0435<\/div>\n <div class=\"equivalent-value\">1 \u044f\u0439\u0446\u043e = 50 \u0433<\/div>\n <div class=\"quick-unit\">\u044f\u0431\u043b\u043e\u0447\u043d\u043e\u0433\u043e \u043f\u044e\u0440\u0435 \u0438\u043b\u0438 \u0431\u0430\u043d\u0430\u043d\u0430<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u0421\u043b\u0438\u0432\u043a\u0438 20%<\/div>\n <div class=\"equivalent-value\">1 \u0441\u0442. \u043c\u043e\u043b\u043e\u043a\u0430<\/div>\n <div class=\"quick-unit\">+ 2 \u0441\u0442.\u043b. \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u0422\u0432\u043e\u0440\u043e\u0433<\/div>\n <div class=\"equivalent-value\">100 \u0433 = 100 \u0433<\/div>\n <div class=\"quick-unit\">\u0439\u043e\u0433\u0443\u0440\u0442\u0430 \u0438\u043b\u0438 \u043a\u0435\u0444\u0438\u0440\u0430<\/div>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"action-buttons\">\n <button class=\"action-btn btn-primary\" id=\"calculateBtn\">\n <i class=\"fas fa-calculator\"><\/i> \u0420\u0430\u0441\u0441\u0447\u0438\u0442\u0430\u0442\u044c\n <\/button>\n <button class=\"action-btn btn-secondary\" id=\"resetBtn\">\n <i class=\"fas fa-redo\"><\/i> \u0421\u0431\u0440\u043e\u0441\u0438\u0442\u044c\n <\/button>\n <button class=\"action-btn btn-secondary\" id=\"copyBtn\">\n <i class=\"far fa-copy\"><\/i> \u041a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c\n <\/button>\n <\/div>\n <\/div>\n \n <div class=\"calculator-card info-section\">\n <h2 class=\"section-title\">\n <i class=\"fas fa-info-circle\"><\/i> \u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u0430\u044f \u0441\u043f\u0440\u0430\u0432\u043a\u0430\n <\/h2>\n \n <div class=\"info-box\">\n <p><strong>\u0422\u043e\u0447\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435:<\/strong> \u0412\u0441\u0435 \u043a\u043e\u044d\u0444\u0444\u0438\u0446\u0438\u0435\u043d\u0442\u044b \u043e\u0441\u043d\u043e\u0432\u0430\u043d\u044b \u043d\u0430 \u0440\u0435\u0430\u043b\u044c\u043d\u044b\u0445 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f\u0445 \u043f\u043b\u043e\u0442\u043d\u043e\u0441\u0442\u0438 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432. \u041f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c \u043c\u0435\u043d\u0435\u0435 2%.<\/p>\n <\/div>\n \n <div class=\"tips-grid\">\n <div class=\"tip-card\">\n <div class=\"tip-icon\">\n <i class=\"fas fa-weight\"><\/i>\n <\/div>\n <div class=\"tip-title\">\u0422\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u0432\u0435\u0441\u0430<\/div>\n <p>\u0414\u043b\u044f \u043a\u043e\u043d\u0434\u0438\u0442\u0435\u0440\u0441\u043a\u0438\u0445 \u0438\u0437\u0434\u0435\u043b\u0438\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0432\u0435\u0441\u044b. 1 \u0433\u0440\u0430\u043c\u043c \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f \u043c\u043e\u0436\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u044b\u043f\u0435\u0447\u043a\u0438.<\/p>\n <\/div>\n \n <div class=\"tip-card\">\n <div class=\"tip-icon\">\n <i class=\"fas fa-temperature-high\"><\/i>\n <\/div>\n <div class=\"tip-title\">\u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0430 \u0434\u0443\u0445\u043e\u0432\u043a\u0438<\/div>\n <p>\u041f\u0435\u0440\u0435\u0434 \u0432\u044b\u043f\u0435\u0447\u043a\u043e\u0439 \u0440\u0430\u0437\u043e\u0433\u0440\u0435\u0432\u0430\u0439\u0442\u0435 \u0434\u0443\u0445\u043e\u0432\u043a\u0443 15-20 \u043c\u0438\u043d\u0443\u0442. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0442\u0435\u0440\u043c\u043e\u043c\u0435\u0442\u0440 \u0434\u043b\u044f \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044f \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u044b.<\/p>\n <\/div>\n \n <div class=\"tip-card\">\n <div class=\"tip-icon\">\n <i class=\"fas fa-vial\"><\/i>\n <\/div>\n <div class=\"tip-title\">\u041f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0432\u044b\u043f\u0435\u0447\u043a\u0438<\/div>\n <p>\u0413\u043e\u0442\u043e\u0432\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0439\u0442\u0435 \u0434\u0435\u0440\u0435\u0432\u044f\u043d\u043d\u043e\u0439 \u0448\u043f\u0430\u0436\u043a\u043e\u0439. \u0415\u0441\u043b\u0438 \u0442\u0435\u0441\u0442\u043e \u043d\u0435 \u043f\u0440\u0438\u043b\u0438\u043f\u0430\u0435\u0442 — \u0433\u043e\u0442\u043e\u0432\u043e. \u0414\u0430\u0439\u0442\u0435 \u043e\u0441\u0442\u044b\u0442\u044c 10 \u043c\u0438\u043d\u0443\u0442 \u043f\u0435\u0440\u0435\u0434 \u043d\u0430\u0440\u0435\u0437\u043a\u043e\u0439.<\/p>\n <\/div>\n \n <div class=\"tip-card\">\n <div class=\"tip-icon\">\n <i class=\"fas fa-cookie-bite\"><\/i>\n <\/div>\n <div class=\"tip-title\">\u0421\u043e\u0432\u0435\u0442\u044b \u043f\u043e \u043c\u0443\u043a\u0435<\/div>\n <p>\u041c\u0443\u043a\u0430 \u0440\u0430\u0437\u043d\u043e\u0439 \u043c\u0430\u0440\u043a\u0438 \u0438\u043c\u0435\u0435\u0442 \u0440\u0430\u0437\u043d\u0443\u044e \u0432\u043b\u0430\u0436\u043d\u043e\u0441\u0442\u044c. \u041f\u0440\u043e\u0441\u0435\u0438\u0432\u0430\u0439\u0442\u0435 \u043c\u0443\u043a\u0443 \u043f\u0435\u0440\u0435\u0434 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u0434\u043b\u044f \u043d\u0430\u0441\u044b\u0449\u0435\u043d\u0438\u044f \u043a\u0438\u0441\u043b\u043e\u0440\u043e\u0434\u043e\u043c.<\/p>\n <\/div>\n <\/div>\n \n <div class=\"history-timeline\">\n <div class=\"history-item\">\n <div class=\"history-period\">\u0414\u0440\u0435\u0432\u043d\u0438\u0439 \u043c\u0438\u0440<\/div>\n <div class=\"history-description\">\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 \u043c\u0435\u0440\u044b \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0447\u0430\u0441\u0442\u0435\u0439 \u0442\u0435\u043b\u0430: \u0433\u043e\u0440\u0441\u0442\u044c, \u043f\u0440\u0438\u0433\u043e\u0440\u0448\u043d\u044f, \u0449\u0435\u043f\u043e\u0442\u043a\u0430. \u041c\u0435\u0440\u0430 «\u0441\u0442\u0430\u043a\u0430\u043d» \u043f\u0440\u043e\u0438\u0437\u043e\u0448\u043b\u0430 \u043e\u0442 \u043e\u0431\u044b\u0447\u043d\u043e\u0439 \u043f\u0438\u0442\u044c\u0435\u0432\u043e\u0439 \u0447\u0430\u0448\u043a\u0438.<\/div>\n <\/div>\n \n <div class=\"history-item\">\n <div class=\"history-period\">18-19 \u0432\u0435\u043a\u0430<\/div>\n <div class=\"history-description\">\u041f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u043c\u0435\u0440: \u0447\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430 (5\u043c\u043b), \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430 (15\u043c\u043b). \u0420\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u043a\u043e\u043d\u0434\u0438\u0442\u0435\u0440\u0441\u043a\u043e\u0433\u043e \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u0430 \u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043b\u043e \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u0438.<\/div>\n <\/div>\n <div class=\"history-item\">\n <div class=\"history-period\">20 \u0432\u0435\u043a<\/div>\n <div class=\"history-period\">20 \u0432\u0435\u043a<\/div>\n <div class=\"history-description\">\u0420\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u043c\u0435\u0440\u043d\u044b\u0445 \u0441\u0442\u0430\u043a\u0430\u043d\u043e\u0432 \u0438 \u043b\u043e\u0436\u0435\u043a. \u041f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0445 \u0432\u0435\u0441\u043e\u0432. \u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u0438\u0437\u0430\u0446\u0438\u044f \u0440\u0435\u0446\u0435\u043f\u0442\u043e\u0432.<\/div>\n <\/div>\n \n <div class=\"history-item\">\n <div class=\"history-period\">21 \u0432\u0435\u043a<\/div>\n <div class=\"history-description\">\u0426\u0438\u0444\u0440\u043e\u0432\u044b\u0435 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b, \u0443\u043c\u043d\u044b\u0435 \u0442\u0435\u0440\u043c\u043e\u043c\u0435\u0442\u0440\u044b, \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0441 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440\u0430\u043c\u0438 \u043c\u0435\u0440.<\/div>\n <\/div>\n <\/div>\n \n <h3 style=\"color: #5d4037; margin: 30px 0 20px;\">\n <i class=\"fas fa-ruler-combined\"><\/i> \u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0435 \u043c\u0435\u0440\u044b\n <\/h3>\n \n <div class=\"quick-conversions\">\n <div class=\"quick-conversion-item\">\n <div class=\"quick-value\">5 \u043c\u043b<\/div>\n <div class=\"quick-unit\">\u0427\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430<\/div>\n <\/div>\n <div class=\"quick-conversion-item\">\n <div class=\"quick-value\">15 \u043c\u043b<\/div>\n <div class=\"quick-unit\">\u0421\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430<\/div>\n <\/div>\n <div class=\"quick-conversion-item\">\n <div class=\"quick-value\">200 \u043c\u043b<\/div>\n <div class=\"quick-unit\">\u0413\u0440\u0430\u043d\u0435\u043d\u044b\u0439 \u0441\u0442\u0430\u043a\u0430\u043d<\/div>\n <\/div>\n <div class=\"quick-conversion-item\">\n <div class=\"quick-value\">250 \u043c\u043b<\/div>\n <div class=\"quick-unit\">\u0427\u0430\u0439\u043d\u044b\u0439 \u0441\u0442\u0430\u043a\u0430\u043d<\/div>\n <\/div>\n <\/div>\n \n <div class=\"info-box\" style=\"margin-top: 20px;\">\n <p><strong>\u0421\u043e\u0432\u0435\u0442:<\/strong> \u041f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 \u0438\u043d\u043e\u0441\u0442\u0440\u0430\u043d\u043d\u044b\u043c\u0438 \u0440\u0435\u0446\u0435\u043f\u0442\u0430\u043c\u0438 \u043f\u043e\u043c\u043d\u0438\u0442\u0435: 1 \u0430\u043c\u0435\u0440\u0438\u043a\u0430\u043d\u0441\u043a\u0430\u044f \u0447\u0430\u0448\u043a\u0430 = 240 \u043c\u043b, 1 \u0431\u0440\u0438\u0442\u0430\u043d\u0441\u043a\u0430\u044f \u0447\u0430\u0448\u043a\u0430 = 284 \u043c\u043b.<\/p>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"footer\">\n <p>\u00a9 2026 \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 | \u0414\u043b\u044f \u0434\u043e\u043c\u0430\u0448\u043d\u0435\u0439 \u043a\u0443\u0445\u043d\u0438 \u0438 \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0445 \u043f\u043e\u0432\u0430\u0440\u043e\u0432<\/p>\n <\/div>\n <\/div>\n\n <script>\n (function() {\n console.log('=== \u041a\u0423\u041b\u0418\u041d\u0410\u0420\u041d\u042b\u0419 \u041a\u041e\u041d\u0412\u0415\u0420\u0422\u0415\u0420 \u0417\u0410\u0413\u0420\u0423\u0416\u0410\u0415\u0422\u0421\u042f ===');\n \n let calculatorInitialized = false;\n let currentProduct = '\u043c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f';\n let currentTab = 'volume';\n \n \/\/ \u0420\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u043d\u0430\u044f \u0431\u0430\u0437\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432 \u0441 \u0442\u043e\u0447\u043d\u044b\u043c\u0438 \u0434\u0430\u043d\u043d\u044b\u043c\u0438 (\u0433\/\u043c\u043b)\n const productDensity = {\n \/\/ \u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b (\u043f\u0435\u0440\u0432\u044b\u0435 9)\n '\u043c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f': { \n \u0433\u0440\u0430\u043c\u043c: 1, \n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 130, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 160, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 10, \n \u0447\u0430\u0439\u043d\u0430\u044f: 3, \n \u0447\u0430\u0448\u043a\u0430_us: 120, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.57,\n \u043b\u0438\u0442\u0440: 570\n },\n '\u0441\u0430\u0445\u0430\u0440': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 180, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 225, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 20, \n \u0447\u0430\u0439\u043d\u0430\u044f: 7, \n \u0447\u0430\u0448\u043a\u0430_us: 200, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.85,\n \u043b\u0438\u0442\u0440: 850\n },\n '\u0441\u0430\u0445\u0430\u0440\u043d\u0430\u044f \u043f\u0443\u0434\u0440\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 140, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 175, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 12, \n \u0447\u0430\u0439\u043d\u0430\u044f: 4, \n \u0447\u0430\u0448\u043a\u0430_us: 140, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.56,\n \u043b\u0438\u0442\u0440: 560\n },\n '\u043c\u0430\u0441\u043b\u043e \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0435': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 185, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 230, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 15, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 225, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.96,\n \u043b\u0438\u0442\u0440: 960\n },\n '\u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043c\u0430\u0441\u043b\u043e': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 185, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 230, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 15, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 225, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.92,\n \u043b\u0438\u0442\u0440: 920\n },\n '\u043c\u043e\u043b\u043e\u043a\u043e': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 205, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 255, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 15, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 240, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.03,\n \u043b\u0438\u0442\u0440: 1030\n },\n '\u0432\u043e\u0434\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 200, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 250, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 15, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 236.6, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.00,\n \u043b\u0438\u0442\u0440: 1000\n },\n '\u0440\u0438\u0441': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 185, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 230, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 16, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 185, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.85,\n \u043b\u0438\u0442\u0440: 850\n },\n '\u0433\u0440\u0435\u0447\u043a\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 165, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 205, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 15, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 165, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.76,\n \u043b\u0438\u0442\u0440: 760\n },\n \n \/\/ \u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b (\u0434\u043b\u044f \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0435\u0433\u043e \u0441\u043f\u0438\u0441\u043a\u0430)\n '\u043c\u0443\u043a\u0430 \u0440\u0436\u0430\u043d\u0430\u044f': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 125, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 155, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 10, \n \u0447\u0430\u0439\u043d\u0430\u044f: 3, \n \u0447\u0430\u0448\u043a\u0430_us: 115, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.55,\n \u043b\u0438\u0442\u0440: 550\n },\n '\u043c\u0443\u043a\u0430 \u043a\u0443\u043a\u0443\u0440\u0443\u0437\u043d\u0430\u044f': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 140, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 175, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 12, \n \u0447\u0430\u0439\u043d\u0430\u044f: 4, \n \u0447\u0430\u0448\u043a\u0430_us: 140, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.63,\n \u043b\u0438\u0442\u0440: 630\n },\n '\u043c\u0443\u043a\u0430 \u043e\u0432\u0441\u044f\u043d\u0430\u044f': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 90, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 112, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 8, \n \u0447\u0430\u0439\u043d\u0430\u044f: 3, \n \u0447\u0430\u0448\u043a\u0430_us: 90, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.41,\n \u043b\u0438\u0442\u0440: 410\n },\n '\u043c\u0430\u043d\u043d\u0430\u044f \u043a\u0440\u0443\u043f\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 160, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 200, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 14, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 160, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.74,\n \u043b\u0438\u0442\u0440: 740\n },\n '\u043e\u0432\u0441\u044f\u043d\u044b\u0435 \u0445\u043b\u043e\u043f\u044c\u044f': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 80, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 100, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 7, \n \u0447\u0430\u0439\u043d\u0430\u044f: 2, \n \u0447\u0430\u0448\u043a\u0430_us: 80, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.37,\n \u043b\u0438\u0442\u0440: 370\n },\n '\u043f\u0448\u0435\u043d\u043e': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 175, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 220, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 15, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 175, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.81,\n \u043b\u0438\u0442\u0440: 810\n },\n '\u043f\u0435\u0440\u043b\u043e\u0432\u043a\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 170, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 210, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 14, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 170, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.78,\n \u043b\u0438\u0442\u0440: 780\n },\n '\u043e\u0432\u0441\u044f\u043d\u043a\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 85, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 105, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 7, \n \u0447\u0430\u0439\u043d\u0430\u044f: 2, \n \u0447\u0430\u0448\u043a\u0430_us: 85, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.39,\n \u043b\u0438\u0442\u0440: 390\n },\n '\u043c\u0435\u0434': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 285, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 355, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 25, \n \u0447\u0430\u0439\u043d\u0430\u044f: 8, \n \u0447\u0430\u0448\u043a\u0430_us: 340, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.42,\n \u043b\u0438\u0442\u0440: 1420\n },\n '\u0441\u043c\u0435\u0442\u0430\u043d\u0430 20%': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 210, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 260, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 20, \n \u0447\u0430\u0439\u043d\u0430\u044f: 7, \n \u0447\u0430\u0448\u043a\u0430_us: 250, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.05,\n \u043b\u0438\u0442\u0440: 1050\n },\n '\u0442\u0432\u043e\u0440\u043e\u0433': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 220, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 275, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 18, \n \u0447\u0430\u0439\u043d\u0430\u044f: 6, \n \u0447\u0430\u0448\u043a\u0430_us: 220, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.10,\n \u043b\u0438\u0442\u0440: 1100\n },\n '\u0439\u043e\u0433\u0443\u0440\u0442': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 210, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 260, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 18, \n \u0447\u0430\u0439\u043d\u0430\u044f: 6, \n \u0447\u0430\u0448\u043a\u0430_us: 240, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.05,\n \u043b\u0438\u0442\u0440: 1050\n },\n '\u043a\u0430\u043a\u0430\u043e \u043f\u043e\u0440\u043e\u0448\u043e\u043a': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 100, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 125, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 9, \n \u0447\u0430\u0439\u043d\u0430\u044f: 3, \n \u0447\u0430\u0448\u043a\u0430_us: 100, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.46,\n \u043b\u0438\u0442\u0440: 460\n },\n '\u043a\u043e\u0444\u0435 \u043c\u043e\u043b\u043e\u0442\u044b\u0439': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 70, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 85, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 6, \n \u0447\u0430\u0439\u043d\u0430\u044f: 2, \n \u0447\u0430\u0448\u043a\u0430_us: 70, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.32,\n \u043b\u0438\u0442\u0440: 320\n },\n '\u0441\u043e\u043b\u044c': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 240, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 300, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 25, \n \u0447\u0430\u0439\u043d\u0430\u044f: 8, \n \u0447\u0430\u0448\u043a\u0430_us: 280, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.20,\n \u043b\u0438\u0442\u0440: 1200\n },\n '\u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 120, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 150, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 10, \n \u0447\u0430\u0439\u043d\u0430\u044f: 3, \n \u0447\u0430\u0448\u043a\u0430_us: 120, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.55,\n \u043b\u0438\u0442\u0440: 550\n },\n '\u0441\u043e\u0434\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 160, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 200, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 14, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 160, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.74,\n \u043b\u0438\u0442\u0440: 740\n }\n };\n \n \/\/ \u041a\u043e\u044d\u0444\u0444\u0438\u0446\u0438\u0435\u043d\u0442\u044b \u0434\u043b\u044f \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438\n const ounceToGram = 28.35;\n const poundToGram = 453.59;\n \n function initializeCalculator() {\n if (calculatorInitialized) return;\n calculatorInitialized = true;\n \n console.log('\u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440\u0430...');\n \n try {\n initCulinaryConverter();\n console.log('\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d');\n \n \/\/ \u041f\u0435\u0440\u0432\u044b\u0439 \u0440\u0430\u0441\u0447\u0435\u0442\n setTimeout(updateAll, 100);\n \n } catch (error) {\n console.error('\u041e\u0448\u0438\u0431\u043a\u0430 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438:', error);\n calculatorInitialized = false;\n }\n }\n \n function initCulinaryConverter() {\n console.log('\u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440\u0430...');\n \n \/\/ \u041f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b\n const elements = {\n inputValue: document.getElementById('inputValue'),\n fromUnit: document.getElementById('fromUnit'),\n toUnit: document.getElementById('toUnit'),\n resultValue: document.getElementById('resultValue'),\n resultUnit: document.getElementById('resultUnit'),\n swapButton: document.getElementById('swapUnits'),\n calculateBtn: document.getElementById('calculateBtn'),\n resetBtn: document.getElementById('resetBtn'),\n copyBtn: document.getElementById('copyBtn'),\n tempInput: document.getElementById('tempInput'),\n tempCelsius: document.getElementById('tempCelsius'),\n tempFahrenheit: document.getElementById('tempFahrenheit'),\n tempGasMark: document.getElementById('tempGasMark'),\n tempDescription: document.getElementById('tempDescription'),\n customProductInput: document.getElementById('customProductInput'),\n customProductDropdown: document.getElementById('customProductDropdown'),\n \/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u044b\u0445 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0439\n quickGram: document.getElementById('quickGram'),\n quickGlass200: document.getElementById('quickGlass200'),\n quickGlass250: document.getElementById('quickGlass250'),\n quickSpoon: document.getElementById('quickSpoon')\n };\n \n \/\/ \u041d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0435\u0434\u0438\u043d\u0438\u0446\n const unitNames = {\n '\u0433\u0440\u0430\u043c\u043c': ['\u0433\u0440\u0430\u043c\u043c', '\u0433\u0440\u0430\u043c\u043c\u0430', '\u0433\u0440\u0430\u043c\u043c\u043e\u0432'],\n '\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c': ['\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c', '\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430', '\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u043e\u0432'],\n '\u0441\u0442\u0430\u043a\u0430\u043d_200': ['\u0441\u0442\u0430\u043a\u0430\u043d (200\u043c\u043b)', '\u0441\u0442\u0430\u043a\u0430\u043d\u0430 (200\u043c\u043b)', '\u0441\u0442\u0430\u043a\u0430\u043d\u043e\u0432 (200\u043c\u043b)'],\n '\u0441\u0442\u0430\u043a\u0430\u043d_250': ['\u0441\u0442\u0430\u043a\u0430\u043d (250\u043c\u043b)', '\u0441\u0442\u0430\u043a\u0430\u043d\u0430 (250\u043c\u043b)', '\u0441\u0442\u0430\u043a\u0430\u043d\u043e\u0432 (250\u043c\u043b)'],\n '\u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f': ['\u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430', '\u0441\u0442\u043e\u043b\u043e\u0432\u044b\u0435 \u043b\u043e\u0436\u043a\u0438', '\u0441\u0442\u043e\u043b\u043e\u0432\u044b\u0445 \u043b\u043e\u0436\u0435\u043a'],\n '\u0447\u0430\u0439\u043d\u0430\u044f': ['\u0447\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430', '\u0447\u0430\u0439\u043d\u044b\u0435 \u043b\u043e\u0436\u043a\u0438', '\u0447\u0430\u0439\u043d\u044b\u0445 \u043b\u043e\u0436\u0435\u043a'],\n '\u0447\u0430\u0448\u043a\u0430_us': ['\u0447\u0430\u0448\u043a\u0430 (240\u043c\u043b)', '\u0447\u0430\u0448\u043a\u0438 (240\u043c\u043b)', '\u0447\u0430\u0448\u0435\u043a (240\u043c\u043b)'],\n '\u0443\u043d\u0446\u0438\u044f': ['\u0443\u043d\u0446\u0438\u044f', '\u0443\u043d\u0446\u0438\u0438', '\u0443\u043d\u0446\u0438\u0439'],\n '\u0444\u0443\u043d\u0442': ['\u0444\u0443\u043d\u0442', '\u0444\u0443\u043d\u0442\u0430', '\u0444\u0443\u043d\u0442\u043e\u0432'],\n '\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440': ['\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440', '\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440\u0430', '\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440\u043e\u0432'],\n '\u043b\u0438\u0442\u0440': ['\u043b\u0438\u0442\u0440', '\u043b\u0438\u0442\u0440\u0430', '\u043b\u0438\u0442\u0440\u043e\u0432']\n };\n \n \/\/ \u041d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432\n const productNames = {\n '\u043c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f': ['\u043c\u0443\u043a\u0438 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u043e\u0439', '\u043c\u0443\u043a\u0438 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u043e\u0439', '\u043c\u0443\u043a\u0438 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u043e\u0439'],\n '\u0441\u0430\u0445\u0430\u0440': ['\u0441\u0430\u0445\u0430\u0440\u0430', '\u0441\u0430\u0445\u0430\u0440\u0430', '\u0441\u0430\u0445\u0430\u0440\u0430'],\n '\u0441\u0430\u0445\u0430\u0440\u043d\u0430\u044f \u043f\u0443\u0434\u0440\u0430': ['\u0441\u0430\u0445\u0430\u0440\u043d\u043e\u0439 \u043f\u0443\u0434\u0440\u044b', '\u0441\u0430\u0445\u0430\u0440\u043d\u043e\u0439 \u043f\u0443\u0434\u0440\u044b', '\u0441\u0430\u0445\u0430\u0440\u043d\u043e\u0439 \u043f\u0443\u0434\u0440\u044b'],\n '\u043c\u0430\u0441\u043b\u043e \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0435': ['\u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430', '\u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430', '\u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430'],\n '\u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043c\u0430\u0441\u043b\u043e': ['\u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430', '\u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430', '\u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430'],\n '\u043c\u043e\u043b\u043e\u043a\u043e': ['\u043c\u043e\u043b\u043e\u043a\u0430', '\u043c\u043e\u043b\u043e\u043a\u0430', '\u043c\u043e\u043b\u043e\u043a\u0430'],\n '\u0432\u043e\u0434\u0430': ['\u0432\u043e\u0434\u044b', '\u0432\u043e\u0434\u044b', '\u0432\u043e\u0434\u044b'],\n '\u0440\u0438\u0441': ['\u0440\u0438\u0441\u0430', '\u0440\u0438\u0441\u0430', '\u0440\u0438\u0441\u0430'],\n '\u0433\u0440\u0435\u0447\u043a\u0430': ['\u0433\u0440\u0435\u0447\u043a\u0438', '\u0433\u0440\u0435\u0447\u043a\u0438', '\u0433\u0440\u0435\u0447\u043a\u0438'],\n '\u043c\u0443\u043a\u0430 \u0440\u0436\u0430\u043d\u0430\u044f': ['\u0440\u0436\u0430\u043d\u043e\u0439 \u043c\u0443\u043a\u0438', '\u0440\u0436\u0430\u043d\u043e\u0439 \u043c\u0443\u043a\u0438', '\u0440\u0436\u0430\u043d\u043e\u0439 \u043c\u0443\u043a\u0438'],\n '\u043c\u0443\u043a\u0430 \u043a\u0443\u043a\u0443\u0440\u0443\u0437\u043d\u0430\u044f': ['\u043a\u0443\u043a\u0443\u0440\u0443\u0437\u043d\u043e\u0439 \u043c\u0443\u043a\u0438', '\u043a\u0443\u043a\u0443\u0440\u0443\u0437\u043d\u043e\u0439 \u043c\u0443\u043a\u0438', '\u043a\u0443\u043a\u0443\u0440\u0443\u0437\u043d\u043e\u0439 \u043c\u0443\u043a\u0438'],\n '\u043c\u0443\u043a\u0430 \u043e\u0432\u0441\u044f\u043d\u0430\u044f': ['\u043e\u0432\u0441\u044f\u043d\u043e\u0439 \u043c\u0443\u043a\u0438', '\u043e\u0432\u0441\u044f\u043d\u043e\u0439 \u043c\u0443\u043a\u0438', '\u043e\u0432\u0441\u044f\u043d\u043e\u0439 \u043c\u0443\u043a\u0438'],\n '\u043c\u0430\u043d\u043d\u0430\u044f \u043a\u0440\u0443\u043f\u0430': ['\u043c\u0430\u043d\u043d\u043e\u0439 \u043a\u0440\u0443\u043f\u044b', '\u043c\u0430\u043d\u043d\u043e\u0439 \u043a\u0440\u0443\u043f\u044b', '\u043c\u0430\u043d\u043d\u043e\u0439 \u043a\u0440\u0443\u043f\u044b'],\n '\u043e\u0432\u0441\u044f\u043d\u044b\u0435 \u0445\u043b\u043e\u043f\u044c\u044f': ['\u043e\u0432\u0441\u044f\u043d\u044b\u0445 \u0445\u043b\u043e\u043f\u044c\u0435\u0432', '\u043e\u0432\u0441\u044f\u043d\u044b\u0445 \u0445\u043b\u043e\u043f\u044c\u0435\u0432', '\u043e\u0432\u0441\u044f\u043d\u044b\u0445 \u0445\u043b\u043e\u043f\u044c\u0435\u0432'],\n '\u043f\u0448\u0435\u043d\u043e': ['\u043f\u0448\u0435\u043d\u0430', '\u043f\u0448\u0435\u043d\u0430', '\u043f\u0448\u0435\u043d\u0430'],\n '\u043f\u0435\u0440\u043b\u043e\u0432\u043a\u0430': ['\u043f\u0435\u0440\u043b\u043e\u0432\u043a\u0438', '\u043f\u0435\u0440\u043b\u043e\u0432\u043a\u0438', '\u043f\u0435\u0440\u043b\u043e\u0432\u043a\u0438'],\n '\u043e\u0432\u0441\u044f\u043d\u043a\u0430': ['\u043e\u0432\u0441\u044f\u043d\u043a\u0438', '\u043e\u0432\u0441\u044f\u043d\u043a\u0438', '\u043e\u0432\u0441\u044f\u043d\u043a\u0438'],\n '\u043c\u0435\u0434': ['\u043c\u0435\u0434\u0430', '\u043c\u0435\u0434\u0430', '\u043c\u0435\u0434\u0430'],\n '\u0441\u043c\u0435\u0442\u0430\u043d\u0430 20%': ['\u0441\u043c\u0435\u0442\u0430\u043d\u044b', '\u0441\u043c\u0435\u0442\u0430\u043d\u044b', '\u0441\u043c\u0435\u0442\u0430\u043d\u044b'],\n '\u0442\u0432\u043e\u0440\u043e\u0433': ['\u0442\u0432\u043e\u0440\u043e\u0433\u0430', '\u0442\u0432\u043e\u0440\u043e\u0433\u0430', '\u0442\u0432\u043e\u0440\u043e\u0433\u0430'],\n '\u0439\u043e\u0433\u0443\u0440\u0442': ['\u0439\u043e\u0433\u0443\u0440\u0442\u0430', '\u0439\u043e\u0433\u0443\u0440\u0442\u0430', '\u0439\u043e\u0433\u0443\u0440\u0442\u0430'],\n '\u043a\u0430\u043a\u0430\u043e \u043f\u043e\u0440\u043e\u0448\u043e\u043a': ['\u043a\u0430\u043a\u0430\u043e-\u043f\u043e\u0440\u043e\u0448\u043a\u0430', '\u043a\u0430\u043a\u0430\u043e-\u043f\u043e\u0440\u043e\u0448\u043a\u0430', '\u043a\u0430\u043a\u0430\u043e-\u043f\u043e\u0440\u043e\u0448\u043a\u0430'],\n '\u043a\u043e\u0444\u0435 \u043c\u043e\u043b\u043e\u0442\u044b\u0439': ['\u043c\u043e\u043b\u043e\u0442\u043e\u0433\u043e \u043a\u043e\u0444\u0435', '\u043c\u043e\u043b\u043e\u0442\u043e\u0433\u043e \u043a\u043e\u0444\u0435', '\u043c\u043e\u043b\u043e\u0442\u043e\u0433\u043e \u043a\u043e\u0444\u0435'],\n '\u0441\u043e\u043b\u044c': ['\u0441\u043e\u043b\u0438', '\u0441\u043e\u043b\u0438', '\u0441\u043e\u043b\u0438'],\n '\u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c': ['\u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f', '\u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f', '\u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f'],\n '\u0441\u043e\u0434\u0430': ['\u0441\u043e\u0434\u044b', '\u0441\u043e\u0434\u044b', '\u0441\u043e\u0434\u044b']\n };\n \n \/\/ \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u044f \u043e\u0431\u044a\u0435\u043c\u0430\/\u0432\u0435\u0441\u0430\n function convertCulinary(value, from, to, product) {\n if (!productDensity[product]) return value;\n \n \/\/ \u0421\u043d\u0430\u0447\u0430\u043b\u0430 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0438\u0440\u0443\u0435\u043c \u0432 \u0433\u0440\u0430\u043c\u043c\u044b\n let grams;\n \n switch(from) {\n case '\u0433\u0440\u0430\u043c\u043c':\n grams = value;\n break;\n case '\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c':\n grams = value * 1000;\n break;\n case '\u0443\u043d\u0446\u0438\u044f':\n grams = value * ounceToGram;\n break;\n case '\u0444\u0443\u043d\u0442':\n grams = value * poundToGram;\n break;\n case '\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440':\n grams = value * productDensity[product].\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440;\n break;\n case '\u043b\u0438\u0442\u0440':\n grams = value * productDensity[product].\u043b\u0438\u0442\u0440;\n break;\n default:\n \/\/ \u0418\u0437 \u043e\u0431\u044a\u0435\u043c\u043d\u043e\u0439 \u043c\u0435\u0440\u044b \u0432 \u0433\u0440\u0430\u043c\u043c\u044b\n const fromValue = productDensity[product][from];\n if (!fromValue) return value;\n grams = value * fromValue;\n }\n \n \/\/ \u0417\u0430\u0442\u0435\u043c \u0438\u0437 \u0433\u0440\u0430\u043c\u043c\u043e\u0432 \u0432 \u043d\u0443\u0436\u043d\u0443\u044e \u0435\u0434\u0438\u043d\u0438\u0446\u0443\n switch(to) {\n case '\u0433\u0440\u0430\u043c\u043c':\n return grams;\n case '\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c':\n return grams \/ 1000;\n case '\u0443\u043d\u0446\u0438\u044f':\n return grams \/ ounceToGram;\n case '\u0444\u0443\u043d\u0442':\n return grams \/ poundToGram;\n case '\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440':\n return grams \/ productDensity[product].\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440;\n case '\u043b\u0438\u0442\u0440':\n return grams \/ productDensity[product].\u043b\u0438\u0442\u0440;\n default:\n \/\/ \u0418\u0437 \u0433\u0440\u0430\u043c\u043c\u043e\u0432 \u0432 \u043e\u0431\u044a\u0435\u043c\u043d\u0443\u044e \u043c\u0435\u0440\u0443\n const toValue = productDensity[product][to];\n if (!toValue) return grams;\n return grams \/ toValue;\n }\n }\n \n \/\/ \u0424\u043e\u0440\u043c\u0430\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0447\u0438\u0441\u043b\u0430\n function formatNumber(num) {\n if (num === 0 || isNaN(num)) return '0';\n const absNum = Math.abs(num);\n \n if (absNum >= 1000) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 1 });\n } else if (absNum >= 100) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 1 });\n } else if (absNum >= 10) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 2 });\n } else if (absNum >= 1) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 3 });\n } else {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 4 });\n }\n }\n \n \/\/ \u0424\u043e\u0440\u043c\u0430 \u0441\u043b\u043e\u0432\u0430\n function getUnitForm(result, unitKey, productKey) {\n if (!unitNames[unitKey] || !productNames[productKey]) return '';\n \n const absResult = Math.abs(result);\n \n \/\/ \u0414\u043b\u044f \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0430 1\n if (Math.abs(absResult - 1) < 0.01) {\n return unitNames[unitKey][0] + ' ' + productNames[productKey][0];\n }\n \n \/\/ \u0414\u043b\u044f 2, 3, 4 (\u043d\u043e \u043d\u0435 12, 13, 14)\n const lastDigit = Math.floor(absResult) % 10;\n const lastTwoDigits = Math.floor(absResult) % 100;\n \n var condition1 = lastDigit >= 2;\n var condition2 = lastDigit <= 4;\n var condition3 = lastTwoDigits < 10;\n var condition4 = lastTwoDigits >= 20;\n \n if (condition1 && condition2 && (condition3 || condition4)) {\n return unitNames[unitKey][1] + ' ' + productNames[productKey][1];\n }\n \n return unitNames[unitKey][2] + ' ' + productNames[productKey][2];\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0441\u0435\u0445 \u0434\u0430\u043d\u043d\u044b\u0445 - \u041e\u0421\u041d\u041e\u0412\u041d\u041e\u0419 \u0418\u0421\u041f\u0420\u0410\u0412\u041b\u0415\u041d\u041d\u042b\u0419 \u041c\u0415\u0422\u041e\u0414\n function updateAll() {\n try {\n if (currentTab === 'volume') {\n const value = parseFloat(elements.inputValue.value) || 0;\n const from = elements.fromUnit.value;\n const to = elements.toUnit.value;\n \n const result = convertCulinary(value, from, to, currentProduct);\n \n elements.resultValue.textContent = formatNumber(result);\n elements.resultUnit.textContent = getUnitForm(result, to, currentProduct);\n \n \/\/ \u0412\u0410\u0416\u041d\u041e\u0415 \u0418\u0421\u041f\u0420\u0410\u0412\u041b\u0415\u041d\u0418\u0415: \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0431\u044b\u0441\u0442\u0440\u044b\u0435 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438\n updateQuickConversions(value, from);\n \n \/\/ \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f\n elements.resultValue.classList.remove('pulse');\n void elements.resultValue.offsetWidth;\n elements.resultValue.classList.add('pulse');\n \n } else if (currentTab === 'temperature') {\n updateTemperature();\n }\n \n } catch (error) {\n console.error('\u041e\u0448\u0438\u0431\u043a\u0430 \u043f\u0440\u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0438:', error);\n if (elements.resultValue) {\n elements.resultValue.textContent = '\u041e\u0428\u0418\u0411\u041a\u0410';\n elements.resultUnit.textContent = '';\n }\n }\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0431\u044b\u0441\u0442\u0440\u044b\u0445 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0439 - \u0418\u0421\u041f\u0420\u0410\u0412\u041b\u0415\u041d\u041d\u0410\u042f \u0412\u0415\u0420\u0421\u0418\u042f\n function updateQuickConversions(value, from) {\n \/\/ \u0421\u043f\u0438\u0441\u043e\u043a \u0435\u0434\u0438\u043d\u0438\u0446 \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u044b\u0445 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0439\n const quickUnits = [\n { id: 'quickGram', unit: '\u0433\u0440\u0430\u043c\u043c' },\n { id: 'quickGlass200', unit: '\u0441\u0442\u0430\u043a\u0430\u043d_200' },\n { id: 'quickGlass250', unit: '\u0441\u0442\u0430\u043a\u0430\u043d_250' },\n { id: 'quickSpoon', unit: '\u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f' }\n ];\n \n quickUnits.forEach(item => {\n const element = elements[item.id];\n if (element) {\n const result = convertCulinary(value, from, item.unit, currentProduct);\n element.textContent = formatNumber(result);\n }\n });\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u044b\n function updateTemperature() {\n try {\n const celsius = parseFloat(elements.tempInput.value) || 0;\n \n \/\/ \u0424\u0430\u0440\u0435\u043d\u0433\u0435\u0439\u0442\n const fahrenheit = (celsius * 9\/5) + 32;\n if (elements.tempFahrenheit) {\n elements.tempFahrenheit.textContent = Math.round(fahrenheit);\n }\n \n \/\/ \u0413\u0430\u0437\u043e\u0432\u0430\u044f \u043c\u0430\u0440\u043a\u0438\u0440\u043e\u0432\u043a\u0430\n let gasMark;\n let description;\n \n if (celsius < 110) { gasMark = '\u00bc'; description = '\u041e\u0447\u0435\u043d\u044c \u0441\u043b\u0430\u0431\u044b\u0439'; }\n else if (celsius < 130) { gasMark = '\u00bd'; description = '\u0421\u043b\u0430\u0431\u044b\u0439'; }\n else if (celsius < 140) { gasMark = '1'; description = '\u041e\u0447\u0435\u043d\u044c \u043d\u0438\u0437\u043a\u0438\u0439'; }\n else if (celsius < 150) { gasMark = '2'; description = '\u041d\u0438\u0437\u043a\u0438\u0439'; }\n else if (celsius < 170) { gasMark = '3'; description = '\u0421\u0440\u0435\u0434\u043d\u0438\u0439'; }\n else if (celsius < 180) { gasMark = '4'; description = '\u0421\u0440\u0435\u0434\u043d\u0438\u0439 \u0436\u0430\u0440'; }\n else if (celsius < 190) { gasMark = '5'; description = '\u0423\u043c\u0435\u0440\u0435\u043d\u043d\u044b\u0439 \u0436\u0430\u0440'; }\n else if (celsius < 200) { gasMark = '6'; description = '\u0421\u0440\u0435\u0434\u043d\u0435-\u0441\u0438\u043b\u044c\u043d\u044b\u0439'; }\n else if (celsius < 220) { gasMark = '7'; description = '\u0421\u0438\u043b\u044c\u043d\u044b\u0439 \u0436\u0430\u0440'; }\n else if (celsius < 230) { gasMark = '8'; description = '\u041e\u0447\u0435\u043d\u044c \u0441\u0438\u043b\u044c\u043d\u044b\u0439'; }\n else { gasMark = '9'; description = '\u041c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u0439'; }\n \n if (elements.tempGasMark) {\n elements.tempGasMark.textContent = gasMark;\n }\n \n if (elements.tempDescription) {\n elements.tempDescription.textContent = description;\n }\n \n if (elements.tempCelsius) {\n elements.tempCelsius.textContent = Math.round(celsius);\n }\n \n } catch (error) {\n console.error('\u041e\u0448\u0438\u0431\u043a\u0430 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u044b:', error);\n }\n }\n \n \/\/ \u041f\u043e\u043a\u0430\u0437 \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u044f\n function showToast(message) {\n \/\/ \u0423\u0434\u0430\u043b\u044f\u0435\u043c \u0441\u0442\u0430\u0440\u044b\u0435 \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u044f\n const oldToasts = document.querySelectorAll('.toast');\n oldToasts.forEach(toast => toast.remove());\n \n const toast = document.createElement('div');\n toast.className = 'toast';\n toast.textContent = message;\n document.body.appendChild(toast);\n \n setTimeout(() => {\n toast.style.opacity = '0';\n toast.style.transition = 'opacity 0.3s';\n setTimeout(() => toast.remove(), 300);\n }, 3000);\n }\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0432\u043a\u043b\u0430\u0434\u043e\u043a\n function initTabs() {\n const tabButtons = document.querySelectorAll('.tab-btn');\n const tabContents = document.querySelectorAll('.tab-content');\n \n tabButtons.forEach(button => {\n button.addEventListener('click', function() {\n const tabId = this.getAttribute('data-tab');\n currentTab = tabId;\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0435 \u043a\u043d\u043e\u043f\u043a\u0438\n tabButtons.forEach(btn => btn.classList.remove('active'));\n this.classList.add('active');\n \n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\n tabContents.forEach(content => {\n content.classList.remove('active');\n if (content.id === 'tab-' + tabId) {\n content.classList.add('active');\n }\n });\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0434\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0439 \u0432\u043a\u043b\u0430\u0434\u043a\u0438\n setTimeout(updateAll, 100);\n });\n });\n }\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432 (9 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445)\n function initProductSelector() {\n const productButtons = document.querySelectorAll('.product-btn');\n \n productButtons.forEach(button => {\n button.addEventListener('click', function() {\n const product = this.getAttribute('data-product');\n currentProduct = product;\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0435 \u043a\u043d\u043e\u043f\u043a\u0438\n productButtons.forEach(btn => btn.classList.remove('active'));\n this.classList.add('active');\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0438\u0439 \u0441\u043f\u0438\u0441\u043e\u043a\n elements.customProductInput.textContent = product;\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0440\u0430\u0441\u0447\u0435\u0442\n updateAll();\n \n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u0435\n showToast(`\u0412\u044b\u0431\u0440\u0430\u043d \u043f\u0440\u043e\u0434\u0443\u043a\u0442: ${product}`);\n });\n });\n }\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0435\u0433\u043e \u0441\u043f\u0438\u0441\u043a\u0430 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432\n function initCustomProductSelector() {\n \/\/ \u0417\u0430\u043f\u043e\u043b\u043d\u044f\u0435\u043c \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0438\u0439 \u0441\u043f\u0438\u0441\u043e\u043a\n const dropdown = elements.customProductDropdown;\n dropdown.innerHTML = '';\n \n \/\/ \u0421\u043e\u0431\u0438\u0440\u0430\u0435\u043c \u0432\u0441\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0435 \u0432 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 9\n const allProducts = Object.keys(productDensity);\n const mainProducts = Array.from(document.querySelectorAll('.product-btn'))\n .map(btn => btn.getAttribute('data-product'));\n \n const additionalProducts = allProducts.filter(product => !mainProducts.includes(product));\n \n \/\/ \u0421\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u043c \u043f\u043e \u0430\u043b\u0444\u0430\u0432\u0438\u0442\u0443\n additionalProducts.sort();\n \n \/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0432 \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0438\u0439 \u0441\u043f\u0438\u0441\u043e\u043a\n additionalProducts.forEach(product => {\n const item = document.createElement('div');\n item.className = 'dropdown-item';\n item.textContent = product;\n item.addEventListener('click', function() {\n currentProduct = product;\n elements.customProductInput.textContent = product;\n dropdown.classList.remove('active');\n \n \/\/ \u0421\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 \u043a\u043d\u043e\u043f\u043e\u043a\n document.querySelectorAll('.product-btn').forEach(btn => {\n btn.classList.remove('active');\n });\n \n updateAll();\n showToast(`\u0412\u044b\u0431\u0440\u0430\u043d \u043f\u0440\u043e\u0434\u0443\u043a\u0442: ${product}`);\n });\n dropdown.appendChild(item);\n });\n \n \/\/ \u041e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043a\u043b\u0438\u043a\u0430 \u043d\u0430 \u043f\u043e\u043b\u0435 \u0432\u0432\u043e\u0434\u0430\n elements.customProductInput.addEventListener('click', function() {\n dropdown.classList.toggle('active');\n });\n \n \/\/ \u0417\u0430\u043a\u0440\u044b\u0442\u0438\u0435 \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0435\u0433\u043e \u0441\u043f\u0438\u0441\u043a\u0430 \u043f\u0440\u0438 \u043a\u043b\u0438\u043a\u0435 \u0432\u043d\u0435 \u0435\u0433\u043e\n document.addEventListener('click', function(event) {\n if (!elements.customProductInput.contains(event.target) && \n !dropdown.contains(event.target)) {\n dropdown.classList.remove('active');\n }\n });\n }\n \n \/\/ \u041d\u0430\u0437\u043d\u0430\u0447\u0430\u0435\u043c \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u0441\u043e\u0431\u044b\u0442\u0438\u0439\n if (elements.inputValue) elements.inputValue.addEventListener('input', updateAll);\n if (elements.fromUnit) elements.fromUnit.addEventListener('change', updateAll);\n if (elements.toUnit) elements.toUnit.addEventListener('change', updateAll);\n if (elements.tempInput) elements.tempInput.addEventListener('input', updateTemperature);\n \n \/\/ \u041a\u043d\u043e\u043f\u043a\u0430 \u043e\u0431\u043c\u0435\u043d\u0430\n if (elements.swapButton) {\n elements.swapButton.addEventListener('click', function() {\n const temp = elements.fromUnit.value;\n elements.fromUnit.value = elements.toUnit.value;\n elements.toUnit.value = temp;\n updateAll();\n });\n }\n \n \/\/ \u041a\u043d\u043e\u043f\u043a\u0430 \u0440\u0430\u0441\u0447\u0435\u0442\u0430\n if (elements.calculateBtn) elements.calculateBtn.addEventListener('click', updateAll);\n \n \/\/ \u041a\u043d\u043e\u043f\u043a\u0430 \u0441\u0431\u0440\u043e\u0441\u0430\n if (elements.resetBtn) {\n elements.resetBtn.addEventListener('click', function() {\n if (currentTab === 'volume') {\n elements.inputValue.value = '100';\n elements.fromUnit.value = '\u0433\u0440\u0430\u043c\u043c';\n elements.toUnit.value = '\u0441\u0442\u0430\u043a\u0430\u043d_200';\n currentProduct = '\u043c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f';\n \n \/\/ \u0421\u0431\u0440\u043e\u0441 \u043a\u043d\u043e\u043f\u043e\u043a \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430\n document.querySelectorAll('.product-btn').forEach(btn => {\n btn.classList.remove('active');\n if (btn.getAttribute('data-product') === '\u043c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f') {\n btn.classList.add('active');\n }\n });\n \n \/\/ \u0421\u0431\u0440\u043e\u0441 \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0435\u0433\u043e \u0441\u043f\u0438\u0441\u043a\u0430\n elements.customProductInput.textContent = '\u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u0438\u0437 \u0441\u043f\u0438\u0441\u043a\u0430...';\n \n updateAll();\n \n } else if (currentTab === 'temperature') {\n elements.tempInput.value = '180';\n updateTemperature();\n }\n \n \/\/ \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u043a\u043d\u043e\u043f\u043a\u0438\n const originalHTML = this.innerHTML;\n this.innerHTML = '<i class=\"fas fa-check\"><\/i> \u0421\u0431\u0440\u043e\u0448\u0435\u043d\u043e!';\n this.style.background = '#27ae60';\n setTimeout(() => {\n this.innerHTML = originalHTML;\n this.style.background = '';\n }, 1500);\n \n showToast('\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0441\u0431\u0440\u043e\u0448\u0435\u043d\u044b');\n });\n }\n \n \/\/ \u041a\u043d\u043e\u043f\u043a\u0430 \u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f\n if (elements.copyBtn) {\n elements.copyBtn.addEventListener('click', function() {\n let text = '';\n \n if (currentTab === 'volume') {\n text = elements.resultValue.textContent + ' ' + elements.resultUnit.textContent;\n } else if (currentTab === 'temperature') {\n text = `\u0414\u0443\u0445\u043e\u0432\u043a\u0430: ${elements.tempCelsius.textContent}\u00b0C \/ ${elements.tempFahrenheit.textContent}\u00b0F \/ \u0413\u0430\u0437 ${elements.tempGasMark.textContent}`\n } else {\n text = '\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440';\n }\n \n if (navigator.clipboard && navigator.clipboard.writeText) {\n navigator.clipboard.writeText(text).then(() => {\n const originalHTML = this.innerHTML;\n this.innerHTML = '<i class=\"fas fa-check\"><\/i> \u0421\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u043e!';\n this.style.background = '#27ae60';\n setTimeout(() => {\n this.innerHTML = originalHTML;\n this.style.background = '';\n }, 1500);\n showToast('\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d');\n });\n } else {\n const textArea = document.createElement('textarea');\n textArea.value = text;\n document.body.appendChild(textArea);\n textArea.select();\n try {\n document.execCommand('copy');\n const originalHTML = this.innerHTML;\n this.innerHTML = '<i class=\"fas fa-check\"><\/i> \u0421\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u043e!';\n this.style.background = '#27ae60';\n setTimeout(() => {\n this.innerHTML = originalHTML;\n this.style.background = '';\n }, 1500);\n showToast('\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d');\n } catch (err) {\n showToast('\u041d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c');\n }\n document.body.removeChild(textArea);\n }\n });\n }\n \n \/\/ \u0411\u044b\u0441\u0442\u0440\u044b\u0435 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438 - \u0418\u0421\u041f\u0420\u0410\u0412\u041b\u0415\u041d\u041d\u042b\u0419 \u041e\u0411\u0420\u0410\u0411\u041e\u0422\u0427\u0418\u041a \u0421\u041e\u0411\u042b\u0422\u0418\u0419\n document.querySelectorAll('.quick-conversion-item').forEach(item => {\n item.addEventListener('click', function() {\n if (currentTab !== 'volume') return;\n \n const targetUnit = this.getAttribute('data-unit');\n const quickValueElement = this.querySelector('.quick-value');\n \n if (targetUnit && quickValueElement) {\n \/\/ \u041f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0438\u0437 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440\u0430\n const value = parseFloat(elements.inputValue.value) || 0;\n const from = elements.fromUnit.value;\n \n \/\/ \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0438\u0440\u0443\u0435\u043c \u0432 \u0446\u0435\u043b\u0435\u0432\u0443\u044e \u0435\u0434\u0438\u043d\u0438\u0446\u0443\n const result = convertCulinary(value, from, targetUnit, currentProduct);\n const formattedResult = formatNumber(result);\n \n \/\/ \u0421\u043e\u0437\u0434\u0430\u0435\u043c \u0442\u0435\u043a\u0441\u0442 \u0434\u043b\u044f \u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f\n const unitForm = getUnitForm(result, targetUnit, currentProduct);\n const text = `${formattedResult} ${unitForm}`;\n \n if (navigator.clipboard && navigator.clipboard.writeText) {\n navigator.clipboard.writeText(text).then(() => {\n \/\/ \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0438 \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u0435\n this.classList.add('active');\n setTimeout(() => this.classList.remove('active'), 1000);\n \n const unitName = unitNames[targetUnit] ? unitNames[targetUnit][2] : targetUnit;\n showToast(`\u0421\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u043e: ${formattedResult} ${unitName}`);\n });\n } else {\n \/\/ Fallback \u0434\u043b\u044f \u0441\u0442\u0430\u0440\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432\n const textArea = document.createElement('textarea');\n textArea.value = text;\n document.body.appendChild(textArea);\n textArea.select();\n try {\n document.execCommand('copy');\n this.classList.add('active');\n setTimeout(() => this.classList.remove('active'), 1000);\n \n const unitName = unitNames[targetUnit] ? unitNames[targetUnit][2] : targetUnit;\n showToast(`\u0421\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u043e: ${formattedResult} ${unitName}`);\n } catch (err) {\n showToast('\u041d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c');\n }\n document.body.removeChild(textArea);\n }\n }\n });\n });\n \n \/\/ \u042d\u043a\u0432\u0438\u0432\u0430\u043b\u0435\u043d\u0442\u044b \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432\n document.querySelectorAll('.equivalent-card').forEach(card => {\n card.addEventListener('click', function() {\n const title = this.querySelector('.equivalent-title').textContent;\n const value = this.querySelector('.equivalent-value').textContent;\n \n let text = title + ': ' + value;\n const unit = this.querySelector('.quick-unit');\n if (unit) {\n text += ' (' + unit.textContent + ')';\n }\n \n if (navigator.clipboard && navigator.clipboard.writeText) {\n navigator.clipboard.writeText(text).then(() => {\n showToast('\u042d\u043a\u0432\u0438\u0432\u0430\u043b\u0435\u043d\u0442 \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d');\n });\n } else {\n const textArea = document.createElement('textarea');\n textArea.value = text;\n document.body.appendChild(textArea);\n textArea.select();\n try {\n document.execCommand('copy');\n showToast('\u042d\u043a\u0432\u0438\u0432\u0430\u043b\u0435\u043d\u0442 \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d');\n } catch (err) {\n showToast('\u041d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c');\n }\n document.body.removeChild(textArea);\n }\n });\n });\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f\n initTabs();\n initProductSelector();\n initCustomProductSelector();\n \n \/\/ \u0412\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u043c \u043f\u0435\u0440\u0432\u043e\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u044b\u0439 \u0440\u0430\u0441\u0447\u0435\u0442\n setTimeout(() => {\n updateAll();\n updateTemperature();\n }, 100);\n \n return {\n elements: elements,\n convertCulinary: convertCulinary,\n updateAll: updateAll\n };\n }\n \n \/\/ \u0417\u0430\u043f\u0443\u0441\u043a \u043f\u0440\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0441\u043e\u0431\u044b\u0442\u0438\u044f\u0445\n if (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', initializeCalculator);\n } else {\n initializeCalculator();\n }\n \n window.addEventListener('load', initializeCalculator);\n setTimeout(initializeCalculator, 3000);\n \n \/\/ \u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438\n window.reloadCulinaryConverter = function() {\n calculatorInitialized = false;\n initializeCalculator();\n showToast('\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d');\n };\n \n })();\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<!DOCTYPE html>\n<html lang=\"ru\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u0430\u044f \u044d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u044f<\/title>\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n }\n \n body {\n background: linear-gradient(135deg, #ff9a9e 0%, #fad0c4 100%);\n color: #333;\n line-height: 1.6;\n min-height: 100vh;\n padding: 20px;\n }\n \n .container {\n max-width: 1400px;\n margin: 0 auto;\n padding: 0 15px;\n }\n \n .header {\n text-align: center;\n margin-bottom: 40px;\n color: #5d4037;\n text-shadow: 0 2px 5px rgba(0,0,0,0.1);\n }\n \n .header h1 {\n font-size: 2.8rem;\n margin-bottom: 15px;\n }\n \n .header p {\n font-size: 1.2rem;\n opacity: 0.9;\n max-width: 800px;\n margin: 0 auto;\n color: #795548;\n }\n \n .main-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 30px;\n margin-bottom: 40px;\n }\n \n @media (max-width: 1100px) {\n .main-grid {\n grid-template-columns: 1fr;\n }\n }\n \n \/* \u041e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0431\u043b\u043e\u043a \u044d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u0438 *\/\n .encyclopedia-section {\n background: linear-gradient(135deg, #ffcc80 0%, #ffb74d 100%);\n color: #5d4037;\n border-radius: 25px;\n padding: 35px;\n box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);\n transition: all 0.4s ease;\n position: relative;\n overflow: hidden;\n }\n \n .encyclopedia-section:hover {\n transform: translateY(-5px);\n box-shadow: 0 25px 60px rgba(0, 0, 0, 0.2);\n }\n \n .section-title {\n color: #5d4037;\n margin-bottom: 25px;\n display: flex;\n align-items: center;\n gap: 15px;\n font-size: 1.8rem;\n position: relative;\n z-index: 2;\n }\n \n .section-title i {\n color: #ff7043;\n }\n \n \/* \u0418\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0435 \u043a\u0430\u0440\u0442\u043e\u0447\u043a\u0438 *\/\n .interactive-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n gap: 20px;\n margin-top: 30px;\n position: relative;\n z-index: 2;\n }\n \n .interactive-card {\n background: rgba(255, 255, 255, 0.9);\n backdrop-filter: blur(10px);\n border-radius: 20px;\n padding: 25px;\n border: 1px solid rgba(255, 112, 67, 0.2);\n transition: all 0.4s ease;\n cursor: pointer;\n position: relative;\n overflow: hidden;\n }\n \n .interactive-card:hover {\n transform: translateY(-8px);\n background: rgba(255, 255, 255, 1);\n box-shadow: 0 15px 35px rgba(255, 112, 67, 0.15);\n }\n \n .interactive-card::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 4px;\n background: linear-gradient(90deg, #ff7043, #ffb74d);\n }\n \n .card-icon {\n font-size: 2.5rem;\n color: #ff7043;\n margin-bottom: 20px;\n transition: transform 0.3s ease;\n }\n \n .interactive-card:hover .card-icon {\n transform: scale(1.1);\n }\n \n .card-title {\n font-size: 1.3rem;\n font-weight: 700;\n margin-bottom: 15px;\n color: #5d4037;\n }\n \n .card-content {\n font-size: 0.95rem;\n line-height: 1.5;\n color: #666;\n margin-bottom: 15px;\n }\n \n .external-links {\n display: flex;\n flex-wrap: wrap;\n gap: 10px;\n margin-top: 20px;\n }\n \n .ext-link {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n padding: 8px 16px;\n background: rgba(255, 112, 67, 0.1);\n border-radius: 50px;\n text-decoration: none;\n color: #ff7043;\n font-size: 0.85rem;\n transition: all 0.3s ease;\n border: 1px solid rgba(255, 112, 67, 0.2);\n }\n \n .ext-link:hover {\n background: rgba(255, 112, 67, 0.2);\n color: #e64a19;\n transform: translateY(-2px);\n box-shadow: 0 5px 15px rgba(255, 112, 67, 0.1);\n }\n \n .ext-link i {\n font-size: 0.8rem;\n }\n \n \/* \u0418\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u0430\u044f \u0442\u0430\u0431\u043b\u0438\u0446\u0430 *\/\n .info-table {\n width: 100%;\n background: rgba(255, 255, 255, 0.9);\n border-radius: 15px;\n overflow: hidden;\n margin: 25px 0;\n border: 1px solid rgba(255, 112, 67, 0.2);\n }\n \n .table-header {\n background: rgba(255, 112, 67, 0.15);\n padding: 15px;\n display: flex;\n justify-content: space-between;\n font-weight: 700;\n color: #5d4037;\n }\n \n .table-row {\n display: flex;\n justify-content: space-between;\n padding: 12px 15px;\n border-bottom: 1px solid rgba(255, 112, 67, 0.1);\n transition: background 0.3s ease;\n }\n \n .table-row:hover {\n background: rgba(255, 112, 67, 0.05);\n }\n \n .table-row:last-child {\n border-bottom: none;\n }\n \n \/* \u0424\u0430\u043a\u0442\u044b \u0438 \u0441\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0430 *\/\n .facts-container {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\n gap: 20px;\n margin-top: 30px;\n }\n \n .fact-card {\n background: rgba(255, 255, 255, 0.9);\n padding: 20px;\n border-radius: 15px;\n border-left: 4px solid #ff7043;\n transition: all 0.3s ease;\n cursor: pointer;\n }\n \n .fact-card:hover {\n transform: translateX(5px);\n box-shadow: 0 10px 20px rgba(255, 112, 67, 0.1);\n }\n \n .fact-number {\n font-size: 2rem;\n font-weight: 800;\n color: #ff7043;\n margin-bottom: 10px;\n }\n \n .fact-text {\n font-size: 0.95rem;\n line-height: 1.4;\n color: #666;\n }\n \n \/* \u0418\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0439 \u0442\u0435\u0441\u0442 *\/\n .quiz-container {\n background: rgba(255, 255, 255, 0.9);\n border-radius: 20px;\n padding: 25px;\n margin-top: 30px;\n border: 2px solid rgba(255, 112, 67, 0.2);\n }\n \n .quiz-question {\n font-size: 1.1rem;\n margin-bottom: 20px;\n color: #5d4037;\n font-weight: 600;\n }\n \n .quiz-options {\n display: flex;\n flex-direction: column;\n gap: 10px;\n }\n \n .quiz-option {\n padding: 15px;\n background: rgba(255, 112, 67, 0.05);\n border-radius: 10px;\n cursor: pointer;\n transition: all 0.3s ease;\n border: 2px solid transparent;\n color: #5d4037;\n }\n \n .quiz-option:hover {\n background: rgba(255, 112, 67, 0.1);\n transform: translateX(5px);\n }\n \n .quiz-option.correct {\n background: rgba(76, 175, 80, 0.1);\n border-color: #4caf50;\n color: #2e7d32;\n }\n \n .quiz-option.incorrect {\n background: rgba(244, 67, 54, 0.1);\n border-color: #f44336;\n color: #c62828;\n }\n \n \/* \u0412\u0442\u043e\u0440\u043e\u0439 \u0431\u043b\u043e\u043a: \u041f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b *\/\n .tools-section {\n background: linear-gradient(135deg, #a5d6a7 0%, #81c784 100%);\n color: #2e7d32;\n border-radius: 25px;\n padding: 35px;\n box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);\n }\n \n .tools-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\n gap: 20px;\n margin-top: 25px;\n }\n \n .tool-card {\n background: rgba(255, 255, 255, 0.9);\n padding: 25px;\n border-radius: 15px;\n text-align: center;\n transition: all 0.3s ease;\n border: 2px solid transparent;\n }\n \n .tool-card:hover {\n transform: translateY(-5px);\n border-color: #4caf50;\n box-shadow: 0 10px 20px rgba(76, 175, 80, 0.1);\n }\n \n .tool-icon {\n font-size: 2.5rem;\n color: #4caf50;\n margin-bottom: 15px;\n }\n \n .tool-title {\n font-weight: 600;\n margin-bottom: 10px;\n color: #2e7d32;\n }\n \n .tool-description {\n font-size: 0.9rem;\n color: #666;\n line-height: 1.4;\n }\n \n .footer {\n text-align: center;\n margin-top: 50px;\n color: #5d4037;\n opacity: 0.8;\n font-size: 0.9rem;\n }\n \n @media (max-width: 768px) {\n .header h1 { font-size: 2rem; }\n .header p { font-size: 1rem; }\n .encyclopedia-section, .tools-section { padding: 20px; }\n .section-title { font-size: 1.5rem; }\n .interactive-grid { grid-template-columns: 1fr; }\n .facts-container { grid-template-columns: 1fr; }\n .tools-grid { grid-template-columns: 1fr; }\n }\n \n \/* \u041c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0435 \u043e\u043a\u043d\u043e \u0434\u043b\u044f \u0434\u0435\u0442\u0430\u043b\u044c\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 *\/\n .modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0,0,0,0.7);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 10000;\n animation: fadeIn 0.3s ease;\n padding: 20px;\n }\n \n .modal-content {\n background: white;\n border-radius: 20px;\n max-width: 600px;\n width: 100%;\n max-height: 80vh;\n overflow-y: auto;\n animation: slideUp 0.3s ease;\n position: relative;\n }\n \n .modal-header {\n background: linear-gradient(135deg, #ff7043 0%, #ffb74d 100%);\n color: white;\n padding: 25px;\n border-radius: 20px 20px 0 0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n \n .modal-title {\n font-size: 1.5rem;\n font-weight: 700;\n }\n \n .modal-close {\n background: none;\n border: none;\n color: white;\n font-size: 1.5rem;\n cursor: pointer;\n width: 40px;\n height: 40px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: background 0.3s ease;\n }\n \n .modal-close:hover {\n background: rgba(255,255,255,0.2);\n }\n \n .modal-body {\n padding: 30px;\n color: #5d4037;\n }\n \n @keyframes fadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n }\n \n @keyframes slideUp {\n from { transform: translateY(50px); opacity: 0; }\n to { transform: translateY(0); opacity: 1; }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <div class=\"header\">\n <h1><i class=\"fas fa-book-open\"><\/i> \u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u0430\u044f \u044d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u044f<\/h1>\n <p>\u041f\u043e\u043b\u0435\u0437\u043d\u0430\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f, \u0442\u0435\u0445\u043d\u0438\u043a\u0438 \u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0434\u043b\u044f \u0443\u0432\u043b\u0435\u0447\u0435\u043d\u043d\u044b\u0445 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0435\u0439<\/p>\n <\/div>\n \n <div class=\"main-grid\">\n \n <div class=\"encyclopedia-section\">\n <h2 class=\"section-title\">\n <i class=\"fas fa-graduation-cap\"><\/i> \u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u0437\u043d\u0430\u043d\u0438\u044f\n <\/h2>\n \n <div class=\"interactive-grid\">\n \n <div class=\"interactive-card\" onclick=\"showDetail('techniques')\">\n <div class=\"card-icon\">\n <i class=\"fas fa-mortar-pestle\"><\/i>\n <\/div>\n <div class=\"card-title\">\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438<\/div>\n <div class=\"card-content\">\n \u041e\u0441\u0432\u043e\u0439\u0442\u0435 \u043a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438: \u043e\u0442 \u0431\u0430\u0437\u043e\u0432\u044b\u0445 \u043d\u0430\u0432\u044b\u043a\u043e\u0432 \u0434\u043e \u043f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u044b\u0445 \u043c\u0435\u0442\u043e\u0434\u0438\u043a \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u044f.\n <\/div>\n <div class=\"external-links\">\n <a href=\"https:\/\/www.bbcgoodfood.com\/howto\/guide\/25-skills-every-cook-should-know\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> BBC Good Food\n <\/a>\n <a href=\"https:\/\/www.seriouseats.com\/techniques\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> Serious Eats\n <\/a>\n <\/div>\n <\/div>\n \n \n <div class=\"interactive-card\" onclick=\"showDetail('science')\">\n <div class=\"card-icon\">\n <i class=\"fas fa-flask\"><\/i>\n <\/div>\n <div class=\"card-title\">\u041d\u0430\u0443\u043a\u0430 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438<\/div>\n <div class=\"card-content\">\n \u041f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0438 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432, \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u044f\u0449\u0438\u0445 \u043f\u0440\u0438 \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u0438 \u043f\u0438\u0449\u0438.\n <\/div>\n <div class=\"external-links\">\n <a href=\"https:\/\/www.seriouseats.com\/the-food-lab\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> Food Lab\n <\/a>\n <a href=\"https:\/\/www.cookingscienceguy.com\/\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> Cooking Science\n <\/a>\n <\/div>\n <\/div>\n \n \n <div class=\"interactive-card\" onclick=\"showDetail('history')\">\n <div class=\"card-icon\">\n <i class=\"fas fa-history\"><\/i>\n <\/div>\n <div class=\"card-title\">\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438<\/div>\n <div class=\"card-content\">\n \u041a\u0430\u043a \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u043b\u043e\u0441\u044c \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u043e\u0435 \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u043e\u0442 \u0434\u0440\u0435\u0432\u043d\u0438\u0445 \u0446\u0438\u0432\u0438\u043b\u0438\u0437\u0430\u0446\u0438\u0439 \u0434\u043e \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0441\u0442\u0438.\n <\/div>\n <div class=\"external-links\">\n <a href=\"https:\/\/foodtimeline.org\/\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> Food Timeline\n <\/a>\n <a href=\"https:\/\/www.history.com\/topics\/inventions\/history-of-cooking\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> History Channel\n <\/a>\n <\/div>\n <\/div>\n \n \n <div class=\"interactive-card\" onclick=\"showDetail('world')\">\n <div class=\"card-icon\">\n <i class=\"fas fa-globe-americas\"><\/i>\n <\/div>\n <div class=\"card-title\">\u041c\u0438\u0440\u043e\u0432\u044b\u0435 \u043a\u0443\u0445\u043d\u0438<\/div>\n <div class=\"card-content\">\n \u0418\u0437\u0443\u0447\u0435\u043d\u0438\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0435\u0439 \u0438 \u0442\u0440\u0430\u0434\u0438\u0446\u0438\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0441\u0442\u0440\u0430\u043d \u0438 \u043a\u0443\u043b\u044c\u0442\u0443\u0440.\n <\/div>\n <div class=\"external-links\">\n <a href=\"https:\/\/www.saveur.com\/world-cuisine\/\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> Saveur\n <\/a>\n <a href=\"https:\/\/www.bonappetit.com\/test-kitchen\/cooking-tips\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> Bon App\u00e9tit\n <\/a>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"info-table\">\n <div class=\"table-header\">\n <span>\u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u043d\u044b\u0439 \u0440\u0435\u0436\u0438\u043c<\/span>\n <span>\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043f\u0440\u043e\u0446\u0435\u0441\u0441<\/span>\n <\/div>\n <div class=\"table-row\">\n <span>50-60\u00b0C<\/span>\n <span>\u0422\u043e\u043c\u043b\u0435\u043d\u0438\u0435 (sous-vide)<\/span>\n <\/div>\n <div class=\"table-row\">\n <span>60-70\u00b0C<\/span>\n <span>\u041f\u0430\u0441\u0442\u0435\u0440\u0438\u0437\u0430\u0446\u0438\u044f \u044f\u0438\u0446<\/span>\n <\/div>\n <div class=\"table-row\">\n <span>100\u00b0C<\/span>\n <span>\u041a\u0438\u043f\u0435\u043d\u0438\u0435 \u0432\u043e\u0434\u044b<\/span>\n <\/div>\n <div class=\"table-row\">\n <span>120-130\u00b0C<\/span>\n <span>\u041a\u0430\u0440\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f \u0441\u0430\u0445\u0430\u0440\u0430<\/span>\n <\/div>\n <div class=\"table-row\">\n <span>150-160\u00b0C<\/span>\n <span>\u0420\u0435\u0430\u043a\u0446\u0438\u044f \u041c\u0430\u0439\u044f\u0440\u0430<\/span>\n <\/div>\n <\/div>\n \n \n <div class=\"facts-container\">\n <div class=\"fact-card\" onclick=\"showDetail('fact1')\">\n <div class=\"fact-number\">15,000+<\/div>\n <div class=\"fact-text\">\u0440\u0435\u0446\u0435\u043f\u0442\u043e\u0432 \u0432 \u0437\u043d\u0430\u043c\u0435\u043d\u0438\u0442\u043e\u0439 \u043a\u043d\u0438\u0433\u0435 «\u0418\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u0444\u0440\u0430\u043d\u0446\u0443\u0437\u0441\u043a\u043e\u0439 \u043a\u0443\u0445\u043d\u0438» \u0414\u0436\u0443\u043b\u0438\u0438 \u0427\u0430\u0439\u043b\u0434<\/div>\n <\/div>\n <div class=\"fact-card\" onclick=\"showDetail('fact2')\">\n <div class=\"fact-number\">98.6%<\/div>\n <div class=\"fact-text\">\u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0445 \u0432\u0435\u0441\u043e\u0432 \u043f\u0440\u0435\u043c\u0438\u0443\u043c-\u043a\u043b\u0430\u0441\u0441\u0430<\/div>\n <\/div>\n <div class=\"fact-card\" onclick=\"showDetail('fact3')\">\n <div class=\"fact-number\">300+<\/div>\n <div class=\"fact-text\">\u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0440\u0435\u0430\u043a\u0446\u0438\u0439 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u0440\u0438 \u0432\u044b\u043f\u0435\u0447\u043a\u0435 \u0445\u043b\u0435\u0431\u0430<\/div>\n <\/div>\n <div class=\"fact-card\" onclick=\"showDetail('fact4')\">\n <div class=\"fact-number\">1846<\/div>\n <div class=\"fact-text\">\u0433\u043e\u0434 \u0438\u0437\u043e\u0431\u0440\u0435\u0442\u0435\u043d\u0438\u044f \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f \u043d\u0435\u043c\u0435\u0446\u043a\u0438\u043c \u0445\u0438\u043c\u0438\u043a\u043e\u043c<\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"quiz-container\">\n <div class=\"quiz-question\" id=\"quizQuestion\">\n \u041a\u0430\u043a \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0440\u0435\u0430\u043a\u0446\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u0440\u0438 \u043f\u043e\u0434\u0440\u0443\u043c\u044f\u043d\u0438\u0432\u0430\u043d\u0438\u0438 \u043c\u044f\u0441\u0430 \u0438 \u0432\u044b\u043f\u0435\u0447\u043a\u0438?\n <\/div>\n <div class=\"quiz-options\">\n <div class=\"quiz-option\" onclick=\"checkAnswer(this, 'correct')\">\n \u0420\u0435\u0430\u043a\u0446\u0438\u044f \u041c\u0430\u0439\u044f\u0440\u0430\n <\/div>\n <div class=\"quiz-option\" onclick=\"checkAnswer(this, 'incorrect')\">\n \u041a\u0430\u0440\u0430\u043c\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u044f\n <\/div>\n <div class=\"quiz-option\" onclick=\"checkAnswer(this, 'incorrect')\">\n \u0413\u0438\u0434\u0440\u043e\u043b\u0438\u0437\n <\/div>\n <div class=\"quiz-option\" onclick=\"checkAnswer(this, 'incorrect')\">\n \u041e\u043a\u0438\u0441\u043b\u0435\u043d\u0438\u0435\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"tools-section\">\n <h2 class=\"section-title\" style=\"color: #2e7d32;\">\n <i class=\"fas fa-tools\"><\/i> \u041f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b\n <\/h2>\n \n <div class=\"tools-grid\">\n <div class=\"tool-card\">\n <div class=\"tool-icon\">\n <i class=\"fas fa-university\"><\/i>\n <\/div>\n <div class=\"tool-title\">\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0448\u043a\u043e\u043b\u044b<\/div>\n <div class=\"tool-description\">\n \u0412\u0435\u0434\u0443\u0449\u0438\u0435 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0438\u0442\u0443\u0442\u044b \u043c\u0438\u0440\u0430 \u0441 \u043e\u043d\u043b\u0430\u0439\u043d-\u043a\u0443\u0440\u0441\u0430\u043c\u0438 \u0438 \u043c\u0430\u0441\u0442\u0435\u0440-\u043a\u043b\u0430\u0441\u0441\u0430\u043c\u0438.\n <\/div>\n <div style=\"margin-top: 15px;\">\n <a href=\"https:\/\/www.culinaryinstitute.edu\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n CIA\n <\/a>\n <a href=\"https:\/\/www.le-cordon-bleu.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n Cordon Bleu\n <\/a>\n <\/div>\n <\/div>\n \n <div class=\"tool-card\">\n <div class=\"tool-icon\">\n <i class=\"fas fa-book\"><\/i>\n <\/div>\n <div class=\"tool-title\">\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u043a\u043d\u0438\u0433\u0438<\/div>\n <div class=\"tool-description\">\n \u0420\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u043c\u0430\u044f \u043b\u0438\u0442\u0435\u0440\u0430\u0442\u0443\u0440\u0430 \u043e\u0442 \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0445 \u0448\u0435\u0444-\u043f\u043e\u0432\u0430\u0440\u043e\u0432 \u0438 \u043a\u043e\u043d\u0434\u0438\u0442\u0435\u0440\u043e\u0432.\n <\/div>\n <div style=\"margin-top: 15px;\">\n <a href=\"https:\/\/www.kingarthurbaking.com\/learn\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n King Arthur\n <\/a>\n <a href=\"https:\/\/www.americastestkitchen.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n Test Kitchen\n <\/a>\n <\/div>\n <\/div>\n \n <div class=\"tool-card\">\n <div class=\"tool-icon\">\n <i class=\"fas fa-video\"><\/i>\n <\/div>\n <div class=\"tool-title\">\u0412\u0438\u0434\u0435\u043e\u0443\u0440\u043e\u043a\u0438<\/div>\n <div class=\"tool-description\">\n \u041a\u0430\u0447\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0435 \u0432\u0438\u0434\u0435\u043e-\u043a\u0443\u0440\u0441\u044b \u043f\u043e \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u043c \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u043c \u0442\u0435\u0445\u043d\u0438\u043a\u0430\u043c \u0438 \u0440\u0435\u0446\u0435\u043f\u0442\u0430\u043c.\n <\/div>\n <div style=\"margin-top: 15px;\">\n <a href=\"https:\/\/www.youtube.com\/c\/JoshuaWeissman\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n YouTube\n <\/a>\n <a href=\"https:\/\/www.masterclass.com\/categories\/cooking\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n MasterClass\n <\/a>\n <\/div>\n <\/div>\n \n <div class=\"tool-card\">\n <div class=\"tool-icon\">\n <i class=\"fas fa-utensils\"><\/i>\n <\/div>\n <div class=\"tool-title\">\u041e\u0431\u043e\u0440\u0443\u0434\u043e\u0432\u0430\u043d\u0438\u0435<\/div>\n <div class=\"tool-description\">\n \u0420\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0430\u0446\u0438\u0438 \u043f\u043e \u0432\u044b\u0431\u043e\u0440\u0443 \u043a\u0443\u0445\u043e\u043d\u043d\u043e\u0433\u043e \u043e\u0431\u043e\u0440\u0443\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u0438 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432.\n <\/div>\n <div style=\"margin-top: 15px;\">\n <a href=\"https:\/\/www.cooksillustrated.com\/equipment_reviews\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n Equipment Reviews\n <\/a>\n <a href=\"https:\/\/www.thekitchn.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n Kitchn\n <\/a>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div style=\"margin-top: 30px; padding: 25px; background: rgba(255,255,255,0.9); border-radius: 15px;\">\n <h3 style=\"color: #2e7d32; margin-bottom: 15px; font-size: 1.2rem;\">\n <i class=\"fas fa-lightbulb\"><\/i> \u041f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0441\u043e\u0432\u0435\u0442\u044b\n <\/h3>\n <ul style=\"color: #666; line-height: 1.6; padding-left: 20px;\">\n <li style=\"margin-bottom: 10px;\">\u0412\u0441\u0435\u0433\u0434\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b \u0434\u043b\u044f \u0442\u043e\u0447\u043d\u044b\u0445 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <li style=\"margin-bottom: 10px;\">\u0420\u0430\u0437\u043e\u0433\u0440\u0435\u0432\u0430\u0439\u0442\u0435 \u0434\u0443\u0445\u043e\u0432\u043a\u0443 \u0437\u0430\u0440\u0430\u043d\u0435\u0435 (\u043c\u0438\u043d\u0438\u043c\u0443\u043c 15-20 \u043c\u0438\u043d\u0443\u0442)<\/li>\n <li style=\"margin-bottom: 10px;\">\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u043c\u044f\u0441\u0443 «\u043e\u0442\u0434\u043e\u0445\u043d\u0443\u0442\u044c» \u043f\u043e\u0441\u043b\u0435 \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u044f<\/li>\n <li>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0442\u0430\u0439\u043c\u0435\u0440 \u0434\u043b\u044f \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044f \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u044f<\/li>\n <\/ul>\n <\/div>\n \n \n <div style=\"margin-top: 25px; display: flex; flex-wrap: wrap; gap: 10px;\">\n <a href=\"https:\/\/www.foodnetwork.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n <i class=\"fas fa-tv\"><\/i> Food Network\n <\/a>\n <a href=\"https:\/\/www.epicurious.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n <i class=\"fas fa-newspaper\"><\/i> Epicurious\n <\/a>\n <a href=\"https:\/\/www.delish.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n <i class=\"fas fa-hamburger\"><\/i> Delish\n <\/a>\n <a href=\"https:\/\/www.tasteofhome.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n <i class=\"fas fa-home\"><\/i> Taste of Home\n <\/a>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"footer\">\n <p>\u00a9 2026 \u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u0430\u044f \u044d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u044f | \u041f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0434\u043b\u044f \u0434\u043e\u043c\u0430\u0448\u043d\u0438\u0445 \u043f\u043e\u0432\u0430\u0440\u043e\u0432 \u0438 \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u043e\u0432<\/p>\n <\/div>\n <\/div>\n\n <script>\n \/\/ \u0414\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u0434\u0435\u0442\u0430\u043b\u044c\u043d\u044b\u0445 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0439\n const detailContent = {\n 'techniques': {\n title: '\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u043e\u043b\u0436\u0435\u043d \u043e\u0441\u0432\u043e\u0438\u0442\u044c \u043a\u0430\u0436\u0434\u044b\u0439 \u043f\u043e\u0432\u0430\u0440:<\/h3>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">1. \u041d\u0430\u0440\u0435\u0437\u043a\u0430 (Knife Skills)<\/h4>\n <p>\u041f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u0430\u044f \u0442\u0435\u0445\u043d\u0438\u043a\u0430 \u043d\u0430\u0440\u0435\u0437\u043a\u0438 \u043e\u0432\u043e\u0449\u0435\u0439, \u043c\u044f\u0441\u0430 \u0438 \u0434\u0440\u0443\u0433\u0438\u0445 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u043e\u0432. \u0412\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 \u0432\u0438\u0434\u044b \u043d\u0430\u0440\u0435\u0437\u043a\u0438: \u0436\u0443\u043b\u044c\u0435\u043d, \u0431\u0440\u0443\u043d\u043e\u0430\u0437, \u0448\u0430\u0442\u043e \u0438 \u0442.\u0434.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">2. \u041f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u043e\u0443\u0441\u043e\u0432 (Sauce Making)<\/h4>\n <p>5 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 \u0441\u043e\u0443\u0441\u043e\u0432 \u0444\u0440\u0430\u043d\u0446\u0443\u0437\u0441\u043a\u043e\u0439 \u043a\u0443\u0445\u043d\u0438 (\u0431\u0435\u0448\u0430\u043c\u0435\u043b\u044c, \u0432\u0435\u043b\u0443\u0442\u0435, \u044d\u0441\u043f\u0430\u043d\u044c\u043e\u043b\u044c, \u0442\u043e\u043c\u0430\u0442\u043d\u044b\u0439, \u0433\u043e\u043b\u043b\u0430\u043d\u0434\u0435\u0437) \u0438 \u0438\u0445 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u043d\u044b\u0435.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">3. \u0422\u0435\u0445\u043d\u0438\u043a\u0438 \u0442\u0435\u0440\u043c\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438<\/h4>\n <ul style=\"color: #666; line-height: 1.6; padding-left: 20px;\">\n <li>\u0411\u043b\u0430\u043d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 - \u043a\u0440\u0430\u0442\u043a\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0435 \u043f\u043e\u0433\u0440\u0443\u0436\u0435\u043d\u0438\u0435 \u0432 \u043a\u0438\u043f\u044f\u0449\u0443\u044e \u0432\u043e\u0434\u0443<\/li>\n <li>\u0411\u0440\u044d\u0439\u0437\u0438\u043d\u0433 - \u0442\u0443\u0448\u0435\u043d\u0438\u0435 \u0441 \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u043c \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e\u043c \u0436\u0438\u0434\u043a\u043e\u0441\u0442\u0438<\/li>\n <li>\u0421\u043e\u0442\u0438\u0435 - \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043e\u0431\u0436\u0430\u0440\u0438\u0432\u0430\u043d\u0438\u0435 \u0441 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u044b\u043c \u043f\u043e\u043c\u0435\u0448\u0438\u0432\u0430\u043d\u0438\u0435\u043c<\/li>\n <li>\u041a\u043e\u043d\u0444\u0438 - \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e\u0435 \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0432 \u0436\u0438\u0440\u0435 \u043f\u0440\u0438 \u043d\u0438\u0437\u043a\u043e\u0439 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0435<\/li>\n <\/ul>\n <\/div>\n \n <div style=\"background: rgba(255, 112, 67, 0.1); padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p style=\"margin: 0; color: #5d4037;\"><strong>\u0421\u043e\u0432\u0435\u0442:<\/strong> \u041d\u0430\u0447\u0438\u043d\u0430\u0439\u0442\u0435 \u0441 \u043e\u0441\u0432\u043e\u0435\u043d\u0438\u044f \u0431\u0430\u0437\u043e\u0432\u044b\u0445 \u0442\u0435\u0445\u043d\u0438\u043a, \u043f\u0440\u0435\u0436\u0434\u0435 \u0447\u0435\u043c \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u0442\u044c \u043a \u0441\u043b\u043e\u0436\u043d\u044b\u043c \u0440\u0435\u0446\u0435\u043f\u0442\u0430\u043c.<\/p>\n <\/div>\n `\n },\n 'science': {\n title: '\u041d\u0430\u0443\u043a\u0430 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u0425\u0438\u043c\u0438\u044f \u0438 \u0444\u0438\u0437\u0438\u043a\u0430 \u0432 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438:<\/h3>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0420\u0435\u0430\u043a\u0446\u0438\u044f \u041c\u0430\u0439\u044f\u0440\u0430<\/h4>\n <p>\u0425\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0440\u0435\u0430\u043a\u0446\u0438\u044f \u043c\u0435\u0436\u0434\u0443 \u0430\u043c\u0438\u043d\u043e\u043a\u0438\u0441\u043b\u043e\u0442\u0430\u043c\u0438 \u0438 \u0441\u0430\u0445\u0430\u0440\u0430\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u0440\u0438 \u043d\u0430\u0433\u0440\u0435\u0432\u0430\u043d\u0438\u0438 \u0432\u044b\u0448\u0435 140\u00b0C. \u041e\u0442\u0432\u0435\u0447\u0430\u0435\u0442 \u0437\u0430 \u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043a\u043e\u0440\u043e\u0447\u043a\u0438 \u043d\u0430 \u043c\u044f\u0441\u0435, \u0432\u044b\u043f\u0435\u0447\u043a\u0435 \u0438 \u0434\u0430\u0435\u0442 \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u043d\u044b\u0439 \u0430\u0440\u043e\u043c\u0430\u0442.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u041a\u0430\u0440\u0430\u043c\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0441\u0430\u0445\u0430\u0440\u0430<\/h4>\n <p>\u041f\u0440\u043e\u0446\u0435\u0441\u0441 \u043e\u043a\u0438\u0441\u043b\u0435\u043d\u0438\u044f \u0441\u0430\u0445\u0430\u0440\u0430 \u043f\u0440\u0438 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0435 160-180\u00b0C. \u0412 \u043e\u0442\u043b\u0438\u0447\u0438\u0435 \u043e\u0442 \u0440\u0435\u0430\u043a\u0446\u0438\u0438 \u041c\u0430\u0439\u044f\u0440\u0430, \u043d\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u0443\u0447\u0430\u0441\u0442\u0438\u044f \u0430\u043c\u0438\u043d\u043e\u043a\u0438\u0441\u043b\u043e\u0442.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u041a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c<\/h4>\n <p>\u0420\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u0431\u0438\u043a\u0430\u0440\u0431\u043e\u043d\u0430\u0442\u0430 \u043d\u0430\u0442\u0440\u0438\u044f (\u0441\u043e\u0434\u044b) \u0438 \u043a\u0438\u0441\u043b\u043e\u0442\u044b. \u041f\u0440\u0438 \u043a\u043e\u043d\u0442\u0430\u043a\u0442\u0435 \u0441 \u0432\u043b\u0430\u0433\u043e\u0439 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0440\u0435\u0430\u043a\u0446\u0438\u044f \u0441 \u0432\u044b\u0434\u0435\u043b\u0435\u043d\u0438\u0435\u043c \u0443\u0433\u043b\u0435\u043a\u0438\u0441\u043b\u043e\u0433\u043e \u0433\u0430\u0437\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0434\u043d\u0438\u043c\u0430\u0435\u0442 \u0442\u0435\u0441\u0442\u043e.<\/p>\n <\/div>\n \n <div style=\"display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin-top: 20px;\">\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0430 \u0434\u0435\u043d\u0430\u0442\u0443\u0440\u0430\u0446\u0438\u0438 \u0431\u0435\u043b\u043a\u0430:<\/strong><br>\n \u042f\u0439\u0446\u0430: 62-65\u00b0C<br>\n \u0420\u044b\u0431\u0430: 60-65\u00b0C<br>\n \u041c\u044f\u0441\u043e: 70-75\u00b0C\n <\/div>\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u0422\u043e\u0447\u043a\u0438 \u043a\u0438\u043f\u0435\u043d\u0438\u044f:<\/strong><br>\n \u0412\u043e\u0434\u0430: 100\u00b0C<br>\n \u041c\u0430\u0441\u043b\u043e: 180-200\u00b0C<br>\n \u0421\u0430\u0445\u0430\u0440\u043d\u044b\u0439 \u0441\u0438\u0440\u043e\u043f: 100-160\u00b0C\n <\/div>\n <\/div>\n `\n },\n 'history': {\n title: '\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u042d\u0432\u043e\u043b\u044e\u0446\u0438\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u043e\u0433\u043e \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u0430:<\/h3>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0414\u0440\u0435\u0432\u043d\u0438\u0439 \u043c\u0438\u0440 (\u0434\u043e 500 \u0433. \u043d.\u044d.)<\/h4>\n <p>\u041f\u0435\u0440\u0432\u044b\u0435 \u0440\u0435\u0446\u0435\u043f\u0442\u044b \u0431\u044b\u043b\u0438 \u0437\u0430\u043f\u0438\u0441\u0430\u043d\u044b \u0432 \u0414\u0440\u0435\u0432\u043d\u0435\u0439 \u041c\u0435\u0441\u043e\u043f\u043e\u0442\u0430\u043c\u0438\u0438. \u0420\u0438\u043c\u043b\u044f\u043d\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u043b\u0438 \u0441\u043b\u043e\u0436\u043d\u0443\u044e \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u044e \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u0441\u043f\u0435\u0446\u0438\u0439, \u0441\u043e\u0443\u0441\u043e\u0432 \u0438 \u0442\u0435\u0445\u043d\u0438\u043a \u043a\u043e\u043d\u0441\u0435\u0440\u0432\u0430\u0446\u0438\u0438.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0421\u0440\u0435\u0434\u043d\u0438\u0435 \u0432\u0435\u043a\u0430 (500-1500 \u0433\u0433.)<\/h4>\n <p>\u0421\u0438\u043b\u044c\u043d\u043e\u0435 \u0432\u043b\u0438\u044f\u043d\u0438\u0435 \u0440\u0435\u043b\u0438\u0433\u0438\u0438 \u043d\u0430 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u044e. \u041f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u0438\u0440\u043e\u0433\u043e\u0432, \u043f\u0430\u0448\u0442\u0435\u0442\u043e\u0432, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043c\u0438\u043d\u0434\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u043e\u043b\u043e\u043a\u0430 \u0432 \u043f\u043e\u0441\u0442\u043d\u044b\u0435 \u0434\u043d\u0438.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u042d\u043f\u043e\u0445\u0430 \u0412\u043e\u0437\u0440\u043e\u0436\u0434\u0435\u043d\u0438\u044f (1500-1700 \u0433\u0433.)<\/h4>\n <p>\u041e\u0442\u043a\u0440\u044b\u0442\u0438\u0435 \u041d\u043e\u0432\u043e\u0433\u043e \u0421\u0432\u0435\u0442\u0430 \u043f\u0440\u0438\u043d\u0435\u0441\u043b\u043e \u0432 \u0415\u0432\u0440\u043e\u043f\u0443 \u043d\u043e\u0432\u044b\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b: \u043a\u0430\u0440\u0442\u043e\u0444\u0435\u043b\u044c, \u0442\u043e\u043c\u0430\u0442\u044b, \u043a\u0443\u043a\u0443\u0440\u0443\u0437\u0443, \u043a\u0430\u043a\u0430\u043e. \u0420\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u043a\u043e\u043d\u0434\u0438\u0442\u0435\u0440\u0441\u043a\u043e\u0433\u043e \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u0430.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0421\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u0430\u044f \u044d\u043f\u043e\u0445\u0430 (1700-\u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0435\u0435 \u0432\u0440\u0435\u043c\u044f)<\/h4>\n <p>\u0420\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u0444\u0440\u0430\u043d\u0446\u0443\u0437\u0441\u043a\u043e\u0439 \u0432\u044b\u0441\u043e\u043a\u043e\u0439 \u043a\u0443\u0445\u043d\u0438 (haute cuisine). \u0418\u0437\u043e\u0431\u0440\u0435\u0442\u0435\u043d\u0438\u0435 \u043a\u043e\u043d\u0441\u0435\u0440\u0432\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f (1810), \u0445\u043e\u043b\u043e\u0434\u0438\u043b\u044c\u043d\u0438\u043a\u0430 (1834), \u043c\u0438\u043a\u0440\u043e\u0432\u043e\u043b\u043d\u043e\u0432\u043e\u0439 \u043f\u0435\u0447\u0438 (1946).<\/p>\n <\/div>\n \n <div style=\"background: rgba(255, 112, 67, 0.1); padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p style=\"margin: 0; color: #5d4037;\"><strong>\u0418\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u0444\u0430\u043a\u0442:<\/strong> \u041f\u0435\u0440\u0432\u0430\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u0430\u044f \u043a\u043d\u0438\u0433\u0430 \"De Re Coquinaria\" \u0431\u044b\u043b\u0430 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0430 \u0440\u0438\u043c\u043b\u044f\u043d\u0438\u043d\u043e\u043c \u0410\u043f\u0438\u0446\u0438\u0435\u043c \u0432 1 \u0432\u0435\u043a\u0435 \u043d.\u044d. \u0438 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u043b\u0430 \u0440\u0435\u0446\u0435\u043f\u0442\u044b \u0434\u043b\u044f \u0431\u043e\u0433\u0430\u0442\u044b\u0445 \u043f\u0430\u0442\u0440\u0438\u0446\u0438\u0435\u0432.<\/p>\n <\/div>\n `\n },\n 'world': {\n title: '\u041c\u0438\u0440\u043e\u0432\u044b\u0435 \u043a\u0443\u0445\u043d\u0438',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u041e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u043a\u0443\u0445\u043e\u043d\u044c \u0440\u0430\u0437\u043d\u044b\u0445 \u0441\u0442\u0440\u0430\u043d:<\/h3>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0424\u0440\u0430\u043d\u0446\u0443\u0437\u0441\u043a\u0430\u044f \u043a\u0443\u0445\u043d\u044f<\/h4>\n <p>\u041e\u0441\u043d\u043e\u0432\u0430\u043d\u0430 \u043d\u0430 \u0441\u043e\u0443\u0441\u0430\u0445, \u0442\u0435\u0445\u043d\u0438\u043a\u0430\u0445 \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0438 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u043e\u0432. \u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b: \u0431\u0443\u043b\u044c\u043e\u043d\u044b, \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u044b\u0435 \u0441\u043e\u0443\u0441\u044b, \u0432\u044b\u043f\u0435\u0447\u043a\u0430.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0418\u0442\u0430\u043b\u044c\u044f\u043d\u0441\u043a\u0430\u044f \u043a\u0443\u0445\u043d\u044f<\/h4>\n <p>\u0410\u043a\u0446\u0435\u043d\u0442 \u043d\u0430 \u0441\u0432\u0435\u0436\u0438\u0445, \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0445 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u0430\u0445 \u0438 \u043f\u0440\u043e\u0441\u0442\u043e\u0442\u0435 \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u044f. \u0420\u0435\u0433\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u0440\u0430\u0437\u043b\u0438\u0447\u0438\u044f: \u0441\u0435\u0432\u0435\u0440 (\u0441\u043b\u0438\u0432\u043e\u0447\u043d\u044b\u0435 \u0441\u043e\u0443\u0441\u044b, \u0440\u0438\u0441), \u044e\u0433 (\u0442\u043e\u043c\u0430\u0442\u044b, \u043e\u043b\u0438\u0432\u043a\u043e\u0432\u043e\u0435 \u043c\u0430\u0441\u043b\u043e, \u043c\u043e\u0440\u0435\u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b).<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u042f\u043f\u043e\u043d\u0441\u043a\u0430\u044f \u043a\u0443\u0445\u043d\u044f<\/h4>\n <p>\u0424\u0438\u043b\u043e\u0441\u043e\u0444\u0438\u044f \u0441\u0435\u0437\u043e\u043d\u043d\u043e\u0441\u0442\u0438, \u0441\u0432\u0435\u0436\u0435\u0441\u0442\u0438 \u0438 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0439 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438. \u0422\u0435\u0445\u043d\u0438\u043a\u0438: \u0441\u0443\u0448\u0438, \u0441\u0430\u0448\u0438\u043c\u0438, \u0442\u0435\u043c\u043f\u0443\u0440\u0430, \u043c\u0438\u0441\u043e-\u0441\u0443\u043f\u044b.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0418\u043d\u0434\u0438\u0439\u0441\u043a\u0430\u044f \u043a\u0443\u0445\u043d\u044f<\/h4>\n <p>\u0411\u043e\u0433\u0430\u0442\u0441\u0442\u0432\u043e \u0441\u043f\u0435\u0446\u0438\u0439 \u0438 \u0441\u043b\u043e\u0436\u043d\u044b\u0435 \u0441\u043c\u0435\u0441\u0438 (\u043c\u0430\u0441\u0430\u043b\u0430). \u0420\u0430\u0437\u043d\u043e\u043e\u0431\u0440\u0430\u0437\u0438\u0435 \u0432\u0435\u0433\u0435\u0442\u0430\u0440\u0438\u0430\u043d\u0441\u043a\u0438\u0445 \u0431\u043b\u044e\u0434. \u0422\u0435\u0445\u043d\u0438\u043a\u0430 \u0442\u0430\u043d\u0434\u0443\u0440\u0438.<\/p>\n <\/div>\n \n <div style=\"display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin-top: 20px;\">\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u0422\u0438\u043f\u0438\u0447\u043d\u044b\u0435 \u0441\u043f\u0435\u0446\u0438\u0438:<\/strong><br>\n \u0424\u0440\u0430\u043d\u0446\u0438\u044f: \u044d\u0441\u0442\u0440\u0430\u0433\u043e\u043d, \u0442\u0438\u043c\u044c\u044f\u043d, \u043f\u0435\u0442\u0440\u0443\u0448\u043a\u0430<br>\n \u0418\u0442\u0430\u043b\u0438\u044f: \u0431\u0430\u0437\u0438\u043b\u0438\u043a, \u043e\u0440\u0435\u0433\u0430\u043d\u043e, \u0440\u043e\u0437\u043c\u0430\u0440\u0438\u043d<br>\n \u0418\u043d\u0434\u0438\u044f: \u043a\u0443\u0440\u043a\u0443\u043c\u0430, \u043a\u0430\u0440\u0440\u0438, \u043a\u0443\u043c\u0438\u043d\n <\/div>\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438:<\/strong><br>\n \u041a\u0438\u0442\u0430\u0439: \u0432\u043e\u043a \u0441\u0442\u0438\u0440-\u0444\u0440\u0430\u0439<br>\n \u041c\u0435\u043a\u0441\u0438\u043a\u0430: \u043c\u043e\u043b\u0435\u043d\u0438\u0435 \u043d\u0430 \u043a\u0430\u043c\u043d\u0435<br>\n \u0422\u0430\u0438\u043b\u0430\u043d\u0434: \u0431\u0430\u043b\u0430\u043d\u0441 5 \u0432\u043a\u0443\u0441\u043e\u0432\n <\/div>\n <\/div>\n `\n },\n 'fact1': {\n title: '\u041a\u043d\u0438\u0433\u0430 \u0414\u0436\u0443\u043b\u0438\u0438 \u0427\u0430\u0439\u043b\u0434',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\"\u0418\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u0444\u0440\u0430\u043d\u0446\u0443\u0437\u0441\u043a\u043e\u0439 \u043a\u0443\u0445\u043d\u0438\" \u0414\u0436\u0443\u043b\u0438\u0438 \u0427\u0430\u0439\u043b\u0434<\/h3>\n \n <p>\u042d\u0442\u0430 \u043b\u0435\u0433\u0435\u043d\u0434\u0430\u0440\u043d\u0430\u044f \u043a\u043d\u0438\u0433\u0430, \u043e\u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u0432 1961 \u0433\u043e\u0434\u0443, \u043f\u0440\u043e\u0438\u0437\u0432\u0435\u043b\u0430 \u0440\u0435\u0432\u043e\u043b\u044e\u0446\u0438\u044e \u0432 \u0430\u043c\u0435\u0440\u0438\u043a\u0430\u043d\u0441\u043a\u043e\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438. \u041e\u043d\u0430 \u0441\u0434\u0435\u043b\u0430\u043b\u0430 \u0444\u0440\u0430\u043d\u0446\u0443\u0437\u0441\u043a\u0443\u044e \u043a\u0443\u0445\u043d\u044e \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0439 \u0434\u043b\u044f \u0434\u043e\u043c\u0430\u0448\u043d\u0438\u0445 \u043f\u043e\u0432\u0430\u0440\u043e\u0432.<\/p>\n \n <div style=\"margin: 20px 0;\">\n <strong>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u043a\u043d\u0438\u0433\u0438:<\/strong>\n <ul style=\"color: #666; line-height: 1.6; padding-left: 20px; margin-top: 10px;\">\n <li>734 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0441 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u044b\u043c\u0438 \u0438\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u044f\u043c\u0438<\/li>\n <li>\u0411\u043e\u043b\u0435\u0435 15,000 \u0440\u0435\u0446\u0435\u043f\u0442\u043e\u0432 \u0438 \u0438\u0445 \u0432\u0430\u0440\u0438\u0430\u0446\u0438\u0439<\/li>\n <li>\u041f\u043e\u0448\u0430\u0433\u043e\u0432\u044b\u0435 \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0439 \u0442\u0435\u0445\u043d\u0438\u043a\u0438<\/li>\n <li>\u041f\u043e\u0434\u0440\u043e\u0431\u043d\u044b\u0435 \u043e\u0431\u044a\u044f\u0441\u043d\u0435\u043d\u0438\u044f \u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432<\/li>\n <li>\u0421\u043e\u0432\u0435\u0442\u044b \u043f\u043e \u0432\u044b\u0431\u043e\u0440\u0443 \u043e\u0431\u043e\u0440\u0443\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u0438 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u043e\u0432<\/li>\n <\/ul>\n <\/div>\n \n <div style=\"background: rgba(255, 112, 67, 0.1); padding: 15px; border-radius: 10px;\">\n <p style=\"margin: 0; color: #5d4037;\"><strong>\u041d\u0430\u0441\u043b\u0435\u0434\u0438\u0435:<\/strong> \u041a\u043d\u0438\u0433\u0430 \u0434\u043e \u0441\u0438\u0445 \u043f\u043e\u0440 \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u043e\u0434\u043d\u043e\u0439 \u0438\u0437 \u0441\u0430\u043c\u044b\u0445 \u0432\u043b\u0438\u044f\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0445 \u043a\u043d\u0438\u0433 \u0432 \u0438\u0441\u0442\u043e\u0440\u0438\u0438. \u041e\u043d\u0430 \u0432\u0434\u043e\u0445\u043d\u043e\u0432\u0438\u043b\u0430 \u043f\u043e\u043a\u043e\u043b\u0435\u043d\u0438\u044f \u043f\u043e\u0432\u0430\u0440\u043e\u0432 \u0438 \u0441\u0434\u0435\u043b\u0430\u043b\u0430 \u0414\u0436\u0443\u043b\u0438\u044e \u0427\u0430\u0439\u043b\u0434 \u0438\u043a\u043e\u043d\u043e\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u043e\u0433\u043e \u043c\u0438\u0440\u0430.<\/p>\n <\/div>\n `\n },\n 'fact2': {\n title: '\u0422\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0445 \u0432\u0435\u0441\u043e\u0432',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u0422\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0445 \u0432\u0435\u0441\u043e\u0432<\/h3>\n \n <p>\u0421\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0446\u0438\u0444\u0440\u043e\u0432\u044b\u0435 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u044e\u0442 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u0434\u043e 0.1 \u0433\u0440\u0430\u043c\u043c\u0430, \u0447\u0442\u043e \u043a\u0440\u0438\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u0430\u0436\u043d\u043e \u0434\u043b\u044f \u043a\u043e\u043d\u0434\u0438\u0442\u0435\u0440\u0441\u043a\u0438\u0445 \u0438\u0437\u0434\u0435\u043b\u0438\u0439 \u0438 \u0432\u044b\u043f\u0435\u0447\u043a\u0438.<\/p>\n \n <div style=\"margin: 20px 0;\">\n <strong>\u042d\u0432\u043e\u043b\u044e\u0446\u0438\u044f \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u0438:<\/strong>\n <ul style=\"color: #666; line-height: 1.6; padding-left: 20px; margin-top: 10px;\">\n <li>18 \u0432\u0435\u043a: \u043c\u0435\u0445\u0430\u043d\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0432\u0435\u0441\u044b \u0441 \u043f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c\u044e 10-15%<\/li>\n <li>19 \u0432\u0435\u043a: \u043f\u0440\u0443\u0436\u0438\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b \u0441 \u043f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c\u044e 5-8%<\/li>\n <li>1970-\u0435: \u043f\u0435\u0440\u0432\u044b\u0435 \u0446\u0438\u0444\u0440\u043e\u0432\u044b\u0435 \u0432\u0435\u0441\u044b \u0441 \u043f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c\u044e 2-3%<\/li>\n <li>2000-\u0435: \u043f\u0440\u0435\u0446\u0438\u0437\u0438\u043e\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b \u0441 \u043f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c\u044e 0.5-1%<\/li>\n <li>2020-\u0435: \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u0432\u0435\u0441\u044b \u0441 \u043f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c\u044e 0.1%<\/li>\n <\/ul>\n <\/div>\n \n <div style=\"display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin-top: 20px;\">\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u0414\u043b\u044f \u0447\u0435\u0433\u043e \u043d\u0443\u0436\u043d\u0430 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c:<\/strong><br>\n \u2022 \u0420\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c: \u00b11\u0433 \u043c\u0435\u043d\u044f\u0435\u0442 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442<br>\n \u2022 \u0414\u0440\u043e\u0436\u0436\u0438: \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u043a\u0440\u0438\u0442\u0438\u0447\u043d\u0430<br>\n \u2022 \u0421\u043e\u043b\u044c: \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u0431\u0440\u043e\u0436\u0435\u043d\u0438\u0435<br>\n \u2022 \u0421\u043f\u0435\u0446\u0438\u0438: \u0434\u043e\u0437\u0438\u0440\u043e\u0432\u043a\u0430 \u043f\u043e \u0440\u0435\u0446\u0435\u043f\u0442\u0443\n <\/div>\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u0420\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u043c\u044b\u0435 \u0432\u0435\u0441\u044b:<\/strong><br>\n \u2022 OXO Good Grips: \u00b11\u0433<br>\n \u2022 Escali Primo: \u00b10.5\u0433<br>\n \u2022 My Weigh KD-8000: \u00b10.1\u0433<br>\n \u2022 AWS-600: \u00b10.01\u0433\n <\/div>\n <\/div>\n `\n },\n 'fact3': {\n title: '\u0425\u0438\u043c\u0438\u044f \u0432\u044b\u043f\u0435\u0447\u043a\u0438 \u0445\u043b\u0435\u0431\u0430',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u0425\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0440\u0435\u0430\u043a\u0446\u0438\u0438 \u043f\u0440\u0438 \u0432\u044b\u043f\u0435\u0447\u043a\u0435 \u0445\u043b\u0435\u0431\u0430<\/h3>\n \n <p>\u0412\u044b\u043f\u0435\u0447\u043a\u0430 \u0445\u043b\u0435\u0431\u0430 - \u044d\u0442\u043e \u0441\u043b\u043e\u0436\u043d\u044b\u0439 \u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043f\u0440\u043e\u0446\u0435\u0441\u0441, \u0432\u043a\u043b\u044e\u0447\u0430\u044e\u0449\u0438\u0439 \u0431\u043e\u043b\u0435\u0435 300 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0440\u0435\u0430\u043a\u0446\u0438\u0439.<\/p>\n \n <div style=\"margin: 20px 0;\">\n <strong>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u044d\u0442\u0430\u043f\u044b \u0438 \u0440\u0435\u0430\u043a\u0446\u0438\u0438:<\/strong>\n <ul style=\"color: #666; line-height: 1.6; padding-left: 20px; margin-top: 10px;\">\n <li>\u0424\u0435\u0440\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f: \u0434\u0440\u043e\u0436\u0436\u0438 \u043f\u0440\u0435\u0432\u0440\u0430\u0449\u0430\u044e\u0442 \u0441\u0430\u0445\u0430\u0440\u0430 \u0432 CO\u2082 \u0438 \u0430\u043b\u043a\u043e\u0433\u043e\u043b\u044c<\/li>\n <li>\u0414\u0435\u043d\u0430\u0442\u0443\u0440\u0430\u0446\u0438\u044f \u0431\u0435\u043b\u043a\u0430: \u0433\u043b\u044e\u0442\u0435\u043d \u0444\u043e\u0440\u043c\u0438\u0440\u0443\u0435\u0442 \u044d\u043b\u0430\u0441\u0442\u0438\u0447\u043d\u0443\u044e \u0441\u0435\u0442\u044c<\/li>\n <li>\u0416\u0435\u043b\u0430\u0442\u0438\u043d\u0438\u0437\u0430\u0446\u0438\u044f \u043a\u0440\u0430\u0445\u043c\u0430\u043b\u0430: \u043f\u0440\u0438 60-70\u00b0C<\/li>\n <li>\u0420\u0435\u0430\u043a\u0446\u0438\u044f \u041c\u0430\u0439\u044f\u0440\u0430: \u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043a\u043e\u0440\u043e\u0447\u043a\u0438 \u043f\u0440\u0438 140-165\u00b0C<\/li>\n <li>\u041a\u0430\u0440\u0430\u043c\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u044f: \u043f\u043e\u0434\u0440\u0443\u043c\u044f\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u0438 160-180\u00b0C<\/li>\n <\/ul>\n <\/div>\n \n <div style=\"background: rgba(255, 112, 67, 0.1); padding: 15px; border-radius: 10px;\">\n <p style=\"margin: 0; color: #5d4037;\"><strong>\u0418\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u0444\u0430\u043a\u0442:<\/strong> \u0417\u0430\u043f\u0430\u0445 \u0441\u0432\u0435\u0436\u0435\u0438\u0441\u043f\u0435\u0447\u0435\u043d\u043d\u043e\u0433\u043e \u0445\u043b\u0435\u0431\u0430 \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u0431\u043e\u043b\u0435\u0435 \u0447\u0435\u043c 200 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0430\u0440\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u0439.<\/p>\n <\/div>\n `\n },\n 'fact4': {\n title: '\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u0418\u0437\u043e\u0431\u0440\u0435\u0442\u0435\u043d\u0438\u0435 \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f \u0432 1846 \u0433\u043e\u0434\u0443<\/h3>\n \n <p>\u041d\u0435\u043c\u0435\u0446\u043a\u0438\u0439 \u0445\u0438\u043c\u0438\u043a \u042e\u0441\u0442\u0443\u0441 \u0444\u043e\u043d \u041b\u0438\u0431\u0438\u0445 \u0438\u0437\u043e\u0431\u0440\u0435\u043b \u043f\u0435\u0440\u0432\u044b\u0439 \u043a\u043e\u043c\u043c\u0435\u0440\u0447\u0435\u0441\u043a\u0438\u0439 \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u043e\u0438\u0437\u0432\u0435\u043b \u0440\u0435\u0432\u043e\u043b\u044e\u0446\u0438\u044e \u0432 \u0432\u044b\u043f\u0435\u0447\u043a\u0435.<\/p>\n \n <div style=\"margin: 20px 0;\">\n <strong>\u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442:<\/strong>\n <ul style=\"color: #666; line-height: 1.6; padding-left: 20px; margin-top: 10px;\">\n <li>\u0414\u043e 1846 \u0433\u043e\u0434\u0430: \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 \u0434\u0440\u043e\u0436\u0436\u0438 \u0438\u043b\u0438 \u0432\u0437\u0431\u0438\u0442\u044b\u0435 \u044f\u0438\u0447\u043d\u044b\u0435 \u0431\u0435\u043b\u043a\u0438<\/li>\n <li>1846: \u041b\u0438\u0431\u0438\u0445 \u0441\u043e\u0437\u0434\u0430\u043b \u0441\u043c\u0435\u0441\u044c \u0431\u0438\u043a\u0430\u0440\u0431\u043e\u043d\u0430\u0442\u0430 \u043d\u0430\u0442\u0440\u0438\u044f \u0438 \u0432\u0438\u043d\u043d\u043e\u0439 \u043a\u0438\u0441\u043b\u043e\u0442\u044b<\/li>\n <li>1850-\u0435: \u0443\u043b\u0443\u0447\u0448\u0435\u043d\u0438\u0435 \u0444\u043e\u0440\u043c\u0443\u043b\u044b \u0434\u043b\u044f \u0431\u043e\u043b\u0435\u0435 \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0430<\/li>\n <li>1890-\u0435: \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u0434\u0432\u043e\u0439\u043d\u043e\u0433\u043e \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f (\u0440\u0435\u0430\u043a\u0446\u0438\u044f \u043f\u0440\u0438 \u0441\u043c\u0435\u0448\u0438\u0432\u0430\u043d\u0438\u0438 \u0438 \u043f\u0440\u0438 \u043d\u0430\u0433\u0440\u0435\u0432\u0435)<\/li>\n <li>\u0421\u0435\u0433\u043e\u0434\u043d\u044f: \u0442\u043e\u0447\u043d\u044b\u0435 \u0444\u043e\u0440\u043c\u0443\u043b\u044b \u0434\u043b\u044f \u0440\u0430\u0437\u043d\u044b\u0445 \u0432\u0438\u0434\u043e\u0432 \u0432\u044b\u043f\u0435\u0447\u043a\u0438<\/li>\n <\/ul>\n <\/div>\n \n <div style=\"display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin-top: 20px;\">\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u0421\u043e\u0441\u0442\u0430\u0432 \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f:<\/strong><br>\n \u2022 \u0411\u0438\u043a\u0430\u0440\u0431\u043e\u043d\u0430\u0442 \u043d\u0430\u0442\u0440\u0438\u044f (\u0441\u043e\u0434\u0430)<br>\n \u2022 \u041a\u0438\u0441\u043b\u043e\u0442\u0430 (\u0432\u0438\u043d\u043d\u0430\u044f, \u043b\u0438\u043c\u043e\u043d\u043d\u0430\u044f)<br>\n \u2022 \u041d\u0430\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c (\u043a\u0440\u0430\u0445\u043c\u0430\u043b)<br>\n \u2022 \u0421\u0442\u0430\u0431\u0438\u043b\u0438\u0437\u0430\u0442\u043e\u0440\u044b\n <\/div>\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u041a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442:<\/strong><br>\n 1. \u0412\u043b\u0430\u0433\u0430 \u0430\u043a\u0442\u0438\u0432\u0438\u0440\u0443\u0435\u0442 \u043a\u0438\u0441\u043b\u043e\u0442\u0443<br>\n 2. \u041a\u0438\u0441\u043b\u043e\u0442\u0430 \u0440\u0435\u0430\u0433\u0438\u0440\u0443\u0435\u0442 \u0441 \u0441\u043e\u0434\u043e\u0439<br>\n 3. \u0412\u044b\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f CO\u2082<br>\n 4. \u0413\u0430\u0437 \u043f\u043e\u0434\u043d\u0438\u043c\u0430\u0435\u0442 \u0442\u0435\u0441\u0442\u043e\n <\/div>\n <\/div>\n `\n }\n };\n\n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0434\u043b\u044f \u043f\u043e\u043a\u0430\u0437\u0430 \u0434\u0435\u0442\u0430\u043b\u044c\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438\n function showDetail(section) {\n const content = detailContent[section] || {\n title: '\u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f',\n content: '<p>\u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0430\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u0433\u043e\u0442\u043e\u0432\u0438\u0442\u0441\u044f \u043a \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438.<\/p>'\n };\n\n \/\/ \u0421\u043e\u0437\u0434\u0430\u0435\u043c \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0435 \u043e\u043a\u043d\u043e\n const modal = document.createElement('div');\n modal.className = 'modal-overlay';\n modal.innerHTML = `\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <div class=\"modal-title\">${content.title}<\/div>\n <button class=\"modal-close\" onclick=\"this.closest('.modal-overlay').remove()\">\u00d7<\/button>\n <\/div>\n <div class=\"modal-body\">\n ${content.content}\n <div style=\"margin-top: 30px; padding-top: 20px; border-top: 1px solid #eee;\">\n <p style=\"font-size: 0.9rem; color: #999; text-align: center;\">\n \u0414\u043b\u044f \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u043f\u043e\u0441\u0435\u0442\u0438\u0442\u0435 \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0432\u044b\u0448\u0435\n <\/p>\n <\/div>\n <\/div>\n <\/div>\n `;\n\n document.body.appendChild(modal);\n\n \/\/ \u0417\u0430\u043a\u0440\u044b\u0442\u0438\u0435 \u043f\u043e \u043a\u043b\u0438\u043a\u0443 \u043d\u0430 \u043e\u0432\u0435\u0440\u043b\u0435\u0439\n modal.addEventListener('click', function(e) {\n if (e.target === this) {\n this.remove();\n }\n });\n }\n\n \/\/ \u0418\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0439 \u0442\u0435\u0441\u0442\n function checkAnswer(element, type) {\n \/\/ \u0421\u043d\u0438\u043c\u0430\u0435\u043c \u0432\u0441\u0435 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0438\u0435 \u0432\u044b\u0434\u0435\u043b\u0435\u043d\u0438\u044f\n document.querySelectorAll('.quiz-option').forEach(opt => {\n opt.classList.remove('correct', 'incorrect');\n });\n \n \/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u043a\u043b\u0430\u0441\u0441 \u0434\u043b\u044f \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u043e\u0433\u043e \u043e\u0442\u0432\u0435\u0442\u0430\n element.classList.add(type);\n \n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\n const message = type === 'correct' \n ? '\ud83c\udf89 \u041f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e! \u0420\u0435\u0430\u043a\u0446\u0438\u044f \u041c\u0430\u0439\u044f\u0440\u0430 \u2014 \u044d\u0442\u043e \u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0440\u0435\u0430\u043a\u0446\u0438\u044f \u043c\u0435\u0436\u0434\u0443 \u0430\u043c\u0438\u043d\u043e\u043a\u0438\u0441\u043b\u043e\u0442\u0430\u043c\u0438 \u0438 \u0441\u0430\u0445\u0430\u0440\u0430\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u0440\u0438 \u043d\u0430\u0433\u0440\u0435\u0432\u0430\u043d\u0438\u0438.'\n : '\u274c \u041d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e. \u041a\u0430\u0440\u0430\u043c\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u2014 \u044d\u0442\u043e \u043e\u043a\u0438\u0441\u043b\u0435\u043d\u0438\u0435 \u0441\u0430\u0445\u0430\u0440\u0430, \u0430 \u0440\u0435\u0430\u043a\u0446\u0438\u044f \u041c\u0430\u0439\u044f\u0440\u0430 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043c\u0435\u0436\u0434\u0443 \u0430\u043c\u0438\u043d\u043e\u043a\u0438\u0441\u043b\u043e\u0442\u0430\u043c\u0438 \u0438 \u0441\u0430\u0445\u0430\u0440\u0430\u043c\u0438.';\n \n \/\/ \u0421\u043e\u0437\u0434\u0430\u0435\u043c \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u0435\n const result = document.createElement('div');\n result.style.cssText = `\n position: fixed;\n bottom: 20px;\n left: 50%;\n transform: translateX(-50%);\n background: ${type === 'correct' ? '#4caf50' : '#f44336'};\n color: white;\n padding: 15px 30px;\n border-radius: 10px;\n z-index: 1000;\n box-shadow: 0 5px 20px rgba(0,0,0,0.2);\n animation: slideUp 0.3s ease;\n max-width: 500px;\n text-align: center;\n `;\n result.textContent = message;\n document.body.appendChild(result);\n \n \/\/ \u041c\u0435\u043d\u044f\u0435\u043c \u0432\u043e\u043f\u0440\u043e\u0441 \u0447\u0435\u0440\u0435\u0437 3 \u0441\u0435\u043a\u0443\u043d\u0434\u044b\n if (type === 'correct') {\n setTimeout(() => {\n result.remove();\n document.querySelectorAll('.quiz-option').forEach(opt => {\n opt.classList.remove('correct', 'incorrect');\n });\n \n \/\/ \u041d\u043e\u0432\u044b\u0435 \u0432\u043e\u043f\u0440\u043e\u0441\u044b \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0430\n const questions = [\n {\n question: '\u041f\u0440\u0438 \u043a\u0430\u043a\u043e\u0439 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043a\u0430\u0440\u0430\u043c\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0441\u0430\u0445\u0430\u0440\u0430?',\n options: ['100-110\u00b0C', '120-130\u00b0C', '160-180\u00b0C', '200-220\u00b0C'],\n correct: 2\n },\n {\n question: '\u0427\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442 \u0442\u0435\u0440\u043c\u0438\u043d \"\u0430\u043b\u044c \u0434\u0435\u043d\u0442\u0435\" \u0432 \u0438\u0442\u0430\u043b\u044c\u044f\u043d\u0441\u043a\u043e\u0439 \u043a\u0443\u0445\u043d\u0435?',\n options: ['\u0421\u043b\u0435\u0433\u043a\u0430 \u043d\u0435\u0434\u043e\u0432\u0430\u0440\u0435\u043d\u043d\u044b\u0439', '\u0421\u0438\u043b\u044c\u043d\u043e \u043f\u0435\u0440\u0435\u0432\u0430\u0440\u0435\u043d\u043d\u044b\u0439', '\u0421\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u0430\u044f \u043d\u0430\u0440\u0435\u0437\u043a\u0430', '\u0421 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435\u043c \u0441\u043f\u0435\u0446\u0438\u0439'],\n correct: 0\n },\n {\n question: '\u041a\u0430\u043a \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0442\u0435\u0445\u043d\u0438\u043a\u0430 \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u043e\u0431\u0436\u0430\u0440\u0438\u0432\u0430\u043d\u0438\u044f \u0432 \u043c\u0430\u0441\u043b\u0435 \u0441 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u044b\u043c \u043f\u043e\u043c\u0435\u0448\u0438\u0432\u0430\u043d\u0438\u0435\u043c?',\n options: ['\u0411\u043b\u0430\u043d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435', '\u0421\u043e\u0442\u0435', '\u041a\u043e\u043d\u0444\u0438', '\u0422\u0430\u043d\u0434\u0443\u0440\u0438'],\n correct: 1\n }\n ];\n \n const randomQuestion = questions[Math.floor(Math.random() * questions.length)];\n document.getElementById('quizQuestion').textContent = randomQuestion.question;\n \n const options = document.querySelectorAll('.quiz-option');\n options.forEach((option, index) => {\n option.textContent = randomQuestion.options[index];\n option.onclick = function() {\n checkAnswer(this, index === randomQuestion.correct ? 'correct' : 'incorrect');\n };\n });\n \n }, 3000);\n }\n \n setTimeout(() => {\n if (result.parentNode) {\n result.style.opacity = '0';\n result.style.transition = 'opacity 0.5s';\n setTimeout(() => result.remove(), 500);\n }\n }, 3000);\n }\n\n \/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0441\u0442\u0438\u043b\u0438 \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439\n const style = document.createElement('style');\n style.textContent = `\n @keyframes slideUp {\n 0% { transform: translateX(-50%) translateY(100px); opacity: 0; }\n 100% { transform: translateX(-50%) translateY(0); opacity: 1; }\n }\n `;\n document.head.appendChild(style);\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>\u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u041f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u0443\u0439\u0442\u0435 \u043c\u0435\u0440\u044b, \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0443 \u0438 \u0437\u0430\u043c\u0435\u043d\u0438\u0442\u0435 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u044b \u0432 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0445 \u0440\u0435\u0446\u0435\u043f\u0442\u0430\u0445 \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u043c\u0435\u0440 \u041e\u0431\u044a\u0435\u043c\/\u0412\u0435\u0441 \u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0430 \u0417\u0430\u043c\u0435\u043d\u0430 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432 \u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442: \u041c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f \u0421\u0430\u0445\u0430\u0440 \u0421\u0430\u0445\u0430\u0440\u043d\u0430\u044f \u043f\u0443\u0434\u0440\u0430 \u041c\u0430\u0441\u043b\u043e \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0435 \u041c\u0430\u0441\u043b\u043e \u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u041c\u043e\u043b\u043e\u043a\u043e \u0412\u043e\u0434\u0430 \u0420\u0438\u0441 \u0413\u0440\u0435\u0447\u043a\u0430 \u0414\u0440\u0443\u0433\u0438\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b: \u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u0438\u0437 \u0441\u043f\u0438\u0441\u043a\u0430… \u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435: \u0418\u0417 \u0413\u0440\u0430\u043c\u043c\u044b (\u0433)\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (\u043a\u0433)\u0421\u0442\u0430\u043a\u0430\u043d (200 \u043c\u043b)\u0421\u0442\u0430\u043a\u0430\u043d (250 \u043c\u043b)\u0421\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430\u0427\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430\u0427\u0430\u0448\u043a\u0430 (US,…<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kadence_starter_templates_imported_post":false,"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"class_list":["post-289","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"http:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages\/289","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/gestro.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=289"}],"version-history":[{"count":9,"href":"http:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages\/289\/revisions"}],"predecessor-version":[{"id":309,"href":"http:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages\/289\/revisions\/309"}],"wp:attachment":[{"href":"http:\/\/gestro.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=289"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":289,"date":"2026-01-01T20:19:34","date_gmt":"2026-01-01T17:19:34","guid":{"rendered":"https:\/\/gestro.ru\/?page_id=289"},"modified":"2026-01-02T11:52:24","modified_gmt":"2026-01-02T08:52:24","slug":"%d0%ba%d1%83%d0%bb%d0%b8%d0%bd%d0%b0%d1%80%d0%bd%d1%8b%d0%b9-%d0%ba%d0%be%d0%bd%d0%b2%d0%b5%d1%80%d1%82%d0%b5%d1%80","status":"publish","type":"page","link":"http:\/\/gestro.ru\/?page_id=289","title":{"rendered":"\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440"},"content":{"rendered":"\n\n\n\n \n \n \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440<\/title>\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n }\n \n body {\n background: linear-gradient(135deg, #ff9a9e 0%, #fad0c4 100%);\n color: #333;\n line-height: 1.6;\n min-height: 100vh;\n padding: 20px;\n }\n \n .container {\n max-width: 1400px;\n margin: 0 auto;\n padding: 0 15px;\n }\n \n .header {\n text-align: center;\n margin-bottom: 40px;\n color: #5d4037;\n text-shadow: 0 2px 5px rgba(0,0,0,0.1);\n }\n \n .header h1 {\n font-size: 2.8rem;\n margin-bottom: 15px;\n }\n \n .header p {\n font-size: 1.2rem;\n opacity: 0.9;\n max-width: 800px;\n margin: 0 auto;\n color: #795548;\n }\n \n .main-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 30px;\n margin-bottom: 40px;\n }\n \n @media (max-width: 1100px) {\n .main-grid {\n grid-template-columns: 1fr;\n }\n }\n \n .calculator-card {\n background: white;\n border-radius: 25px;\n padding: 35px;\n box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1);\n transition: transform 0.3s ease;\n }\n \n .calculator-card:hover {\n transform: translateY(-5px);\n }\n \n .converter-section {\n background: rgba(255, 255, 255, 0.98);\n }\n \n .info-section {\n background: rgba(255, 255, 255, 0.98);\n }\n \n .section-title {\n color: #5d4037;\n margin-bottom: 25px;\n display: flex;\n align-items: center;\n gap: 15px;\n font-size: 1.8rem;\n }\n \n .section-title i {\n color: #ff7043;\n }\n \n .converter-tabs {\n display: flex;\n gap: 10px;\n margin-bottom: 25px;\n flex-wrap: wrap;\n }\n \n .tab-btn {\n padding: 12px 24px;\n background: #f5f5f5;\n border: 2px solid #e0e0e0;\n border-radius: 12px;\n font-weight: 600;\n cursor: pointer;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n gap: 8px;\n color: #5d4037;\n }\n \n .tab-btn.active {\n background: #ff7043;\n color: white;\n border-color: #ff7043;\n }\n \n .tab-btn:hover {\n transform: translateY(-2px);\n box-shadow: 0 5px 15px rgba(255, 112, 67, 0.2);\n }\n \n .tab-content {\n display: none;\n }\n \n .tab-content.active {\n display: block;\n animation: fadeIn 0.5s ease;\n }\n \n @keyframes fadeIn {\n from { opacity: 0; transform: translateY(10px); }\n to { opacity: 1; transform: translateY(0); }\n }\n \n .converter-form {\n display: flex;\n flex-direction: column;\n gap: 25px;\n }\n \n .input-group {\n position: relative;\n }\n \n .input-group label {\n display: block;\n margin-bottom: 10px;\n font-weight: 600;\n color: #5d4037;\n font-size: 1.1rem;\n }\n \n .input-with-icon {\n position: relative;\n }\n \n .input-with-icon input,\n .input-with-icon select {\n width: 100%;\n padding: 18px 20px;\n border: 3px solid #e0e0e0;\n border-radius: 15px;\n font-size: 1.2rem;\n font-weight: 600;\n transition: all 0.3s;\n background: #f8f9fa;\n color: #5d4037;\n }\n \n .input-with-icon input:focus,\n .input-with-icon select:focus {\n border-color: #ff7043;\n background: white;\n box-shadow: 0 5px 20px rgba(255, 112, 67, 0.1);\n outline: none;\n }\n \n .input-icon {\n position: absolute;\n right: 20px;\n top: 50%;\n transform: translateY(-50%);\n color: #ff7043;\n font-size: 1.3rem;\n }\n \n .product-selector {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));\n gap: 12px;\n margin-top: 15px;\n }\n \n .product-btn {\n padding: 15px;\n background: white;\n border: 2px solid #e0e0e0;\n border-radius: 12px;\n text-align: center;\n cursor: pointer;\n transition: all 0.3s;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n color: #5d4037;\n }\n \n .product-btn:hover {\n border-color: #ff7043;\n transform: translateY(-3px);\n box-shadow: 0 5px 15px rgba(255, 112, 67, 0.1);\n }\n \n .product-btn.active {\n background: #ffebee;\n border-color: #ff7043;\n color: #ff7043;\n }\n \n .product-icon {\n font-size: 1.5rem;\n color: #ff7043;\n }\n \n .custom-product-selector {\n position: relative;\n margin-top: 15px;\n }\n \n .custom-product-input {\n width: 100%;\n padding: 15px 20px;\n border: 3px solid #e0e0e0;\n border-radius: 15px;\n font-size: 1.1rem;\n font-weight: 600;\n background: #f8f9fa;\n color: #5d4037;\n cursor: pointer;\n position: relative;\n }\n \n .custom-product-input:after {\n content: '\u25bc';\n position: absolute;\n right: 20px;\n top: 50%;\n transform: translateY(-50%);\n color: #ff7043;\n }\n \n .custom-product-dropdown {\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n background: white;\n border: 3px solid #ff7043;\n border-radius: 15px;\n margin-top: 5px;\n max-height: 300px;\n overflow-y: auto;\n z-index: 100;\n display: none;\n box-shadow: 0 10px 30px rgba(0,0,0,0.1);\n }\n \n .custom-product-dropdown.active {\n display: block;\n }\n \n .dropdown-item {\n padding: 15px 20px;\n border-bottom: 1px solid #eee;\n cursor: pointer;\n transition: all 0.2s;\n color: #5d4037;\n }\n \n .dropdown-item:hover {\n background: #ffebee;\n color: #ff7043;\n }\n \n .dropdown-item:last-child {\n border-bottom: none;\n }\n \n .unit-selector-with-hints {\n display: flex;\n align-items: center;\n gap: 15px;\n margin-top: 15px;\n }\n \n .unit-select-container {\n flex: 1;\n position: relative;\n }\n \n .unit-hint {\n position: absolute;\n font-size: 0.7rem;\n font-weight: 600;\n color: white;\n padding: 3px 10px;\n border-radius: 12px;\n z-index: 3;\n }\n \n .unit-hint-from {\n top: -10px;\n left: 10px;\n background: linear-gradient(135deg, #ff7043 0%, #ffab40 100%);\n }\n \n .unit-hint-to {\n bottom: -10px;\n right: 10px;\n background: linear-gradient(135deg, #4caf50 0%, #8bc34a 100%);\n }\n \n .swap-button {\n width: 50px;\n height: 50px;\n border-radius: 50%;\n background: linear-gradient(135deg, #ff7043 0%, #ffab40 100%);\n color: white;\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.3s;\n font-size: 1.2rem;\n flex-shrink: 0;\n }\n \n .swap-button:hover {\n transform: rotate(180deg) scale(1.1);\n box-shadow: 0 5px 15px rgba(255, 112, 67, 0.4);\n }\n \n .result-display {\n background: linear-gradient(135deg, #4caf50 0%, #8bc34a 100%);\n color: white;\n padding: 30px;\n border-radius: 20px;\n text-align: center;\n margin-top: 20px;\n box-shadow: 0 10px 30px rgba(76, 175, 80, 0.2);\n }\n \n .result-value {\n font-size: 3.5rem;\n font-weight: 800;\n margin: 15px 0;\n text-shadow: 2px 2px 4px rgba(0,0,0,0.1);\n }\n \n .result-unit {\n font-size: 1.3rem;\n opacity: 0.9;\n font-weight: 600;\n }\n \n .quick-conversions {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n gap: 15px;\n margin-top: 30px;\n }\n \n .quick-conversion-item {\n background: white;\n padding: 20px;\n border-radius: 15px;\n text-align: center;\n border: 2px solid #e0e0e0;\n transition: all 0.3s;\n cursor: pointer;\n color: #5d4037;\n }\n \n .quick-conversion-item:hover {\n border-color: #ff7043;\n transform: translateY(-5px);\n box-shadow: 0 10px 20px rgba(255, 112, 67, 0.1);\n }\n \n .quick-value {\n font-size: 1.5rem;\n font-weight: 700;\n margin: 10px 0 5px;\n }\n \n .quick-unit {\n font-size: 0.9rem;\n color: #666;\n }\n \n .temperature-converter {\n background: white;\n padding: 25px;\n border-radius: 20px;\n border: 2px solid #e0e0e0;\n margin-top: 30px;\n }\n \n .oven-temperatures {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 15px;\n margin-top: 20px;\n }\n \n .oven-item {\n text-align: center;\n padding: 20px;\n background: #f8f9fa;\n border-radius: 15px;\n transition: all 0.3s;\n color: #5d4037;\n }\n \n .oven-item:hover {\n background: #ffebee;\n transform: scale(1.05);\n }\n \n .oven-value {\n font-size: 1.5rem;\n font-weight: 700;\n margin: 10px 0 5px;\n }\n \n .oven-label {\n font-size: 0.9rem;\n color: #666;\n }\n \n .equivalents-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));\n gap: 15px;\n margin-top: 25px;\n }\n \n .equivalent-card {\n background: white;\n padding: 20px;\n border-radius: 15px;\n text-align: center;\n border: 2px solid #e0e0e0;\n transition: all 0.3s;\n color: #5d4037;\n }\n \n .equivalent-card:hover {\n border-color: #4caf50;\n transform: translateY(-5px);\n box-shadow: 0 10px 20px rgba(76, 175, 80, 0.1);\n }\n \n .equivalent-title {\n font-weight: 600;\n margin-bottom: 10px;\n }\n \n .equivalent-value {\n font-size: 1.2rem;\n color: #4caf50;\n font-weight: 700;\n }\n \n .action-buttons {\n display: flex;\n gap: 15px;\n margin-top: 30px;\n flex-wrap: wrap;\n }\n \n .action-btn {\n flex: 1;\n min-width: 150px;\n padding: 18px 25px;\n border: none;\n border-radius: 15px;\n font-size: 1rem;\n font-weight: 600;\n cursor: pointer;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 10px;\n }\n \n .btn-primary {\n background: linear-gradient(135deg, #ff7043 0%, #ffab40 100%);\n color: white;\n }\n \n .btn-secondary {\n background: #f8f9fa;\n color: #5d4037;\n border: 2px solid #e0e0e0;\n }\n \n .action-btn:hover {\n transform: translateY(-3px);\n box-shadow: 0 10px 20px rgba(0,0,0,0.1);\n }\n \n .info-box {\n background: #e8f5e9;\n border-left: 4px solid #4caf50;\n padding: 20px;\n border-radius: 10px;\n margin: 20px 0;\n font-size: 0.95rem;\n color: #5d4037;\n }\n \n .tips-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 20px;\n margin-top: 25px;\n }\n \n .tip-card {\n background: white;\n padding: 25px;\n border-radius: 15px;\n border: 2px solid #e0e0e0;\n color: #5d4037;\n }\n \n .tip-icon {\n font-size: 2rem;\n color: #ff7043;\n margin-bottom: 15px;\n }\n \n .tip-title {\n font-weight: 600;\n margin-bottom: 10px;\n font-size: 1.1rem;\n }\n \n .history-timeline {\n position: relative;\n padding-left: 30px;\n margin: 30px 0;\n }\n \n .history-timeline::before {\n content: '';\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n width: 3px;\n background: linear-gradient(to bottom, #ff7043, #ffab40);\n }\n \n .history-item {\n position: relative;\n margin-bottom: 30px;\n padding: 25px;\n background: white;\n border-radius: 15px;\n border-left: 5px solid #ff7043;\n box-shadow: 0 5px 15px rgba(0,0,0,0.05);\n color: #5d4037;\n }\n \n .history-item::before {\n content: '';\n position: absolute;\n left: -38px;\n top: 30px;\n width: 20px;\n height: 20px;\n border-radius: 50%;\n background: #ff7043;\n border: 3px solid white;\n box-shadow: 0 0 0 3px #ff7043;\n }\n \n .history-period {\n font-weight: 700;\n color: #ff7043;\n margin-bottom: 8px;\n font-size: 1.1rem;\n }\n \n .history-description {\n color: #666;\n line-height: 1.5;\n }\n \n .footer {\n text-align: center;\n margin-top: 50px;\n color: #5d4037;\n opacity: 0.8;\n font-size: 0.9rem;\n }\n \n @media (max-width: 768px) {\n .header h1 { font-size: 2rem; }\n .header p { font-size: 1rem; }\n .calculator-card { padding: 20px; }\n .section-title { font-size: 1.5rem; }\n .result-value { font-size: 2.5rem; }\n .converter-tabs { flex-direction: column; }\n .tab-btn { width: 100%; justify-content: center; }\n .unit-selector-with-hints { flex-direction: column; }\n .quick-conversions { grid-template-columns: repeat(2, 1fr); }\n .tips-grid { grid-template-columns: 1fr; }\n .action-buttons { flex-direction: column; }\n .action-btn { min-width: 100%; }\n }\n \n @media (max-width: 480px) {\n .header h1 { font-size: 1.8rem; }\n .quick-conversions { grid-template-columns: 1fr; }\n .product-selector { grid-template-columns: repeat(2, 1fr); }\n }\n \n .pulse {\n animation: pulse 0.5s ease;\n }\n \n @keyframes pulse {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.05); }\n 100% { transform: scale(1); }\n }\n \n .toast {\n position: fixed;\n bottom: 20px;\n right: 20px;\n background: #ff7043;\n color: white;\n padding: 15px 25px;\n border-radius: 10px;\n z-index: 1000;\n box-shadow: 0 4px 12px rgba(0,0,0,0.2);\n animation: slideIn 0.3s ease;\n }\n \n @keyframes slideIn {\n from { transform: translateX(100%); opacity: 0; }\n to { transform: translateX(0); opacity: 1; }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <div class=\"header\">\n <h1><i class=\"fas fa-utensils\"><\/i> \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440<\/h1>\n <p>\u041f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u0443\u0439\u0442\u0435 \u043c\u0435\u0440\u044b, \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0443 \u0438 \u0437\u0430\u043c\u0435\u043d\u0438\u0442\u0435 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u044b \u0432 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0445 \u0440\u0435\u0446\u0435\u043f\u0442\u0430\u0445<\/p>\n <\/div>\n \n <div class=\"main-grid\">\n <div class=\"calculator-card converter-section\">\n <h2 class=\"section-title\">\n <i class=\"fas fa-exchange-alt\"><\/i> \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u043c\u0435\u0440\n <\/h2>\n \n <div class=\"converter-tabs\">\n <button class=\"tab-btn active\" data-tab=\"volume\">\n <i class=\"fas fa-wine-bottle\"><\/i> \u041e\u0431\u044a\u0435\u043c\/\u0412\u0435\u0441\n <\/button>\n <button class=\"tab-btn\" data-tab=\"temperature\">\n <i class=\"fas fa-thermometer-half\"><\/i> \u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0430\n <\/button>\n <button class=\"tab-btn\" data-tab=\"equivalents\">\n <i class=\"fas fa-exchange-alt\"><\/i> \u0417\u0430\u043c\u0435\u043d\u0430 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432\n <\/button>\n <\/div>\n \n \n <div class=\"tab-content active\" id=\"tab-volume\">\n <div class=\"converter-form\">\n <div class=\"input-group\">\n <label><i class=\"fas fa-apple-alt\"><\/i> \u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442:<\/label>\n <div class=\"product-selector\">\n <button class=\"product-btn active\" data-product=\"\u043c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f\">\n <i class=\"fas fa-bread-slice product-icon\"><\/i>\n <span>\u041c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u0441\u0430\u0445\u0430\u0440\">\n <i class=\"fas fa-candy-cane product-icon\"><\/i>\n <span>\u0421\u0430\u0445\u0430\u0440<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u0441\u0430\u0445\u0430\u0440\u043d\u0430\u044f \u043f\u0443\u0434\u0440\u0430\">\n <i class=\"fas fa-candy-cane product-icon\"><\/i>\n <span>\u0421\u0430\u0445\u0430\u0440\u043d\u0430\u044f \u043f\u0443\u0434\u0440\u0430<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u043c\u0430\u0441\u043b\u043e \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0435\">\n <i class=\"fas fa-blender product-icon\"><\/i>\n <span>\u041c\u0430\u0441\u043b\u043e \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0435<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043c\u0430\u0441\u043b\u043e\">\n <i class=\"fas fa-oil-can product-icon\"><\/i>\n <span>\u041c\u0430\u0441\u043b\u043e \u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u043c\u043e\u043b\u043e\u043a\u043e\">\n <i class=\"fas fa-glass-whiskey product-icon\"><\/i>\n <span>\u041c\u043e\u043b\u043e\u043a\u043e<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u0432\u043e\u0434\u0430\">\n <i class=\"fas fa-tint product-icon\"><\/i>\n <span>\u0412\u043e\u0434\u0430<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u0440\u0438\u0441\">\n <i class=\"fas fa-seedling product-icon\"><\/i>\n <span>\u0420\u0438\u0441<\/span>\n <\/button>\n <button class=\"product-btn\" data-product=\"\u0433\u0440\u0435\u0447\u043a\u0430\">\n <i class=\"fas fa-seedling product-icon\"><\/i>\n <span>\u0413\u0440\u0435\u0447\u043a\u0430<\/span>\n <\/button>\n <\/div>\n \n <div class=\"custom-product-selector\">\n <label style=\"margin-top: 20px; display: block;\">\u0414\u0440\u0443\u0433\u0438\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b:<\/label>\n <div class=\"custom-product-input\" id=\"customProductInput\">\n \u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u0438\u0437 \u0441\u043f\u0438\u0441\u043a\u0430…\n <\/div>\n <div class=\"custom-product-dropdown\" id=\"customProductDropdown\">\n \n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"input-group\">\n <label for=\"inputValue\"><i class=\"fas fa-arrow-right\"><\/i> \u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435:<\/label>\n <div class=\"input-with-icon\">\n <input type=\"number\" id=\"inputValue\" value=\"100\" step=\"0.01\" min=\"0\">\n <span class=\"input-icon\"><i class=\"fas fa-balance-scale\"><\/i><\/span>\n <\/div>\n <\/div>\n \n <div class=\"unit-selector-with-hints\">\n <div class=\"unit-select-container\">\n <div class=\"unit-hint unit-hint-from\">\u0418\u0417<\/div>\n <select id=\"fromUnit\">\n <option value=\"\u0433\u0440\u0430\u043c\u043c\">\u0413\u0440\u0430\u043c\u043c\u044b (\u0433)<\/option>\n <option value=\"\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (\u043a\u0433)<\/option>\n <option value=\"\u0441\u0442\u0430\u043a\u0430\u043d_200\">\u0421\u0442\u0430\u043a\u0430\u043d (200 \u043c\u043b)<\/option>\n <option value=\"\u0441\u0442\u0430\u043a\u0430\u043d_250\">\u0421\u0442\u0430\u043a\u0430\u043d (250 \u043c\u043b)<\/option>\n <option value=\"\u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f\">\u0421\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430<\/option>\n <option value=\"\u0447\u0430\u0439\u043d\u0430\u044f\">\u0427\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430<\/option>\n <option value=\"\u0447\u0430\u0448\u043a\u0430_us\">\u0427\u0430\u0448\u043a\u0430 (US, 240 \u043c\u043b)<\/option>\n <option value=\"\u0443\u043d\u0446\u0438\u044f\">\u0423\u043d\u0446\u0438\u044f (oz)<\/option>\n <option value=\"\u0444\u0443\u043d\u0442\">\u0424\u0443\u043d\u0442 (lb)<\/option>\n <option value=\"\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440\">\u041c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440\u044b (\u043c\u043b)<\/option>\n <option value=\"\u043b\u0438\u0442\u0440\">\u041b\u0438\u0442\u0440 (\u043b)<\/option>\n <\/select>\n <\/div>\n \n <button class=\"swap-button\" id=\"swapUnits\">\n <i class=\"fas fa-sync-alt\"><\/i>\n <\/button>\n \n <div class=\"unit-select-container\">\n <div class=\"unit-hint unit-hint-to\">\u0412<\/div>\n <select id=\"toUnit\">\n <option value=\"\u0433\u0440\u0430\u043c\u043c\">\u0413\u0440\u0430\u043c\u043c\u044b (\u0433)<\/option>\n <option value=\"\u0441\u0442\u0430\u043a\u0430\u043d_200\">\u0421\u0442\u0430\u043a\u0430\u043d (200 \u043c\u043b)<\/option>\n <option value=\"\u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f\">\u0421\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430<\/option>\n <option value=\"\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (\u043a\u0433)<\/option>\n <option value=\"\u0441\u0442\u0430\u043a\u0430\u043d_250\">\u0421\u0442\u0430\u043a\u0430\u043d (250 \u043c\u043b)<\/option>\n <option value=\"\u0447\u0430\u0439\u043d\u0430\u044f\">\u0427\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430<\/option>\n <option value=\"\u0447\u0430\u0448\u043a\u0430_us\">\u0427\u0430\u0448\u043a\u0430 (US, 240 \u043c\u043b)<\/option>\n <option value=\"\u0443\u043d\u0446\u0438\u044f\">\u0423\u043d\u0446\u0438\u044f (oz)<\/option>\n <option value=\"\u0444\u0443\u043d\u0442\">\u0424\u0443\u043d\u0442 (lb)<\/option>\n <option value=\"\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440\">\u041c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440\u044b (\u043c\u043b)<\/option>\n <option value=\"\u043b\u0438\u0442\u0440\">\u041b\u0438\u0442\u0440 (\u043b)<\/option>\n <\/select>\n <\/div>\n <\/div>\n \n <div class=\"result-display\">\n <div id=\"resultValue\" class=\"result-value\">130<\/div>\n <div id=\"resultUnit\" class=\"result-unit\">\u0433\u0440\u0430\u043c\u043c \u043c\u0443\u043a\u0438 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u043e\u0439<\/div>\n <\/div>\n \n <div class=\"quick-conversions\">\n <div class=\"quick-conversion-item\" data-unit=\"\u0433\u0440\u0430\u043c\u043c\">\n <div class=\"quick-value\" id=\"quickGram\">130<\/div>\n <div class=\"quick-unit\">\u0413\u0440\u0430\u043c\u043c\u044b<\/div>\n <\/div>\n <div class=\"quick-conversion-item\" data-unit=\"\u0441\u0442\u0430\u043a\u0430\u043d_200\">\n <div class=\"quick-value\" id=\"quickGlass200\">1.0<\/div>\n <div class=\"quick-unit\">\u0421\u0442\u0430\u043a\u0430\u043d 200\u043c\u043b<\/div>\n <\/div>\n <div class=\"quick-conversion-item\" data-unit=\"\u0441\u0442\u0430\u043a\u0430\u043d_250\">\n <div class=\"quick-value\" id=\"quickGlass250\">0.8<\/div>\n <div class=\"quick-unit\">\u0421\u0442\u0430\u043a\u0430\u043d 250\u043c\u043b<\/div>\n <\/div>\n <div class=\"quick-conversion-item\" data-unit=\"\u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f\">\n <div class=\"quick-value\" id=\"quickSpoon\">8.7<\/div>\n <div class=\"quick-unit\">\u0421\u0442. \u043b\u043e\u0436\u043a\u0438<\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"tab-content\" id=\"tab-temperature\">\n <div class=\"temperature-converter\">\n <h3 style=\"color: #5d4037; margin-bottom: 20px;\">\n <i class=\"fas fa-fire\"><\/i> \u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0430 \u0434\u0443\u0445\u043e\u0432\u043a\u0438\n <\/h3>\n \n <div class=\"converter-form\">\n <div class=\"input-group\">\n <label><i class=\"fas fa-thermometer\"><\/i> \u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0443:<\/label>\n <div class=\"input-with-icon\">\n <input type=\"number\" id=\"tempInput\" value=\"180\" step=\"1\">\n <span class=\"input-icon\">\u00b0C<\/span>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"oven-temperatures\">\n <div class=\"oven-item\">\n <div class=\"oven-value\" id=\"tempCelsius\">180<\/div>\n <div class=\"oven-label\">\u0413\u0440\u0430\u0434\u0443\u0441\u044b \u0426\u0435\u043b\u044c\u0441\u0438\u044f<\/div>\n <\/div>\n <div class=\"oven-item\">\n <div class=\"oven-value\" id=\"tempFahrenheit\">356<\/div>\n <div class=\"oven-label\">\u0413\u0440\u0430\u0434\u0443\u0441\u044b \u0424\u0430\u0440\u0435\u043d\u0433\u0435\u0439\u0442\u0430<\/div>\n <\/div>\n <div class=\"oven-item\">\n <div class=\"oven-value\" id=\"tempGasMark\">4<\/div>\n <div class=\"oven-label\">\u0413\u0430\u0437\u043e\u0432\u0430\u044f \u043c\u0430\u0440\u043a\u0438\u0440\u043e\u0432\u043a\u0430<\/div>\n <\/div>\n <div class=\"oven-item\">\n <div class=\"oven-value\" id=\"tempDescription\">\u0421\u0440\u0435\u0434\u043d\u0438\u0439 \u0436\u0430\u0440<\/div>\n <div class=\"oven-label\">\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435<\/div>\n <\/div>\n <\/div>\n \n <div class=\"info-box\" style=\"margin-top: 20px;\">\n <p><strong>\u041f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0430:<\/strong> \u0414\u043b\u044f \u0442\u043e\u0447\u043d\u043e\u0439 \u0432\u044b\u043f\u0435\u0447\u043a\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0439 \u0442\u0435\u0440\u043c\u043e\u043c\u0435\u0442\u0440. \u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0430 \u043c\u043e\u0436\u0435\u0442 \u043e\u0442\u043b\u0438\u0447\u0430\u0442\u044c\u0441\u044f \u043d\u0430 10-20\u00b0C \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u0434\u0443\u0445\u043e\u0432\u043a\u0430\u0445.<\/p>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"tab-content\" id=\"tab-equivalents\">\n <div class=\"equivalents-grid\">\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u0421\u0430\u0445\u0430\u0440 \u2192 \u041c\u0451\u0434<\/div>\n <div class=\"equivalent-value\">1 \u0441\u0442. \u0441\u0430\u0445\u0430\u0440\u0430 = \u00be \u0441\u0442. \u043c\u0451\u0434\u0430<\/div>\n <div class=\"quick-unit\">\u0423\u043c\u0435\u043d\u044c\u0448\u0438\u0442\u0435 \u0436\u0438\u0434\u043a\u043e\u0441\u0442\u044c \u043d\u0430 \u00bc<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u0421\u043c\u0435\u0442\u0430\u043d\u0430 \u2192 \u0419\u043e\u0433\u0443\u0440\u0442<\/div>\n <div class=\"equivalent-value\">1:1 \u0437\u0430\u043c\u0435\u043d\u0430<\/div>\n <div class=\"quick-unit\">+ 1 \u0447.\u043b. \u0441\u043e\u0434\u044b \u043d\u0430 \u0441\u0442\u0430\u043a\u0430\u043d<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u041f\u0430\u0445\u0442\u0430<\/div>\n <div class=\"equivalent-value\">1 \u0441\u0442. \u043c\u043e\u043b\u043e\u043a\u0430<\/div>\n <div class=\"quick-unit\">+ 1 \u0441\u0442.\u043b. \u043b\u0438\u043c\u043e\u043d\u043d\u043e\u0433\u043e \u0441\u043e\u043a\u0430<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u0420\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c \u2192 \u0421\u043e\u0434\u0430<\/div>\n <div class=\"equivalent-value\">1 \u0447.\u043b. = \u00bc \u0447.\u043b. \u0441\u043e\u0434\u044b<\/div>\n <div class=\"quick-unit\">+ \u043a\u0438\u0441\u043b\u043e\u0442\u0430 (\u0443\u043a\u0441\u0443\u0441, \u043b\u0438\u043c\u043e\u043d)<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u041c\u0430\u0441\u043b\u043e \u2192 \u041c\u0430\u0440\u0433\u0430\u0440\u0438\u043d<\/div>\n <div class=\"equivalent-value\">1:1 \u0437\u0430\u043c\u0435\u043d\u0430<\/div>\n <div class=\"quick-unit\">\u0414\u043b\u044f \u0432\u044b\u043f\u0435\u0447\u043a\u0438<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u042f\u0439\u0446\u043e \u043a\u0443\u0440\u0438\u043d\u043e\u0435<\/div>\n <div class=\"equivalent-value\">1 \u044f\u0439\u0446\u043e = 50 \u0433<\/div>\n <div class=\"quick-unit\">\u044f\u0431\u043b\u043e\u0447\u043d\u043e\u0433\u043e \u043f\u044e\u0440\u0435 \u0438\u043b\u0438 \u0431\u0430\u043d\u0430\u043d\u0430<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u0421\u043b\u0438\u0432\u043a\u0438 20%<\/div>\n <div class=\"equivalent-value\">1 \u0441\u0442. \u043c\u043e\u043b\u043e\u043a\u0430<\/div>\n <div class=\"quick-unit\">+ 2 \u0441\u0442.\u043b. \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430<\/div>\n <\/div>\n <div class=\"equivalent-card\">\n <div class=\"equivalent-title\">\u0422\u0432\u043e\u0440\u043e\u0433<\/div>\n <div class=\"equivalent-value\">100 \u0433 = 100 \u0433<\/div>\n <div class=\"quick-unit\">\u0439\u043e\u0433\u0443\u0440\u0442\u0430 \u0438\u043b\u0438 \u043a\u0435\u0444\u0438\u0440\u0430<\/div>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"action-buttons\">\n <button class=\"action-btn btn-primary\" id=\"calculateBtn\">\n <i class=\"fas fa-calculator\"><\/i> \u0420\u0430\u0441\u0441\u0447\u0438\u0442\u0430\u0442\u044c\n <\/button>\n <button class=\"action-btn btn-secondary\" id=\"resetBtn\">\n <i class=\"fas fa-redo\"><\/i> \u0421\u0431\u0440\u043e\u0441\u0438\u0442\u044c\n <\/button>\n <button class=\"action-btn btn-secondary\" id=\"copyBtn\">\n <i class=\"far fa-copy\"><\/i> \u041a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c\n <\/button>\n <\/div>\n <\/div>\n \n <div class=\"calculator-card info-section\">\n <h2 class=\"section-title\">\n <i class=\"fas fa-info-circle\"><\/i> \u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u0430\u044f \u0441\u043f\u0440\u0430\u0432\u043a\u0430\n <\/h2>\n \n <div class=\"info-box\">\n <p><strong>\u0422\u043e\u0447\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435:<\/strong> \u0412\u0441\u0435 \u043a\u043e\u044d\u0444\u0444\u0438\u0446\u0438\u0435\u043d\u0442\u044b \u043e\u0441\u043d\u043e\u0432\u0430\u043d\u044b \u043d\u0430 \u0440\u0435\u0430\u043b\u044c\u043d\u044b\u0445 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f\u0445 \u043f\u043b\u043e\u0442\u043d\u043e\u0441\u0442\u0438 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432. \u041f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c \u043c\u0435\u043d\u0435\u0435 2%.<\/p>\n <\/div>\n \n <div class=\"tips-grid\">\n <div class=\"tip-card\">\n <div class=\"tip-icon\">\n <i class=\"fas fa-weight\"><\/i>\n <\/div>\n <div class=\"tip-title\">\u0422\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u0432\u0435\u0441\u0430<\/div>\n <p>\u0414\u043b\u044f \u043a\u043e\u043d\u0434\u0438\u0442\u0435\u0440\u0441\u043a\u0438\u0445 \u0438\u0437\u0434\u0435\u043b\u0438\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0432\u0435\u0441\u044b. 1 \u0433\u0440\u0430\u043c\u043c \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f \u043c\u043e\u0436\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u044b\u043f\u0435\u0447\u043a\u0438.<\/p>\n <\/div>\n \n <div class=\"tip-card\">\n <div class=\"tip-icon\">\n <i class=\"fas fa-temperature-high\"><\/i>\n <\/div>\n <div class=\"tip-title\">\u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0430 \u0434\u0443\u0445\u043e\u0432\u043a\u0438<\/div>\n <p>\u041f\u0435\u0440\u0435\u0434 \u0432\u044b\u043f\u0435\u0447\u043a\u043e\u0439 \u0440\u0430\u0437\u043e\u0433\u0440\u0435\u0432\u0430\u0439\u0442\u0435 \u0434\u0443\u0445\u043e\u0432\u043a\u0443 15-20 \u043c\u0438\u043d\u0443\u0442. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0442\u0435\u0440\u043c\u043e\u043c\u0435\u0442\u0440 \u0434\u043b\u044f \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044f \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u044b.<\/p>\n <\/div>\n \n <div class=\"tip-card\">\n <div class=\"tip-icon\">\n <i class=\"fas fa-vial\"><\/i>\n <\/div>\n <div class=\"tip-title\">\u041f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0432\u044b\u043f\u0435\u0447\u043a\u0438<\/div>\n <p>\u0413\u043e\u0442\u043e\u0432\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0439\u0442\u0435 \u0434\u0435\u0440\u0435\u0432\u044f\u043d\u043d\u043e\u0439 \u0448\u043f\u0430\u0436\u043a\u043e\u0439. \u0415\u0441\u043b\u0438 \u0442\u0435\u0441\u0442\u043e \u043d\u0435 \u043f\u0440\u0438\u043b\u0438\u043f\u0430\u0435\u0442 — \u0433\u043e\u0442\u043e\u0432\u043e. \u0414\u0430\u0439\u0442\u0435 \u043e\u0441\u0442\u044b\u0442\u044c 10 \u043c\u0438\u043d\u0443\u0442 \u043f\u0435\u0440\u0435\u0434 \u043d\u0430\u0440\u0435\u0437\u043a\u043e\u0439.<\/p>\n <\/div>\n \n <div class=\"tip-card\">\n <div class=\"tip-icon\">\n <i class=\"fas fa-cookie-bite\"><\/i>\n <\/div>\n <div class=\"tip-title\">\u0421\u043e\u0432\u0435\u0442\u044b \u043f\u043e \u043c\u0443\u043a\u0435<\/div>\n <p>\u041c\u0443\u043a\u0430 \u0440\u0430\u0437\u043d\u043e\u0439 \u043c\u0430\u0440\u043a\u0438 \u0438\u043c\u0435\u0435\u0442 \u0440\u0430\u0437\u043d\u0443\u044e \u0432\u043b\u0430\u0436\u043d\u043e\u0441\u0442\u044c. \u041f\u0440\u043e\u0441\u0435\u0438\u0432\u0430\u0439\u0442\u0435 \u043c\u0443\u043a\u0443 \u043f\u0435\u0440\u0435\u0434 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u0434\u043b\u044f \u043d\u0430\u0441\u044b\u0449\u0435\u043d\u0438\u044f \u043a\u0438\u0441\u043b\u043e\u0440\u043e\u0434\u043e\u043c.<\/p>\n <\/div>\n <\/div>\n \n <div class=\"history-timeline\">\n <div class=\"history-item\">\n <div class=\"history-period\">\u0414\u0440\u0435\u0432\u043d\u0438\u0439 \u043c\u0438\u0440<\/div>\n <div class=\"history-description\">\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 \u043c\u0435\u0440\u044b \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0447\u0430\u0441\u0442\u0435\u0439 \u0442\u0435\u043b\u0430: \u0433\u043e\u0440\u0441\u0442\u044c, \u043f\u0440\u0438\u0433\u043e\u0440\u0448\u043d\u044f, \u0449\u0435\u043f\u043e\u0442\u043a\u0430. \u041c\u0435\u0440\u0430 «\u0441\u0442\u0430\u043a\u0430\u043d» \u043f\u0440\u043e\u0438\u0437\u043e\u0448\u043b\u0430 \u043e\u0442 \u043e\u0431\u044b\u0447\u043d\u043e\u0439 \u043f\u0438\u0442\u044c\u0435\u0432\u043e\u0439 \u0447\u0430\u0448\u043a\u0438.<\/div>\n <\/div>\n \n <div class=\"history-item\">\n <div class=\"history-period\">18-19 \u0432\u0435\u043a\u0430<\/div>\n <div class=\"history-description\">\u041f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u043c\u0435\u0440: \u0447\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430 (5\u043c\u043b), \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430 (15\u043c\u043b). \u0420\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u043a\u043e\u043d\u0434\u0438\u0442\u0435\u0440\u0441\u043a\u043e\u0433\u043e \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u0430 \u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043b\u043e \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u0438.<\/div>\n <\/div>\n <div class=\"history-item\">\n <div class=\"history-period\">20 \u0432\u0435\u043a<\/div>\n <div class=\"history-period\">20 \u0432\u0435\u043a<\/div>\n <div class=\"history-description\">\u0420\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u043c\u0435\u0440\u043d\u044b\u0445 \u0441\u0442\u0430\u043a\u0430\u043d\u043e\u0432 \u0438 \u043b\u043e\u0436\u0435\u043a. \u041f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0445 \u0432\u0435\u0441\u043e\u0432. \u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u0438\u0437\u0430\u0446\u0438\u044f \u0440\u0435\u0446\u0435\u043f\u0442\u043e\u0432.<\/div>\n <\/div>\n \n <div class=\"history-item\">\n <div class=\"history-period\">21 \u0432\u0435\u043a<\/div>\n <div class=\"history-description\">\u0426\u0438\u0444\u0440\u043e\u0432\u044b\u0435 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b, \u0443\u043c\u043d\u044b\u0435 \u0442\u0435\u0440\u043c\u043e\u043c\u0435\u0442\u0440\u044b, \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0441 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440\u0430\u043c\u0438 \u043c\u0435\u0440.<\/div>\n <\/div>\n <\/div>\n \n <h3 style=\"color: #5d4037; margin: 30px 0 20px;\">\n <i class=\"fas fa-ruler-combined\"><\/i> \u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0435 \u043c\u0435\u0440\u044b\n <\/h3>\n \n <div class=\"quick-conversions\">\n <div class=\"quick-conversion-item\">\n <div class=\"quick-value\">5 \u043c\u043b<\/div>\n <div class=\"quick-unit\">\u0427\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430<\/div>\n <\/div>\n <div class=\"quick-conversion-item\">\n <div class=\"quick-value\">15 \u043c\u043b<\/div>\n <div class=\"quick-unit\">\u0421\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430<\/div>\n <\/div>\n <div class=\"quick-conversion-item\">\n <div class=\"quick-value\">200 \u043c\u043b<\/div>\n <div class=\"quick-unit\">\u0413\u0440\u0430\u043d\u0435\u043d\u044b\u0439 \u0441\u0442\u0430\u043a\u0430\u043d<\/div>\n <\/div>\n <div class=\"quick-conversion-item\">\n <div class=\"quick-value\">250 \u043c\u043b<\/div>\n <div class=\"quick-unit\">\u0427\u0430\u0439\u043d\u044b\u0439 \u0441\u0442\u0430\u043a\u0430\u043d<\/div>\n <\/div>\n <\/div>\n \n <div class=\"info-box\" style=\"margin-top: 20px;\">\n <p><strong>\u0421\u043e\u0432\u0435\u0442:<\/strong> \u041f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 \u0438\u043d\u043e\u0441\u0442\u0440\u0430\u043d\u043d\u044b\u043c\u0438 \u0440\u0435\u0446\u0435\u043f\u0442\u0430\u043c\u0438 \u043f\u043e\u043c\u043d\u0438\u0442\u0435: 1 \u0430\u043c\u0435\u0440\u0438\u043a\u0430\u043d\u0441\u043a\u0430\u044f \u0447\u0430\u0448\u043a\u0430 = 240 \u043c\u043b, 1 \u0431\u0440\u0438\u0442\u0430\u043d\u0441\u043a\u0430\u044f \u0447\u0430\u0448\u043a\u0430 = 284 \u043c\u043b.<\/p>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"footer\">\n <p>\u00a9 2026 \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 | \u0414\u043b\u044f \u0434\u043e\u043c\u0430\u0448\u043d\u0435\u0439 \u043a\u0443\u0445\u043d\u0438 \u0438 \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0445 \u043f\u043e\u0432\u0430\u0440\u043e\u0432<\/p>\n <\/div>\n <\/div>\n\n <script>\n (function() {\n console.log('=== \u041a\u0423\u041b\u0418\u041d\u0410\u0420\u041d\u042b\u0419 \u041a\u041e\u041d\u0412\u0415\u0420\u0422\u0415\u0420 \u0417\u0410\u0413\u0420\u0423\u0416\u0410\u0415\u0422\u0421\u042f ===');\n \n let calculatorInitialized = false;\n let currentProduct = '\u043c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f';\n let currentTab = 'volume';\n \n \/\/ \u0420\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u043d\u0430\u044f \u0431\u0430\u0437\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432 \u0441 \u0442\u043e\u0447\u043d\u044b\u043c\u0438 \u0434\u0430\u043d\u043d\u044b\u043c\u0438 (\u0433\/\u043c\u043b)\n const productDensity = {\n \/\/ \u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b (\u043f\u0435\u0440\u0432\u044b\u0435 9)\n '\u043c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f': { \n \u0433\u0440\u0430\u043c\u043c: 1, \n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 130, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 160, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 10, \n \u0447\u0430\u0439\u043d\u0430\u044f: 3, \n \u0447\u0430\u0448\u043a\u0430_us: 120, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.57,\n \u043b\u0438\u0442\u0440: 570\n },\n '\u0441\u0430\u0445\u0430\u0440': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 180, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 225, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 20, \n \u0447\u0430\u0439\u043d\u0430\u044f: 7, \n \u0447\u0430\u0448\u043a\u0430_us: 200, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.85,\n \u043b\u0438\u0442\u0440: 850\n },\n '\u0441\u0430\u0445\u0430\u0440\u043d\u0430\u044f \u043f\u0443\u0434\u0440\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 140, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 175, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 12, \n \u0447\u0430\u0439\u043d\u0430\u044f: 4, \n \u0447\u0430\u0448\u043a\u0430_us: 140, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.56,\n \u043b\u0438\u0442\u0440: 560\n },\n '\u043c\u0430\u0441\u043b\u043e \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0435': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 185, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 230, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 15, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 225, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.96,\n \u043b\u0438\u0442\u0440: 960\n },\n '\u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043c\u0430\u0441\u043b\u043e': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 185, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 230, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 15, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 225, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.92,\n \u043b\u0438\u0442\u0440: 920\n },\n '\u043c\u043e\u043b\u043e\u043a\u043e': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 205, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 255, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 15, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 240, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.03,\n \u043b\u0438\u0442\u0440: 1030\n },\n '\u0432\u043e\u0434\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 200, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 250, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 15, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 236.6, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.00,\n \u043b\u0438\u0442\u0440: 1000\n },\n '\u0440\u0438\u0441': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 185, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 230, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 16, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 185, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.85,\n \u043b\u0438\u0442\u0440: 850\n },\n '\u0433\u0440\u0435\u0447\u043a\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 165, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 205, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 15, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 165, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.76,\n \u043b\u0438\u0442\u0440: 760\n },\n \n \/\/ \u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b (\u0434\u043b\u044f \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0435\u0433\u043e \u0441\u043f\u0438\u0441\u043a\u0430)\n '\u043c\u0443\u043a\u0430 \u0440\u0436\u0430\u043d\u0430\u044f': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 125, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 155, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 10, \n \u0447\u0430\u0439\u043d\u0430\u044f: 3, \n \u0447\u0430\u0448\u043a\u0430_us: 115, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.55,\n \u043b\u0438\u0442\u0440: 550\n },\n '\u043c\u0443\u043a\u0430 \u043a\u0443\u043a\u0443\u0440\u0443\u0437\u043d\u0430\u044f': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 140, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 175, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 12, \n \u0447\u0430\u0439\u043d\u0430\u044f: 4, \n \u0447\u0430\u0448\u043a\u0430_us: 140, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.63,\n \u043b\u0438\u0442\u0440: 630\n },\n '\u043c\u0443\u043a\u0430 \u043e\u0432\u0441\u044f\u043d\u0430\u044f': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 90, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 112, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 8, \n \u0447\u0430\u0439\u043d\u0430\u044f: 3, \n \u0447\u0430\u0448\u043a\u0430_us: 90, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.41,\n \u043b\u0438\u0442\u0440: 410\n },\n '\u043c\u0430\u043d\u043d\u0430\u044f \u043a\u0440\u0443\u043f\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 160, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 200, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 14, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 160, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.74,\n \u043b\u0438\u0442\u0440: 740\n },\n '\u043e\u0432\u0441\u044f\u043d\u044b\u0435 \u0445\u043b\u043e\u043f\u044c\u044f': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 80, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 100, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 7, \n \u0447\u0430\u0439\u043d\u0430\u044f: 2, \n \u0447\u0430\u0448\u043a\u0430_us: 80, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.37,\n \u043b\u0438\u0442\u0440: 370\n },\n '\u043f\u0448\u0435\u043d\u043e': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 175, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 220, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 15, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 175, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.81,\n \u043b\u0438\u0442\u0440: 810\n },\n '\u043f\u0435\u0440\u043b\u043e\u0432\u043a\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 170, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 210, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 14, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 170, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.78,\n \u043b\u0438\u0442\u0440: 780\n },\n '\u043e\u0432\u0441\u044f\u043d\u043a\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 85, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 105, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 7, \n \u0447\u0430\u0439\u043d\u0430\u044f: 2, \n \u0447\u0430\u0448\u043a\u0430_us: 85, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.39,\n \u043b\u0438\u0442\u0440: 390\n },\n '\u043c\u0435\u0434': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 285, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 355, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 25, \n \u0447\u0430\u0439\u043d\u0430\u044f: 8, \n \u0447\u0430\u0448\u043a\u0430_us: 340, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.42,\n \u043b\u0438\u0442\u0440: 1420\n },\n '\u0441\u043c\u0435\u0442\u0430\u043d\u0430 20%': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 210, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 260, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 20, \n \u0447\u0430\u0439\u043d\u0430\u044f: 7, \n \u0447\u0430\u0448\u043a\u0430_us: 250, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.05,\n \u043b\u0438\u0442\u0440: 1050\n },\n '\u0442\u0432\u043e\u0440\u043e\u0433': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 220, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 275, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 18, \n \u0447\u0430\u0439\u043d\u0430\u044f: 6, \n \u0447\u0430\u0448\u043a\u0430_us: 220, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.10,\n \u043b\u0438\u0442\u0440: 1100\n },\n '\u0439\u043e\u0433\u0443\u0440\u0442': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 210, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 260, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 18, \n \u0447\u0430\u0439\u043d\u0430\u044f: 6, \n \u0447\u0430\u0448\u043a\u0430_us: 240, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.05,\n \u043b\u0438\u0442\u0440: 1050\n },\n '\u043a\u0430\u043a\u0430\u043e \u043f\u043e\u0440\u043e\u0448\u043e\u043a': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 100, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 125, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 9, \n \u0447\u0430\u0439\u043d\u0430\u044f: 3, \n \u0447\u0430\u0448\u043a\u0430_us: 100, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.46,\n \u043b\u0438\u0442\u0440: 460\n },\n '\u043a\u043e\u0444\u0435 \u043c\u043e\u043b\u043e\u0442\u044b\u0439': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 70, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 85, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 6, \n \u0447\u0430\u0439\u043d\u0430\u044f: 2, \n \u0447\u0430\u0448\u043a\u0430_us: 70, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.32,\n \u043b\u0438\u0442\u0440: 320\n },\n '\u0441\u043e\u043b\u044c': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 240, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 300, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 25, \n \u0447\u0430\u0439\u043d\u0430\u044f: 8, \n \u0447\u0430\u0448\u043a\u0430_us: 280, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 1.20,\n \u043b\u0438\u0442\u0440: 1200\n },\n '\u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 120, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 150, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 10, \n \u0447\u0430\u0439\u043d\u0430\u044f: 3, \n \u0447\u0430\u0448\u043a\u0430_us: 120, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.55,\n \u043b\u0438\u0442\u0440: 550\n },\n '\u0441\u043e\u0434\u0430': { \n \u0433\u0440\u0430\u043c\u043c: 1,\n \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c: 1000,\n \u0441\u0442\u0430\u043a\u0430\u043d_200: 160, \n \u0441\u0442\u0430\u043a\u0430\u043d_250: 200, \n \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f: 14, \n \u0447\u0430\u0439\u043d\u0430\u044f: 5, \n \u0447\u0430\u0448\u043a\u0430_us: 160, \n \u0443\u043d\u0446\u0438\u044f: 28.35,\n \u0444\u0443\u043d\u0442: 453.59,\n \u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440: 0.74,\n \u043b\u0438\u0442\u0440: 740\n }\n };\n \n \/\/ \u041a\u043e\u044d\u0444\u0444\u0438\u0446\u0438\u0435\u043d\u0442\u044b \u0434\u043b\u044f \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438\n const ounceToGram = 28.35;\n const poundToGram = 453.59;\n \n function initializeCalculator() {\n if (calculatorInitialized) return;\n calculatorInitialized = true;\n \n console.log('\u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440\u0430...');\n \n try {\n initCulinaryConverter();\n console.log('\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d');\n \n \/\/ \u041f\u0435\u0440\u0432\u044b\u0439 \u0440\u0430\u0441\u0447\u0435\u0442\n setTimeout(updateAll, 100);\n \n } catch (error) {\n console.error('\u041e\u0448\u0438\u0431\u043a\u0430 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438:', error);\n calculatorInitialized = false;\n }\n }\n \n function initCulinaryConverter() {\n console.log('\u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440\u0430...');\n \n \/\/ \u041f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b\n const elements = {\n inputValue: document.getElementById('inputValue'),\n fromUnit: document.getElementById('fromUnit'),\n toUnit: document.getElementById('toUnit'),\n resultValue: document.getElementById('resultValue'),\n resultUnit: document.getElementById('resultUnit'),\n swapButton: document.getElementById('swapUnits'),\n calculateBtn: document.getElementById('calculateBtn'),\n resetBtn: document.getElementById('resetBtn'),\n copyBtn: document.getElementById('copyBtn'),\n tempInput: document.getElementById('tempInput'),\n tempCelsius: document.getElementById('tempCelsius'),\n tempFahrenheit: document.getElementById('tempFahrenheit'),\n tempGasMark: document.getElementById('tempGasMark'),\n tempDescription: document.getElementById('tempDescription'),\n customProductInput: document.getElementById('customProductInput'),\n customProductDropdown: document.getElementById('customProductDropdown'),\n \/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u044b\u0445 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0439\n quickGram: document.getElementById('quickGram'),\n quickGlass200: document.getElementById('quickGlass200'),\n quickGlass250: document.getElementById('quickGlass250'),\n quickSpoon: document.getElementById('quickSpoon')\n };\n \n \/\/ \u041d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0435\u0434\u0438\u043d\u0438\u0446\n const unitNames = {\n '\u0433\u0440\u0430\u043c\u043c': ['\u0433\u0440\u0430\u043c\u043c', '\u0433\u0440\u0430\u043c\u043c\u0430', '\u0433\u0440\u0430\u043c\u043c\u043e\u0432'],\n '\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c': ['\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c', '\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430', '\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u043e\u0432'],\n '\u0441\u0442\u0430\u043a\u0430\u043d_200': ['\u0441\u0442\u0430\u043a\u0430\u043d (200\u043c\u043b)', '\u0441\u0442\u0430\u043a\u0430\u043d\u0430 (200\u043c\u043b)', '\u0441\u0442\u0430\u043a\u0430\u043d\u043e\u0432 (200\u043c\u043b)'],\n '\u0441\u0442\u0430\u043a\u0430\u043d_250': ['\u0441\u0442\u0430\u043a\u0430\u043d (250\u043c\u043b)', '\u0441\u0442\u0430\u043a\u0430\u043d\u0430 (250\u043c\u043b)', '\u0441\u0442\u0430\u043a\u0430\u043d\u043e\u0432 (250\u043c\u043b)'],\n '\u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f': ['\u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430', '\u0441\u0442\u043e\u043b\u043e\u0432\u044b\u0435 \u043b\u043e\u0436\u043a\u0438', '\u0441\u0442\u043e\u043b\u043e\u0432\u044b\u0445 \u043b\u043e\u0436\u0435\u043a'],\n '\u0447\u0430\u0439\u043d\u0430\u044f': ['\u0447\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430', '\u0447\u0430\u0439\u043d\u044b\u0435 \u043b\u043e\u0436\u043a\u0438', '\u0447\u0430\u0439\u043d\u044b\u0445 \u043b\u043e\u0436\u0435\u043a'],\n '\u0447\u0430\u0448\u043a\u0430_us': ['\u0447\u0430\u0448\u043a\u0430 (240\u043c\u043b)', '\u0447\u0430\u0448\u043a\u0438 (240\u043c\u043b)', '\u0447\u0430\u0448\u0435\u043a (240\u043c\u043b)'],\n '\u0443\u043d\u0446\u0438\u044f': ['\u0443\u043d\u0446\u0438\u044f', '\u0443\u043d\u0446\u0438\u0438', '\u0443\u043d\u0446\u0438\u0439'],\n '\u0444\u0443\u043d\u0442': ['\u0444\u0443\u043d\u0442', '\u0444\u0443\u043d\u0442\u0430', '\u0444\u0443\u043d\u0442\u043e\u0432'],\n '\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440': ['\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440', '\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440\u0430', '\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440\u043e\u0432'],\n '\u043b\u0438\u0442\u0440': ['\u043b\u0438\u0442\u0440', '\u043b\u0438\u0442\u0440\u0430', '\u043b\u0438\u0442\u0440\u043e\u0432']\n };\n \n \/\/ \u041d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432\n const productNames = {\n '\u043c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f': ['\u043c\u0443\u043a\u0438 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u043e\u0439', '\u043c\u0443\u043a\u0438 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u043e\u0439', '\u043c\u0443\u043a\u0438 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u043e\u0439'],\n '\u0441\u0430\u0445\u0430\u0440': ['\u0441\u0430\u0445\u0430\u0440\u0430', '\u0441\u0430\u0445\u0430\u0440\u0430', '\u0441\u0430\u0445\u0430\u0440\u0430'],\n '\u0441\u0430\u0445\u0430\u0440\u043d\u0430\u044f \u043f\u0443\u0434\u0440\u0430': ['\u0441\u0430\u0445\u0430\u0440\u043d\u043e\u0439 \u043f\u0443\u0434\u0440\u044b', '\u0441\u0430\u0445\u0430\u0440\u043d\u043e\u0439 \u043f\u0443\u0434\u0440\u044b', '\u0441\u0430\u0445\u0430\u0440\u043d\u043e\u0439 \u043f\u0443\u0434\u0440\u044b'],\n '\u043c\u0430\u0441\u043b\u043e \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0435': ['\u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430', '\u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430', '\u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430'],\n '\u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043c\u0430\u0441\u043b\u043e': ['\u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430', '\u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430', '\u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u0430\u0441\u043b\u0430'],\n '\u043c\u043e\u043b\u043e\u043a\u043e': ['\u043c\u043e\u043b\u043e\u043a\u0430', '\u043c\u043e\u043b\u043e\u043a\u0430', '\u043c\u043e\u043b\u043e\u043a\u0430'],\n '\u0432\u043e\u0434\u0430': ['\u0432\u043e\u0434\u044b', '\u0432\u043e\u0434\u044b', '\u0432\u043e\u0434\u044b'],\n '\u0440\u0438\u0441': ['\u0440\u0438\u0441\u0430', '\u0440\u0438\u0441\u0430', '\u0440\u0438\u0441\u0430'],\n '\u0433\u0440\u0435\u0447\u043a\u0430': ['\u0433\u0440\u0435\u0447\u043a\u0438', '\u0433\u0440\u0435\u0447\u043a\u0438', '\u0433\u0440\u0435\u0447\u043a\u0438'],\n '\u043c\u0443\u043a\u0430 \u0440\u0436\u0430\u043d\u0430\u044f': ['\u0440\u0436\u0430\u043d\u043e\u0439 \u043c\u0443\u043a\u0438', '\u0440\u0436\u0430\u043d\u043e\u0439 \u043c\u0443\u043a\u0438', '\u0440\u0436\u0430\u043d\u043e\u0439 \u043c\u0443\u043a\u0438'],\n '\u043c\u0443\u043a\u0430 \u043a\u0443\u043a\u0443\u0440\u0443\u0437\u043d\u0430\u044f': ['\u043a\u0443\u043a\u0443\u0440\u0443\u0437\u043d\u043e\u0439 \u043c\u0443\u043a\u0438', '\u043a\u0443\u043a\u0443\u0440\u0443\u0437\u043d\u043e\u0439 \u043c\u0443\u043a\u0438', '\u043a\u0443\u043a\u0443\u0440\u0443\u0437\u043d\u043e\u0439 \u043c\u0443\u043a\u0438'],\n '\u043c\u0443\u043a\u0430 \u043e\u0432\u0441\u044f\u043d\u0430\u044f': ['\u043e\u0432\u0441\u044f\u043d\u043e\u0439 \u043c\u0443\u043a\u0438', '\u043e\u0432\u0441\u044f\u043d\u043e\u0439 \u043c\u0443\u043a\u0438', '\u043e\u0432\u0441\u044f\u043d\u043e\u0439 \u043c\u0443\u043a\u0438'],\n '\u043c\u0430\u043d\u043d\u0430\u044f \u043a\u0440\u0443\u043f\u0430': ['\u043c\u0430\u043d\u043d\u043e\u0439 \u043a\u0440\u0443\u043f\u044b', '\u043c\u0430\u043d\u043d\u043e\u0439 \u043a\u0440\u0443\u043f\u044b', '\u043c\u0430\u043d\u043d\u043e\u0439 \u043a\u0440\u0443\u043f\u044b'],\n '\u043e\u0432\u0441\u044f\u043d\u044b\u0435 \u0445\u043b\u043e\u043f\u044c\u044f': ['\u043e\u0432\u0441\u044f\u043d\u044b\u0445 \u0445\u043b\u043e\u043f\u044c\u0435\u0432', '\u043e\u0432\u0441\u044f\u043d\u044b\u0445 \u0445\u043b\u043e\u043f\u044c\u0435\u0432', '\u043e\u0432\u0441\u044f\u043d\u044b\u0445 \u0445\u043b\u043e\u043f\u044c\u0435\u0432'],\n '\u043f\u0448\u0435\u043d\u043e': ['\u043f\u0448\u0435\u043d\u0430', '\u043f\u0448\u0435\u043d\u0430', '\u043f\u0448\u0435\u043d\u0430'],\n '\u043f\u0435\u0440\u043b\u043e\u0432\u043a\u0430': ['\u043f\u0435\u0440\u043b\u043e\u0432\u043a\u0438', '\u043f\u0435\u0440\u043b\u043e\u0432\u043a\u0438', '\u043f\u0435\u0440\u043b\u043e\u0432\u043a\u0438'],\n '\u043e\u0432\u0441\u044f\u043d\u043a\u0430': ['\u043e\u0432\u0441\u044f\u043d\u043a\u0438', '\u043e\u0432\u0441\u044f\u043d\u043a\u0438', '\u043e\u0432\u0441\u044f\u043d\u043a\u0438'],\n '\u043c\u0435\u0434': ['\u043c\u0435\u0434\u0430', '\u043c\u0435\u0434\u0430', '\u043c\u0435\u0434\u0430'],\n '\u0441\u043c\u0435\u0442\u0430\u043d\u0430 20%': ['\u0441\u043c\u0435\u0442\u0430\u043d\u044b', '\u0441\u043c\u0435\u0442\u0430\u043d\u044b', '\u0441\u043c\u0435\u0442\u0430\u043d\u044b'],\n '\u0442\u0432\u043e\u0440\u043e\u0433': ['\u0442\u0432\u043e\u0440\u043e\u0433\u0430', '\u0442\u0432\u043e\u0440\u043e\u0433\u0430', '\u0442\u0432\u043e\u0440\u043e\u0433\u0430'],\n '\u0439\u043e\u0433\u0443\u0440\u0442': ['\u0439\u043e\u0433\u0443\u0440\u0442\u0430', '\u0439\u043e\u0433\u0443\u0440\u0442\u0430', '\u0439\u043e\u0433\u0443\u0440\u0442\u0430'],\n '\u043a\u0430\u043a\u0430\u043e \u043f\u043e\u0440\u043e\u0448\u043e\u043a': ['\u043a\u0430\u043a\u0430\u043e-\u043f\u043e\u0440\u043e\u0448\u043a\u0430', '\u043a\u0430\u043a\u0430\u043e-\u043f\u043e\u0440\u043e\u0448\u043a\u0430', '\u043a\u0430\u043a\u0430\u043e-\u043f\u043e\u0440\u043e\u0448\u043a\u0430'],\n '\u043a\u043e\u0444\u0435 \u043c\u043e\u043b\u043e\u0442\u044b\u0439': ['\u043c\u043e\u043b\u043e\u0442\u043e\u0433\u043e \u043a\u043e\u0444\u0435', '\u043c\u043e\u043b\u043e\u0442\u043e\u0433\u043e \u043a\u043e\u0444\u0435', '\u043c\u043e\u043b\u043e\u0442\u043e\u0433\u043e \u043a\u043e\u0444\u0435'],\n '\u0441\u043e\u043b\u044c': ['\u0441\u043e\u043b\u0438', '\u0441\u043e\u043b\u0438', '\u0441\u043e\u043b\u0438'],\n '\u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c': ['\u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f', '\u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f', '\u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f'],\n '\u0441\u043e\u0434\u0430': ['\u0441\u043e\u0434\u044b', '\u0441\u043e\u0434\u044b', '\u0441\u043e\u0434\u044b']\n };\n \n \/\/ \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u044f \u043e\u0431\u044a\u0435\u043c\u0430\/\u0432\u0435\u0441\u0430\n function convertCulinary(value, from, to, product) {\n if (!productDensity[product]) return value;\n \n \/\/ \u0421\u043d\u0430\u0447\u0430\u043b\u0430 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0438\u0440\u0443\u0435\u043c \u0432 \u0433\u0440\u0430\u043c\u043c\u044b\n let grams;\n \n switch(from) {\n case '\u0433\u0440\u0430\u043c\u043c':\n grams = value;\n break;\n case '\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c':\n grams = value * 1000;\n break;\n case '\u0443\u043d\u0446\u0438\u044f':\n grams = value * ounceToGram;\n break;\n case '\u0444\u0443\u043d\u0442':\n grams = value * poundToGram;\n break;\n case '\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440':\n grams = value * productDensity[product].\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440;\n break;\n case '\u043b\u0438\u0442\u0440':\n grams = value * productDensity[product].\u043b\u0438\u0442\u0440;\n break;\n default:\n \/\/ \u0418\u0437 \u043e\u0431\u044a\u0435\u043c\u043d\u043e\u0439 \u043c\u0435\u0440\u044b \u0432 \u0433\u0440\u0430\u043c\u043c\u044b\n const fromValue = productDensity[product][from];\n if (!fromValue) return value;\n grams = value * fromValue;\n }\n \n \/\/ \u0417\u0430\u0442\u0435\u043c \u0438\u0437 \u0433\u0440\u0430\u043c\u043c\u043e\u0432 \u0432 \u043d\u0443\u0436\u043d\u0443\u044e \u0435\u0434\u0438\u043d\u0438\u0446\u0443\n switch(to) {\n case '\u0433\u0440\u0430\u043c\u043c':\n return grams;\n case '\u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c':\n return grams \/ 1000;\n case '\u0443\u043d\u0446\u0438\u044f':\n return grams \/ ounceToGram;\n case '\u0444\u0443\u043d\u0442':\n return grams \/ poundToGram;\n case '\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440':\n return grams \/ productDensity[product].\u043c\u0438\u043b\u043b\u0438\u043b\u0438\u0442\u0440;\n case '\u043b\u0438\u0442\u0440':\n return grams \/ productDensity[product].\u043b\u0438\u0442\u0440;\n default:\n \/\/ \u0418\u0437 \u0433\u0440\u0430\u043c\u043c\u043e\u0432 \u0432 \u043e\u0431\u044a\u0435\u043c\u043d\u0443\u044e \u043c\u0435\u0440\u0443\n const toValue = productDensity[product][to];\n if (!toValue) return grams;\n return grams \/ toValue;\n }\n }\n \n \/\/ \u0424\u043e\u0440\u043c\u0430\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0447\u0438\u0441\u043b\u0430\n function formatNumber(num) {\n if (num === 0 || isNaN(num)) return '0';\n const absNum = Math.abs(num);\n \n if (absNum >= 1000) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 1 });\n } else if (absNum >= 100) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 1 });\n } else if (absNum >= 10) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 2 });\n } else if (absNum >= 1) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 3 });\n } else {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 4 });\n }\n }\n \n \/\/ \u0424\u043e\u0440\u043c\u0430 \u0441\u043b\u043e\u0432\u0430\n function getUnitForm(result, unitKey, productKey) {\n if (!unitNames[unitKey] || !productNames[productKey]) return '';\n \n const absResult = Math.abs(result);\n \n \/\/ \u0414\u043b\u044f \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0430 1\n if (Math.abs(absResult - 1) < 0.01) {\n return unitNames[unitKey][0] + ' ' + productNames[productKey][0];\n }\n \n \/\/ \u0414\u043b\u044f 2, 3, 4 (\u043d\u043e \u043d\u0435 12, 13, 14)\n const lastDigit = Math.floor(absResult) % 10;\n const lastTwoDigits = Math.floor(absResult) % 100;\n \n var condition1 = lastDigit >= 2;\n var condition2 = lastDigit <= 4;\n var condition3 = lastTwoDigits < 10;\n var condition4 = lastTwoDigits >= 20;\n \n if (condition1 && condition2 && (condition3 || condition4)) {\n return unitNames[unitKey][1] + ' ' + productNames[productKey][1];\n }\n \n return unitNames[unitKey][2] + ' ' + productNames[productKey][2];\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0441\u0435\u0445 \u0434\u0430\u043d\u043d\u044b\u0445 - \u041e\u0421\u041d\u041e\u0412\u041d\u041e\u0419 \u0418\u0421\u041f\u0420\u0410\u0412\u041b\u0415\u041d\u041d\u042b\u0419 \u041c\u0415\u0422\u041e\u0414\n function updateAll() {\n try {\n if (currentTab === 'volume') {\n const value = parseFloat(elements.inputValue.value) || 0;\n const from = elements.fromUnit.value;\n const to = elements.toUnit.value;\n \n const result = convertCulinary(value, from, to, currentProduct);\n \n elements.resultValue.textContent = formatNumber(result);\n elements.resultUnit.textContent = getUnitForm(result, to, currentProduct);\n \n \/\/ \u0412\u0410\u0416\u041d\u041e\u0415 \u0418\u0421\u041f\u0420\u0410\u0412\u041b\u0415\u041d\u0418\u0415: \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0431\u044b\u0441\u0442\u0440\u044b\u0435 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438\n updateQuickConversions(value, from);\n \n \/\/ \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f\n elements.resultValue.classList.remove('pulse');\n void elements.resultValue.offsetWidth;\n elements.resultValue.classList.add('pulse');\n \n } else if (currentTab === 'temperature') {\n updateTemperature();\n }\n \n } catch (error) {\n console.error('\u041e\u0448\u0438\u0431\u043a\u0430 \u043f\u0440\u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0438:', error);\n if (elements.resultValue) {\n elements.resultValue.textContent = '\u041e\u0428\u0418\u0411\u041a\u0410';\n elements.resultUnit.textContent = '';\n }\n }\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0431\u044b\u0441\u0442\u0440\u044b\u0445 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0439 - \u0418\u0421\u041f\u0420\u0410\u0412\u041b\u0415\u041d\u041d\u0410\u042f \u0412\u0415\u0420\u0421\u0418\u042f\n function updateQuickConversions(value, from) {\n \/\/ \u0421\u043f\u0438\u0441\u043e\u043a \u0435\u0434\u0438\u043d\u0438\u0446 \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u044b\u0445 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0439\n const quickUnits = [\n { id: 'quickGram', unit: '\u0433\u0440\u0430\u043c\u043c' },\n { id: 'quickGlass200', unit: '\u0441\u0442\u0430\u043a\u0430\u043d_200' },\n { id: 'quickGlass250', unit: '\u0441\u0442\u0430\u043a\u0430\u043d_250' },\n { id: 'quickSpoon', unit: '\u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f' }\n ];\n \n quickUnits.forEach(item => {\n const element = elements[item.id];\n if (element) {\n const result = convertCulinary(value, from, item.unit, currentProduct);\n element.textContent = formatNumber(result);\n }\n });\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u044b\n function updateTemperature() {\n try {\n const celsius = parseFloat(elements.tempInput.value) || 0;\n \n \/\/ \u0424\u0430\u0440\u0435\u043d\u0433\u0435\u0439\u0442\n const fahrenheit = (celsius * 9\/5) + 32;\n if (elements.tempFahrenheit) {\n elements.tempFahrenheit.textContent = Math.round(fahrenheit);\n }\n \n \/\/ \u0413\u0430\u0437\u043e\u0432\u0430\u044f \u043c\u0430\u0440\u043a\u0438\u0440\u043e\u0432\u043a\u0430\n let gasMark;\n let description;\n \n if (celsius < 110) { gasMark = '\u00bc'; description = '\u041e\u0447\u0435\u043d\u044c \u0441\u043b\u0430\u0431\u044b\u0439'; }\n else if (celsius < 130) { gasMark = '\u00bd'; description = '\u0421\u043b\u0430\u0431\u044b\u0439'; }\n else if (celsius < 140) { gasMark = '1'; description = '\u041e\u0447\u0435\u043d\u044c \u043d\u0438\u0437\u043a\u0438\u0439'; }\n else if (celsius < 150) { gasMark = '2'; description = '\u041d\u0438\u0437\u043a\u0438\u0439'; }\n else if (celsius < 170) { gasMark = '3'; description = '\u0421\u0440\u0435\u0434\u043d\u0438\u0439'; }\n else if (celsius < 180) { gasMark = '4'; description = '\u0421\u0440\u0435\u0434\u043d\u0438\u0439 \u0436\u0430\u0440'; }\n else if (celsius < 190) { gasMark = '5'; description = '\u0423\u043c\u0435\u0440\u0435\u043d\u043d\u044b\u0439 \u0436\u0430\u0440'; }\n else if (celsius < 200) { gasMark = '6'; description = '\u0421\u0440\u0435\u0434\u043d\u0435-\u0441\u0438\u043b\u044c\u043d\u044b\u0439'; }\n else if (celsius < 220) { gasMark = '7'; description = '\u0421\u0438\u043b\u044c\u043d\u044b\u0439 \u0436\u0430\u0440'; }\n else if (celsius < 230) { gasMark = '8'; description = '\u041e\u0447\u0435\u043d\u044c \u0441\u0438\u043b\u044c\u043d\u044b\u0439'; }\n else { gasMark = '9'; description = '\u041c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u0439'; }\n \n if (elements.tempGasMark) {\n elements.tempGasMark.textContent = gasMark;\n }\n \n if (elements.tempDescription) {\n elements.tempDescription.textContent = description;\n }\n \n if (elements.tempCelsius) {\n elements.tempCelsius.textContent = Math.round(celsius);\n }\n \n } catch (error) {\n console.error('\u041e\u0448\u0438\u0431\u043a\u0430 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u044b:', error);\n }\n }\n \n \/\/ \u041f\u043e\u043a\u0430\u0437 \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u044f\n function showToast(message) {\n \/\/ \u0423\u0434\u0430\u043b\u044f\u0435\u043c \u0441\u0442\u0430\u0440\u044b\u0435 \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u044f\n const oldToasts = document.querySelectorAll('.toast');\n oldToasts.forEach(toast => toast.remove());\n \n const toast = document.createElement('div');\n toast.className = 'toast';\n toast.textContent = message;\n document.body.appendChild(toast);\n \n setTimeout(() => {\n toast.style.opacity = '0';\n toast.style.transition = 'opacity 0.3s';\n setTimeout(() => toast.remove(), 300);\n }, 3000);\n }\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0432\u043a\u043b\u0430\u0434\u043e\u043a\n function initTabs() {\n const tabButtons = document.querySelectorAll('.tab-btn');\n const tabContents = document.querySelectorAll('.tab-content');\n \n tabButtons.forEach(button => {\n button.addEventListener('click', function() {\n const tabId = this.getAttribute('data-tab');\n currentTab = tabId;\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0435 \u043a\u043d\u043e\u043f\u043a\u0438\n tabButtons.forEach(btn => btn.classList.remove('active'));\n this.classList.add('active');\n \n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\n tabContents.forEach(content => {\n content.classList.remove('active');\n if (content.id === 'tab-' + tabId) {\n content.classList.add('active');\n }\n });\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0434\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0439 \u0432\u043a\u043b\u0430\u0434\u043a\u0438\n setTimeout(updateAll, 100);\n });\n });\n }\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432 (9 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445)\n function initProductSelector() {\n const productButtons = document.querySelectorAll('.product-btn');\n \n productButtons.forEach(button => {\n button.addEventListener('click', function() {\n const product = this.getAttribute('data-product');\n currentProduct = product;\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0435 \u043a\u043d\u043e\u043f\u043a\u0438\n productButtons.forEach(btn => btn.classList.remove('active'));\n this.classList.add('active');\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0438\u0439 \u0441\u043f\u0438\u0441\u043e\u043a\n elements.customProductInput.textContent = product;\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0440\u0430\u0441\u0447\u0435\u0442\n updateAll();\n \n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u0435\n showToast(`\u0412\u044b\u0431\u0440\u0430\u043d \u043f\u0440\u043e\u0434\u0443\u043a\u0442: ${product}`);\n });\n });\n }\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0435\u0433\u043e \u0441\u043f\u0438\u0441\u043a\u0430 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432\n function initCustomProductSelector() {\n \/\/ \u0417\u0430\u043f\u043e\u043b\u043d\u044f\u0435\u043c \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0438\u0439 \u0441\u043f\u0438\u0441\u043e\u043a\n const dropdown = elements.customProductDropdown;\n dropdown.innerHTML = '';\n \n \/\/ \u0421\u043e\u0431\u0438\u0440\u0430\u0435\u043c \u0432\u0441\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0435 \u0432 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 9\n const allProducts = Object.keys(productDensity);\n const mainProducts = Array.from(document.querySelectorAll('.product-btn'))\n .map(btn => btn.getAttribute('data-product'));\n \n const additionalProducts = allProducts.filter(product => !mainProducts.includes(product));\n \n \/\/ \u0421\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u043c \u043f\u043e \u0430\u043b\u0444\u0430\u0432\u0438\u0442\u0443\n additionalProducts.sort();\n \n \/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0432 \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0438\u0439 \u0441\u043f\u0438\u0441\u043e\u043a\n additionalProducts.forEach(product => {\n const item = document.createElement('div');\n item.className = 'dropdown-item';\n item.textContent = product;\n item.addEventListener('click', function() {\n currentProduct = product;\n elements.customProductInput.textContent = product;\n dropdown.classList.remove('active');\n \n \/\/ \u0421\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 \u043a\u043d\u043e\u043f\u043e\u043a\n document.querySelectorAll('.product-btn').forEach(btn => {\n btn.classList.remove('active');\n });\n \n updateAll();\n showToast(`\u0412\u044b\u0431\u0440\u0430\u043d \u043f\u0440\u043e\u0434\u0443\u043a\u0442: ${product}`);\n });\n dropdown.appendChild(item);\n });\n \n \/\/ \u041e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043a\u043b\u0438\u043a\u0430 \u043d\u0430 \u043f\u043e\u043b\u0435 \u0432\u0432\u043e\u0434\u0430\n elements.customProductInput.addEventListener('click', function() {\n dropdown.classList.toggle('active');\n });\n \n \/\/ \u0417\u0430\u043a\u0440\u044b\u0442\u0438\u0435 \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0435\u0433\u043e \u0441\u043f\u0438\u0441\u043a\u0430 \u043f\u0440\u0438 \u043a\u043b\u0438\u043a\u0435 \u0432\u043d\u0435 \u0435\u0433\u043e\n document.addEventListener('click', function(event) {\n if (!elements.customProductInput.contains(event.target) && \n !dropdown.contains(event.target)) {\n dropdown.classList.remove('active');\n }\n });\n }\n \n \/\/ \u041d\u0430\u0437\u043d\u0430\u0447\u0430\u0435\u043c \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u0441\u043e\u0431\u044b\u0442\u0438\u0439\n if (elements.inputValue) elements.inputValue.addEventListener('input', updateAll);\n if (elements.fromUnit) elements.fromUnit.addEventListener('change', updateAll);\n if (elements.toUnit) elements.toUnit.addEventListener('change', updateAll);\n if (elements.tempInput) elements.tempInput.addEventListener('input', updateTemperature);\n \n \/\/ \u041a\u043d\u043e\u043f\u043a\u0430 \u043e\u0431\u043c\u0435\u043d\u0430\n if (elements.swapButton) {\n elements.swapButton.addEventListener('click', function() {\n const temp = elements.fromUnit.value;\n elements.fromUnit.value = elements.toUnit.value;\n elements.toUnit.value = temp;\n updateAll();\n });\n }\n \n \/\/ \u041a\u043d\u043e\u043f\u043a\u0430 \u0440\u0430\u0441\u0447\u0435\u0442\u0430\n if (elements.calculateBtn) elements.calculateBtn.addEventListener('click', updateAll);\n \n \/\/ \u041a\u043d\u043e\u043f\u043a\u0430 \u0441\u0431\u0440\u043e\u0441\u0430\n if (elements.resetBtn) {\n elements.resetBtn.addEventListener('click', function() {\n if (currentTab === 'volume') {\n elements.inputValue.value = '100';\n elements.fromUnit.value = '\u0433\u0440\u0430\u043c\u043c';\n elements.toUnit.value = '\u0441\u0442\u0430\u043a\u0430\u043d_200';\n currentProduct = '\u043c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f';\n \n \/\/ \u0421\u0431\u0440\u043e\u0441 \u043a\u043d\u043e\u043f\u043e\u043a \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430\n document.querySelectorAll('.product-btn').forEach(btn => {\n btn.classList.remove('active');\n if (btn.getAttribute('data-product') === '\u043c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f') {\n btn.classList.add('active');\n }\n });\n \n \/\/ \u0421\u0431\u0440\u043e\u0441 \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0435\u0433\u043e \u0441\u043f\u0438\u0441\u043a\u0430\n elements.customProductInput.textContent = '\u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u0438\u0437 \u0441\u043f\u0438\u0441\u043a\u0430...';\n \n updateAll();\n \n } else if (currentTab === 'temperature') {\n elements.tempInput.value = '180';\n updateTemperature();\n }\n \n \/\/ \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u043a\u043d\u043e\u043f\u043a\u0438\n const originalHTML = this.innerHTML;\n this.innerHTML = '<i class=\"fas fa-check\"><\/i> \u0421\u0431\u0440\u043e\u0448\u0435\u043d\u043e!';\n this.style.background = '#27ae60';\n setTimeout(() => {\n this.innerHTML = originalHTML;\n this.style.background = '';\n }, 1500);\n \n showToast('\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0441\u0431\u0440\u043e\u0448\u0435\u043d\u044b');\n });\n }\n \n \/\/ \u041a\u043d\u043e\u043f\u043a\u0430 \u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f\n if (elements.copyBtn) {\n elements.copyBtn.addEventListener('click', function() {\n let text = '';\n \n if (currentTab === 'volume') {\n text = elements.resultValue.textContent + ' ' + elements.resultUnit.textContent;\n } else if (currentTab === 'temperature') {\n text = `\u0414\u0443\u0445\u043e\u0432\u043a\u0430: ${elements.tempCelsius.textContent}\u00b0C \/ ${elements.tempFahrenheit.textContent}\u00b0F \/ \u0413\u0430\u0437 ${elements.tempGasMark.textContent}`\n } else {\n text = '\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440';\n }\n \n if (navigator.clipboard && navigator.clipboard.writeText) {\n navigator.clipboard.writeText(text).then(() => {\n const originalHTML = this.innerHTML;\n this.innerHTML = '<i class=\"fas fa-check\"><\/i> \u0421\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u043e!';\n this.style.background = '#27ae60';\n setTimeout(() => {\n this.innerHTML = originalHTML;\n this.style.background = '';\n }, 1500);\n showToast('\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d');\n });\n } else {\n const textArea = document.createElement('textarea');\n textArea.value = text;\n document.body.appendChild(textArea);\n textArea.select();\n try {\n document.execCommand('copy');\n const originalHTML = this.innerHTML;\n this.innerHTML = '<i class=\"fas fa-check\"><\/i> \u0421\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u043e!';\n this.style.background = '#27ae60';\n setTimeout(() => {\n this.innerHTML = originalHTML;\n this.style.background = '';\n }, 1500);\n showToast('\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d');\n } catch (err) {\n showToast('\u041d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c');\n }\n document.body.removeChild(textArea);\n }\n });\n }\n \n \/\/ \u0411\u044b\u0441\u0442\u0440\u044b\u0435 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438 - \u0418\u0421\u041f\u0420\u0410\u0412\u041b\u0415\u041d\u041d\u042b\u0419 \u041e\u0411\u0420\u0410\u0411\u041e\u0422\u0427\u0418\u041a \u0421\u041e\u0411\u042b\u0422\u0418\u0419\n document.querySelectorAll('.quick-conversion-item').forEach(item => {\n item.addEventListener('click', function() {\n if (currentTab !== 'volume') return;\n \n const targetUnit = this.getAttribute('data-unit');\n const quickValueElement = this.querySelector('.quick-value');\n \n if (targetUnit && quickValueElement) {\n \/\/ \u041f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0438\u0437 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440\u0430\n const value = parseFloat(elements.inputValue.value) || 0;\n const from = elements.fromUnit.value;\n \n \/\/ \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0438\u0440\u0443\u0435\u043c \u0432 \u0446\u0435\u043b\u0435\u0432\u0443\u044e \u0435\u0434\u0438\u043d\u0438\u0446\u0443\n const result = convertCulinary(value, from, targetUnit, currentProduct);\n const formattedResult = formatNumber(result);\n \n \/\/ \u0421\u043e\u0437\u0434\u0430\u0435\u043c \u0442\u0435\u043a\u0441\u0442 \u0434\u043b\u044f \u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f\n const unitForm = getUnitForm(result, targetUnit, currentProduct);\n const text = `${formattedResult} ${unitForm}`;\n \n if (navigator.clipboard && navigator.clipboard.writeText) {\n navigator.clipboard.writeText(text).then(() => {\n \/\/ \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0438 \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u0435\n this.classList.add('active');\n setTimeout(() => this.classList.remove('active'), 1000);\n \n const unitName = unitNames[targetUnit] ? unitNames[targetUnit][2] : targetUnit;\n showToast(`\u0421\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u043e: ${formattedResult} ${unitName}`);\n });\n } else {\n \/\/ Fallback \u0434\u043b\u044f \u0441\u0442\u0430\u0440\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432\n const textArea = document.createElement('textarea');\n textArea.value = text;\n document.body.appendChild(textArea);\n textArea.select();\n try {\n document.execCommand('copy');\n this.classList.add('active');\n setTimeout(() => this.classList.remove('active'), 1000);\n \n const unitName = unitNames[targetUnit] ? unitNames[targetUnit][2] : targetUnit;\n showToast(`\u0421\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u043e: ${formattedResult} ${unitName}`);\n } catch (err) {\n showToast('\u041d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c');\n }\n document.body.removeChild(textArea);\n }\n }\n });\n });\n \n \/\/ \u042d\u043a\u0432\u0438\u0432\u0430\u043b\u0435\u043d\u0442\u044b \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432\n document.querySelectorAll('.equivalent-card').forEach(card => {\n card.addEventListener('click', function() {\n const title = this.querySelector('.equivalent-title').textContent;\n const value = this.querySelector('.equivalent-value').textContent;\n \n let text = title + ': ' + value;\n const unit = this.querySelector('.quick-unit');\n if (unit) {\n text += ' (' + unit.textContent + ')';\n }\n \n if (navigator.clipboard && navigator.clipboard.writeText) {\n navigator.clipboard.writeText(text).then(() => {\n showToast('\u042d\u043a\u0432\u0438\u0432\u0430\u043b\u0435\u043d\u0442 \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d');\n });\n } else {\n const textArea = document.createElement('textarea');\n textArea.value = text;\n document.body.appendChild(textArea);\n textArea.select();\n try {\n document.execCommand('copy');\n showToast('\u042d\u043a\u0432\u0438\u0432\u0430\u043b\u0435\u043d\u0442 \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d');\n } catch (err) {\n showToast('\u041d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c');\n }\n document.body.removeChild(textArea);\n }\n });\n });\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f\n initTabs();\n initProductSelector();\n initCustomProductSelector();\n \n \/\/ \u0412\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u043c \u043f\u0435\u0440\u0432\u043e\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u044b\u0439 \u0440\u0430\u0441\u0447\u0435\u0442\n setTimeout(() => {\n updateAll();\n updateTemperature();\n }, 100);\n \n return {\n elements: elements,\n convertCulinary: convertCulinary,\n updateAll: updateAll\n };\n }\n \n \/\/ \u0417\u0430\u043f\u0443\u0441\u043a \u043f\u0440\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0441\u043e\u0431\u044b\u0442\u0438\u044f\u0445\n if (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', initializeCalculator);\n } else {\n initializeCalculator();\n }\n \n window.addEventListener('load', initializeCalculator);\n setTimeout(initializeCalculator, 3000);\n \n \/\/ \u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438\n window.reloadCulinaryConverter = function() {\n calculatorInitialized = false;\n initializeCalculator();\n showToast('\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d');\n };\n \n })();\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<!DOCTYPE html>\n<html lang=\"ru\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u0430\u044f \u044d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u044f<\/title>\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n }\n \n body {\n background: linear-gradient(135deg, #ff9a9e 0%, #fad0c4 100%);\n color: #333;\n line-height: 1.6;\n min-height: 100vh;\n padding: 20px;\n }\n \n .container {\n max-width: 1400px;\n margin: 0 auto;\n padding: 0 15px;\n }\n \n .header {\n text-align: center;\n margin-bottom: 40px;\n color: #5d4037;\n text-shadow: 0 2px 5px rgba(0,0,0,0.1);\n }\n \n .header h1 {\n font-size: 2.8rem;\n margin-bottom: 15px;\n }\n \n .header p {\n font-size: 1.2rem;\n opacity: 0.9;\n max-width: 800px;\n margin: 0 auto;\n color: #795548;\n }\n \n .main-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 30px;\n margin-bottom: 40px;\n }\n \n @media (max-width: 1100px) {\n .main-grid {\n grid-template-columns: 1fr;\n }\n }\n \n \/* \u041e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0431\u043b\u043e\u043a \u044d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u0438 *\/\n .encyclopedia-section {\n background: linear-gradient(135deg, #ffcc80 0%, #ffb74d 100%);\n color: #5d4037;\n border-radius: 25px;\n padding: 35px;\n box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);\n transition: all 0.4s ease;\n position: relative;\n overflow: hidden;\n }\n \n .encyclopedia-section:hover {\n transform: translateY(-5px);\n box-shadow: 0 25px 60px rgba(0, 0, 0, 0.2);\n }\n \n .section-title {\n color: #5d4037;\n margin-bottom: 25px;\n display: flex;\n align-items: center;\n gap: 15px;\n font-size: 1.8rem;\n position: relative;\n z-index: 2;\n }\n \n .section-title i {\n color: #ff7043;\n }\n \n \/* \u0418\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0435 \u043a\u0430\u0440\u0442\u043e\u0447\u043a\u0438 *\/\n .interactive-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n gap: 20px;\n margin-top: 30px;\n position: relative;\n z-index: 2;\n }\n \n .interactive-card {\n background: rgba(255, 255, 255, 0.9);\n backdrop-filter: blur(10px);\n border-radius: 20px;\n padding: 25px;\n border: 1px solid rgba(255, 112, 67, 0.2);\n transition: all 0.4s ease;\n cursor: pointer;\n position: relative;\n overflow: hidden;\n }\n \n .interactive-card:hover {\n transform: translateY(-8px);\n background: rgba(255, 255, 255, 1);\n box-shadow: 0 15px 35px rgba(255, 112, 67, 0.15);\n }\n \n .interactive-card::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 4px;\n background: linear-gradient(90deg, #ff7043, #ffb74d);\n }\n \n .card-icon {\n font-size: 2.5rem;\n color: #ff7043;\n margin-bottom: 20px;\n transition: transform 0.3s ease;\n }\n \n .interactive-card:hover .card-icon {\n transform: scale(1.1);\n }\n \n .card-title {\n font-size: 1.3rem;\n font-weight: 700;\n margin-bottom: 15px;\n color: #5d4037;\n }\n \n .card-content {\n font-size: 0.95rem;\n line-height: 1.5;\n color: #666;\n margin-bottom: 15px;\n }\n \n .external-links {\n display: flex;\n flex-wrap: wrap;\n gap: 10px;\n margin-top: 20px;\n }\n \n .ext-link {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n padding: 8px 16px;\n background: rgba(255, 112, 67, 0.1);\n border-radius: 50px;\n text-decoration: none;\n color: #ff7043;\n font-size: 0.85rem;\n transition: all 0.3s ease;\n border: 1px solid rgba(255, 112, 67, 0.2);\n }\n \n .ext-link:hover {\n background: rgba(255, 112, 67, 0.2);\n color: #e64a19;\n transform: translateY(-2px);\n box-shadow: 0 5px 15px rgba(255, 112, 67, 0.1);\n }\n \n .ext-link i {\n font-size: 0.8rem;\n }\n \n \/* \u0418\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u0430\u044f \u0442\u0430\u0431\u043b\u0438\u0446\u0430 *\/\n .info-table {\n width: 100%;\n background: rgba(255, 255, 255, 0.9);\n border-radius: 15px;\n overflow: hidden;\n margin: 25px 0;\n border: 1px solid rgba(255, 112, 67, 0.2);\n }\n \n .table-header {\n background: rgba(255, 112, 67, 0.15);\n padding: 15px;\n display: flex;\n justify-content: space-between;\n font-weight: 700;\n color: #5d4037;\n }\n \n .table-row {\n display: flex;\n justify-content: space-between;\n padding: 12px 15px;\n border-bottom: 1px solid rgba(255, 112, 67, 0.1);\n transition: background 0.3s ease;\n }\n \n .table-row:hover {\n background: rgba(255, 112, 67, 0.05);\n }\n \n .table-row:last-child {\n border-bottom: none;\n }\n \n \/* \u0424\u0430\u043a\u0442\u044b \u0438 \u0441\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0430 *\/\n .facts-container {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\n gap: 20px;\n margin-top: 30px;\n }\n \n .fact-card {\n background: rgba(255, 255, 255, 0.9);\n padding: 20px;\n border-radius: 15px;\n border-left: 4px solid #ff7043;\n transition: all 0.3s ease;\n cursor: pointer;\n }\n \n .fact-card:hover {\n transform: translateX(5px);\n box-shadow: 0 10px 20px rgba(255, 112, 67, 0.1);\n }\n \n .fact-number {\n font-size: 2rem;\n font-weight: 800;\n color: #ff7043;\n margin-bottom: 10px;\n }\n \n .fact-text {\n font-size: 0.95rem;\n line-height: 1.4;\n color: #666;\n }\n \n \/* \u0418\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0439 \u0442\u0435\u0441\u0442 *\/\n .quiz-container {\n background: rgba(255, 255, 255, 0.9);\n border-radius: 20px;\n padding: 25px;\n margin-top: 30px;\n border: 2px solid rgba(255, 112, 67, 0.2);\n }\n \n .quiz-question {\n font-size: 1.1rem;\n margin-bottom: 20px;\n color: #5d4037;\n font-weight: 600;\n }\n \n .quiz-options {\n display: flex;\n flex-direction: column;\n gap: 10px;\n }\n \n .quiz-option {\n padding: 15px;\n background: rgba(255, 112, 67, 0.05);\n border-radius: 10px;\n cursor: pointer;\n transition: all 0.3s ease;\n border: 2px solid transparent;\n color: #5d4037;\n }\n \n .quiz-option:hover {\n background: rgba(255, 112, 67, 0.1);\n transform: translateX(5px);\n }\n \n .quiz-option.correct {\n background: rgba(76, 175, 80, 0.1);\n border-color: #4caf50;\n color: #2e7d32;\n }\n \n .quiz-option.incorrect {\n background: rgba(244, 67, 54, 0.1);\n border-color: #f44336;\n color: #c62828;\n }\n \n \/* \u0412\u0442\u043e\u0440\u043e\u0439 \u0431\u043b\u043e\u043a: \u041f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b *\/\n .tools-section {\n background: linear-gradient(135deg, #a5d6a7 0%, #81c784 100%);\n color: #2e7d32;\n border-radius: 25px;\n padding: 35px;\n box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);\n }\n \n .tools-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\n gap: 20px;\n margin-top: 25px;\n }\n \n .tool-card {\n background: rgba(255, 255, 255, 0.9);\n padding: 25px;\n border-radius: 15px;\n text-align: center;\n transition: all 0.3s ease;\n border: 2px solid transparent;\n }\n \n .tool-card:hover {\n transform: translateY(-5px);\n border-color: #4caf50;\n box-shadow: 0 10px 20px rgba(76, 175, 80, 0.1);\n }\n \n .tool-icon {\n font-size: 2.5rem;\n color: #4caf50;\n margin-bottom: 15px;\n }\n \n .tool-title {\n font-weight: 600;\n margin-bottom: 10px;\n color: #2e7d32;\n }\n \n .tool-description {\n font-size: 0.9rem;\n color: #666;\n line-height: 1.4;\n }\n \n .footer {\n text-align: center;\n margin-top: 50px;\n color: #5d4037;\n opacity: 0.8;\n font-size: 0.9rem;\n }\n \n @media (max-width: 768px) {\n .header h1 { font-size: 2rem; }\n .header p { font-size: 1rem; }\n .encyclopedia-section, .tools-section { padding: 20px; }\n .section-title { font-size: 1.5rem; }\n .interactive-grid { grid-template-columns: 1fr; }\n .facts-container { grid-template-columns: 1fr; }\n .tools-grid { grid-template-columns: 1fr; }\n }\n \n \/* \u041c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0435 \u043e\u043a\u043d\u043e \u0434\u043b\u044f \u0434\u0435\u0442\u0430\u043b\u044c\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 *\/\n .modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0,0,0,0.7);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 10000;\n animation: fadeIn 0.3s ease;\n padding: 20px;\n }\n \n .modal-content {\n background: white;\n border-radius: 20px;\n max-width: 600px;\n width: 100%;\n max-height: 80vh;\n overflow-y: auto;\n animation: slideUp 0.3s ease;\n position: relative;\n }\n \n .modal-header {\n background: linear-gradient(135deg, #ff7043 0%, #ffb74d 100%);\n color: white;\n padding: 25px;\n border-radius: 20px 20px 0 0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n \n .modal-title {\n font-size: 1.5rem;\n font-weight: 700;\n }\n \n .modal-close {\n background: none;\n border: none;\n color: white;\n font-size: 1.5rem;\n cursor: pointer;\n width: 40px;\n height: 40px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: background 0.3s ease;\n }\n \n .modal-close:hover {\n background: rgba(255,255,255,0.2);\n }\n \n .modal-body {\n padding: 30px;\n color: #5d4037;\n }\n \n @keyframes fadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n }\n \n @keyframes slideUp {\n from { transform: translateY(50px); opacity: 0; }\n to { transform: translateY(0); opacity: 1; }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <div class=\"header\">\n <h1><i class=\"fas fa-book-open\"><\/i> \u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u0430\u044f \u044d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u044f<\/h1>\n <p>\u041f\u043e\u043b\u0435\u0437\u043d\u0430\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f, \u0442\u0435\u0445\u043d\u0438\u043a\u0438 \u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0434\u043b\u044f \u0443\u0432\u043b\u0435\u0447\u0435\u043d\u043d\u044b\u0445 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0435\u0439<\/p>\n <\/div>\n \n <div class=\"main-grid\">\n \n <div class=\"encyclopedia-section\">\n <h2 class=\"section-title\">\n <i class=\"fas fa-graduation-cap\"><\/i> \u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u0437\u043d\u0430\u043d\u0438\u044f\n <\/h2>\n \n <div class=\"interactive-grid\">\n \n <div class=\"interactive-card\" onclick=\"showDetail('techniques')\">\n <div class=\"card-icon\">\n <i class=\"fas fa-mortar-pestle\"><\/i>\n <\/div>\n <div class=\"card-title\">\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438<\/div>\n <div class=\"card-content\">\n \u041e\u0441\u0432\u043e\u0439\u0442\u0435 \u043a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438: \u043e\u0442 \u0431\u0430\u0437\u043e\u0432\u044b\u0445 \u043d\u0430\u0432\u044b\u043a\u043e\u0432 \u0434\u043e \u043f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u044b\u0445 \u043c\u0435\u0442\u043e\u0434\u0438\u043a \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u044f.\n <\/div>\n <div class=\"external-links\">\n <a href=\"https:\/\/www.bbcgoodfood.com\/howto\/guide\/25-skills-every-cook-should-know\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> BBC Good Food\n <\/a>\n <a href=\"https:\/\/www.seriouseats.com\/techniques\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> Serious Eats\n <\/a>\n <\/div>\n <\/div>\n \n \n <div class=\"interactive-card\" onclick=\"showDetail('science')\">\n <div class=\"card-icon\">\n <i class=\"fas fa-flask\"><\/i>\n <\/div>\n <div class=\"card-title\">\u041d\u0430\u0443\u043a\u0430 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438<\/div>\n <div class=\"card-content\">\n \u041f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0438 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432, \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u044f\u0449\u0438\u0445 \u043f\u0440\u0438 \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u0438 \u043f\u0438\u0449\u0438.\n <\/div>\n <div class=\"external-links\">\n <a href=\"https:\/\/www.seriouseats.com\/the-food-lab\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> Food Lab\n <\/a>\n <a href=\"https:\/\/www.cookingscienceguy.com\/\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> Cooking Science\n <\/a>\n <\/div>\n <\/div>\n \n \n <div class=\"interactive-card\" onclick=\"showDetail('history')\">\n <div class=\"card-icon\">\n <i class=\"fas fa-history\"><\/i>\n <\/div>\n <div class=\"card-title\">\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438<\/div>\n <div class=\"card-content\">\n \u041a\u0430\u043a \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u043b\u043e\u0441\u044c \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u043e\u0435 \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u043e\u0442 \u0434\u0440\u0435\u0432\u043d\u0438\u0445 \u0446\u0438\u0432\u0438\u043b\u0438\u0437\u0430\u0446\u0438\u0439 \u0434\u043e \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0441\u0442\u0438.\n <\/div>\n <div class=\"external-links\">\n <a href=\"https:\/\/foodtimeline.org\/\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> Food Timeline\n <\/a>\n <a href=\"https:\/\/www.history.com\/topics\/inventions\/history-of-cooking\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> History Channel\n <\/a>\n <\/div>\n <\/div>\n \n \n <div class=\"interactive-card\" onclick=\"showDetail('world')\">\n <div class=\"card-icon\">\n <i class=\"fas fa-globe-americas\"><\/i>\n <\/div>\n <div class=\"card-title\">\u041c\u0438\u0440\u043e\u0432\u044b\u0435 \u043a\u0443\u0445\u043d\u0438<\/div>\n <div class=\"card-content\">\n \u0418\u0437\u0443\u0447\u0435\u043d\u0438\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0435\u0439 \u0438 \u0442\u0440\u0430\u0434\u0438\u0446\u0438\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0441\u0442\u0440\u0430\u043d \u0438 \u043a\u0443\u043b\u044c\u0442\u0443\u0440.\n <\/div>\n <div class=\"external-links\">\n <a href=\"https:\/\/www.saveur.com\/world-cuisine\/\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> Saveur\n <\/a>\n <a href=\"https:\/\/www.bonappetit.com\/test-kitchen\/cooking-tips\" target=\"_blank\" class=\"ext-link\">\n <i class=\"fas fa-external-link-alt\"><\/i> Bon App\u00e9tit\n <\/a>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"info-table\">\n <div class=\"table-header\">\n <span>\u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u043d\u044b\u0439 \u0440\u0435\u0436\u0438\u043c<\/span>\n <span>\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043f\u0440\u043e\u0446\u0435\u0441\u0441<\/span>\n <\/div>\n <div class=\"table-row\">\n <span>50-60\u00b0C<\/span>\n <span>\u0422\u043e\u043c\u043b\u0435\u043d\u0438\u0435 (sous-vide)<\/span>\n <\/div>\n <div class=\"table-row\">\n <span>60-70\u00b0C<\/span>\n <span>\u041f\u0430\u0441\u0442\u0435\u0440\u0438\u0437\u0430\u0446\u0438\u044f \u044f\u0438\u0446<\/span>\n <\/div>\n <div class=\"table-row\">\n <span>100\u00b0C<\/span>\n <span>\u041a\u0438\u043f\u0435\u043d\u0438\u0435 \u0432\u043e\u0434\u044b<\/span>\n <\/div>\n <div class=\"table-row\">\n <span>120-130\u00b0C<\/span>\n <span>\u041a\u0430\u0440\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f \u0441\u0430\u0445\u0430\u0440\u0430<\/span>\n <\/div>\n <div class=\"table-row\">\n <span>150-160\u00b0C<\/span>\n <span>\u0420\u0435\u0430\u043a\u0446\u0438\u044f \u041c\u0430\u0439\u044f\u0440\u0430<\/span>\n <\/div>\n <\/div>\n \n \n <div class=\"facts-container\">\n <div class=\"fact-card\" onclick=\"showDetail('fact1')\">\n <div class=\"fact-number\">15,000+<\/div>\n <div class=\"fact-text\">\u0440\u0435\u0446\u0435\u043f\u0442\u043e\u0432 \u0432 \u0437\u043d\u0430\u043c\u0435\u043d\u0438\u0442\u043e\u0439 \u043a\u043d\u0438\u0433\u0435 «\u0418\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u0444\u0440\u0430\u043d\u0446\u0443\u0437\u0441\u043a\u043e\u0439 \u043a\u0443\u0445\u043d\u0438» \u0414\u0436\u0443\u043b\u0438\u0438 \u0427\u0430\u0439\u043b\u0434<\/div>\n <\/div>\n <div class=\"fact-card\" onclick=\"showDetail('fact2')\">\n <div class=\"fact-number\">98.6%<\/div>\n <div class=\"fact-text\">\u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0445 \u0432\u0435\u0441\u043e\u0432 \u043f\u0440\u0435\u043c\u0438\u0443\u043c-\u043a\u043b\u0430\u0441\u0441\u0430<\/div>\n <\/div>\n <div class=\"fact-card\" onclick=\"showDetail('fact3')\">\n <div class=\"fact-number\">300+<\/div>\n <div class=\"fact-text\">\u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0440\u0435\u0430\u043a\u0446\u0438\u0439 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u0440\u0438 \u0432\u044b\u043f\u0435\u0447\u043a\u0435 \u0445\u043b\u0435\u0431\u0430<\/div>\n <\/div>\n <div class=\"fact-card\" onclick=\"showDetail('fact4')\">\n <div class=\"fact-number\">1846<\/div>\n <div class=\"fact-text\">\u0433\u043e\u0434 \u0438\u0437\u043e\u0431\u0440\u0435\u0442\u0435\u043d\u0438\u044f \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f \u043d\u0435\u043c\u0435\u0446\u043a\u0438\u043c \u0445\u0438\u043c\u0438\u043a\u043e\u043c<\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"quiz-container\">\n <div class=\"quiz-question\" id=\"quizQuestion\">\n \u041a\u0430\u043a \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0440\u0435\u0430\u043a\u0446\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u0440\u0438 \u043f\u043e\u0434\u0440\u0443\u043c\u044f\u043d\u0438\u0432\u0430\u043d\u0438\u0438 \u043c\u044f\u0441\u0430 \u0438 \u0432\u044b\u043f\u0435\u0447\u043a\u0438?\n <\/div>\n <div class=\"quiz-options\">\n <div class=\"quiz-option\" onclick=\"checkAnswer(this, 'correct')\">\n \u0420\u0435\u0430\u043a\u0446\u0438\u044f \u041c\u0430\u0439\u044f\u0440\u0430\n <\/div>\n <div class=\"quiz-option\" onclick=\"checkAnswer(this, 'incorrect')\">\n \u041a\u0430\u0440\u0430\u043c\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u044f\n <\/div>\n <div class=\"quiz-option\" onclick=\"checkAnswer(this, 'incorrect')\">\n \u0413\u0438\u0434\u0440\u043e\u043b\u0438\u0437\n <\/div>\n <div class=\"quiz-option\" onclick=\"checkAnswer(this, 'incorrect')\">\n \u041e\u043a\u0438\u0441\u043b\u0435\u043d\u0438\u0435\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"tools-section\">\n <h2 class=\"section-title\" style=\"color: #2e7d32;\">\n <i class=\"fas fa-tools\"><\/i> \u041f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b\n <\/h2>\n \n <div class=\"tools-grid\">\n <div class=\"tool-card\">\n <div class=\"tool-icon\">\n <i class=\"fas fa-university\"><\/i>\n <\/div>\n <div class=\"tool-title\">\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0448\u043a\u043e\u043b\u044b<\/div>\n <div class=\"tool-description\">\n \u0412\u0435\u0434\u0443\u0449\u0438\u0435 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0438\u0442\u0443\u0442\u044b \u043c\u0438\u0440\u0430 \u0441 \u043e\u043d\u043b\u0430\u0439\u043d-\u043a\u0443\u0440\u0441\u0430\u043c\u0438 \u0438 \u043c\u0430\u0441\u0442\u0435\u0440-\u043a\u043b\u0430\u0441\u0441\u0430\u043c\u0438.\n <\/div>\n <div style=\"margin-top: 15px;\">\n <a href=\"https:\/\/www.culinaryinstitute.edu\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n CIA\n <\/a>\n <a href=\"https:\/\/www.le-cordon-bleu.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n Cordon Bleu\n <\/a>\n <\/div>\n <\/div>\n \n <div class=\"tool-card\">\n <div class=\"tool-icon\">\n <i class=\"fas fa-book\"><\/i>\n <\/div>\n <div class=\"tool-title\">\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u043a\u043d\u0438\u0433\u0438<\/div>\n <div class=\"tool-description\">\n \u0420\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u043c\u0430\u044f \u043b\u0438\u0442\u0435\u0440\u0430\u0442\u0443\u0440\u0430 \u043e\u0442 \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0445 \u0448\u0435\u0444-\u043f\u043e\u0432\u0430\u0440\u043e\u0432 \u0438 \u043a\u043e\u043d\u0434\u0438\u0442\u0435\u0440\u043e\u0432.\n <\/div>\n <div style=\"margin-top: 15px;\">\n <a href=\"https:\/\/www.kingarthurbaking.com\/learn\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n King Arthur\n <\/a>\n <a href=\"https:\/\/www.americastestkitchen.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n Test Kitchen\n <\/a>\n <\/div>\n <\/div>\n \n <div class=\"tool-card\">\n <div class=\"tool-icon\">\n <i class=\"fas fa-video\"><\/i>\n <\/div>\n <div class=\"tool-title\">\u0412\u0438\u0434\u0435\u043e\u0443\u0440\u043e\u043a\u0438<\/div>\n <div class=\"tool-description\">\n \u041a\u0430\u0447\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0435 \u0432\u0438\u0434\u0435\u043e-\u043a\u0443\u0440\u0441\u044b \u043f\u043e \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u043c \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u043c \u0442\u0435\u0445\u043d\u0438\u043a\u0430\u043c \u0438 \u0440\u0435\u0446\u0435\u043f\u0442\u0430\u043c.\n <\/div>\n <div style=\"margin-top: 15px;\">\n <a href=\"https:\/\/www.youtube.com\/c\/JoshuaWeissman\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n YouTube\n <\/a>\n <a href=\"https:\/\/www.masterclass.com\/categories\/cooking\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n MasterClass\n <\/a>\n <\/div>\n <\/div>\n \n <div class=\"tool-card\">\n <div class=\"tool-icon\">\n <i class=\"fas fa-utensils\"><\/i>\n <\/div>\n <div class=\"tool-title\">\u041e\u0431\u043e\u0440\u0443\u0434\u043e\u0432\u0430\u043d\u0438\u0435<\/div>\n <div class=\"tool-description\">\n \u0420\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0430\u0446\u0438\u0438 \u043f\u043e \u0432\u044b\u0431\u043e\u0440\u0443 \u043a\u0443\u0445\u043e\u043d\u043d\u043e\u0433\u043e \u043e\u0431\u043e\u0440\u0443\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u0438 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432.\n <\/div>\n <div style=\"margin-top: 15px;\">\n <a href=\"https:\/\/www.cooksillustrated.com\/equipment_reviews\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n Equipment Reviews\n <\/a>\n <a href=\"https:\/\/www.thekitchn.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n Kitchn\n <\/a>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div style=\"margin-top: 30px; padding: 25px; background: rgba(255,255,255,0.9); border-radius: 15px;\">\n <h3 style=\"color: #2e7d32; margin-bottom: 15px; font-size: 1.2rem;\">\n <i class=\"fas fa-lightbulb\"><\/i> \u041f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0441\u043e\u0432\u0435\u0442\u044b\n <\/h3>\n <ul style=\"color: #666; line-height: 1.6; padding-left: 20px;\">\n <li style=\"margin-bottom: 10px;\">\u0412\u0441\u0435\u0433\u0434\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b \u0434\u043b\u044f \u0442\u043e\u0447\u043d\u044b\u0445 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <li style=\"margin-bottom: 10px;\">\u0420\u0430\u0437\u043e\u0433\u0440\u0435\u0432\u0430\u0439\u0442\u0435 \u0434\u0443\u0445\u043e\u0432\u043a\u0443 \u0437\u0430\u0440\u0430\u043d\u0435\u0435 (\u043c\u0438\u043d\u0438\u043c\u0443\u043c 15-20 \u043c\u0438\u043d\u0443\u0442)<\/li>\n <li style=\"margin-bottom: 10px;\">\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u043c\u044f\u0441\u0443 «\u043e\u0442\u0434\u043e\u0445\u043d\u0443\u0442\u044c» \u043f\u043e\u0441\u043b\u0435 \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u044f<\/li>\n <li>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0442\u0430\u0439\u043c\u0435\u0440 \u0434\u043b\u044f \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044f \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u044f<\/li>\n <\/ul>\n <\/div>\n \n \n <div style=\"margin-top: 25px; display: flex; flex-wrap: wrap; gap: 10px;\">\n <a href=\"https:\/\/www.foodnetwork.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n <i class=\"fas fa-tv\"><\/i> Food Network\n <\/a>\n <a href=\"https:\/\/www.epicurious.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n <i class=\"fas fa-newspaper\"><\/i> Epicurious\n <\/a>\n <a href=\"https:\/\/www.delish.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n <i class=\"fas fa-hamburger\"><\/i> Delish\n <\/a>\n <a href=\"https:\/\/www.tasteofhome.com\/\" target=\"_blank\" class=\"ext-link\" style=\"background: rgba(76,175,80,0.1); color: #2e7d32;\">\n <i class=\"fas fa-home\"><\/i> Taste of Home\n <\/a>\n <\/div>\n <\/div>\n <\/div>\n \n <div class=\"footer\">\n <p>\u00a9 2026 \u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u0430\u044f \u044d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u044f | \u041f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0434\u043b\u044f \u0434\u043e\u043c\u0430\u0448\u043d\u0438\u0445 \u043f\u043e\u0432\u0430\u0440\u043e\u0432 \u0438 \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u043e\u0432<\/p>\n <\/div>\n <\/div>\n\n <script>\n \/\/ \u0414\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u0434\u0435\u0442\u0430\u043b\u044c\u043d\u044b\u0445 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0439\n const detailContent = {\n 'techniques': {\n title: '\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u043e\u043b\u0436\u0435\u043d \u043e\u0441\u0432\u043e\u0438\u0442\u044c \u043a\u0430\u0436\u0434\u044b\u0439 \u043f\u043e\u0432\u0430\u0440:<\/h3>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">1. \u041d\u0430\u0440\u0435\u0437\u043a\u0430 (Knife Skills)<\/h4>\n <p>\u041f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u0430\u044f \u0442\u0435\u0445\u043d\u0438\u043a\u0430 \u043d\u0430\u0440\u0435\u0437\u043a\u0438 \u043e\u0432\u043e\u0449\u0435\u0439, \u043c\u044f\u0441\u0430 \u0438 \u0434\u0440\u0443\u0433\u0438\u0445 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u043e\u0432. \u0412\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 \u0432\u0438\u0434\u044b \u043d\u0430\u0440\u0435\u0437\u043a\u0438: \u0436\u0443\u043b\u044c\u0435\u043d, \u0431\u0440\u0443\u043d\u043e\u0430\u0437, \u0448\u0430\u0442\u043e \u0438 \u0442.\u0434.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">2. \u041f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u043e\u0443\u0441\u043e\u0432 (Sauce Making)<\/h4>\n <p>5 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 \u0441\u043e\u0443\u0441\u043e\u0432 \u0444\u0440\u0430\u043d\u0446\u0443\u0437\u0441\u043a\u043e\u0439 \u043a\u0443\u0445\u043d\u0438 (\u0431\u0435\u0448\u0430\u043c\u0435\u043b\u044c, \u0432\u0435\u043b\u0443\u0442\u0435, \u044d\u0441\u043f\u0430\u043d\u044c\u043e\u043b\u044c, \u0442\u043e\u043c\u0430\u0442\u043d\u044b\u0439, \u0433\u043e\u043b\u043b\u0430\u043d\u0434\u0435\u0437) \u0438 \u0438\u0445 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u043d\u044b\u0435.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">3. \u0422\u0435\u0445\u043d\u0438\u043a\u0438 \u0442\u0435\u0440\u043c\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438<\/h4>\n <ul style=\"color: #666; line-height: 1.6; padding-left: 20px;\">\n <li>\u0411\u043b\u0430\u043d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 - \u043a\u0440\u0430\u0442\u043a\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0435 \u043f\u043e\u0433\u0440\u0443\u0436\u0435\u043d\u0438\u0435 \u0432 \u043a\u0438\u043f\u044f\u0449\u0443\u044e \u0432\u043e\u0434\u0443<\/li>\n <li>\u0411\u0440\u044d\u0439\u0437\u0438\u043d\u0433 - \u0442\u0443\u0448\u0435\u043d\u0438\u0435 \u0441 \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u043c \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e\u043c \u0436\u0438\u0434\u043a\u043e\u0441\u0442\u0438<\/li>\n <li>\u0421\u043e\u0442\u0438\u0435 - \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043e\u0431\u0436\u0430\u0440\u0438\u0432\u0430\u043d\u0438\u0435 \u0441 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u044b\u043c \u043f\u043e\u043c\u0435\u0448\u0438\u0432\u0430\u043d\u0438\u0435\u043c<\/li>\n <li>\u041a\u043e\u043d\u0444\u0438 - \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e\u0435 \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0432 \u0436\u0438\u0440\u0435 \u043f\u0440\u0438 \u043d\u0438\u0437\u043a\u043e\u0439 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0435<\/li>\n <\/ul>\n <\/div>\n \n <div style=\"background: rgba(255, 112, 67, 0.1); padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p style=\"margin: 0; color: #5d4037;\"><strong>\u0421\u043e\u0432\u0435\u0442:<\/strong> \u041d\u0430\u0447\u0438\u043d\u0430\u0439\u0442\u0435 \u0441 \u043e\u0441\u0432\u043e\u0435\u043d\u0438\u044f \u0431\u0430\u0437\u043e\u0432\u044b\u0445 \u0442\u0435\u0445\u043d\u0438\u043a, \u043f\u0440\u0435\u0436\u0434\u0435 \u0447\u0435\u043c \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u0442\u044c \u043a \u0441\u043b\u043e\u0436\u043d\u044b\u043c \u0440\u0435\u0446\u0435\u043f\u0442\u0430\u043c.<\/p>\n <\/div>\n `\n },\n 'science': {\n title: '\u041d\u0430\u0443\u043a\u0430 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u0425\u0438\u043c\u0438\u044f \u0438 \u0444\u0438\u0437\u0438\u043a\u0430 \u0432 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438:<\/h3>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0420\u0435\u0430\u043a\u0446\u0438\u044f \u041c\u0430\u0439\u044f\u0440\u0430<\/h4>\n <p>\u0425\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0440\u0435\u0430\u043a\u0446\u0438\u044f \u043c\u0435\u0436\u0434\u0443 \u0430\u043c\u0438\u043d\u043e\u043a\u0438\u0441\u043b\u043e\u0442\u0430\u043c\u0438 \u0438 \u0441\u0430\u0445\u0430\u0440\u0430\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u0440\u0438 \u043d\u0430\u0433\u0440\u0435\u0432\u0430\u043d\u0438\u0438 \u0432\u044b\u0448\u0435 140\u00b0C. \u041e\u0442\u0432\u0435\u0447\u0430\u0435\u0442 \u0437\u0430 \u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043a\u043e\u0440\u043e\u0447\u043a\u0438 \u043d\u0430 \u043c\u044f\u0441\u0435, \u0432\u044b\u043f\u0435\u0447\u043a\u0435 \u0438 \u0434\u0430\u0435\u0442 \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u043d\u044b\u0439 \u0430\u0440\u043e\u043c\u0430\u0442.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u041a\u0430\u0440\u0430\u043c\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0441\u0430\u0445\u0430\u0440\u0430<\/h4>\n <p>\u041f\u0440\u043e\u0446\u0435\u0441\u0441 \u043e\u043a\u0438\u0441\u043b\u0435\u043d\u0438\u044f \u0441\u0430\u0445\u0430\u0440\u0430 \u043f\u0440\u0438 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0435 160-180\u00b0C. \u0412 \u043e\u0442\u043b\u0438\u0447\u0438\u0435 \u043e\u0442 \u0440\u0435\u0430\u043a\u0446\u0438\u0438 \u041c\u0430\u0439\u044f\u0440\u0430, \u043d\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u0443\u0447\u0430\u0441\u0442\u0438\u044f \u0430\u043c\u0438\u043d\u043e\u043a\u0438\u0441\u043b\u043e\u0442.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u041a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c<\/h4>\n <p>\u0420\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u0431\u0438\u043a\u0430\u0440\u0431\u043e\u043d\u0430\u0442\u0430 \u043d\u0430\u0442\u0440\u0438\u044f (\u0441\u043e\u0434\u044b) \u0438 \u043a\u0438\u0441\u043b\u043e\u0442\u044b. \u041f\u0440\u0438 \u043a\u043e\u043d\u0442\u0430\u043a\u0442\u0435 \u0441 \u0432\u043b\u0430\u0433\u043e\u0439 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0440\u0435\u0430\u043a\u0446\u0438\u044f \u0441 \u0432\u044b\u0434\u0435\u043b\u0435\u043d\u0438\u0435\u043c \u0443\u0433\u043b\u0435\u043a\u0438\u0441\u043b\u043e\u0433\u043e \u0433\u0430\u0437\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0434\u043d\u0438\u043c\u0430\u0435\u0442 \u0442\u0435\u0441\u0442\u043e.<\/p>\n <\/div>\n \n <div style=\"display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin-top: 20px;\">\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0430 \u0434\u0435\u043d\u0430\u0442\u0443\u0440\u0430\u0446\u0438\u0438 \u0431\u0435\u043b\u043a\u0430:<\/strong><br>\n \u042f\u0439\u0446\u0430: 62-65\u00b0C<br>\n \u0420\u044b\u0431\u0430: 60-65\u00b0C<br>\n \u041c\u044f\u0441\u043e: 70-75\u00b0C\n <\/div>\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u0422\u043e\u0447\u043a\u0438 \u043a\u0438\u043f\u0435\u043d\u0438\u044f:<\/strong><br>\n \u0412\u043e\u0434\u0430: 100\u00b0C<br>\n \u041c\u0430\u0441\u043b\u043e: 180-200\u00b0C<br>\n \u0421\u0430\u0445\u0430\u0440\u043d\u044b\u0439 \u0441\u0438\u0440\u043e\u043f: 100-160\u00b0C\n <\/div>\n <\/div>\n `\n },\n 'history': {\n title: '\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u042d\u0432\u043e\u043b\u044e\u0446\u0438\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u043e\u0433\u043e \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u0430:<\/h3>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0414\u0440\u0435\u0432\u043d\u0438\u0439 \u043c\u0438\u0440 (\u0434\u043e 500 \u0433. \u043d.\u044d.)<\/h4>\n <p>\u041f\u0435\u0440\u0432\u044b\u0435 \u0440\u0435\u0446\u0435\u043f\u0442\u044b \u0431\u044b\u043b\u0438 \u0437\u0430\u043f\u0438\u0441\u0430\u043d\u044b \u0432 \u0414\u0440\u0435\u0432\u043d\u0435\u0439 \u041c\u0435\u0441\u043e\u043f\u043e\u0442\u0430\u043c\u0438\u0438. \u0420\u0438\u043c\u043b\u044f\u043d\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u043b\u0438 \u0441\u043b\u043e\u0436\u043d\u0443\u044e \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u044e \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u0441\u043f\u0435\u0446\u0438\u0439, \u0441\u043e\u0443\u0441\u043e\u0432 \u0438 \u0442\u0435\u0445\u043d\u0438\u043a \u043a\u043e\u043d\u0441\u0435\u0440\u0432\u0430\u0446\u0438\u0438.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0421\u0440\u0435\u0434\u043d\u0438\u0435 \u0432\u0435\u043a\u0430 (500-1500 \u0433\u0433.)<\/h4>\n <p>\u0421\u0438\u043b\u044c\u043d\u043e\u0435 \u0432\u043b\u0438\u044f\u043d\u0438\u0435 \u0440\u0435\u043b\u0438\u0433\u0438\u0438 \u043d\u0430 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u044e. \u041f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u0438\u0440\u043e\u0433\u043e\u0432, \u043f\u0430\u0448\u0442\u0435\u0442\u043e\u0432, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043c\u0438\u043d\u0434\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u043e\u043b\u043e\u043a\u0430 \u0432 \u043f\u043e\u0441\u0442\u043d\u044b\u0435 \u0434\u043d\u0438.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u042d\u043f\u043e\u0445\u0430 \u0412\u043e\u0437\u0440\u043e\u0436\u0434\u0435\u043d\u0438\u044f (1500-1700 \u0433\u0433.)<\/h4>\n <p>\u041e\u0442\u043a\u0440\u044b\u0442\u0438\u0435 \u041d\u043e\u0432\u043e\u0433\u043e \u0421\u0432\u0435\u0442\u0430 \u043f\u0440\u0438\u043d\u0435\u0441\u043b\u043e \u0432 \u0415\u0432\u0440\u043e\u043f\u0443 \u043d\u043e\u0432\u044b\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b: \u043a\u0430\u0440\u0442\u043e\u0444\u0435\u043b\u044c, \u0442\u043e\u043c\u0430\u0442\u044b, \u043a\u0443\u043a\u0443\u0440\u0443\u0437\u0443, \u043a\u0430\u043a\u0430\u043e. \u0420\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u043a\u043e\u043d\u0434\u0438\u0442\u0435\u0440\u0441\u043a\u043e\u0433\u043e \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u0430.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0421\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u0430\u044f \u044d\u043f\u043e\u0445\u0430 (1700-\u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0435\u0435 \u0432\u0440\u0435\u043c\u044f)<\/h4>\n <p>\u0420\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u0444\u0440\u0430\u043d\u0446\u0443\u0437\u0441\u043a\u043e\u0439 \u0432\u044b\u0441\u043e\u043a\u043e\u0439 \u043a\u0443\u0445\u043d\u0438 (haute cuisine). \u0418\u0437\u043e\u0431\u0440\u0435\u0442\u0435\u043d\u0438\u0435 \u043a\u043e\u043d\u0441\u0435\u0440\u0432\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f (1810), \u0445\u043e\u043b\u043e\u0434\u0438\u043b\u044c\u043d\u0438\u043a\u0430 (1834), \u043c\u0438\u043a\u0440\u043e\u0432\u043e\u043b\u043d\u043e\u0432\u043e\u0439 \u043f\u0435\u0447\u0438 (1946).<\/p>\n <\/div>\n \n <div style=\"background: rgba(255, 112, 67, 0.1); padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p style=\"margin: 0; color: #5d4037;\"><strong>\u0418\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u0444\u0430\u043a\u0442:<\/strong> \u041f\u0435\u0440\u0432\u0430\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u0430\u044f \u043a\u043d\u0438\u0433\u0430 \"De Re Coquinaria\" \u0431\u044b\u043b\u0430 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0430 \u0440\u0438\u043c\u043b\u044f\u043d\u0438\u043d\u043e\u043c \u0410\u043f\u0438\u0446\u0438\u0435\u043c \u0432 1 \u0432\u0435\u043a\u0435 \u043d.\u044d. \u0438 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u043b\u0430 \u0440\u0435\u0446\u0435\u043f\u0442\u044b \u0434\u043b\u044f \u0431\u043e\u0433\u0430\u0442\u044b\u0445 \u043f\u0430\u0442\u0440\u0438\u0446\u0438\u0435\u0432.<\/p>\n <\/div>\n `\n },\n 'world': {\n title: '\u041c\u0438\u0440\u043e\u0432\u044b\u0435 \u043a\u0443\u0445\u043d\u0438',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u041e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u043a\u0443\u0445\u043e\u043d\u044c \u0440\u0430\u0437\u043d\u044b\u0445 \u0441\u0442\u0440\u0430\u043d:<\/h3>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0424\u0440\u0430\u043d\u0446\u0443\u0437\u0441\u043a\u0430\u044f \u043a\u0443\u0445\u043d\u044f<\/h4>\n <p>\u041e\u0441\u043d\u043e\u0432\u0430\u043d\u0430 \u043d\u0430 \u0441\u043e\u0443\u0441\u0430\u0445, \u0442\u0435\u0445\u043d\u0438\u043a\u0430\u0445 \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0438 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u043e\u0432. \u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b: \u0431\u0443\u043b\u044c\u043e\u043d\u044b, \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u044b\u0435 \u0441\u043e\u0443\u0441\u044b, \u0432\u044b\u043f\u0435\u0447\u043a\u0430.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0418\u0442\u0430\u043b\u044c\u044f\u043d\u0441\u043a\u0430\u044f \u043a\u0443\u0445\u043d\u044f<\/h4>\n <p>\u0410\u043a\u0446\u0435\u043d\u0442 \u043d\u0430 \u0441\u0432\u0435\u0436\u0438\u0445, \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0445 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u0430\u0445 \u0438 \u043f\u0440\u043e\u0441\u0442\u043e\u0442\u0435 \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u044f. \u0420\u0435\u0433\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u0440\u0430\u0437\u043b\u0438\u0447\u0438\u044f: \u0441\u0435\u0432\u0435\u0440 (\u0441\u043b\u0438\u0432\u043e\u0447\u043d\u044b\u0435 \u0441\u043e\u0443\u0441\u044b, \u0440\u0438\u0441), \u044e\u0433 (\u0442\u043e\u043c\u0430\u0442\u044b, \u043e\u043b\u0438\u0432\u043a\u043e\u0432\u043e\u0435 \u043c\u0430\u0441\u043b\u043e, \u043c\u043e\u0440\u0435\u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b).<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u042f\u043f\u043e\u043d\u0441\u043a\u0430\u044f \u043a\u0443\u0445\u043d\u044f<\/h4>\n <p>\u0424\u0438\u043b\u043e\u0441\u043e\u0444\u0438\u044f \u0441\u0435\u0437\u043e\u043d\u043d\u043e\u0441\u0442\u0438, \u0441\u0432\u0435\u0436\u0435\u0441\u0442\u0438 \u0438 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0439 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438. \u0422\u0435\u0445\u043d\u0438\u043a\u0438: \u0441\u0443\u0448\u0438, \u0441\u0430\u0448\u0438\u043c\u0438, \u0442\u0435\u043c\u043f\u0443\u0440\u0430, \u043c\u0438\u0441\u043e-\u0441\u0443\u043f\u044b.<\/p>\n <\/div>\n \n <div style=\"margin-bottom: 20px;\">\n <h4 style=\"color: #5d4037; margin-bottom: 10px;\">\u0418\u043d\u0434\u0438\u0439\u0441\u043a\u0430\u044f \u043a\u0443\u0445\u043d\u044f<\/h4>\n <p>\u0411\u043e\u0433\u0430\u0442\u0441\u0442\u0432\u043e \u0441\u043f\u0435\u0446\u0438\u0439 \u0438 \u0441\u043b\u043e\u0436\u043d\u044b\u0435 \u0441\u043c\u0435\u0441\u0438 (\u043c\u0430\u0441\u0430\u043b\u0430). \u0420\u0430\u0437\u043d\u043e\u043e\u0431\u0440\u0430\u0437\u0438\u0435 \u0432\u0435\u0433\u0435\u0442\u0430\u0440\u0438\u0430\u043d\u0441\u043a\u0438\u0445 \u0431\u043b\u044e\u0434. \u0422\u0435\u0445\u043d\u0438\u043a\u0430 \u0442\u0430\u043d\u0434\u0443\u0440\u0438.<\/p>\n <\/div>\n \n <div style=\"display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin-top: 20px;\">\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u0422\u0438\u043f\u0438\u0447\u043d\u044b\u0435 \u0441\u043f\u0435\u0446\u0438\u0438:<\/strong><br>\n \u0424\u0440\u0430\u043d\u0446\u0438\u044f: \u044d\u0441\u0442\u0440\u0430\u0433\u043e\u043d, \u0442\u0438\u043c\u044c\u044f\u043d, \u043f\u0435\u0442\u0440\u0443\u0448\u043a\u0430<br>\n \u0418\u0442\u0430\u043b\u0438\u044f: \u0431\u0430\u0437\u0438\u043b\u0438\u043a, \u043e\u0440\u0435\u0433\u0430\u043d\u043e, \u0440\u043e\u0437\u043c\u0430\u0440\u0438\u043d<br>\n \u0418\u043d\u0434\u0438\u044f: \u043a\u0443\u0440\u043a\u0443\u043c\u0430, \u043a\u0430\u0440\u0440\u0438, \u043a\u0443\u043c\u0438\u043d\n <\/div>\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438:<\/strong><br>\n \u041a\u0438\u0442\u0430\u0439: \u0432\u043e\u043a \u0441\u0442\u0438\u0440-\u0444\u0440\u0430\u0439<br>\n \u041c\u0435\u043a\u0441\u0438\u043a\u0430: \u043c\u043e\u043b\u0435\u043d\u0438\u0435 \u043d\u0430 \u043a\u0430\u043c\u043d\u0435<br>\n \u0422\u0430\u0438\u043b\u0430\u043d\u0434: \u0431\u0430\u043b\u0430\u043d\u0441 5 \u0432\u043a\u0443\u0441\u043e\u0432\n <\/div>\n <\/div>\n `\n },\n 'fact1': {\n title: '\u041a\u043d\u0438\u0433\u0430 \u0414\u0436\u0443\u043b\u0438\u0438 \u0427\u0430\u0439\u043b\u0434',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\"\u0418\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u0444\u0440\u0430\u043d\u0446\u0443\u0437\u0441\u043a\u043e\u0439 \u043a\u0443\u0445\u043d\u0438\" \u0414\u0436\u0443\u043b\u0438\u0438 \u0427\u0430\u0439\u043b\u0434<\/h3>\n \n <p>\u042d\u0442\u0430 \u043b\u0435\u0433\u0435\u043d\u0434\u0430\u0440\u043d\u0430\u044f \u043a\u043d\u0438\u0433\u0430, \u043e\u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u0432 1961 \u0433\u043e\u0434\u0443, \u043f\u0440\u043e\u0438\u0437\u0432\u0435\u043b\u0430 \u0440\u0435\u0432\u043e\u043b\u044e\u0446\u0438\u044e \u0432 \u0430\u043c\u0435\u0440\u0438\u043a\u0430\u043d\u0441\u043a\u043e\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438. \u041e\u043d\u0430 \u0441\u0434\u0435\u043b\u0430\u043b\u0430 \u0444\u0440\u0430\u043d\u0446\u0443\u0437\u0441\u043a\u0443\u044e \u043a\u0443\u0445\u043d\u044e \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0439 \u0434\u043b\u044f \u0434\u043e\u043c\u0430\u0448\u043d\u0438\u0445 \u043f\u043e\u0432\u0430\u0440\u043e\u0432.<\/p>\n \n <div style=\"margin: 20px 0;\">\n <strong>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u043a\u043d\u0438\u0433\u0438:<\/strong>\n <ul style=\"color: #666; line-height: 1.6; padding-left: 20px; margin-top: 10px;\">\n <li>734 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0441 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u044b\u043c\u0438 \u0438\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u044f\u043c\u0438<\/li>\n <li>\u0411\u043e\u043b\u0435\u0435 15,000 \u0440\u0435\u0446\u0435\u043f\u0442\u043e\u0432 \u0438 \u0438\u0445 \u0432\u0430\u0440\u0438\u0430\u0446\u0438\u0439<\/li>\n <li>\u041f\u043e\u0448\u0430\u0433\u043e\u0432\u044b\u0435 \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0439 \u0442\u0435\u0445\u043d\u0438\u043a\u0438<\/li>\n <li>\u041f\u043e\u0434\u0440\u043e\u0431\u043d\u044b\u0435 \u043e\u0431\u044a\u044f\u0441\u043d\u0435\u043d\u0438\u044f \u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432<\/li>\n <li>\u0421\u043e\u0432\u0435\u0442\u044b \u043f\u043e \u0432\u044b\u0431\u043e\u0440\u0443 \u043e\u0431\u043e\u0440\u0443\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u0438 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u043e\u0432<\/li>\n <\/ul>\n <\/div>\n \n <div style=\"background: rgba(255, 112, 67, 0.1); padding: 15px; border-radius: 10px;\">\n <p style=\"margin: 0; color: #5d4037;\"><strong>\u041d\u0430\u0441\u043b\u0435\u0434\u0438\u0435:<\/strong> \u041a\u043d\u0438\u0433\u0430 \u0434\u043e \u0441\u0438\u0445 \u043f\u043e\u0440 \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u043e\u0434\u043d\u043e\u0439 \u0438\u0437 \u0441\u0430\u043c\u044b\u0445 \u0432\u043b\u0438\u044f\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0445 \u043a\u043d\u0438\u0433 \u0432 \u0438\u0441\u0442\u043e\u0440\u0438\u0438. \u041e\u043d\u0430 \u0432\u0434\u043e\u0445\u043d\u043e\u0432\u0438\u043b\u0430 \u043f\u043e\u043a\u043e\u043b\u0435\u043d\u0438\u044f \u043f\u043e\u0432\u0430\u0440\u043e\u0432 \u0438 \u0441\u0434\u0435\u043b\u0430\u043b\u0430 \u0414\u0436\u0443\u043b\u0438\u044e \u0427\u0430\u0439\u043b\u0434 \u0438\u043a\u043e\u043d\u043e\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u043e\u0433\u043e \u043c\u0438\u0440\u0430.<\/p>\n <\/div>\n `\n },\n 'fact2': {\n title: '\u0422\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0445 \u0432\u0435\u0441\u043e\u0432',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u0422\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0445 \u0432\u0435\u0441\u043e\u0432<\/h3>\n \n <p>\u0421\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0446\u0438\u0444\u0440\u043e\u0432\u044b\u0435 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u044e\u0442 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u0434\u043e 0.1 \u0433\u0440\u0430\u043c\u043c\u0430, \u0447\u0442\u043e \u043a\u0440\u0438\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u0430\u0436\u043d\u043e \u0434\u043b\u044f \u043a\u043e\u043d\u0434\u0438\u0442\u0435\u0440\u0441\u043a\u0438\u0445 \u0438\u0437\u0434\u0435\u043b\u0438\u0439 \u0438 \u0432\u044b\u043f\u0435\u0447\u043a\u0438.<\/p>\n \n <div style=\"margin: 20px 0;\">\n <strong>\u042d\u0432\u043e\u043b\u044e\u0446\u0438\u044f \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u0438:<\/strong>\n <ul style=\"color: #666; line-height: 1.6; padding-left: 20px; margin-top: 10px;\">\n <li>18 \u0432\u0435\u043a: \u043c\u0435\u0445\u0430\u043d\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0432\u0435\u0441\u044b \u0441 \u043f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c\u044e 10-15%<\/li>\n <li>19 \u0432\u0435\u043a: \u043f\u0440\u0443\u0436\u0438\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b \u0441 \u043f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c\u044e 5-8%<\/li>\n <li>1970-\u0435: \u043f\u0435\u0440\u0432\u044b\u0435 \u0446\u0438\u0444\u0440\u043e\u0432\u044b\u0435 \u0432\u0435\u0441\u044b \u0441 \u043f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c\u044e 2-3%<\/li>\n <li>2000-\u0435: \u043f\u0440\u0435\u0446\u0438\u0437\u0438\u043e\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b \u0441 \u043f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c\u044e 0.5-1%<\/li>\n <li>2020-\u0435: \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u0432\u0435\u0441\u044b \u0441 \u043f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c\u044e 0.1%<\/li>\n <\/ul>\n <\/div>\n \n <div style=\"display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin-top: 20px;\">\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u0414\u043b\u044f \u0447\u0435\u0433\u043e \u043d\u0443\u0436\u043d\u0430 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c:<\/strong><br>\n \u2022 \u0420\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c: \u00b11\u0433 \u043c\u0435\u043d\u044f\u0435\u0442 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442<br>\n \u2022 \u0414\u0440\u043e\u0436\u0436\u0438: \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u043a\u0440\u0438\u0442\u0438\u0447\u043d\u0430<br>\n \u2022 \u0421\u043e\u043b\u044c: \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u0431\u0440\u043e\u0436\u0435\u043d\u0438\u0435<br>\n \u2022 \u0421\u043f\u0435\u0446\u0438\u0438: \u0434\u043e\u0437\u0438\u0440\u043e\u0432\u043a\u0430 \u043f\u043e \u0440\u0435\u0446\u0435\u043f\u0442\u0443\n <\/div>\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u0420\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u043c\u044b\u0435 \u0432\u0435\u0441\u044b:<\/strong><br>\n \u2022 OXO Good Grips: \u00b11\u0433<br>\n \u2022 Escali Primo: \u00b10.5\u0433<br>\n \u2022 My Weigh KD-8000: \u00b10.1\u0433<br>\n \u2022 AWS-600: \u00b10.01\u0433\n <\/div>\n <\/div>\n `\n },\n 'fact3': {\n title: '\u0425\u0438\u043c\u0438\u044f \u0432\u044b\u043f\u0435\u0447\u043a\u0438 \u0445\u043b\u0435\u0431\u0430',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u0425\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0440\u0435\u0430\u043a\u0446\u0438\u0438 \u043f\u0440\u0438 \u0432\u044b\u043f\u0435\u0447\u043a\u0435 \u0445\u043b\u0435\u0431\u0430<\/h3>\n \n <p>\u0412\u044b\u043f\u0435\u0447\u043a\u0430 \u0445\u043b\u0435\u0431\u0430 - \u044d\u0442\u043e \u0441\u043b\u043e\u0436\u043d\u044b\u0439 \u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043f\u0440\u043e\u0446\u0435\u0441\u0441, \u0432\u043a\u043b\u044e\u0447\u0430\u044e\u0449\u0438\u0439 \u0431\u043e\u043b\u0435\u0435 300 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0440\u0435\u0430\u043a\u0446\u0438\u0439.<\/p>\n \n <div style=\"margin: 20px 0;\">\n <strong>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u044d\u0442\u0430\u043f\u044b \u0438 \u0440\u0435\u0430\u043a\u0446\u0438\u0438:<\/strong>\n <ul style=\"color: #666; line-height: 1.6; padding-left: 20px; margin-top: 10px;\">\n <li>\u0424\u0435\u0440\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f: \u0434\u0440\u043e\u0436\u0436\u0438 \u043f\u0440\u0435\u0432\u0440\u0430\u0449\u0430\u044e\u0442 \u0441\u0430\u0445\u0430\u0440\u0430 \u0432 CO\u2082 \u0438 \u0430\u043b\u043a\u043e\u0433\u043e\u043b\u044c<\/li>\n <li>\u0414\u0435\u043d\u0430\u0442\u0443\u0440\u0430\u0446\u0438\u044f \u0431\u0435\u043b\u043a\u0430: \u0433\u043b\u044e\u0442\u0435\u043d \u0444\u043e\u0440\u043c\u0438\u0440\u0443\u0435\u0442 \u044d\u043b\u0430\u0441\u0442\u0438\u0447\u043d\u0443\u044e \u0441\u0435\u0442\u044c<\/li>\n <li>\u0416\u0435\u043b\u0430\u0442\u0438\u043d\u0438\u0437\u0430\u0446\u0438\u044f \u043a\u0440\u0430\u0445\u043c\u0430\u043b\u0430: \u043f\u0440\u0438 60-70\u00b0C<\/li>\n <li>\u0420\u0435\u0430\u043a\u0446\u0438\u044f \u041c\u0430\u0439\u044f\u0440\u0430: \u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043a\u043e\u0440\u043e\u0447\u043a\u0438 \u043f\u0440\u0438 140-165\u00b0C<\/li>\n <li>\u041a\u0430\u0440\u0430\u043c\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u044f: \u043f\u043e\u0434\u0440\u0443\u043c\u044f\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u0438 160-180\u00b0C<\/li>\n <\/ul>\n <\/div>\n \n <div style=\"background: rgba(255, 112, 67, 0.1); padding: 15px; border-radius: 10px;\">\n <p style=\"margin: 0; color: #5d4037;\"><strong>\u0418\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u0444\u0430\u043a\u0442:<\/strong> \u0417\u0430\u043f\u0430\u0445 \u0441\u0432\u0435\u0436\u0435\u0438\u0441\u043f\u0435\u0447\u0435\u043d\u043d\u043e\u0433\u043e \u0445\u043b\u0435\u0431\u0430 \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u0431\u043e\u043b\u0435\u0435 \u0447\u0435\u043c 200 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0430\u0440\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u0439.<\/p>\n <\/div>\n `\n },\n 'fact4': {\n title: '\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f',\n content: `\n <h3 style=\"color: #ff7043; margin-bottom: 15px;\">\u0418\u0437\u043e\u0431\u0440\u0435\u0442\u0435\u043d\u0438\u0435 \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f \u0432 1846 \u0433\u043e\u0434\u0443<\/h3>\n \n <p>\u041d\u0435\u043c\u0435\u0446\u043a\u0438\u0439 \u0445\u0438\u043c\u0438\u043a \u042e\u0441\u0442\u0443\u0441 \u0444\u043e\u043d \u041b\u0438\u0431\u0438\u0445 \u0438\u0437\u043e\u0431\u0440\u0435\u043b \u043f\u0435\u0440\u0432\u044b\u0439 \u043a\u043e\u043c\u043c\u0435\u0440\u0447\u0435\u0441\u043a\u0438\u0439 \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044c, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u043e\u0438\u0437\u0432\u0435\u043b \u0440\u0435\u0432\u043e\u043b\u044e\u0446\u0438\u044e \u0432 \u0432\u044b\u043f\u0435\u0447\u043a\u0435.<\/p>\n \n <div style=\"margin: 20px 0;\">\n <strong>\u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442:<\/strong>\n <ul style=\"color: #666; line-height: 1.6; padding-left: 20px; margin-top: 10px;\">\n <li>\u0414\u043e 1846 \u0433\u043e\u0434\u0430: \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 \u0434\u0440\u043e\u0436\u0436\u0438 \u0438\u043b\u0438 \u0432\u0437\u0431\u0438\u0442\u044b\u0435 \u044f\u0438\u0447\u043d\u044b\u0435 \u0431\u0435\u043b\u043a\u0438<\/li>\n <li>1846: \u041b\u0438\u0431\u0438\u0445 \u0441\u043e\u0437\u0434\u0430\u043b \u0441\u043c\u0435\u0441\u044c \u0431\u0438\u043a\u0430\u0440\u0431\u043e\u043d\u0430\u0442\u0430 \u043d\u0430\u0442\u0440\u0438\u044f \u0438 \u0432\u0438\u043d\u043d\u043e\u0439 \u043a\u0438\u0441\u043b\u043e\u0442\u044b<\/li>\n <li>1850-\u0435: \u0443\u043b\u0443\u0447\u0448\u0435\u043d\u0438\u0435 \u0444\u043e\u0440\u043c\u0443\u043b\u044b \u0434\u043b\u044f \u0431\u043e\u043b\u0435\u0435 \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0430<\/li>\n <li>1890-\u0435: \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u0434\u0432\u043e\u0439\u043d\u043e\u0433\u043e \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f (\u0440\u0435\u0430\u043a\u0446\u0438\u044f \u043f\u0440\u0438 \u0441\u043c\u0435\u0448\u0438\u0432\u0430\u043d\u0438\u0438 \u0438 \u043f\u0440\u0438 \u043d\u0430\u0433\u0440\u0435\u0432\u0435)<\/li>\n <li>\u0421\u0435\u0433\u043e\u0434\u043d\u044f: \u0442\u043e\u0447\u043d\u044b\u0435 \u0444\u043e\u0440\u043c\u0443\u043b\u044b \u0434\u043b\u044f \u0440\u0430\u0437\u043d\u044b\u0445 \u0432\u0438\u0434\u043e\u0432 \u0432\u044b\u043f\u0435\u0447\u043a\u0438<\/li>\n <\/ul>\n <\/div>\n \n <div style=\"display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin-top: 20px;\">\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u0421\u043e\u0441\u0442\u0430\u0432 \u0440\u0430\u0437\u0440\u044b\u0445\u043b\u0438\u0442\u0435\u043b\u044f:<\/strong><br>\n \u2022 \u0411\u0438\u043a\u0430\u0440\u0431\u043e\u043d\u0430\u0442 \u043d\u0430\u0442\u0440\u0438\u044f (\u0441\u043e\u0434\u0430)<br>\n \u2022 \u041a\u0438\u0441\u043b\u043e\u0442\u0430 (\u0432\u0438\u043d\u043d\u0430\u044f, \u043b\u0438\u043c\u043e\u043d\u043d\u0430\u044f)<br>\n \u2022 \u041d\u0430\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c (\u043a\u0440\u0430\u0445\u043c\u0430\u043b)<br>\n \u2022 \u0421\u0442\u0430\u0431\u0438\u043b\u0438\u0437\u0430\u0442\u043e\u0440\u044b\n <\/div>\n <div style=\"background: rgba(255, 112, 67, 0.05); padding: 15px; border-radius: 10px;\">\n <strong>\u041a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442:<\/strong><br>\n 1. \u0412\u043b\u0430\u0433\u0430 \u0430\u043a\u0442\u0438\u0432\u0438\u0440\u0443\u0435\u0442 \u043a\u0438\u0441\u043b\u043e\u0442\u0443<br>\n 2. \u041a\u0438\u0441\u043b\u043e\u0442\u0430 \u0440\u0435\u0430\u0433\u0438\u0440\u0443\u0435\u0442 \u0441 \u0441\u043e\u0434\u043e\u0439<br>\n 3. \u0412\u044b\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f CO\u2082<br>\n 4. \u0413\u0430\u0437 \u043f\u043e\u0434\u043d\u0438\u043c\u0430\u0435\u0442 \u0442\u0435\u0441\u0442\u043e\n <\/div>\n <\/div>\n `\n }\n };\n\n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0434\u043b\u044f \u043f\u043e\u043a\u0430\u0437\u0430 \u0434\u0435\u0442\u0430\u043b\u044c\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438\n function showDetail(section) {\n const content = detailContent[section] || {\n title: '\u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f',\n content: '<p>\u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0430\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u0433\u043e\u0442\u043e\u0432\u0438\u0442\u0441\u044f \u043a \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438.<\/p>'\n };\n\n \/\/ \u0421\u043e\u0437\u0434\u0430\u0435\u043c \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0435 \u043e\u043a\u043d\u043e\n const modal = document.createElement('div');\n modal.className = 'modal-overlay';\n modal.innerHTML = `\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <div class=\"modal-title\">${content.title}<\/div>\n <button class=\"modal-close\" onclick=\"this.closest('.modal-overlay').remove()\">\u00d7<\/button>\n <\/div>\n <div class=\"modal-body\">\n ${content.content}\n <div style=\"margin-top: 30px; padding-top: 20px; border-top: 1px solid #eee;\">\n <p style=\"font-size: 0.9rem; color: #999; text-align: center;\">\n \u0414\u043b\u044f \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u043f\u043e\u0441\u0435\u0442\u0438\u0442\u0435 \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0432\u044b\u0448\u0435\n <\/p>\n <\/div>\n <\/div>\n <\/div>\n `;\n\n document.body.appendChild(modal);\n\n \/\/ \u0417\u0430\u043a\u0440\u044b\u0442\u0438\u0435 \u043f\u043e \u043a\u043b\u0438\u043a\u0443 \u043d\u0430 \u043e\u0432\u0435\u0440\u043b\u0435\u0439\n modal.addEventListener('click', function(e) {\n if (e.target === this) {\n this.remove();\n }\n });\n }\n\n \/\/ \u0418\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0439 \u0442\u0435\u0441\u0442\n function checkAnswer(element, type) {\n \/\/ \u0421\u043d\u0438\u043c\u0430\u0435\u043c \u0432\u0441\u0435 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0438\u0435 \u0432\u044b\u0434\u0435\u043b\u0435\u043d\u0438\u044f\n document.querySelectorAll('.quiz-option').forEach(opt => {\n opt.classList.remove('correct', 'incorrect');\n });\n \n \/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u043a\u043b\u0430\u0441\u0441 \u0434\u043b\u044f \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u043e\u0433\u043e \u043e\u0442\u0432\u0435\u0442\u0430\n element.classList.add(type);\n \n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\n const message = type === 'correct' \n ? '\ud83c\udf89 \u041f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e! \u0420\u0435\u0430\u043a\u0446\u0438\u044f \u041c\u0430\u0439\u044f\u0440\u0430 \u2014 \u044d\u0442\u043e \u0445\u0438\u043c\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0440\u0435\u0430\u043a\u0446\u0438\u044f \u043c\u0435\u0436\u0434\u0443 \u0430\u043c\u0438\u043d\u043e\u043a\u0438\u0441\u043b\u043e\u0442\u0430\u043c\u0438 \u0438 \u0441\u0430\u0445\u0430\u0440\u0430\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u0440\u0438 \u043d\u0430\u0433\u0440\u0435\u0432\u0430\u043d\u0438\u0438.'\n : '\u274c \u041d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e. \u041a\u0430\u0440\u0430\u043c\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u2014 \u044d\u0442\u043e \u043e\u043a\u0438\u0441\u043b\u0435\u043d\u0438\u0435 \u0441\u0430\u0445\u0430\u0440\u0430, \u0430 \u0440\u0435\u0430\u043a\u0446\u0438\u044f \u041c\u0430\u0439\u044f\u0440\u0430 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043c\u0435\u0436\u0434\u0443 \u0430\u043c\u0438\u043d\u043e\u043a\u0438\u0441\u043b\u043e\u0442\u0430\u043c\u0438 \u0438 \u0441\u0430\u0445\u0430\u0440\u0430\u043c\u0438.';\n \n \/\/ \u0421\u043e\u0437\u0434\u0430\u0435\u043c \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u0435\n const result = document.createElement('div');\n result.style.cssText = `\n position: fixed;\n bottom: 20px;\n left: 50%;\n transform: translateX(-50%);\n background: ${type === 'correct' ? '#4caf50' : '#f44336'};\n color: white;\n padding: 15px 30px;\n border-radius: 10px;\n z-index: 1000;\n box-shadow: 0 5px 20px rgba(0,0,0,0.2);\n animation: slideUp 0.3s ease;\n max-width: 500px;\n text-align: center;\n `;\n result.textContent = message;\n document.body.appendChild(result);\n \n \/\/ \u041c\u0435\u043d\u044f\u0435\u043c \u0432\u043e\u043f\u0440\u043e\u0441 \u0447\u0435\u0440\u0435\u0437 3 \u0441\u0435\u043a\u0443\u043d\u0434\u044b\n if (type === 'correct') {\n setTimeout(() => {\n result.remove();\n document.querySelectorAll('.quiz-option').forEach(opt => {\n opt.classList.remove('correct', 'incorrect');\n });\n \n \/\/ \u041d\u043e\u0432\u044b\u0435 \u0432\u043e\u043f\u0440\u043e\u0441\u044b \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0430\n const questions = [\n {\n question: '\u041f\u0440\u0438 \u043a\u0430\u043a\u043e\u0439 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043a\u0430\u0440\u0430\u043c\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0441\u0430\u0445\u0430\u0440\u0430?',\n options: ['100-110\u00b0C', '120-130\u00b0C', '160-180\u00b0C', '200-220\u00b0C'],\n correct: 2\n },\n {\n question: '\u0427\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442 \u0442\u0435\u0440\u043c\u0438\u043d \"\u0430\u043b\u044c \u0434\u0435\u043d\u0442\u0435\" \u0432 \u0438\u0442\u0430\u043b\u044c\u044f\u043d\u0441\u043a\u043e\u0439 \u043a\u0443\u0445\u043d\u0435?',\n options: ['\u0421\u043b\u0435\u0433\u043a\u0430 \u043d\u0435\u0434\u043e\u0432\u0430\u0440\u0435\u043d\u043d\u044b\u0439', '\u0421\u0438\u043b\u044c\u043d\u043e \u043f\u0435\u0440\u0435\u0432\u0430\u0440\u0435\u043d\u043d\u044b\u0439', '\u0421\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u0430\u044f \u043d\u0430\u0440\u0435\u0437\u043a\u0430', '\u0421 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435\u043c \u0441\u043f\u0435\u0446\u0438\u0439'],\n correct: 0\n },\n {\n question: '\u041a\u0430\u043a \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0442\u0435\u0445\u043d\u0438\u043a\u0430 \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u043e\u0431\u0436\u0430\u0440\u0438\u0432\u0430\u043d\u0438\u044f \u0432 \u043c\u0430\u0441\u043b\u0435 \u0441 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u044b\u043c \u043f\u043e\u043c\u0435\u0448\u0438\u0432\u0430\u043d\u0438\u0435\u043c?',\n options: ['\u0411\u043b\u0430\u043d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435', '\u0421\u043e\u0442\u0435', '\u041a\u043e\u043d\u0444\u0438', '\u0422\u0430\u043d\u0434\u0443\u0440\u0438'],\n correct: 1\n }\n ];\n \n const randomQuestion = questions[Math.floor(Math.random() * questions.length)];\n document.getElementById('quizQuestion').textContent = randomQuestion.question;\n \n const options = document.querySelectorAll('.quiz-option');\n options.forEach((option, index) => {\n option.textContent = randomQuestion.options[index];\n option.onclick = function() {\n checkAnswer(this, index === randomQuestion.correct ? 'correct' : 'incorrect');\n };\n });\n \n }, 3000);\n }\n \n setTimeout(() => {\n if (result.parentNode) {\n result.style.opacity = '0';\n result.style.transition = 'opacity 0.5s';\n setTimeout(() => result.remove(), 500);\n }\n }, 3000);\n }\n\n \/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0441\u0442\u0438\u043b\u0438 \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439\n const style = document.createElement('style');\n style.textContent = `\n @keyframes slideUp {\n 0% { transform: translateX(-50%) translateY(100px); opacity: 0; }\n 100% { transform: translateX(-50%) translateY(0); opacity: 1; }\n }\n `;\n document.head.appendChild(style);\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>\u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u041f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u0443\u0439\u0442\u0435 \u043c\u0435\u0440\u044b, \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0443 \u0438 \u0437\u0430\u043c\u0435\u043d\u0438\u0442\u0435 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u044b \u0432 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0445 \u0440\u0435\u0446\u0435\u043f\u0442\u0430\u0445 \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u043c\u0435\u0440 \u041e\u0431\u044a\u0435\u043c\/\u0412\u0435\u0441 \u0422\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0430 \u0417\u0430\u043c\u0435\u043d\u0430 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432 \u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442: \u041c\u0443\u043a\u0430 \u043f\u0448\u0435\u043d\u0438\u0447\u043d\u0430\u044f \u0421\u0430\u0445\u0430\u0440 \u0421\u0430\u0445\u0430\u0440\u043d\u0430\u044f \u043f\u0443\u0434\u0440\u0430 \u041c\u0430\u0441\u043b\u043e \u0441\u043b\u0438\u0432\u043e\u0447\u043d\u043e\u0435 \u041c\u0430\u0441\u043b\u043e \u0440\u0430\u0441\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u041c\u043e\u043b\u043e\u043a\u043e \u0412\u043e\u0434\u0430 \u0420\u0438\u0441 \u0413\u0440\u0435\u0447\u043a\u0430 \u0414\u0440\u0443\u0433\u0438\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b: \u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u0438\u0437 \u0441\u043f\u0438\u0441\u043a\u0430… \u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435: \u0418\u0417 \u0413\u0440\u0430\u043c\u043c\u044b (\u0433)\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (\u043a\u0433)\u0421\u0442\u0430\u043a\u0430\u043d (200 \u043c\u043b)\u0421\u0442\u0430\u043a\u0430\u043d (250 \u043c\u043b)\u0421\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430\u0427\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430\u0427\u0430\u0448\u043a\u0430 (US,…<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kadence_starter_templates_imported_post":false,"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"class_list":["post-289","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"http:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages\/289","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/gestro.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=289"}],"version-history":[{"count":9,"href":"http:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages\/289\/revisions"}],"predecessor-version":[{"id":309,"href":"http:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages\/289\/revisions\/309"}],"wp:attachment":[{"href":"http:\/\/gestro.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=289"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}