:root{--primary-green:#E8F5E9;--secondary-green:#C8E6C9;--accent-green:#81C784;--dark-text:#2E4C3C;--light-text:#4A7662;--card-bg:#FFFFFF;--shadow:rgba(46, 76, 60, 0.1);--blue-accent:#4A90E2;--orange-accent:#FF9800;--purple-accent:#9C27B0}*{box-sizing:border-box;margin:0;padding:0}body{font-family:'PingFang SC','Microsoft YaHei',sans-serif;line-height:1.6;color:var(--dark-text);background-color:var(--primary-green);background-image:radial-gradient(var(--accent-green) 1px,transparent 1px);background-size:20px 20px;padding:15px}.container{max-width:1200px;margin:0 auto;padding:0 10px}header{text-align:center;padding:20px 15px;margin-bottom:20px;background-color:var(--card-bg);border-radius:16px;box-shadow:0 4px 12px var(--shadow);position:relative;overflow:hidden}header::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--accent-green),var(--secondary-green))}h1{color:var(--dark-text);font-size:1.8rem;margin-bottom:10px}.subtitle{color:var(--light-text);font-size:1rem;max-width:100%;margin:0 auto}.table-container{background-color:var(--card-bg);padding:20px;border-radius:16px;box-shadow:0 4px 12px var(--shadow);margin-bottom:20px;width:100%}.table-header{display:flex;justify-content:center;margin-bottom:15px}.table-caption{font-weight:700;font-size:1.2em;color:var(--dark-text);text-align:center;border-bottom:2px solid var(--accent-green);padding-bottom:10px;width:100%}.table-scroll-container{overflow-x:auto}table{width:100%;border-collapse:collapse;margin-bottom:20px;font-family:Arial,sans-serif;min-width:700px}td,th{padding:12px 15px;text-align:center;border:1px solid var(--primary-green);white-space:nowrap}.alphabet-table th{background-color:var(--accent-green);color:#fff}.alphabet-table td:first-child,.alphabet-table td:nth-child(4),.alphabet-table td:nth-child(7){background-color:var(--secondary-green)}.alphabet-table td:nth-child(2),.alphabet-table td:nth-child(3),.alphabet-table td:nth-child(5),.alphabet-table td:nth-child(6),.alphabet-table td:nth-child(8),.alphabet-table td:nth-child(9){background-color:var(--secondary-green)}.vowel-table th{background-color:var(--orange-accent);color:#fff}.vowel-table th:first-child,.vowel-table th:nth-child(2),.vowel-table th:nth-child(3){background-color:#e67e22}.vowel-table th:nth-child(4),.vowel-table th:nth-child(5),.vowel-table th:nth-child(6){background-color:#d35400}.vowel-table th:nth-child(7),.vowel-table th:nth-child(8),.vowel-table th:nth-child(9){background-color:#e74c3c}.vowel-table th:nth-child(10),.vowel-table th:nth-child(11),.vowel-table th:nth-child(12){background-color:#9b59b6}.vowel-table td{background-color:var(--secondary-green)}.consonant-table th{background-color:var(--purple-accent);color:#fff}.consonant-table th:first-child,.consonant-table th:nth-child(2),.consonant-table th:nth-child(3){background-color:#8e44ad}.consonant-table th:nth-child(4),.consonant-table th:nth-child(5),.consonant-table th:nth-child(6){background-color:#2980b9}.consonant-table th:nth-child(7),.consonant-table th:nth-child(8),.consonant-table th:nth-child(9){background-color:#27ae60}.consonant-table th:nth-child(10),.consonant-table th:nth-child(11),.consonant-table th:nth-child(12){background-color:#f39c12}.consonant-table td{background-color:var(--secondary-green)}tr:hover td{opacity:.9;background-color:var(--secondary-green)}.mouth-diagram{text-align:center;margin:20px 0}.mouth-diagram img{max-width:100%;height:auto;border-radius:8px;box-shadow:0 2px 8px var(--shadow)}@media (max-width:768px){body{padding:10px}header{padding:15px 10px}h1{font-size:1.5rem}.table-container{padding:15px 10px}.table-caption{font-size:1.1rem}td,th{padding:8px 10px;font-size:.9rem}table{min-width:700px}}@media (max-width:480px){h1{font-size:1.3rem}.table-caption{font-size:1rem}td,th{padding:6px 8px;font-size:.85rem}table{min-width:600px}}footer{text-align:center;padding:15px;color:var(--light-text);font-size:.8rem;margin-top:20px}