\u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430<\/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, #4CAF50 0%, #2E7D32 100%);\n color: #333;\n line-height: 1.6;\n min-height: 100vh;\n padding: 20px;\n overflow-x: hidden;\n }\n \n .container {\n max-width: 1400px;\n margin: 0 auto;\n padding: 0 15px;\n width: 100%;\n overflow-x: hidden;\n }\n \n .header {\n text-align: center;\n margin-bottom: 40px;\n color: white;\n text-shadow: 0 2px 10px rgba(0,0,0,0.2);\n padding: 0 10px;\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.95;\n max-width: 800px;\n margin: 0 auto;\n color: #f0f0f0;\n text-shadow: 0 1px 3px rgba(0,0,0,0.3);\n }\n \n .main-grid {\n display: grid;\n grid-template-columns: 1fr 1.5fr;\n gap: 30px;\n margin-bottom: 40px;\n width: 100%;\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.15);\n width: 100%;\n overflow: hidden;\n }\n \n .converter-section {\n background: rgba(255, 255, 255, 0.95);\n backdrop-filter: blur(10px);\n }\n \n .history-card {\n background: rgba(255, 255, 255, 0.95);\n backdrop-filter: blur(10px);\n border-radius: 25px;\n padding: 35px;\n box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);\n width: 100%;\n overflow: hidden;\n }\n \n .section-title {\n color: #2c3e50;\n margin-bottom: 25px;\n display: flex;\n align-items: center;\n gap: 15px;\n font-size: 1.8rem;\n word-break: break-word;\n }\n \n .section-title i {\n color: #4CAF50;\n }\n \n \/* \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 *\/\n .converter-form {\n display: flex;\n flex-direction: column;\n gap: 25px;\n width: 100%;\n }\n \n .input-group {\n position: relative;\n width: 100%;\n }\n \n .input-group label {\n display: block;\n margin-bottom: 10px;\n font-weight: 600;\n color: #2c3e50;\n font-size: 1.1rem;\n }\n \n .input-with-icon {\n position: relative;\n width: 100%;\n }\n \n .input-with-icon input {\n width: 100%;\n padding: 18px 20px 18px 60px;\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 box-sizing: border-box;\n }\n \n .input-with-icon input:focus {\n border-color: #4CAF50;\n background: white;\n box-shadow: 0 5px 20px rgba(76, 175, 80, 0.1);\n outline: none;\n }\n \n .input-icon {\n position: absolute;\n left: 20px;\n top: 50%;\n transform: translateY(-50%);\n color: #4CAF50;\n font-size: 1.3rem;\n font-weight: bold;\n }\n \n \/* \u0411\u043b\u043e\u043a \u0441 \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0430\u043c\u0438 \"\u0418\u0417\" \u0438 \"\u0412\" *\/\n .unit-selector-with-hints {\n display: flex;\n align-items: center;\n gap: 15px;\n margin-top: 15px;\n width: 100%;\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: #ffffff;\n padding: 3px 10px;\n border-radius: 12px;\n z-index: 3;\n display: flex;\n align-items: center;\n gap: 4px;\n box-shadow: 0 2px 5px rgba(0,0,0,0.1);\n }\n \n .unit-hint-from {\n top: -10px;\n left: 10px;\n background: linear-gradient(135deg, #4CAF50 0%, #2E7D32 100%);\n }\n \n .unit-hint-to {\n bottom: -10px;\n right: 10px;\n background: linear-gradient(135deg, #2196F3 0%, #21CBF3 100%);\n }\n \n .unit-hint i {\n font-size: 0.6rem;\n }\n \n .unit-selector-with-hints select {\n width: 100%;\n padding: 15px;\n border: 3px solid #e0e0e0;\n border-radius: 15px;\n font-size: 1rem;\n font-weight: 600;\n background: #f8f9fa;\n cursor: pointer;\n transition: all 0.3s;\n }\n \n .unit-selector-with-hints select:focus {\n border-color: #4CAF50;\n outline: none;\n background: white;\n }\n \n .swap-button {\n width: 50px;\n height: 50px;\n border-radius: 50%;\n background: linear-gradient(135deg, #4CAF50 0%, #2E7D32 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(76, 175, 80, 0.4);\n }\n \n .result-display {\n background: linear-gradient(135deg, #2196F3 0%, #21CBF3 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(33, 150, 243, 0.2);\n width: 100%;\n box-sizing: border-box;\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 word-break: break-word;\n overflow-wrap: break-word;\n }\n \n .result-unit {\n font-size: 1.3rem;\n opacity: 0.9;\n font-weight: 600;\n word-break: break-word;\n }\n \n .quick-conversions {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 15px;\n margin-top: 30px;\n width: 100%;\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 min-width: 0;\n overflow: hidden;\n }\n \n .quick-conversion-item:hover {\n border-color: #4CAF50;\n transform: translateY(-5px);\n box-shadow: 0 10px 20px rgba(76, 175, 80, 0.1);\n }\n \n .quick-value {\n font-size: 1.5rem;\n font-weight: 700;\n color: #2c3e50;\n margin: 10px 0 5px;\n word-break: break-word;\n }\n \n .quick-unit {\n font-size: 0.9rem;\n color: #666;\n }\n \n \/* \u0412\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f *\/\n .visualization {\n margin-top: 30px;\n padding: 25px;\n background: white;\n border-radius: 20px;\n border: 2px solid #e0e0e0;\n width: 100%;\n box-sizing: border-box;\n overflow: hidden;\n }\n \n .scale-container {\n height: 120px;\n background: linear-gradient(90deg, #f0f0f0 0%, #e0e0e0 100%);\n border-radius: 10px;\n position: relative;\n margin: 30px 0;\n overflow: hidden;\n width: 100%;\n }\n \n .scale-marker {\n position: absolute;\n height: 100%;\n width: 3px;\n background: #4CAF50;\n top: 0;\n transform: translateX(-50%);\n transition: left 1s ease;\n }\n \n .scale-marker::after {\n content: '';\n position: absolute;\n bottom: -10px;\n left: 50%;\n transform: translateX(-50%);\n width: 0;\n height: 0;\n border-left: 10px solid transparent;\n border-right: 10px solid transparent;\n border-top: 10px solid #4CAF50;\n }\n \n .scale-labels {\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n font-size: 0.9rem;\n color: #666;\n font-weight: 600;\n width: 100%;\n flex-wrap: wrap;\n }\n \n .scale-labels span {\n flex: 1;\n min-width: 60px;\n text-align: center;\n }\n \n .comparison-items {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 15px;\n margin-top: 30px;\n width: 100%;\n }\n \n .comparison-item {\n text-align: center;\n padding: 20px;\n background: #f8f9fa;\n border-radius: 15px;\n transition: all 0.3s;\n min-width: 0;\n overflow: hidden;\n }\n \n .comparison-item:hover {\n background: #E8F5E9;\n transform: scale(1.05);\n }\n \n .comparison-icon {\n font-size: 2rem;\n color: #4CAF50;\n margin-bottom: 10px;\n }\n \n .comparison-value {\n font-size: 1.2rem;\n font-weight: 700;\n color: #2c3e50;\n margin: 5px 0;\n word-break: break-word;\n }\n \n \/* \u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043c\u0435\u0440\u044b *\/\n .history-timeline {\n position: relative;\n padding-left: 30px;\n margin: 30px 0;\n width: 100%;\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, #4CAF50, #2E7D32);\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 #4CAF50;\n box-shadow: 0 5px 15px rgba(0,0,0,0.05);\n width: 100%;\n box-sizing: border-box;\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: #4CAF50;\n border: 3px solid white;\n box-shadow: 0 0 0 3px #4CAF50;\n }\n \n .history-period {\n font-weight: 700;\n color: #4CAF50;\n margin-bottom: 8px;\n font-size: 1.1rem;\n word-break: break-word;\n }\n \n .history-description {\n color: #666;\n line-height: 1.5;\n }\n \n \/* \u0415\u0434\u0438\u043d\u0438\u0446\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f *\/\n .units-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));\n gap: 15px;\n margin-top: 25px;\n width: 100%;\n }\n \n .unit-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 cursor: pointer;\n min-width: 0;\n overflow: hidden;\n }\n \n .unit-card:hover {\n border-color: #4CAF50;\n transform: translateY(-5px);\n }\n \n .unit-card.active {\n border-color: #4CAF50;\n background: #E8F5E9;\n box-shadow: 0 10px 20px rgba(76, 175, 80, 0.1);\n }\n \n .unit-symbol {\n font-size: 2rem;\n font-weight: 700;\n color: #4CAF50;\n margin-bottom: 10px;\n word-break: break-all;\n }\n \n .unit-name {\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 5px;\n word-break: break-word;\n }\n \n .unit-value {\n font-size: 0.9rem;\n color: #666;\n word-break: break-word;\n }\n \n \/* \u041a\u043d\u043e\u043f\u043a\u0438 *\/\n .action-buttons {\n display: flex;\n gap: 15px;\n margin-top: 30px;\n flex-wrap: wrap;\n width: 100%;\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 box-sizing: border-box;\n }\n \n .btn-primary {\n background: linear-gradient(135deg, #4CAF50 0%, #2E7D32 100%);\n color: white;\n }\n \n .btn-secondary {\n background: #f8f9fa;\n color: #2c3e50;\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 .btn-primary:hover {\n box-shadow: 0 10px 20px rgba(76, 175, 80, 0.3);\n }\n \n \/* \u0424\u0443\u0442\u0435\u0440 *\/\n .footer {\n text-align: center;\n margin-top: 50px;\n color: white;\n opacity: 0.8;\n font-size: 0.9rem;\n padding: 0 10px;\n width: 100%;\n }\n \n \/* \u0410\u0414\u0410\u041f\u0422\u0418\u0412\u041d\u041e\u0421\u0422\u042c *\/\n @media (max-width: 768px) {\n body {\n padding: 10px;\n }\n \n .container {\n padding: 0 10px;\n max-width: 100%;\n }\n \n .header h1 {\n font-size: 2rem;\n line-height: 1.3;\n padding: 0 5px;\n }\n \n .header p {\n font-size: 1rem;\n padding: 0 5px;\n }\n \n .calculator-card,\n .history-card {\n padding: 20px;\n border-radius: 20px;\n margin: 0 -5px;\n width: calc(100% + 10px);\n }\n \n .section-title {\n font-size: 1.5rem;\n flex-wrap: wrap;\n gap: 10px;\n }\n \n .result-value {\n font-size: 2.5rem;\n line-height: 1.2;\n }\n \n .input-with-icon input {\n padding: 15px 15px 15px 50px;\n font-size: 1.1rem;\n }\n \n .unit-selector-with-hints {\n flex-direction: column;\n gap: 10px;\n }\n \n .unit-select-container {\n width: 100%;\n }\n \n .unit-hint-from {\n top: -10px;\n left: 10px;\n }\n \n .unit-hint-to {\n bottom: -10px;\n right: 10px;\n }\n \n .swap-button {\n align-self: center;\n margin: 5px 0;\n }\n \n .quick-conversions {\n grid-template-columns: repeat(2, 1fr);\n gap: 10px;\n }\n \n .quick-conversion-item {\n padding: 15px;\n }\n \n .quick-value {\n font-size: 1.3rem;\n }\n \n .comparison-items {\n grid-template-columns: 1fr;\n gap: 10px;\n }\n \n .units-grid {\n grid-template-columns: repeat(2, 1fr);\n gap: 10px;\n }\n \n .unit-card {\n padding: 15px;\n }\n \n .unit-symbol {\n font-size: 1.5rem;\n }\n \n .visualization {\n padding: 20px;\n }\n \n .history-timeline {\n padding-left: 20px;\n }\n \n .history-item {\n padding: 20px;\n margin-bottom: 20px;\n }\n \n .history-item::before {\n left: -30px;\n width: 16px;\n height: 16px;\n }\n \n .action-buttons {\n flex-direction: column;\n gap: 10px;\n }\n \n .action-btn {\n min-width: 100%;\n padding: 16px;\n }\n \n .formula-box {\n padding: 12px;\n font-size: 0.9rem;\n overflow-x: auto;\n }\n \n .info-box {\n padding: 15px;\n font-size: 0.9rem;\n }\n }\n \n @media (max-width: 480px) {\n .header h1 {\n font-size: 1.8rem;\n }\n \n .header p {\n font-size: 0.95rem;\n }\n \n .calculator-card,\n .history-card {\n padding: 15px;\n }\n \n .section-title {\n font-size: 1.3rem;\n }\n \n .result-value {\n font-size: 2rem;\n }\n \n .result-unit {\n font-size: 1.1rem;\n }\n \n .quick-conversions {\n grid-template-columns: 1fr;\n }\n \n .units-grid {\n grid-template-columns: 1fr;\n }\n \n .input-with-icon input {\n font-size: 1rem;\n padding: 12px 12px 12px 45px;\n }\n \n .input-icon {\n left: 15px;\n font-size: 1.1rem;\n }\n \n .unit-selector-with-hints select {\n font-size: 0.9rem;\n }\n \n .history-timeline {\n padding-left: 15px;\n }\n \n .history-item {\n padding: 15px;\n }\n \n .history-period {\n font-size: 1rem;\n }\n \n .history-description {\n font-size: 0.9rem;\n }\n \n .comparison-value {\n font-size: 1rem;\n }\n }\n \n \/* \u0418\u0441\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u043e\u0447\u0435\u043d\u044c \u043c\u0430\u043b\u0435\u043d\u044c\u043a\u0438\u0445 \u044d\u043a\u0440\u0430\u043d\u043e\u0432 *\/\n @media (max-width: 360px) {\n .container {\n padding: 0 5px;\n }\n \n .calculator-card,\n .history-card {\n padding: 12px;\n border-radius: 15px;\n }\n \n .header h1 {\n font-size: 1.6rem;\n }\n \n .section-title {\n font-size: 1.2rem;\n }\n \n .result-value {\n font-size: 1.8rem;\n }\n \n .input-with-icon input {\n padding: 10px 10px 10px 40px;\n font-size: 0.9rem;\n }\n }\n \n \/* \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0438 *\/\n @keyframes pulse {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.05); }\n 100% { transform: scale(1); }\n }\n \n .pulse {\n animation: pulse 0.5s ease;\n }\n \n \/* \u0421\u043f\u0440\u0430\u0432\u043a\u0430 *\/\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 width: 100%;\n box-sizing: border-box;\n }\n \n .formula-box {\n background: #f8f9fa;\n padding: 15px;\n border-radius: 10px;\n margin: 15px 0;\n font-family: monospace;\n border: 1px dashed #ddd;\n width: 100%;\n box-sizing: border-box;\n overflow-x: auto;\n }\n \n \/* \u041a\u043d\u043e\u043f\u043a\u0430 \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 *\/\n .reload-button {\n background: #e74c3c;\n color: white;\n border: none;\n padding: 12px 24px;\n border-radius: 10px;\n cursor: pointer;\n font-size: 0.9rem;\n margin-top: 15px;\n transition: all 0.3s;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n width: 100%;\n max-width: 300px;\n justify-content: center;\n box-sizing: border-box;\n }\n \n .reload-button:hover {\n background: #c0392b;\n transform: translateY(-2px);\n box-shadow: 0 5px 15px rgba(231, 76, 60, 0.3);\n }\n \n \/* \u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0438\u0441\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u043f\u0440\u0435\u0434\u043e\u0442\u0432\u0440\u0430\u0449\u0435\u043d\u0438\u044f \u043f\u0435\u0440\u0435\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f *\/\n .units-grid[style*=\"grid-template-columns: repeat(auto-fill, minmax(160px, 1fr))\"] {\n grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)) !important;\n }\n \n @media (max-width: 768px) {\n .units-grid[style*=\"grid-template-columns: repeat(auto-fill, minmax(160px, 1fr))\"] {\n grid-template-columns: repeat(2, 1fr) !important;\n }\n }\n \n @media (max-width: 480px) {\n .units-grid[style*=\"grid-template-columns: repeat(auto-fill, minmax(160px, 1fr))\"] {\n grid-template-columns: 1fr !important;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n \n <div class=\"header\">\n <h1><i class=\"fas fa-weight\"><\/i> \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430<\/h1>\n <p>\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0438\u0440\u0443\u0439\u0442\u0435 \u043c\u0435\u0436\u0434\u0443 \u043c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u043c\u0438, \u0438\u043c\u043f\u0435\u0440\u0441\u043a\u0438\u043c\u0438 \u0438 \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u043c\u0438 \u0435\u0434\u0438\u043d\u0438\u0446\u0430\u043c\u0438 \u043c\u0430\u0441\u0441\u044b \u0441 \u043d\u0430\u0443\u0447\u043d\u043e\u0439 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c\u044e<\/p>\n <\/div>\n \n \n <div class=\"main-grid\">\n \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 \u0432\u0435\u0441\u0430\n <\/h2>\n \n <div class=\"converter-form\">\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=\"1\" step=\"any\" min=\"0\">\n <span class=\"input-icon\">#<\/span>\n <\/div>\n <\/div>\n \n \n <div class=\"unit-selector-with-hints\">\n <div class=\"unit-select-container\">\n <div class=\"unit-hint unit-hint-from\">\n <i class=\"fas fa-long-arrow-alt-right\"><\/i>\n <span>\u0418\u0417<\/span>\n <\/div>\n <select id=\"fromUnit\">\n <option value=\"kg\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (kg)<\/option>\n <option value=\"g\">\u0413\u0440\u0430\u043c\u043c\u044b (g)<\/option>\n <option value=\"mg\">\u041c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c\u044b (mg)<\/option>\n <option value=\"t\">\u0422\u043e\u043d\u043d\u044b (t)<\/option>\n <option value=\"lb\">\u0424\u0443\u043d\u0442\u044b (lb)<\/option>\n <option value=\"oz\">\u0423\u043d\u0446\u0438\u0438 (oz)<\/option>\n <option value=\"carat\">\u041a\u0430\u0440\u0430\u0442\u044b (ct)<\/option>\n <option value=\"stone\">\u0421\u0442\u043e\u0443\u043d\u044b (st)<\/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\">\n <span>\u0412<\/span>\n <i class=\"fas fa-long-arrow-alt-right\"><\/i>\n <\/div>\n <select id=\"toUnit\">\n <option value=\"g\">\u0413\u0440\u0430\u043c\u043c\u044b (g)<\/option>\n <option value=\"kg\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (kg)<\/option>\n <option value=\"mg\">\u041c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c\u044b (mg)<\/option>\n <option value=\"lb\">\u0424\u0443\u043d\u0442\u044b (lb)<\/option>\n <option value=\"oz\">\u0423\u043d\u0446\u0438\u0438 (oz)<\/option>\n <option value=\"t\">\u041c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0442\u043e\u043d\u043d\u044b (t)<\/option>\n <option value=\"carat\">\u041a\u0430\u0440\u0430\u0442\u044b (ct)<\/option>\n <option value=\"stone\">\u0421\u0442\u043e\u0443\u043d\u044b (st)<\/option>\n <\/select>\n <\/div>\n <\/div>\n \n \n <div class=\"result-display\">\n <div id=\"resultValue\" class=\"result-value\">1000<\/div>\n <div id=\"resultUnit\" class=\"result-unit\">\u0433\u0440\u0430\u043c\u043c\u043e\u0432<\/div>\n <\/div>\n \n \n <div class=\"quick-conversions\">\n <div class=\"quick-conversion-item\" data-to=\"g\">\n <div class=\"quick-value\" id=\"quickG\">1000<\/div>\n <div class=\"quick-unit\">\u0413\u0440\u0430\u043c\u043c\u044b<\/div>\n <\/div>\n <div class=\"quick-conversion-item\" data-to=\"lb\">\n <div class=\"quick-value\" id=\"quickLb\">2.2046<\/div>\n <div class=\"quick-unit\">\u0424\u0443\u043d\u0442\u044b<\/div>\n <\/div>\n <div class=\"quick-conversion-item\" data-to=\"oz\">\n <div class=\"quick-value\" id=\"quickOz\">35.274<\/div>\n <div class=\"quick-unit\">\u0423\u043d\u0446\u0438\u0438<\/div>\n <\/div>\n <div class=\"quick-conversion-item\" data-to=\"carat\">\n <div class=\"quick-value\" id=\"quickCarat\">5000<\/div>\n <div class=\"quick-unit\">\u041a\u0430\u0440\u0430\u0442\u044b<\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"visualization\">\n <h3 style=\"color: #2c3e50; margin-bottom: 20px;\">\n <i class=\"fas fa-balance-scale\"><\/i> \u0412\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0430\n <\/h3>\n \n <div class=\"scale-container\">\n <div class=\"scale-marker\" id=\"scaleMarker\" style=\"left: 50%;\"><\/div>\n <\/div>\n \n <div class=\"scale-labels\">\n <span id=\"minLabel\">0<\/span>\n <span id=\"midLabel\">\u0421\u0440\u0435\u0434\u043d\u0435\u0435<\/span>\n <span id=\"maxLabel\">2 \u043a\u0433<\/span>\n <\/div>\n \n <div class=\"comparison-items\">\n <div class=\"comparison-item\">\n <div class=\"comparison-icon\">\n <i class=\"fas fa-apple-alt\"><\/i>\n <\/div>\n <div class=\"comparison-value\" id=\"comparison1\">\u2248 1 \u044f\u0431\u043b\u043e\u043a\u043e<\/div>\n <div>150 \u0433<\/div>\n <\/div>\n <div class=\"comparison-item\">\n <div class=\"comparison-icon\">\n <i class=\"fas fa-hamburger\"><\/i>\n <\/div>\n <div class=\"comparison-value\" id=\"comparison2\">\u2248 2.2 \u0433\u0430\u043c\u0431\u0443\u0440\u0433\u0435\u0440\u0430<\/div>\n <div>\u0411\u0438\u0433 \u041c\u0430\u043a (220 \u0433)<\/div>\n <\/div>\n <div class=\"comparison-item\">\n <div class=\"comparison-icon\">\n <i class=\"fas fa-car\"><\/i>\n <\/div>\n <div class=\"comparison-value\" id=\"comparison3\">\u2248 0.001 \u0430\u0432\u0442\u043e<\/div>\n <div>\u0421\u0440\u0435\u0434\u043d\u0438\u0439 \u0432\u0435\u0441<\/div>\n <\/div>\n <\/div>\n <\/div>\n \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 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\n <\/button>\n <\/div>\n \n \n <div style=\"text-align: center; margin-top: 20px;\">\n <button class=\"reload-button\" id=\"reloadCalcBtn\">\n <i class=\"fas fa-sync-alt\"><\/i> \u041f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044c \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \n <\/button>\n <\/div>\n <\/div>\n \n \n <div class=\"history-card\">\n <h2 class=\"section-title\">\n <i class=\"fas fa-history\"><\/i> \u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043c\u0435\u0440\u044b \u0432\u0435\u0441\u0430\n <\/h2>\n \n <div class=\"info-box\">\n <p><strong>\u0418\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u0444\u0430\u043a\u0442:<\/strong> \u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u2014 \u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u0430\u044f \u0435\u0434\u0438\u043d\u0438\u0446\u0430 \u0421\u0418, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0434\u043e \u0441\u0438\u0445 \u043f\u043e\u0440 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f \u0447\u0435\u0440\u0435\u0437 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0430\u0440\u0442\u0435\u0444\u0430\u043a\u0442 (\u043c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0439 \u043f\u0440\u043e\u0442\u043e\u0442\u0438\u043f \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430).<\/p>\n <\/div>\n \n \n <div class=\"units-grid\">\n <div class=\"unit-card\" data-unit=\"pood\">\n <div class=\"unit-symbol\">\u041f<\/div>\n <div class=\"unit-name\">\u041f\u0443\u0434<\/div>\n <div class=\"unit-value\">\u2248 16.38 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"funt\">\n <div class=\"unit-symbol\">\u0424<\/div>\n <div class=\"unit-name\">\u0424\u0443\u043d\u0442 (\u0440\u0443\u0441.)<\/div>\n <div class=\"unit-value\">\u2248 409.5 \u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"berkovets\">\n <div class=\"unit-symbol\">\u0411<\/div>\n <div class=\"unit-name\">\u0411\u0435\u0440\u043a\u043e\u0432\u0435\u0446<\/div>\n <div class=\"unit-value\">\u2248 163.8 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"lot\">\n <div class=\"unit-symbol\">\u041b<\/div>\n <div class=\"unit-name\">\u041b\u043e\u0442<\/div>\n <div class=\"unit-value\">\u2248 12.8 \u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"zolotnik\">\n <div class=\"unit-symbol\">\u0417<\/div>\n <div class=\"unit-name\">\u0417\u043e\u043b\u043e\u0442\u043d\u0438\u043a<\/div>\n <div class=\"unit-value\">\u2248 4.27 \u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"dolya\">\n <div class=\"unit-symbol\">\u0414<\/div>\n <div class=\"unit-name\">\u0414\u043e\u043b\u044f<\/div>\n <div class=\"unit-value\">\u2248 0.044 \u0433<\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"history-timeline\">\n <div class=\"history-item\">\n <div class=\"history-period\">\u0414\u0440\u0435\u0432\u043d\u0438\u0439 \u0412\u0430\u0432\u0438\u043b\u043e\u043d (~2500 \u0434\u043e \u043d.\u044d.)<\/div>\n <div class=\"history-description\">\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 \u0441\u0438\u0441\u0442\u0435\u043c\u0443 \u0432\u0435\u0441\u0430 \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0448\u0435\u043a\u0435\u043b\u044f (~8.4 \u0433) \u0434\u043b\u044f \u0442\u043e\u0440\u0433\u043e\u0432\u043b\u0438 \u0437\u043e\u043b\u043e\u0442\u043e\u043c \u0438 \u0441\u0435\u0440\u0435\u0431\u0440\u043e\u043c.<\/div>\n <\/div>\n <div class=\"history-item\">\n <div class=\"history-period\">\u0414\u0440\u0435\u0432\u043d\u0438\u0439 \u0420\u0438\u043c<\/div>\n <div class=\"history-description\">«\u041b\u0438\u0431\u0440\u0430» (\u0440\u0438\u043c\u0441\u043a\u0438\u0439 \u0444\u0443\u043d\u0442) \u2248 327.45 \u0433. «\u0423\u043d\u0446\u0438\u044f» = 1\/12 \u043b\u0438\u0431\u0440\u044b \u2248 27.29 \u0433.<\/div>\n <\/div>\n <div class=\"history-item\">\n <div class=\"history-period\">\u0421\u0440\u0435\u0434\u043d\u0435\u0432\u0435\u043a\u043e\u0432\u0430\u044f \u0420\u0443\u0441\u044c<\/div>\n <div class=\"history-description\">\u041f\u0443\u0434 (16.38 \u043a\u0433), \u0444\u0443\u043d\u0442 (409.5 \u0433), \u0431\u0435\u0440\u043a\u043e\u0432\u0435\u0446 (163.8 \u043a\u0433). \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438\u0441\u044c \u0434\u043b\u044f \u0442\u043e\u0440\u0433\u043e\u0432\u043b\u0438 \u0437\u0435\u0440\u043d\u043e\u043c.<\/div>\n <\/div>\n <div class=\"history-item\">\n <div class=\"history-period\">1799 \u0433\u043e\u0434 — \u041c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u0430<\/div>\n <div class=\"history-description\">\u0424\u0440\u0430\u043d\u0446\u0438\u044f \u0432\u0432\u043e\u0434\u0438\u0442 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u043a\u0430\u043a \u043c\u0430\u0441\u0441\u0443 1 \u043a\u0443\u0431\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0434\u0435\u0446\u0438\u043c\u0435\u0442\u0440\u0430 \u0432\u043e\u0434\u044b \u043f\u0440\u0438 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0435 4\u00b0C.<\/div>\n <\/div>\n <div class=\"history-item\">\n <div class=\"history-period\">2019 \u0433\u043e\u0434 — \u041f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430<\/div>\n <div class=\"history-description\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u0443\u044e \u041f\u043b\u0430\u043d\u043a\u0430, \u0447\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u043b\u043e \u0435\u0433\u043e \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u044b\u043c \u043e\u0442 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0430\u0440\u0442\u0435\u0444\u0430\u043a\u0442\u0430.<\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"formula-box\">\n <strong>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0444\u043e\u0440\u043c\u0443\u043b\u044b \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438:<\/strong><br>\n 1 \u043a\u0433 = 1000 \u0433 = 1 000 000 \u043c\u0433<br>\n 1 \u0444\u0443\u043d\u0442 = 453.59237 \u0433 \u2248 0.4536 \u043a\u0433<br>\n 1 \u0443\u043d\u0446\u0438\u044f = 28.34952 \u0433 \u2248 0.02835 \u043a\u0433<br>\n 1 \u043a\u0430\u0440\u0430\u0442 = 0.2 \u0433 = 200 \u043c\u0433<br>\n 1 \u0441\u0442\u043e\u0443\u043d = 6.35029 \u043a\u0433 \u2248 14 \u0444\u0443\u043d\u0442\u043e\u0432<br>\n 1 \u0442\u043e\u043d\u043d\u0430 = 1000 \u043a\u0433\n <\/div>\n \n \n <h3 style=\"color: #2c3e50; margin: 30px 0 20px;\">\n <i class=\"fas fa-weight-hanging\"><\/i> \u0412\u0441\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f\n <\/h3>\n \n <div class=\"units-grid\" style=\"grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));\">\n <div class=\"unit-card\" data-unit=\"t\">\n <div class=\"unit-symbol\">t<\/div>\n <div class=\"unit-name\">\u041c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0442\u043e\u043d\u043d\u0430<\/div>\n <div class=\"unit-value\">1000 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"kg\">\n <div class=\"unit-symbol\">kg<\/div>\n <div class=\"unit-name\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c<\/div>\n <div class=\"unit-value\">\u0411\u0430\u0437\u043e\u0432\u0430\u044f \u0435\u0434\u0438\u043d\u0438\u0446\u0430<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"g\">\n <div class=\"unit-symbol\">g<\/div>\n <div class=\"unit-name\">\u0413\u0440\u0430\u043c\u043c<\/div>\n <div class=\"unit-value\">0.001 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"mg\">\n <div class=\"unit-symbol\">mg<\/div>\n <div class=\"unit-name\">\u041c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c<\/div>\n <div class=\"unit-value\">0.000001 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"\u00b5g\">\n <div class=\"unit-symbol\">\u00b5g<\/div>\n <div class=\"unit-name\">\u041c\u0438\u043a\u0440\u043e\u0433\u0440\u0430\u043c\u043c<\/div>\n <div class=\"unit-value\">10\u207b\u2079 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"lb\">\n <div class=\"unit-symbol\">lb<\/div>\n <div class=\"unit-name\">\u0424\u0443\u043d\u0442<\/div>\n <div class=\"unit-value\">0.45359237 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"oz\">\n <div class=\"unit-symbol\">oz<\/div>\n <div class=\"unit-name\">\u0423\u043d\u0446\u0438\u044f<\/div>\n <div class=\"unit-value\">0.02834952 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"stone\">\n <div class=\"unit-symbol\">st<\/div>\n <div class=\"unit-name\">\u0421\u0442\u043e\u0443\u043d<\/div>\n <div class=\"unit-value\">6.35029 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"carat\">\n <div class=\"unit-symbol\">ct<\/div>\n <div class=\"unit-name\">\u041a\u0430\u0440\u0430\u0442<\/div>\n <div class=\"unit-value\">0.0002 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"grain\">\n <div class=\"unit-symbol\">gr<\/div>\n <div class=\"unit-name\">\u0413\u0440\u0430\u043d<\/div>\n <div class=\"unit-value\">0.0000648 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"ton_us\">\n <div class=\"unit-symbol\">sh tn<\/div>\n <div class=\"unit-name\">\u0410\u043c\u0435\u0440. \u0442\u043e\u043d\u043d\u0430<\/div>\n <div class=\"unit-value\">907.18474 \u043a\u0433<\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"footer\">\n <p>\u00a9 2026 \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430 | \u0422\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u0434\u043e 15 \u0437\u043d\u0430\u043a\u043e\u0432 \u043f\u043e\u0441\u043b\u0435 \u0437\u0430\u043f\u044f\u0442\u043e\u0439 | \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0434\u0430\u043d\u043d\u044b\u0435 ISO \u0438 \u043c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0445 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432<\/p>\n <\/div>\n <\/div>\n\n <script>\n\/\/ \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c IIFE \u0438 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u0439 \u0434\u043b\u044f \u0433\u0430\u0440\u0430\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u0437\u0430\u043f\u0443\u0441\u043a\u0430\n(function() {\n console.log('=== \u041a\u0410\u041b\u042c\u041a\u0423\u041b\u042f\u0422\u041e\u0420 \u0412\u0415\u0421\u0410 \u041d\u0410\u0427\u0418\u041d\u0410\u0415\u0422 \u0417\u0410\u0413\u0420\u0423\u0417\u041a\u0423 ===');\n \n let calculatorInitialized = false;\n let calculatorElements = null;\n \n function initializeCalculator() {\n if (calculatorInitialized) {\n console.log('\u041a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440 \u0443\u0436\u0435 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d, \u043f\u0440\u043e\u043f\u0443\u0441\u043a\u0430\u0435\u043c...');\n return;\n }\n calculatorInitialized = true;\n \n console.log('\u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430 \u0432\u0435\u0441\u0430...');\n \n try {\n calculatorElements = initCalculator();\n console.log('\u041a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440 \u0432\u0435\u0441\u0430 \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d');\n \n \/\/ \u0424\u043e\u0440\u0441\u0438\u0440\u0443\u0435\u043c \u043f\u0435\u0440\u0432\u044b\u0439 \u0440\u0430\u0441\u0447\u0435\u0442\n setTimeout(() => {\n const calculateBtn = document.getElementById('calculateBtn');\n if (calculateBtn) {\n console.log('\u0412\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u043c \u043f\u0435\u0440\u0432\u044b\u0439 \u0440\u0430\u0441\u0447\u0435\u0442...');\n calculateBtn.click();\n }\n }, 100);\n \n \/\/ \u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u043c \u043c\u043e\u043d\u0438\u0442\u043e\u0440\u0438\u043d\u0433\n setupMonitoring();\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 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430:', error);\n const resultValue = document.getElementById('resultValue');\n if (resultValue) {\n resultValue.textContent = '\u041e\u0448\u0438\u0431\u043a\u0430 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438';\n resultValue.style.color = '#e74c3c';\n }\n calculatorInitialized = false;\n }\n }\n \n \/\/ \u0417\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u043c \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 console.log('\u041e\u0436\u0438\u0434\u0430\u0435\u043c DOMContentLoaded...');\n } else {\n console.log('DOM \u0443\u0436\u0435 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d, \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u043c \u0441\u0440\u0430\u0437\u0443...');\n initializeCalculator();\n }\n \n \/\/ \u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u0437\u0430\u043f\u0443\u0441\u043a \u043f\u0440\u0438 \u043f\u043e\u043b\u043d\u043e\u0439 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b\n window.addEventListener('load', function() {\n console.log('\u0421\u043e\u0431\u044b\u0442\u0438\u0435 window.load \u0441\u0440\u0430\u0431\u043e\u0442\u0430\u043b\u043e');\n if (!calculatorInitialized) {\n console.log('\u0417\u0430\u043f\u0443\u0441\u043a \u0447\u0435\u0440\u0435\u0437 window.load');\n initializeCalculator();\n }\n });\n \n \/\/ \u042d\u043a\u0441\u0442\u0440\u0435\u043d\u043d\u044b\u0439 \u0437\u0430\u043f\u0443\u0441\u043a \u0447\u0435\u0440\u0435\u0437 3 \u0441\u0435\u043a\u0443\u043d\u0434\u044b, \u0435\u0441\u043b\u0438 \u0432\u0441\u0435 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u043e\u0435 \u043d\u0435 \u0441\u0440\u0430\u0431\u043e\u0442\u0430\u043b\u043e\n setTimeout(() => {\n if (!calculatorInitialized) {\n console.log('\u042d\u043a\u0441\u0442\u0440\u0435\u043d\u043d\u044b\u0439 \u0437\u0430\u043f\u0443\u0441\u043a \u043f\u043e \u0442\u0430\u0439\u043c\u0430\u0443\u0442\u0443');\n initializeCalculator();\n }\n }, 3000);\n \n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u043c\u043e\u043d\u0438\u0442\u043e\u0440\u0438\u043d\u0433\u0430 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f\n function setupMonitoring() {\n setInterval(() => {\n if (!calculatorElements) return;\n \n try {\n const value = parseFloat(calculatorElements.inputValue.value) || 0;\n const from = calculatorElements.fromUnit.value;\n const to = calculatorElements.toUnit.value;\n const result = calculatorElements.convert(value, from, to);\n \n console.log('\u041c\u043e\u043d\u0438\u0442\u043e\u0440\u0438\u043d\u0433 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430 \u0432\u0435\u0441\u0430:', {\n \u0432\u0440\u0435\u043c\u044f: new Date().toLocaleTimeString(),\n \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435: value,\n \u0438\u0437: from,\n \u0432: to,\n \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442: result,\n \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442\u0441\u044f: calculatorElements.resultValue.textContent,\n \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d: calculatorInitialized\n });\n } catch (e) {\n console.log('\u041e\u0448\u0438\u0431\u043a\u0430 \u043c\u043e\u043d\u0438\u0442\u043e\u0440\u0438\u043d\u0433\u0430:', e);\n }\n }, 10000);\n }\n \n \/\/ \u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0434\u043b\u044f \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430\n window.reloadCalculator = function() {\n console.log('\u041f\u0440\u0438\u043d\u0443\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0430 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430 \u0432\u0435\u0441\u0430...');\n calculatorInitialized = false;\n initializeCalculator();\n \n const reloadBtn = document.getElementById('reloadCalcBtn');\n if (reloadBtn) {\n const originalHTML = reloadBtn.innerHTML;\n reloadBtn.innerHTML = '<i class=\"fas fa-check\"><\/i> \u041f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d\u043e!';\n reloadBtn.style.background = '#27ae60';\n setTimeout(() => {\n reloadBtn.innerHTML = originalHTML;\n reloadBtn.style.background = '';\n }, 2000);\n }\n };\n \n})();\n\n\/\/ \u041e\u0441\u043d\u043e\u0432\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430\nfunction initCalculator() {\n console.log('\u0424\u0443\u043d\u043a\u0446\u0438\u044f initCalculator \u0434\u043b\u044f \u0432\u0435\u0441\u0430 \u0432\u044b\u0437\u0432\u0430\u043d\u0430');\n \n \/\/ \u041f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0432\u0441\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \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 reloadCalcBtn: document.getElementById('reloadCalcBtn'),\n scaleMarker: document.getElementById('scaleMarker'),\n maxLabel: document.getElementById('maxLabel'),\n minLabel: document.getElementById('minLabel'),\n midLabel: document.getElementById('midLabel')\n };\n \n \/\/ \u041f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u0432\u0441\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b\n for (const [key, element] of Object.entries(elements)) {\n if (!element) {\n console.error('\u042d\u043b\u0435\u043c\u0435\u043d\u0442 \u043d\u0435 \u043d\u0430\u0439\u0434\u0435\u043d: ' + key);\n } else {\n console.log('\u042d\u043b\u0435\u043c\u0435\u043d\u0442 \u043d\u0430\u0439\u0434\u0435\u043d: ' + key);\n }\n }\n \n \/\/ \u041a\u043e\u044d\u0444\u0444\u0438\u0446\u0438\u0435\u043d\u0442\u044b \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438 (\u0432 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b)\n const factors = {\n \/\/ \u041c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u0430\n 'kg': 1,\n 'g': 0.001,\n 'mg': 0.000001,\n '\u00b5g': 0.000000001,\n 't': 1000,\n \n \/\/ \u0418\u043c\u043f\u0435\u0440\u0441\u043a\u0430\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u0430\n 'lb': 0.45359237,\n 'oz': 0.02834952,\n 'stone': 6.35029,\n 'carat': 0.0002,\n 'grain': 0.0000648,\n 'ton_us': 907.18474,\n \n \/\/ \u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0440\u0443\u0441\u0441\u043a\u0438\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b\n 'pood': 16.3805,\n 'funt': 0.4095,\n 'berkovets': 163.8,\n 'lot': 0.0128,\n 'zolotnik': 0.00427,\n 'dolya': 0.000044\n };\n \n \/\/ \u041d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0435\u0434\u0438\u043d\u0438\u0446 (\u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435, \u0441\u0440\u0435\u0434\u043d\u0435\u0435, \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435)\n const unitNames = {\n 'kg': ['\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 'g': ['\u0433\u0440\u0430\u043c\u043c', '\u0433\u0440\u0430\u043c\u043c\u0430', '\u0433\u0440\u0430\u043c\u043c\u043e\u0432'],\n 'mg': ['\u043c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c', '\u043c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c\u0430', '\u043c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c\u043e\u0432'],\n 't': ['\u0442\u043e\u043d\u043d\u0430', '\u0442\u043e\u043d\u043d\u044b', '\u0442\u043e\u043d\u043d'],\n 'lb': ['\u0444\u0443\u043d\u0442', '\u0444\u0443\u043d\u0442\u0430', '\u0444\u0443\u043d\u0442\u043e\u0432'],\n 'oz': ['\u0443\u043d\u0446\u0438\u044f', '\u0443\u043d\u0446\u0438\u0438', '\u0443\u043d\u0446\u0438\u0439'],\n 'stone': ['\u0441\u0442\u043e\u0443\u043d', '\u0441\u0442\u043e\u0443\u043d\u0430', '\u0441\u0442\u043e\u0443\u043d\u043e\u0432'],\n 'carat': ['\u043a\u0430\u0440\u0430\u0442', '\u043a\u0430\u0440\u0430\u0442\u0430', '\u043a\u0430\u0440\u0430\u0442']\n };\n \n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438\n function convert(value, from, to) {\n if (!factors[from] || !factors[to]) {\n console.error('\u041d\u0435\u0438\u0437\u0432\u0435\u0441\u0442\u043d\u0430\u044f \u0435\u0434\u0438\u043d\u0438\u0446\u0430: from=' + from + ', to=' + to);\n return 0;\n }\n \n const valueInKg = value * factors[from];\n return valueInKg \/ factors[to];\n }\n \n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0444\u043e\u0440\u043c\u0430\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0447\u0438\u0441\u043b\u0430\n function formatNumber(num) {\n if (num === 0 || isNaN(num)) return '0';\n \n const absNum = Math.abs(num);\n \n if (absNum >= 1000000) {\n return num.toExponential(2).replace('e+', '\u00d710^');\n } else if (absNum >= 1000) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 2 });\n } else if (absNum >= 1) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 4 });\n } else if (absNum >= 0.001) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 6 });\n } else {\n return num.toExponential(2).replace('e-', '\u00d710^-');\n }\n }\n \n \/\/ \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0444\u043e\u0440\u043c\u044b \u0441\u043b\u043e\u0432\u0430 - \u0418\u0421\u041f\u0420\u0410\u0412\u041b\u0415\u041d\u041e \u0414\u041b\u042f WORDPRESS\n function getUnitForm(result, unitKey) {\n if (!unitNames[unitKey]) 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];\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 \/\/ \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0435 \u0443\u0441\u043b\u043e\u0432\u0438\u044f \u0434\u043b\u044f WordPress\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];\n }\n \n \/\/ \u0414\u043b\u044f \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0445 \u0441\u043b\u0443\u0447\u0430\u0435\u0432\n return unitNames[unitKey][2];\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0441\u0435\u0445 \u0434\u0430\u043d\u043d\u044b\u0445\n function updateAll() {\n try {\n const value = parseFloat(elements.inputValue.value) || 0;\n const from = elements.fromUnit.value;\n const to = elements.toUnit.value;\n \n \/\/ \u0412\u044b\u0447\u0438\u0441\u043b\u044f\u0435\u043c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\n const result = convert(value, from, to);\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\n elements.resultValue.textContent = formatNumber(result);\n elements.resultUnit.textContent = getUnitForm(result, to);\n \n \/\/ \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 \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e\n updateVisualization(value, from);\n \n \/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e\n elements.resultValue.classList.remove('pulse');\n void elements.resultValue.offsetWidth;\n elements.resultValue.classList.add('pulse');\n \n console.log('\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u044f \u0432\u0435\u0441\u0430: ' + value + ' ' + from + ' = ' + result + ' ' + to);\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 elements.resultValue.textContent = '\u041e\u0428\u0418\u0411\u041a\u0410';\n elements.resultUnit.textContent = '';\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\n function updateQuickConversions(value, from) {\n const quickUnits = ['g', 'lb', 'oz', 'carat'];\n \n quickUnits.forEach(unit => {\n const elementId = 'quick' + unit.charAt(0).toUpperCase() + unit.slice(1);\n const element = document.getElementById(elementId);\n if (element) {\n const result = convert(value, from, unit);\n element.textContent = formatNumber(result);\n }\n });\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438\n function updateVisualization(value, from) {\n try {\n const valueInKg = value * factors[from];\n \n \/\/ \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u043c \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u0448\u043a\u0430\u043b\u044b\n let maxValue = 1;\n let maxLabel = \"1 \u043a\u0433\";\n \n if (valueInKg < 0.001) {\n maxValue = 0.001;\n maxLabel = \"1 \u0433\";\n } else if (valueInKg < 0.01) {\n maxValue = 0.01;\n maxLabel = \"10 \u0433\";\n } else if (valueInKg < 0.1) {\n maxValue = 0.1;\n maxLabel = \"100 \u0433\";\n } else if (valueInKg < 1) {\n maxValue = 1;\n maxLabel = \"1 \u043a\u0433\";\n } else if (valueInKg < 10) {\n maxValue = 10;\n maxLabel = \"10 \u043a\u0433\";\n } else if (valueInKg < 100) {\n maxValue = 100;\n maxLabel = \"100 \u043a\u0433\";\n } else {\n maxValue = Math.ceil(valueInKg \/ 100) * 100;\n maxLabel = formatNumber(maxValue) + \" \u043a\u0433\";\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u043c\u0435\u0442\u043a\u0443\n if (elements.maxLabel) {\n elements.maxLabel.textContent = maxLabel;\n }\n \n \/\/ \u041f\u043e\u0437\u0438\u0446\u0438\u044f \u043c\u0430\u0440\u043a\u0435\u0440\u0430\n let position = (valueInKg \/ maxValue) * 100;\n position = Math.max(0, Math.min(100, position));\n \n if (elements.scaleMarker) {\n elements.scaleMarker.style.left = position + '%';\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u044f\n updateComparisons(valueInKg);\n \n } catch (error) {\n console.error('\u041e\u0448\u0438\u0431\u043a\u0430 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438:', error);\n }\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u0439\n function updateComparisons(valueInKg) {\n const comparisons = [\n { id: 'comparison1', unit: 0.15, name: '\u044f\u0431\u043b\u043e\u043a' },\n { id: 'comparison2', unit: 0.22, name: '\u0433\u0430\u043c\u0431\u0443\u0440\u0433\u0435\u0440' },\n { id: 'comparison3', unit: 1500, name: '\u0430\u0432\u0442\u043e' }\n ];\n \n comparisons.forEach(comp => {\n const element = document.getElementById(comp.id);\n if (element) {\n const count = valueInKg \/ comp.unit;\n \n \/\/ \u0424\u043e\u0440\u043c\u0430\u0442\u0438\u0440\u0443\u0435\u043c \u0447\u0438\u0441\u043b\u043e\n let formattedCount;\n if (count === 0) formattedCount = '0';\n else if (Math.abs(count) >= 1000) formattedCount = count.toFixed(0);\n else if (Math.abs(count) >= 100) formattedCount = count.toFixed(0);\n else if (Math.abs(count) >= 10) formattedCount = count.toFixed(1);\n else if (Math.abs(count) >= 1) formattedCount = count.toFixed(2);\n else formattedCount = count.toFixed(3);\n \n \/\/ \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u043c \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u0435 - \u0418\u0421\u041f\u0420\u0410\u0412\u041b\u0415\u041d\u041e \u0414\u041b\u042f WORDPRESS\n let ending = '';\n const absCount = Math.abs(count);\n const lastDigit = Math.floor(absCount) % 10;\n const lastTwoDigits = Math.floor(absCount) % 100;\n \n if (comp.name === '\u044f\u0431\u043b\u043e\u043a') {\n if (Math.abs(absCount - 1) < 0.01) ending = '\u043e';\n else {\n var cond1 = lastDigit >= 2;\n var cond2 = lastDigit <= 4;\n var cond3 = lastTwoDigits < 10;\n var cond4 = lastTwoDigits >= 20;\n \n if (cond1 && cond2 && (cond3 || cond4)) {\n ending = '\u0430';\n } else {\n ending = '';\n }\n }\n } else if (comp.name === '\u0433\u0430\u043c\u0431\u0443\u0440\u0433\u0435\u0440') {\n if (Math.abs(absCount - 1) < 0.01) ending = '';\n else {\n var cond1 = lastDigit >= 2;\n var cond2 = lastDigit <= 4;\n var cond3 = lastTwoDigits < 10;\n var cond4 = lastTwoDigits >= 20;\n \n if (cond1 && cond2 && (cond3 || cond4)) {\n ending = '\u0430';\n } else {\n ending = '\u043e\u0432';\n }\n }\n } else if (comp.name === '\u0430\u0432\u0442\u043e') {\n if (Math.abs(absCount - 1) < 0.01) ending = '';\n else {\n var cond1 = lastDigit >= 2;\n var cond2 = lastDigit <= 4;\n var cond3 = lastTwoDigits < 10;\n var cond4 = lastTwoDigits >= 20;\n \n if (cond1 && cond2 && (cond3 || cond4)) {\n ending = '';\n } else {\n ending = '';\n }\n }\n }\n \n element.textContent = '\u2248 ' + formattedCount + ' ' + comp.name + ending;\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 \n \/\/ \u041f\u0440\u0438\u043d\u0443\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u0440\u0438 \u0444\u043e\u043a\u0443\u0441\u0435 \u043d\u0430 \u043f\u043e\u043b\u0435 \u0432\u0432\u043e\u0434\u0430\n if (elements.inputValue) {\n elements.inputValue.addEventListener('focus', function() {\n updateAll();\n });\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u0440\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 \u0447\u0435\u0440\u0435\u0437 \u043a\u043d\u043e\u043f\u043a\u0438\n if (elements.inputValue) elements.inputValue.addEventListener('change', updateAll);\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 elements.inputValue.value = '1';\n elements.fromUnit.value = 'kg';\n elements.toUnit.value = 'g';\n updateAll();\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 }\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 const text = elements.resultValue.textContent + ' ' + elements.resultUnit.textContent;\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 }).catch(err => {\n console.error('\u041e\u0448\u0438\u0431\u043a\u0430 \u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f:', err);\n alert('\u041d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442');\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 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 } catch (err) {\n console.error('\u041e\u0448\u0438\u0431\u043a\u0430 \u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f:', err);\n alert('\u041d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442');\n }\n document.body.removeChild(textArea);\n }\n });\n }\n \n \/\/ \u041a\u043d\u043e\u043f\u043a\u0430 \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430\n if (elements.reloadCalcBtn) {\n elements.reloadCalcBtn.addEventListener('click', function() {\n window.reloadCalculator();\n });\n }\n \n \/\/ \u0411\u044b\u0441\u0442\u0440\u044b\u0435 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438\n document.querySelectorAll('.quick-conversion-item').forEach(item => {\n item.addEventListener('click', function() {\n const targetUnit = this.getAttribute('data-to');\n if (targetUnit && elements.toUnit) {\n elements.toUnit.value = targetUnit;\n updateAll();\n \n \/\/ \u041f\u043e\u0434\u0441\u0432\u0435\u0442\u043a\u0430\n document.querySelectorAll('.quick-conversion-item').forEach(i => {\n i.classList.remove('active');\n });\n this.classList.add('active');\n setTimeout(() => this.classList.remove('active'), 1000);\n }\n });\n });\n \n \/\/ \u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b \u0438 \u0432\u0441\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b\n document.querySelectorAll('.unit-card[data-unit]').forEach(card => {\n card.addEventListener('click', function() {\n const unit = this.getAttribute('data-unit');\n const value = parseFloat(elements.inputValue.value) || 0;\n const from = elements.fromUnit.value;\n \n \/\/ \u0414\u043b\u044f \u0432\u0441\u0435\u0445 \u0435\u0434\u0438\u043d\u0438\u0446 \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\n const result = convert(value, from, unit);\n \n \/\/ \u0421\u043e\u0437\u0434\u0430\u0435\u043c \u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0435 \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u0435\n const toast = document.createElement('div');\n toast.style.cssText = 'position: fixed; bottom: 20px; right: 20px; background: #4CAF50; color: white; padding: 15px; border-radius: 10px; z-index: 1000; box-shadow: 0 4px 12px rgba(0,0,0,0.2);';\n toast.textContent = formatNumber(value) + ' ' + (unitNames[from] ? unitNames[from][2] : from) + ' = ' + formatNumber(result) + ' ' + unit;\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 \/\/ \u041f\u043e\u0434\u0441\u0432\u0435\u0442\u043a\u0430\n document.querySelectorAll('.unit-card').forEach(c => {\n c.classList.remove('active');\n });\n this.classList.add('active');\n setTimeout(() => this.classList.remove('active'), 1500);\n });\n });\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 }, 100);\n \n \/\/ \u0412\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0434\u043b\u044f \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u0438\u0437\u0432\u043d\u0435\n return {\n elements: elements,\n convert: convert,\n updateAll: updateAll,\n updateQuickConversions: updateQuickConversions,\n updateVisualization: updateVisualization\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>\u0420\u0435\u0441\u0443\u0440\u0441\u044b \u043f\u043e \u0442\u0435\u043c\u0435 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430<\/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, #f8f9fa 0%, #e9ecef 100%);\n color: #333;\n line-height: 1.6;\n min-height: 100vh;\n padding: 20px;\n }\n \n .resources-container {\n max-width: 1400px;\n margin: 0 auto;\n padding: 0 15px;\n }\n \n .resources-header {\n text-align: center;\n margin-bottom: 40px;\n padding: 30px;\n background: linear-gradient(135deg, #4CAF50 0%, #2E7D32 100%);\n border-radius: 20px;\n color: white;\n box-shadow: 0 10px 30px rgba(76, 175, 80, 0.2);\n }\n \n .resources-header h1 {\n font-size: 2.5rem;\n margin-bottom: 15px;\n }\n \n .resources-header p {\n font-size: 1.2rem;\n opacity: 0.95;\n max-width: 800px;\n margin: 0 auto;\n }\n \n .tabs-container {\n display: flex;\n gap: 10px;\n margin-bottom: 30px;\n flex-wrap: wrap;\n background: white;\n padding: 20px;\n border-radius: 15px;\n box-shadow: 0 5px 20px rgba(0,0,0,0.08);\n }\n \n .tab-btn {\n padding: 12px 24px;\n background: #f8f9fa;\n border: 2px solid #e0e0e0;\n border-radius: 10px;\n cursor: pointer;\n font-weight: 600;\n color: #2c3e50;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n \n .tab-btn:hover {\n background: #E8F5E9;\n border-color: #4CAF50;\n transform: translateY(-2px);\n }\n \n .tab-btn.active {\n background: #4CAF50;\n color: white;\n border-color: #4CAF50;\n }\n \n .tab-content {\n display: none;\n animation: fadeIn 0.5s ease;\n }\n \n .tab-content.active {\n display: block;\n }\n \n @keyframes fadeIn {\n from { opacity: 0; transform: translateY(10px); }\n to { opacity: 1; transform: translateY(0); }\n }\n \n .resources-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));\n gap: 25px;\n margin-bottom: 40px;\n }\n \n @media (max-width: 768px) {\n .resources-grid {\n grid-template-columns: 1fr;\n }\n }\n \n .resource-card {\n background: white;\n border-radius: 15px;\n overflow: hidden;\n box-shadow: 0 10px 25px rgba(0,0,0,0.08);\n transition: all 0.3s;\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n \n .resource-card:hover {\n transform: translateY(-10px);\n box-shadow: 0 20px 40px rgba(0,0,0,0.12);\n }\n \n .resource-header {\n padding: 25px 25px 15px;\n background: linear-gradient(135deg, #2196F3 0%, #21CBF3 100%);\n color: white;\n position: relative;\n }\n \n .resource-header.nist {\n background: linear-gradient(135deg, #0056b3 0%, #0066cc 100%);\n }\n \n .resource-header.royal {\n background: linear-gradient(135deg, #c62828 0%, #d32f2f 100%);\n }\n \n .resource-header.mit {\n background: linear-gradient(135deg, #8a2387 0%, #e94057 100%);\n }\n \n .resource-header.iso {\n background: linear-gradient(135deg, #008000 0%, #00cc00 100%);\n }\n \n .resource-header.npl {\n background: linear-gradient(135deg, #003399 0%, #3366cc 100%);\n }\n \n .resource-header.nature {\n background: linear-gradient(135deg, #0d47a1 0%, #1976d2 100%);\n }\n \n .resource-icon {\n position: absolute;\n top: 20px;\n right: 20px;\n font-size: 2rem;\n opacity: 0.8;\n }\n \n .resource-title {\n font-size: 1.4rem;\n font-weight: 700;\n margin-bottom: 8px;\n max-width: 80%;\n }\n \n .resource-type {\n display: inline-block;\n padding: 4px 12px;\n background: rgba(255,255,255,0.2);\n border-radius: 20px;\n font-size: 0.8rem;\n font-weight: 600;\n margin-bottom: 10px;\n }\n \n .resource-content {\n padding: 25px;\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n }\n \n .resource-description {\n color: #666;\n margin-bottom: 20px;\n line-height: 1.5;\n flex-grow: 1;\n }\n \n .resource-features {\n margin-bottom: 20px;\n }\n \n .feature-item {\n display: flex;\n align-items: center;\n gap: 10px;\n margin-bottom: 10px;\n color: #555;\n }\n \n .feature-item i {\n color: #4CAF50;\n font-size: 0.9rem;\n }\n \n .resource-actions {\n display: flex;\n gap: 10px;\n margin-top: auto;\n }\n \n .btn-visit {\n flex: 1;\n padding: 12px 20px;\n background: #4CAF50;\n color: white;\n border: none;\n border-radius: 8px;\n cursor: pointer;\n font-weight: 600;\n text-decoration: none;\n text-align: center;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n }\n \n .btn-visit:hover {\n background: #45a049;\n transform: translateY(-2px);\n box-shadow: 0 5px 15px rgba(76, 175, 80, 0.3);\n }\n \n .btn-details {\n padding: 12px 20px;\n background: #f8f9fa;\n color: #2c3e50;\n border: 2px solid #e0e0e0;\n border-radius: 8px;\n cursor: pointer;\n font-weight: 600;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n }\n \n .btn-details:hover {\n background: #e9ecef;\n border-color: #4CAF50;\n }\n \n \/* Interactive Timeline *\/\n .timeline-section {\n background: white;\n border-radius: 20px;\n padding: 30px;\n margin-bottom: 40px;\n box-shadow: 0 10px 30px rgba(0,0,0,0.08);\n }\n \n .timeline-title {\n color: #2c3e50;\n margin-bottom: 25px;\n font-size: 1.8rem;\n display: flex;\n align-items: center;\n gap: 15px;\n }\n \n .timeline {\n position: relative;\n padding-left: 30px;\n max-width: 800px;\n margin: 0 auto;\n }\n \n .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, #4CAF50, #2196F3);\n }\n \n .timeline-item {\n position: relative;\n margin-bottom: 30px;\n padding: 25px;\n background: #f8f9fa;\n border-radius: 15px;\n border-left: 5px solid #4CAF50;\n cursor: pointer;\n transition: all 0.3s;\n }\n \n .timeline-item:hover {\n background: #E8F5E9;\n transform: translateX(10px);\n }\n \n .timeline-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: #4CAF50;\n border: 3px solid white;\n box-shadow: 0 0 0 3px #4CAF50;\n }\n \n .timeline-year {\n font-weight: 700;\n color: #4CAF50;\n margin-bottom: 8px;\n font-size: 1.1rem;\n }\n \n \/* FAQ Section *\/\n .faq-section {\n background: white;\n border-radius: 20px;\n padding: 30px;\n margin-bottom: 40px;\n box-shadow: 0 10px 30px rgba(0,0,0,0.08);\n }\n \n .faq-title {\n color: #2c3e50;\n margin-bottom: 25px;\n font-size: 1.8rem;\n display: flex;\n align-items: center;\n gap: 15px;\n }\n \n .faq-item {\n margin-bottom: 15px;\n border: 2px solid #e0e0e0;\n border-radius: 10px;\n overflow: hidden;\n }\n \n .faq-question {\n padding: 20px;\n background: #f8f9fa;\n cursor: pointer;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n justify-content: space-between;\n align-items: center;\n transition: all 0.3s;\n }\n \n .faq-question:hover {\n background: #E8F5E9;\n }\n \n .faq-question.active {\n background: #4CAF50;\n color: white;\n }\n \n .faq-answer {\n padding: 0;\n max-height: 0;\n overflow: hidden;\n transition: all 0.3s ease;\n background: white;\n }\n \n .faq-answer.active {\n padding: 20px;\n max-height: 500px;\n }\n \n .faq-answer ul {\n padding-left: 20px;\n margin: 10px 0;\n }\n \n .faq-answer li {\n margin-bottom: 8px;\n }\n \n \/* Knowledge Quiz *\/\n .quiz-section {\n background: white;\n border-radius: 20px;\n padding: 30px;\n margin-bottom: 40px;\n box-shadow: 0 10px 30px rgba(0,0,0,0.08);\n }\n \n .quiz-title {\n color: #2c3e50;\n margin-bottom: 25px;\n font-size: 1.8rem;\n display: flex;\n align-items: center;\n gap: 15px;\n }\n \n .quiz-progress {\n height: 8px;\n background: #e0e0e0;\n border-radius: 4px;\n margin-bottom: 20px;\n overflow: hidden;\n }\n \n .quiz-progress-bar {\n height: 100%;\n background: #4CAF50;\n width: 0%;\n transition: width 0.3s ease;\n }\n \n .quiz-question {\n font-size: 1.2rem;\n font-weight: 600;\n margin-bottom: 20px;\n color: #2c3e50;\n }\n \n .quiz-options {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 15px;\n margin-bottom: 25px;\n }\n \n .quiz-option {\n padding: 15px;\n background: #f8f9fa;\n border: 2px solid #e0e0e0;\n border-radius: 10px;\n cursor: pointer;\n transition: all 0.3s;\n text-align: center;\n }\n \n .quiz-option:hover {\n background: #E8F5E9;\n border-color: #4CAF50;\n }\n \n .quiz-option.selected {\n background: #4CAF50;\n color: white;\n border-color: #4CAF50;\n }\n \n .quiz-option.correct {\n background: #4CAF50;\n color: white;\n border-color: #4CAF50;\n }\n \n .quiz-option.incorrect {\n background: #f44336;\n color: white;\n border-color: #f44336;\n }\n \n .quiz-navigation {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n \n .quiz-btn {\n padding: 12px 24px;\n background: #4CAF50;\n color: white;\n border: none;\n border-radius: 8px;\n cursor: pointer;\n font-weight: 600;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n \n .quiz-btn:hover:not(:disabled) {\n background: #45a049;\n transform: translateY(-2px);\n }\n \n .quiz-btn:disabled {\n background: #cccccc;\n cursor: not-allowed;\n }\n \n .quiz-score {\n font-weight: 600;\n color: #2c3e50;\n }\n \n \/* Related Tools *\/\n .tools-section {\n background: white;\n border-radius: 20px;\n padding: 30px;\n margin-bottom: 40px;\n box-shadow: 0 10px 30px rgba(0,0,0,0.08);\n }\n \n .tools-title {\n color: #2c3e50;\n margin-bottom: 25px;\n font-size: 1.8rem;\n display: flex;\n align-items: center;\n gap: 15px;\n }\n \n .tools-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 20px;\n }\n \n .tool-card {\n background: #f8f9fa;\n border-radius: 15px;\n padding: 25px;\n text-align: center;\n border: 2px solid #e0e0e0;\n transition: all 0.3s;\n cursor: pointer;\n }\n \n .tool-card:hover {\n background: #E8F5E9;\n border-color: #4CAF50;\n transform: translateY(-5px);\n }\n \n .tool-icon {\n font-size: 3rem;\n color: #4CAF50;\n margin-bottom: 15px;\n }\n \n .tool-name {\n font-weight: 700;\n color: #2c3e50;\n margin-bottom: 10px;\n font-size: 1.3rem;\n }\n \n .tool-desc {\n color: #666;\n margin-bottom: 20px;\n font-size: 0.95rem;\n }\n \n \/* Footer *\/\n .resources-footer {\n text-align: center;\n padding: 30px;\n background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);\n border-radius: 20px;\n color: white;\n margin-bottom: 20px;\n }\n \n .resources-footer p {\n margin-bottom: 15px;\n opacity: 0.9;\n }\n \n .social-links {\n display: flex;\n justify-content: center;\n gap: 15px;\n margin-top: 20px;\n }\n \n .social-link {\n width: 45px;\n height: 45px;\n background: rgba(255,255,255,0.1);\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n color: white;\n text-decoration: none;\n transition: all 0.3s;\n }\n \n .social-link:hover {\n background: #4CAF50;\n transform: translateY(-3px);\n }\n \n \/* Modal *\/\n .modal {\n display: none;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: rgba(0,0,0,0.5);\n z-index: 1000;\n justify-content: center;\n align-items: center;\n animation: fadeIn 0.3s ease;\n }\n \n .modal-content {\n background: white;\n border-radius: 20px;\n padding: 30px;\n max-width: 500px;\n width: 90%;\n max-height: 80vh;\n overflow-y: auto;\n position: relative;\n box-shadow: 0 20px 50px rgba(0,0,0,0.2);\n }\n \n .modal-close {\n position: absolute;\n top: 15px;\n right: 15px;\n background: none;\n border: none;\n font-size: 1.5rem;\n cursor: pointer;\n color: #666;\n }\n \n .modal-close:hover {\n color: #f44336;\n }\n \n .modal-title {\n color: #2c3e50;\n margin-bottom: 20px;\n font-size: 1.5rem;\n }\n \n \/* Responsive *\/\n @media (max-width: 768px) {\n .resources-header h1 {\n font-size: 2rem;\n }\n \n .tabs-container {\n flex-direction: column;\n }\n \n .tab-btn {\n width: 100%;\n }\n \n .resource-actions {\n flex-direction: column;\n }\n \n .quiz-options {\n grid-template-columns: 1fr;\n }\n \n .tools-grid {\n grid-template-columns: 1fr;\n }\n \n .timeline {\n padding-left: 20px;\n }\n \n .timeline-item::before {\n left: -30px;\n width: 16px;\n height: 16px;\n }\n }\n \n @media (max-width: 480px) {\n .resources-header {\n padding: 20px;\n }\n \n .resources-header h1 {\n font-size: 1.8rem;\n }\n \n .tab-btn {\n padding: 10px 20px;\n font-size: 0.9rem;\n }\n \n .resource-content {\n padding: 20px;\n }\n \n .resource-title {\n font-size: 1.2rem;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"resources-container\">\n \n <div class=\"resources-header\">\n <h1><i class=\"fas fa-book-open\"><\/i> \u042d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u044f \u043c\u0435\u0440 \u0432\u0435\u0441\u0430 \u0438 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b<\/h1>\n <p>\u0410\u0432\u0442\u043e\u0440\u0438\u0442\u0435\u0442\u043d\u044b\u0435 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u0438, \u043d\u0430\u0443\u0447\u043d\u044b\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u0438 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0434\u043b\u044f \u0433\u043b\u0443\u0431\u043e\u043a\u043e\u0433\u043e \u0438\u0437\u0443\u0447\u0435\u043d\u0438\u044f \u0442\u0435\u043c\u044b<\/p>\n <\/div>\n \n \n <div class=\"tabs-container\">\n <button class=\"tab-btn active\" data-tab=\"all\">\n <i class=\"fas fa-globe\"><\/i> \u0412\u0441\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b\n <\/button>\n <button class=\"tab-btn\" data-tab=\"official\">\n <i class=\"fas fa-landmark\"><\/i> \u041e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0438\n <\/button>\n <button class=\"tab-btn\" data-tab=\"scientific\">\n <i class=\"fas fa-flask\"><\/i> \u041d\u0430\u0443\u0447\u043d\u044b\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f\n <\/button>\n <button class=\"tab-btn\" data-tab=\"educational\">\n <i class=\"fas fa-graduation-cap\"><\/i> \u041e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b\n <\/button>\n <button class=\"tab-btn\" data-tab=\"tools\">\n <i class=\"fas fa-tools\"><\/i> \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0438 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u044b\n <\/button>\n <\/div>\n \n \n <div id=\"all\" class=\"tab-content active\">\n <div class=\"resources-grid\">\n \n <div class=\"resource-card\" data-category=\"official\">\n <div class=\"resource-header nist\">\n <div class=\"resource-title\">NIST — \u041d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u0438\u043d\u0441\u0442\u0438\u0442\u0443\u0442 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432 \u0421\u0428\u0410<\/div>\n <div class=\"resource-type\">\u041e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0439 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442<\/div>\n <div class=\"resource-icon\"><i class=\"fas fa-balance-scale\"><\/i><\/div>\n <\/div>\n <div class=\"resource-content\">\n <p class=\"resource-description\">\u0412\u0435\u0434\u0443\u0449\u0430\u044f \u043c\u0438\u0440\u043e\u0432\u0430\u044f \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u044f \u043f\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044e \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432 \u043c\u0435\u0440 \u0438 \u0432\u0435\u0441\u043e\u0432. \u041e\u0442\u0432\u0435\u0447\u0430\u0435\u0442 \u0437\u0430 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432 \u0421\u0418 \u0432 \u0421\u0428\u0410.<\/p>\n <div class=\"resource-features\">\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u0435\u0434\u0438\u043d\u0438\u0446 \u0421\u0418<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041c\u0435\u0442\u043e\u0434\u0438\u043a\u0438 \u0442\u043e\u0447\u043d\u044b\u0445 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/span>\n <\/div>\n <\/div>\n <div class=\"resource-actions\">\n <a href=\"https:\/\/www.nist.gov\/\" target=\"_blank\" class=\"btn-visit\">\n <i class=\"fas fa-external-link-alt\"><\/i> \u041f\u043e\u0441\u0435\u0442\u0438\u0442\u044c \u0441\u0430\u0439\u0442\n <\/a>\n <button class=\"btn-details\" data-resource=\"nist\">\n <i class=\"fas fa-info-circle\"><\/i> \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"resource-card\" data-category=\"scientific\">\n <div class=\"resource-header royal\">\n <div class=\"resource-title\">The Royal Society<\/div>\n <div class=\"resource-type\">\u041d\u0430\u0443\u0447\u043d\u043e\u0435 \u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e<\/div>\n <div class=\"resource-icon\"><i class=\"fas fa-crown\"><\/i><\/div>\n <\/div>\n <div class=\"resource-content\">\n <p class=\"resource-description\">\u0412\u0435\u0434\u0443\u0449\u0435\u0435 \u043d\u0430\u0443\u0447\u043d\u043e\u0435 \u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e \u043c\u0438\u0440\u0430 \u0441 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u044f\u043c\u0438 \u043f\u043e \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438, \u0438\u0441\u0442\u043e\u0440\u0438\u0438 \u043c\u0435\u0440 \u0438 \u0442\u043e\u0447\u043d\u044b\u043c \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f\u043c.<\/p>\n <div class=\"resource-features\">\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041d\u0430\u0443\u0447\u043d\u044b\u0435 \u0441\u0442\u0430\u0442\u044c\u0438 \u043f\u043e \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u043c\u0435\u0440<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438 \u043e \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430<\/span>\n <\/div>\n <\/div>\n <div class=\"resource-actions\">\n <a href=\"https:\/\/royalsociety.org\/\" target=\"_blank\" class=\"btn-visit\">\n <i class=\"fas fa-external-link-alt\"><\/i> \u041f\u043e\u0441\u0435\u0442\u0438\u0442\u044c \u0441\u0430\u0439\u0442\n <\/a>\n <button class=\"btn-details\" data-resource=\"royal\">\n <i class=\"fas fa-info-circle\"><\/i> \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"resource-card\" data-category=\"educational\">\n <div class=\"resource-header mit\">\n <div class=\"resource-title\">MIT OpenCourseWare<\/div>\n <div class=\"resource-type\">\u041e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043f\u043b\u0430\u0442\u0444\u043e\u0440\u043c\u0430<\/div>\n <div class=\"resource-icon\"><i class=\"fas fa-university\"><\/i><\/div>\n <\/div>\n <div class=\"resource-content\">\n <p class=\"resource-description\">\u0411\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u044b\u0435 \u043a\u0443\u0440\u0441\u044b \u041c\u0430\u0441\u0441\u0430\u0447\u0443\u0441\u0435\u0442\u0441\u043a\u043e\u0433\u043e \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0441\u0442\u0438\u0442\u0443\u0442\u0430 \u043f\u043e \u0444\u0438\u0437\u0438\u043a\u0435, \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438 \u0438 \u0438\u0441\u0442\u043e\u0440\u0438\u0438 \u043d\u0430\u0443\u043a\u0438.<\/p>\n <div class=\"resource-features\">\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041a\u0443\u0440\u0441 «\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u0438 \u0444\u0438\u043b\u043e\u0441\u043e\u0444\u0438\u044f \u043d\u0430\u0443\u043a\u0438»<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041b\u0435\u043a\u0446\u0438\u0438 \u043f\u043e \u0442\u043e\u0447\u043d\u044b\u043c \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f\u043c<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0423\u0447\u0435\u0431\u043d\u044b\u0435 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044b \u043f\u043e \u0421\u0418<\/span>\n <\/div>\n <\/div>\n <div class=\"resource-actions\">\n <a href=\"https:\/\/ocw.mit.edu\/\" target=\"_blank\" class=\"btn-visit\">\n <i class=\"fas fa-external-link-alt\"><\/i> \u041f\u043e\u0441\u0435\u0442\u0438\u0442\u044c \u0441\u0430\u0439\u0442\n <\/a>\n <button class=\"btn-details\" data-resource=\"mit\">\n <i class=\"fas fa-info-circle\"><\/i> \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"resource-card\" data-category=\"official\">\n <div class=\"resource-header iso\">\n <div class=\"resource-title\">International Organization for Standardization<\/div>\n <div class=\"resource-type\">\u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b<\/div>\n <div class=\"resource-icon\"><i class=\"fas fa-globe-europe\"><\/i><\/div>\n <\/div>\n <div class=\"resource-content\">\n <p class=\"resource-description\">\u0420\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442 \u0438 \u043f\u0443\u0431\u043b\u0438\u043a\u0443\u0435\u0442 \u043c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b, \u0432\u043a\u043b\u044e\u0447\u0430\u044f \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u0421\u0418 \u0438 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u044b.<\/p>\n <div class=\"resource-features\">\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442 ISO 80000 (\u0412\u0435\u043b\u0438\u0447\u0438\u043d\u044b \u0438 \u0435\u0434\u0438\u043d\u0438\u0446\u044b)<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0430\u0446\u0438\u0438<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0435 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/span>\n <\/div>\n <\/div>\n <div class=\"resource-actions\">\n <a href=\"https:\/\/www.iso.org\/\" target=\"_blank\" class=\"btn-visit\">\n <i class=\"fas fa-external-link-alt\"><\/i> \u041f\u043e\u0441\u0435\u0442\u0438\u0442\u044c \u0441\u0430\u0439\u0442\n <\/a>\n <button class=\"btn-details\" data-resource=\"iso\">\n <i class=\"fas fa-info-circle\"><\/i> \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"resource-card\" data-category=\"scientific\">\n <div class=\"resource-header nature\">\n <div class=\"resource-title\">Nature Journal<\/div>\n <div class=\"resource-type\">\u041d\u0430\u0443\u0447\u043d\u044b\u0439 \u0436\u0443\u0440\u043d\u0430\u043b<\/div>\n <div class=\"resource-icon\"><i class=\"fas fa-microscope\"><\/i><\/div>\n <\/div>\n <div class=\"resource-content\">\n <p class=\"resource-description\">\u0412\u0435\u0434\u0443\u0449\u0438\u0439 \u043d\u0430\u0443\u0447\u043d\u044b\u0439 \u0436\u0443\u0440\u043d\u0430\u043b \u0441 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u044f\u043c\u0438 \u043e \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u0445 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f\u0445 \u0432 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438 \u0438 \u0444\u0438\u0437\u0438\u043a\u0438.<\/p>\n <div class=\"resource-features\">\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0421\u0442\u0430\u0442\u044c\u0438 \u043e \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0418\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u043f\u043e \u043a\u0432\u0430\u043d\u0442\u043e\u0432\u043e\u0439 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041d\u0430\u0443\u0447\u043d\u044b\u0435 \u043e\u0431\u0437\u043e\u0440\u044b \u043f\u043e \u0438\u0441\u0442\u043e\u0440\u0438\u0438 \u043c\u0435\u0440<\/span>\n <\/div>\n <\/div>\n <div class=\"resource-actions\">\n <a href=\"https:\/\/www.nature.com\/\" target=\"_blank\" class=\"btn-visit\">\n <i class=\"fas fa-external-link-alt\"><\/i> \u041f\u043e\u0441\u0435\u0442\u0438\u0442\u044c \u0441\u0430\u0439\u0442\n <\/a>\n <button class=\"btn-details\" data-resource=\"nature\">\n <i class=\"fas fa-info-circle\"><\/i> \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"resource-card\" data-category=\"official\">\n <div class=\"resource-header npl\">\n <div class=\"resource-title\">National Physical Laboratory UK<\/div>\n <div class=\"resource-type\">\u041d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u0430\u044f \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u044f<\/div>\n <div class=\"resource-icon\"><i class=\"fas fa-flask\"><\/i><\/div>\n <\/div>\n <div class=\"resource-content\">\n <p class=\"resource-description\">\u0412\u0435\u0434\u0443\u0449\u0430\u044f \u0431\u0440\u0438\u0442\u0430\u043d\u0441\u043a\u0430\u044f \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u044f \u043f\u043e \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f\u043c, \u0443\u0447\u0430\u0441\u0442\u0432\u043e\u0432\u0430\u043b\u0430 \u0432 \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 \u0435\u0434\u0438\u043d\u0438\u0446 \u0421\u0418.<\/p>\n <div class=\"resource-features\">\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0418\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u043f\u043e \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u043f\u043e \u0421\u0418<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u044b \u0438 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b<\/span>\n <\/div>\n <\/div>\n <div class=\"resource-actions\">\n <a href=\"https:\/\/www.npl.co.uk\/\" target=\"_blank\" class=\"btn-visit\">\n <i class=\"fas fa-external-link-alt\"><\/i> \u041f\u043e\u0441\u0435\u0442\u0438\u0442\u044c \u0441\u0430\u0439\u0442\n <\/a>\n <button class=\"btn-details\" data-resource=\"npl\">\n <i class=\"fas fa-info-circle\"><\/i> \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"timeline-section\">\n <h2 class=\"timeline-title\">\n <i class=\"fas fa-history\"><\/i> \u0425\u0440\u043e\u043d\u043e\u043b\u043e\u0433\u0438\u044f \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u044f \u043c\u0435\u0440 \u0432\u0435\u0441\u0430\n <\/h2>\n <div class=\"timeline\">\n <div class=\"timeline-item\" data-year=\"3000 \u0434\u043e \u043d.\u044d.\">\n <div class=\"timeline-year\">~3000 \u0434\u043e \u043d.\u044d.<\/div>\n <div class=\"timeline-description\">\u0414\u0440\u0435\u0432\u043d\u0438\u0439 \u0415\u0433\u0438\u043f\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u0441\u0438\u0441\u0442\u0435\u043c\u0443 \u0432\u0435\u0441\u0430 \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0437\u0435\u0440\u0435\u043d \u044f\u0447\u043c\u0435\u043d\u044f \u0434\u043b\u044f \u0442\u043e\u0440\u0433\u043e\u0432\u043b\u0438 \u0437\u043e\u043b\u043e\u0442\u043e\u043c<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"700 \u0434\u043e \u043d.\u044d.\">\n <div class=\"timeline-year\">~700 \u0434\u043e \u043d.\u044d.<\/div>\n <div class=\"timeline-description\">\u0412 \u041b\u0438\u0434\u0438\u0438 (\u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u0430\u044f \u0422\u0443\u0440\u0446\u0438\u044f) \u043f\u043e\u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u043f\u0435\u0440\u0432\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0433\u0438\u0440\u0438<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"290\">\n <div class=\"timeline-year\">290 \u0433. \u043d.\u044d.<\/div>\n <div class=\"timeline-description\">\u0420\u0438\u043c\u0441\u043a\u0438\u0439 \u0438\u043c\u043f\u0435\u0440\u0430\u0442\u043e\u0440 \u0414\u0438\u043e\u043a\u043b\u0435\u0442\u0438\u0430\u043d \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u0443\u044e \u0441\u0438\u0441\u0442\u0435\u043c\u0443 \u043c\u0435\u0440 \u0438 \u0432\u0435\u0441\u043e\u0432<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"1215\">\n <div class=\"timeline-year\">1215 \u0433.<\/div>\n <div class=\"timeline-description\">\u0412\u0435\u043b\u0438\u043a\u0430\u044f \u0445\u0430\u0440\u0442\u0438\u044f \u0432\u043e\u043b\u044c\u043d\u043e\u0441\u0442\u0435\u0439 \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u0435\u0434\u0438\u043d\u044b\u0445 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430 \u043f\u043e \u0432\u0441\u0435\u0439 \u0410\u043d\u0433\u043b\u0438\u0438<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"1799\">\n <div class=\"timeline-year\">1799 \u0433.<\/div>\n <div class=\"timeline-description\">\u0424\u0440\u0430\u043d\u0446\u0438\u044f \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u043a\u0430\u043a \u043c\u0430\u0441\u0441\u0443 1 \u0434\u043c\u00b3 \u0432\u043e\u0434\u044b \u043f\u0440\u0438 4\u00b0C<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"1875\">\n <div class=\"timeline-year\">1875 \u0433.<\/div>\n <div class=\"timeline-description\">\u041f\u043e\u0434\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u041c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u043a\u043e\u043d\u0432\u0435\u043d\u0446\u0438\u0438, \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u043e\u0433\u043e \u0431\u044e\u0440\u043e \u043c\u0435\u0440 \u0438 \u0432\u0435\u0441\u043e\u0432<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"1889\">\n <div class=\"timeline-year\">1889 \u0433.<\/div>\n <div class=\"timeline-description\">\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0442\u043e\u0442\u0438\u043f\u0430 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430 \u0438\u0437 \u043f\u043b\u0430\u0442\u0438\u043d\u043e-\u0438\u0440\u0438\u0434\u0438\u0435\u0432\u043e\u0433\u043e \u0441\u043f\u043b\u0430\u0432\u0430<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"2019\">\n <div class=\"timeline-year\">2019 \u0433.<\/div>\n <div class=\"timeline-description\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u0443\u044e \u041f\u043b\u0430\u043d\u043a\u0430, \u043f\u0440\u0435\u043a\u0440\u0430\u0449\u0435\u043d\u0430 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u044c \u043e\u0442 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0430\u0440\u0442\u0435\u0444\u0430\u043a\u0442\u0430<\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"faq-section\">\n <h2 class=\"faq-title\">\n <i class=\"fas fa-question-circle\"><\/i> \u0427\u0430\u0441\u0442\u043e \u0437\u0430\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0435 \u0432\u043e\u043f\u0440\u043e\u0441\u044b\n <\/h2>\n <div class=\"faq-item\">\n <div class=\"faq-question\">\n <span>\u041f\u043e\u0447\u0435\u043c\u0443 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u0431\u044b\u043b \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d \u0432 2019 \u0433\u043e\u0434\u0443?<\/span>\n <i class=\"fas fa-chevron-down\"><\/i>\n <\/div>\n <div class=\"faq-answer\">\n <p>\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u0431\u044b\u043b \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0435\u0439 \u0435\u0434\u0438\u043d\u0438\u0446\u0435\u0439 \u0421\u0418, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u043b\u0430\u0441\u044c \u0447\u0435\u0440\u0435\u0437 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0430\u0440\u0442\u0435\u0444\u0430\u043a\u0442 \u2014 \u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0439 \u043f\u0440\u043e\u0442\u043e\u0442\u0438\u043f \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430. \u041f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0432\u043a\u043b\u044e\u0447\u0430\u043b\u0438:<\/p>\n <ul>\n <li>\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u043c\u0430\u0441\u0441\u044b \u043f\u0440\u043e\u0442\u043e\u0442\u0438\u043f\u0430 \u0441\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0435\u043c (\u043e\u043a\u043e\u043b\u043e 50 \u043c\u0438\u043a\u0440\u043e\u0433\u0440\u0430\u043c\u043c \u0437\u0430 100 \u043b\u0435\u0442)<\/li>\n <li>\u0420\u0438\u0441\u043a \u043f\u043e\u0432\u0440\u0435\u0436\u0434\u0435\u043d\u0438\u044f \u0438\u043b\u0438 \u0443\u0442\u0435\u0440\u0438 \u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0433\u043e \u044d\u0442\u0430\u043b\u043e\u043d\u0430<\/li>\n <li>\u041d\u0435\u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0442\u043e\u0447\u043d\u043e\u0433\u043e \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u044f\u0445<\/li>\n <\/ul>\n <p>\u041d\u043e\u0432\u043e\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u0443\u044e \u041f\u043b\u0430\u043d\u043a\u0430 \u0434\u0435\u043b\u0430\u0435\u0442 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u043c\u044b\u043c \u0432 \u043b\u044e\u0431\u043e\u0439 \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u0438 \u043c\u0438\u0440\u0430 \u0441 \u043a\u0432\u0430\u043d\u0442\u043e\u0432\u043e\u0439 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c\u044e.<\/p>\n <\/div>\n <\/div>\n <div class=\"faq-item\">\n <div class=\"faq-question\">\n <span>\u041a\u0430\u043a \u0442\u043e\u0447\u043d\u043e \u043c\u043e\u0436\u043d\u043e \u0438\u0437\u043c\u0435\u0440\u0438\u0442\u044c \u043c\u0430\u0441\u0441\u0443 \u0441\u0435\u0433\u043e\u0434\u043d\u044f?<\/span>\n <i class=\"fas fa-chevron-down\"><\/i>\n <\/div>\n <div class=\"faq-answer\">\n <p>\u0421\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u043c\u0435\u0442\u043e\u0434\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f \u043c\u0430\u0441\u0441\u044b \u0434\u043e\u0441\u0442\u0438\u0433\u043b\u0438 \u043d\u0435\u0432\u0435\u0440\u043e\u044f\u0442\u043d\u043e\u0439 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u0438:<\/p>\n <ul>\n <li><strong>\u041a\u0438\u0431\u0435\u0440-\u0432\u0435\u0441\u044b \u041a\u0438\u0431\u0431\u043b\u0430:<\/strong> \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442 \u044d\u043b\u0435\u043a\u0442\u0440\u043e\u043c\u0430\u0433\u043d\u0438\u0442\u043d\u0443\u044e \u0441\u0438\u043b\u0443 \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f \u043c\u0430\u0441\u0441\u044b \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u0443\u044e \u041f\u043b\u0430\u043d\u043a\u0430 \u0441 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c\u044e \u0434\u043e 1\u00d710\u207b\u2078<\/li>\n <li><strong>\u041c\u0430\u0441\u0441-\u0441\u043f\u0435\u043a\u0442\u0440\u043e\u043c\u0435\u0442\u0440\u0438\u044f:<\/strong> \u041f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0437\u043c\u0435\u0440\u044f\u0442\u044c \u043c\u0430\u0441\u0441\u0443 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u0430\u0442\u043e\u043c\u043e\u0432 \u0438 \u043c\u043e\u043b\u0435\u043a\u0443\u043b<\/li>\n <li><strong>\u041a\u0432\u0430\u0440\u0446\u0435\u0432\u044b\u0435 \u043c\u0438\u043a\u0440\u043e\u0432\u0435\u0441\u044b:<\/strong> \u0427\u0443\u0432\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u044b \u043a \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044e \u043c\u0430\u0441\u0441\u044b \u0432 \u043d\u0430\u043d\u043e\u0433\u0440\u0430\u043c\u043c\u044b<\/li>\n <li><strong>\u0410\u0442\u043e\u043c\u043d\u043e-\u0441\u0438\u043b\u043e\u0432\u0430\u044f \u043c\u0438\u043a\u0440\u043e\u0441\u043a\u043e\u043f\u0438\u044f:<\/strong> \u041c\u043e\u0436\u0435\u0442 \u0438\u0437\u043c\u0435\u0440\u044f\u0442\u044c \u043c\u0430\u0441\u0441\u0443 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u0432\u0438\u0440\u0443\u0441\u043e\u0432 \u0438 \u043c\u043e\u043b\u0435\u043a\u0443\u043b<\/li>\n <\/ul>\n <\/div>\n <\/div>\n <div class=\"faq-item\">\n <div class=\"faq-question\">\n <span>\u041a\u0430\u043a\u0438\u0435 \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043c\u0435\u0440\u044b \u0432\u0435\u0441\u0430 \u0434\u043e \u0441\u0438\u0445 \u043f\u043e\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f?<\/span>\n <i class=\"fas fa-chevron-down\"><\/i>\n <\/div>\n <div class=\"faq-answer\">\n <p>\u041d\u0435\u0441\u043c\u043e\u0442\u0440\u044f \u043d\u0430 \u043f\u043e\u0432\u0441\u0435\u043c\u0435\u0441\u0442\u043d\u043e\u0435 \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u043c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u044b, \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043c\u0435\u0440\u044b \u0441\u043e\u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0441\u044c:<\/p>\n <ul>\n <li><strong>\u041a\u0430\u0440\u0430\u0442 (0.2 \u0433):<\/strong> \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432 \u044e\u0432\u0435\u043b\u0438\u0440\u043d\u043e\u043c \u0434\u0435\u043b\u0435 \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f \u043c\u0430\u0441\u0441\u044b \u0434\u0440\u0430\u0433\u043e\u0446\u0435\u043d\u043d\u044b\u0445 \u043a\u0430\u043c\u043d\u0435\u0439<\/li>\n <li><strong>\u0423\u043d\u0446\u0438\u044f (28.35 \u0433):<\/strong> \u041f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0432 \u0430\u043f\u0442\u0435\u043a\u0430\u0440\u0441\u043a\u043e\u043c \u0434\u0435\u043b\u0435 \u0438 \u043f\u0440\u0438 \u0442\u043e\u0440\u0433\u043e\u0432\u043b\u0435 \u0434\u0440\u0430\u0433\u043e\u0446\u0435\u043d\u043d\u044b\u043c\u0438 \u043c\u0435\u0442\u0430\u043b\u043b\u0430\u043c\u0438<\/li>\n <li><strong>\u0424\u0443\u043d\u0442 (453.6 \u0433):<\/strong> \u0428\u0438\u0440\u043e\u043a\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432 \u0421\u0428\u0410, \u0412\u0435\u043b\u0438\u043a\u043e\u0431\u0440\u0438\u0442\u0430\u043d\u0438\u0438 \u0434\u043b\u044f \u0431\u044b\u0442\u043e\u0432\u044b\u0445 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <li><strong>\u0422\u0440\u043e\u0439\u0441\u043a\u0430\u044f \u0443\u043d\u0446\u0438\u044f (31.1 \u0433):<\/strong> \u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442 \u0434\u043b\u044f \u0442\u043e\u0440\u0433\u043e\u0432\u043b\u0438 \u0437\u043e\u043b\u043e\u0442\u043e\u043c, \u0441\u0435\u0440\u0435\u0431\u0440\u043e\u043c \u0438 \u0434\u0440\u0443\u0433\u0438\u043c\u0438 \u0434\u0440\u0430\u0433\u043e\u0446\u0435\u043d\u043d\u044b\u043c\u0438 \u043c\u0435\u0442\u0430\u043b\u043b\u0430\u043c\u0438<\/li>\n <li><strong>\u0413\u0440\u0430\u043d (64.8 \u043c\u0433):<\/strong> \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432 \u0431\u0430\u043b\u043b\u0438\u0441\u0442\u0438\u043a\u0435 \u0438 \u0444\u0430\u0440\u043c\u0430\u043a\u043e\u043b\u043e\u0433\u0438\u0438<\/li>\n <\/ul>\n <\/div>\n <\/div>\n <div class=\"faq-item\">\n <div class=\"faq-question\">\n <span>\u041a\u0430\u043a \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u043c\u0435\u0440\u044b \u0432\u0435\u0441\u0430?<\/span>\n <i class=\"fas fa-chevron-down\"><\/i>\n <\/div>\n <div class=\"faq-answer\">\n <p>\u0412 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438 \u0447\u0430\u0441\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u043e\u0431\u044a\u0435\u043c\u043d\u044b\u0435 \u043c\u0435\u0440\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0435 \u0432\u0441\u0435\u0433\u0434\u0430 \u0442\u043e\u0447\u043d\u043e \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0442 \u043c\u0430\u0441\u0441\u0435:<\/p>\n <ul>\n <li>1 \u0447\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430 \u043c\u0443\u043a\u0438 \u2248 3 \u0433<\/li>\n <li>1 \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430 \u0441\u0430\u0445\u0430\u0440\u0430 \u2248 12 \u0433<\/li>\n <li>1 \u0441\u0442\u0430\u043a\u0430\u043d \u0432\u043e\u0434\u044b \u2248 240 \u0433<\/li>\n <li>1 \u0443\u043d\u0446\u0438\u044f \u0448\u043e\u043a\u043e\u043b\u0430\u0434\u0430 \u2248 28 \u0433<\/li>\n <li>1 \u0444\u0443\u043d\u0442 \u043c\u0430\u0441\u043b\u0430 \u2248 450 \u0433<\/li>\n <\/ul>\n <p><strong>\u0412\u0430\u0436\u043d\u043e:<\/strong> \u041f\u043b\u043e\u0442\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432 \u0440\u0430\u0437\u043b\u0438\u0447\u0430\u0435\u0442\u0441\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0434\u043b\u044f \u0442\u043e\u0447\u043d\u044b\u0445 \u043a\u043e\u043d\u0432\u0435\u0440\u0441\u0438\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b.<\/p>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"quiz-section\">\n <h2 class=\"quiz-title\">\n <i class=\"fas fa-brain\"><\/i> \u041f\u0440\u043e\u0432\u0435\u0440\u044c\u0442\u0435 \u0441\u0432\u043e\u0438 \u0437\u043d\u0430\u043d\u0438\u044f \u043e \u043c\u0435\u0440\u0430\u0445 \u0432\u0435\u0441\u0430\n <\/h2>\n <div class=\"quiz-progress\">\n <div class=\"quiz-progress-bar\" id=\"quizProgress\"><\/div>\n <\/div>\n \n <div id=\"quizContent\">\n <div class=\"quiz-question\" id=\"questionText\">\u0421\u043a\u043e\u043b\u044c\u043a\u043e \u0433\u0440\u0430\u043c\u043c\u043e\u0432 \u0432 \u043e\u0434\u043d\u043e\u043c \u043a\u0430\u0440\u0430\u0442\u0435?<\/div>\n <div class=\"quiz-options\" id=\"optionsContainer\">\n <div class=\"quiz-option\" data-correct=\"true\">0.2 \u0433<\/div>\n <div class=\"quiz-option\" data-correct=\"false\">1 \u0433<\/div>\n <div class=\"quiz-option\" data-correct=\"false\">0.5 \u0433<\/div>\n <div class=\"quiz-option\" data-correct=\"false\">0.1 \u0433<\/div>\n <\/div>\n \n <div class=\"quiz-navigation\">\n <button class=\"quiz-btn\" id=\"prevBtn\" disabled>\n <i class=\"fas fa-arrow-left\"><\/i> \u041d\u0430\u0437\u0430\u0434\n <\/button>\n <div class=\"quiz-score\" id=\"scoreDisplay\">\u0412\u043e\u043f\u0440\u043e\u0441 1 \u0438\u0437 5<\/div>\n <button class=\"quiz-btn\" id=\"nextBtn\">\n \u0414\u0430\u043b\u0435\u0435 <i class=\"fas fa-arrow-right\"><\/i>\n <\/button>\n <\/div>\n <\/div>\n \n <div id=\"quizResults\" style=\"display: none; text-align: center;\">\n <h3 style=\"color: #2c3e50; margin-bottom: 20px;\">\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u044b \u0432\u0438\u043a\u0442\u043e\u0440\u0438\u043d\u044b<\/h3>\n <div id=\"resultScore\" style=\"font-size: 3rem; color: #4CAF50; font-weight: 700; margin: 20px 0;\">0\/5<\/div>\n <p id=\"resultMessage\" style=\"color: #666; margin-bottom: 30px;\"><\/p>\n <button class=\"quiz-btn\" id=\"restartQuiz\">\n <i class=\"fas fa-redo\"><\/i> \u041f\u0440\u043e\u0439\u0442\u0438 \u0435\u0449\u0435 \u0440\u0430\u0437\n <\/button>\n <\/div>\n <\/div>\n \n \n <div class=\"tools-section\">\n <h2 class=\"tools-title\">\n <i class=\"fas fa-tools\"><\/i> \u0421\u0432\u044f\u0437\u0430\u043d\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0438 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u044b\n <\/h2>\n <div class=\"tools-grid\">\n <div class=\"tool-card\" data-tool=\"length-converter\" data-link=\"https:\/\/gestro.ru\/?page_id=71\">\n <div class=\"tool-icon\"><i class=\"fas fa-ruler-combined\"><\/i><\/div>\n <div class=\"tool-name\">\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u0434\u043b\u0438\u043d\u044b<\/div>\n <div class=\"tool-desc\">\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0438\u0440\u0443\u0439\u0442\u0435 \u043c\u0435\u0442\u0440\u044b, \u0444\u0443\u0442\u044b, \u0434\u044e\u0439\u043c\u044b \u0438 \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b \u0434\u043b\u0438\u043d\u044b<\/div>\n <\/div>\n <div class=\"tool-card\" data-tool=\"volume-converter\" data-link=\"https:\/\/gestro.ru\/?page_id=251\">\n <div class=\"tool-icon\"><i class=\"fas fa-wine-bottle\"><\/i><\/div>\n <div class=\"tool-name\">\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u043e\u0431\u044a\u0435\u043c\u0430<\/div>\n <div class=\"tool-desc\">\u041f\u0435\u0440\u0435\u0432\u043e\u0434\u0438\u0442\u0435 \u043b\u0438\u0442\u0440\u044b, \u0433\u0430\u043b\u043b\u043e\u043d\u044b, \u043f\u0438\u043d\u0442\u044b \u0438 \u0434\u0440\u0443\u0433\u0438\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b \u043e\u0431\u044a\u0435\u043c\u0430<\/div>\n <\/div>\n <div class=\"tool-card\" data-tool=\"temperature-converter\" data-link=\"https:\/\/gestro.ru\/2\/\">\n <div class=\"tool-icon\"><i class=\"fas fa-thermometer-half\"><\/i><\/div>\n <div class=\"tool-name\">\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u044b<\/div>\n <div class=\"tool-desc\">\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u044f \u043c\u0435\u0436\u0434\u0443 \u0426\u0435\u043b\u044c\u0441\u0438\u0435\u043c, \u0424\u0430\u0440\u0435\u043d\u0433\u0435\u0439\u0442\u043e\u043c \u0438 \u041a\u0435\u043b\u044c\u0432\u0438\u043d\u043e\u043c<\/div>\n <\/div>\n <div class=\"tool-card\" data-tool=\"cooking-converter\" data-link=\"https:\/\/gestro.ru\/?page_id=289\">\n <div class=\"tool-icon\"><i class=\"fas fa-utensils\"><\/i><\/div>\n <div class=\"tool-name\">\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440<\/div>\n <div class=\"tool-desc\">\u0421\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438 \u0434\u043b\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0445 \u0440\u0435\u0446\u0435\u043f\u0442\u043e\u0432<\/div>\n <\/div>\n <div class=\"tool-card\" data-tool=\"scientific-calculator\" data-link=\"https:\/\/gestro.ru\/4\/\">\n <div class=\"tool-icon\"><i class=\"fas fa-calculator\"><\/i><\/div>\n <div class=\"tool-name\">\u041d\u0430\u0443\u0447\u043d\u044b\u0439 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440<\/div>\n <div class=\"tool-desc\">\u0422\u043e\u0447\u043d\u044b\u0435 \u0432\u044b\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u044f \u0441 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u043e\u0439 \u0435\u0434\u0438\u043d\u0438\u0446 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f<\/div>\n <\/div>\n <div class=\"tool-card\" data-tool=\"history-timeline\" data-link=\"https:\/\/gestro.ru\/5\/\">\n <div class=\"tool-icon\"><i class=\"fas fa-timeline\"><\/i><\/div>\n <div class=\"tool-name\">\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/div>\n <div class=\"tool-desc\">\u0418\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u0430\u044f \u0445\u0440\u043e\u043d\u043e\u043b\u043e\u0433\u0438\u044f \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u044f \u0441\u0438\u0441\u0442\u0435\u043c \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f<\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"resources-footer\">\n <p><strong>\u00a9 2026 \u042d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u044f \u043c\u0435\u0440 \u0438 \u0432\u0435\u0441\u043e\u0432<\/strong><\/p>\n <p>\u0412\u0441\u0435 \u0441\u0441\u044b\u043b\u043a\u0438 \u0432\u0435\u0434\u0443\u0442 \u043d\u0430 \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u0430\u0432\u0442\u043e\u0440\u0438\u0442\u0435\u0442\u043d\u044b\u0435 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u0438. \u041c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044b \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u044b \u0434\u043b\u044f \u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0446\u0435\u043b\u0435\u0439.<\/p>\n \n \n <div class=\"social-links\">\n <a href=\"#\" class=\"social-link\" title=\"Telegram \u043a\u0430\u043d\u0430\u043b\">\n <i class=\"fab fa-telegram\"><\/i>\n <\/a>\n <a href=\"#\" class=\"social-link\" title=\"YouTube \u043a\u0430\u043d\u0430\u043b\">\n <i class=\"fab fa-youtube\"><\/i>\n <\/a>\n <a href=\"#\" class=\"social-link\" title=\"\u041d\u0430\u0443\u0447\u043d\u044b\u0439 \u0431\u043b\u043e\u0433\">\n <i class=\"fab fa-medium\"><\/i>\n <\/a>\n <a href=\"#\" class=\"social-link\" title=\"\u0418\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f\">\n <i class=\"fab fa-researchgate\"><\/i>\n <\/a>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"modal\" id=\"resourceModal\">\n <div class=\"modal-content\">\n <button class=\"modal-close\" id=\"modalClose\">×<\/button>\n <h3 class=\"modal-title\" id=\"modalTitle\">\u0418\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u043e \u0440\u0435\u0441\u0443\u0440\u0441\u0435<\/h3>\n <div id=\"modalContent\">\n \n <\/div>\n <\/div>\n <\/div>\n\n <script>\n\/\/ \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c IIFE \u0434\u043b\u044f \u0438\u0437\u043e\u043b\u044f\u0446\u0438\u0438 \u043a\u043e\u0434\u0430\n(function() {\n console.log('=== \u0417\u0410\u0413\u0420\u0423\u0417\u041a\u0410 \u0418\u041d\u0422\u0415\u0420\u0410\u041a\u0422\u0418\u0412\u041d\u041e\u0413\u041e \u0411\u041b\u041e\u041a\u0410 ===');\n \n \/\/ \u0414\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u044b\u0445 \u043e\u043a\u043e\u043d\n const resourceData = {\n nist: {\n title: \"\u041d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u0438\u043d\u0441\u0442\u0438\u0442\u0443\u0442 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432 \u0438 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0439 (NIST)\",\n content: `\n <h4>\u041e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u0430\u044f \u0440\u043e\u043b\u044c NIST<\/h4>\n <p>NIST \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0430\u0433\u0435\u043d\u0442\u0441\u0442\u0432\u043e\u043c \u041c\u0438\u043d\u0438\u0441\u0442\u0435\u0440\u0441\u0442\u0432\u0430 \u0442\u043e\u0440\u0433\u043e\u0432\u043b\u0438 \u0421\u0428\u0410, \u043e\u0442\u0432\u0435\u0447\u0430\u044e\u0449\u0438\u043c \u0437\u0430 \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0439, \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438 \u0438 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432. \u0418\u043d\u0441\u0442\u0438\u0442\u0443\u0442 \u0438\u0433\u0440\u0430\u0435\u0442 \u043a\u043b\u044e\u0447\u0435\u0432\u0443\u044e \u0440\u043e\u043b\u044c \u0432 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0438 \u0438 \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u0438 \u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u043e\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u044b \u0435\u0434\u0438\u043d\u0438\u0446 (\u0421\u0418).<\/p>\n \n <h4>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u044b \u0432 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438:<\/h4>\n <ul>\n <li><strong>\u041a\u0438\u0431\u0435\u0440-\u0432\u0435\u0441\u044b \u041a\u0438\u0431\u0431\u043b\u0430:<\/strong> \u0423\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e \u0434\u043b\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043d\u043e\u0432\u043e\u0433\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430 \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u0443\u044e \u041f\u043b\u0430\u043d\u043a\u0430<\/li>\n <li><strong>\u0410\u0442\u043e\u043c\u043d\u044b\u0435 \u0447\u0430\u0441\u044b:<\/strong> NIST-F2 - \u0441\u0430\u043c\u044b\u0435 \u0442\u043e\u0447\u043d\u044b\u0435 \u0430\u0442\u043e\u043c\u043d\u044b\u0435 \u0447\u0430\u0441\u044b \u0432 \u043c\u0438\u0440\u0435 \u0441 \u043f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c\u044e 1 \u0441\u0435\u043a\u0443\u043d\u0434\u0430 \u0437\u0430 300 \u043c\u0438\u043b\u043b\u0438\u043e\u043d\u043e\u0432 \u043b\u0435\u0442<\/li>\n <li><strong>\u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439:<\/strong> \u041f\u043e\u0434\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0435 \u043d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0445 \u044d\u0442\u0430\u043b\u043e\u043d\u043e\u0432 \u0435\u0434\u0438\u043d\u0438\u0446 \u0421\u0418<\/li>\n <\/ul>\n \n <h4>\u041f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0440\u0430\u0437\u0434\u0435\u043b\u044b \u0441\u0430\u0439\u0442\u0430:<\/h4>\n <ul>\n <li>\u25b8 SI Units - \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u0438 \u0438\u0441\u0442\u043e\u0440\u0438\u044f<\/li>\n <li>\u25b8 Calibration Services - \u0443\u0441\u043b\u0443\u0433\u0438 \u043a\u0430\u043b\u0438\u0431\u0440\u043e\u0432\u043a\u0438<\/li>\n <li>\u25b8 Measurement Standards - \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <li>\u25b8 Physics Laboratory - \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f<\/li>\n <\/ul>\n \n <div style=\"background: #f0f9ff; padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p><strong>\u0418\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u0444\u0430\u043a\u0442:<\/strong> NIST \u0443\u0447\u0430\u0441\u0442\u0432\u043e\u0432\u0430\u043b \u0432 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u043f\u0435\u0440\u0432\u044b\u0445 \u0430\u0442\u043e\u043c\u043d\u044b\u0445 \u0431\u043e\u043c\u0431 \u0432 \u0440\u0430\u043c\u043a\u0430\u0445 \u041c\u0430\u043d\u0445\u044d\u0442\u0442\u0435\u043d\u0441\u043a\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430, \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044f \u0442\u043e\u0447\u043d\u044b\u0435 \u0438\u0437\u043c\u0435\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b.<\/p>\n <\/div>\n `\n },\n royal: {\n title: \"The Royal Society (\u041a\u043e\u0440\u043e\u043b\u0435\u0432\u0441\u043a\u043e\u0435 \u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e)\",\n content: `\n <h4>\u0421\u0442\u0430\u0440\u0435\u0439\u0448\u0435\u0435 \u043d\u0430\u0443\u0447\u043d\u043e\u0435 \u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e \u0432 \u043c\u0438\u0440\u0435<\/h4>\n <p>\u041e\u0441\u043d\u043e\u0432\u0430\u043d\u043e \u0432 1660 \u0433\u043e\u0434\u0443, The Royal Society \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0432\u0435\u0434\u0443\u0449\u0435\u0439 \u043d\u0430\u0443\u0447\u043d\u043e\u0439 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0435\u0439 \u0412\u0435\u043b\u0438\u043a\u043e\u0431\u0440\u0438\u0442\u0430\u043d\u0438\u0438 \u0438 \u043e\u0434\u043d\u0438\u043c \u0438\u0437 \u0441\u0430\u043c\u044b\u0445 \u043f\u0440\u0435\u0441\u0442\u0438\u0436\u043d\u044b\u0445 \u043d\u0430\u0443\u0447\u043d\u044b\u0445 \u0441\u043e\u043e\u0431\u0449\u0435\u0441\u0442\u0432 \u0432 \u043c\u0438\u0440\u0435.<\/p>\n \n <h4>\u0412\u043a\u043b\u0430\u0434 \u0432 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u044e:<\/h4>\n <ul>\n <li><strong>Philosophical Transactions:<\/strong> \u041f\u0435\u0440\u0432\u044b\u0439 \u0432 \u043c\u0438\u0440\u0435 \u043d\u0430\u0443\u0447\u043d\u044b\u0439 \u0436\u0443\u0440\u043d\u0430\u043b, \u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u0432\u0448\u0438\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u043e \u043c\u0435\u0440\u0430\u0445 \u0438 \u0432\u0435\u0441\u0430\u0445<\/li>\n <li><strong>\u0418\u0441\u0430\u0430\u043a \u041d\u044c\u044e\u0442\u043e\u043d:<\/strong> \u0427\u043b\u0435\u043d \u043e\u0431\u0449\u0435\u0441\u0442\u0432\u0430, \u0447\u044c\u0438 \u0440\u0430\u0431\u043e\u0442\u044b \u0437\u0430\u043b\u043e\u0436\u0438\u043b\u0438 \u043e\u0441\u043d\u043e\u0432\u044b \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0444\u0438\u0437\u0438\u043a\u0438 \u0438 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438<\/li>\n <li><strong>Modern Metrology:<\/strong> \u0421\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u0432 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043a\u0432\u0430\u043d\u0442\u043e\u0432\u043e\u0439 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438<\/li>\n <\/ul>\n \n <h4>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438 \u043f\u043e \u0442\u0435\u043c\u0435:<\/h4>\n <ul>\n <li>\"On the Redefinition of the Kilogram\" (2019)<\/li>\n <li>\"Historical Perspectives on Measurement Standards\"<\/li>\n <li>\"Quantum Metrology and the Future of Measurement\"<\/li>\n <li>\"The SI Units: Past, Present and Future\"<\/li>\n <\/ul>\n \n <div style=\"background: #fff0f0; padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p><strong>\u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0444\u0430\u043a\u0442:<\/strong> \u0412 1664 \u0433\u043e\u0434\u0443 \u041a\u043e\u0440\u043e\u043b\u0435\u0432\u0441\u043a\u043e\u0435 \u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e \u043f\u0440\u043e\u0432\u0435\u043b\u043e \u043f\u0435\u0440\u0432\u044b\u0435 \u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u044b \u043f\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044e \u0443\u0434\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u0432\u0435\u0441\u0430 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0432\u0435\u0449\u0435\u0441\u0442\u0432, \u0437\u0430\u043b\u043e\u0436\u0438\u0432 \u043e\u0441\u043d\u043e\u0432\u044b \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438.<\/p>\n <\/div>\n `\n },\n mit: {\n title: \"MIT OpenCourseWare\",\n content: `\n <h4>\u0411\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u043e\u0435 \u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043c\u0438\u0440\u043e\u0432\u043e\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u044f<\/h4>\n <p>\u041f\u0440\u043e\u0435\u043a\u0442 \u041c\u0430\u0441\u0441\u0430\u0447\u0443\u0441\u0435\u0442\u0441\u043a\u043e\u0433\u043e \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0441\u0442\u0438\u0442\u0443\u0442\u0430, \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0439 \u0431\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u044b\u0439 \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u0430\u043c \u043a\u0443\u0440\u0441\u043e\u0432 \u0434\u043b\u044f \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u0438\u0437\u0443\u0447\u0435\u043d\u0438\u044f.<\/p>\n \n <h4>\u0420\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u043c\u044b\u0435 \u043a\u0443\u0440\u0441\u044b \u043f\u043e \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438:<\/h4>\n <ul>\n <li><strong>8.01 Physics I:<\/strong> \u041c\u0435\u0445\u0430\u043d\u0438\u043a\u0430 \u0441 \u043e\u0441\u043d\u043e\u0432\u0430\u043c\u0438 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <li><strong>STS.042 History of Science:<\/strong> \u0418\u0441\u0442\u043e\u0440\u0438\u044f \u043d\u0430\u0443\u0447\u043d\u044b\u0445 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <li><strong>6.050J Information Theory:<\/strong> \u0422\u0435\u043e\u0440\u0438\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u0438 \u0442\u043e\u0447\u043d\u044b\u0435 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f<\/li>\n <li><strong>8.13 Experimental Physics I:<\/strong> \u041f\u0440\u0430\u043a\u0442\u0438\u043a\u0443\u043c \u043f\u043e \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u043c \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f\u043c<\/li>\n <\/ul>\n \n <h4>\u041e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u043f\u043b\u0430\u0442\u0444\u043e\u0440\u043c\u044b:<\/h4>\n <ul>\n <li>\u25b8 \u041f\u043e\u043b\u043d\u044b\u0435 \u0432\u0438\u0434\u0435\u043e\u043b\u0435\u043a\u0446\u0438\u0438 \u0441 \u0441\u0443\u0431\u0442\u0438\u0442\u0440\u0430\u043c\u0438<\/li>\n <li>\u25b8 \u041a\u043e\u043d\u0441\u043f\u0435\u043a\u0442\u044b \u043b\u0435\u043a\u0446\u0438\u0439 \u0438 \u0443\u0447\u0435\u0431\u043d\u044b\u0435 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044b<\/li>\n <li>\u25b8 \u0417\u0430\u0434\u0430\u043d\u0438\u044f \u0438 \u044d\u043a\u0437\u0430\u043c\u0435\u043d\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0435 \u0432\u043e\u043f\u0440\u043e\u0441\u044b<\/li>\n <li>\u25b8 \u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0438 \u0441\u0441\u044b\u043b\u043a\u0438<\/li>\n <\/ul>\n \n <div style=\"background: #f0fff0; padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p><strong>\u0418\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e:<\/strong> MIT \u0442\u0430\u043a\u0436\u0435 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u043a\u0443\u0440\u0441 \"Measurement and Instrumentation\", \u0433\u0434\u0435 \u0441\u0442\u0443\u0434\u0435\u043d\u0442\u044b \u0441\u043e\u0437\u0434\u0430\u044e\u0442 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0435 \u0438\u0437\u043c\u0435\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u0438\u0431\u043e\u0440\u044b \u0438 \u0438\u0437\u0443\u0447\u0430\u044e\u0442 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u044b.<\/p>\n <\/div>\n `\n },\n iso: {\n title: \"International Organization for Standardization (ISO)\",\n content: `\n <h4>\u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0430<\/h4>\n <p>ISO \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442 \u0434\u043e\u0431\u0440\u043e\u0432\u043e\u043b\u044c\u043d\u044b\u0435 \u043c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u044e\u0442 \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u0438\u043c\u043e\u0441\u0442\u044c \u0438 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u043e \u043f\u0440\u043e\u0434\u0443\u043a\u0446\u0438\u0438 \u0438 \u0443\u0441\u043b\u0443\u0433 \u043f\u043e \u0432\u0441\u0435\u043c\u0443 \u043c\u0438\u0440\u0443.<\/p>\n \n <h4>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u043f\u043e \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438:<\/h4>\n <ul>\n <li><strong>ISO 80000:<\/strong> \u0412\u0435\u043b\u0438\u0447\u0438\u043d\u044b \u0438 \u0435\u0434\u0438\u043d\u0438\u0446\u044b (\u0447\u0430\u0441\u0442\u0438 1-14)<\/li>\n <li><strong>ISO\/IEC 17025:<\/strong> \u041e\u0431\u0449\u0438\u0435 \u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u0438\u044f \u043a \u043a\u043e\u043c\u043f\u0435\u0442\u0435\u043d\u0442\u043d\u043e\u0441\u0442\u0438 \u0438\u0441\u043f\u044b\u0442\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0438 \u043a\u0430\u043b\u0438\u0431\u0440\u043e\u0432\u043e\u0447\u043d\u044b\u0445 \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u0439<\/li>\n <li><strong>ISO 10012:<\/strong> \u0421\u0438\u0441\u0442\u0435\u043c\u044b \u043c\u0435\u043d\u0435\u0434\u0436\u043c\u0435\u043d\u0442\u0430 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <li><strong>ISO 5725:<\/strong> \u0422\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u043c\u0435\u0442\u043e\u0434\u043e\u0432 \u0438 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u043e\u0432 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <\/ul>\n \n <h4>\u0420\u043e\u043b\u044c \u0432 \u043c\u0438\u0440\u043e\u0432\u043e\u0439 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438:<\/h4>\n <ul>\n <li>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0435\u0434\u0438\u043d\u044b\u0445 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432<\/li>\n <li>\u0421\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0441 BIPM (\u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u043e\u0435 \u0431\u044e\u0440\u043e \u043c\u0435\u0440 \u0438 \u0432\u0435\u0441\u043e\u0432)<\/li>\n <li>\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043f\u0440\u043e\u0446\u0435\u0434\u0443\u0440 \u043a\u0430\u043b\u0438\u0431\u0440\u043e\u0432\u043a\u0438 \u0438 \u0432\u0435\u0440\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438<\/li>\n <li>\u041e\u0431\u0435\u0441\u043f\u0435\u0447\u0435\u043d\u0438\u0435 \u043f\u0440\u043e\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0435\u043c\u043e\u0441\u0442\u0438 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <\/ul>\n \n <div style=\"background: #fff0f5; padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p><strong>\u0412\u0430\u0436\u043d\u043e:<\/strong> ISO \u043d\u0435 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u0440\u0430\u0432\u0438\u0442\u0435\u043b\u044c\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0439 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0435\u0439, \u043d\u043e \u0435\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u0447\u0430\u0441\u0442\u043e \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u044e\u0442\u0441\u044f \u043a\u0430\u043a \u043d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u0437\u0430\u043a\u043e\u043d\u043e\u0434\u0430\u0442\u0435\u043b\u044c\u0441\u0442\u0432\u0430\u043c\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0441\u0442\u0440\u0430\u043d.<\/p>\n <\/div>\n `\n },\n nature: {\n title: \"Nature Journal\",\n content: `\n <h4>\u0412\u0435\u0434\u0443\u0449\u0438\u0439 \u043d\u0430\u0443\u0447\u043d\u044b\u0439 \u0436\u0443\u0440\u043d\u0430\u043b<\/h4>\n <p>\u041e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0432 1869 \u0433\u043e\u0434\u0443, Nature \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e\u0434\u043d\u0438\u043c \u0438\u0437 \u0441\u0430\u043c\u044b\u0445 \u043f\u0440\u0435\u0441\u0442\u0438\u0436\u043d\u044b\u0445 \u043c\u0435\u0436\u0434\u0438\u0441\u0446\u0438\u043f\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0445 \u043d\u0430\u0443\u0447\u043d\u044b\u0445 \u0436\u0443\u0440\u043d\u0430\u043b\u043e\u0432 \u0432 \u043c\u0438\u0440\u0435.<\/p>\n \n <h4>\u0417\u043d\u0430\u0447\u0438\u043c\u044b\u0435 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438 \u043f\u043e \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438:<\/h4>\n <ul>\n <li><strong>\"The kilogram is dead. Long live the kilogram!\"<\/strong> (2018) - \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0441\u0442\u0430\u0442\u044c\u044f \u043e \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430<\/li>\n <li><strong>\"Quantum metrology with ultracold atoms\"<\/strong> (2022) - \u043f\u0435\u0440\u0435\u0434\u043e\u0432\u044b\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f<\/li>\n <li><strong>\"A more fundamental International System of Units\"<\/strong> (2019) - \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0439 \u043e\u0431\u0437\u043e\u0440<\/li>\n <li><strong>\"The evolution of measurement\"<\/strong> (2017) - \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u043f\u0435\u0440\u0441\u043f\u0435\u043a\u0442\u0438\u0432\u0430<\/li>\n <\/ul>\n \n <h4>\u041e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u0430:<\/h4>\n <ul>\n <li>\u25b8 \u041e\u0442\u043a\u0440\u044b\u0442\u044b\u0439 \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u043c \u0441\u0442\u0430\u0442\u044c\u044f\u043c<\/li>\n <li>\u25b8 Nature Briefing - \u0431\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u044b\u0439 \u0434\u0430\u0439\u0434\u0436\u0435\u0441\u0442 \u043d\u043e\u0432\u043e\u0441\u0442\u0435\u0439<\/li>\n <li>\u25b8 Nature Podcast - \u0430\u0443\u0434\u0438\u043e\u0444\u043e\u0440\u043c\u0430\u0442 \u043d\u0430\u0443\u0447\u043d\u044b\u0445 \u043d\u043e\u0432\u043e\u0441\u0442\u0435\u0439<\/li>\n <li>\u25b8 Nature Careers - \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0434\u043b\u044f \u0443\u0447\u0435\u043d\u044b\u0445<\/li>\n <\/ul>\n \n <div style=\"background: #f0f8ff; padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p><strong>\u0420\u0435\u043a\u043e\u0440\u0434:<\/strong> \u0421\u0442\u0430\u0442\u044c\u044f 2018 \u0433\u043e\u0434\u0430 \u043e \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430 \u043f\u043e\u043b\u0443\u0447\u0438\u043b\u0430 \u0431\u043e\u043b\u0435\u0435 1000 \u0446\u0438\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0439 \u0437\u0430 \u043f\u0435\u0440\u0432\u044b\u0435 \u0434\u0432\u0430 \u0433\u043e\u0434\u0430 \u043f\u043e\u0441\u043b\u0435 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438.<\/p>\n <\/div>\n `\n },\n npl: {\n title: \"National Physical Laboratory (NPL)\",\n content: `\n <h4>\u041d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u0430\u044f \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u044f \u0412\u0435\u043b\u0438\u043a\u043e\u0431\u0440\u0438\u0442\u0430\u043d\u0438\u0438<\/h4>\n <p>\u041e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u0432 1900 \u0433\u043e\u0434\u0443, NPL \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0432\u0435\u0434\u0443\u0449\u0438\u043c \u0446\u0435\u043d\u0442\u0440\u043e\u043c \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u0439 \u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043e\u043a \u0432 \u0412\u0435\u043b\u0438\u043a\u043e\u0431\u0440\u0438\u0442\u0430\u043d\u0438\u0438.<\/p>\n \n <h4>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0434\u043e\u0441\u0442\u0438\u0436\u0435\u043d\u0438\u044f:<\/h4>\n <ul>\n <li><strong>\u0410\u0442\u043e\u043c\u043d\u044b\u0435 \u0447\u0430\u0441\u044b:<\/strong> NPL \u0441\u044b\u0433\u0440\u0430\u043b\u0430 \u043a\u043b\u044e\u0447\u0435\u0432\u0443\u044e \u0440\u043e\u043b\u044c \u0432 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435 \u0446\u0435\u0437\u0438\u0435\u0432\u044b\u0445 \u0430\u0442\u043e\u043c\u043d\u044b\u0445 \u0447\u0430\u0441\u043e\u0432<\/li>\n <li><strong>\u041a\u0438\u0431\u0435\u0440-\u0432\u0435\u0441\u044b \u041a\u0438\u0431\u0431\u043b\u0430:<\/strong> \u0410\u043a\u0442\u0438\u0432\u043d\u043e\u0435 \u0443\u0447\u0430\u0441\u0442\u0438\u0435 \u0432 \u043c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435<\/li>\n <li><strong>\u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439:<\/strong> \u041f\u043e\u0434\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0435 \u043d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0445 \u044d\u0442\u0430\u043b\u043e\u043d\u043e\u0432<\/li>\n <li><strong>\u041e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b:<\/strong> \u041c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043a\u0443\u0440\u0441\u044b \u0438 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044b<\/li>\n <\/ul>\n \n <h4>\u041f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0440\u0430\u0437\u0434\u0435\u043b\u044b:<\/h4>\n <ul>\n <li>\u25b8 Measurement Guides - \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0440\u0443\u043a\u043e\u0432\u043e\u0434\u0441\u0442\u0432\u0430<\/li>\n <li>\u25b8 SI Units - \u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044b<\/li>\n <li>\u25b8 Research - \u0442\u0435\u043a\u0443\u0449\u0438\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u044b<\/li>\n <li>\u25b8 Training - \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0435 \u043e\u0431\u0443\u0447\u0435\u043d\u0438\u0435<\/li>\n <\/ul>\n \n <div style=\"background: #f5f0ff; padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p><strong>\u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0444\u0430\u043a\u0442:<\/strong> \u0412\u043e \u0432\u0440\u0435\u043c\u044f \u0412\u0442\u043e\u0440\u043e\u0439 \u043c\u0438\u0440\u043e\u0432\u043e\u0439 \u0432\u043e\u0439\u043d\u044b NPL \u0440\u0430\u0431\u043e\u0442\u0430\u043b\u0430 \u043d\u0430\u0434 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u043e\u0439 \u0440\u0430\u0434\u0430\u0440\u0430 \u0438 \u0434\u0440\u0443\u0433\u0438\u0445 \u043a\u0440\u0438\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u0430\u0436\u043d\u044b\u0445 \u0438\u0437\u043c\u0435\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0439.<\/p>\n <\/div>\n `\n }\n };\n \n \/\/ \u0414\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u0432\u0438\u043a\u0442\u043e\u0440\u0438\u043d\u044b\n const quizData = [\n {\n question: \"\u0421\u043a\u043e\u043b\u044c\u043a\u043e \u0433\u0440\u0430\u043c\u043c\u043e\u0432 \u0432 \u043e\u0434\u043d\u043e\u043c \u043a\u0430\u0440\u0430\u0442\u0435?\",\n options: [\"0.2 \u0433\", \"1 \u0433\", \"0.5 \u0433\", \"0.1 \u0433\"],\n correct: 0\n },\n {\n question: \"\u041a\u0430\u043a\u043e\u0439 \u0433\u043e\u0434 \u0441\u0442\u0430\u043b \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u043c \u0434\u043b\u044f \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430?\",\n options: [\"2000\", \"2019\", \"2022\", \"2015\"],\n correct: 1\n },\n {\n question: \"\u0421\u043a\u043e\u043b\u044c\u043a\u043e \u0443\u043d\u0446\u0438\u0439 \u0432 \u043e\u0434\u043d\u043e\u043c \u0444\u0443\u043d\u0442\u0435?\",\n options: [\"12\", \"14\", \"16\", \"20\"],\n correct: 2\n },\n {\n question: \"\u041a\u0430\u043a\u043e\u0439 \u043f\u0440\u0438\u0431\u043e\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0441\u044f \u0434\u043b\u044f \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430 \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u0443\u044e \u041f\u043b\u0430\u043d\u043a\u0430?\",\n options: [\"\u0410\u0442\u043e\u043c\u043d\u044b\u0435 \u0447\u0430\u0441\u044b\", \"\u041a\u0438\u0431\u0435\u0440-\u0432\u0435\u0441\u044b \u041a\u0438\u0431\u0431\u043b\u0430\", \"\u041c\u0430\u0441\u0441-\u0441\u043f\u0435\u043a\u0442\u0440\u043e\u043c\u0435\u0442\u0440\", \"\u042d\u043b\u0435\u043a\u0442\u0440\u043e\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b\"],\n correct: 1\n },\n {\n question: \"\u041f\u0440\u0438\u0431\u043b\u0438\u0437\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u043e\u0432 \u0432 \u043e\u0434\u043d\u043e\u043c \u043f\u0443\u0434\u0435?\",\n options: [\"10 \u043a\u0433\", \"16.38 \u043a\u0433\", \"25 \u043a\u0433\", \"32 \u043a\u0433\"],\n correct: 1\n }\n ];\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043f\u0440\u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0435\n document.addEventListener('DOMContentLoaded', function() {\n console.log('\u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u0431\u043b\u043e\u043a\u0430...');\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0442\u0430\u0431\u043e\u0432\n initTabs();\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f FAQ\n initFAQ();\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0432\u0438\u043a\u0442\u043e\u0440\u0438\u043d\u044b\n initQuiz();\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u044b\u0445 \u043e\u043a\u043e\u043d\n initModals();\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0442\u0430\u0439\u043c\u043b\u0430\u0439\u043d\u0430\n initTimeline();\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432\n initTools();\n \n console.log('\u0418\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0439 \u0431\u043b\u043e\u043a \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d');\n });\n \n \/\/ \u0422\u0430\u0431\u044b\n function initTabs() {\n const tabBtns = document.querySelectorAll('.tab-btn');\n const tabContents = document.querySelectorAll('.tab-content');\n \n tabBtns.forEach(btn => {\n btn.addEventListener('click', function() {\n const tabId = this.getAttribute('data-tab');\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0435 \u0442\u0430\u0431\u044b\n tabBtns.forEach(b => b.classList.remove('active'));\n this.classList.add('active');\n \n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0439 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\n tabContents.forEach(content => {\n content.classList.remove('active');\n if (content.id === tabId || tabId === 'all') {\n content.classList.add('active');\n \n \/\/ \u0424\u0438\u043b\u044c\u0442\u0440\u0443\u0435\u043c \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0435\u0441\u043b\u0438 \u044d\u0442\u043e \u043d\u0435 \"\u0432\u0441\u0435\"\n if (tabId !== 'all') {\n filterResources(tabId);\n } else {\n showAllResources();\n }\n }\n });\n });\n });\n \n \/\/ \u0424\u0438\u043b\u044c\u0442\u0440\u0430\u0446\u0438\u044f \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432\n function filterResources(category) {\n const cards = document.querySelectorAll('.resource-card');\n cards.forEach(card => {\n if (card.getAttribute('data-category') === category) {\n card.style.display = 'flex';\n } else {\n card.style.display = 'none';\n }\n });\n }\n \n function showAllResources() {\n const cards = document.querySelectorAll('.resource-card');\n cards.forEach(card => {\n card.style.display = 'flex';\n });\n }\n }\n \n \/\/ FAQ\n function initFAQ() {\n const faqQuestions = document.querySelectorAll('.faq-question');\n \n faqQuestions.forEach(question => {\n question.addEventListener('click', function() {\n const answer = this.nextElementSibling;\n const isActive = this.classList.contains('active');\n \n \/\/ \u0417\u0430\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0432\u0441\u0435 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435\n document.querySelectorAll('.faq-question').forEach(q => {\n q.classList.remove('active');\n q.nextElementSibling.classList.remove('active');\n });\n \n \/\/ \u041e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0442\u0435\u043a\u0443\u0449\u0438\u0439 \u0435\u0441\u043b\u0438 \u0431\u044b\u043b \u0437\u0430\u043a\u0440\u044b\u0442\n if (!isActive) {\n this.classList.add('active');\n answer.classList.add('active');\n }\n });\n });\n }\n \n \/\/ \u0412\u0438\u043a\u0442\u043e\u0440\u0438\u043d\u0430\n let currentQuestion = 0;\n let score = 0;\n let selectedAnswer = null;\n \n function initQuiz() {\n const prevBtn = document.getElementById('prevBtn');\n const nextBtn = document.getElementById('nextBtn');\n const restartBtn = document.getElementById('restartQuiz');\n \n \/\/ \u0417\u0430\u0433\u0440\u0443\u0437\u043a\u0430 \u043f\u0435\u0440\u0432\u043e\u0433\u043e \u0432\u043e\u043f\u0440\u043e\u0441\u0430\n loadQuestion(currentQuestion);\n \n \/\/ \u041d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f\n prevBtn.addEventListener('click', () => {\n if (currentQuestion > 0) {\n currentQuestion--;\n loadQuestion(currentQuestion);\n }\n });\n \n nextBtn.addEventListener('click', () => {\n if (currentQuestion < quizData.length - 1) {\n currentQuestion++;\n loadQuestion(currentQuestion);\n } else {\n showResults();\n }\n });\n \n \/\/ \u041f\u0435\u0440\u0435\u0437\u0430\u043f\u0443\u0441\u043a\n if (restartBtn) {\n restartBtn.addEventListener('click', restartQuiz);\n }\n }\n \n function loadQuestion(index) {\n const question = quizData[index];\n const questionText = document.getElementById('questionText');\n const optionsContainer = document.getElementById('optionsContainer');\n const prevBtn = document.getElementById('prevBtn');\n const nextBtn = document.getElementById('nextBtn');\n const scoreDisplay = document.getElementById('scoreDisplay');\n const progressBar = document.getElementById('quizProgress');\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0442\u0435\u043a\u0441\u0442 \u0432\u043e\u043f\u0440\u043e\u0441\u0430\n questionText.textContent = question.question;\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u043e\u043f\u0446\u0438\u0438\n optionsContainer.innerHTML = '';\n question.options.forEach((option, i) => {\n const optionElement = document.createElement('div');\n optionElement.className = 'quiz-option';\n optionElement.textContent = option;\n optionElement.dataset.index = i;\n \n optionElement.addEventListener('click', function() {\n \/\/ \u0421\u043d\u0438\u043c\u0430\u0435\u043c \u0432\u044b\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0441 \u0434\u0440\u0443\u0433\u0438\u0445 \u043e\u043f\u0446\u0438\u0439\n document.querySelectorAll('.quiz-option').forEach(opt => {\n opt.classList.remove('selected');\n });\n \n \/\/ \u0412\u044b\u0434\u0435\u043b\u044f\u0435\u043c \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u0443\u044e \u043e\u043f\u0446\u0438\u044e\n this.classList.add('selected');\n selectedAnswer = i;\n \n \/\/ \u041f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u043e\u0442\u0432\u0435\u0442\n const isCorrect = i === question.correct;\n if (isCorrect) {\n this.classList.add('correct');\n } else {\n this.classList.add('incorrect');\n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0439 \u043e\u0442\u0432\u0435\u0442\n document.querySelectorAll('.quiz-option')[question.correct].classList.add('correct');\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0441\u0447\u0435\u0442 \u0435\u0441\u043b\u0438 \u043e\u0442\u0432\u0435\u0442 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0439\n if (isCorrect && !question.answered) {\n score++;\n question.answered = true;\n }\n });\n \n optionsContainer.appendChild(optionElement);\n });\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044e\n prevBtn.disabled = index === 0;\n if (index === quizData.length - 1) {\n nextBtn.innerHTML = '\u0417\u0430\u0432\u0435\u0440\u0448\u0438\u0442\u044c <i class=\"fas fa-flag-checkered\"><\/i>';\n } else {\n nextBtn.innerHTML = '\u0414\u0430\u043b\u0435\u0435 <i class=\"fas fa-arrow-right\"><\/i>';\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u043f\u0440\u043e\u0433\u0440\u0435\u0441\u0441\n scoreDisplay.textContent = `\u0412\u043e\u043f\u0440\u043e\u0441 ${index + 1} \u0438\u0437 ${quizData.length}`;\n progressBar.style.width = `${((index + 1) \/ quizData.length) * 100}%`;\n }\n \n function showResults() {\n const quizContent = document.getElementById('quizContent');\n const quizResults = document.getElementById('quizResults');\n const resultScore = document.getElementById('resultScore');\n const resultMessage = document.getElementById('resultMessage');\n \n \/\/ \u0421\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0432\u043e\u043f\u0440\u043e\u0441\u044b, \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u044b\n quizContent.style.display = 'none';\n quizResults.style.display = 'block';\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0441\u0447\u0435\u0442\n resultScore.textContent = `${score}\/${quizData.length}`;\n \n \/\/ \u0413\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u0435\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435\n const percentage = (score \/ quizData.length) * 100;\n let message = '';\n \n if (percentage >= 90) {\n message = '\u041e\u0442\u043b\u0438\u0447\u043d\u044b\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442! \u0412\u044b \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0438\u0439 \u044d\u043a\u0441\u043f\u0435\u0440\u0442 \u0432 \u043c\u0435\u0440\u0430\u0445 \u0432\u0435\u0441\u0430!';\n } else if (percentage >= 70) {\n message = '\u0425\u043e\u0440\u043e\u0448\u0438\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442! \u0412\u044b \u0445\u043e\u0440\u043e\u0448\u043e \u0440\u0430\u0437\u0431\u0438\u0440\u0430\u0435\u0442\u0435\u0441\u044c \u0432 \u0442\u0435\u043c\u0435.';\n } else if (percentage >= 50) {\n message = '\u041d\u0435\u043f\u043b\u043e\u0445\u043e\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442! \u0415\u0441\u0442\u044c \u043a\u0443\u0434\u0430 \u0440\u0430\u0441\u0442\u0438.';\n } else {\n message = '\u041f\u043e\u043f\u0440\u043e\u0431\u0443\u0439\u0442\u0435 \u043f\u0440\u043e\u0439\u0442\u0438 \u0432\u0438\u043a\u0442\u043e\u0440\u0438\u043d\u0443 \u0435\u0449\u0435 \u0440\u0430\u0437!';\n }\n \n resultMessage.textContent = message;\n }\n \n function restartQuiz() {\n currentQuestion = 0;\n score = 0;\n selectedAnswer = null;\n \n \/\/ \u0421\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u0435\u043c \u0441\u0442\u0430\u0442\u0443\u0441 \u0432\u043e\u043f\u0440\u043e\u0441\u043e\u0432\n quizData.forEach(q => q.answered = false);\n \n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0432\u043e\u043f\u0440\u043e\u0441\u044b, \u0441\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u044b\n document.getElementById('quizContent').style.display = 'block';\n document.getElementById('quizResults').style.display = 'none';\n \n \/\/ \u0417\u0430\u0433\u0440\u0443\u0436\u0430\u0435\u043c \u043f\u0435\u0440\u0432\u044b\u0439 \u0432\u043e\u043f\u0440\u043e\u0441\n loadQuestion(currentQuestion);\n }\n \n \/\/ \u041c\u043e\u0434\u0430\u043b\u044c\u043d\u044b\u0435 \u043e\u043a\u043d\u0430\n function initModals() {\n const modal = document.getElementById('resourceModal');\n const modalClose = document.getElementById('modalClose');\n const detailsBtns = document.querySelectorAll('.btn-details');\n \n \/\/ \u041e\u0442\u043a\u0440\u044b\u0442\u0438\u0435 \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043e\u043a\u043d\u0430\n detailsBtns.forEach(btn => {\n btn.addEventListener('click', function() {\n const resourceId = this.getAttribute('data-resource');\n openModal(resourceId);\n });\n });\n \n \/\/ \u0417\u0430\u043a\u0440\u044b\u0442\u0438\u0435 \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043e\u043a\u043d\u0430\n modalClose.addEventListener('click', () => {\n modal.style.display = 'none';\n });\n \n \/\/ \u0417\u0430\u043a\u0440\u044b\u0442\u0438\u0435 \u043f\u0440\u0438 \u043a\u043b\u0438\u043a\u0435 \u0432\u043d\u0435 \u043e\u043a\u043d\u0430\n window.addEventListener('click', (e) => {\n if (e.target === modal) {\n modal.style.display = 'none';\n }\n });\n }\n \n function openModal(resourceId) {\n const modal = document.getElementById('resourceModal');\n const modalTitle = document.getElementById('modalTitle');\n const modalContent = document.getElementById('modalContent');\n \n if (resourceData[resourceId]) {\n modalTitle.textContent = resourceData[resourceId].title;\n modalContent.innerHTML = resourceData[resourceId].content;\n modal.style.display = 'flex';\n }\n }\n \n \/\/ \u0422\u0430\u0439\u043c\u043b\u0430\u0439\u043d\n function initTimeline() {\n const timelineItems = document.querySelectorAll('.timeline-item');\n \n timelineItems.forEach(item => {\n item.addEventListener('click', function() {\n const year = this.getAttribute('data-year');\n alert(`\u0412\u044b\u0431\u0440\u0430\u043d\u0430 \u0434\u0430\u0442\u0430: ${year}\\n\\n${this.querySelector('.timeline-description').textContent}`);\n });\n });\n }\n \n \/\/ \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b\n function initTools() {\n const toolCards = document.querySelectorAll('.tool-card');\n \n toolCards.forEach(card => {\n card.addEventListener('click', function() {\n const link = this.getAttribute('data-link');\n \n if (link) {\n \/\/ \u041e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0441\u0441\u044b\u043b\u043a\u0443 \u0432 \u043d\u043e\u0432\u043e\u0439 \u0432\u043a\u043b\u0430\u0434\u043a\u0435\n window.open(link, '_blank');\n } else {\n \/\/ \u0415\u0441\u043b\u0438 \u043d\u0435\u0442 \u0441\u0441\u044b\u043b\u043a\u0438, \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435\n const toolName = this.querySelector('.tool-name').textContent;\n alert(`\u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \"${toolName}\" \u0441\u043a\u043e\u0440\u043e \u0431\u0443\u0434\u0435\u0442 \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d!\\n\\n\u041c\u044b \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u043c \u043d\u0430\u0434 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435\u043c \u043d\u043e\u0432\u044b\u0445 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0434\u043b\u044f \u0432\u0430\u0448\u0435\u0433\u043e \u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430.`);\n }\n });\n });\n }\n \n})();\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\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430 \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430 \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0438\u0440\u0443\u0439\u0442\u0435 \u043c\u0435\u0436\u0434\u0443 \u043c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u043c\u0438, \u0438\u043c\u043f\u0435\u0440\u0441\u043a\u0438\u043c\u0438 \u0438 \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u043c\u0438 \u0435\u0434\u0438\u043d\u0438\u0446\u0430\u043c\u0438 \u043c\u0430\u0441\u0441\u044b \u0441 \u043d\u0430\u0443\u0447\u043d\u043e\u0439 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c\u044e \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u0432\u0435\u0441\u0430 \u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435: # \u0418\u0417 \u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (kg)\u0413\u0440\u0430\u043c\u043c\u044b (g)\u041c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c\u044b (mg)\u0422\u043e\u043d\u043d\u044b (t)\u0424\u0443\u043d\u0442\u044b (lb)\u0423\u043d\u0446\u0438\u0438 (oz)\u041a\u0430\u0440\u0430\u0442\u044b (ct)\u0421\u0442\u043e\u0443\u043d\u044b (st) \u0412 \u0413\u0440\u0430\u043c\u043c\u044b (g)\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (kg)\u041c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c\u044b (mg)\u0424\u0443\u043d\u0442\u044b (lb)\u0423\u043d\u0446\u0438\u0438 (oz)\u041c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0442\u043e\u043d\u043d\u044b (t)\u041a\u0430\u0440\u0430\u0442\u044b (ct)\u0421\u0442\u043e\u0443\u043d\u044b (st) 1000 \u0433\u0440\u0430\u043c\u043c\u043e\u0432 1000 \u0413\u0440\u0430\u043c\u043c\u044b 2.2046 \u0424\u0443\u043d\u0442\u044b 35.274 \u0423\u043d\u0446\u0438\u0438 5000 \u041a\u0430\u0440\u0430\u0442\u044b…<\/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-223","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages\/223","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/gestro.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=223"}],"version-history":[{"count":23,"href":"https:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages\/223\/revisions"}],"predecessor-version":[{"id":318,"href":"https:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages\/223\/revisions\/318"}],"wp:attachment":[{"href":"https:\/\/gestro.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=223"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":223,"date":"2025-12-30T02:06:36","date_gmt":"2025-12-29T23:06:36","guid":{"rendered":"https:\/\/gestro.ru\/?page_id=223"},"modified":"2026-01-02T12:32:09","modified_gmt":"2026-01-02T09:32:09","slug":"%d0%ba%d0%b0%d0%bb%d1%8c%d0%ba%d1%83%d0%bb%d1%8f%d1%82%d0%be%d1%80-%d0%bc%d0%b5%d1%80-%d0%b2%d0%b5%d1%81%d0%b0","status":"publish","type":"page","link":"https:\/\/gestro.ru\/?page_id=223","title":{"rendered":"\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430"},"content":{"rendered":"\n\n\n\n \n \n \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430<\/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, #4CAF50 0%, #2E7D32 100%);\n color: #333;\n line-height: 1.6;\n min-height: 100vh;\n padding: 20px;\n overflow-x: hidden;\n }\n \n .container {\n max-width: 1400px;\n margin: 0 auto;\n padding: 0 15px;\n width: 100%;\n overflow-x: hidden;\n }\n \n .header {\n text-align: center;\n margin-bottom: 40px;\n color: white;\n text-shadow: 0 2px 10px rgba(0,0,0,0.2);\n padding: 0 10px;\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.95;\n max-width: 800px;\n margin: 0 auto;\n color: #f0f0f0;\n text-shadow: 0 1px 3px rgba(0,0,0,0.3);\n }\n \n .main-grid {\n display: grid;\n grid-template-columns: 1fr 1.5fr;\n gap: 30px;\n margin-bottom: 40px;\n width: 100%;\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.15);\n width: 100%;\n overflow: hidden;\n }\n \n .converter-section {\n background: rgba(255, 255, 255, 0.95);\n backdrop-filter: blur(10px);\n }\n \n .history-card {\n background: rgba(255, 255, 255, 0.95);\n backdrop-filter: blur(10px);\n border-radius: 25px;\n padding: 35px;\n box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);\n width: 100%;\n overflow: hidden;\n }\n \n .section-title {\n color: #2c3e50;\n margin-bottom: 25px;\n display: flex;\n align-items: center;\n gap: 15px;\n font-size: 1.8rem;\n word-break: break-word;\n }\n \n .section-title i {\n color: #4CAF50;\n }\n \n \/* \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 *\/\n .converter-form {\n display: flex;\n flex-direction: column;\n gap: 25px;\n width: 100%;\n }\n \n .input-group {\n position: relative;\n width: 100%;\n }\n \n .input-group label {\n display: block;\n margin-bottom: 10px;\n font-weight: 600;\n color: #2c3e50;\n font-size: 1.1rem;\n }\n \n .input-with-icon {\n position: relative;\n width: 100%;\n }\n \n .input-with-icon input {\n width: 100%;\n padding: 18px 20px 18px 60px;\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 box-sizing: border-box;\n }\n \n .input-with-icon input:focus {\n border-color: #4CAF50;\n background: white;\n box-shadow: 0 5px 20px rgba(76, 175, 80, 0.1);\n outline: none;\n }\n \n .input-icon {\n position: absolute;\n left: 20px;\n top: 50%;\n transform: translateY(-50%);\n color: #4CAF50;\n font-size: 1.3rem;\n font-weight: bold;\n }\n \n \/* \u0411\u043b\u043e\u043a \u0441 \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0430\u043c\u0438 \"\u0418\u0417\" \u0438 \"\u0412\" *\/\n .unit-selector-with-hints {\n display: flex;\n align-items: center;\n gap: 15px;\n margin-top: 15px;\n width: 100%;\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: #ffffff;\n padding: 3px 10px;\n border-radius: 12px;\n z-index: 3;\n display: flex;\n align-items: center;\n gap: 4px;\n box-shadow: 0 2px 5px rgba(0,0,0,0.1);\n }\n \n .unit-hint-from {\n top: -10px;\n left: 10px;\n background: linear-gradient(135deg, #4CAF50 0%, #2E7D32 100%);\n }\n \n .unit-hint-to {\n bottom: -10px;\n right: 10px;\n background: linear-gradient(135deg, #2196F3 0%, #21CBF3 100%);\n }\n \n .unit-hint i {\n font-size: 0.6rem;\n }\n \n .unit-selector-with-hints select {\n width: 100%;\n padding: 15px;\n border: 3px solid #e0e0e0;\n border-radius: 15px;\n font-size: 1rem;\n font-weight: 600;\n background: #f8f9fa;\n cursor: pointer;\n transition: all 0.3s;\n }\n \n .unit-selector-with-hints select:focus {\n border-color: #4CAF50;\n outline: none;\n background: white;\n }\n \n .swap-button {\n width: 50px;\n height: 50px;\n border-radius: 50%;\n background: linear-gradient(135deg, #4CAF50 0%, #2E7D32 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(76, 175, 80, 0.4);\n }\n \n .result-display {\n background: linear-gradient(135deg, #2196F3 0%, #21CBF3 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(33, 150, 243, 0.2);\n width: 100%;\n box-sizing: border-box;\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 word-break: break-word;\n overflow-wrap: break-word;\n }\n \n .result-unit {\n font-size: 1.3rem;\n opacity: 0.9;\n font-weight: 600;\n word-break: break-word;\n }\n \n .quick-conversions {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 15px;\n margin-top: 30px;\n width: 100%;\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 min-width: 0;\n overflow: hidden;\n }\n \n .quick-conversion-item:hover {\n border-color: #4CAF50;\n transform: translateY(-5px);\n box-shadow: 0 10px 20px rgba(76, 175, 80, 0.1);\n }\n \n .quick-value {\n font-size: 1.5rem;\n font-weight: 700;\n color: #2c3e50;\n margin: 10px 0 5px;\n word-break: break-word;\n }\n \n .quick-unit {\n font-size: 0.9rem;\n color: #666;\n }\n \n \/* \u0412\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f *\/\n .visualization {\n margin-top: 30px;\n padding: 25px;\n background: white;\n border-radius: 20px;\n border: 2px solid #e0e0e0;\n width: 100%;\n box-sizing: border-box;\n overflow: hidden;\n }\n \n .scale-container {\n height: 120px;\n background: linear-gradient(90deg, #f0f0f0 0%, #e0e0e0 100%);\n border-radius: 10px;\n position: relative;\n margin: 30px 0;\n overflow: hidden;\n width: 100%;\n }\n \n .scale-marker {\n position: absolute;\n height: 100%;\n width: 3px;\n background: #4CAF50;\n top: 0;\n transform: translateX(-50%);\n transition: left 1s ease;\n }\n \n .scale-marker::after {\n content: '';\n position: absolute;\n bottom: -10px;\n left: 50%;\n transform: translateX(-50%);\n width: 0;\n height: 0;\n border-left: 10px solid transparent;\n border-right: 10px solid transparent;\n border-top: 10px solid #4CAF50;\n }\n \n .scale-labels {\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n font-size: 0.9rem;\n color: #666;\n font-weight: 600;\n width: 100%;\n flex-wrap: wrap;\n }\n \n .scale-labels span {\n flex: 1;\n min-width: 60px;\n text-align: center;\n }\n \n .comparison-items {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 15px;\n margin-top: 30px;\n width: 100%;\n }\n \n .comparison-item {\n text-align: center;\n padding: 20px;\n background: #f8f9fa;\n border-radius: 15px;\n transition: all 0.3s;\n min-width: 0;\n overflow: hidden;\n }\n \n .comparison-item:hover {\n background: #E8F5E9;\n transform: scale(1.05);\n }\n \n .comparison-icon {\n font-size: 2rem;\n color: #4CAF50;\n margin-bottom: 10px;\n }\n \n .comparison-value {\n font-size: 1.2rem;\n font-weight: 700;\n color: #2c3e50;\n margin: 5px 0;\n word-break: break-word;\n }\n \n \/* \u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043c\u0435\u0440\u044b *\/\n .history-timeline {\n position: relative;\n padding-left: 30px;\n margin: 30px 0;\n width: 100%;\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, #4CAF50, #2E7D32);\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 #4CAF50;\n box-shadow: 0 5px 15px rgba(0,0,0,0.05);\n width: 100%;\n box-sizing: border-box;\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: #4CAF50;\n border: 3px solid white;\n box-shadow: 0 0 0 3px #4CAF50;\n }\n \n .history-period {\n font-weight: 700;\n color: #4CAF50;\n margin-bottom: 8px;\n font-size: 1.1rem;\n word-break: break-word;\n }\n \n .history-description {\n color: #666;\n line-height: 1.5;\n }\n \n \/* \u0415\u0434\u0438\u043d\u0438\u0446\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f *\/\n .units-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));\n gap: 15px;\n margin-top: 25px;\n width: 100%;\n }\n \n .unit-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 cursor: pointer;\n min-width: 0;\n overflow: hidden;\n }\n \n .unit-card:hover {\n border-color: #4CAF50;\n transform: translateY(-5px);\n }\n \n .unit-card.active {\n border-color: #4CAF50;\n background: #E8F5E9;\n box-shadow: 0 10px 20px rgba(76, 175, 80, 0.1);\n }\n \n .unit-symbol {\n font-size: 2rem;\n font-weight: 700;\n color: #4CAF50;\n margin-bottom: 10px;\n word-break: break-all;\n }\n \n .unit-name {\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 5px;\n word-break: break-word;\n }\n \n .unit-value {\n font-size: 0.9rem;\n color: #666;\n word-break: break-word;\n }\n \n \/* \u041a\u043d\u043e\u043f\u043a\u0438 *\/\n .action-buttons {\n display: flex;\n gap: 15px;\n margin-top: 30px;\n flex-wrap: wrap;\n width: 100%;\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 box-sizing: border-box;\n }\n \n .btn-primary {\n background: linear-gradient(135deg, #4CAF50 0%, #2E7D32 100%);\n color: white;\n }\n \n .btn-secondary {\n background: #f8f9fa;\n color: #2c3e50;\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 .btn-primary:hover {\n box-shadow: 0 10px 20px rgba(76, 175, 80, 0.3);\n }\n \n \/* \u0424\u0443\u0442\u0435\u0440 *\/\n .footer {\n text-align: center;\n margin-top: 50px;\n color: white;\n opacity: 0.8;\n font-size: 0.9rem;\n padding: 0 10px;\n width: 100%;\n }\n \n \/* \u0410\u0414\u0410\u041f\u0422\u0418\u0412\u041d\u041e\u0421\u0422\u042c *\/\n @media (max-width: 768px) {\n body {\n padding: 10px;\n }\n \n .container {\n padding: 0 10px;\n max-width: 100%;\n }\n \n .header h1 {\n font-size: 2rem;\n line-height: 1.3;\n padding: 0 5px;\n }\n \n .header p {\n font-size: 1rem;\n padding: 0 5px;\n }\n \n .calculator-card,\n .history-card {\n padding: 20px;\n border-radius: 20px;\n margin: 0 -5px;\n width: calc(100% + 10px);\n }\n \n .section-title {\n font-size: 1.5rem;\n flex-wrap: wrap;\n gap: 10px;\n }\n \n .result-value {\n font-size: 2.5rem;\n line-height: 1.2;\n }\n \n .input-with-icon input {\n padding: 15px 15px 15px 50px;\n font-size: 1.1rem;\n }\n \n .unit-selector-with-hints {\n flex-direction: column;\n gap: 10px;\n }\n \n .unit-select-container {\n width: 100%;\n }\n \n .unit-hint-from {\n top: -10px;\n left: 10px;\n }\n \n .unit-hint-to {\n bottom: -10px;\n right: 10px;\n }\n \n .swap-button {\n align-self: center;\n margin: 5px 0;\n }\n \n .quick-conversions {\n grid-template-columns: repeat(2, 1fr);\n gap: 10px;\n }\n \n .quick-conversion-item {\n padding: 15px;\n }\n \n .quick-value {\n font-size: 1.3rem;\n }\n \n .comparison-items {\n grid-template-columns: 1fr;\n gap: 10px;\n }\n \n .units-grid {\n grid-template-columns: repeat(2, 1fr);\n gap: 10px;\n }\n \n .unit-card {\n padding: 15px;\n }\n \n .unit-symbol {\n font-size: 1.5rem;\n }\n \n .visualization {\n padding: 20px;\n }\n \n .history-timeline {\n padding-left: 20px;\n }\n \n .history-item {\n padding: 20px;\n margin-bottom: 20px;\n }\n \n .history-item::before {\n left: -30px;\n width: 16px;\n height: 16px;\n }\n \n .action-buttons {\n flex-direction: column;\n gap: 10px;\n }\n \n .action-btn {\n min-width: 100%;\n padding: 16px;\n }\n \n .formula-box {\n padding: 12px;\n font-size: 0.9rem;\n overflow-x: auto;\n }\n \n .info-box {\n padding: 15px;\n font-size: 0.9rem;\n }\n }\n \n @media (max-width: 480px) {\n .header h1 {\n font-size: 1.8rem;\n }\n \n .header p {\n font-size: 0.95rem;\n }\n \n .calculator-card,\n .history-card {\n padding: 15px;\n }\n \n .section-title {\n font-size: 1.3rem;\n }\n \n .result-value {\n font-size: 2rem;\n }\n \n .result-unit {\n font-size: 1.1rem;\n }\n \n .quick-conversions {\n grid-template-columns: 1fr;\n }\n \n .units-grid {\n grid-template-columns: 1fr;\n }\n \n .input-with-icon input {\n font-size: 1rem;\n padding: 12px 12px 12px 45px;\n }\n \n .input-icon {\n left: 15px;\n font-size: 1.1rem;\n }\n \n .unit-selector-with-hints select {\n font-size: 0.9rem;\n }\n \n .history-timeline {\n padding-left: 15px;\n }\n \n .history-item {\n padding: 15px;\n }\n \n .history-period {\n font-size: 1rem;\n }\n \n .history-description {\n font-size: 0.9rem;\n }\n \n .comparison-value {\n font-size: 1rem;\n }\n }\n \n \/* \u0418\u0441\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u043e\u0447\u0435\u043d\u044c \u043c\u0430\u043b\u0435\u043d\u044c\u043a\u0438\u0445 \u044d\u043a\u0440\u0430\u043d\u043e\u0432 *\/\n @media (max-width: 360px) {\n .container {\n padding: 0 5px;\n }\n \n .calculator-card,\n .history-card {\n padding: 12px;\n border-radius: 15px;\n }\n \n .header h1 {\n font-size: 1.6rem;\n }\n \n .section-title {\n font-size: 1.2rem;\n }\n \n .result-value {\n font-size: 1.8rem;\n }\n \n .input-with-icon input {\n padding: 10px 10px 10px 40px;\n font-size: 0.9rem;\n }\n }\n \n \/* \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0438 *\/\n @keyframes pulse {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.05); }\n 100% { transform: scale(1); }\n }\n \n .pulse {\n animation: pulse 0.5s ease;\n }\n \n \/* \u0421\u043f\u0440\u0430\u0432\u043a\u0430 *\/\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 width: 100%;\n box-sizing: border-box;\n }\n \n .formula-box {\n background: #f8f9fa;\n padding: 15px;\n border-radius: 10px;\n margin: 15px 0;\n font-family: monospace;\n border: 1px dashed #ddd;\n width: 100%;\n box-sizing: border-box;\n overflow-x: auto;\n }\n \n \/* \u041a\u043d\u043e\u043f\u043a\u0430 \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 *\/\n .reload-button {\n background: #e74c3c;\n color: white;\n border: none;\n padding: 12px 24px;\n border-radius: 10px;\n cursor: pointer;\n font-size: 0.9rem;\n margin-top: 15px;\n transition: all 0.3s;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n width: 100%;\n max-width: 300px;\n justify-content: center;\n box-sizing: border-box;\n }\n \n .reload-button:hover {\n background: #c0392b;\n transform: translateY(-2px);\n box-shadow: 0 5px 15px rgba(231, 76, 60, 0.3);\n }\n \n \/* \u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0438\u0441\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u043f\u0440\u0435\u0434\u043e\u0442\u0432\u0440\u0430\u0449\u0435\u043d\u0438\u044f \u043f\u0435\u0440\u0435\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f *\/\n .units-grid[style*=\"grid-template-columns: repeat(auto-fill, minmax(160px, 1fr))\"] {\n grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)) !important;\n }\n \n @media (max-width: 768px) {\n .units-grid[style*=\"grid-template-columns: repeat(auto-fill, minmax(160px, 1fr))\"] {\n grid-template-columns: repeat(2, 1fr) !important;\n }\n }\n \n @media (max-width: 480px) {\n .units-grid[style*=\"grid-template-columns: repeat(auto-fill, minmax(160px, 1fr))\"] {\n grid-template-columns: 1fr !important;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n \n <div class=\"header\">\n <h1><i class=\"fas fa-weight\"><\/i> \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430<\/h1>\n <p>\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0438\u0440\u0443\u0439\u0442\u0435 \u043c\u0435\u0436\u0434\u0443 \u043c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u043c\u0438, \u0438\u043c\u043f\u0435\u0440\u0441\u043a\u0438\u043c\u0438 \u0438 \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u043c\u0438 \u0435\u0434\u0438\u043d\u0438\u0446\u0430\u043c\u0438 \u043c\u0430\u0441\u0441\u044b \u0441 \u043d\u0430\u0443\u0447\u043d\u043e\u0439 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c\u044e<\/p>\n <\/div>\n \n \n <div class=\"main-grid\">\n \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 \u0432\u0435\u0441\u0430\n <\/h2>\n \n <div class=\"converter-form\">\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=\"1\" step=\"any\" min=\"0\">\n <span class=\"input-icon\">#<\/span>\n <\/div>\n <\/div>\n \n \n <div class=\"unit-selector-with-hints\">\n <div class=\"unit-select-container\">\n <div class=\"unit-hint unit-hint-from\">\n <i class=\"fas fa-long-arrow-alt-right\"><\/i>\n <span>\u0418\u0417<\/span>\n <\/div>\n <select id=\"fromUnit\">\n <option value=\"kg\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (kg)<\/option>\n <option value=\"g\">\u0413\u0440\u0430\u043c\u043c\u044b (g)<\/option>\n <option value=\"mg\">\u041c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c\u044b (mg)<\/option>\n <option value=\"t\">\u0422\u043e\u043d\u043d\u044b (t)<\/option>\n <option value=\"lb\">\u0424\u0443\u043d\u0442\u044b (lb)<\/option>\n <option value=\"oz\">\u0423\u043d\u0446\u0438\u0438 (oz)<\/option>\n <option value=\"carat\">\u041a\u0430\u0440\u0430\u0442\u044b (ct)<\/option>\n <option value=\"stone\">\u0421\u0442\u043e\u0443\u043d\u044b (st)<\/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\">\n <span>\u0412<\/span>\n <i class=\"fas fa-long-arrow-alt-right\"><\/i>\n <\/div>\n <select id=\"toUnit\">\n <option value=\"g\">\u0413\u0440\u0430\u043c\u043c\u044b (g)<\/option>\n <option value=\"kg\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (kg)<\/option>\n <option value=\"mg\">\u041c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c\u044b (mg)<\/option>\n <option value=\"lb\">\u0424\u0443\u043d\u0442\u044b (lb)<\/option>\n <option value=\"oz\">\u0423\u043d\u0446\u0438\u0438 (oz)<\/option>\n <option value=\"t\">\u041c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0442\u043e\u043d\u043d\u044b (t)<\/option>\n <option value=\"carat\">\u041a\u0430\u0440\u0430\u0442\u044b (ct)<\/option>\n <option value=\"stone\">\u0421\u0442\u043e\u0443\u043d\u044b (st)<\/option>\n <\/select>\n <\/div>\n <\/div>\n \n \n <div class=\"result-display\">\n <div id=\"resultValue\" class=\"result-value\">1000<\/div>\n <div id=\"resultUnit\" class=\"result-unit\">\u0433\u0440\u0430\u043c\u043c\u043e\u0432<\/div>\n <\/div>\n \n \n <div class=\"quick-conversions\">\n <div class=\"quick-conversion-item\" data-to=\"g\">\n <div class=\"quick-value\" id=\"quickG\">1000<\/div>\n <div class=\"quick-unit\">\u0413\u0440\u0430\u043c\u043c\u044b<\/div>\n <\/div>\n <div class=\"quick-conversion-item\" data-to=\"lb\">\n <div class=\"quick-value\" id=\"quickLb\">2.2046<\/div>\n <div class=\"quick-unit\">\u0424\u0443\u043d\u0442\u044b<\/div>\n <\/div>\n <div class=\"quick-conversion-item\" data-to=\"oz\">\n <div class=\"quick-value\" id=\"quickOz\">35.274<\/div>\n <div class=\"quick-unit\">\u0423\u043d\u0446\u0438\u0438<\/div>\n <\/div>\n <div class=\"quick-conversion-item\" data-to=\"carat\">\n <div class=\"quick-value\" id=\"quickCarat\">5000<\/div>\n <div class=\"quick-unit\">\u041a\u0430\u0440\u0430\u0442\u044b<\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"visualization\">\n <h3 style=\"color: #2c3e50; margin-bottom: 20px;\">\n <i class=\"fas fa-balance-scale\"><\/i> \u0412\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0430\n <\/h3>\n \n <div class=\"scale-container\">\n <div class=\"scale-marker\" id=\"scaleMarker\" style=\"left: 50%;\"><\/div>\n <\/div>\n \n <div class=\"scale-labels\">\n <span id=\"minLabel\">0<\/span>\n <span id=\"midLabel\">\u0421\u0440\u0435\u0434\u043d\u0435\u0435<\/span>\n <span id=\"maxLabel\">2 \u043a\u0433<\/span>\n <\/div>\n \n <div class=\"comparison-items\">\n <div class=\"comparison-item\">\n <div class=\"comparison-icon\">\n <i class=\"fas fa-apple-alt\"><\/i>\n <\/div>\n <div class=\"comparison-value\" id=\"comparison1\">\u2248 1 \u044f\u0431\u043b\u043e\u043a\u043e<\/div>\n <div>150 \u0433<\/div>\n <\/div>\n <div class=\"comparison-item\">\n <div class=\"comparison-icon\">\n <i class=\"fas fa-hamburger\"><\/i>\n <\/div>\n <div class=\"comparison-value\" id=\"comparison2\">\u2248 2.2 \u0433\u0430\u043c\u0431\u0443\u0440\u0433\u0435\u0440\u0430<\/div>\n <div>\u0411\u0438\u0433 \u041c\u0430\u043a (220 \u0433)<\/div>\n <\/div>\n <div class=\"comparison-item\">\n <div class=\"comparison-icon\">\n <i class=\"fas fa-car\"><\/i>\n <\/div>\n <div class=\"comparison-value\" id=\"comparison3\">\u2248 0.001 \u0430\u0432\u0442\u043e<\/div>\n <div>\u0421\u0440\u0435\u0434\u043d\u0438\u0439 \u0432\u0435\u0441<\/div>\n <\/div>\n <\/div>\n <\/div>\n \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 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\n <\/button>\n <\/div>\n \n \n <div style=\"text-align: center; margin-top: 20px;\">\n <button class=\"reload-button\" id=\"reloadCalcBtn\">\n <i class=\"fas fa-sync-alt\"><\/i> \u041f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044c \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \n <\/button>\n <\/div>\n <\/div>\n \n \n <div class=\"history-card\">\n <h2 class=\"section-title\">\n <i class=\"fas fa-history\"><\/i> \u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043c\u0435\u0440\u044b \u0432\u0435\u0441\u0430\n <\/h2>\n \n <div class=\"info-box\">\n <p><strong>\u0418\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u0444\u0430\u043a\u0442:<\/strong> \u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u2014 \u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u0430\u044f \u0435\u0434\u0438\u043d\u0438\u0446\u0430 \u0421\u0418, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0434\u043e \u0441\u0438\u0445 \u043f\u043e\u0440 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f \u0447\u0435\u0440\u0435\u0437 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0430\u0440\u0442\u0435\u0444\u0430\u043a\u0442 (\u043c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0439 \u043f\u0440\u043e\u0442\u043e\u0442\u0438\u043f \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430).<\/p>\n <\/div>\n \n \n <div class=\"units-grid\">\n <div class=\"unit-card\" data-unit=\"pood\">\n <div class=\"unit-symbol\">\u041f<\/div>\n <div class=\"unit-name\">\u041f\u0443\u0434<\/div>\n <div class=\"unit-value\">\u2248 16.38 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"funt\">\n <div class=\"unit-symbol\">\u0424<\/div>\n <div class=\"unit-name\">\u0424\u0443\u043d\u0442 (\u0440\u0443\u0441.)<\/div>\n <div class=\"unit-value\">\u2248 409.5 \u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"berkovets\">\n <div class=\"unit-symbol\">\u0411<\/div>\n <div class=\"unit-name\">\u0411\u0435\u0440\u043a\u043e\u0432\u0435\u0446<\/div>\n <div class=\"unit-value\">\u2248 163.8 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"lot\">\n <div class=\"unit-symbol\">\u041b<\/div>\n <div class=\"unit-name\">\u041b\u043e\u0442<\/div>\n <div class=\"unit-value\">\u2248 12.8 \u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"zolotnik\">\n <div class=\"unit-symbol\">\u0417<\/div>\n <div class=\"unit-name\">\u0417\u043e\u043b\u043e\u0442\u043d\u0438\u043a<\/div>\n <div class=\"unit-value\">\u2248 4.27 \u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"dolya\">\n <div class=\"unit-symbol\">\u0414<\/div>\n <div class=\"unit-name\">\u0414\u043e\u043b\u044f<\/div>\n <div class=\"unit-value\">\u2248 0.044 \u0433<\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"history-timeline\">\n <div class=\"history-item\">\n <div class=\"history-period\">\u0414\u0440\u0435\u0432\u043d\u0438\u0439 \u0412\u0430\u0432\u0438\u043b\u043e\u043d (~2500 \u0434\u043e \u043d.\u044d.)<\/div>\n <div class=\"history-description\">\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 \u0441\u0438\u0441\u0442\u0435\u043c\u0443 \u0432\u0435\u0441\u0430 \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0448\u0435\u043a\u0435\u043b\u044f (~8.4 \u0433) \u0434\u043b\u044f \u0442\u043e\u0440\u0433\u043e\u0432\u043b\u0438 \u0437\u043e\u043b\u043e\u0442\u043e\u043c \u0438 \u0441\u0435\u0440\u0435\u0431\u0440\u043e\u043c.<\/div>\n <\/div>\n <div class=\"history-item\">\n <div class=\"history-period\">\u0414\u0440\u0435\u0432\u043d\u0438\u0439 \u0420\u0438\u043c<\/div>\n <div class=\"history-description\">«\u041b\u0438\u0431\u0440\u0430» (\u0440\u0438\u043c\u0441\u043a\u0438\u0439 \u0444\u0443\u043d\u0442) \u2248 327.45 \u0433. «\u0423\u043d\u0446\u0438\u044f» = 1\/12 \u043b\u0438\u0431\u0440\u044b \u2248 27.29 \u0433.<\/div>\n <\/div>\n <div class=\"history-item\">\n <div class=\"history-period\">\u0421\u0440\u0435\u0434\u043d\u0435\u0432\u0435\u043a\u043e\u0432\u0430\u044f \u0420\u0443\u0441\u044c<\/div>\n <div class=\"history-description\">\u041f\u0443\u0434 (16.38 \u043a\u0433), \u0444\u0443\u043d\u0442 (409.5 \u0433), \u0431\u0435\u0440\u043a\u043e\u0432\u0435\u0446 (163.8 \u043a\u0433). \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438\u0441\u044c \u0434\u043b\u044f \u0442\u043e\u0440\u0433\u043e\u0432\u043b\u0438 \u0437\u0435\u0440\u043d\u043e\u043c.<\/div>\n <\/div>\n <div class=\"history-item\">\n <div class=\"history-period\">1799 \u0433\u043e\u0434 — \u041c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u0430<\/div>\n <div class=\"history-description\">\u0424\u0440\u0430\u043d\u0446\u0438\u044f \u0432\u0432\u043e\u0434\u0438\u0442 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u043a\u0430\u043a \u043c\u0430\u0441\u0441\u0443 1 \u043a\u0443\u0431\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0434\u0435\u0446\u0438\u043c\u0435\u0442\u0440\u0430 \u0432\u043e\u0434\u044b \u043f\u0440\u0438 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u0435 4\u00b0C.<\/div>\n <\/div>\n <div class=\"history-item\">\n <div class=\"history-period\">2019 \u0433\u043e\u0434 — \u041f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430<\/div>\n <div class=\"history-description\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u0443\u044e \u041f\u043b\u0430\u043d\u043a\u0430, \u0447\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u043b\u043e \u0435\u0433\u043e \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u044b\u043c \u043e\u0442 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0430\u0440\u0442\u0435\u0444\u0430\u043a\u0442\u0430.<\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"formula-box\">\n <strong>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0444\u043e\u0440\u043c\u0443\u043b\u044b \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438:<\/strong><br>\n 1 \u043a\u0433 = 1000 \u0433 = 1 000 000 \u043c\u0433<br>\n 1 \u0444\u0443\u043d\u0442 = 453.59237 \u0433 \u2248 0.4536 \u043a\u0433<br>\n 1 \u0443\u043d\u0446\u0438\u044f = 28.34952 \u0433 \u2248 0.02835 \u043a\u0433<br>\n 1 \u043a\u0430\u0440\u0430\u0442 = 0.2 \u0433 = 200 \u043c\u0433<br>\n 1 \u0441\u0442\u043e\u0443\u043d = 6.35029 \u043a\u0433 \u2248 14 \u0444\u0443\u043d\u0442\u043e\u0432<br>\n 1 \u0442\u043e\u043d\u043d\u0430 = 1000 \u043a\u0433\n <\/div>\n \n \n <h3 style=\"color: #2c3e50; margin: 30px 0 20px;\">\n <i class=\"fas fa-weight-hanging\"><\/i> \u0412\u0441\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f\n <\/h3>\n \n <div class=\"units-grid\" style=\"grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));\">\n <div class=\"unit-card\" data-unit=\"t\">\n <div class=\"unit-symbol\">t<\/div>\n <div class=\"unit-name\">\u041c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0442\u043e\u043d\u043d\u0430<\/div>\n <div class=\"unit-value\">1000 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"kg\">\n <div class=\"unit-symbol\">kg<\/div>\n <div class=\"unit-name\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c<\/div>\n <div class=\"unit-value\">\u0411\u0430\u0437\u043e\u0432\u0430\u044f \u0435\u0434\u0438\u043d\u0438\u0446\u0430<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"g\">\n <div class=\"unit-symbol\">g<\/div>\n <div class=\"unit-name\">\u0413\u0440\u0430\u043c\u043c<\/div>\n <div class=\"unit-value\">0.001 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"mg\">\n <div class=\"unit-symbol\">mg<\/div>\n <div class=\"unit-name\">\u041c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c<\/div>\n <div class=\"unit-value\">0.000001 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"\u00b5g\">\n <div class=\"unit-symbol\">\u00b5g<\/div>\n <div class=\"unit-name\">\u041c\u0438\u043a\u0440\u043e\u0433\u0440\u0430\u043c\u043c<\/div>\n <div class=\"unit-value\">10\u207b\u2079 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"lb\">\n <div class=\"unit-symbol\">lb<\/div>\n <div class=\"unit-name\">\u0424\u0443\u043d\u0442<\/div>\n <div class=\"unit-value\">0.45359237 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"oz\">\n <div class=\"unit-symbol\">oz<\/div>\n <div class=\"unit-name\">\u0423\u043d\u0446\u0438\u044f<\/div>\n <div class=\"unit-value\">0.02834952 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"stone\">\n <div class=\"unit-symbol\">st<\/div>\n <div class=\"unit-name\">\u0421\u0442\u043e\u0443\u043d<\/div>\n <div class=\"unit-value\">6.35029 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"carat\">\n <div class=\"unit-symbol\">ct<\/div>\n <div class=\"unit-name\">\u041a\u0430\u0440\u0430\u0442<\/div>\n <div class=\"unit-value\">0.0002 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"grain\">\n <div class=\"unit-symbol\">gr<\/div>\n <div class=\"unit-name\">\u0413\u0440\u0430\u043d<\/div>\n <div class=\"unit-value\">0.0000648 \u043a\u0433<\/div>\n <\/div>\n <div class=\"unit-card\" data-unit=\"ton_us\">\n <div class=\"unit-symbol\">sh tn<\/div>\n <div class=\"unit-name\">\u0410\u043c\u0435\u0440. \u0442\u043e\u043d\u043d\u0430<\/div>\n <div class=\"unit-value\">907.18474 \u043a\u0433<\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"footer\">\n <p>\u00a9 2026 \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430 | \u0422\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u0434\u043e 15 \u0437\u043d\u0430\u043a\u043e\u0432 \u043f\u043e\u0441\u043b\u0435 \u0437\u0430\u043f\u044f\u0442\u043e\u0439 | \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0434\u0430\u043d\u043d\u044b\u0435 ISO \u0438 \u043c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0445 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432<\/p>\n <\/div>\n <\/div>\n\n <script>\n\/\/ \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c IIFE \u0438 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u0439 \u0434\u043b\u044f \u0433\u0430\u0440\u0430\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u0437\u0430\u043f\u0443\u0441\u043a\u0430\n(function() {\n console.log('=== \u041a\u0410\u041b\u042c\u041a\u0423\u041b\u042f\u0422\u041e\u0420 \u0412\u0415\u0421\u0410 \u041d\u0410\u0427\u0418\u041d\u0410\u0415\u0422 \u0417\u0410\u0413\u0420\u0423\u0417\u041a\u0423 ===');\n \n let calculatorInitialized = false;\n let calculatorElements = null;\n \n function initializeCalculator() {\n if (calculatorInitialized) {\n console.log('\u041a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440 \u0443\u0436\u0435 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d, \u043f\u0440\u043e\u043f\u0443\u0441\u043a\u0430\u0435\u043c...');\n return;\n }\n calculatorInitialized = true;\n \n console.log('\u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430 \u0432\u0435\u0441\u0430...');\n \n try {\n calculatorElements = initCalculator();\n console.log('\u041a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440 \u0432\u0435\u0441\u0430 \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d');\n \n \/\/ \u0424\u043e\u0440\u0441\u0438\u0440\u0443\u0435\u043c \u043f\u0435\u0440\u0432\u044b\u0439 \u0440\u0430\u0441\u0447\u0435\u0442\n setTimeout(() => {\n const calculateBtn = document.getElementById('calculateBtn');\n if (calculateBtn) {\n console.log('\u0412\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u043c \u043f\u0435\u0440\u0432\u044b\u0439 \u0440\u0430\u0441\u0447\u0435\u0442...');\n calculateBtn.click();\n }\n }, 100);\n \n \/\/ \u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u043c \u043c\u043e\u043d\u0438\u0442\u043e\u0440\u0438\u043d\u0433\n setupMonitoring();\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 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430:', error);\n const resultValue = document.getElementById('resultValue');\n if (resultValue) {\n resultValue.textContent = '\u041e\u0448\u0438\u0431\u043a\u0430 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438';\n resultValue.style.color = '#e74c3c';\n }\n calculatorInitialized = false;\n }\n }\n \n \/\/ \u0417\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u043c \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 console.log('\u041e\u0436\u0438\u0434\u0430\u0435\u043c DOMContentLoaded...');\n } else {\n console.log('DOM \u0443\u0436\u0435 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d, \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u043c \u0441\u0440\u0430\u0437\u0443...');\n initializeCalculator();\n }\n \n \/\/ \u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u0437\u0430\u043f\u0443\u0441\u043a \u043f\u0440\u0438 \u043f\u043e\u043b\u043d\u043e\u0439 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b\n window.addEventListener('load', function() {\n console.log('\u0421\u043e\u0431\u044b\u0442\u0438\u0435 window.load \u0441\u0440\u0430\u0431\u043e\u0442\u0430\u043b\u043e');\n if (!calculatorInitialized) {\n console.log('\u0417\u0430\u043f\u0443\u0441\u043a \u0447\u0435\u0440\u0435\u0437 window.load');\n initializeCalculator();\n }\n });\n \n \/\/ \u042d\u043a\u0441\u0442\u0440\u0435\u043d\u043d\u044b\u0439 \u0437\u0430\u043f\u0443\u0441\u043a \u0447\u0435\u0440\u0435\u0437 3 \u0441\u0435\u043a\u0443\u043d\u0434\u044b, \u0435\u0441\u043b\u0438 \u0432\u0441\u0435 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u043e\u0435 \u043d\u0435 \u0441\u0440\u0430\u0431\u043e\u0442\u0430\u043b\u043e\n setTimeout(() => {\n if (!calculatorInitialized) {\n console.log('\u042d\u043a\u0441\u0442\u0440\u0435\u043d\u043d\u044b\u0439 \u0437\u0430\u043f\u0443\u0441\u043a \u043f\u043e \u0442\u0430\u0439\u043c\u0430\u0443\u0442\u0443');\n initializeCalculator();\n }\n }, 3000);\n \n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u043c\u043e\u043d\u0438\u0442\u043e\u0440\u0438\u043d\u0433\u0430 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f\n function setupMonitoring() {\n setInterval(() => {\n if (!calculatorElements) return;\n \n try {\n const value = parseFloat(calculatorElements.inputValue.value) || 0;\n const from = calculatorElements.fromUnit.value;\n const to = calculatorElements.toUnit.value;\n const result = calculatorElements.convert(value, from, to);\n \n console.log('\u041c\u043e\u043d\u0438\u0442\u043e\u0440\u0438\u043d\u0433 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430 \u0432\u0435\u0441\u0430:', {\n \u0432\u0440\u0435\u043c\u044f: new Date().toLocaleTimeString(),\n \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435: value,\n \u0438\u0437: from,\n \u0432: to,\n \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442: result,\n \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442\u0441\u044f: calculatorElements.resultValue.textContent,\n \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d: calculatorInitialized\n });\n } catch (e) {\n console.log('\u041e\u0448\u0438\u0431\u043a\u0430 \u043c\u043e\u043d\u0438\u0442\u043e\u0440\u0438\u043d\u0433\u0430:', e);\n }\n }, 10000);\n }\n \n \/\/ \u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0434\u043b\u044f \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430\n window.reloadCalculator = function() {\n console.log('\u041f\u0440\u0438\u043d\u0443\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0430 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430 \u0432\u0435\u0441\u0430...');\n calculatorInitialized = false;\n initializeCalculator();\n \n const reloadBtn = document.getElementById('reloadCalcBtn');\n if (reloadBtn) {\n const originalHTML = reloadBtn.innerHTML;\n reloadBtn.innerHTML = '<i class=\"fas fa-check\"><\/i> \u041f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d\u043e!';\n reloadBtn.style.background = '#27ae60';\n setTimeout(() => {\n reloadBtn.innerHTML = originalHTML;\n reloadBtn.style.background = '';\n }, 2000);\n }\n };\n \n})();\n\n\/\/ \u041e\u0441\u043d\u043e\u0432\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430\nfunction initCalculator() {\n console.log('\u0424\u0443\u043d\u043a\u0446\u0438\u044f initCalculator \u0434\u043b\u044f \u0432\u0435\u0441\u0430 \u0432\u044b\u0437\u0432\u0430\u043d\u0430');\n \n \/\/ \u041f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0432\u0441\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \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 reloadCalcBtn: document.getElementById('reloadCalcBtn'),\n scaleMarker: document.getElementById('scaleMarker'),\n maxLabel: document.getElementById('maxLabel'),\n minLabel: document.getElementById('minLabel'),\n midLabel: document.getElementById('midLabel')\n };\n \n \/\/ \u041f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u0432\u0441\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b\n for (const [key, element] of Object.entries(elements)) {\n if (!element) {\n console.error('\u042d\u043b\u0435\u043c\u0435\u043d\u0442 \u043d\u0435 \u043d\u0430\u0439\u0434\u0435\u043d: ' + key);\n } else {\n console.log('\u042d\u043b\u0435\u043c\u0435\u043d\u0442 \u043d\u0430\u0439\u0434\u0435\u043d: ' + key);\n }\n }\n \n \/\/ \u041a\u043e\u044d\u0444\u0444\u0438\u0446\u0438\u0435\u043d\u0442\u044b \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438 (\u0432 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b)\n const factors = {\n \/\/ \u041c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u0430\n 'kg': 1,\n 'g': 0.001,\n 'mg': 0.000001,\n '\u00b5g': 0.000000001,\n 't': 1000,\n \n \/\/ \u0418\u043c\u043f\u0435\u0440\u0441\u043a\u0430\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u0430\n 'lb': 0.45359237,\n 'oz': 0.02834952,\n 'stone': 6.35029,\n 'carat': 0.0002,\n 'grain': 0.0000648,\n 'ton_us': 907.18474,\n \n \/\/ \u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0440\u0443\u0441\u0441\u043a\u0438\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b\n 'pood': 16.3805,\n 'funt': 0.4095,\n 'berkovets': 163.8,\n 'lot': 0.0128,\n 'zolotnik': 0.00427,\n 'dolya': 0.000044\n };\n \n \/\/ \u041d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0435\u0434\u0438\u043d\u0438\u0446 (\u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435, \u0441\u0440\u0435\u0434\u043d\u0435\u0435, \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435)\n const unitNames = {\n 'kg': ['\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 'g': ['\u0433\u0440\u0430\u043c\u043c', '\u0433\u0440\u0430\u043c\u043c\u0430', '\u0433\u0440\u0430\u043c\u043c\u043e\u0432'],\n 'mg': ['\u043c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c', '\u043c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c\u0430', '\u043c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c\u043e\u0432'],\n 't': ['\u0442\u043e\u043d\u043d\u0430', '\u0442\u043e\u043d\u043d\u044b', '\u0442\u043e\u043d\u043d'],\n 'lb': ['\u0444\u0443\u043d\u0442', '\u0444\u0443\u043d\u0442\u0430', '\u0444\u0443\u043d\u0442\u043e\u0432'],\n 'oz': ['\u0443\u043d\u0446\u0438\u044f', '\u0443\u043d\u0446\u0438\u0438', '\u0443\u043d\u0446\u0438\u0439'],\n 'stone': ['\u0441\u0442\u043e\u0443\u043d', '\u0441\u0442\u043e\u0443\u043d\u0430', '\u0441\u0442\u043e\u0443\u043d\u043e\u0432'],\n 'carat': ['\u043a\u0430\u0440\u0430\u0442', '\u043a\u0430\u0440\u0430\u0442\u0430', '\u043a\u0430\u0440\u0430\u0442']\n };\n \n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438\n function convert(value, from, to) {\n if (!factors[from] || !factors[to]) {\n console.error('\u041d\u0435\u0438\u0437\u0432\u0435\u0441\u0442\u043d\u0430\u044f \u0435\u0434\u0438\u043d\u0438\u0446\u0430: from=' + from + ', to=' + to);\n return 0;\n }\n \n const valueInKg = value * factors[from];\n return valueInKg \/ factors[to];\n }\n \n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0444\u043e\u0440\u043c\u0430\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0447\u0438\u0441\u043b\u0430\n function formatNumber(num) {\n if (num === 0 || isNaN(num)) return '0';\n \n const absNum = Math.abs(num);\n \n if (absNum >= 1000000) {\n return num.toExponential(2).replace('e+', '\u00d710^');\n } else if (absNum >= 1000) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 2 });\n } else if (absNum >= 1) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 4 });\n } else if (absNum >= 0.001) {\n return num.toLocaleString('ru-RU', { maximumFractionDigits: 6 });\n } else {\n return num.toExponential(2).replace('e-', '\u00d710^-');\n }\n }\n \n \/\/ \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0444\u043e\u0440\u043c\u044b \u0441\u043b\u043e\u0432\u0430 - \u0418\u0421\u041f\u0420\u0410\u0412\u041b\u0415\u041d\u041e \u0414\u041b\u042f WORDPRESS\n function getUnitForm(result, unitKey) {\n if (!unitNames[unitKey]) 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];\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 \/\/ \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0435 \u0443\u0441\u043b\u043e\u0432\u0438\u044f \u0434\u043b\u044f WordPress\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];\n }\n \n \/\/ \u0414\u043b\u044f \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0445 \u0441\u043b\u0443\u0447\u0430\u0435\u0432\n return unitNames[unitKey][2];\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0441\u0435\u0445 \u0434\u0430\u043d\u043d\u044b\u0445\n function updateAll() {\n try {\n const value = parseFloat(elements.inputValue.value) || 0;\n const from = elements.fromUnit.value;\n const to = elements.toUnit.value;\n \n \/\/ \u0412\u044b\u0447\u0438\u0441\u043b\u044f\u0435\u043c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\n const result = convert(value, from, to);\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\n elements.resultValue.textContent = formatNumber(result);\n elements.resultUnit.textContent = getUnitForm(result, to);\n \n \/\/ \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 \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e\n updateVisualization(value, from);\n \n \/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e\n elements.resultValue.classList.remove('pulse');\n void elements.resultValue.offsetWidth;\n elements.resultValue.classList.add('pulse');\n \n console.log('\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u044f \u0432\u0435\u0441\u0430: ' + value + ' ' + from + ' = ' + result + ' ' + to);\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 elements.resultValue.textContent = '\u041e\u0428\u0418\u0411\u041a\u0410';\n elements.resultUnit.textContent = '';\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\n function updateQuickConversions(value, from) {\n const quickUnits = ['g', 'lb', 'oz', 'carat'];\n \n quickUnits.forEach(unit => {\n const elementId = 'quick' + unit.charAt(0).toUpperCase() + unit.slice(1);\n const element = document.getElementById(elementId);\n if (element) {\n const result = convert(value, from, unit);\n element.textContent = formatNumber(result);\n }\n });\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438\n function updateVisualization(value, from) {\n try {\n const valueInKg = value * factors[from];\n \n \/\/ \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u043c \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u0448\u043a\u0430\u043b\u044b\n let maxValue = 1;\n let maxLabel = \"1 \u043a\u0433\";\n \n if (valueInKg < 0.001) {\n maxValue = 0.001;\n maxLabel = \"1 \u0433\";\n } else if (valueInKg < 0.01) {\n maxValue = 0.01;\n maxLabel = \"10 \u0433\";\n } else if (valueInKg < 0.1) {\n maxValue = 0.1;\n maxLabel = \"100 \u0433\";\n } else if (valueInKg < 1) {\n maxValue = 1;\n maxLabel = \"1 \u043a\u0433\";\n } else if (valueInKg < 10) {\n maxValue = 10;\n maxLabel = \"10 \u043a\u0433\";\n } else if (valueInKg < 100) {\n maxValue = 100;\n maxLabel = \"100 \u043a\u0433\";\n } else {\n maxValue = Math.ceil(valueInKg \/ 100) * 100;\n maxLabel = formatNumber(maxValue) + \" \u043a\u0433\";\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u043c\u0435\u0442\u043a\u0443\n if (elements.maxLabel) {\n elements.maxLabel.textContent = maxLabel;\n }\n \n \/\/ \u041f\u043e\u0437\u0438\u0446\u0438\u044f \u043c\u0430\u0440\u043a\u0435\u0440\u0430\n let position = (valueInKg \/ maxValue) * 100;\n position = Math.max(0, Math.min(100, position));\n \n if (elements.scaleMarker) {\n elements.scaleMarker.style.left = position + '%';\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u044f\n updateComparisons(valueInKg);\n \n } catch (error) {\n console.error('\u041e\u0448\u0438\u0431\u043a\u0430 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438:', error);\n }\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u0439\n function updateComparisons(valueInKg) {\n const comparisons = [\n { id: 'comparison1', unit: 0.15, name: '\u044f\u0431\u043b\u043e\u043a' },\n { id: 'comparison2', unit: 0.22, name: '\u0433\u0430\u043c\u0431\u0443\u0440\u0433\u0435\u0440' },\n { id: 'comparison3', unit: 1500, name: '\u0430\u0432\u0442\u043e' }\n ];\n \n comparisons.forEach(comp => {\n const element = document.getElementById(comp.id);\n if (element) {\n const count = valueInKg \/ comp.unit;\n \n \/\/ \u0424\u043e\u0440\u043c\u0430\u0442\u0438\u0440\u0443\u0435\u043c \u0447\u0438\u0441\u043b\u043e\n let formattedCount;\n if (count === 0) formattedCount = '0';\n else if (Math.abs(count) >= 1000) formattedCount = count.toFixed(0);\n else if (Math.abs(count) >= 100) formattedCount = count.toFixed(0);\n else if (Math.abs(count) >= 10) formattedCount = count.toFixed(1);\n else if (Math.abs(count) >= 1) formattedCount = count.toFixed(2);\n else formattedCount = count.toFixed(3);\n \n \/\/ \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u043c \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u0435 - \u0418\u0421\u041f\u0420\u0410\u0412\u041b\u0415\u041d\u041e \u0414\u041b\u042f WORDPRESS\n let ending = '';\n const absCount = Math.abs(count);\n const lastDigit = Math.floor(absCount) % 10;\n const lastTwoDigits = Math.floor(absCount) % 100;\n \n if (comp.name === '\u044f\u0431\u043b\u043e\u043a') {\n if (Math.abs(absCount - 1) < 0.01) ending = '\u043e';\n else {\n var cond1 = lastDigit >= 2;\n var cond2 = lastDigit <= 4;\n var cond3 = lastTwoDigits < 10;\n var cond4 = lastTwoDigits >= 20;\n \n if (cond1 && cond2 && (cond3 || cond4)) {\n ending = '\u0430';\n } else {\n ending = '';\n }\n }\n } else if (comp.name === '\u0433\u0430\u043c\u0431\u0443\u0440\u0433\u0435\u0440') {\n if (Math.abs(absCount - 1) < 0.01) ending = '';\n else {\n var cond1 = lastDigit >= 2;\n var cond2 = lastDigit <= 4;\n var cond3 = lastTwoDigits < 10;\n var cond4 = lastTwoDigits >= 20;\n \n if (cond1 && cond2 && (cond3 || cond4)) {\n ending = '\u0430';\n } else {\n ending = '\u043e\u0432';\n }\n }\n } else if (comp.name === '\u0430\u0432\u0442\u043e') {\n if (Math.abs(absCount - 1) < 0.01) ending = '';\n else {\n var cond1 = lastDigit >= 2;\n var cond2 = lastDigit <= 4;\n var cond3 = lastTwoDigits < 10;\n var cond4 = lastTwoDigits >= 20;\n \n if (cond1 && cond2 && (cond3 || cond4)) {\n ending = '';\n } else {\n ending = '';\n }\n }\n }\n \n element.textContent = '\u2248 ' + formattedCount + ' ' + comp.name + ending;\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 \n \/\/ \u041f\u0440\u0438\u043d\u0443\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u0440\u0438 \u0444\u043e\u043a\u0443\u0441\u0435 \u043d\u0430 \u043f\u043e\u043b\u0435 \u0432\u0432\u043e\u0434\u0430\n if (elements.inputValue) {\n elements.inputValue.addEventListener('focus', function() {\n updateAll();\n });\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u0440\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 \u0447\u0435\u0440\u0435\u0437 \u043a\u043d\u043e\u043f\u043a\u0438\n if (elements.inputValue) elements.inputValue.addEventListener('change', updateAll);\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 elements.inputValue.value = '1';\n elements.fromUnit.value = 'kg';\n elements.toUnit.value = 'g';\n updateAll();\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 }\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 const text = elements.resultValue.textContent + ' ' + elements.resultUnit.textContent;\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 }).catch(err => {\n console.error('\u041e\u0448\u0438\u0431\u043a\u0430 \u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f:', err);\n alert('\u041d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442');\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 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 } catch (err) {\n console.error('\u041e\u0448\u0438\u0431\u043a\u0430 \u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f:', err);\n alert('\u041d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442');\n }\n document.body.removeChild(textArea);\n }\n });\n }\n \n \/\/ \u041a\u043d\u043e\u043f\u043a\u0430 \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u0430\n if (elements.reloadCalcBtn) {\n elements.reloadCalcBtn.addEventListener('click', function() {\n window.reloadCalculator();\n });\n }\n \n \/\/ \u0411\u044b\u0441\u0442\u0440\u044b\u0435 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438\n document.querySelectorAll('.quick-conversion-item').forEach(item => {\n item.addEventListener('click', function() {\n const targetUnit = this.getAttribute('data-to');\n if (targetUnit && elements.toUnit) {\n elements.toUnit.value = targetUnit;\n updateAll();\n \n \/\/ \u041f\u043e\u0434\u0441\u0432\u0435\u0442\u043a\u0430\n document.querySelectorAll('.quick-conversion-item').forEach(i => {\n i.classList.remove('active');\n });\n this.classList.add('active');\n setTimeout(() => this.classList.remove('active'), 1000);\n }\n });\n });\n \n \/\/ \u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b \u0438 \u0432\u0441\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b\n document.querySelectorAll('.unit-card[data-unit]').forEach(card => {\n card.addEventListener('click', function() {\n const unit = this.getAttribute('data-unit');\n const value = parseFloat(elements.inputValue.value) || 0;\n const from = elements.fromUnit.value;\n \n \/\/ \u0414\u043b\u044f \u0432\u0441\u0435\u0445 \u0435\u0434\u0438\u043d\u0438\u0446 \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\n const result = convert(value, from, unit);\n \n \/\/ \u0421\u043e\u0437\u0434\u0430\u0435\u043c \u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0435 \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u0435\n const toast = document.createElement('div');\n toast.style.cssText = 'position: fixed; bottom: 20px; right: 20px; background: #4CAF50; color: white; padding: 15px; border-radius: 10px; z-index: 1000; box-shadow: 0 4px 12px rgba(0,0,0,0.2);';\n toast.textContent = formatNumber(value) + ' ' + (unitNames[from] ? unitNames[from][2] : from) + ' = ' + formatNumber(result) + ' ' + unit;\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 \/\/ \u041f\u043e\u0434\u0441\u0432\u0435\u0442\u043a\u0430\n document.querySelectorAll('.unit-card').forEach(c => {\n c.classList.remove('active');\n });\n this.classList.add('active');\n setTimeout(() => this.classList.remove('active'), 1500);\n });\n });\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 }, 100);\n \n \/\/ \u0412\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0434\u043b\u044f \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u0438\u0437\u0432\u043d\u0435\n return {\n elements: elements,\n convert: convert,\n updateAll: updateAll,\n updateQuickConversions: updateQuickConversions,\n updateVisualization: updateVisualization\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>\u0420\u0435\u0441\u0443\u0440\u0441\u044b \u043f\u043e \u0442\u0435\u043c\u0435 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430<\/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, #f8f9fa 0%, #e9ecef 100%);\n color: #333;\n line-height: 1.6;\n min-height: 100vh;\n padding: 20px;\n }\n \n .resources-container {\n max-width: 1400px;\n margin: 0 auto;\n padding: 0 15px;\n }\n \n .resources-header {\n text-align: center;\n margin-bottom: 40px;\n padding: 30px;\n background: linear-gradient(135deg, #4CAF50 0%, #2E7D32 100%);\n border-radius: 20px;\n color: white;\n box-shadow: 0 10px 30px rgba(76, 175, 80, 0.2);\n }\n \n .resources-header h1 {\n font-size: 2.5rem;\n margin-bottom: 15px;\n }\n \n .resources-header p {\n font-size: 1.2rem;\n opacity: 0.95;\n max-width: 800px;\n margin: 0 auto;\n }\n \n .tabs-container {\n display: flex;\n gap: 10px;\n margin-bottom: 30px;\n flex-wrap: wrap;\n background: white;\n padding: 20px;\n border-radius: 15px;\n box-shadow: 0 5px 20px rgba(0,0,0,0.08);\n }\n \n .tab-btn {\n padding: 12px 24px;\n background: #f8f9fa;\n border: 2px solid #e0e0e0;\n border-radius: 10px;\n cursor: pointer;\n font-weight: 600;\n color: #2c3e50;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n \n .tab-btn:hover {\n background: #E8F5E9;\n border-color: #4CAF50;\n transform: translateY(-2px);\n }\n \n .tab-btn.active {\n background: #4CAF50;\n color: white;\n border-color: #4CAF50;\n }\n \n .tab-content {\n display: none;\n animation: fadeIn 0.5s ease;\n }\n \n .tab-content.active {\n display: block;\n }\n \n @keyframes fadeIn {\n from { opacity: 0; transform: translateY(10px); }\n to { opacity: 1; transform: translateY(0); }\n }\n \n .resources-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));\n gap: 25px;\n margin-bottom: 40px;\n }\n \n @media (max-width: 768px) {\n .resources-grid {\n grid-template-columns: 1fr;\n }\n }\n \n .resource-card {\n background: white;\n border-radius: 15px;\n overflow: hidden;\n box-shadow: 0 10px 25px rgba(0,0,0,0.08);\n transition: all 0.3s;\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n \n .resource-card:hover {\n transform: translateY(-10px);\n box-shadow: 0 20px 40px rgba(0,0,0,0.12);\n }\n \n .resource-header {\n padding: 25px 25px 15px;\n background: linear-gradient(135deg, #2196F3 0%, #21CBF3 100%);\n color: white;\n position: relative;\n }\n \n .resource-header.nist {\n background: linear-gradient(135deg, #0056b3 0%, #0066cc 100%);\n }\n \n .resource-header.royal {\n background: linear-gradient(135deg, #c62828 0%, #d32f2f 100%);\n }\n \n .resource-header.mit {\n background: linear-gradient(135deg, #8a2387 0%, #e94057 100%);\n }\n \n .resource-header.iso {\n background: linear-gradient(135deg, #008000 0%, #00cc00 100%);\n }\n \n .resource-header.npl {\n background: linear-gradient(135deg, #003399 0%, #3366cc 100%);\n }\n \n .resource-header.nature {\n background: linear-gradient(135deg, #0d47a1 0%, #1976d2 100%);\n }\n \n .resource-icon {\n position: absolute;\n top: 20px;\n right: 20px;\n font-size: 2rem;\n opacity: 0.8;\n }\n \n .resource-title {\n font-size: 1.4rem;\n font-weight: 700;\n margin-bottom: 8px;\n max-width: 80%;\n }\n \n .resource-type {\n display: inline-block;\n padding: 4px 12px;\n background: rgba(255,255,255,0.2);\n border-radius: 20px;\n font-size: 0.8rem;\n font-weight: 600;\n margin-bottom: 10px;\n }\n \n .resource-content {\n padding: 25px;\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n }\n \n .resource-description {\n color: #666;\n margin-bottom: 20px;\n line-height: 1.5;\n flex-grow: 1;\n }\n \n .resource-features {\n margin-bottom: 20px;\n }\n \n .feature-item {\n display: flex;\n align-items: center;\n gap: 10px;\n margin-bottom: 10px;\n color: #555;\n }\n \n .feature-item i {\n color: #4CAF50;\n font-size: 0.9rem;\n }\n \n .resource-actions {\n display: flex;\n gap: 10px;\n margin-top: auto;\n }\n \n .btn-visit {\n flex: 1;\n padding: 12px 20px;\n background: #4CAF50;\n color: white;\n border: none;\n border-radius: 8px;\n cursor: pointer;\n font-weight: 600;\n text-decoration: none;\n text-align: center;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n }\n \n .btn-visit:hover {\n background: #45a049;\n transform: translateY(-2px);\n box-shadow: 0 5px 15px rgba(76, 175, 80, 0.3);\n }\n \n .btn-details {\n padding: 12px 20px;\n background: #f8f9fa;\n color: #2c3e50;\n border: 2px solid #e0e0e0;\n border-radius: 8px;\n cursor: pointer;\n font-weight: 600;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n }\n \n .btn-details:hover {\n background: #e9ecef;\n border-color: #4CAF50;\n }\n \n \/* Interactive Timeline *\/\n .timeline-section {\n background: white;\n border-radius: 20px;\n padding: 30px;\n margin-bottom: 40px;\n box-shadow: 0 10px 30px rgba(0,0,0,0.08);\n }\n \n .timeline-title {\n color: #2c3e50;\n margin-bottom: 25px;\n font-size: 1.8rem;\n display: flex;\n align-items: center;\n gap: 15px;\n }\n \n .timeline {\n position: relative;\n padding-left: 30px;\n max-width: 800px;\n margin: 0 auto;\n }\n \n .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, #4CAF50, #2196F3);\n }\n \n .timeline-item {\n position: relative;\n margin-bottom: 30px;\n padding: 25px;\n background: #f8f9fa;\n border-radius: 15px;\n border-left: 5px solid #4CAF50;\n cursor: pointer;\n transition: all 0.3s;\n }\n \n .timeline-item:hover {\n background: #E8F5E9;\n transform: translateX(10px);\n }\n \n .timeline-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: #4CAF50;\n border: 3px solid white;\n box-shadow: 0 0 0 3px #4CAF50;\n }\n \n .timeline-year {\n font-weight: 700;\n color: #4CAF50;\n margin-bottom: 8px;\n font-size: 1.1rem;\n }\n \n \/* FAQ Section *\/\n .faq-section {\n background: white;\n border-radius: 20px;\n padding: 30px;\n margin-bottom: 40px;\n box-shadow: 0 10px 30px rgba(0,0,0,0.08);\n }\n \n .faq-title {\n color: #2c3e50;\n margin-bottom: 25px;\n font-size: 1.8rem;\n display: flex;\n align-items: center;\n gap: 15px;\n }\n \n .faq-item {\n margin-bottom: 15px;\n border: 2px solid #e0e0e0;\n border-radius: 10px;\n overflow: hidden;\n }\n \n .faq-question {\n padding: 20px;\n background: #f8f9fa;\n cursor: pointer;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n justify-content: space-between;\n align-items: center;\n transition: all 0.3s;\n }\n \n .faq-question:hover {\n background: #E8F5E9;\n }\n \n .faq-question.active {\n background: #4CAF50;\n color: white;\n }\n \n .faq-answer {\n padding: 0;\n max-height: 0;\n overflow: hidden;\n transition: all 0.3s ease;\n background: white;\n }\n \n .faq-answer.active {\n padding: 20px;\n max-height: 500px;\n }\n \n .faq-answer ul {\n padding-left: 20px;\n margin: 10px 0;\n }\n \n .faq-answer li {\n margin-bottom: 8px;\n }\n \n \/* Knowledge Quiz *\/\n .quiz-section {\n background: white;\n border-radius: 20px;\n padding: 30px;\n margin-bottom: 40px;\n box-shadow: 0 10px 30px rgba(0,0,0,0.08);\n }\n \n .quiz-title {\n color: #2c3e50;\n margin-bottom: 25px;\n font-size: 1.8rem;\n display: flex;\n align-items: center;\n gap: 15px;\n }\n \n .quiz-progress {\n height: 8px;\n background: #e0e0e0;\n border-radius: 4px;\n margin-bottom: 20px;\n overflow: hidden;\n }\n \n .quiz-progress-bar {\n height: 100%;\n background: #4CAF50;\n width: 0%;\n transition: width 0.3s ease;\n }\n \n .quiz-question {\n font-size: 1.2rem;\n font-weight: 600;\n margin-bottom: 20px;\n color: #2c3e50;\n }\n \n .quiz-options {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 15px;\n margin-bottom: 25px;\n }\n \n .quiz-option {\n padding: 15px;\n background: #f8f9fa;\n border: 2px solid #e0e0e0;\n border-radius: 10px;\n cursor: pointer;\n transition: all 0.3s;\n text-align: center;\n }\n \n .quiz-option:hover {\n background: #E8F5E9;\n border-color: #4CAF50;\n }\n \n .quiz-option.selected {\n background: #4CAF50;\n color: white;\n border-color: #4CAF50;\n }\n \n .quiz-option.correct {\n background: #4CAF50;\n color: white;\n border-color: #4CAF50;\n }\n \n .quiz-option.incorrect {\n background: #f44336;\n color: white;\n border-color: #f44336;\n }\n \n .quiz-navigation {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n \n .quiz-btn {\n padding: 12px 24px;\n background: #4CAF50;\n color: white;\n border: none;\n border-radius: 8px;\n cursor: pointer;\n font-weight: 600;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n \n .quiz-btn:hover:not(:disabled) {\n background: #45a049;\n transform: translateY(-2px);\n }\n \n .quiz-btn:disabled {\n background: #cccccc;\n cursor: not-allowed;\n }\n \n .quiz-score {\n font-weight: 600;\n color: #2c3e50;\n }\n \n \/* Related Tools *\/\n .tools-section {\n background: white;\n border-radius: 20px;\n padding: 30px;\n margin-bottom: 40px;\n box-shadow: 0 10px 30px rgba(0,0,0,0.08);\n }\n \n .tools-title {\n color: #2c3e50;\n margin-bottom: 25px;\n font-size: 1.8rem;\n display: flex;\n align-items: center;\n gap: 15px;\n }\n \n .tools-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 20px;\n }\n \n .tool-card {\n background: #f8f9fa;\n border-radius: 15px;\n padding: 25px;\n text-align: center;\n border: 2px solid #e0e0e0;\n transition: all 0.3s;\n cursor: pointer;\n }\n \n .tool-card:hover {\n background: #E8F5E9;\n border-color: #4CAF50;\n transform: translateY(-5px);\n }\n \n .tool-icon {\n font-size: 3rem;\n color: #4CAF50;\n margin-bottom: 15px;\n }\n \n .tool-name {\n font-weight: 700;\n color: #2c3e50;\n margin-bottom: 10px;\n font-size: 1.3rem;\n }\n \n .tool-desc {\n color: #666;\n margin-bottom: 20px;\n font-size: 0.95rem;\n }\n \n \/* Footer *\/\n .resources-footer {\n text-align: center;\n padding: 30px;\n background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);\n border-radius: 20px;\n color: white;\n margin-bottom: 20px;\n }\n \n .resources-footer p {\n margin-bottom: 15px;\n opacity: 0.9;\n }\n \n .social-links {\n display: flex;\n justify-content: center;\n gap: 15px;\n margin-top: 20px;\n }\n \n .social-link {\n width: 45px;\n height: 45px;\n background: rgba(255,255,255,0.1);\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n color: white;\n text-decoration: none;\n transition: all 0.3s;\n }\n \n .social-link:hover {\n background: #4CAF50;\n transform: translateY(-3px);\n }\n \n \/* Modal *\/\n .modal {\n display: none;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: rgba(0,0,0,0.5);\n z-index: 1000;\n justify-content: center;\n align-items: center;\n animation: fadeIn 0.3s ease;\n }\n \n .modal-content {\n background: white;\n border-radius: 20px;\n padding: 30px;\n max-width: 500px;\n width: 90%;\n max-height: 80vh;\n overflow-y: auto;\n position: relative;\n box-shadow: 0 20px 50px rgba(0,0,0,0.2);\n }\n \n .modal-close {\n position: absolute;\n top: 15px;\n right: 15px;\n background: none;\n border: none;\n font-size: 1.5rem;\n cursor: pointer;\n color: #666;\n }\n \n .modal-close:hover {\n color: #f44336;\n }\n \n .modal-title {\n color: #2c3e50;\n margin-bottom: 20px;\n font-size: 1.5rem;\n }\n \n \/* Responsive *\/\n @media (max-width: 768px) {\n .resources-header h1 {\n font-size: 2rem;\n }\n \n .tabs-container {\n flex-direction: column;\n }\n \n .tab-btn {\n width: 100%;\n }\n \n .resource-actions {\n flex-direction: column;\n }\n \n .quiz-options {\n grid-template-columns: 1fr;\n }\n \n .tools-grid {\n grid-template-columns: 1fr;\n }\n \n .timeline {\n padding-left: 20px;\n }\n \n .timeline-item::before {\n left: -30px;\n width: 16px;\n height: 16px;\n }\n }\n \n @media (max-width: 480px) {\n .resources-header {\n padding: 20px;\n }\n \n .resources-header h1 {\n font-size: 1.8rem;\n }\n \n .tab-btn {\n padding: 10px 20px;\n font-size: 0.9rem;\n }\n \n .resource-content {\n padding: 20px;\n }\n \n .resource-title {\n font-size: 1.2rem;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"resources-container\">\n \n <div class=\"resources-header\">\n <h1><i class=\"fas fa-book-open\"><\/i> \u042d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u044f \u043c\u0435\u0440 \u0432\u0435\u0441\u0430 \u0438 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b<\/h1>\n <p>\u0410\u0432\u0442\u043e\u0440\u0438\u0442\u0435\u0442\u043d\u044b\u0435 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u0438, \u043d\u0430\u0443\u0447\u043d\u044b\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u0438 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0434\u043b\u044f \u0433\u043b\u0443\u0431\u043e\u043a\u043e\u0433\u043e \u0438\u0437\u0443\u0447\u0435\u043d\u0438\u044f \u0442\u0435\u043c\u044b<\/p>\n <\/div>\n \n \n <div class=\"tabs-container\">\n <button class=\"tab-btn active\" data-tab=\"all\">\n <i class=\"fas fa-globe\"><\/i> \u0412\u0441\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b\n <\/button>\n <button class=\"tab-btn\" data-tab=\"official\">\n <i class=\"fas fa-landmark\"><\/i> \u041e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0438\n <\/button>\n <button class=\"tab-btn\" data-tab=\"scientific\">\n <i class=\"fas fa-flask\"><\/i> \u041d\u0430\u0443\u0447\u043d\u044b\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f\n <\/button>\n <button class=\"tab-btn\" data-tab=\"educational\">\n <i class=\"fas fa-graduation-cap\"><\/i> \u041e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b\n <\/button>\n <button class=\"tab-btn\" data-tab=\"tools\">\n <i class=\"fas fa-tools\"><\/i> \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0438 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u044b\n <\/button>\n <\/div>\n \n \n <div id=\"all\" class=\"tab-content active\">\n <div class=\"resources-grid\">\n \n <div class=\"resource-card\" data-category=\"official\">\n <div class=\"resource-header nist\">\n <div class=\"resource-title\">NIST — \u041d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u0438\u043d\u0441\u0442\u0438\u0442\u0443\u0442 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432 \u0421\u0428\u0410<\/div>\n <div class=\"resource-type\">\u041e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0439 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442<\/div>\n <div class=\"resource-icon\"><i class=\"fas fa-balance-scale\"><\/i><\/div>\n <\/div>\n <div class=\"resource-content\">\n <p class=\"resource-description\">\u0412\u0435\u0434\u0443\u0449\u0430\u044f \u043c\u0438\u0440\u043e\u0432\u0430\u044f \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u044f \u043f\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044e \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432 \u043c\u0435\u0440 \u0438 \u0432\u0435\u0441\u043e\u0432. \u041e\u0442\u0432\u0435\u0447\u0430\u0435\u0442 \u0437\u0430 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432 \u0421\u0418 \u0432 \u0421\u0428\u0410.<\/p>\n <div class=\"resource-features\">\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u0435\u0434\u0438\u043d\u0438\u0446 \u0421\u0418<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041c\u0435\u0442\u043e\u0434\u0438\u043a\u0438 \u0442\u043e\u0447\u043d\u044b\u0445 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/span>\n <\/div>\n <\/div>\n <div class=\"resource-actions\">\n <a href=\"https:\/\/www.nist.gov\/\" target=\"_blank\" class=\"btn-visit\">\n <i class=\"fas fa-external-link-alt\"><\/i> \u041f\u043e\u0441\u0435\u0442\u0438\u0442\u044c \u0441\u0430\u0439\u0442\n <\/a>\n <button class=\"btn-details\" data-resource=\"nist\">\n <i class=\"fas fa-info-circle\"><\/i> \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"resource-card\" data-category=\"scientific\">\n <div class=\"resource-header royal\">\n <div class=\"resource-title\">The Royal Society<\/div>\n <div class=\"resource-type\">\u041d\u0430\u0443\u0447\u043d\u043e\u0435 \u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e<\/div>\n <div class=\"resource-icon\"><i class=\"fas fa-crown\"><\/i><\/div>\n <\/div>\n <div class=\"resource-content\">\n <p class=\"resource-description\">\u0412\u0435\u0434\u0443\u0449\u0435\u0435 \u043d\u0430\u0443\u0447\u043d\u043e\u0435 \u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e \u043c\u0438\u0440\u0430 \u0441 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u044f\u043c\u0438 \u043f\u043e \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438, \u0438\u0441\u0442\u043e\u0440\u0438\u0438 \u043c\u0435\u0440 \u0438 \u0442\u043e\u0447\u043d\u044b\u043c \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f\u043c.<\/p>\n <div class=\"resource-features\">\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041d\u0430\u0443\u0447\u043d\u044b\u0435 \u0441\u0442\u0430\u0442\u044c\u0438 \u043f\u043e \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u043c\u0435\u0440<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438 \u043e \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430<\/span>\n <\/div>\n <\/div>\n <div class=\"resource-actions\">\n <a href=\"https:\/\/royalsociety.org\/\" target=\"_blank\" class=\"btn-visit\">\n <i class=\"fas fa-external-link-alt\"><\/i> \u041f\u043e\u0441\u0435\u0442\u0438\u0442\u044c \u0441\u0430\u0439\u0442\n <\/a>\n <button class=\"btn-details\" data-resource=\"royal\">\n <i class=\"fas fa-info-circle\"><\/i> \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"resource-card\" data-category=\"educational\">\n <div class=\"resource-header mit\">\n <div class=\"resource-title\">MIT OpenCourseWare<\/div>\n <div class=\"resource-type\">\u041e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043f\u043b\u0430\u0442\u0444\u043e\u0440\u043c\u0430<\/div>\n <div class=\"resource-icon\"><i class=\"fas fa-university\"><\/i><\/div>\n <\/div>\n <div class=\"resource-content\">\n <p class=\"resource-description\">\u0411\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u044b\u0435 \u043a\u0443\u0440\u0441\u044b \u041c\u0430\u0441\u0441\u0430\u0447\u0443\u0441\u0435\u0442\u0441\u043a\u043e\u0433\u043e \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0441\u0442\u0438\u0442\u0443\u0442\u0430 \u043f\u043e \u0444\u0438\u0437\u0438\u043a\u0435, \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438 \u0438 \u0438\u0441\u0442\u043e\u0440\u0438\u0438 \u043d\u0430\u0443\u043a\u0438.<\/p>\n <div class=\"resource-features\">\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041a\u0443\u0440\u0441 «\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u0438 \u0444\u0438\u043b\u043e\u0441\u043e\u0444\u0438\u044f \u043d\u0430\u0443\u043a\u0438»<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041b\u0435\u043a\u0446\u0438\u0438 \u043f\u043e \u0442\u043e\u0447\u043d\u044b\u043c \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f\u043c<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0423\u0447\u0435\u0431\u043d\u044b\u0435 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044b \u043f\u043e \u0421\u0418<\/span>\n <\/div>\n <\/div>\n <div class=\"resource-actions\">\n <a href=\"https:\/\/ocw.mit.edu\/\" target=\"_blank\" class=\"btn-visit\">\n <i class=\"fas fa-external-link-alt\"><\/i> \u041f\u043e\u0441\u0435\u0442\u0438\u0442\u044c \u0441\u0430\u0439\u0442\n <\/a>\n <button class=\"btn-details\" data-resource=\"mit\">\n <i class=\"fas fa-info-circle\"><\/i> \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"resource-card\" data-category=\"official\">\n <div class=\"resource-header iso\">\n <div class=\"resource-title\">International Organization for Standardization<\/div>\n <div class=\"resource-type\">\u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b<\/div>\n <div class=\"resource-icon\"><i class=\"fas fa-globe-europe\"><\/i><\/div>\n <\/div>\n <div class=\"resource-content\">\n <p class=\"resource-description\">\u0420\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442 \u0438 \u043f\u0443\u0431\u043b\u0438\u043a\u0443\u0435\u0442 \u043c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b, \u0432\u043a\u043b\u044e\u0447\u0430\u044f \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u0421\u0418 \u0438 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u044b.<\/p>\n <div class=\"resource-features\">\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442 ISO 80000 (\u0412\u0435\u043b\u0438\u0447\u0438\u043d\u044b \u0438 \u0435\u0434\u0438\u043d\u0438\u0446\u044b)<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0430\u0446\u0438\u0438<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0435 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/span>\n <\/div>\n <\/div>\n <div class=\"resource-actions\">\n <a href=\"https:\/\/www.iso.org\/\" target=\"_blank\" class=\"btn-visit\">\n <i class=\"fas fa-external-link-alt\"><\/i> \u041f\u043e\u0441\u0435\u0442\u0438\u0442\u044c \u0441\u0430\u0439\u0442\n <\/a>\n <button class=\"btn-details\" data-resource=\"iso\">\n <i class=\"fas fa-info-circle\"><\/i> \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"resource-card\" data-category=\"scientific\">\n <div class=\"resource-header nature\">\n <div class=\"resource-title\">Nature Journal<\/div>\n <div class=\"resource-type\">\u041d\u0430\u0443\u0447\u043d\u044b\u0439 \u0436\u0443\u0440\u043d\u0430\u043b<\/div>\n <div class=\"resource-icon\"><i class=\"fas fa-microscope\"><\/i><\/div>\n <\/div>\n <div class=\"resource-content\">\n <p class=\"resource-description\">\u0412\u0435\u0434\u0443\u0449\u0438\u0439 \u043d\u0430\u0443\u0447\u043d\u044b\u0439 \u0436\u0443\u0440\u043d\u0430\u043b \u0441 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u044f\u043c\u0438 \u043e \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u0445 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f\u0445 \u0432 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438 \u0438 \u0444\u0438\u0437\u0438\u043a\u0438.<\/p>\n <div class=\"resource-features\">\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0421\u0442\u0430\u0442\u044c\u0438 \u043e \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0418\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u043f\u043e \u043a\u0432\u0430\u043d\u0442\u043e\u0432\u043e\u0439 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041d\u0430\u0443\u0447\u043d\u044b\u0435 \u043e\u0431\u0437\u043e\u0440\u044b \u043f\u043e \u0438\u0441\u0442\u043e\u0440\u0438\u0438 \u043c\u0435\u0440<\/span>\n <\/div>\n <\/div>\n <div class=\"resource-actions\">\n <a href=\"https:\/\/www.nature.com\/\" target=\"_blank\" class=\"btn-visit\">\n <i class=\"fas fa-external-link-alt\"><\/i> \u041f\u043e\u0441\u0435\u0442\u0438\u0442\u044c \u0441\u0430\u0439\u0442\n <\/a>\n <button class=\"btn-details\" data-resource=\"nature\">\n <i class=\"fas fa-info-circle\"><\/i> \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"resource-card\" data-category=\"official\">\n <div class=\"resource-header npl\">\n <div class=\"resource-title\">National Physical Laboratory UK<\/div>\n <div class=\"resource-type\">\u041d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u0430\u044f \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u044f<\/div>\n <div class=\"resource-icon\"><i class=\"fas fa-flask\"><\/i><\/div>\n <\/div>\n <div class=\"resource-content\">\n <p class=\"resource-description\">\u0412\u0435\u0434\u0443\u0449\u0430\u044f \u0431\u0440\u0438\u0442\u0430\u043d\u0441\u043a\u0430\u044f \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u044f \u043f\u043e \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f\u043c, \u0443\u0447\u0430\u0441\u0442\u0432\u043e\u0432\u0430\u043b\u0430 \u0432 \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 \u0435\u0434\u0438\u043d\u0438\u0446 \u0421\u0418.<\/p>\n <div class=\"resource-features\">\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u0418\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u043f\u043e \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u043f\u043e \u0421\u0418<\/span>\n <\/div>\n <div class=\"feature-item\">\n <i class=\"fas fa-check-circle\"><\/i>\n <span>\u041a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u044b \u0438 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b<\/span>\n <\/div>\n <\/div>\n <div class=\"resource-actions\">\n <a href=\"https:\/\/www.npl.co.uk\/\" target=\"_blank\" class=\"btn-visit\">\n <i class=\"fas fa-external-link-alt\"><\/i> \u041f\u043e\u0441\u0435\u0442\u0438\u0442\u044c \u0441\u0430\u0439\u0442\n <\/a>\n <button class=\"btn-details\" data-resource=\"npl\">\n <i class=\"fas fa-info-circle\"><\/i> \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"timeline-section\">\n <h2 class=\"timeline-title\">\n <i class=\"fas fa-history\"><\/i> \u0425\u0440\u043e\u043d\u043e\u043b\u043e\u0433\u0438\u044f \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u044f \u043c\u0435\u0440 \u0432\u0435\u0441\u0430\n <\/h2>\n <div class=\"timeline\">\n <div class=\"timeline-item\" data-year=\"3000 \u0434\u043e \u043d.\u044d.\">\n <div class=\"timeline-year\">~3000 \u0434\u043e \u043d.\u044d.<\/div>\n <div class=\"timeline-description\">\u0414\u0440\u0435\u0432\u043d\u0438\u0439 \u0415\u0433\u0438\u043f\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u0441\u0438\u0441\u0442\u0435\u043c\u0443 \u0432\u0435\u0441\u0430 \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0437\u0435\u0440\u0435\u043d \u044f\u0447\u043c\u0435\u043d\u044f \u0434\u043b\u044f \u0442\u043e\u0440\u0433\u043e\u0432\u043b\u0438 \u0437\u043e\u043b\u043e\u0442\u043e\u043c<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"700 \u0434\u043e \u043d.\u044d.\">\n <div class=\"timeline-year\">~700 \u0434\u043e \u043d.\u044d.<\/div>\n <div class=\"timeline-description\">\u0412 \u041b\u0438\u0434\u0438\u0438 (\u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u0430\u044f \u0422\u0443\u0440\u0446\u0438\u044f) \u043f\u043e\u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u043f\u0435\u0440\u0432\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0433\u0438\u0440\u0438<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"290\">\n <div class=\"timeline-year\">290 \u0433. \u043d.\u044d.<\/div>\n <div class=\"timeline-description\">\u0420\u0438\u043c\u0441\u043a\u0438\u0439 \u0438\u043c\u043f\u0435\u0440\u0430\u0442\u043e\u0440 \u0414\u0438\u043e\u043a\u043b\u0435\u0442\u0438\u0430\u043d \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u0443\u044e \u0441\u0438\u0441\u0442\u0435\u043c\u0443 \u043c\u0435\u0440 \u0438 \u0432\u0435\u0441\u043e\u0432<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"1215\">\n <div class=\"timeline-year\">1215 \u0433.<\/div>\n <div class=\"timeline-description\">\u0412\u0435\u043b\u0438\u043a\u0430\u044f \u0445\u0430\u0440\u0442\u0438\u044f \u0432\u043e\u043b\u044c\u043d\u043e\u0441\u0442\u0435\u0439 \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u0435\u0434\u0438\u043d\u044b\u0445 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430 \u043f\u043e \u0432\u0441\u0435\u0439 \u0410\u043d\u0433\u043b\u0438\u0438<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"1799\">\n <div class=\"timeline-year\">1799 \u0433.<\/div>\n <div class=\"timeline-description\">\u0424\u0440\u0430\u043d\u0446\u0438\u044f \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u043a\u0430\u043a \u043c\u0430\u0441\u0441\u0443 1 \u0434\u043c\u00b3 \u0432\u043e\u0434\u044b \u043f\u0440\u0438 4\u00b0C<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"1875\">\n <div class=\"timeline-year\">1875 \u0433.<\/div>\n <div class=\"timeline-description\">\u041f\u043e\u0434\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u041c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u043a\u043e\u043d\u0432\u0435\u043d\u0446\u0438\u0438, \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u043e\u0433\u043e \u0431\u044e\u0440\u043e \u043c\u0435\u0440 \u0438 \u0432\u0435\u0441\u043e\u0432<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"1889\">\n <div class=\"timeline-year\">1889 \u0433.<\/div>\n <div class=\"timeline-description\">\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0442\u043e\u0442\u0438\u043f\u0430 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430 \u0438\u0437 \u043f\u043b\u0430\u0442\u0438\u043d\u043e-\u0438\u0440\u0438\u0434\u0438\u0435\u0432\u043e\u0433\u043e \u0441\u043f\u043b\u0430\u0432\u0430<\/div>\n <\/div>\n <div class=\"timeline-item\" data-year=\"2019\">\n <div class=\"timeline-year\">2019 \u0433.<\/div>\n <div class=\"timeline-description\">\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u0443\u044e \u041f\u043b\u0430\u043d\u043a\u0430, \u043f\u0440\u0435\u043a\u0440\u0430\u0449\u0435\u043d\u0430 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u044c \u043e\u0442 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0430\u0440\u0442\u0435\u0444\u0430\u043a\u0442\u0430<\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"faq-section\">\n <h2 class=\"faq-title\">\n <i class=\"fas fa-question-circle\"><\/i> \u0427\u0430\u0441\u0442\u043e \u0437\u0430\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0435 \u0432\u043e\u043f\u0440\u043e\u0441\u044b\n <\/h2>\n <div class=\"faq-item\">\n <div class=\"faq-question\">\n <span>\u041f\u043e\u0447\u0435\u043c\u0443 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u0431\u044b\u043b \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d \u0432 2019 \u0433\u043e\u0434\u0443?<\/span>\n <i class=\"fas fa-chevron-down\"><\/i>\n <\/div>\n <div class=\"faq-answer\">\n <p>\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u0431\u044b\u043b \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0435\u0439 \u0435\u0434\u0438\u043d\u0438\u0446\u0435\u0439 \u0421\u0418, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u043b\u0430\u0441\u044c \u0447\u0435\u0440\u0435\u0437 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0430\u0440\u0442\u0435\u0444\u0430\u043a\u0442 \u2014 \u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0439 \u043f\u0440\u043e\u0442\u043e\u0442\u0438\u043f \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430. \u041f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0432\u043a\u043b\u044e\u0447\u0430\u043b\u0438:<\/p>\n <ul>\n <li>\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u043c\u0430\u0441\u0441\u044b \u043f\u0440\u043e\u0442\u043e\u0442\u0438\u043f\u0430 \u0441\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0435\u043c (\u043e\u043a\u043e\u043b\u043e 50 \u043c\u0438\u043a\u0440\u043e\u0433\u0440\u0430\u043c\u043c \u0437\u0430 100 \u043b\u0435\u0442)<\/li>\n <li>\u0420\u0438\u0441\u043a \u043f\u043e\u0432\u0440\u0435\u0436\u0434\u0435\u043d\u0438\u044f \u0438\u043b\u0438 \u0443\u0442\u0435\u0440\u0438 \u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0433\u043e \u044d\u0442\u0430\u043b\u043e\u043d\u0430<\/li>\n <li>\u041d\u0435\u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0442\u043e\u0447\u043d\u043e\u0433\u043e \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u044f\u0445<\/li>\n <\/ul>\n <p>\u041d\u043e\u0432\u043e\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u0443\u044e \u041f\u043b\u0430\u043d\u043a\u0430 \u0434\u0435\u043b\u0430\u0435\u0442 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u043c\u044b\u043c \u0432 \u043b\u044e\u0431\u043e\u0439 \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u0438 \u043c\u0438\u0440\u0430 \u0441 \u043a\u0432\u0430\u043d\u0442\u043e\u0432\u043e\u0439 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c\u044e.<\/p>\n <\/div>\n <\/div>\n <div class=\"faq-item\">\n <div class=\"faq-question\">\n <span>\u041a\u0430\u043a \u0442\u043e\u0447\u043d\u043e \u043c\u043e\u0436\u043d\u043e \u0438\u0437\u043c\u0435\u0440\u0438\u0442\u044c \u043c\u0430\u0441\u0441\u0443 \u0441\u0435\u0433\u043e\u0434\u043d\u044f?<\/span>\n <i class=\"fas fa-chevron-down\"><\/i>\n <\/div>\n <div class=\"faq-answer\">\n <p>\u0421\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u043c\u0435\u0442\u043e\u0434\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f \u043c\u0430\u0441\u0441\u044b \u0434\u043e\u0441\u0442\u0438\u0433\u043b\u0438 \u043d\u0435\u0432\u0435\u0440\u043e\u044f\u0442\u043d\u043e\u0439 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u0438:<\/p>\n <ul>\n <li><strong>\u041a\u0438\u0431\u0435\u0440-\u0432\u0435\u0441\u044b \u041a\u0438\u0431\u0431\u043b\u0430:<\/strong> \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442 \u044d\u043b\u0435\u043a\u0442\u0440\u043e\u043c\u0430\u0433\u043d\u0438\u0442\u043d\u0443\u044e \u0441\u0438\u043b\u0443 \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f \u043c\u0430\u0441\u0441\u044b \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u0443\u044e \u041f\u043b\u0430\u043d\u043a\u0430 \u0441 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c\u044e \u0434\u043e 1\u00d710\u207b\u2078<\/li>\n <li><strong>\u041c\u0430\u0441\u0441-\u0441\u043f\u0435\u043a\u0442\u0440\u043e\u043c\u0435\u0442\u0440\u0438\u044f:<\/strong> \u041f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0437\u043c\u0435\u0440\u044f\u0442\u044c \u043c\u0430\u0441\u0441\u0443 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u0430\u0442\u043e\u043c\u043e\u0432 \u0438 \u043c\u043e\u043b\u0435\u043a\u0443\u043b<\/li>\n <li><strong>\u041a\u0432\u0430\u0440\u0446\u0435\u0432\u044b\u0435 \u043c\u0438\u043a\u0440\u043e\u0432\u0435\u0441\u044b:<\/strong> \u0427\u0443\u0432\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u044b \u043a \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044e \u043c\u0430\u0441\u0441\u044b \u0432 \u043d\u0430\u043d\u043e\u0433\u0440\u0430\u043c\u043c\u044b<\/li>\n <li><strong>\u0410\u0442\u043e\u043c\u043d\u043e-\u0441\u0438\u043b\u043e\u0432\u0430\u044f \u043c\u0438\u043a\u0440\u043e\u0441\u043a\u043e\u043f\u0438\u044f:<\/strong> \u041c\u043e\u0436\u0435\u0442 \u0438\u0437\u043c\u0435\u0440\u044f\u0442\u044c \u043c\u0430\u0441\u0441\u0443 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u0432\u0438\u0440\u0443\u0441\u043e\u0432 \u0438 \u043c\u043e\u043b\u0435\u043a\u0443\u043b<\/li>\n <\/ul>\n <\/div>\n <\/div>\n <div class=\"faq-item\">\n <div class=\"faq-question\">\n <span>\u041a\u0430\u043a\u0438\u0435 \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043c\u0435\u0440\u044b \u0432\u0435\u0441\u0430 \u0434\u043e \u0441\u0438\u0445 \u043f\u043e\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f?<\/span>\n <i class=\"fas fa-chevron-down\"><\/i>\n <\/div>\n <div class=\"faq-answer\">\n <p>\u041d\u0435\u0441\u043c\u043e\u0442\u0440\u044f \u043d\u0430 \u043f\u043e\u0432\u0441\u0435\u043c\u0435\u0441\u0442\u043d\u043e\u0435 \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u043c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u044b, \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043c\u0435\u0440\u044b \u0441\u043e\u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0441\u044c:<\/p>\n <ul>\n <li><strong>\u041a\u0430\u0440\u0430\u0442 (0.2 \u0433):<\/strong> \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432 \u044e\u0432\u0435\u043b\u0438\u0440\u043d\u043e\u043c \u0434\u0435\u043b\u0435 \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f \u043c\u0430\u0441\u0441\u044b \u0434\u0440\u0430\u0433\u043e\u0446\u0435\u043d\u043d\u044b\u0445 \u043a\u0430\u043c\u043d\u0435\u0439<\/li>\n <li><strong>\u0423\u043d\u0446\u0438\u044f (28.35 \u0433):<\/strong> \u041f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0432 \u0430\u043f\u0442\u0435\u043a\u0430\u0440\u0441\u043a\u043e\u043c \u0434\u0435\u043b\u0435 \u0438 \u043f\u0440\u0438 \u0442\u043e\u0440\u0433\u043e\u0432\u043b\u0435 \u0434\u0440\u0430\u0433\u043e\u0446\u0435\u043d\u043d\u044b\u043c\u0438 \u043c\u0435\u0442\u0430\u043b\u043b\u0430\u043c\u0438<\/li>\n <li><strong>\u0424\u0443\u043d\u0442 (453.6 \u0433):<\/strong> \u0428\u0438\u0440\u043e\u043a\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432 \u0421\u0428\u0410, \u0412\u0435\u043b\u0438\u043a\u043e\u0431\u0440\u0438\u0442\u0430\u043d\u0438\u0438 \u0434\u043b\u044f \u0431\u044b\u0442\u043e\u0432\u044b\u0445 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <li><strong>\u0422\u0440\u043e\u0439\u0441\u043a\u0430\u044f \u0443\u043d\u0446\u0438\u044f (31.1 \u0433):<\/strong> \u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442 \u0434\u043b\u044f \u0442\u043e\u0440\u0433\u043e\u0432\u043b\u0438 \u0437\u043e\u043b\u043e\u0442\u043e\u043c, \u0441\u0435\u0440\u0435\u0431\u0440\u043e\u043c \u0438 \u0434\u0440\u0443\u0433\u0438\u043c\u0438 \u0434\u0440\u0430\u0433\u043e\u0446\u0435\u043d\u043d\u044b\u043c\u0438 \u043c\u0435\u0442\u0430\u043b\u043b\u0430\u043c\u0438<\/li>\n <li><strong>\u0413\u0440\u0430\u043d (64.8 \u043c\u0433):<\/strong> \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432 \u0431\u0430\u043b\u043b\u0438\u0441\u0442\u0438\u043a\u0435 \u0438 \u0444\u0430\u0440\u043c\u0430\u043a\u043e\u043b\u043e\u0433\u0438\u0438<\/li>\n <\/ul>\n <\/div>\n <\/div>\n <div class=\"faq-item\">\n <div class=\"faq-question\">\n <span>\u041a\u0430\u043a \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u043c\u0435\u0440\u044b \u0432\u0435\u0441\u0430?<\/span>\n <i class=\"fas fa-chevron-down\"><\/i>\n <\/div>\n <div class=\"faq-answer\">\n <p>\u0412 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u0438\u0438 \u0447\u0430\u0441\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u043e\u0431\u044a\u0435\u043c\u043d\u044b\u0435 \u043c\u0435\u0440\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0435 \u0432\u0441\u0435\u0433\u0434\u0430 \u0442\u043e\u0447\u043d\u043e \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0442 \u043c\u0430\u0441\u0441\u0435:<\/p>\n <ul>\n <li>1 \u0447\u0430\u0439\u043d\u0430\u044f \u043b\u043e\u0436\u043a\u0430 \u043c\u0443\u043a\u0438 \u2248 3 \u0433<\/li>\n <li>1 \u0441\u0442\u043e\u043b\u043e\u0432\u0430\u044f \u043b\u043e\u0436\u043a\u0430 \u0441\u0430\u0445\u0430\u0440\u0430 \u2248 12 \u0433<\/li>\n <li>1 \u0441\u0442\u0430\u043a\u0430\u043d \u0432\u043e\u0434\u044b \u2248 240 \u0433<\/li>\n <li>1 \u0443\u043d\u0446\u0438\u044f \u0448\u043e\u043a\u043e\u043b\u0430\u0434\u0430 \u2248 28 \u0433<\/li>\n <li>1 \u0444\u0443\u043d\u0442 \u043c\u0430\u0441\u043b\u0430 \u2248 450 \u0433<\/li>\n <\/ul>\n <p><strong>\u0412\u0430\u0436\u043d\u043e:<\/strong> \u041f\u043b\u043e\u0442\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432 \u0440\u0430\u0437\u043b\u0438\u0447\u0430\u0435\u0442\u0441\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0434\u043b\u044f \u0442\u043e\u0447\u043d\u044b\u0445 \u043a\u043e\u043d\u0432\u0435\u0440\u0441\u0438\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u043a\u0443\u0445\u043e\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b.<\/p>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"quiz-section\">\n <h2 class=\"quiz-title\">\n <i class=\"fas fa-brain\"><\/i> \u041f\u0440\u043e\u0432\u0435\u0440\u044c\u0442\u0435 \u0441\u0432\u043e\u0438 \u0437\u043d\u0430\u043d\u0438\u044f \u043e \u043c\u0435\u0440\u0430\u0445 \u0432\u0435\u0441\u0430\n <\/h2>\n <div class=\"quiz-progress\">\n <div class=\"quiz-progress-bar\" id=\"quizProgress\"><\/div>\n <\/div>\n \n <div id=\"quizContent\">\n <div class=\"quiz-question\" id=\"questionText\">\u0421\u043a\u043e\u043b\u044c\u043a\u043e \u0433\u0440\u0430\u043c\u043c\u043e\u0432 \u0432 \u043e\u0434\u043d\u043e\u043c \u043a\u0430\u0440\u0430\u0442\u0435?<\/div>\n <div class=\"quiz-options\" id=\"optionsContainer\">\n <div class=\"quiz-option\" data-correct=\"true\">0.2 \u0433<\/div>\n <div class=\"quiz-option\" data-correct=\"false\">1 \u0433<\/div>\n <div class=\"quiz-option\" data-correct=\"false\">0.5 \u0433<\/div>\n <div class=\"quiz-option\" data-correct=\"false\">0.1 \u0433<\/div>\n <\/div>\n \n <div class=\"quiz-navigation\">\n <button class=\"quiz-btn\" id=\"prevBtn\" disabled>\n <i class=\"fas fa-arrow-left\"><\/i> \u041d\u0430\u0437\u0430\u0434\n <\/button>\n <div class=\"quiz-score\" id=\"scoreDisplay\">\u0412\u043e\u043f\u0440\u043e\u0441 1 \u0438\u0437 5<\/div>\n <button class=\"quiz-btn\" id=\"nextBtn\">\n \u0414\u0430\u043b\u0435\u0435 <i class=\"fas fa-arrow-right\"><\/i>\n <\/button>\n <\/div>\n <\/div>\n \n <div id=\"quizResults\" style=\"display: none; text-align: center;\">\n <h3 style=\"color: #2c3e50; margin-bottom: 20px;\">\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u044b \u0432\u0438\u043a\u0442\u043e\u0440\u0438\u043d\u044b<\/h3>\n <div id=\"resultScore\" style=\"font-size: 3rem; color: #4CAF50; font-weight: 700; margin: 20px 0;\">0\/5<\/div>\n <p id=\"resultMessage\" style=\"color: #666; margin-bottom: 30px;\"><\/p>\n <button class=\"quiz-btn\" id=\"restartQuiz\">\n <i class=\"fas fa-redo\"><\/i> \u041f\u0440\u043e\u0439\u0442\u0438 \u0435\u0449\u0435 \u0440\u0430\u0437\n <\/button>\n <\/div>\n <\/div>\n \n \n <div class=\"tools-section\">\n <h2 class=\"tools-title\">\n <i class=\"fas fa-tools\"><\/i> \u0421\u0432\u044f\u0437\u0430\u043d\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0438 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440\u044b\n <\/h2>\n <div class=\"tools-grid\">\n <div class=\"tool-card\" data-tool=\"length-converter\" data-link=\"https:\/\/gestro.ru\/?page_id=71\">\n <div class=\"tool-icon\"><i class=\"fas fa-ruler-combined\"><\/i><\/div>\n <div class=\"tool-name\">\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u0434\u043b\u0438\u043d\u044b<\/div>\n <div class=\"tool-desc\">\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0438\u0440\u0443\u0439\u0442\u0435 \u043c\u0435\u0442\u0440\u044b, \u0444\u0443\u0442\u044b, \u0434\u044e\u0439\u043c\u044b \u0438 \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b \u0434\u043b\u0438\u043d\u044b<\/div>\n <\/div>\n <div class=\"tool-card\" data-tool=\"volume-converter\" data-link=\"https:\/\/gestro.ru\/?page_id=251\">\n <div class=\"tool-icon\"><i class=\"fas fa-wine-bottle\"><\/i><\/div>\n <div class=\"tool-name\">\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u043e\u0431\u044a\u0435\u043c\u0430<\/div>\n <div class=\"tool-desc\">\u041f\u0435\u0440\u0435\u0432\u043e\u0434\u0438\u0442\u0435 \u043b\u0438\u0442\u0440\u044b, \u0433\u0430\u043b\u043b\u043e\u043d\u044b, \u043f\u0438\u043d\u0442\u044b \u0438 \u0434\u0440\u0443\u0433\u0438\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b \u043e\u0431\u044a\u0435\u043c\u0430<\/div>\n <\/div>\n <div class=\"tool-card\" data-tool=\"temperature-converter\" data-link=\"https:\/\/gestro.ru\/2\/\">\n <div class=\"tool-icon\"><i class=\"fas fa-thermometer-half\"><\/i><\/div>\n <div class=\"tool-name\">\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u0442\u0435\u043c\u043f\u0435\u0440\u0430\u0442\u0443\u0440\u044b<\/div>\n <div class=\"tool-desc\">\u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u044f \u043c\u0435\u0436\u0434\u0443 \u0426\u0435\u043b\u044c\u0441\u0438\u0435\u043c, \u0424\u0430\u0440\u0435\u043d\u0433\u0435\u0439\u0442\u043e\u043c \u0438 \u041a\u0435\u043b\u044c\u0432\u0438\u043d\u043e\u043c<\/div>\n <\/div>\n <div class=\"tool-card\" data-tool=\"cooking-converter\" data-link=\"https:\/\/gestro.ru\/?page_id=289\">\n <div class=\"tool-icon\"><i class=\"fas fa-utensils\"><\/i><\/div>\n <div class=\"tool-name\">\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440<\/div>\n <div class=\"tool-desc\">\u0421\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0430\u0446\u0438\u0438 \u0434\u043b\u044f \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0445 \u0440\u0435\u0446\u0435\u043f\u0442\u043e\u0432<\/div>\n <\/div>\n <div class=\"tool-card\" data-tool=\"scientific-calculator\" data-link=\"https:\/\/gestro.ru\/4\/\">\n <div class=\"tool-icon\"><i class=\"fas fa-calculator\"><\/i><\/div>\n <div class=\"tool-name\">\u041d\u0430\u0443\u0447\u043d\u044b\u0439 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440<\/div>\n <div class=\"tool-desc\">\u0422\u043e\u0447\u043d\u044b\u0435 \u0432\u044b\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u044f \u0441 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u043e\u0439 \u0435\u0434\u0438\u043d\u0438\u0446 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f<\/div>\n <\/div>\n <div class=\"tool-card\" data-tool=\"history-timeline\" data-link=\"https:\/\/gestro.ru\/5\/\">\n <div class=\"tool-icon\"><i class=\"fas fa-timeline\"><\/i><\/div>\n <div class=\"tool-name\">\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/div>\n <div class=\"tool-desc\">\u0418\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u0430\u044f \u0445\u0440\u043e\u043d\u043e\u043b\u043e\u0433\u0438\u044f \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u044f \u0441\u0438\u0441\u0442\u0435\u043c \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f<\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"resources-footer\">\n <p><strong>\u00a9 2026 \u042d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u044f \u043c\u0435\u0440 \u0438 \u0432\u0435\u0441\u043e\u0432<\/strong><\/p>\n <p>\u0412\u0441\u0435 \u0441\u0441\u044b\u043b\u043a\u0438 \u0432\u0435\u0434\u0443\u0442 \u043d\u0430 \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u0430\u0432\u0442\u043e\u0440\u0438\u0442\u0435\u0442\u043d\u044b\u0435 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u0438. \u041c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044b \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u044b \u0434\u043b\u044f \u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0446\u0435\u043b\u0435\u0439.<\/p>\n \n \n <div class=\"social-links\">\n <a href=\"#\" class=\"social-link\" title=\"Telegram \u043a\u0430\u043d\u0430\u043b\">\n <i class=\"fab fa-telegram\"><\/i>\n <\/a>\n <a href=\"#\" class=\"social-link\" title=\"YouTube \u043a\u0430\u043d\u0430\u043b\">\n <i class=\"fab fa-youtube\"><\/i>\n <\/a>\n <a href=\"#\" class=\"social-link\" title=\"\u041d\u0430\u0443\u0447\u043d\u044b\u0439 \u0431\u043b\u043e\u0433\">\n <i class=\"fab fa-medium\"><\/i>\n <\/a>\n <a href=\"#\" class=\"social-link\" title=\"\u0418\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f\">\n <i class=\"fab fa-researchgate\"><\/i>\n <\/a>\n <\/div>\n <\/div>\n <\/div>\n \n \n <div class=\"modal\" id=\"resourceModal\">\n <div class=\"modal-content\">\n <button class=\"modal-close\" id=\"modalClose\">×<\/button>\n <h3 class=\"modal-title\" id=\"modalTitle\">\u0418\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u043e \u0440\u0435\u0441\u0443\u0440\u0441\u0435<\/h3>\n <div id=\"modalContent\">\n \n <\/div>\n <\/div>\n <\/div>\n\n <script>\n\/\/ \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c IIFE \u0434\u043b\u044f \u0438\u0437\u043e\u043b\u044f\u0446\u0438\u0438 \u043a\u043e\u0434\u0430\n(function() {\n console.log('=== \u0417\u0410\u0413\u0420\u0423\u0417\u041a\u0410 \u0418\u041d\u0422\u0415\u0420\u0410\u041a\u0422\u0418\u0412\u041d\u041e\u0413\u041e \u0411\u041b\u041e\u041a\u0410 ===');\n \n \/\/ \u0414\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u044b\u0445 \u043e\u043a\u043e\u043d\n const resourceData = {\n nist: {\n title: \"\u041d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u0438\u043d\u0441\u0442\u0438\u0442\u0443\u0442 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432 \u0438 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0439 (NIST)\",\n content: `\n <h4>\u041e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u0430\u044f \u0440\u043e\u043b\u044c NIST<\/h4>\n <p>NIST \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0430\u0433\u0435\u043d\u0442\u0441\u0442\u0432\u043e\u043c \u041c\u0438\u043d\u0438\u0441\u0442\u0435\u0440\u0441\u0442\u0432\u0430 \u0442\u043e\u0440\u0433\u043e\u0432\u043b\u0438 \u0421\u0428\u0410, \u043e\u0442\u0432\u0435\u0447\u0430\u044e\u0449\u0438\u043c \u0437\u0430 \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0439, \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438 \u0438 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432. \u0418\u043d\u0441\u0442\u0438\u0442\u0443\u0442 \u0438\u0433\u0440\u0430\u0435\u0442 \u043a\u043b\u044e\u0447\u0435\u0432\u0443\u044e \u0440\u043e\u043b\u044c \u0432 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0438 \u0438 \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u0438 \u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u043e\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u044b \u0435\u0434\u0438\u043d\u0438\u0446 (\u0421\u0418).<\/p>\n \n <h4>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u044b \u0432 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438:<\/h4>\n <ul>\n <li><strong>\u041a\u0438\u0431\u0435\u0440-\u0432\u0435\u0441\u044b \u041a\u0438\u0431\u0431\u043b\u0430:<\/strong> \u0423\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e \u0434\u043b\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043d\u043e\u0432\u043e\u0433\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430 \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u0443\u044e \u041f\u043b\u0430\u043d\u043a\u0430<\/li>\n <li><strong>\u0410\u0442\u043e\u043c\u043d\u044b\u0435 \u0447\u0430\u0441\u044b:<\/strong> NIST-F2 - \u0441\u0430\u043c\u044b\u0435 \u0442\u043e\u0447\u043d\u044b\u0435 \u0430\u0442\u043e\u043c\u043d\u044b\u0435 \u0447\u0430\u0441\u044b \u0432 \u043c\u0438\u0440\u0435 \u0441 \u043f\u043e\u0433\u0440\u0435\u0448\u043d\u043e\u0441\u0442\u044c\u044e 1 \u0441\u0435\u043a\u0443\u043d\u0434\u0430 \u0437\u0430 300 \u043c\u0438\u043b\u043b\u0438\u043e\u043d\u043e\u0432 \u043b\u0435\u0442<\/li>\n <li><strong>\u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439:<\/strong> \u041f\u043e\u0434\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0435 \u043d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0445 \u044d\u0442\u0430\u043b\u043e\u043d\u043e\u0432 \u0435\u0434\u0438\u043d\u0438\u0446 \u0421\u0418<\/li>\n <\/ul>\n \n <h4>\u041f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0440\u0430\u0437\u0434\u0435\u043b\u044b \u0441\u0430\u0439\u0442\u0430:<\/h4>\n <ul>\n <li>\u25b8 SI Units - \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u0438 \u0438\u0441\u0442\u043e\u0440\u0438\u044f<\/li>\n <li>\u25b8 Calibration Services - \u0443\u0441\u043b\u0443\u0433\u0438 \u043a\u0430\u043b\u0438\u0431\u0440\u043e\u0432\u043a\u0438<\/li>\n <li>\u25b8 Measurement Standards - \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <li>\u25b8 Physics Laboratory - \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f<\/li>\n <\/ul>\n \n <div style=\"background: #f0f9ff; padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p><strong>\u0418\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u0444\u0430\u043a\u0442:<\/strong> NIST \u0443\u0447\u0430\u0441\u0442\u0432\u043e\u0432\u0430\u043b \u0432 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u043f\u0435\u0440\u0432\u044b\u0445 \u0430\u0442\u043e\u043c\u043d\u044b\u0445 \u0431\u043e\u043c\u0431 \u0432 \u0440\u0430\u043c\u043a\u0430\u0445 \u041c\u0430\u043d\u0445\u044d\u0442\u0442\u0435\u043d\u0441\u043a\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430, \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044f \u0442\u043e\u0447\u043d\u044b\u0435 \u0438\u0437\u043c\u0435\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b.<\/p>\n <\/div>\n `\n },\n royal: {\n title: \"The Royal Society (\u041a\u043e\u0440\u043e\u043b\u0435\u0432\u0441\u043a\u043e\u0435 \u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e)\",\n content: `\n <h4>\u0421\u0442\u0430\u0440\u0435\u0439\u0448\u0435\u0435 \u043d\u0430\u0443\u0447\u043d\u043e\u0435 \u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e \u0432 \u043c\u0438\u0440\u0435<\/h4>\n <p>\u041e\u0441\u043d\u043e\u0432\u0430\u043d\u043e \u0432 1660 \u0433\u043e\u0434\u0443, The Royal Society \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0432\u0435\u0434\u0443\u0449\u0435\u0439 \u043d\u0430\u0443\u0447\u043d\u043e\u0439 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0435\u0439 \u0412\u0435\u043b\u0438\u043a\u043e\u0431\u0440\u0438\u0442\u0430\u043d\u0438\u0438 \u0438 \u043e\u0434\u043d\u0438\u043c \u0438\u0437 \u0441\u0430\u043c\u044b\u0445 \u043f\u0440\u0435\u0441\u0442\u0438\u0436\u043d\u044b\u0445 \u043d\u0430\u0443\u0447\u043d\u044b\u0445 \u0441\u043e\u043e\u0431\u0449\u0435\u0441\u0442\u0432 \u0432 \u043c\u0438\u0440\u0435.<\/p>\n \n <h4>\u0412\u043a\u043b\u0430\u0434 \u0432 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u044e:<\/h4>\n <ul>\n <li><strong>Philosophical Transactions:<\/strong> \u041f\u0435\u0440\u0432\u044b\u0439 \u0432 \u043c\u0438\u0440\u0435 \u043d\u0430\u0443\u0447\u043d\u044b\u0439 \u0436\u0443\u0440\u043d\u0430\u043b, \u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u0432\u0448\u0438\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u043e \u043c\u0435\u0440\u0430\u0445 \u0438 \u0432\u0435\u0441\u0430\u0445<\/li>\n <li><strong>\u0418\u0441\u0430\u0430\u043a \u041d\u044c\u044e\u0442\u043e\u043d:<\/strong> \u0427\u043b\u0435\u043d \u043e\u0431\u0449\u0435\u0441\u0442\u0432\u0430, \u0447\u044c\u0438 \u0440\u0430\u0431\u043e\u0442\u044b \u0437\u0430\u043b\u043e\u0436\u0438\u043b\u0438 \u043e\u0441\u043d\u043e\u0432\u044b \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0444\u0438\u0437\u0438\u043a\u0438 \u0438 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438<\/li>\n <li><strong>Modern Metrology:<\/strong> \u0421\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f \u0432 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043a\u0432\u0430\u043d\u0442\u043e\u0432\u043e\u0439 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438<\/li>\n <\/ul>\n \n <h4>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438 \u043f\u043e \u0442\u0435\u043c\u0435:<\/h4>\n <ul>\n <li>\"On the Redefinition of the Kilogram\" (2019)<\/li>\n <li>\"Historical Perspectives on Measurement Standards\"<\/li>\n <li>\"Quantum Metrology and the Future of Measurement\"<\/li>\n <li>\"The SI Units: Past, Present and Future\"<\/li>\n <\/ul>\n \n <div style=\"background: #fff0f0; padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p><strong>\u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0444\u0430\u043a\u0442:<\/strong> \u0412 1664 \u0433\u043e\u0434\u0443 \u041a\u043e\u0440\u043e\u043b\u0435\u0432\u0441\u043a\u043e\u0435 \u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e \u043f\u0440\u043e\u0432\u0435\u043b\u043e \u043f\u0435\u0440\u0432\u044b\u0435 \u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u044b \u043f\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044e \u0443\u0434\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u0432\u0435\u0441\u0430 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0432\u0435\u0449\u0435\u0441\u0442\u0432, \u0437\u0430\u043b\u043e\u0436\u0438\u0432 \u043e\u0441\u043d\u043e\u0432\u044b \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438.<\/p>\n <\/div>\n `\n },\n mit: {\n title: \"MIT OpenCourseWare\",\n content: `\n <h4>\u0411\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u043e\u0435 \u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043c\u0438\u0440\u043e\u0432\u043e\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u044f<\/h4>\n <p>\u041f\u0440\u043e\u0435\u043a\u0442 \u041c\u0430\u0441\u0441\u0430\u0447\u0443\u0441\u0435\u0442\u0441\u043a\u043e\u0433\u043e \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0441\u0442\u0438\u0442\u0443\u0442\u0430, \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0439 \u0431\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u044b\u0439 \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u0430\u043c \u043a\u0443\u0440\u0441\u043e\u0432 \u0434\u043b\u044f \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u0438\u0437\u0443\u0447\u0435\u043d\u0438\u044f.<\/p>\n \n <h4>\u0420\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u043c\u044b\u0435 \u043a\u0443\u0440\u0441\u044b \u043f\u043e \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438:<\/h4>\n <ul>\n <li><strong>8.01 Physics I:<\/strong> \u041c\u0435\u0445\u0430\u043d\u0438\u043a\u0430 \u0441 \u043e\u0441\u043d\u043e\u0432\u0430\u043c\u0438 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <li><strong>STS.042 History of Science:<\/strong> \u0418\u0441\u0442\u043e\u0440\u0438\u044f \u043d\u0430\u0443\u0447\u043d\u044b\u0445 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <li><strong>6.050J Information Theory:<\/strong> \u0422\u0435\u043e\u0440\u0438\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u0438 \u0442\u043e\u0447\u043d\u044b\u0435 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f<\/li>\n <li><strong>8.13 Experimental Physics I:<\/strong> \u041f\u0440\u0430\u043a\u0442\u0438\u043a\u0443\u043c \u043f\u043e \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u043c \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f\u043c<\/li>\n <\/ul>\n \n <h4>\u041e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u043f\u043b\u0430\u0442\u0444\u043e\u0440\u043c\u044b:<\/h4>\n <ul>\n <li>\u25b8 \u041f\u043e\u043b\u043d\u044b\u0435 \u0432\u0438\u0434\u0435\u043e\u043b\u0435\u043a\u0446\u0438\u0438 \u0441 \u0441\u0443\u0431\u0442\u0438\u0442\u0440\u0430\u043c\u0438<\/li>\n <li>\u25b8 \u041a\u043e\u043d\u0441\u043f\u0435\u043a\u0442\u044b \u043b\u0435\u043a\u0446\u0438\u0439 \u0438 \u0443\u0447\u0435\u0431\u043d\u044b\u0435 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044b<\/li>\n <li>\u25b8 \u0417\u0430\u0434\u0430\u043d\u0438\u044f \u0438 \u044d\u043a\u0437\u0430\u043c\u0435\u043d\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0435 \u0432\u043e\u043f\u0440\u043e\u0441\u044b<\/li>\n <li>\u25b8 \u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0438 \u0441\u0441\u044b\u043b\u043a\u0438<\/li>\n <\/ul>\n \n <div style=\"background: #f0fff0; padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p><strong>\u0418\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e:<\/strong> MIT \u0442\u0430\u043a\u0436\u0435 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u043a\u0443\u0440\u0441 \"Measurement and Instrumentation\", \u0433\u0434\u0435 \u0441\u0442\u0443\u0434\u0435\u043d\u0442\u044b \u0441\u043e\u0437\u0434\u0430\u044e\u0442 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0435 \u0438\u0437\u043c\u0435\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u0438\u0431\u043e\u0440\u044b \u0438 \u0438\u0437\u0443\u0447\u0430\u044e\u0442 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u044b.<\/p>\n <\/div>\n `\n },\n iso: {\n title: \"International Organization for Standardization (ISO)\",\n content: `\n <h4>\u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0430<\/h4>\n <p>ISO \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442 \u0434\u043e\u0431\u0440\u043e\u0432\u043e\u043b\u044c\u043d\u044b\u0435 \u043c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u044e\u0442 \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u0438\u043c\u043e\u0441\u0442\u044c \u0438 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u043e \u043f\u0440\u043e\u0434\u0443\u043a\u0446\u0438\u0438 \u0438 \u0443\u0441\u043b\u0443\u0433 \u043f\u043e \u0432\u0441\u0435\u043c\u0443 \u043c\u0438\u0440\u0443.<\/p>\n \n <h4>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u043f\u043e \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438:<\/h4>\n <ul>\n <li><strong>ISO 80000:<\/strong> \u0412\u0435\u043b\u0438\u0447\u0438\u043d\u044b \u0438 \u0435\u0434\u0438\u043d\u0438\u0446\u044b (\u0447\u0430\u0441\u0442\u0438 1-14)<\/li>\n <li><strong>ISO\/IEC 17025:<\/strong> \u041e\u0431\u0449\u0438\u0435 \u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u0438\u044f \u043a \u043a\u043e\u043c\u043f\u0435\u0442\u0435\u043d\u0442\u043d\u043e\u0441\u0442\u0438 \u0438\u0441\u043f\u044b\u0442\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0438 \u043a\u0430\u043b\u0438\u0431\u0440\u043e\u0432\u043e\u0447\u043d\u044b\u0445 \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u0439<\/li>\n <li><strong>ISO 10012:<\/strong> \u0421\u0438\u0441\u0442\u0435\u043c\u044b \u043c\u0435\u043d\u0435\u0434\u0436\u043c\u0435\u043d\u0442\u0430 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <li><strong>ISO 5725:<\/strong> \u0422\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u043c\u0435\u0442\u043e\u0434\u043e\u0432 \u0438 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u043e\u0432 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <\/ul>\n \n <h4>\u0420\u043e\u043b\u044c \u0432 \u043c\u0438\u0440\u043e\u0432\u043e\u0439 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438:<\/h4>\n <ul>\n <li>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0435\u0434\u0438\u043d\u044b\u0445 \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432<\/li>\n <li>\u0421\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0441 BIPM (\u041c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u043e\u0435 \u0431\u044e\u0440\u043e \u043c\u0435\u0440 \u0438 \u0432\u0435\u0441\u043e\u0432)<\/li>\n <li>\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043f\u0440\u043e\u0446\u0435\u0434\u0443\u0440 \u043a\u0430\u043b\u0438\u0431\u0440\u043e\u0432\u043a\u0438 \u0438 \u0432\u0435\u0440\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438<\/li>\n <li>\u041e\u0431\u0435\u0441\u043f\u0435\u0447\u0435\u043d\u0438\u0435 \u043f\u0440\u043e\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0435\u043c\u043e\u0441\u0442\u0438 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439<\/li>\n <\/ul>\n \n <div style=\"background: #fff0f5; padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p><strong>\u0412\u0430\u0436\u043d\u043e:<\/strong> ISO \u043d\u0435 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u0440\u0430\u0432\u0438\u0442\u0435\u043b\u044c\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0439 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0435\u0439, \u043d\u043e \u0435\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u0447\u0430\u0441\u0442\u043e \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u044e\u0442\u0441\u044f \u043a\u0430\u043a \u043d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u0437\u0430\u043a\u043e\u043d\u043e\u0434\u0430\u0442\u0435\u043b\u044c\u0441\u0442\u0432\u0430\u043c\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0441\u0442\u0440\u0430\u043d.<\/p>\n <\/div>\n `\n },\n nature: {\n title: \"Nature Journal\",\n content: `\n <h4>\u0412\u0435\u0434\u0443\u0449\u0438\u0439 \u043d\u0430\u0443\u0447\u043d\u044b\u0439 \u0436\u0443\u0440\u043d\u0430\u043b<\/h4>\n <p>\u041e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0432 1869 \u0433\u043e\u0434\u0443, Nature \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e\u0434\u043d\u0438\u043c \u0438\u0437 \u0441\u0430\u043c\u044b\u0445 \u043f\u0440\u0435\u0441\u0442\u0438\u0436\u043d\u044b\u0445 \u043c\u0435\u0436\u0434\u0438\u0441\u0446\u0438\u043f\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0445 \u043d\u0430\u0443\u0447\u043d\u044b\u0445 \u0436\u0443\u0440\u043d\u0430\u043b\u043e\u0432 \u0432 \u043c\u0438\u0440\u0435.<\/p>\n \n <h4>\u0417\u043d\u0430\u0447\u0438\u043c\u044b\u0435 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438 \u043f\u043e \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0438:<\/h4>\n <ul>\n <li><strong>\"The kilogram is dead. Long live the kilogram!\"<\/strong> (2018) - \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0441\u0442\u0430\u0442\u044c\u044f \u043e \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430<\/li>\n <li><strong>\"Quantum metrology with ultracold atoms\"<\/strong> (2022) - \u043f\u0435\u0440\u0435\u0434\u043e\u0432\u044b\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f<\/li>\n <li><strong>\"A more fundamental International System of Units\"<\/strong> (2019) - \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0439 \u043e\u0431\u0437\u043e\u0440<\/li>\n <li><strong>\"The evolution of measurement\"<\/strong> (2017) - \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u043f\u0435\u0440\u0441\u043f\u0435\u043a\u0442\u0438\u0432\u0430<\/li>\n <\/ul>\n \n <h4>\u041e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u0430:<\/h4>\n <ul>\n <li>\u25b8 \u041e\u0442\u043a\u0440\u044b\u0442\u044b\u0439 \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u043c \u0441\u0442\u0430\u0442\u044c\u044f\u043c<\/li>\n <li>\u25b8 Nature Briefing - \u0431\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u044b\u0439 \u0434\u0430\u0439\u0434\u0436\u0435\u0441\u0442 \u043d\u043e\u0432\u043e\u0441\u0442\u0435\u0439<\/li>\n <li>\u25b8 Nature Podcast - \u0430\u0443\u0434\u0438\u043e\u0444\u043e\u0440\u043c\u0430\u0442 \u043d\u0430\u0443\u0447\u043d\u044b\u0445 \u043d\u043e\u0432\u043e\u0441\u0442\u0435\u0439<\/li>\n <li>\u25b8 Nature Careers - \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0434\u043b\u044f \u0443\u0447\u0435\u043d\u044b\u0445<\/li>\n <\/ul>\n \n <div style=\"background: #f0f8ff; padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p><strong>\u0420\u0435\u043a\u043e\u0440\u0434:<\/strong> \u0421\u0442\u0430\u0442\u044c\u044f 2018 \u0433\u043e\u0434\u0430 \u043e \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430 \u043f\u043e\u043b\u0443\u0447\u0438\u043b\u0430 \u0431\u043e\u043b\u0435\u0435 1000 \u0446\u0438\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0439 \u0437\u0430 \u043f\u0435\u0440\u0432\u044b\u0435 \u0434\u0432\u0430 \u0433\u043e\u0434\u0430 \u043f\u043e\u0441\u043b\u0435 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438.<\/p>\n <\/div>\n `\n },\n npl: {\n title: \"National Physical Laboratory (NPL)\",\n content: `\n <h4>\u041d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u0430\u044f \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u044f \u0412\u0435\u043b\u0438\u043a\u043e\u0431\u0440\u0438\u0442\u0430\u043d\u0438\u0438<\/h4>\n <p>\u041e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u0432 1900 \u0433\u043e\u0434\u0443, NPL \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0432\u0435\u0434\u0443\u0449\u0438\u043c \u0446\u0435\u043d\u0442\u0440\u043e\u043c \u043c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u0439 \u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043e\u043a \u0432 \u0412\u0435\u043b\u0438\u043a\u043e\u0431\u0440\u0438\u0442\u0430\u043d\u0438\u0438.<\/p>\n \n <h4>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0434\u043e\u0441\u0442\u0438\u0436\u0435\u043d\u0438\u044f:<\/h4>\n <ul>\n <li><strong>\u0410\u0442\u043e\u043c\u043d\u044b\u0435 \u0447\u0430\u0441\u044b:<\/strong> NPL \u0441\u044b\u0433\u0440\u0430\u043b\u0430 \u043a\u043b\u044e\u0447\u0435\u0432\u0443\u044e \u0440\u043e\u043b\u044c \u0432 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435 \u0446\u0435\u0437\u0438\u0435\u0432\u044b\u0445 \u0430\u0442\u043e\u043c\u043d\u044b\u0445 \u0447\u0430\u0441\u043e\u0432<\/li>\n <li><strong>\u041a\u0438\u0431\u0435\u0440-\u0432\u0435\u0441\u044b \u041a\u0438\u0431\u0431\u043b\u0430:<\/strong> \u0410\u043a\u0442\u0438\u0432\u043d\u043e\u0435 \u0443\u0447\u0430\u0441\u0442\u0438\u0435 \u0432 \u043c\u0435\u0436\u0434\u0443\u043d\u0430\u0440\u043e\u0434\u043d\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435<\/li>\n <li><strong>\u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0439:<\/strong> \u041f\u043e\u0434\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0435 \u043d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0445 \u044d\u0442\u0430\u043b\u043e\u043d\u043e\u0432<\/li>\n <li><strong>\u041e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b:<\/strong> \u041c\u0435\u0442\u0440\u043e\u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043a\u0443\u0440\u0441\u044b \u0438 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044b<\/li>\n <\/ul>\n \n <h4>\u041f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0440\u0430\u0437\u0434\u0435\u043b\u044b:<\/h4>\n <ul>\n <li>\u25b8 Measurement Guides - \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0440\u0443\u043a\u043e\u0432\u043e\u0434\u0441\u0442\u0432\u0430<\/li>\n <li>\u25b8 SI Units - \u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044b<\/li>\n <li>\u25b8 Research - \u0442\u0435\u043a\u0443\u0449\u0438\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u044b<\/li>\n <li>\u25b8 Training - \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0435 \u043e\u0431\u0443\u0447\u0435\u043d\u0438\u0435<\/li>\n <\/ul>\n \n <div style=\"background: #f5f0ff; padding: 15px; border-radius: 10px; margin-top: 20px;\">\n <p><strong>\u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0444\u0430\u043a\u0442:<\/strong> \u0412\u043e \u0432\u0440\u0435\u043c\u044f \u0412\u0442\u043e\u0440\u043e\u0439 \u043c\u0438\u0440\u043e\u0432\u043e\u0439 \u0432\u043e\u0439\u043d\u044b NPL \u0440\u0430\u0431\u043e\u0442\u0430\u043b\u0430 \u043d\u0430\u0434 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u043e\u0439 \u0440\u0430\u0434\u0430\u0440\u0430 \u0438 \u0434\u0440\u0443\u0433\u0438\u0445 \u043a\u0440\u0438\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u0430\u0436\u043d\u044b\u0445 \u0438\u0437\u043c\u0435\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0439.<\/p>\n <\/div>\n `\n }\n };\n \n \/\/ \u0414\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u0432\u0438\u043a\u0442\u043e\u0440\u0438\u043d\u044b\n const quizData = [\n {\n question: \"\u0421\u043a\u043e\u043b\u044c\u043a\u043e \u0433\u0440\u0430\u043c\u043c\u043e\u0432 \u0432 \u043e\u0434\u043d\u043e\u043c \u043a\u0430\u0440\u0430\u0442\u0435?\",\n options: [\"0.2 \u0433\", \"1 \u0433\", \"0.5 \u0433\", \"0.1 \u0433\"],\n correct: 0\n },\n {\n question: \"\u041a\u0430\u043a\u043e\u0439 \u0433\u043e\u0434 \u0441\u0442\u0430\u043b \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u043c \u0434\u043b\u044f \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430?\",\n options: [\"2000\", \"2019\", \"2022\", \"2015\"],\n correct: 1\n },\n {\n question: \"\u0421\u043a\u043e\u043b\u044c\u043a\u043e \u0443\u043d\u0446\u0438\u0439 \u0432 \u043e\u0434\u043d\u043e\u043c \u0444\u0443\u043d\u0442\u0435?\",\n options: [\"12\", \"14\", \"16\", \"20\"],\n correct: 2\n },\n {\n question: \"\u041a\u0430\u043a\u043e\u0439 \u043f\u0440\u0438\u0431\u043e\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0441\u044f \u0434\u043b\u044f \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u0430 \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u0443\u044e \u041f\u043b\u0430\u043d\u043a\u0430?\",\n options: [\"\u0410\u0442\u043e\u043c\u043d\u044b\u0435 \u0447\u0430\u0441\u044b\", \"\u041a\u0438\u0431\u0435\u0440-\u0432\u0435\u0441\u044b \u041a\u0438\u0431\u0431\u043b\u0430\", \"\u041c\u0430\u0441\u0441-\u0441\u043f\u0435\u043a\u0442\u0440\u043e\u043c\u0435\u0442\u0440\", \"\u042d\u043b\u0435\u043a\u0442\u0440\u043e\u043d\u043d\u044b\u0435 \u0432\u0435\u0441\u044b\"],\n correct: 1\n },\n {\n question: \"\u041f\u0440\u0438\u0431\u043b\u0438\u0437\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u043e\u0432 \u0432 \u043e\u0434\u043d\u043e\u043c \u043f\u0443\u0434\u0435?\",\n options: [\"10 \u043a\u0433\", \"16.38 \u043a\u0433\", \"25 \u043a\u0433\", \"32 \u043a\u0433\"],\n correct: 1\n }\n ];\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043f\u0440\u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0435\n document.addEventListener('DOMContentLoaded', function() {\n console.log('\u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u0431\u043b\u043e\u043a\u0430...');\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0442\u0430\u0431\u043e\u0432\n initTabs();\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f FAQ\n initFAQ();\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0432\u0438\u043a\u0442\u043e\u0440\u0438\u043d\u044b\n initQuiz();\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u044b\u0445 \u043e\u043a\u043e\u043d\n initModals();\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0442\u0430\u0439\u043c\u043b\u0430\u0439\u043d\u0430\n initTimeline();\n \n \/\/ \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432\n initTools();\n \n console.log('\u0418\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0439 \u0431\u043b\u043e\u043a \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d');\n });\n \n \/\/ \u0422\u0430\u0431\u044b\n function initTabs() {\n const tabBtns = document.querySelectorAll('.tab-btn');\n const tabContents = document.querySelectorAll('.tab-content');\n \n tabBtns.forEach(btn => {\n btn.addEventListener('click', function() {\n const tabId = this.getAttribute('data-tab');\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0435 \u0442\u0430\u0431\u044b\n tabBtns.forEach(b => b.classList.remove('active'));\n this.classList.add('active');\n \n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0439 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\n tabContents.forEach(content => {\n content.classList.remove('active');\n if (content.id === tabId || tabId === 'all') {\n content.classList.add('active');\n \n \/\/ \u0424\u0438\u043b\u044c\u0442\u0440\u0443\u0435\u043c \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0435\u0441\u043b\u0438 \u044d\u0442\u043e \u043d\u0435 \"\u0432\u0441\u0435\"\n if (tabId !== 'all') {\n filterResources(tabId);\n } else {\n showAllResources();\n }\n }\n });\n });\n });\n \n \/\/ \u0424\u0438\u043b\u044c\u0442\u0440\u0430\u0446\u0438\u044f \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432\n function filterResources(category) {\n const cards = document.querySelectorAll('.resource-card');\n cards.forEach(card => {\n if (card.getAttribute('data-category') === category) {\n card.style.display = 'flex';\n } else {\n card.style.display = 'none';\n }\n });\n }\n \n function showAllResources() {\n const cards = document.querySelectorAll('.resource-card');\n cards.forEach(card => {\n card.style.display = 'flex';\n });\n }\n }\n \n \/\/ FAQ\n function initFAQ() {\n const faqQuestions = document.querySelectorAll('.faq-question');\n \n faqQuestions.forEach(question => {\n question.addEventListener('click', function() {\n const answer = this.nextElementSibling;\n const isActive = this.classList.contains('active');\n \n \/\/ \u0417\u0430\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0432\u0441\u0435 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435\n document.querySelectorAll('.faq-question').forEach(q => {\n q.classList.remove('active');\n q.nextElementSibling.classList.remove('active');\n });\n \n \/\/ \u041e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0442\u0435\u043a\u0443\u0449\u0438\u0439 \u0435\u0441\u043b\u0438 \u0431\u044b\u043b \u0437\u0430\u043a\u0440\u044b\u0442\n if (!isActive) {\n this.classList.add('active');\n answer.classList.add('active');\n }\n });\n });\n }\n \n \/\/ \u0412\u0438\u043a\u0442\u043e\u0440\u0438\u043d\u0430\n let currentQuestion = 0;\n let score = 0;\n let selectedAnswer = null;\n \n function initQuiz() {\n const prevBtn = document.getElementById('prevBtn');\n const nextBtn = document.getElementById('nextBtn');\n const restartBtn = document.getElementById('restartQuiz');\n \n \/\/ \u0417\u0430\u0433\u0440\u0443\u0437\u043a\u0430 \u043f\u0435\u0440\u0432\u043e\u0433\u043e \u0432\u043e\u043f\u0440\u043e\u0441\u0430\n loadQuestion(currentQuestion);\n \n \/\/ \u041d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f\n prevBtn.addEventListener('click', () => {\n if (currentQuestion > 0) {\n currentQuestion--;\n loadQuestion(currentQuestion);\n }\n });\n \n nextBtn.addEventListener('click', () => {\n if (currentQuestion < quizData.length - 1) {\n currentQuestion++;\n loadQuestion(currentQuestion);\n } else {\n showResults();\n }\n });\n \n \/\/ \u041f\u0435\u0440\u0435\u0437\u0430\u043f\u0443\u0441\u043a\n if (restartBtn) {\n restartBtn.addEventListener('click', restartQuiz);\n }\n }\n \n function loadQuestion(index) {\n const question = quizData[index];\n const questionText = document.getElementById('questionText');\n const optionsContainer = document.getElementById('optionsContainer');\n const prevBtn = document.getElementById('prevBtn');\n const nextBtn = document.getElementById('nextBtn');\n const scoreDisplay = document.getElementById('scoreDisplay');\n const progressBar = document.getElementById('quizProgress');\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0442\u0435\u043a\u0441\u0442 \u0432\u043e\u043f\u0440\u043e\u0441\u0430\n questionText.textContent = question.question;\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u043e\u043f\u0446\u0438\u0438\n optionsContainer.innerHTML = '';\n question.options.forEach((option, i) => {\n const optionElement = document.createElement('div');\n optionElement.className = 'quiz-option';\n optionElement.textContent = option;\n optionElement.dataset.index = i;\n \n optionElement.addEventListener('click', function() {\n \/\/ \u0421\u043d\u0438\u043c\u0430\u0435\u043c \u0432\u044b\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0441 \u0434\u0440\u0443\u0433\u0438\u0445 \u043e\u043f\u0446\u0438\u0439\n document.querySelectorAll('.quiz-option').forEach(opt => {\n opt.classList.remove('selected');\n });\n \n \/\/ \u0412\u044b\u0434\u0435\u043b\u044f\u0435\u043c \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u0443\u044e \u043e\u043f\u0446\u0438\u044e\n this.classList.add('selected');\n selectedAnswer = i;\n \n \/\/ \u041f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u043e\u0442\u0432\u0435\u0442\n const isCorrect = i === question.correct;\n if (isCorrect) {\n this.classList.add('correct');\n } else {\n this.classList.add('incorrect');\n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0439 \u043e\u0442\u0432\u0435\u0442\n document.querySelectorAll('.quiz-option')[question.correct].classList.add('correct');\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0441\u0447\u0435\u0442 \u0435\u0441\u043b\u0438 \u043e\u0442\u0432\u0435\u0442 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0439\n if (isCorrect && !question.answered) {\n score++;\n question.answered = true;\n }\n });\n \n optionsContainer.appendChild(optionElement);\n });\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044e\n prevBtn.disabled = index === 0;\n if (index === quizData.length - 1) {\n nextBtn.innerHTML = '\u0417\u0430\u0432\u0435\u0440\u0448\u0438\u0442\u044c <i class=\"fas fa-flag-checkered\"><\/i>';\n } else {\n nextBtn.innerHTML = '\u0414\u0430\u043b\u0435\u0435 <i class=\"fas fa-arrow-right\"><\/i>';\n }\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u043f\u0440\u043e\u0433\u0440\u0435\u0441\u0441\n scoreDisplay.textContent = `\u0412\u043e\u043f\u0440\u043e\u0441 ${index + 1} \u0438\u0437 ${quizData.length}`;\n progressBar.style.width = `${((index + 1) \/ quizData.length) * 100}%`;\n }\n \n function showResults() {\n const quizContent = document.getElementById('quizContent');\n const quizResults = document.getElementById('quizResults');\n const resultScore = document.getElementById('resultScore');\n const resultMessage = document.getElementById('resultMessage');\n \n \/\/ \u0421\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0432\u043e\u043f\u0440\u043e\u0441\u044b, \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u044b\n quizContent.style.display = 'none';\n quizResults.style.display = 'block';\n \n \/\/ \u041e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c \u0441\u0447\u0435\u0442\n resultScore.textContent = `${score}\/${quizData.length}`;\n \n \/\/ \u0413\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u0435\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435\n const percentage = (score \/ quizData.length) * 100;\n let message = '';\n \n if (percentage >= 90) {\n message = '\u041e\u0442\u043b\u0438\u0447\u043d\u044b\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442! \u0412\u044b \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0438\u0439 \u044d\u043a\u0441\u043f\u0435\u0440\u0442 \u0432 \u043c\u0435\u0440\u0430\u0445 \u0432\u0435\u0441\u0430!';\n } else if (percentage >= 70) {\n message = '\u0425\u043e\u0440\u043e\u0448\u0438\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442! \u0412\u044b \u0445\u043e\u0440\u043e\u0448\u043e \u0440\u0430\u0437\u0431\u0438\u0440\u0430\u0435\u0442\u0435\u0441\u044c \u0432 \u0442\u0435\u043c\u0435.';\n } else if (percentage >= 50) {\n message = '\u041d\u0435\u043f\u043b\u043e\u0445\u043e\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442! \u0415\u0441\u0442\u044c \u043a\u0443\u0434\u0430 \u0440\u0430\u0441\u0442\u0438.';\n } else {\n message = '\u041f\u043e\u043f\u0440\u043e\u0431\u0443\u0439\u0442\u0435 \u043f\u0440\u043e\u0439\u0442\u0438 \u0432\u0438\u043a\u0442\u043e\u0440\u0438\u043d\u0443 \u0435\u0449\u0435 \u0440\u0430\u0437!';\n }\n \n resultMessage.textContent = message;\n }\n \n function restartQuiz() {\n currentQuestion = 0;\n score = 0;\n selectedAnswer = null;\n \n \/\/ \u0421\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u0435\u043c \u0441\u0442\u0430\u0442\u0443\u0441 \u0432\u043e\u043f\u0440\u043e\u0441\u043e\u0432\n quizData.forEach(q => q.answered = false);\n \n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0432\u043e\u043f\u0440\u043e\u0441\u044b, \u0441\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u044b\n document.getElementById('quizContent').style.display = 'block';\n document.getElementById('quizResults').style.display = 'none';\n \n \/\/ \u0417\u0430\u0433\u0440\u0443\u0436\u0430\u0435\u043c \u043f\u0435\u0440\u0432\u044b\u0439 \u0432\u043e\u043f\u0440\u043e\u0441\n loadQuestion(currentQuestion);\n }\n \n \/\/ \u041c\u043e\u0434\u0430\u043b\u044c\u043d\u044b\u0435 \u043e\u043a\u043d\u0430\n function initModals() {\n const modal = document.getElementById('resourceModal');\n const modalClose = document.getElementById('modalClose');\n const detailsBtns = document.querySelectorAll('.btn-details');\n \n \/\/ \u041e\u0442\u043a\u0440\u044b\u0442\u0438\u0435 \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043e\u043a\u043d\u0430\n detailsBtns.forEach(btn => {\n btn.addEventListener('click', function() {\n const resourceId = this.getAttribute('data-resource');\n openModal(resourceId);\n });\n });\n \n \/\/ \u0417\u0430\u043a\u0440\u044b\u0442\u0438\u0435 \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043e\u043a\u043d\u0430\n modalClose.addEventListener('click', () => {\n modal.style.display = 'none';\n });\n \n \/\/ \u0417\u0430\u043a\u0440\u044b\u0442\u0438\u0435 \u043f\u0440\u0438 \u043a\u043b\u0438\u043a\u0435 \u0432\u043d\u0435 \u043e\u043a\u043d\u0430\n window.addEventListener('click', (e) => {\n if (e.target === modal) {\n modal.style.display = 'none';\n }\n });\n }\n \n function openModal(resourceId) {\n const modal = document.getElementById('resourceModal');\n const modalTitle = document.getElementById('modalTitle');\n const modalContent = document.getElementById('modalContent');\n \n if (resourceData[resourceId]) {\n modalTitle.textContent = resourceData[resourceId].title;\n modalContent.innerHTML = resourceData[resourceId].content;\n modal.style.display = 'flex';\n }\n }\n \n \/\/ \u0422\u0430\u0439\u043c\u043b\u0430\u0439\u043d\n function initTimeline() {\n const timelineItems = document.querySelectorAll('.timeline-item');\n \n timelineItems.forEach(item => {\n item.addEventListener('click', function() {\n const year = this.getAttribute('data-year');\n alert(`\u0412\u044b\u0431\u0440\u0430\u043d\u0430 \u0434\u0430\u0442\u0430: ${year}\\n\\n${this.querySelector('.timeline-description').textContent}`);\n });\n });\n }\n \n \/\/ \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b\n function initTools() {\n const toolCards = document.querySelectorAll('.tool-card');\n \n toolCards.forEach(card => {\n card.addEventListener('click', function() {\n const link = this.getAttribute('data-link');\n \n if (link) {\n \/\/ \u041e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0441\u0441\u044b\u043b\u043a\u0443 \u0432 \u043d\u043e\u0432\u043e\u0439 \u0432\u043a\u043b\u0430\u0434\u043a\u0435\n window.open(link, '_blank');\n } else {\n \/\/ \u0415\u0441\u043b\u0438 \u043d\u0435\u0442 \u0441\u0441\u044b\u043b\u043a\u0438, \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435\n const toolName = this.querySelector('.tool-name').textContent;\n alert(`\u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \"${toolName}\" \u0441\u043a\u043e\u0440\u043e \u0431\u0443\u0434\u0435\u0442 \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d!\\n\\n\u041c\u044b \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u043c \u043d\u0430\u0434 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435\u043c \u043d\u043e\u0432\u044b\u0445 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0434\u043b\u044f \u0432\u0430\u0448\u0435\u0433\u043e \u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430.`);\n }\n });\n });\n }\n \n})();\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\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430 \u0423\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u0430\u043b\u044c\u043a\u0443\u043b\u044f\u0442\u043e\u0440 \u043c\u0435\u0440 \u0432\u0435\u0441\u0430 \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0438\u0440\u0443\u0439\u0442\u0435 \u043c\u0435\u0436\u0434\u0443 \u043c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u043c\u0438, \u0438\u043c\u043f\u0435\u0440\u0441\u043a\u0438\u043c\u0438 \u0438 \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u043c\u0438 \u0435\u0434\u0438\u043d\u0438\u0446\u0430\u043c\u0438 \u043c\u0430\u0441\u0441\u044b \u0441 \u043d\u0430\u0443\u0447\u043d\u043e\u0439 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c\u044e \u041a\u043e\u043d\u0432\u0435\u0440\u0442\u0435\u0440 \u0432\u0435\u0441\u0430 \u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435: # \u0418\u0417 \u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (kg)\u0413\u0440\u0430\u043c\u043c\u044b (g)\u041c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c\u044b (mg)\u0422\u043e\u043d\u043d\u044b (t)\u0424\u0443\u043d\u0442\u044b (lb)\u0423\u043d\u0446\u0438\u0438 (oz)\u041a\u0430\u0440\u0430\u0442\u044b (ct)\u0421\u0442\u043e\u0443\u043d\u044b (st) \u0412 \u0413\u0440\u0430\u043c\u043c\u044b (g)\u041a\u0438\u043b\u043e\u0433\u0440\u0430\u043c\u043c\u044b (kg)\u041c\u0438\u043b\u043b\u0438\u0433\u0440\u0430\u043c\u043c\u044b (mg)\u0424\u0443\u043d\u0442\u044b (lb)\u0423\u043d\u0446\u0438\u0438 (oz)\u041c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0442\u043e\u043d\u043d\u044b (t)\u041a\u0430\u0440\u0430\u0442\u044b (ct)\u0421\u0442\u043e\u0443\u043d\u044b (st) 1000 \u0433\u0440\u0430\u043c\u043c\u043e\u0432 1000 \u0413\u0440\u0430\u043c\u043c\u044b 2.2046 \u0424\u0443\u043d\u0442\u044b 35.274 \u0423\u043d\u0446\u0438\u0438 5000 \u041a\u0430\u0440\u0430\u0442\u044b…<\/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-223","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages\/223","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/gestro.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=223"}],"version-history":[{"count":23,"href":"https:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages\/223\/revisions"}],"predecessor-version":[{"id":318,"href":"https:\/\/gestro.ru\/index.php?rest_route=\/wp\/v2\/pages\/223\/revisions\/318"}],"wp:attachment":[{"href":"https:\/\/gestro.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=223"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}