*{padding:0%;margin:0%;box-sizing:border-box}body{font-family:Helvetica Neue,sans-serif;background:linear-gradient(135deg,#2c3e50,#4e555b,#95a5a6,#bdc3c7);background-size:400% 400%;animation:gradientBackground 25s ease infinite;margin:0;height:100vh;display:flex;justify-content:center;align-items:center}@keyframes gradientBackground{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.container{background-color:#fffffff2;padding:30px;border-radius:12px;box-shadow:0 10px 30px #0003;max-width:440px;width:100%;animation:fadeIn 1s ease}input[type=text]{width:100%;padding:10px;margin:8px 0 15px;border:2px solid #ccc;border-radius:6px;box-sizing:border-box;font-size:14px;transition:all .3s ease}input[type=text]:focus{border-color:#4e555b;outline:none;box-shadow:0 0 8px #4e555b4d}#result{margin-top:20px;font-size:16px;text-align:center;color:#333;background-color:#ecf0f1;padding:15px;border-radius:6px;box-shadow:inset 0 1px 3px #0000001a}@media (max-width: 768px){h1{font-size:22px}button{font-size:15px;padding:10px}#result{font-size:15px}.logo{width:250px}}@media (max-width: 480px){.container{padding:20px;box-shadow:0 8px 25px #00000026}h1{font-size:20px}label{font-size:13px}input[type=text]{padding:8px;font-size:13px}button{font-size:14px;padding:8px}#result{font-size:14px;padding:12px}.logo{width:250px}}@media (max-width: 360px){h1{font-size:18px}label{font-size:12px}button,#result{font-size:13px}}*{padding:0;margin:0;box-sizing:border-box}.container{background-color:#fffffff2;padding:20px;border-radius:12px;box-shadow:0 10px 30px #0003;max-width:440px;width:100%}h1{text-align:center;color:#333;margin-bottom:20px;font-size:24px}.ltps-class{display:flex;flex-direction:column}.ltps-class .form-label{text-align:center}.ltps-main{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:10px;margin:0 0 15px}label{margin-top:15px;font-weight:700;display:block;color:#333;font-size:14px}input[type=number]{width:100%;padding:10px;margin:8px 0 15px;border:2px solid #ccc;border-radius:6px;box-sizing:border-box;font-size:14px;transition:all .3s ease}input[type=number]:focus{border-color:#4e555b;outline:none;box-shadow:0 0 8px #4e555b4d}button{width:100%;padding:12px;background-color:#4e555b;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:16px;transition:background-color .3s ease}button:hover{background-color:#2c3e50}#result{font-family:Helvetica Neue,sans-serif;margin-top:20px;font-size:16px;text-align:center;color:#333;background-color:#ecf0f1;padding:15px;border-radius:6px;box-shadow:inset 0 1px 3px #0000001a}#result span.percentage{font-weight:700;color:#2c3e50;font-size:1.1em;padding:2px 4px;border-radius:4px}#result .important-info{font-weight:700;color:#4e555b;font-size:1.13em}#result .class-count{font-weight:bolder;color:#263c6d;font-size:1em}.logo-container{text-align:center}.logo{width:400px}.error-message{color:red;font-size:larger;margin-top:5px;text-align:center}.copyright{text-align:center;font-size:12px;color:#333;margin-top:10px}@media (max-width: 768px){h1{font-size:22px}button{font-size:15px;padding:10px}#result{font-size:15px}.logo{width:250px}.ltps-main{flex-direction:column;gap:15px}input[type=number]{width:100%}}@media (max-width: 480px){.container{padding:20px;width:fit-content;box-shadow:0 8px 25px #00000026}h1{font-size:20px}label{font-size:13px}input[type=number]{padding:8px;font-size:13px}button{font-size:14px;padding:8px}.ltps-main{flex-direction:column;gap:15px}.ltps-class{display:flex;flex-direction:row;justify-content:space-between;width:100%;gap:10px}.form-label{flex-grow:1;margin-right:10px}.form-input{flex-grow:1;width:100%}input[type=number]{width:50vw}#result{font-size:14px;padding:12px}.logo{width:200px}}@media (max-width: 360px){h1{font-size:18px}label{font-size:12px}input[type=number]{padding:5px;font-size:12px;height:fit-content}button{font-size:13px;padding:7px}.ltps-main{flex-direction:column;gap:10px}.ltps-class{flex-direction:row;justify-content:space-between;flex-grow:1}input[type=number]{width:50vw}#result{font-size:12px;padding:10px}}.home-container{background-color:#fffffff2;padding:30px 30px 10px;border-radius:12px;box-shadow:0 10px 30px #0003;max-width:500px;width:100%;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;margin:auto;animation:fadeIn 1s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.home-logo-container{margin-bottom:40px;cursor:pointer}.logo{width:400px;transition:transform .3s ease;cursor:pointer}.logo:hover{transform:scale(1.05)}.home-buttons{display:flex;justify-content:space-between;width:100%;gap:50px;max-width:400px}.home-buttons button{width:60%;padding:15px;background-color:#4e555b;color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;box-shadow:0 4px 12px #0000001a;transition:all .3s ease}.home-buttons button:hover{background-color:#2c3e50;transform:translateY(-3px);box-shadow:0 6px 18px #0003}.home-buttons button:active{transform:translateY(0);box-shadow:0 4px 12px #0000001a}@media (max-width: 768px){.home-container{padding:20px}.logo{width:300px}.home-buttons{gap:30px}.home-buttons button{width:70%;padding:12px;font-size:14px}}@media (max-width: 480px){.home-container{padding:20px;box-shadow:0 8px 25px #00000026}.logo{width:250px}.home-buttons{flex-direction:column;gap:20px;max-width:300px}.home-buttons button{width:100%;padding:10px;font-size:13px}}@media (max-width: 360px){.home-container{padding:10px}.logo{width:200px}.home-buttons button{padding:8px;font-size:12px}}