.page{gap:20px;padding:20px;display:flex}.main{flex:3}.sidebar{background:#f5f5f5;border-radius:10px;flex:1;height:fit-content;padding:15px}.card{background:#fff;border-radius:12px;padding:25px;box-shadow:0 4px 15px #00000014}.input-group{margin-bottom:15px}input{border:1px solid #ccc;border-radius:8px;width:100%;padding:10px}.result-box{text-align:center;background:#f0f8ff;border-radius:10px;margin-top:20px;padding:20px}.extra{margin-top:10px;font-size:14px}.content{margin-top:30px;line-height:1.6}@media (width<=768px){.page{flex-direction:column;padding:10px}.main{width:100%}.sidebar{width:100%;margin-top:20px}.card{padding:15px}h1{text-align:center;font-size:22px}input{font-size:16px}.result-box h2{font-size:20px}}@media (width<=480px){h1{font-size:20px}.card{padding:12px}input{padding:8px}}body{margin:0;font-family:Arial}.nav{color:#fff;background:#111;padding:15px}.nav a{color:#fff;margin:10px}.container{padding:20px}.footer{text-align:center;background:#eee;padding:20px}.ad{text-align:center;background:#ddd;margin:10px;padding:20px}