*{margin: 0;padding: 0;box-sizing: border-box;font-family: 'Segoe UI',Tahoma,Geneva,Verdana,sans-serif}:root{--primary-color: #3b82f6;--desc-color: #4b5563}body{background: linear-gradient(135deg,#f8fafc 0%,#e2e8f0 100%);color: var(--desc-color);min-height: 100vh;padding: 1.5rem;font-size: 16px;line-height: 1.8rem}.container{max-width: 1440px;margin: 0 auto}.tool-container{max-width: 1000px;margin: 0 auto;padding: 20px}.tool-container.wide{max-width: 1100px}.tool-container.narrow{max-width: 900px}header{text-align: center;margin-bottom: 2rem;padding: 1.6rem;background: rgba(255,255,255,0.95);border-radius: .5rem;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.1);border: .15rem solid #e2e8f0}.line1{overflow: hidden;white-space: nowrap;text-overflow: ellipsis}.lines2{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;text-overflow: ellipsis;white-space: normal}.lines3{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;text-overflow: ellipsis;white-space: normal}a{text-decoration: none !important}h1{color: var(--primary-color);font-size: 1.8rem;margin-bottom: 1.5rem}.subtitle{color: var(--desc-color);margin: 0 auto;line-height: 1.6;text-align: left}.main-content{display: flex;flex-wrap: wrap;gap: 2rem;margin-bottom: 2rem}.code-section{flex: 1;min-width: 20rem;background: rgba(255,255,255,0.95);border-radius: .5rem;overflow: hidden;box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.1);display: flex;flex-direction: column;border: .15rem solid #e2e8f0}.section-header{background: rgba(248,250,252,0.95);padding: 1rem 1.2rem;display: flex;justify-content: space-between;align-items: center;border-bottom: .15rem solid #e2e8f0}.section-title{font-size: 1.3rem;font-weight: 600;color: #3b82f6;display: flex;align-items: center;gap: .8rem}.code-container{flex: 1;overflow: hidden;max-height: 25rem;min-height: 25rem}.CodeMirror{height: 100% !important;font-size: 1rem;padding: 1rem 0;max-height: 100%}.CodeMirror-scroll{max-height: 100% !important}.controls{display: flex;flex-wrap: wrap;justify-content: center;gap: 1rem;margin: 2rem 0}.btn{padding: 1rem 2rem;font-size: 1rem;font-weight: 600;border: none;border-radius: .5rem;cursor: pointer;transition: all 0.3s ease;display: flex;align-items: center;gap: .8rem;box-shadow: 0 .2rem 1rem rgba(0,0,0,0.2)}.btn-format{background: linear-gradient(135deg,#3b82f6 0%,#1d4ed8 100%);color: white}.btn-optimize{background: linear-gradient(135deg,#10b981 0%,#047857 100%);color: white}.btn-purify{background: linear-gradient(135deg,#f59e0b 0%,#d97706 100%);color: white}.btn-minify{background: linear-gradient(135deg,#8b5cf6 0%,#7c3aed 100%);color: white}.btn-clear{background: linear-gradient(135deg,#6b7280 0%,#4b5563 100%);color: white}.btn-download{background: linear-gradient(135deg,#51c4d3 0%,#00919f 100%);color: white}.btn-copy{background: linear-gradient(135deg,#14b8a6 0%,#0d9488 100%);color: white}.btn:hover{transform: translateY(-3px);box-shadow: 0 .5rem 1.5rem rgba(0,0,0,0.3)}.btn:active{transform: translateY(0)}.btn:disabled{opacity: 0.6;cursor: not-allowed;transform: none !important}.stats{display: flex;justify-content: space-between;flex-wrap: wrap;gap: 1.5rem;margin: 1.5rem 0;padding: 1.5rem;background: rgba(255,255,255,0.95);border-radius: 1rem;border: .15rem solid #e2e8f0;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.05)}.stat-card{flex: 1;min-width: 150px;padding: 1.25rem;background: #f1f5f9 !important;border-radius: 12px;text-align: center;border-left: 4px solid #3b82f6;box-shadow: 0 2px 8px rgba(0,0,0,0.06)}.stat-card h3{font-size: 0.9rem;color: #374151;margin-bottom: 0.5rem;font-weight: 500}.stat-card .value{font-size: 1.75rem;font-weight: 700;color: #3b82f6}.stat-card.highlight{border-left-color: #8b5cf6}.stat-card.highlight .value{color: #8b5cf6}.stat-card .stat-value{font-size: 1.75rem;font-weight: 700;color: #3b82f6}.stat-card .stat-label{font-size: 0.9rem;color: #374151;font-weight: 500}.stat-card.highlight .stat-value{color: #8b5cf6}.info-box{background: #ffffff;border-radius: 16px;padding: 2rem;margin-top: 2rem;color: #374151;border: 1px solid #e5e7eb;box-shadow: 0 2px 8px rgba(0,0,0,0.04)}.info-box h2{color: #1f2937;font-size: 1.5rem;font-weight: 600;margin-bottom: 1.25rem;padding-bottom: 0.75rem;border-bottom: 2px solid #e5e7eb}.info-box h3{color: #3b82f6;font-size: 1.1rem;font-weight: 600;margin-top: 1.5rem;margin-bottom: 0.75rem}.info-box .intro-text{color: #6b7280;font-size: 1rem;line-height: 1.7;margin-bottom: 1rem}.info-box ul{margin-bottom: 0;padding-left: 1.25rem}.info-box li{margin-bottom: 0.5rem;color: #4b5563;line-height: 1.6}.info-box p{color: #4b5563;line-height: 1.7;margin-bottom: 0.75rem}.info-box .feature-list{margin-top: 1rem}.info-box .feature-list li{padding: 0.5rem 0}footer{text-align: center;padding: 1.5rem;color: #64748b;font-size: 0.9rem}footer p{margin: 1rem auto}footer a{color: #64748b;text-decoration: none}footer a:hover{color: #3b82f6}@media (max-width: 768px){.main-content{flex-direction: column}h1{font-size: 2.2rem}.btn{padding: .8rem 1.5rem;font-size: 0.95rem}.controls{gap: .8rem}}h2,h3,h4,h5,h6{margin-top: 1rem}.top-nav{max-width: 1440px;padding: 0 1rem 2rem 1rem;color: #1f2937 !important}.top-nav a{color: var(--primary-color);text-decoration: none}.top-nav a:hover{color: #1d4ed8}.top-nav div{display: flex;flex-direction: row;height: 2rem;line-height: 2rem;font-weight: bold;font-size: 1rem}.top-nav img{display: block;height: 2rem;width: 2rem;padding: .25rem;margin: 0 .6rem 0 0;background-color: #ffffff;border-radius: 2rem}.copy-toast{display: none;margin: 20px auto;padding: 12px 24px;background-color: #10b981;color: white;border-radius: 4px;text-align: center;max-width: 400px;box-shadow: 0 4px 12px rgba(0,0,0,0.15);animation: fadeIn 0.3s ease-in-out}.copy-toast.error{background-color: #c00000}@keyframes fadeIn{from{opacity: 0;transform: translateY(-10px)}to{opacity: 1;transform: translateY(0)}}.ta-center{width: 100%;text-align: center}img.logo{width: 8rem;height: 8rem}.tool-item{display: block;margin-bottom: 1.5rem}.tool-item a{display: block;background-color: #ffffff;padding: 1rem;border-radius: .25rem;display: block;text-decoration: none !important;color: #1f2937 !important;border: .15rem solid #e2e8f0;box-shadow: 0 0.25rem 0.75rem rgba(0,0,0,0.05);transition: all 0.2s ease}.tool-item a:hover{border-color: #3b82f6;box-shadow: 0 0.25rem 1rem rgba(59,130,246,0.15)}.ti-title{display: flex;flex-direction: row}.ti-title>h3{color: var(--primary-color) !important;text-align: left;display: inline-block;height: 3rem;line-height: 3rem;padding: 0;overflow: hidden;white-space: nowrap;text-overflow: ellipsis}.ti-desc{color: #6b7280}@media (min-width:768px){.home-desc{margin: 0 25%}}@media (max-width:767px){.home-desc{width: 100%}}.home-desc{color: #6b7280}.math-worksheet-tool{max-width: 900px;margin: 0 auto;padding: 20px}.settings-panel{background: #f8f9fa;border: 1px solid #e0e0e0;border-radius: 12px;padding: 25px;margin-bottom: 25px;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.05)}.settings-row{display: flex;gap: 20px;flex-wrap: wrap;align-items: flex-end}.setting-group{flex: 1;min-width: 200px}.setting-group label{display: block;font-weight: 600;margin-bottom: 8px;color: #666;font-size: 14px}.setting-group select,.setting-group input{width: 100%;padding: 12px 15px;border: 2px solid #e0e0e0;border-radius: 8px;font-size: 16px;background: #fff}.setting-group select:focus,.setting-group input:focus{outline: none;border-color: #4CAF50;box-shadow: 0 0 0 3px rgba(76,175,80,0.2)}.checkbox-group{display: flex;align-items: center;gap: 10px;margin-top: 20px}.checkbox-group input[type="checkbox"]{width: 20px;height: 20px;cursor: pointer}.checkbox-group label{font-size: 14px;color: #666;cursor: pointer}.results-container{display: none}.results-header{display: flex;justify-content: space-between;align-items: center;margin-bottom: 20px}.results-header h2{margin: 0;font-size: 20px;color: #999}.results-columns{display: grid;grid-template-columns: 1fr 1fr;gap: 30px}@media(max-width:768px){.results-columns{grid-template-columns: 1fr}}.results-box{background: #fff;border: 2px solid #e0e0e0;border-radius: 12px;padding: 20px;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.05)}.results-box h3{margin: 0 0 15px 0;font-size: 16px;color: #4CAF50;display: flex;align-items: center;gap: 8px}.results-box h3 .icon{font-size: 20px}.results-box-header{display: flex;justify-content: space-between;align-items: center;margin-bottom: 15px}.btn-print-small{padding: 6px 12px;border: none;border-radius: 6px;font-size: 12px;font-weight: 600;cursor: pointer;background: #2196F3;color: white;transition: all 0.2s}.btn-print-small:hover{background: #1976D2}.problems-list,.answers-list{list-style: none;padding: 0;margin: 0}.problems-list li,.answers-list li{padding: 12px 15px;border-bottom: 1px solid #eee;font-family: 'Courier New',monospace;font-size: 16px}.problems-list li:last-child,.answers-list li:last-child{border-bottom: none}.problems-list li{display: flex;align-items: center;gap: 10px}.problem-number{font-weight: 600;color: #4CAF50;min-width: 30px}.problem-text{flex: 1;color: #666}.answers-list li{display: flex;align-items: center;gap: 15px}.answer-number{font-weight: 600;color: #4CAF50;min-width: 30px}.answer-problem{color: #666;font-size: 14px}.answer-result{font-weight: 700;color: #2e7d32;font-size: 18px}.text-section{margin-bottom: 25px}.text-section textarea{width: 100%;min-height: 250px;padding: 20px;border: 2px solid #e0e0e0;border-radius: 8px;font-size: 16px;line-height: 1.6;resize: vertical;font-family: 'Segoe UI',Tahoma,Geneva,Verdana,sans-serif}.text-section textarea:focus{outline: none;border-color: #667eea;box-shadow: 0 0 0 3px rgba(102,126,234,0.2)}.input-section textarea{width: 100%;min-height: 250px;padding: 20px;border: 2px solid #e0e0e0;border-radius: 8px;font-size: 16px;line-height: 1.6;resize: vertical;font-family: 'Segoe UI',Tahoma,Geneva,Verdana,sans-serif}.input-section textarea:focus{outline: none;border-color: #667eea;box-shadow: 0 0 0 3px rgba(102,126,234,0.2)}.stats-grid{display: grid;grid-template-columns: repeat(auto-fit,minmax(150px,1fr));gap: 15px;margin-bottom: 25px}.shape-selector{display: grid;grid-template-columns: repeat(auto-fill,minmax(130px,1fr));gap: 12px;margin-bottom: 25px}.shape-btn{display: flex;flex-direction: column;align-items: center;justify-content: center;padding: 20px 15px;border: 2px solid #e0e0e0;border-radius: 12px;background: #fff;cursor: pointer;transition: all 0.2s;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.05)}.shape-btn:hover{border-color: #667eea;background: rgba(102,126,234,0.05)}.shape-btn.active{border-color: #667eea;background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);color: white}.shape-btn .shape-icon{font-size: 32px;margin-bottom: 8px}.shape-btn .shape-name{font-size: 13px;font-weight: 500}.input-section{margin-bottom: 20px}.input-section label{display: block;font-weight: 600;margin-bottom: 8px;color: #999}.input-row{display: flex;gap: 10px;align-items: center;flex-wrap: wrap}.input-row input,.input-row select{padding: 12px 15px;border: 2px solid #e0e0e0;border-radius: 8px;font-size: 16px}.input-row input:focus,.input-row select:focus{outline: none;border-color: #667eea;box-shadow: 0 0 0 3px rgba(102,126,234,0.2)}.input-row input[type="number"]{flex: 1;min-width: 120px}.input-row .unit-label{color: #666;font-size: 14px}.formula-display{background: #f8f9fa;border: 1px solid #e0e0e0;border-radius: 8px;padding: 15px;margin-bottom: 20px;font-family: 'Courier New',monospace;font-size: 14px;color: #666}.formula-display strong{color: #667eea}.calc-section{background: #f8f9fa;border-radius: 8px;padding: 25px;margin-bottom: 20px;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.05)}.calc-section h3{margin-top: 0;margin-bottom: 20px;color: #333;font-size: 18px;border-bottom: 2px solid #667eea;padding-bottom: 10px}.input-grid{display: grid;grid-template-columns: repeat(auto-fit,minmax(220px,1fr));gap: 20px}.form-field{display: flex;flex-direction: column}.form-field label{font-weight: 600;margin-bottom: 8px;color: #333;font-size: 14px}.form-field label.white{color: #ccc}.form-field input,.form-field select{padding: 12px;border: 1px solid #ddd;border-radius: 4px;font-size: 15px}.form-field input:focus,.form-field select:focus{outline: none;border-color: #667eea;box-shadow: 0 0 0 2px rgba(102,126,234,0.2)}.result-section{background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);color: white;border-radius: 8px;padding: 30px;margin-top: 20px}.result-grid{display: grid;grid-template-columns: repeat(auto-fit,minmax(180px,1fr));gap: 25px}.result-item{text-align: center}.result-item h3,.result-item h4{font-size: 13px;font-weight: 400;margin-bottom: 8px;opacity: 0.9;text-transform: uppercase;letter-spacing: 0.5px}.result-item .value{font-size: 26px;font-weight: 700}.result-item .sub-value{font-size: 12px;opacity: 0.8;margin-top: 4px}.breakdown-section{background: white;border-radius: 8px;padding: 25px;margin-top: 20px;color: #333 !important;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.05)}.breakdown-item{display: flex;justify-content: space-between;padding: 12px 0;border-bottom: 1px solid #eee}.breakdown-item:last-child{border-bottom: none}.btn-primary-green{background: linear-gradient(135deg,#4CAF50 0%,#45a049 100%);color: white}.btn-primary-green:hover{transform: translateY(-2px);box-shadow: 0 4px 12px rgba(76,175,80,0.4)}.btn-primary-purple{background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);color: white}.btn-primary-purple:hover{transform: translateY(-2px);box-shadow: 0 4px 12px rgba(102,126,234,0.4)}.btn-secondary{background: #6c757d;color: white}.btn-secondary:hover{background: #5a6268}.btn-print{background: #2196F3;color: white}.btn-print:hover{background: #1976D2}.btn-info{background: #17a2b8;color: white}.btn-info:hover{background: #138496}.btn-clear{background: #dc3545;color: white}.btn-clear:hover{background: #c82333}.info-box-light{background: #e8f5e9;border-radius: 8px;padding: 20px;margin-top: 20px;color: #333}.info-box-light h2,.info-box-light h3{color: #2e7d32;margin-bottom: 15px}.info-box-light ul{margin-bottom: 0;padding-left: 20px}.info-box-light li{margin-bottom: 10px;color: #2e7d32;line-height: 1.6}.info-box-light p{color: #333;line-height: 1.6}.stats-table{background: #f8f9fa;border-radius: 8px;padding: 20px;margin-bottom: 25px}.stats-table h3{margin-top: 0;margin-bottom: 15px;color: #333}.stats-row{display: flex;justify-content: space-between;padding: 12px 0;border-bottom: 1px solid #e0e0e0}.stats-row:last-child{border-bottom: none}.stats-row .label{color: #666}.stats-row .value{font-weight: 600;color: #333}.rate-table{width: 100%;border-collapse: collapse;margin-top: 15px;font-size: 14px}.rate-table th,.rate-table td{padding: 12px;text-align: center;border: 1px solid #ddd}.rate-table th{background: #f5f5f5;font-weight: 600}.rate-table tr:hover{background: #f9f9f9}.rate-table .bank-type{text-align: left;font-weight: 500}.mode-tabs{display: flex;gap: 0;margin-bottom: 20px;border-radius: 8px;overflow: hidden;border: 2px solid #e0e0e0}.mode-tab{flex: 1;padding: 15px 20px;border: none;background: #fff;cursor: pointer;font-size: 16px;font-weight: 500;transition: all 0.2s;text-align: center;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.05)}.mode-tab:hover{background: rgba(102,126,234,0.05)}.mode-tab.active{background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);color: white}.mode-content{display: none}.mode-content.active{display: block}.preset-btn{padding: 10px 18px;border: 2px solid #e0e0e0;border-radius: 8px;background: #fff;cursor: pointer;transition: all 0.2s;font-size: 14px;font-weight: 500;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.05)}.preset-btn:hover{border-color: #667eea;background: rgba(102,126,234,0.05)}.preset-btn.active{border-color: #667eea;background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);color: white}.words-tags{display: flex;flex-wrap: wrap;gap: 8px;margin-top: 10px}.word-tag{display: inline-flex;align-items: center;gap: 5px;background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);color: white;padding: 6px 12px;border-radius: 20px;font-size: 14px}.word-tag .remove-tag{cursor: pointer;font-weight: bold;margin-left: 5px;opacity: 0.8}.word-tag .remove-tag:hover{opacity: 1}.char-analysis{background: #f8f9fa;border-radius: 8px;padding: 20px;margin-bottom: 25px;box-shadow: 0 2px 8px rgba(0,0,0,0.04)}.frequency-table{background: #f8f9fa;border-radius: 8px;padding: 20px;margin-bottom: 25px;box-shadow: 0 2px 8px rgba(0,0,0,0.04)}.stats-breakdown{display: grid;grid-template-columns: repeat(auto-fit,minmax(300px,1fr));gap: 20px;margin-bottom: 25px}.stats-breakdown .breakdown-card{background: #f8f9fa;border-radius: 8px;padding: 20px;box-shadow: 0 2px 8px rgba(0,0,0,0.04)}.converter-section{background: #f8f9fa;border: 1px solid #e0e0e0;border-radius: 12px;padding: 25px;margin-bottom: 25px;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.05)}.category-tab{flex: 1;min-width: 100px;padding: 12px 16px;border: none;background: #fff;cursor: pointer;font-size: 14px;font-weight: 500;transition: all 0.2s;text-align: center;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.05)}.category-tab:hover{background: rgba(102,126,234,0.05)}.category-tab.active{background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);color: white}.reading-stats{background: #e7f3ff;border: 1px solid #b6d4fe;border-radius: 8px;padding: 20px;margin-bottom: 25px;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.05)}.info-card{background: white;border: 1px solid #e0e0e0;border-radius: 12px;padding: 20px;margin-top: 25px;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.05)}.frequency-row{display: flex;align-items: center;padding: 12px;background: white;border-radius: 6px;margin-bottom: 8px;border: 1px solid #e0e0e0;box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.05)}.frequency-row:hover{border-color: #667eea}.char-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(80px,1fr));gap: 10px}.char-item{background: white;border: 1px solid #e0e0e0;border-radius: 6px;padding: 15px 10px;text-align: center;cursor: pointer;transition: all 0.2s}.char-item:hover{border-color: #667eea;box-shadow: 0 2px 8px rgba(102,126,234,0.2);transform: translateY(-2px)}.char-item .char{font-size: 28px;font-weight: 500}.reading-stats{background: #e7f3ff;border: 1px solid #b6d4fe;border-radius: 8px;padding: 20px;margin-top: 20px}.input-with-unit{display: flex;gap: 10px}.input-with-unit input{flex: 1}.input-with-unit select{width: 150px}span.ig-option-t{padding: 12px;background: #e9ecef;border: 1px solid #ddd;border-right: none;border-radius: 4px 0 0 4px;color: #333}.radio-group{display: flex;gap: 20px}.radio-group label{display: flex;align-items: center;gap: 8px;cursor: pointer;font-weight: normal}.words-input-section{margin-bottom: 25px}.words-input-section label{display: block;font-weight: 600;margin-bottom: 8px;color: #999}.words-input-container{display: flex;gap: 10px;flex-wrap: wrap}.words-input-container input{flex: 1;min-width: 200px;padding: 12px 15px;border: 2px solid #e0e0e0;border-radius: 8px;font-size: 16px}.words-input-container input:focus{outline: none;border-color: #667eea;box-shadow: 0 0 0 3px rgba(102,126,234,0.2)}.results-section{margin-top: 25px}.results-title{font-size: 18px;font-weight: 600;margin-bottom: 15px;color: #333}.random-tools{margin-top: 2rem;padding: 0;background: transparent}.random-tools-title{display: flex;align-items: center;gap: 0.75rem;font-size: 1.5rem;font-weight: 600;color: #1f2937;margin-bottom: 1.5rem;padding-bottom: 0.75rem;border-bottom: 2px solid #e5e7eb}.random-tools-title::before{content: '🔧';font-size: 1.5rem}.random-tools-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(200px,1fr));gap: 1rem}.random-tool-item{padding: 1rem 1.25rem;background: #ffffff;border-radius: 12px;text-align: center;border: 1px solid #e5e7eb;box-shadow: 0 2px 8px rgba(0,0,0,0.04);transition: all 0.3s ease}.random-tool-item:hover{border-color: #3b82f6;box-shadow: 0 4px 12px rgba(59,130,246,0.15);transform: translateY(-2px)}.random-tool-item a{color: #374151;text-decoration: none;font-size: 0.95rem;font-weight: 500;display: block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis}.random-tool-item a:hover{color: #3b82f6}@media (max-width: 768px){.random-tools-grid{grid-template-columns: repeat(2,1fr)}}.hero-section{text-align: center;padding: 3rem 1rem 2rem}.hero-content{max-width: 600px;margin: 0 auto}.hero-logo-link{display: inline-block;margin-bottom: 1.5rem}.hero-logo{width: 100px;height: 100px;padding: 10px;border-radius: 24px;box-shadow: 0 8px 32px rgba(59,130,246,0.2);transition: transform 0.3s ease,box-shadow 0.3s ease}.hero-logo:hover{transform: scale(1.05);box-shadow: 0 12px 40px rgba(59,130,246,0.3)}.hero-title{font-size: 2.5rem;font-weight: 700;color: #1f2937;margin-bottom: 2rem;letter-spacing: -0.02em}.hero-subtitle{font-size: 1.15rem;color: #6b7280;font-weight: 400}.intro-section{max-width: 800px;margin: 0 auto 2rem;padding: 0 1rem}.intro-text{text-align: center;color: #4b5563;line-height: 1.8;font-size: 1rem}.tools-section{max-width: 1200px;margin: 0 auto;padding: 0 1rem 2rem}.section-heading{display: flex;align-items: center;gap: 0.75rem;font-size: 1.5rem;font-weight: 600;color: #1f2937;margin-bottom: 1.5rem;padding-bottom: 0.75rem;border-bottom: 2px solid #e5e7eb}.heading-icon{font-size: 1.5rem}.tools-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(300px,1fr));gap: 1.25rem}.tool-card{display: flex;flex-direction: column;background: #ffffff;border-radius: 16px;padding: 1.5rem;text-decoration: none;border: 1px solid #e5e7eb;box-shadow: 0 2px 8px rgba(0,0,0,0.04);transition: all 0.3s ease;position: relative;overflow: hidden}.tool-card::before{content: '';position: absolute;top: 0;left: 0;right: 0;height: 3px;background: linear-gradient(90deg,#3b82f6,#8b5cf6);opacity: 0;transition: opacity 0.3s ease}.tool-card:hover{border-color: #3b82f6;box-shadow: 0 8px 24px rgba(59,130,246,0.12);transform: translateY(-4px)}.tool-card:hover::before{opacity: 1}.tool-card-header{display: flex;align-items: center;gap: 0.75rem;margin-bottom: 0.75rem}.tool-icon{font-size: 1.5rem;line-height: 1}.tool-card-title{font-size: 1.1rem;font-weight: 600;color: #1f2937;margin: 0;transition: color 0.3s ease}.tool-card:hover .tool-card-title{color: #3b82f6}.tool-card-desc{color: #6b7280;font-size: 0.9rem;line-height: 1.6;margin: 0 0 1rem;flex: 1;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden}.tool-card-footer{display: flex;align-items: center;justify-content: flex-end;padding-top: 0.75rem;border-top: 1px solid #f3f4f6}.tool-link-text{font-size: 0.85rem;font-weight: 500;color: #3b82f6;transition: transform 0.3s ease}.tool-card:hover .tool-link-text{transform: translateX(4px)}@media (max-width: 768px){.hero-section{padding: 2rem 1rem 1.5rem}.hero-logo{width: 80px;height: 80px}.hero-title{font-size: 2rem}.hero-subtitle{font-size: 1rem}.tools-grid{grid-template-columns: 1fr;gap: 1rem}.tool-card{padding: 1.25rem}}.tool-hero{text-align: center;padding: 2rem 1rem;margin-bottom: 1.5rem}.tool-hero-title{font-size: 2rem;font-weight: 700;color: #1f2937;margin-bottom: 1rem;letter-spacing: -0.02em}.tool-hero-subtitle{font-size: 1rem;color: #6b7280;line-height: 1.7;max-width: 800px;margin: 0 auto}.section-meta{font-size: 0.9rem;color: #6b7280}@media (max-width: 768px){.tool-hero{padding: 1.5rem 1rem}.tool-hero-title{font-size: 1.5rem}.tool-hero-subtitle{font-size: 0.9rem}}.section-title .icon{font-size: 24px}.input-group{margin-bottom: 15px}.input-group label{display: block;font-weight: 600;margin-bottom: 8px;color: #666;font-size: 14px}.input-group input,.input-group select{width: 100%;padding: 12px 15px;border: 2px solid #e0e0e0;border-radius: 8px;font-size: 16px;background: #fff}.input-group input:focus,.input-group select:focus{outline: none;border-color: #667eea;box-shadow: 0 0 0 3px rgba(102,126,234,0.2)}.input-with-unit{display: flex;gap: 10px}.input-with-unit input{flex: 1}.input-with-unit select{width: 150px}.unit-label{padding: 12px 15px;background: #e9ecef;border: 2px solid #e0e0e0;border-left: none;border-radius: 0 8px 8px 0;color: #666;font-size: 14px;white-space: nowrap;height: 48px;box-sizing: border-box;display: flex;align-items: center}.ig-option-t{padding: 12px;background: #e9ecef;border: 1px solid #ddd;border-right: none;border-radius: 4px 0 0 4px;color: #333}.results-section{margin-top: 25px}.results-card{background: linear-gradient(135deg,#e7f3ff 0%,#f0e6ff 100%);border: 1px solid #b6d4fe;border-radius: 12px;padding: 25px;margin-bottom: 20px}.results-card .card-title{font-size: 16px;font-weight: 600;color: #084298;margin-bottom: 15px}.results-card.purple{background: linear-gradient(135deg,#f3e5f5 0%,#e8eaf6 100%);border: 1px solid #d1c4e9}.results-card.purple .card-title{color: #4a148c}.results-main{display: flex;justify-content: space-between;align-items: center;padding: 20px;background: rgba(255,255,255,0.7);border-radius: 8px}.results-main .label{font-size: 16px;color: #666}.results-main .value{font-size: 36px;font-weight: 700;color: #667eea}.results-main .unit{font-size: 18px;color: #666;margin-left: 5px}.results-details{display: grid;grid-template-columns: repeat(auto-fit,minmax(200px,1fr));gap: 15px;margin-top: 15px}.detail-item{background: rgba(255,255,255,0.5);padding: 12px 15px;border-radius: 8px}.detail-item .detail-label{font-size: 12px;color: #666;margin-bottom: 5px}.detail-item .detail-value{font-size: 18px;font-weight: 600;color: #333}.results-row{display: flex;justify-content: space-between;align-items: center;padding: 12px 0;border-bottom: 1px solid rgba(0,0,0,0.1)}.results-row:last-child{border-bottom: none}.results-row .label{color: #666;font-size: 14px}.results-row .value{font-size: 24px;font-weight: 700;color: #667eea}.results-row .unit{font-size: 14px;color: #666;margin-left: 5px}.results-title{font-size: 18px;font-weight: 600;margin-bottom: 15px;color: #999}.results-table{width: 100%;border-collapse: collapse;background: #fff;border-radius: 8px;overflow: hidden;box-shadow: 0 2px 8px rgba(0,0,0,0.1)}.results-table th,.results-table td{padding: 15px;text-align: left;border-bottom: 1px solid #e0e0e0}.results-table th{background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);color: white;font-weight: 600}.results-table tr:hover{background: #f8f9fa}.results-table .word-cell{font-weight: 600;color: #667eea}.results-table .count-cell{font-size: 18px;font-weight: 700}.results-table .percentage-cell{color: #666}.no-results{text-align: center;padding: 40px;color: #666;font-style: italic}.total-count{background: #e7f3ff;border: 1px solid #b6d4fe;border-radius: 8px;padding: 15px;margin-bottom: 20px;display: flex;justify-content: space-between;align-items: center}.total-count .label{font-weight: 600;color: #084298}.total-count .value{font-size: 24px;font-weight: 700;color: #084298}.shape-diagram{text-align: center;margin-bottom: 20px;padding: 20px;background: #f8f9fa;border-radius: 8px}.shape-diagram svg{max-width: 200px;height: auto}.shape-diagram .dimension-label{font-size: 12px;fill: #667eea;font-weight: 600}.unit-toggle{display: flex;gap: 0;margin-bottom: 25px;border-radius: 8px;overflow: hidden;border: 2px solid #e0e0e0;width: fit-content}.unit-toggle button{padding: 12px 24px;border: none;background: #fff;cursor: pointer;font-size: 15px;font-weight: 500;transition: all 0.2s}.unit-toggle button:hover{background: rgba(102,126,234,0.05)}.unit-toggle button.active{background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);color: white}.radio-group{display: flex;gap: 20px}.radio-group label{display: flex;align-items: center;gap: 8px;cursor: pointer;font-weight: normal}.btn-calculate{background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);color: white;border: none;padding: 14px 32px;font-size: 16px;font-weight: 600;border-radius: 4px;cursor: pointer;transition: transform 0.2s,box-shadow 0.2s}.btn-calculate:hover{transform: translateY(-2px);box-shadow: 0 4px 12px rgba(102,126,234,0.4)}.btn-reset{background: #6c757d;color: white;border: none;padding: 14px 32px;font-size: 16px;font-weight: 600;border-radius: 4px;cursor: pointer;margin-left: 10px}.btn-reset:hover{background: #5a6268}.btn-toggle{background: #e9ecef;color: #333;border: none;padding: 10px 20px;font-size: 14px;font-weight: 600;border-radius: 4px;cursor: pointer;margin-top: 10px}.btn-toggle:hover{background: #dee2e6}.btn-primary{background: linear-gradient(135deg,#4CAF50 0%,#45a049 100%);color: white}.btn-primary:hover{transform: translateY(-2px);box-shadow: 0 4px 12px rgba(76,175,80,0.4)}.checkbox-item{display: flex;align-items: center;gap: 10px;cursor: pointer;height: 24px;line-height: 24px}.checkbox-item input[type="checkbox"]{width: 20px;height: 20px;cursor: pointer;margin: 0;padding: 0}.checkbox-item label{cursor: pointer;font-weight: normal;color: #333;line-height: 24px;margin: 0}.password-list{display: flex;flex-direction: column;gap: 15px}.password-item{background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius: 8px;padding: 20px;display: flex;flex-direction: column;gap: 10px;align-items: flex-start;transition: transform 0.2s}.password-item:hover{transform: translateX(5px)}.password-display{flex: 1;font-family: 'Courier New',monospace;font-size: 18px;font-weight: 600;color: white;letter-spacing: 1px;word-break: break-all}.password-actions{display: flex;gap: 10px;justify-content: flex-start}.password-actions button{background: rgba(255,255,255,0.2);border: none;color: white;padding: 8px 12px;border-radius: 4px;cursor: pointer;font-size: 14px;transition: background 0.2s}.password-actions button:hover{background: rgba(255,255,255,0.3)}.strength-indicator{display: flex;gap: 5px}.strength-bar{flex: 1;height: 4px;background: rgba(255,255,255,0.3);border-radius: 2px}.strength-bar.weak{background: #ff4444}.strength-bar.medium{background: #ffaa00}.strength-bar.strong{background: #00c853}.strength-bar.very-strong{background: #0066cc}.no-password{text-align: center;padding: 40px;color: #666;font-style: italic}.throw-ratio-presets{display: flex;gap: 8px;flex-wrap: wrap;margin-bottom: 15px}.category-tabs{display: flex;gap: 0;margin-bottom: 20px;border-radius: 8px;overflow: hidden;border: 2px solid #e0e0e0;flex-wrap: wrap}.category-tab{flex: 1;padding: 15px 20px;border: none;background: #fff;cursor: pointer;font-size: 16px;font-weight: 500;transition: all 0.2s;text-align: center}.category-tab:hover{background: rgba(102,126,234,0.05)}.category-tab.active{background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);color: white}.converter-row{display: grid;grid-template-columns: 1fr auto 1fr;gap: 15px;align-items: end;margin-bottom: 20px}.swap-btn-container{display: flex;align-items: center;justify-content: center;padding-bottom: 18px}@media (max-width: 768px){.converter-row{grid-template-columns: 1fr;gap: 10px}.swap-btn-container{display: flex;justify-content: center}}.swap-btn{width: 44px;height: 44px;border-radius: 50%;border: 2px solid #667eea;background: white;color: #667eea;cursor: pointer;font-size: 18px;transition: all 0.2s;display: flex;align-items: center;justify-content: center}.swap-btn:hover{background: #667eea;color: white}.quick-convert{display: flex;flex-wrap: wrap;gap: 8px;margin-top: 15px}.quick-btn{padding: 8px 14px;border: 1px solid #e0e0e0;border-radius: 20px;background: white;cursor: pointer;font-size: 13px;transition: all 0.2s}.quick-btn:hover{border-color: #667eea;background: rgba(102,126,234,0.05)}.results-display{background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius: 12px;padding: 25px;color: white;margin-top: 20px}.result-value{font-size: 28px;font-weight: 700;word-break: break-all}.result-unit{font-size: 16px;opacity: 0.9}.conversion-formula{margin-top: 15px;padding-top: 15px;border-top: 1px solid rgba(255,255,255,0.2);font-size: 14px;opacity: 0.9}.reading-stats h3{margin-top: 0;color: #084298}.reading-grid{display: grid;grid-template-columns: repeat(auto-fit,minmax(200px,1fr));gap: 15px}.reading-item{display: flex;align-items: center;gap: 10px}.reading-item .icon{font-size: 24px}.reading-item .info .title{font-size: 12px;color: #666;text-transform: uppercase}.reading-item .info .data{font-size: 18px;font-weight: 600;color: #084298}.word-frequency{margin-top: 20px}.frequency-item{display: flex;justify-content: space-between;align-items: center;padding: 8px 0px;background: #f8f9fa;margin-bottom: 5px;border-bottom: solid 1px #e0e0e0}.frequency-item .word{font-weight: 500;color: #666}.frequency-item .count{background: #667eea;color: white;padding: 2px 10px;border-radius: 12px;font-size: 12px}.words-input-section{margin-bottom: 25px}.words-input-section label{display: block;font-weight: 600;margin-bottom: 8px;color: #999}.words-input-container{display: flex;gap: 10px;flex-wrap: wrap}.words-input-container input{flex: 1;min-width: 200px;padding: 12px 15px;border: 2px solid #e0e0e0;border-radius: 8px;font-size: 16px}.words-input-container input:focus{outline: none;border-color: #667eea;box-shadow: 0 0 0 3px rgba(102,126,234,0.2)}.bar-chart{margin-top: 10px;height: 8px;background: #e0e0e0;border-radius: 4px;overflow: hidden}.bar-chart .bar{height: 100%;background: linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius: 4px;transition: width 0.3s ease}.char-item .char{font-size: 28px;font-weight: 500;color: #333;margin-bottom: 5px}.char-item .count{font-size: 11px;color: #666}.char-item .pinyin{font-size: 11px;color: #667eea;margin-top: 2px}.frequency-row .rank{width: 30px;font-weight: 600;color: #667eea}.frequency-row .char-display{width: 50px;text-align: center}.frequency-row .char-display .hanzi{font-size: 28px}.frequency-row .char-info{flex: 1;padding-left: 15px}.frequency-row .char-info .pinyin{font-size: 16px;color: #667eea;font-weight: 500}.frequency-row .char-info .meaning{font-size: 13px;color: #666;margin-top: 2px}.frequency-row .char-count{background: #667eea;color: white;padding: 4px 12px;border-radius: 12px;font-size: 12px;font-weight: 600}.type-legend{display: flex;gap: 20px;margin-bottom: 20px;flex-wrap: wrap}.legend-item{display: flex;align-items: center;gap: 8px}.legend-color{width: 16px;height: 16px;border-radius: 4px}.breakdown-row{display: flex;justify-content: space-between;padding: 10px 0;border-bottom: 1px solid #e0e0e0}.breakdown-row:last-child{border-bottom: none}.breakdown-row .label{color: #666}.breakdown-row .value{font-weight: 600;color: #333}.no-data{text-align: center;padding: 40px;color: #666}.bmi-value{font-size: 56px;font-weight: 700;margin-bottom: 10px}.bmi-category{font-size: 20px;font-weight: 500;opacity: 0.95}.bmi-range{font-size: 14px;opacity: 0.8;margin-top: 8px}.bmi-bar{height: 12px;background: rgba(255,255,255,0.2);border-radius: 6px;margin: 25px 0;position: relative;overflow: hidden}.bmi-bar-fill{height: 100%;border-radius: 6px;transition: width 0.5s ease}.bmi-scale{display: flex;justify-content: space-between;margin-top: 10px;font-size: 12px;opacity: 0.8}.bmi-scale-item{text-align: center}.amortization-table{max-height: 400px;overflow-y: auto;margin-top: 20px;background-color: #fff}.amortization-table table{width: 100%;border-collapse: collapse;font-size: 13px}.amortization-table thead{color: #333 !important}.amortization-table th,.amortization-table td{padding: 10px;text-align: right;border-bottom: 1px solid #eee}.amortization-table th{background: #f5f5f5;font-weight: 600;position: sticky;top: 0}.amortization-table th:first-child,.amortization-table td:first-child{text-align: center}.section-divider{border: none;border-top: 1px solid #ddd;margin: 25px 0}.collapsible{cursor: pointer;padding: 15px;background: #f8f9fa;border-radius: 4px;margin-top: 20px;display: flex;justify-content: space-between;align-items: center;color: #333}.collapsible:hover{background: #e9ecef}.collapsible-content{display: none;padding: 15px 0}.collapsible-content.active{display: block}.print-only{display: none}@media print{body,html{margin: 0 !important;padding: 0 !important;height: auto !important}body.print-mode .container,body.print-mode footer{display: none !important}.top-nav{display: block !important;border: none;box-shadow: none;background: #fff !important;padding: 5px 10px !important;margin: 0 0 10px 0 !important}.top-nav .container{padding: 0 !important;margin: 0 !important}.top-nav a div{font-size: 0}.top-nav a div::after{content: "ToolkitBook.com";font-size: 16px;color: #333}.results-container{display: block !important;padding: 0 10px !important;margin: 0 !important}.results-header{display: block !important;margin-bottom: 10px}.results-header h2{font-size: 16px;color: #333}.results-box{border: none;box-shadow: none;border-radius: 0;margin: 0;padding: 0}.results-box.print-active{display: block !important}.results-box:not(.print-active){display: none !important}.results-box-header{display: none !important}.problems-list li,.answers-list li{padding: 8px 10px}}